/* ══ BEYAZ KABUK — giriş ve kayıt yüzeyleri ══════════════════════════
   Göktuğ: "giriş ve kayıt sayfalarını da beyaza çevir."

   Bu beş sayfanın (giriş, giriş/başarılı, kayıt rol seçimi, alıcı kaydı,
   sağlayıcı kaydı) ortak bir layout'u YOK; her biri kendi <style> bloğunu
   taşıyor. Ama hepsi AYNI jeton sözlüğünü kullanıyor ve tutarlı
   kullanıyor: --ink yalnızca sayfa zemini, --paper hep metin, --panel hep
   kart yüzeyi. Bu yüzden beş dosyaya beş ayrı blok yazmak yerine
   jetonlar burada tek yerden çevriliyor.

   ⚠️ Bu dosya her sayfada </style>'dan SONRA bağlanıyor. Sayfa içi stil
   sonra gelseydi kazanırdı; sıra bu yüzden önemli.

   Renkler ana sayfadaki pafta dünyasıyla birebir aynı:
   #FFFFFF kâğıt · #001553 mürekkep · #47608F ikincil · rgba(0,21,83,.14) kenar
   ------------------------------------------------------------------ */
:root{
  --ink:#FFFFFF;               /* sayfa zemini */
  --paper:#001553;             /* mürekkep */
  --panel:#FFFFFF;             /* kart / fieldset yüzeyi */
  --steel:#47608F;             /* ikincil metin */
  --line:rgba(0,21,83,.14);
  /* Eski --danger (#FFD9D2) koyu zemin için AÇIK pembeydi; beyazda
     görünmüyor. Hata metni okunur bir kırmızıya çevrildi. */
  --danger:#B3261E;
}

/* Üst çubuk sabit lacivert taşıyordu (jeton değil). */
.nav{ background:rgba(255,255,255,.94); border-bottom:1px solid rgba(0,21,83,.12); }
/* Taraf değişince sağdaki bağlantı metni uzuyor ("Firmanız kayıtlı
   değil mi? Hizmet veren olarak başvurun") ve logonun üstüne biniyordu:
   .nav-inner space-between ama aralarında boşluk yoktu. */
.nav-inner{ gap:18px; }
.nav a:not(.logo){ text-align:right; line-height:1.4; }

/* Alanlar: krem üzerine %5 saydam dolgu koyu zemine göreydi. */
input[type=text], input[type=email], input[type=password], input[type=tel],
input[type=number], input[type=url], select, textarea{
  background:#F7F9FD; border-color:rgba(0,21,83,.16); color:#001553;
}
input::placeholder, textarea::placeholder{ color:#8FA3C6; }
select option{ background:#FFFFFF; color:#001553; }

/* Fieldset/kart yüzeylerine beyaz kâğıdın yükseklik gölgesi. */
fieldset, .card, .kart{
  box-shadow:0 1px 2px rgba(0,21,83,.05), 0 18px 40px -30px rgba(0,21,83,.35);
}
/* giris/basarili.blade.php'de kart metni sabit #D6D2C4 idi. */
.card{ color:#47608F; }
/* KVKK onay satırı da sabit #D6D2C4 taşıyordu — beyazda okunmuyordu.
   Rıza metninin okunur olması hukuki olarak da önemli. */
.kvkk-satir{ color:#47608F; }
.kvkk-satir a{ color:#001553; }

/* ══ Taraf seçici — kaydıran segment denetimi ══════════════════════
   Göktuğ: "şık bir toggle yap" → sonra "daha kaliteli, Tailwind tarzı".
   Önceki hâli iki ayrı düğmeydi; seçili olan kırmızı çerçeveyle
   işaretleniyordu. Hem ağır duruyordu hem "iki düğme" gibi okunuyordu —
   oysa bu tek bir seçim, iki eylem değil.

   Tailwind'in segment kalıbı: açık gri ray, üstünde BEYAZ kayan başlık,
   ince yükseklik gölgesi. Dolu koyu blok yerine beyaz başlık, çünkü
   asıl iş kâğıdın üstünde kabaran bir yüzey hissi — yazı rengi
   değişimiyle birlikte seçim kendiliğinden okunuyor.

   Kaydırma `:has()` ile; JS'e HİÇ dokunulmadı, mevcut aria-pressed
   mantığı aynen çalışıyor. Hem /giris (Hizmet alan · veren) hem
   /kayit/alici (Kurumsal · Bireysel) aynı işaretlemeyi kullanıyor.

   ⚠️ Taban kural `:has()` desteklemeyen tarayıcıda tek başına yeterli:
   seçili düğme beyaz dolgu + gölge alır, kayma olmaz ama seçim bellidir. */
/* Ölçü ve his: iOS segment denetimi.
   Genişlik İÇERİĞE göre — tam genişliğe yayılınca iki dev levha gibi
   duruyordu. inline-grid + grid-auto-columns:1fr iki sütunu EŞİT tutar
   (kayan başlığın %50 matematiği buna bağlı) ama kutu içeriğe oturur.

   Ray NÖTR gri: mavimsi bir ray, üstündeki beyaz başlığı soğurup
   "aydınlık" hissini öldürüyordu. Ray koyulaştıkça başlık parlıyor. */
.taraf{
  display:inline-grid; grid-auto-flow:column; grid-auto-columns:1fr;
  gap:0; padding:2px; border-radius:9px; width:fit-content;
  background:rgba(0,21,83,.075); border:0;
}
.taraf button{
  position:relative; border:0; background:transparent;
  /* ⚠️ Sayfaların genel `button{...}` kuralı margin-top:12px ve
     width:100% veriyor (gönder düğmesi için). Segment düğmelerine de
     biniyordu: ray 71px'e şişiyor ve kayan başlık dikeyde kaçıyordu. */
  margin:0; width:auto; min-width:112px;
  border-radius:7px; padding:7px 18px;
  font-size:13px; font-weight:450; letter-spacing:-.006em;
  color:rgba(0,21,83,.55); cursor:pointer; white-space:nowrap;
  transition:color .2s ease;
}
.taraf button:hover{ color:rgba(0,21,83,.8); }
.taraf button[aria-pressed="true"]{
  background:#FFFFFF; color:#001553; font-weight:600;
  /* iOS başlık gölgesi: geniş ve yumuşak bir yayılım + hemen altında
     ince bir çizgi + saç teli kenar. Tek katmanlı gölge bu kadar
     "kabarmış" görünmüyor. */
  box-shadow:0 3px 8px rgba(0,21,83,.12), 0 3px 1px rgba(0,21,83,.04),
             0 0 0 .5px rgba(0,21,83,.04);
  border-color:transparent;
}
.taraf button:focus-visible{ outline:2px solid var(--amber); outline-offset:3px; }

@supports selector(:has(*)){
  /* Konum ve basma durumu iki ayrı değişkende; ikisi de TEK bir transform
     içinde birleşiyor, böylece kayma ile sıkışma birbirini ezmiyor. */
  .taraf{ position:relative; --ez:1; }
  /* Basılıyken başlık hafifçe daralıyor — iOS'taki dokunma geri bildirimi. */
  .taraf:active{ --ez:.96; }

  /* Kayan başlık: konumlandırılmış olduğu için rayın zemininin üstünde,
     düğmelerin (position:relative) altında boyanıyor. */
  .taraf::before{
    content:""; position:absolute; top:2px; bottom:2px; left:2px;
    width:calc(50% - 2px); border-radius:7px; background:#FFFFFF;
    box-shadow:0 3px 8px rgba(0,21,83,.12), 0 3px 1px rgba(0,21,83,.04),
               0 0 0 .5px rgba(0,21,83,.04);
    /* Konum açık indeksle; yalnız basma sıkışması değişkende kalıyor
       (o :active ile geliyor, kendiliğinden yeniden hesaplanıyor). */
    transform:translateX(0) scaleX(var(--ez));
    will-change:transform;
    /* iOS'un hissi YAYLI değil, KRİTİK SÖNÜMLÜ: hızlı çıkıp yumuşak
       oturur, geri sekmez. Zıplayan bir eğri (easeOutBack) burada
       oyuncak gibi duruyordu. */
    transition:transform .32s cubic-bezier(.25,1,.3,1);
  }
  /* Dolgu artık başlıktan geliyor. */
  .taraf:has(button:nth-child(2)[aria-pressed="true"])::before{
    transform:translateX(100%) scaleX(var(--ez));
  }
  .taraf button[aria-pressed="true"]{ background:transparent; box-shadow:none; }
}
@media (prefers-reduced-motion:reduce){
  .taraf::before{ transition:none; }
}
/* Sağlayıcı kaydındaki krem saydam dolgulu yardımcı yüzeyler. */
.kat, .kat-liste, .secim, .rozet{ background:#F4F7FC; color:#001553; }

.hata{
  color:#B3261E; background:rgba(255,40,0,.06); border-color:rgba(255,40,0,.30);
}

/* Kırmızı zemin üzerinde yazı her zaman beyaz. */
button{ color:#FFFFFF; }
