/* Team Forge — Auth sayfaları ortak stili (Phase 1). Marka dili: siyah + altın. */
:root{
  --bg:#0a0a0a; --panel:#141416; --line:rgba(255,255,255,0.10); --line-soft:rgba(255,255,255,0.06);
  --gold:#F4B860; --gold-2:#C9862B; --gold-dim:rgba(244,184,96,0.12);
  --text:#fff; --muted:#b8b8b8; --danger:#e5534b; --ok:#3fb37f;
  --kart-ust:#141416; --kart-alt:#0e0e10;   /* karti cizen gradyan uclari */
  --hale:rgba(244,184,96,0.10);             /* ust taraftaki isik halesi */
  --golge:0 30px 80px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.04);
  --girdi:#0c0c0d;                          /* form alani zemini */
  --msj-hata:#f2b8b3; --msj-ok:#bfe8d4; --msj-bilgi:#eadfb8;   /* mesaj metinleri */
  --ipucu:#8a8676;
  /* BIRINCIL DUGME MUREKKEBI. .auth-btn'in zemini IKI TEMADA da acik altin
     gradyandir (--gold degisse de acik kalir), o yuzden yazi iki temada da
     KOYU kalir ve acik temada yeniden tanimlanmaz. Deger `.auth-btn`in icinde
     elle duran #1a1a1a'nin token'a alinmis halidir -- bkz. --kart-ust/--hale. */
  --dugme-yazi:#1a1a1a;
}

/* ---- ACIK TEMA (Kerem, 24 Agustos 2026) --------------------------------
   Taban KOYU kalir; acik palet <html data-tema="acik"> ile acilir. Renkler
   Miqno'nun ana sayfadaki krem/murdum/bal diliyle hizalandi ki iki yuzey
   arasinda gecerken marka degismis gibi olmasin (olculdu: giris sayfasi
   eski siyah+altin dilindeydi, ana sayfa kremdi).

   Sabit renkler token'a alindi (--kart-ust/--kart-alt/--hale/--golge):
   aksi halde .auth-card'in gradyani ve golgesi acik temada da koyu kalirdi. */
:root[data-tema="acik"]{
  --bg:#FFF9F0; --panel:#FFFFFF;
  --line:rgba(59,44,53,0.12); --line-soft:rgba(59,44,53,0.06);
  --gold:#E96A4B; --gold-2:#A9772B; --gold-dim:rgba(244,184,96,0.18);
  --text:#3B2C35; --muted:#86707C; --danger:#C0392B; --ok:#2E7D5B;
  --kart-ust:#FFFFFF; --kart-alt:#FFFDF9;
  --hale:rgba(244,184,96,0.22);
  --golge:0 2px 6px rgba(59,44,53,.05), 0 22px 48px -22px rgba(59,44,53,.22);
  --girdi:#FFFDF9;
  --msj-hata:#8E2C22; --msj-ok:#1F5F45; --msj-bilgi:#7A5A1E;
  --ipucu:#86707C;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scrollbar-gutter:stable}
body{
  min-height:100vh; background:
    radial-gradient(900px 500px at 50% -10%, var(--hale), transparent 60%),
    var(--bg);
  color:var(--text); font-family:'Inter',system-ui,sans-serif; line-height:1.6;
  display:flex; align-items:center; justify-content:center; padding:32px 18px;
  -webkit-font-smoothing:antialiased;
}
.auth-card{
  width:100%; max-width:420px; background:linear-gradient(180deg,var(--kart-ust),var(--kart-alt));
  border:1px solid var(--line); border-radius:18px; padding:34px 28px 30px;
  box-shadow:var(--golge);
}
.auth-logo{display:flex; justify-content:center; margin-bottom:18px}
.auth-logo img{height:38px; width:auto}
.auth-head{text-align:center; margin-bottom:22px}
.auth-eyebrow{color:var(--gold-2); letter-spacing:0.22em; text-transform:uppercase; font-size:0.72rem; font-weight:600}
.auth-title{font-family:'Oswald',sans-serif; text-transform:uppercase; font-weight:700; letter-spacing:0.02em; font-size:1.7rem; margin-top:8px}
.auth-sub{color:var(--muted); font-size:0.92rem; margin-top:8px}
.auth-field{margin-bottom:14px}
.auth-field label{display:block; font-size:0.82rem; color:var(--muted); margin-bottom:6px; letter-spacing:0.02em}
.auth-field input{
  width:100%; background:var(--girdi); border:1px solid var(--line); color:var(--text);
  border-radius:10px; padding:12px 14px; font-family:inherit; font-size:0.98rem; transition:border-color .2s, box-shadow .2s;
}
.auth-field input:focus{outline:none; border-color:var(--gold); box-shadow:0 0 0 3px var(--gold-dim)}
/* Şifre alanı + göz (göster/gizle) düğmesi — input JS ile .auth-pass içine sarılır */
.auth-pass{position:relative; display:block}
.auth-pass input{padding-right:46px}
.auth-pass-toggle{
  position:absolute; top:50%; right:6px; transform:translateY(-50%);
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  background:transparent; border:none; border-radius:8px; cursor:pointer;
  color:var(--muted); transition:color .15s, background .15s;
}
.auth-pass-toggle:hover{color:var(--gold); background:rgba(255,255,255,0.05)}
.auth-pass-toggle svg{width:19px; height:19px; display:block}
.auth-btn{
  width:100%; display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer;
  font-family:'Inter',sans-serif; font-weight:600; font-size:0.98rem; letter-spacing:0.02em;
  padding:13px 20px; border-radius:999px; border:1px solid transparent; margin-top:6px;
  background:linear-gradient(135deg,#F7CE8E,var(--gold)); color:var(--dugme-yazi);
  box-shadow:0 8px 22px rgba(244,184,96,0.24); transition:transform .15s, box-shadow .2s, opacity .2s;
}
.auth-btn:hover{transform:translateY(-1px)}
.auth-btn:disabled{opacity:.6; cursor:not-allowed; transform:none}
/* AUTH-1 Ek 1 — DUGME BAGLANTI OLARAK KULLANILINCA YAZI KAYBOLUYORDU.
   Olculdu (5 Eylul 2026, email-dogrula, iPhone/Safari + headless): "Giris Yap"
   metni zemini uzerinde 1:1 kontrast veriyordu. Sebep OZGULLUK: `.auth-links a`
   (0,1,1) `.auth-btn`den (0,1,0) daha guclu; anchor rengi altina donuyor, zemin
   de altin gradyan -- altin ustune altin. Kap adiyla birlikte yazilan kural
   (0,2,1) hem bunu, hem ileride eklenecek her `.auth-x a` kuralini gecer. */
.auth-links a.auth-btn, .auth-row a.auth-btn, a.auth-btn{color:var(--dugme-yazi)}
.auth-links{margin-top:18px; text-align:center; font-size:0.9rem; color:var(--muted)}
.auth-links a{color:var(--gold); text-decoration:none}
.auth-links a:hover{text-decoration:underline}
.auth-row{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:14px; font-size:0.88rem; color:var(--muted)}
/* Linkler koyu zeminde tarayıcı-varsayılan mavi kalıyordu (zor görünüyordu) -> altın. */
.auth-row a{color:var(--gold); text-decoration:none}
.auth-row a:hover{text-decoration:underline}
.auth-row span a{color:var(--gold)}
/* ---- "veya" ayracı + Google ile devam butonu ---- */
.auth-divider{display:flex; align-items:center; gap:12px; margin:18px 0; color:var(--muted); font-size:0.78rem; letter-spacing:0.06em; text-transform:uppercase}
.auth-divider::before, .auth-divider::after{content:""; flex:1; height:1px; background:var(--line)}
.auth-btn-google{
  width:100%; display:inline-flex; align-items:center; justify-content:center; gap:10px; cursor:pointer;
  font-family:'Inter',sans-serif; font-weight:600; font-size:0.96rem; letter-spacing:0.01em;
  padding:12px 20px; border-radius:999px; border:1px solid var(--line);
  /* Google rozeti IKI TEMADA DA beyaz zemin + koyu yazi kalir (Google marka
     kurali); tokenlanmaz. */
  background:#fff; color:#1f1f1f; transition:transform .15s, box-shadow .2s, opacity .2s;
}
.auth-btn-google:hover{transform:translateY(-1px); box-shadow:0 8px 22px rgba(0,0,0,0.35)}
.auth-btn-google:disabled{opacity:.6; cursor:not-allowed; transform:none}
.auth-btn-google svg{width:18px; height:18px; flex:none}
.auth-msg{margin-top:16px; padding:11px 14px; border-radius:10px; font-size:0.9rem; display:none}
.auth-msg.show{display:block}
.auth-msg.err{background:rgba(229,83,75,0.12); border:1px solid rgba(229,83,75,0.4); color:var(--msj-hata)}
.auth-msg.ok{background:rgba(63,179,127,0.12); border:1px solid rgba(63,179,127,0.4); color:var(--msj-ok)}
.auth-msg.info{background:rgba(244,184,96,0.10); border:1px solid rgba(244,184,96,0.35); color:var(--msj-bilgi)}
.auth-back{display:block; text-align:center; margin-top:20px; font-size:0.85rem; color:var(--muted); text-decoration:none}
.auth-back:hover{color:var(--gold)}
.auth-hint{font-size:0.78rem; color:var(--ipucu); margin-top:6px}