/* ============================================================
   Online Koçunuz — Giriş Yap sayfası stilleri
   Kaynak: design_system/standalone/giris.html (inline style'lar)
   Tüm kurallar .okt-giris altına scope'landı (çakışma önleme).
   Token'lar globalde tanımlı (style.css): var(--primary-500) vb.
   Mobil öncelikli.
   ============================================================ */

/* ---- HERO / KONUM ---- */
.okt-giris .okt-giris-hero{
  padding:56px 24px 80px;
  background:linear-gradient(180deg,#F7F8FB 0%,#fff 100%);
  min-height:70vh;
}
.okt-giris .okt-giris-wrap{
  max-width:420px; margin:0 auto;
}

/* ---- KART ---- */
.okt-giris .okt-giris-card{ padding:32px; }

.okt-giris .okt-giris-head{
  text-align:center; margin-bottom:24px;
}
.okt-giris .okt-giris-pill{
  display:inline-flex; align-items:center;
  padding:6px 13px; border-radius:999px;
  background:#EEF1FF; color:#1E3AE2;
  font-size:12px; font-weight:600; letter-spacing:.01em;
}
.okt-giris .okt-giris-title{
  font-size:26px; font-weight:800; color:var(--ink-900);
  margin:12px 0 4px; letter-spacing:-0.02em; line-height:1.2;
}
.okt-giris .okt-giris-sub{
  font-size:14px; color:var(--fg-muted); margin:0;
}

/* ---- FORM ---- */
.okt-giris .okt-giris-form{
  display:flex; flex-direction:column; gap:14px;
}
.okt-giris .okt-giris-field{ display:flex; flex-direction:column; }

.okt-giris .okt-giris-label{
  display:block; font-size:12px; font-weight:700; color:var(--ink-900);
  margin-bottom:6px; text-transform:uppercase; letter-spacing:.04em;
}
.okt-giris .okt-giris-label--row{
  display:flex; justify-content:space-between; align-items:center;
}
.okt-giris .okt-giris-forgot{
  font-size:11px; color:var(--primary-700); text-decoration:none;
  text-transform:none; letter-spacing:0; font-weight:600;
}
.okt-giris .okt-giris-forgot:hover{ text-decoration:underline; }

.okt-giris .okt-giris-input{
  width:100%; height:46px; padding:0 14px;
  border:1px solid var(--border); border-radius:9px;
  font-size:15px; outline:none; font-family:var(--font-sans);
  color:var(--ink-900); background:#fff;
  transition:border-color .16s var(--ease-out), box-shadow .16s var(--ease-out);
}
.okt-giris .okt-giris-input:focus{
  border-color:var(--primary-500);
  box-shadow:0 0 0 3px rgba(59,91,255,.14);
}
.okt-giris .okt-giris-input::placeholder{ color:var(--ink-300, #aab0c0); }

/* Şifre alanı + göster/gizle */
.okt-giris .okt-giris-pwwrap{ position:relative; }
.okt-giris .okt-giris-input--pw{ padding-right:46px; }
.okt-giris .okt-giris-toggle{
  position:absolute; right:6px; top:6px; bottom:6px; width:42px;
  border:none; background:transparent; cursor:pointer;
  color:var(--fg-muted); font-size:12px; font-weight:700;
  font-family:var(--font-sans);
}
.okt-giris .okt-giris-toggle:hover{ color:var(--primary-700); }

/* Beni hatırla */
.okt-giris .okt-giris-remember{
  display:flex; align-items:center; gap:8px;
  font-size:13px; color:var(--ink-700); cursor:pointer; margin-top:2px;
}
.okt-giris .okt-giris-remember input{
  width:16px; height:16px; accent-color:var(--primary-500); cursor:pointer;
}

/* Hata mesajı */
.okt-giris .okt-giris-error{
  margin:0; padding:10px 12px; border-radius:9px;
  background:#FEECEC; border:1px solid #F6C9C9; color:#B42318;
  font-size:13px; line-height:1.45;
}

/* Gönder butonu */
.okt-giris .okt-giris-submit{
  height:48px; margin-top:6px; width:100%;
}
.okt-giris .okt-giris-submit:disabled{ opacity:.7; cursor:not-allowed; }

/* Alt link */
.okt-giris .okt-giris-foot{
  text-align:center; font-size:13px; color:var(--fg-muted); margin-top:6px;
}
.okt-giris .okt-giris-link{
  color:var(--primary-700); font-weight:700; text-decoration:none;
}
.okt-giris .okt-giris-link:hover{ text-decoration:underline; }
.okt-giris .okt-giris-link--ink{ color:var(--ink-900); }

/* Kart altı yardım */
.okt-giris .okt-giris-help{
  text-align:center; margin-top:18px; font-size:12px; color:var(--fg-muted);
}