/* ============================
   Emlakçı Giriş — Sayfa Özel CSS
   Scope: .ek-login (header'dan bağımsız)
   ============================ */
:root{
  --brand:#0F212C; --brand-2:#0b1a24; --ink:#e9f3ff; --muted:#a9c0d4; --line:#183041;
  --card:#0f1b26; --chip:#102938; --ok:#12B886; --warn:#f59f00;
  --radius:16px; --shadow:0 18px 46px rgba(0,0,0,.35);
}
html, body { height: 100%; }
body{
  margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--ink); background: linear-gradient(180deg, #0b1a24, #071119);
}
.ek-login{
  /* Sayfa içi tema değişkenleri (sadece bu scope’ta geçerli) */
  --brand:#0F212C;           /* lacivert arka plan */
  --ink:#e7eef6;
  --muted:#9db3c5;
  --surface:#0f1b26;
  --line:#162331;
  --white:#fff;

  --primary:#2A6BFF;         /* CTA gradient üst */
  --primary2:#1A4ED8;        /* CTA gradient alt */
  --ring:#2b5cff;            /* focus halkası */

  --err:#ff6b6b; --ok:#12B886; --warn:#f59f00;

  --r:14px; --r-lg:20px;
  --shadow:0 16px 44px rgba(0,0,0,.35);

  /* Eğer header yüksekliğini biliyorsan burada güncelle:
     min-height hesaplamasında kullanılır, yanlışsa sadece dikeyde
     biraz daha fazla boşluk olur, header'ı etkilemez. */
  --header-h: 60px;

  /* Yerleşim */
  min-height: calc(100dvh - var(--header-h));
  padding: 28px 16px;
  display: grid;
  place-items: center;

  /* Lacivert marka arka plan + yumuşak vinyet */
  background:
    radial-gradient(900px 360px at 80% -10%, rgba(74,163,255,.10), transparent),
    radial-gradient(1200px 420px at 15% -15%, rgba(18,184,134,.10), transparent),
    var(--brand);

  color: var(--ink);
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Kart */
.ek-login__card{
  width: min(100%, 440px);
  background: linear-gradient(180deg, rgba(255,255,255,.02), transparent), var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow);
  padding: 22px 18px;
}

/* Başlık */
.ek-login__title{
  margin: 0 0 14px;
  font-size: 1.45rem;
  font-weight: 800;
  line-height: 1.2;
  color: #fff;
}

/* Form alanları */
.ek-field{ margin: 12px 0; }
.ek-label{
  display:block;
  font-weight: 800;
  color: #cfe6ff;
  margin-bottom: 6px;
  font-size: .95rem;
}

/* Input + ikon */
.ek-input{ position: relative; display: flex; align-items: center; }
.ek-input__icon{
  position: absolute; left: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  color: #90a8bd; pointer-events: none;
}
.ek-input__icon svg{ display:block }

.ek-input__control{
  width: 100%;
  padding: .9rem 1rem .9rem 42px; /* ikon boşluğu */
  border-radius: 12px;
  border: 1px solid var(--line);
  background: #0c1721;
  color: var(--ink);
  outline: none;
  transition:
    .15s border-color ease,
    .15s box-shadow ease,
    .15s background ease,
    .15s transform ease;
}
.ek-input__control::placeholder{ color: var(--muted); opacity: .9; }
.ek-input__control:focus{
  border-color: var(--ring);
  box-shadow: 0 0 0 3px rgba(43,92,255,.25);
  background:#0d1b28;
}

/* Hata/başarı (opsiyonel kullanıma hazır) */
.ek-input__control[aria-invalid="true"]{
  border-color: var(--err);
  box-shadow: 0 0 0 3px rgba(255,107,107,.15);
}
.ek-input__control.is-valid{
  border-color: var(--ok);
  box-shadow: 0 0 0 3px rgba(18,184,134,.15);
}

/* CTA buton */
.ek-btn{
  width: 100%;
  margin-top: 10px;
  appearance: none;
  border: 0;
  border-radius: 12px;
  font-weight: 900;
  color: var(--white);
  cursor: pointer;
  padding: .95rem 1rem;
  background: linear-gradient(180deg, var(--primary), var(--primary2));
  box-shadow: 0 10px 26px rgba(42,107,255,.25);
  transition: transform .05s ease, filter .15s ease, box-shadow .15s ease;
}
.ek-btn:hover{ filter: brightness(1.03); }
.ek-btn:active{ transform: translateY(1px); }
.ek-btn:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(43,92,255,.25); }
.ek-btn:disabled{ opacity:.6; cursor:not-allowed; }

/* Yardımcı linkler */
.ek-login__links{
  margin-top: 12px;
  display: flex; gap: 12px; flex-wrap: wrap; justify-content: center;
}
.ek-login__link{
  color: #9ecbff;
  text-decoration: none;
  font-weight: 800;
}
.ek-login__link:hover{ text-decoration: underline; }

/* Signup cümlesi */
.ek-login__signup{
  margin-top: 8px;
  text-align: center;
  color: var(--muted);
  font-size: .95rem;
}
.ek-login__signup a{
  color:#b9d8ff;
  text-decoration:none;
  font-weight:900;
}
.ek-login__signup a:hover{ text-decoration:underline; }

/* Ofis girişi ikincil buton */
.ek-office-btn {
  display: block;             /* inline-flex yerine block */
  width: auto;                /* yazı kadar genişlik */
  margin: 10px auto 0;        /* yatayda ortalar */
  padding: .6rem 1rem;        /* yükseklik küçültüldü */
  border-radius: 10px;        /* köşeler biraz daha dar */
  border: 1px solid #29445a;
  background: #0c1721;
  color: #d7e7f6;
  text-decoration: none;
  font-weight: 700;
  font-size: .9rem;           /* yazı biraz küçük */
  text-align: center;         /* iç metin ortalansın */
  transition:
    box-shadow .15s ease,
    transform .05s ease,
    border-color .2s ease,
    background .2s ease;
}

.ek-office-btn:hover{
  border-color:#3b5b77;
  box-shadow:0 10px 24px rgba(11,107,255,.12);
}
.ek-office-btn:active{ transform: translateY(1px); }

/* Autofill görünürlüğü */
.ek-input__control:-webkit-autofill{
  -webkit-text-fill-color: var(--ink);
  transition: background-color 9999s ease-in-out 0s;
}

/* Hareket azaltımı */
@media (prefers-reduced-motion: reduce){
  .ek-login *, .ek-login *::before, .ek-login *::after{
    animation:none !important; transition:none !important;
  }
}

/* Mobil uyum */
@media (max-width: 520px){
  .ek-login{ padding: 22px 12px; }
  .ek-login__card{ padding: 10px 8px; } 
  .ek-label{ font-size: .9rem; }
  .ek-input__control{ padding:.85rem 1rem .85rem 42px; }

  /* Ofis butonu mobilde küçültülmüş */
  .ek-office-btn{
    width: auto;              /* içerik kadar genişlik */
    display: block;           /* block yap ki margin auto çalışsın */
    margin-left: auto;
    margin-right: auto;
    padding: .65rem 1rem;     /* daha küçük iç boşluk */
    font-size: .9rem;         /* yazı boyutu küçülsün */
    border-radius: 10px;      /* köşeleri biraz daha dar */
    text-align: center;       /* iç yazı ortalansın */
  }
}

/* ---------- 📱 Mobil tipografi: başlıklar 15px, diğer tüm metin 12px ---------- */
/* Not: Bu blok EN SONDA. !important ile tüm mobil metin boyutları net ayarlanır. */
@media (max-width: 520px){
  /* Varsayılan (tüm metin) 12px */
  .ek-login,
  .ek-login *{
    font-size:12px !important;
    line-height:1.4;
  }

  /* Başlıkları 15px */
  .ek-login h1,
  .ek-login h2,
  .ek-login h3,
  .ek-login h4,
  .ek-login h5,
  .ek-login h6,
  .ek-login .ek-login__title{
    font-size:15px !important;
    line-height:1.25;
  }

  /* Placeholder / input / select */
  .ek-login input::placeholder,
  .ek-login textarea::placeholder{ font-size:12px !important; }
  .ek-login input::-webkit-input-placeholder{ font-size:12px !important; }
  .ek-login input::-moz-placeholder{ font-size:12px !important; }
  .ek-login input:-ms-input-placeholder{ font-size:12px !important; }
  .ek-login input::-ms-input-placeholder{ font-size:12px !important; }

  /* Linkler ve butonlar da 12px kalır (başlıklar hariç) */
  .ek-login .ek-btn,
  .ek-login .ek-office-btn,
  .ek-login .ek-login__link,
  .ek-login .ek-login__signup{ font-size:12px !important; }
}


    .ek-error{color:#ff3b3b;font-size:.875rem;margin-top:6px}
    .ek-input__control.is-invalid{border-color:#ff3b3b;outline-color:#ff3b3b}
    .ek-input__control.is-valid{border-color:#12B886;outline-color:#12B886}
    .shake{animation:ek-shake .28s linear 0s 1}
    @keyframes ek-shake{
      0%{transform:translateX(0)}25%{transform:translateX(3px)}
      50%{transform:translateX(-3px)}75%{transform:translateX(2px)}
      100%{transform:translateX(0)}
    }
    /* basit modal */
    .ek-v2modal{position:fixed;inset:0;background:#0008;display:none;align-items:center;justify-content:center;z-index:9999}
    .ek-v2box{background:#0f172a;color:#fff;padding:20px;border-radius:12px;max-width:420px;width:calc(100% - 32px)}
    .ek-v2actions{display:flex;gap:8px;margin-top:12px;justify-content:flex-end}
    .ek-btn{cursor:pointer}
    .ek-btn--ghost{background:transparent;border:1px solid #334155}