/* ==========================================================================
   Başvuru paneli (AŞAMA 3). 4-neon dili; kabuk değişkenlerini (uygulama.css :root) kullanır.
   Telefonda alttan açılan tam ekran sayfa, masaüstünde sağdan panel. Kabuk dosyalarına dokunmaz.
   Tek akılda kalan öğe: fotoğraf karosunun kenarı yükleme ilerledikçe ışıkla dolar.
   ========================================================================== */
:root{--b-yesil:#5BE3A8;--b-kirmizi:#FF8A96;--b-gen:520px}
@property --y{syntax:'<number>';inherits:false;initial-value:0}

html.b-acik{overflow:hidden}
html.b-acik .arti .ico{transform:rotate(135deg)}
.no-js .b-perde,.no-js .b-sayfa{display:none}

/* ---------- perde ve sayfa ---------- */
.b-perde{position:fixed;inset:0;z-index:40;background:rgba(2,6,18,.64);opacity:0;transition:opacity .4s}
html.b-acik .b-perde{opacity:1}
.b-sayfa{position:fixed;z-index:41;left:0;right:0;bottom:0;top:calc(var(--st) + 8px);display:flex;flex-direction:column;min-height:0;
  border-radius:28px 28px 0 0;background:linear-gradient(180deg,#0E2560,#06122F 22%,#040A1A 60%);border:1px solid rgba(110,170,255,.45);border-bottom:0;
  box-shadow:0 -10px 50px -10px rgba(59,139,255,.55);transform:translateY(105%);visibility:hidden;
  transition:transform .55s var(--ease),visibility 0s linear .55s;will-change:transform;outline:0}
html.b-acik .b-sayfa{transform:none;visibility:visible;transition:transform .55s var(--ease),visibility 0s}
.b-sayfa.surukle{transition:none}
/* /basvuru: panel sunucudan açık gelir; ilk çizimde kayma olmasın */
.js .b-kok[data-acik="1"] .b-sayfa.acik{transform:none;visibility:visible;transition:none}
.js .b-kok[data-acik="1"] .b-perde{opacity:1}

/* ---------- baş: tutamak, başlık, ilerleme (yoğun: toplam ≤ 84px, 2026-10-23 v2) ---------- */
.b-bas{flex:none;padding:4px 16px 6px;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}
.b-bas::before{content:"";display:block;width:36px;height:4px;margin:0 auto 2px;border-radius:2px;background:rgba(169,209,255,.45)}
.b-bas-ust{display:flex;align-items:center;justify-content:space-between;gap:10px;height:40px}
.b-bas h2{font-size:18px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b-bas h2:focus{outline:none}
/* kapat: 44px dokunma alanı, satırı 40px'de tutmak için negatif kenar */
.b-bas-ust .yuvarlak{width:44px;height:44px;margin:-2px -6px -2px 0;border-color:transparent;background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.b-bas-ust .yuvarlak .ico{width:22px;height:22px}
.b-ilerleme{margin-top:2px}
.b-ray{position:relative;height:3px;border-radius:3px;background:rgba(110,170,255,.18)}
.b-ray i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--ilerleme,.25) * 100%);border-radius:inherit;
  background:linear-gradient(90deg,var(--elektrik),#7DB4FF);box-shadow:0 0 10px var(--elektrik);transition:width .6s var(--yay)}
/* etkin adımın adı ve "2 / 4": çubuğun hemen altında küçük metin (telefonda) */
.b-adim-yazi{display:flex;justify-content:space-between;gap:8px;margin-top:4px;font-size:13px;line-height:16px;color:var(--soluk);font-variant-numeric:tabular-nums}
.b-adim-yazi b{font-weight:600;color:var(--buz)}
.b-adim-adlari{display:none}
/* geniş ekranda dört adımın adı tıklanabilir (tamamlanan adıma dönüş) */
@media (min-width:600px){
  .b-adim-yazi{display:none}
  .b-adim-adlari{list-style:none;display:flex;justify-content:space-between;gap:4px;margin:2px -8px 0}
  .b-adim-adlari button{min-height:44px;padding:0 8px;border-radius:12px;color:var(--soluk);font-size:14px;font-weight:500;white-space:nowrap;transition:color .3s}
  .b-adim-adlari button:disabled{cursor:default;color:rgba(163,181,217,.55)}
  .b-adim-adlari button[aria-current="step"]{color:#fff;text-shadow:0 0 14px rgba(59,139,255,.9)}
}

/* ---------- gövde ---------- */
.b-govde{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:10px 16px 20px;-webkit-overflow-scrolling:touch;scroll-padding:16px}
.b-form{display:block}
.b-adim{border:0;min-width:0;display:grid;gap:12px;outline:0}
.js .b-adim[hidden]{display:none}
.b-grup{display:grid;gap:4px;min-width:0}
/* grup ve alan etiketleri: alanın üstünde tek satır, 14px */
.b-grup-adi,.b-alan>label{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:14px;line-height:18px;font-weight:600;color:#C9D6EE;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b-sayac{font-weight:500;color:var(--buz);font-variant-numeric:tabular-nums}
.b-aciklama{color:#C3D2EE;font-size:14px;line-height:1.45;max-width:36.66em}
.b-not{font-size:14px;line-height:1.45;color:var(--buz);padding:10px 12px;border-radius:14px;background:rgba(59,139,255,.1);border:1px solid rgba(110,170,255,.25)}
.b-not-hata{color:#FFD0D5;background:rgba(255,138,150,.1);border-color:rgba(255,138,150,.5)}
.b-ipucu{font-size:14px;color:var(--soluk)}
.b-devam{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:12px;padding:2px 4px 2px 12px}
.b-devam .yazi-dugme{min-height:44px}
.b-inapp{display:grid;gap:8px;margin-bottom:12px;color:#FFE1CC;background:rgba(255,154,77,.12);border-color:rgba(255,154,77,.55)}
.b-inapp-baslik{font-weight:600;color:#fff}
.b-inapp .dolu{min-height:44px;font-size:16px;background:linear-gradient(100deg,#C2581B,#E8792F);box-shadow:0 0 0 1px rgba(255,200,160,.4) inset,0 10px 30px -10px rgba(255,154,77,.8)}

/* ---------- alanlar: etiket üstte, alan 46px, yazı 16px (iOS yakınlaştırmasın) ---------- */
.b-alan{position:relative;display:flex;flex-direction:column;gap:4px;min-width:0}
.b-alan>label{order:-1;cursor:pointer}
.b-alan input,.b-alan select,.b-alan textarea{display:block;width:100%;height:46px;padding:0 38px 0 12px;border-radius:12px;font-size:16px;line-height:1.25;color:var(--metin);
  background:rgba(10,26,63,.75);border:1px solid rgba(110,170,255,.3);transition:border-color .3s,box-shadow .3s;-webkit-appearance:none;appearance:none}
.b-alan textarea{height:auto;min-height:84px;padding:10px 12px;resize:vertical;font:inherit;font-size:16px}
.b-alan input::placeholder,.b-alan textarea::placeholder{color:rgba(163,181,217,.55);opacity:1}
.b-alan input:focus,.b-alan select:focus,.b-alan textarea:focus{outline:none;border-color:var(--elektrik);box-shadow:0 0 0 3px rgba(59,139,255,.25),0 0 18px -4px rgba(59,139,255,.8)}
.b-secim select{padding-right:30px;cursor:pointer;text-overflow:ellipsis;background-image:linear-gradient(45deg,transparent 50%,var(--buz) 50%),linear-gradient(135deg,var(--buz) 50%,transparent 50%);
  background-position:calc(100% - 17px) 52%,calc(100% - 12px) 52%;background-size:5px 5px;background-repeat:no-repeat;background-color:rgba(10,26,63,.75)}
.b-secim select:disabled{opacity:.55;cursor:not-allowed}
.b-secim select option{background:var(--derin);color:var(--metin)}
.b-alan-not{font-size:13px;line-height:1.4;color:var(--soluk);margin:2px 2px 0}
.b-alan-not:empty{display:none}
.b-sag{float:right;font-variant-numeric:tabular-nums}
/* durum simgesi alanın içinde, sağda (etiket 18px + 4px boşluk + (46-20)/2) */
.b-durum-ico{position:absolute;right:12px;top:35px;width:20px;height:20px;color:var(--b-yesil);opacity:0;transform:scale(.6);transition:opacity .3s,transform .35s var(--yay);pointer-events:none;stroke-width:2.4}
/* alan durumu: yeşil = tamam, kırmızı = hata (mesaj alanın altında) */
.b-alan.b-tamam>input,.b-alan.b-tamam>select,.b-alan.b-tamam>textarea{border-color:rgba(91,227,168,.6)}
.b-alan.b-tamam>.b-durum-ico{opacity:1;transform:none}
.b-alan.b-hata>input,.b-alan.b-hata>select,.b-alan.b-hata>textarea{border-color:var(--b-kirmizi);box-shadow:0 0 0 3px rgba(255,138,150,.16)}
.b-hata>.b-alan-not,.b-hata>[data-not]{color:var(--b-kirmizi)}
.b-tamam>.b-alan-not.b-ok{color:var(--b-yesil)}
.b-grup.b-hata .cip,.b-grup.b-hata .b-karo-ekle{border-color:rgba(255,138,150,.7)}
.b-uclu{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr) minmax(0,1.05fr);gap:8px}
.b-uclu .b-alan.b-hata>select{border-color:var(--b-kirmizi)}
.b-ikili{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:start}
.b-olcu-not{margin-top:-6px}

/* e-posta önerisi */
.b-oneri{margin-top:4px;padding:10px 12px;border-radius:14px;background:rgba(59,139,255,.12);border:1px solid rgba(110,170,255,.4);display:grid;gap:6px;font-size:14px}
.b-oneri b{color:#fff;font-weight:600;overflow-wrap:anywhere}
.b-oneri-eylem{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.b-oneri-eylem .ikincil{min-height:44px}

/* tür seçici (Kendim / Çocuğum): 44px düğmeler, kayan dolgu 3px içeride */
.b-secici{position:relative;display:grid;grid-template-columns:repeat(2,1fr);border-radius:999px;background:rgba(10,26,63,.75);border:1px solid rgba(110,170,255,.3)}
.b-secici button{position:relative;z-index:1;min-height:44px;border-radius:999px;color:var(--soluk);font-weight:600;font-size:16px;transition:color .3s}
.b-secici button[aria-checked="true"]{color:#fff}
.b-secici .kayan{position:absolute;top:3px;bottom:3px;left:3px;width:calc((100% - 6px) / 2);border-radius:999px;background:linear-gradient(100deg,#1D4ED8,#2F6BFF);
  box-shadow:0 0 16px rgba(59,139,255,.7);transition:transform .5s var(--yay)}
.b-secici[data-tur="cocuk"] .kayan{transform:translateX(100%)}

/* cinsiyet çipleri (2 seçenek; değerler API'den) */
.b-cipler{display:flex;flex-wrap:nowrap;gap:6px}
.b-cipler .cip{position:relative;flex:1;justify-content:center;min-height:46px;font-size:16px;padding:0 10px;cursor:pointer}

/* onay satırları */
.b-onay{display:grid;gap:6px;padding:10px 12px;border-radius:14px;background:rgba(10,26,63,.55);border:1px solid rgba(110,170,255,.22)}
.b-onay.b-hata{border-color:var(--b-kirmizi)}
.b-onay.b-tamam{border-color:rgba(91,227,168,.55)}
.b-onay-satir{display:flex;gap:10px;align-items:center;cursor:pointer;font-size:15px;line-height:1.4;min-height:44px}
.b-onay-satir input{flex:none;width:22px;height:22px;accent-color:var(--elektrik);cursor:pointer}
.b-kvkk-oku{justify-self:start;min-height:44px}

/* ---------- fotoğraf karoları ---------- */
.b-karolar{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.b-oge{position:relative;min-width:0}
.b-karo{position:relative;display:grid;place-items:center;aspect-ratio:3/4;border-radius:18px;overflow:hidden;background:rgba(10,26,63,.6);border:1px solid rgba(110,170,255,.22);isolation:isolate}
.b-karo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* kenar ışığı: --y (0-1) kadar dolar */
.b-karo::after{content:"";position:absolute;inset:0;z-index:4;border-radius:inherit;padding:2px;pointer-events:none;opacity:0;
  background:conic-gradient(from 0deg,#7DB4FF,var(--elektrik) calc(var(--y) * 360deg),transparent 0);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  filter:drop-shadow(0 0 6px rgba(59,139,255,.9));transition:opacity .3s,--y .5s var(--ease)}
.b-oge[data-durum="yukleniyor"] .b-karo::after,.b-oge[data-durum="bekliyor"] .b-karo::after{opacity:1}
.b-oge[data-durum="tamam"] .b-karo::after{opacity:1;--y:1;background:linear-gradient(var(--b-yesil),var(--b-yesil));filter:drop-shadow(0 0 6px rgba(91,227,168,.8));animation:b-bitti 1.6s var(--ease) forwards}
@keyframes b-bitti{0%{opacity:1}100%{opacity:.5}}
.b-karo::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(to top,rgba(4,10,26,.82),transparent 45%);pointer-events:none}
.b-yer{position:relative;z-index:1;display:grid;justify-items:center;gap:6px;padding:10px;text-align:center;font-size:16px;line-height:1.3;color:var(--buz);overflow-wrap:anywhere;max-height:100%}
.b-yer .ico{width:30px;height:30px;color:var(--elektrik)}
.b-yer small{font-size:13px;color:var(--soluk);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.b-yuzde{position:absolute;z-index:5;left:8px;bottom:8px;min-height:28px;padding:2px 10px;border-radius:999px;background:rgba(4,10,26,.8);border:1px solid rgba(110,170,255,.4);
  font-size:16px;font-weight:600;line-height:24px;font-variant-numeric:tabular-nums;color:#fff}
.b-oge[data-durum="tamam"] .b-yuzde{color:var(--b-yesil);border-color:rgba(91,227,168,.5)}
.b-sil{position:absolute;z-index:6;top:0;right:0;width:44px;height:44px;display:grid;place-items:center;border-radius:0 18px 0 14px}
.b-sil span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(4,10,26,.82);border:1px solid rgba(140,190,255,.6)}
.b-sil .ico{width:18px;height:18px;stroke-width:2.2}
.b-oge-hata{display:none}
/* hata ya da süresi dolan karo satırı kaplar; mesaj yalnız bu karoda */
.b-oge.b-hata{grid-column:1/-1;display:grid;grid-template-columns:88px minmax(0,1fr);gap:12px;align-items:start;padding:10px;border-radius:20px;background:rgba(255,138,150,.08);border:1px solid rgba(255,138,150,.5)}
.b-oge.b-hata .b-karo{border-color:rgba(255,138,150,.6)}
.b-oge.b-hata .b-sil{display:none}
.b-oge.b-hata .b-oge-hata{display:grid;gap:8px;align-content:start;font-size:16px;line-height:1.4}
.b-oge-hata p{color:#FFD9DD}
.b-oge-hata .b-ad{color:var(--soluk);overflow-wrap:anywhere}
.b-oge-hata div{display:flex;flex-wrap:wrap;gap:8px}
.b-oge-hata .ikincil{min-height:44px;padding:0 14px}
.b-karo-ekle{border:1.5px dashed rgba(110,170,255,.55);color:var(--buz);align-content:center;gap:6px;cursor:pointer;font-size:16px;font-weight:500;text-align:center;transition:transform .25s var(--yay),border-color .3s,box-shadow .3s}
.b-karo-ekle::before,.b-karo-ekle::after{display:none}
.b-karo-ekle .ico{width:30px;height:30px;color:var(--elektrik)}
.b-karo-ekle:active{transform:scale(.95)}
@media (hover:hover){.b-karo-ekle:hover{border-color:rgba(140,190,255,.9);box-shadow:0 0 26px -6px rgba(59,139,255,.8)}}
/* dosya seçici görünmez; klavye odağı ekleme karosunda görünsün */
.b-grup:has(#b-foto:focus-visible) .b-karo-ekle{outline:2px solid var(--buz);outline-offset:3px}

/* ---------- alt çubuk (panelin parçası; içerik üstüne binmez) ---------- */
.b-alt{flex:none;display:flex;gap:8px;align-items:center;padding:6px 16px calc(var(--sb) + 6px);border-top:1px solid rgba(110,170,255,.18);background:rgba(4,10,26,.94)}
.b-alt .dolu{flex:1;width:auto;min-height:44px;padding:0 12px;font-size:16px;letter-spacing:.06em;white-space:nowrap}
.b-alt .dolu:disabled{opacity:.7;cursor:progress}
.b-geri{flex:none;min-height:44px;padding:0 14px 0 8px;gap:4px;font-size:16px}
.b-geri .ico{width:20px;height:20px}

/* ---------- sonuç ve durum ekranı ---------- */
.b-sonuc{display:grid;justify-items:center;text-align:center;gap:14px;padding:32px 4px 8px;outline:0}
.b-sonuc[hidden]{display:none}
.b-sonuc h1,.b-sonuc h3{font-size:clamp(22px,6vw,30px)}
.b-sonuc p{max-width:24.44em;color:#C9D6EE}
.b-sonuc-ico{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;color:#fff;
  background:radial-gradient(circle at 35% 30%,#3C6FE0,#0E2A72 70%);border:1.5px solid rgba(140,190,255,.8);box-shadow:0 0 0 8px rgba(59,139,255,.08),0 0 40px rgba(59,139,255,.9)}
.b-sonuc-ico .ico{width:40px;height:40px;stroke-width:2.4}
.b-sonuc.uyari .b-sonuc-ico{background:radial-gradient(circle at 35% 30%,#E8792F,#7A2E08 70%);border-color:rgba(255,200,160,.8);box-shadow:0 0 0 8px rgba(255,154,77,.08),0 0 40px rgba(255,154,77,.7)}
.b-sonuc-eylem{display:grid;gap:10px;width:100%;max-width:380px;margin-top:6px;justify-items:center}
.b-sonuc-eylem .dolu,.b-sonuc-eylem .ikincil{width:100%}
.b-sonuc-sayfa{max-width:560px;margin:32px auto 0;padding:32px 20px}

/* yüklenemedi */
.b-yok{display:grid;justify-items:center;text-align:center;gap:12px;padding:48px 8px}
.b-yok .ico{width:44px;height:44px;color:var(--kor)}
.b-yok p{color:var(--soluk);max-width:22em}

/* ---------- KVKK metni (modal) ---------- */
.b-kvkk{position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:none;max-height:calc(100dvh - var(--st) - 16px);padding:0;border:1px solid rgba(110,170,255,.45);border-bottom:0;
  border-radius:28px 28px 0 0;background:linear-gradient(180deg,#0E2560,#06122F 30%,#040A1A);color:var(--metin);box-shadow:0 -10px 50px -10px rgba(59,139,255,.55)}
.b-kvkk[open]{display:flex;flex-direction:column}
.b-kvkk::backdrop{background:rgba(2,6,18,.7)}
.b-kvkk-bas{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px 8px}
.b-kvkk-bas h3{font-size:19px}
.b-kvkk-metin{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:8px 20px 20px;font-size:16px;line-height:1.6;color:#D3DEF2}
.b-kvkk-metin p,.b-kvkk-metin ul,.b-kvkk-metin ol{margin:0 0 12px}
.b-kvkk-metin ul,.b-kvkk-metin ol{padding-left:22px}
.b-kvkk-metin strong,.b-kvkk-metin b{color:#fff}
.b-kvkk-metin a{color:var(--buz);text-decoration:underline}
.b-kvkk-metin [style*="font-size"]{font-size:16px!important}
.b-kvkk-alt{flex:none;padding:12px 20px calc(var(--sb) + 14px);border-top:1px solid rgba(110,170,255,.18)}

/* ---------- /basvuru sayfasının kendisi (panelin arkası) ---------- */
.b-giris{display:grid;gap:12px;justify-items:start;max-width:37.88em}
.b-giris h1{font-size:clamp(28px,7.4vw,48px)}
.b-giris .alt{font-size:17px}
.b-baslat{margin-top:6px}
.b-sss{display:grid;gap:10px;max-width:760px}
.b-sss .bolum-bas{margin-bottom:6px}
.b-sss-oge{padding:0;border-radius:20px}
.b-sss-oge summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:12px 18px;font-weight:600}
.b-sss-oge summary::-webkit-details-marker{display:none}
.b-sss-oge summary::after{content:"";flex:none;width:10px;height:10px;border-right:2px solid var(--buz);border-bottom:2px solid var(--buz);transform:rotate(45deg);transition:transform .3s var(--ease);margin-top:-4px}
.b-sss-oge[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.b-sss-oge p{padding:0 18px 16px;color:#C3D2EE;max-width:39.71em}

/* ---------- tablet ve masaüstü ---------- */
@media (min-width:600px){
  .b-karolar{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:1024px){
  .b-sayfa{left:auto;top:0;width:var(--b-gen);border-radius:32px 0 0 32px;border:1px solid rgba(110,170,255,.45);border-right:0;transform:translateX(105%)}
  .b-bas{touch-action:auto;cursor:auto;padding:14px 20px 4px}
  .b-govde{padding:12px 20px 24px}
  .b-alt{padding:8px 20px 12px}
  .b-bas::before{display:none}
  .b-karolar{grid-template-columns:repeat(3,minmax(0,1fr))}
  .b-kvkk{inset:0;margin:auto;width:min(680px,calc(100vw - 48px));max-height:min(80vh,820px);border-radius:28px;border-bottom:1px solid rgba(110,170,255,.45)}
  .b-kvkk-alt{padding-bottom:16px}
  /* /basvuru: metin solda, panel sağda; perde metni karartmaz */
  .basvuru-sayfasi .b-sayfa-ic{padding-right:calc(var(--b-gen) - 40px)}
  html.b-acik .basvuru-sayfasi .b-perde{background:rgba(2,6,18,.25)}
}
@media (min-width:1024px) and (max-width:1279px){
  .basvuru-sayfasi .b-sayfa-ic{padding-right:0}
}