/* ------------------------------------------------------------------ *
 *  Giriş / kayıt / şifre yenileme ekranları — dp/admin tasarım sistemi
 *  üzerine ince bir katman.
 *
 *  Framework YOK (Bootstrap kurulmadı). Bu dosya YALNIZCA bu ekranlara
 *  özgü iki sütunlu kabuğu tanımlar; form/buton/uyarı/onay-kutusu gibi
 *  tüm bileşenler admin.css'ten gelir (.form-control, .btn, .alert-*,
 *  .form-check ...) — bkz. BILESENLER.md > "Giriş ekranları (F2)".
 *  Bu sayfalar admin.css'i auth.css'ten ÖNCE yükler; token'lar
 *  (--renk-*, --radius-*, --golge-*, --bosluk-*) oradan devralınır.
 * ------------------------------------------------------------------ */

.auth-page{
  min-height:100vh; min-height:100svh;
  display:flex; align-items:center; justify-content:center;
  padding:clamp(14px,3vw,32px);
  background:var(--renk-bg);
}

.auth-theme-toggle{
  position:fixed; top:calc(14px + var(--safe-t)); right:14px; z-index:20;
  background:var(--renk-surface); box-shadow:var(--golge-sm);
}

.auth-shell{
  width:100%; max-width:980px;
  background:var(--renk-surface); border:1px solid var(--renk-border);
  border-radius:var(--radius-xl); overflow:hidden;
  box-shadow:var(--golge-lg);
  display:flex; align-items:stretch;
}

/* ---- Sol: marka / değer önerisi paneli (opsiyonel, mobilde gizli) ----
   Gradyan MAVİ→KOYU MAVİ (YAZ-190). Eskiden mavi→mor (--renk-violet) idi;
   mor panelin marka rengi değil, kategorik bir vurgu (bkz. BILESENLER.md)
   ve giriş ekranını panelin genel mavisinden koparıyordu.
   --renk-primary-buton çifti kullanılır, --renk-primary DEĞİL: bu panelin
   üstüne BEYAZ metin biner ve koyu temada --renk-primary açık mavidir
   (#60a5fa), beyazla AA'yı (4.5:1) tutturamaz. -buton çifti her iki temada
   da beyaz metinle AA üstüdür. */
.auth-side{
  flex:0 0 42%; min-width:0; position:relative; overflow:hidden;
  color:#fff; padding:var(--bosluk-7) var(--bosluk-6);
  background:linear-gradient(150deg,var(--renk-primary-buton) 0%,var(--renk-primary-buton-d) 100%);
  display:flex; flex-direction:column; justify-content:center;
}
.auth-side:before,.auth-side:after{
  content:""; position:absolute; border-radius:50%;
  background:rgba(255,255,255,.12); pointer-events:none;
}
.auth-side:before{width:280px;height:280px;top:-110px;right:-90px}
.auth-side:after{width:200px;height:200px;bottom:-80px;left:-70px}
.auth-side>*{position:relative;z-index:1}

.auth-mark{
  width:56px;height:56px;border-radius:var(--radius-lg);margin-bottom:var(--bosluk-5);
  background:rgba(255,255,255,.18);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
}
.auth-side h1{font-size:26px;font-weight:800;letter-spacing:-.4px;margin:0 0 10px;color:#fff}
.auth-lead{font-size:14.5px;opacity:.92;margin:0 0 var(--bosluk-6);line-height:1.6}

.auth-feat{list-style:none;margin:0;padding:0;display:grid;gap:var(--bosluk-4)}
.auth-feat li{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.45}
.auth-feat .ic{
  flex:0 0 auto;width:32px;height:32px;border-radius:var(--radius-sm);
  background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;
}
.auth-feat b{display:block;font-weight:650}
/* opacity .85 idi: 12.5px beyaz metin gradyanın açık ucunda 4.38:1'de
   kalıp AA'yı (4.5:1) kaçırıyordu; .90 ölçülen 4.70:1 verir ve satır
   hâlâ başlıktan görsel olarak geride durur (YAZ-190). */
.auth-feat span span{opacity:.9;font-size:12.5px}

/* ---- Sağ: form paneli ---- */
.auth-form{
  flex:1; min-width:0; padding:clamp(28px,4vw,48px) clamp(26px,4vw,46px);
  display:flex; flex-direction:column; justify-content:center;
}
.auth-form h2{margin:0 0 4px}
.auth-sub{color:var(--renk-muted);font-size:13.5px;margin:0 0 var(--bosluk-5)}
.auth-sub strong{color:var(--renk-text)}
.auth-sub:last-child{margin-bottom:0}

/* Şifre alanı: form-control'un sağına göster/gizle ikon düğmesi biner. */
.auth-field{position:relative}
.auth-field .form-control{padding-right:46px}
.auth-field .btn-icon{position:absolute;right:3px;top:3px}

/* "Beni hatırla" satırı: admin.css'in .form-check'ine (YAZ-138/10) özgü
   boşluk — üstte/altta alan bilinen bosluk-* ölçeğine uymuyor, bu yüzden
   burada, sadece bu ekranlarda kullanılan tek-kerelik sınıf olarak tutulur. */
.auth-form .form-check.auth-check{margin:16px 0 20px}

/* login.php'de "Şifremi unuttum" linki .auth-links'in varsayılan üst
   boşluğundan (--bosluk-5, 24px) daha dar — admin.css'in genel .mt
   yardımcısıyla (14px) aynı değer, ama .auth-links (bu dosyada, sonra
   yüklenir) tek sınıf özgüllüğüyle onu ezer; bileşik seçici kazandırır. */
.auth-links.mt{margin-top:14px}

.auth-divider{
  display:flex;align-items:center;gap:12px;color:var(--renk-muted);
  font-size:12.5px;margin:var(--bosluk-5) 0 var(--bosluk-4);
}
.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--renk-border)}

.auth-links{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:var(--bosluk-5);text-align:center}
.auth-links a{color:var(--renk-muted);font-size:13px}
.auth-links a:hover{color:var(--renk-primary)}

/* ---- Telefon: marka paneli kaldırılır, form tam genişlik olur ---- */
@media (max-width:767.98px){
  .auth-page{padding:0;align-items:stretch}
  .auth-shell{
    max-width:none;border-radius:0;border:0;box-shadow:none;
    min-height:100vh;min-height:100svh;flex-direction:column;
  }
  .auth-side{display:none}
  .auth-form{padding:calc(60px + var(--safe-t)) 22px calc(28px + var(--safe-b))}
  .auth-theme-toggle{top:calc(10px + var(--safe-t));right:10px}
}