/* ===========================================================================
   SIPARIS SORGULA SAYFASI (07.09.2026, Ozgur - Claude Design handoff
   "Oyuneks Siparis Sorgula")

   Sayfa kurumsal sol menu kabugunun DISINDA, tam genislikte basilir
   (master.blade.php istisnasi); ustte kurumsal sekme seridi
   (css/kurumsal-sekmeler.css, --ku* tokenlar). Icerik sitenin .container'ina
   (1550px) oturur; tuvaldeki 1920/100px kenar bosluklari yerine header ile
   ayni hiza. Yazi tipi sitenin kendi fontu (Wix Madefor Display).

   Yapi: iki kolon (1fr anlatim + 520px form karti). Form karti TEK karttir;
   adim 1 (Bilgiler) -> KOD AL -> adim 2 (Dogrulama: 6 haneli kod kutulari,
   geri sayim, tekrar gonder) -> SIPARISI SORGULA -> /siparis-detay.
   Durum sinifi kok elemanda: .soSayfa[data-adim="1|2"].

   Eski css/inquire-order.css bu sayfadan kalkti (document-upload ve
   Orders/inquire-order hala kullaniyor, dosya silinmedi).
   =========================================================================== */
.soSayfa {
    --soGiris: #111117;               /* alan zemini */
    --soAyrac: #2A2B38;
    --soMor: #343891; --soMorKenar: #484CA8; --soMorHover: #3F44A8; --soMorUstu: #EDEEF6;
    --soHata: #E0553F;
    --soKodDolu: rgba(128,241,177,.45);
    color: var(--kuMetin); padding-bottom: 80px;
}
body.light .soSayfa {
    --soGiris: #F5F4EE;
    --soAyrac: #E8E6DF;
    --soKodDolu: rgba(19,126,76,.45);
}
.soSayfa a { color: var(--kuNane); }
.soSayfa a:hover { color: var(--kuNaneHover); }
.soSayfa button { font-family: inherit; }

/* ---- Iki kolon ---------------------------------------------------------------- */
.soIzgara { padding-top: 48px; display: grid; grid-template-columns: minmax(0, 1fr) 520px; gap: 60px; align-items: start; }

/* Sol: anlatim + yardim kartlari */
.soAnlatim { display: flex; flex-direction: column; gap: 24px; max-width: 720px; }
.soHero { display: flex; flex-direction: column; gap: 12px; }
.soEtiket { font-size: 11px; font-weight: 800; letter-spacing: 1.4px; color: var(--kuNane); text-transform: uppercase; }
.soHero h1 { margin: 0; font-size: 44px; font-weight: 800; letter-spacing: -1.1px; line-height: 1.05; color: var(--kuBaslik); text-wrap: balance; }
.soHero p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--kuUcuncul); text-wrap: pretty; }
.soYardimlar { display: flex; flex-direction: column; gap: 10px; }
.soYardim { display: flex; gap: 12px; padding: 14px 16px; background: var(--kuKart); border: 1px solid var(--kuKenar); border-radius: 12px; box-shadow: var(--kuKartGolge); }
.soYardimIkon { flex: none; width: 34px; height: 34px; border-radius: 9px; background: var(--kuNaneZemin); display: flex; align-items: center; justify-content: center; color: var(--kuNane); }
.soYardimIkon svg { width: 15px; height: 15px; }
.soYardimMetin { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.soYardimMetin b { font-size: 13px; font-weight: 700; color: var(--kuMetin); }
.soYardimMetin p { margin: 0; font-size: 12px; line-height: 1.5; color: var(--kuUcuncul); }
.soYardimMetin p strong { color: var(--kuMetin); font-weight: 700; }

/* Sag: form karti */
.soForm { display: flex; flex-direction: column; gap: 10px; }
.soKart { background: var(--kuKart); border: 1px solid var(--kuKenar); border-radius: 16px; overflow: hidden; box-shadow: var(--kuKartGolge); }

/* Adim seridi: 3 adim, 28px daire + etiket + baglanti cizgisi */
.soAdimlar { display: flex; align-items: center; padding: 18px 20px; background: var(--kuBant); border-bottom: 1px solid var(--kuKenar); }
.soAdim { flex: 1; display: flex; align-items: center; gap: 10px; min-width: 0; }
.soAdim:last-child { flex: none; }
.soAdimNo { flex: none; width: 28px; height: 28px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; background: var(--kuKart); border: 1px solid var(--kuKenar); color: var(--kuUcuncul); }
.soAdimNo svg { width: 12px; height: 12px; display: none; }
.soAdimAd { font-size: 12.5px; font-weight: 700; color: var(--kuUcuncul); white-space: nowrap; }
.soAdimCizgi { flex: 1; height: 1px; min-width: 20px; background: var(--kuKenar); }
.soAdim.aktif .soAdimNo { background: var(--kuNane); border-color: var(--kuNane); color: var(--kuNaneUstu); }
.soAdim.aktif .soAdimAd { color: var(--kuBaslik); }
.soAdim.tamam .soAdimNo { background: var(--kuNaneZemin); border-color: var(--kuNaneKenarHover); color: var(--kuNane); }
.soAdim.tamam .soAdimNo span { display: none; }
.soAdim.tamam .soAdimNo svg { display: block; }
.soAdim.tamam .soAdimAd { color: var(--kuMetin); }
.soAdim.tamam .soAdimCizgi { background: var(--kuNaneKenarHover); }

/* Alanlar */
.soGovde { padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 16px; }
.soAlan { display: flex; flex-direction: column; gap: 6px; }
.soAlan label { font-size: 11px; font-weight: 700; color: var(--kuGovde); margin: 0; }
.soSayfa .soGiris {
    width: 100%; height: 46px; padding: 0 14px; margin: 0; background: var(--soGiris); border: 1px solid var(--kuKenar); border-radius: 10px;
    font-family: inherit; font-size: 13.5px; color: var(--kuMetin); outline: 0; box-shadow: none; transition: border-color .16s;
}
.soSayfa .soGiris::placeholder { color: var(--kuUcuncul); opacity: 1; }
.soSayfa .soGiris:focus { border-color: var(--kuNane); }
.soSayfa .soGiris[readonly] { font-weight: 600; }
.soAlan.hatali .soGiris, .soAlan.hatali .soGsm { border-color: var(--soHata); }
/* Masaustu: [GSM kutusu][KOD AL] yan yana, ipucu ikisinin altinda tam satir; mobilde tek sutun (asagida) */
.soGsmSatir { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-auto-flow: dense; gap: 8px 10px; align-items: start; }
.soGsmSatir .soIpucu { grid-column: 1 / -1; }
.soGsmSatir .soKodAl { grid-column: 2; grid-row: 1; }
.soGsm { flex: 1; min-width: 0; height: 46px; display: flex; align-items: center; background: var(--soGiris); border: 1px solid var(--kuKenar); border-radius: 10px; overflow: hidden; transition: border-color .16s; }
.soGsm:focus-within { border-color: var(--kuNane); }
.soGsmOnek { flex: none; height: 46px; padding: 0 12px; display: flex; align-items: center; border-right: 1px solid var(--kuKenar); font-size: 13.5px; font-weight: 700; color: var(--kuMetin); }
.soSayfa .soGsm .soGiris { border: 0; border-radius: 0; background: transparent; height: 44px; }
.soIpucu { font-size: 11.5px; line-height: 1.5; color: var(--kuUcuncul); }
.soHataMetin { display: none; font-size: 11.5px; line-height: 1.4; color: var(--soHata); }
.soAlan.hatali .soHataMetin { display: block; }
.soBasari { display: none; font-size: 11.5px; line-height: 1.5; color: var(--kuNane); }
.soBasari.goster { display: block; }

/* Dugmeler */
.soSayfa .soBtn {
    flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 18px; border-radius: 10px;
    border: 1px solid transparent; font-size: 13px; font-weight: 800; white-space: nowrap; cursor: pointer; transition: filter .16s, background .16s, border-color .16s;
}
.soSayfa .soBtn svg { width: 14px; height: 14px; flex: none; }
.soSayfa .soBtn.nane { background: var(--kuNane); border-color: var(--kuNane); color: var(--kuNaneUstu); }
.soSayfa .soBtn.nane:hover { filter: brightness(1.08); }
.soSayfa .soBtn.ikincil { background: var(--kuKart); border-color: var(--kuKenarBelirgin); color: var(--kuMetin); }
.soSayfa .soBtn.ikincil:hover { background: var(--kuKartHover); border-color: var(--kuNane); }
.soSayfa .soBtn:disabled, .soSayfa .soBtn[aria-disabled="true"] { cursor: default; filter: none; background: var(--kuKart); border-color: var(--kuKenar); color: var(--kuUcuncul); }
.soSayfa .soBtn.yukleniyor { pointer-events: none; opacity: .7; }
.soSayfa .soGonder {
    width: 100%; display: flex; align-items: center; justify-content: center; gap: 9px; height: 48px; border-radius: 10px;
    background: var(--kuKart); border: 1px solid var(--kuKenar); color: var(--kuUcuncul); font-size: 14px; font-weight: 800; cursor: default; transition: background .16s;
}
.soSayfa .soGonder svg { width: 16px; height: 16px; }
.soSayfa[data-adim="2"] .soGonder { background: var(--soMor); border-color: var(--soMorKenar); color: var(--soMorUstu); cursor: pointer; }
.soSayfa[data-adim="2"] .soGonder:hover { background: var(--soMorHover); }
.soSayfa .soGonder:disabled { opacity: .7; cursor: default; }

/* Adim 2: dogrulama blogu (adim 1'de gizli) */
.soKodBlok { display: none; flex-direction: column; gap: 6px; padding-top: 16px; border-top: 1px solid var(--soAyrac); }
.soSayfa[data-adim="2"] .soKodBlok { display: flex; }
.soKodBaslik { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.soSure { font-size: 11.5px; color: var(--kuUcuncul); }
.soSure b { color: var(--kuMetin); font-weight: 700; font-variant-numeric: tabular-nums; }
.soSure.bitti b { color: var(--soHata); }
.soKutular { display: flex; gap: 8px; }
.soSayfa .soKutu {
    flex: 1; min-width: 0; height: 52px; padding: 0; text-align: center; background: var(--soGiris); border: 1px solid var(--kuKenar); border-radius: 10px;
    font-family: inherit; font-size: 20px; font-weight: 800; color: var(--kuBaslik); font-variant-numeric: tabular-nums; outline: 0; box-shadow: none; caret-color: var(--kuNane);
    transition: border-color .16s;
}
.soSayfa .soKutu:focus { border-color: var(--kuKenarBelirgin); }
.soSayfa .soKutu.dolu { border-color: var(--soKodDolu); }
.soKodBlok.hatali .soKutu { border-color: var(--soHata); }
.soKodBlok.hatali .soHataMetin { display: block; }
.soTekrarSatir { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 2px; }
.soTekrarSatir .soIpucu { flex: 1; }
.soSayfa .soTekrar { flex: none; padding: 0; height: auto; border: 0; background: transparent; font-size: 12px; font-weight: 700; color: var(--kuNane); cursor: pointer; }
.soSayfa .soTekrar:disabled { color: var(--kuUcuncul); opacity: .75; cursor: default; }
/* Adim 2'de KOD AL "YENIDEN" ikincil gorunume gecer; sayaç bitene kadar pasif */
.soSayfa[data-adim="2"] .soKodAl { background: var(--kuKart); border-color: var(--kuKenarBelirgin); color: var(--kuMetin); }
.soSayfa[data-adim="2"] .soKodAl .soKodAlMetin { display: none; }
.soSayfa[data-adim="2"] .soKodAl .soYenidenMetin { display: inline; }
.soKodAl .soYenidenMetin { display: none; }

/* Gizlilik notu */
.soNot { display: flex; align-items: center; gap: 10px; margin-top: 4px; padding: 13px 16px; background: var(--kuKart); border: 1px solid var(--kuKenar); border-radius: 12px; box-shadow: var(--kuKartGolge); }
.soNot svg { flex: none; width: 15px; height: 15px; color: var(--kuNane); }
.soNot p { margin: 0; font-size: 12px; line-height: 1.5; color: var(--kuUcuncul); }

/* ---- Mobil ≤991: tek kolon ------------------------------------------------------ */
@media (max-width: 991.98px) {
    .soSayfa { padding-bottom: 40px; }
    .soIzgara { padding-top: 24px; grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .soAnlatim { gap: 18px; max-width: none; }
    .soHero h1 { font-size: 30px; letter-spacing: -.8px; }
    .soHero p { font-size: 13.5px; }
    .soAdimlar { gap: 4px; padding: 14px; overflow-x: auto; scrollbar-width: none; }
    .soAdimlar::-webkit-scrollbar { display: none; }
    .soAdim { flex: none; gap: 8px; }
    .soAdimCizgi { flex: none; width: 14px; min-width: 0; }
    .soGovde { padding: 18px 14px; gap: 14px; }
    /* GSM alani + ipucu + KOD AL alt alta; adim 2'de YENIDEN gizli (tek kontrol: Tekrar gonder) */
    .soGsmSatir { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    .soGsmSatir .soKodAl { grid-column: 1; grid-row: auto; }
    .soGsmSatir .soIpucu { order: 2; }
    .soSayfa .soKodAl { order: 3; width: 100%; }
    .soSayfa[data-adim="2"] .soKodAl { display: none; }
    .soKutular { gap: 6px; }
    .soSayfa .soKutu { height: 48px; }
    .soTekrarSatir { flex-direction: column; align-items: stretch; gap: 8px; padding-top: 4px; }
    .soSayfa .soTekrar { display: flex; align-items: center; justify-content: center; height: 44px; border-radius: 10px; border: 1px solid var(--kuKenar); font-size: 12.5px; white-space: nowrap; }
    .soSayfa .soTekrar:not(:disabled) { border-color: var(--kuKenarBelirgin); }
}