/* ==========================================================================
   XSEN — giriş ekranı ZEMİNİ  (04.10.2026)

   Bu dosya zemini ve dekoratif motifi çizer; kontroller oturumdaki temanın
   standart görünümündedir (Kural #-1001; zemin kullanıcı onaylı istisna).
   Kullanıcı isteğiyle ekler (04.10.2026): kart köşesi (tema parametresi bu
   kapsamda yeniden verilir), metin alanları ve kart düğmelerinin yüksekliği/köşesi
   (aşağıda — renk/kenar/durum rengi yine temadan).
   Renklerin TAMAMI tema parametresi (--sap*): giriş ekranı, uygulama hangi
   temadaysa o temanın renginde açılır. Sabit renk yazılmaz.

   Motif kökün altında, içeriğin ARKASINDA: kök yeni bir yığın bağlamı kurar
   (isolation), motif z-index:-1 ile kökün zemini ile içerik arasında kalır →
   içerik öğelerine konum/z-index vermek gerekmez.
   ========================================================================== */

/* Zemin rengi: altındaki xsen.m.App'in tema zemini (sapBackgroundColor) görünür — burada
   renk YAZILMAZ (FlexBox'ın tema sınıfı zaten şeffaf zemin verir). */
.xs-login {
  position: relative;
  isolation: isolate;
  overflow: auto;
  /* Form kartının köşesi (kullanıcı isteği 04.10.2026): f:Card köşesini bu tema parametresinden
     alır (fiori_3 0.25rem, horizon 1rem). Kartın iç sınıfları ezilmez; yalnız parametre bu
     ekranın kapsamında yeniden verilir. */
  --sapTile_BorderCornerRadius: 0.75rem;
}

/* ── Metin alanları: yükseklik + köşe (kullanıcı isteği 04.10.2026) ──────────
   18.09 tasarımındaki gibi 44px yükseklik ve 10px köşe. Uygulama sıkışık (compact)
   yoğunlukta çalışır ve alan yüksekliği temada SABİT değerdir (parametre değil) →
   ölçü burada verilir. YALNIZ ölçü/köşe: zemin, kenar rengi, odak ve hata durumu
   renkleri temadan gelmeye devam eder. Seçicideki `.xsenMFlexBox`, tema CSS'inin
   `.xsenUiSizeCompact …` kurallarını (bu dosyadan SONRA yüklenir) yenmek içindir. */
.xs-login.xsenMFlexBox .xsenMInputBase:not(.xsenMTextArea),
.xs-login.xsenMFlexBox .xsenMInputBase:not(.xsenMTextArea) .xsenMInputBaseContentWrapper {
  height: 2.75rem;
}
.xs-login.xsenMFlexBox .xsenMInputBase .xsenMInputBaseContentWrapper {
  border-radius: 0.625rem;
  overflow: hidden;                      /* alan içi ikonun hover zemini köşeden taşmasın */
}
.xs-login.xsenMFlexBox .xsenMInputBase .xsenMInputBaseInner {
  height: 100%;
  padding: 0 0.875rem;
}
.xs-login.xsenMFlexBox .xsenMInputBase .xsenMInputBaseIconContainer,
.xs-login.xsenMFlexBox .xsenMInputBase .xsenMInputBaseIcon {
  height: 100%;
}
/* tema: `.xsenUiSizeCompact .xsenMInputBaseIconContainer .xsenUiIcon.xsenMInputBaseIcon` (4 sınıf) */
.xs-login.xsenMFlexBox .xsenMInputBase .xsenMInputBaseIconContainer .xsenUiIcon.xsenMInputBaseIcon {
  width: 2.75rem;
  line-height: calc(2.75rem - 2px);      /* kenar çizgileri hariç iç yükseklik: ikon dikey ortada */
}

/* Kart düğmeleri (Oturum aç, Doğrula, Çalışmaya başla…) — metin alanlarıyla aynı ölçü.
   Düğme yüksekliği ve köşesi temada PARAMETRE (--sapElement_Compact_Height,
   --sapButton_BorderCornerRadius) → parametre yalnız kart düğmelerinin kapsamında yeniden
   verilir; dış kutu yüksekliği ve metin satır yüksekliği temada sabit olduğu için ayrıca. */
.xs-login.xsenMFlexBox .xsenFCard .xsenMBtn {
  --sapElement_Compact_Height: 2.75rem;
  --sapElement_Height: 2.75rem;
  --sapButton_BorderCornerRadius: 0.625rem;
  height: auto;
}
.xs-login.xsenMFlexBox .xsenFCard .xsenMBtn .xsenMBtnContent {
  line-height: calc(2.75rem - 2px);
}

/* Arama alanı (çalışma alanı seçimi) — metin alanlarıyla aynı ölçü */
.xs-login.xsenMFlexBox .xsenMSF,
.xs-login.xsenMFlexBox .xsenMSF .xsenMSFF {
  height: 2.75rem;
}
.xs-login.xsenMFlexBox .xsenMSF .xsenMSFF {
  border-radius: 0.625rem;
  overflow: hidden;
}
.xs-login.xsenMFlexBox .xsenMSF .xsenMSFI {
  height: 100%;
  padding-left: 0.375rem;               /* + formun kendi 0.5rem'i = metin alanlarıyla aynı hiza */
}
.xs-login.xsenMFlexBox .xsenMSF .xsenMSFB {
  height: 100%;
  width: 2.75rem;
  line-height: calc(2.75rem - 2px);
}

/* ── Zemin motifi: veri akışı ─────────────────────────────────────────────── */
.xs-login .xs-motif {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 46vh; min-height: 280px; max-height: 440px;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  color: var(--sapBrandColor);
  -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,1) 34%, rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(to top, rgba(0,0,0,1) 34%, rgba(0,0,0,0) 100%);
}
.xs-login .xs-motif__svg { width: 100%; height: 100%; display: block; }

/* Arka ışık (aurora) — yavaş sürüklenir */
.xs-login .xs-aur-a0 { stop-color: var(--sapBrandColor); stop-opacity: 0.16; }
.xs-login .xs-aur-a1 { stop-color: var(--sapBrandColor); stop-opacity: 0; }
.xs-login .xs-aur-b0 { stop-color: var(--sapAccentColor1); stop-opacity: 0.12; }
.xs-login .xs-aur-b1 { stop-color: var(--sapAccentColor1); stop-opacity: 0; }
.xs-login .xs-motif__blob {
  transform-box: fill-box; transform-origin: center;
  animation: xs-motif-drift 22s ease-in-out infinite alternate;
}
.xs-login .xs-motif__blob--b { animation-duration: 29s; animation-delay: -8s; }
@keyframes xs-motif-drift {
  from { transform: translate(-18px, 10px) scale(0.94); }
  to   { transform: translate(26px, -16px) scale(1.12); }
}

/* Hatlar — sabit altlık */
.xs-login .xs-motif__lane {
  fill: none; stroke: currentColor; stroke-width: 1.3; opacity: 0.24;
}

/* Işık paketleri — hat boyunca ilerler (pathLength=1000 normalize) */
.xs-login .xs-motif__pulse {
  fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round;
  stroke-dasharray: 52 948; opacity: 0.62;
  animation: xs-motif-flow 9s linear infinite;
}
@keyframes xs-motif-flow {
  from { stroke-dashoffset: 1000; }
  to   { stroke-dashoffset: 0; }
}
.xs-login .xs-motif__pulse--1 { animation-duration: 8.5s;  animation-delay: -0.4s; }
.xs-login .xs-motif__pulse--2 { animation-duration: 10.5s; animation-delay: -3.2s; }
.xs-login .xs-motif__pulse--3 { animation-duration: 7.4s;  animation-delay: -5.9s; }
.xs-login .xs-motif__pulse--4 { animation-duration: 11.8s; animation-delay: -1.7s; }
.xs-login .xs-motif__pulse--5 { animation-duration: 9.2s;  animation-delay: -7.1s; }
.xs-login .xs-motif__pulse--6 { animation-duration: 12.6s; animation-delay: -4.5s; }
/* Çekirdekten çıkan konsolide akış — vurgu rengi */
.xs-login .xs-motif__pulse--out { color: var(--sapAccentColor1); opacity: 0.52; stroke-width: 2.2; }
.xs-login .xs-motif__pulse--7 { animation-duration: 6.8s; animation-delay: -2.4s; }
.xs-login .xs-motif__pulse--8 { animation-duration: 8.1s; animation-delay: -6.2s; }

/* Duraklar — paket geçerken parlar */
.xs-login .xs-motif__stn {
  fill: currentColor; opacity: 0.24;
  animation: xs-motif-blink 9s ease-in-out infinite;
}
@keyframes xs-motif-blink {
  0%, 82%, 100% { opacity: 0.22; }
  88%           { opacity: 0.6; }
}
.xs-login .xs-motif__stn--1 { animation-duration: 8.5s;  animation-delay: -0.4s; }
.xs-login .xs-motif__stn--2 { animation-duration: 10.5s; animation-delay: -3.2s; }
.xs-login .xs-motif__stn--3 { animation-duration: 7.4s;  animation-delay: -5.9s; }
.xs-login .xs-motif__stn--4 { animation-duration: 11.8s; animation-delay: -1.7s; }
.xs-login .xs-motif__stn--5 { animation-duration: 9.2s;  animation-delay: -7.1s; }
.xs-login .xs-motif__stn--6 { animation-duration: 12.6s; animation-delay: -4.5s; }

/* Çekirdek — akışların buluştuğu tek nokta */
.xs-login .xs-motif__ring {
  fill: none; stroke: currentColor; stroke-width: 1.4;
  transform-box: fill-box; transform-origin: center;
  animation: xs-motif-ring 5.4s ease-out infinite;
}
.xs-login .xs-motif__ring--2 { animation-delay: -1.8s; }
.xs-login .xs-motif__ring--3 { animation-delay: -3.6s; }
@keyframes xs-motif-ring {
  0%   { transform: scale(0.4); opacity: 0.45; }
  70%  { opacity: 0.06; }
  100% { transform: scale(1.9); opacity: 0; }
}
.xs-login .xs-motif__core {
  fill: var(--sapAccentColor1); opacity: 0.55;
  transform-box: fill-box; transform-origin: center;
  animation: xs-motif-core 5.4s ease-in-out infinite;
}
@keyframes xs-motif-core {
  0%, 100% { transform: scale(1);    opacity: 0.45; }
  50%      { transform: scale(1.25); opacity: 0.68; }
}

/* Kayıt satırları — çekirdekten sonra sırayla işlenir */
.xs-login .xs-motif__row {
  fill: currentColor; opacity: 0.26;
  transform-box: fill-box; transform-origin: left center;
  animation: xs-motif-post 6.6s cubic-bezier(0.22, 0.61, 0.36, 1) infinite;
}
@keyframes xs-motif-post {
  0%        { transform: scaleX(0);    opacity: 0; }
  14%       { transform: scaleX(1);    opacity: 0.34; }
  70%       { transform: scaleX(1);    opacity: 0.20; }
  100%      { transform: scaleX(1);    opacity: 0.08; }
}
.xs-login .xs-motif__row--1 { animation-delay: -0.0s; }
.xs-login .xs-motif__row--2 { animation-delay: -0.9s; }
.xs-login .xs-motif__row--3 { animation-delay: -1.8s; }
.xs-login .xs-motif__row--4 { animation-delay: -2.7s; }
.xs-login .xs-motif__row--5 { animation-delay: -3.6s; }
.xs-login .xs-motif__row--6 { animation-delay: -4.5s; }

@media (max-width: 479px) {
  .xs-login .xs-motif { height: 30vh; min-height: 180px; }
}

@media (prefers-reduced-motion: reduce) {
  .xs-login .xs-motif * { animation: none !important; }
}