:root{--murekkep:#0f1115;--murekkep2:#161a21;--cizgi:#262b34;--krom:#c9ced6;--krom2:#8f96a3;--kirmizi:#e0192d;--kirmizi2:#b3121b;--beyaz:#f4f5f7;--radius:2px}
*{box-sizing:border-box}
/* .kfg-katman/.kfg-form gibi display veren kurallar tarayicinin [hidden] kuralini
   ezer; hidden ozelligi ile gizlenen her ogeyi gercekten gizli tut. */
[hidden]{display:none!important}
/* overflow-x: clip, hidden DEGIL. hidden body'yi bir kaydirma konteynerine
   cevirip icindeki position:sticky ogeleri kirar (ana sayfada Kapla
   bolumunun sol sutunu bu yuzden asili kalmiyordu). Bu dosya vitrin.css'ten
   SONRA yuklendigi icin oradaki dogru clip kuralini eziyordu. */
html,body{margin:0;background:var(--murekkep);color:var(--beyaz);font:15px/1.55 Inter,system-ui,"Segoe UI",sans-serif;overflow-x:clip}
.kfg-ust{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;padding:18px 24px;border-bottom:1px solid var(--cizgi);background:var(--murekkep2)}
.kfg-marka{color:var(--beyaz);text-decoration:none;font-weight:800;letter-spacing:.14em}
.kfg-marka span{color:var(--kirmizi);font-weight:600}
.kfg-slogan{margin:0;color:var(--krom2);font-size:13px}
.kfg{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;padding:20px;align-items:start}
.kfg-sahne{background:var(--murekkep2);border:1px solid var(--cizgi);border-radius:var(--radius);padding:12px;min-width:0;width:100%}
/* Sol sutun: dis hucre uzar (yapiskanligin kayacak alani buradan gelir), ic
   blok ekranda asili kalir. Yapiskanligi dogrudan .kfg-sahne'ye vermek
   calismiyor: .kfg'nin align-items:start kurali hucreyi icerik boyuna
   kucultup kayacak alani yok ediyor. */
.kfg-sol{align-self:stretch;min-width:0}
.kfg-sol__yapiskan{position:sticky;top:92px;display:grid;gap:12px;align-content:start;min-width:0}
/* Konfiguratorde bulunmayan araclar icin capraz yonlendirme */
.kfg-capraz{display:grid;grid-template-columns:minmax(0,1fr) 18px;align-items:center;gap:4px 12px;padding:13px 15px;background:var(--murekkep2);border:1px solid var(--cizgi);border-left:2px solid var(--kirmizi);border-radius:var(--radius);color:var(--krom2);text-decoration:none;transition:border-color .18s ease,background-color .18s ease}
.kfg-capraz:hover{border-color:var(--kirmizi);background:rgba(224,25,45,.06)}
.kfg-capraz__etiket{grid-column:1;font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--kirmizi)}
.kfg-capraz__metin{grid-column:1;font-size:13px;line-height:1.45;color:var(--beyaz)}
.kfg-capraz svg{grid-column:2;grid-row:1 / span 2;color:var(--kirmizi)}
.kfg-not{margin:0;padding:11px 13px;background:var(--murekkep);border:1px solid var(--cizgi);border-radius:var(--radius);color:var(--krom2);font-size:12px;line-height:1.5}
#sahne{width:100%;min-height:420px}
#sahne canvas{display:block;width:100%;height:auto;touch-action:none}
.kfg-durum{margin:8px 0 0;color:var(--krom2);font-size:13px}
.kfg-durum--hata{color:var(--kirmizi)}
.kfg-ipucu{margin:6px 0 0;color:var(--krom2);font-size:12px;letter-spacing:.04em;text-transform:uppercase}
.kfg-panel{display:grid;gap:16px;min-width:0}
.kfg-blok{background:var(--murekkep2);border:1px solid var(--cizgi);border-radius:var(--radius);padding:14px;min-width:0}
.kfg-blok h2{margin:0 0 12px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--krom)}
.kfg-arac-izgara{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.kfg-arac{display:grid;gap:2px;padding:10px;background:var(--murekkep);border:1px solid var(--cizgi);color:var(--beyaz);cursor:pointer;text-align:left;font:inherit;border-radius:var(--radius);min-width:0}
.kfg-arac b{font-size:13px}
.kfg-arac small{color:var(--krom2);font-size:11px}
.kfg-arac[aria-pressed="true"]{border-color:var(--kirmizi);box-shadow:inset 0 0 0 1px var(--kirmizi)}
.kfg-filtre{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.kfg-filtre label{display:grid;gap:4px;font-size:11px;color:var(--krom2);text-transform:uppercase;letter-spacing:.06em;flex:1;min-width:120px}
.kfg-filtre select{background:var(--murekkep);border:1px solid var(--cizgi);color:var(--beyaz);padding:8px;font:inherit;border-radius:var(--radius);width:100%;min-width:0}
.kfg-renk-izgara{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}
.kfg-renk{display:grid;gap:6px;padding:6px;background:var(--murekkep);border:1px solid var(--cizgi);cursor:pointer;font:inherit;color:var(--beyaz);border-radius:var(--radius);min-width:0}
.kfg-renk i{display:block;height:44px;border:1px solid var(--cizgi)}
.kfg-renk span{font-size:11px;line-height:1.25;word-break:break-word}
.kfg-renk small{color:var(--krom2);font-size:10px;text-transform:uppercase;letter-spacing:.06em}
.kfg-renk[aria-pressed="true"]{border-color:var(--kirmizi);box-shadow:inset 0 0 0 1px var(--kirmizi)}
.kfg-bolge-listesi{display:flex;flex-wrap:wrap;gap:8px}
.kfg-bolge{padding:8px 12px;background:var(--murekkep);border:1px solid var(--cizgi);color:var(--beyaz);cursor:pointer;font:inherit;font-size:13px;border-radius:var(--radius)}
.kfg-bolge[aria-pressed="true"]{border-color:var(--kirmizi);color:var(--kirmizi)}
.kfg-bolge[disabled]{opacity:.4;cursor:not-allowed}
.kfg-ozet{display:grid;gap:10px;background:var(--murekkep2);border:1px solid var(--cizgi);border-radius:var(--radius);padding:14px}
#secim-ozet{margin:0;font-size:13px;color:var(--krom2)}
.kfg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border:1px solid var(--krom2);background:transparent;color:var(--beyaz);border-radius:var(--radius);cursor:pointer;font:inherit;font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:12px}
.kfg-btn--kirmizi{background:var(--kirmizi);border-color:var(--kirmizi)}
.kfg-btn--kirmizi:hover:not([disabled]){background:var(--kirmizi2)}
.kfg-btn[disabled]{opacity:.45;cursor:not-allowed}
.kfg-katman{position:fixed;inset:0;background:rgba(8,9,12,.82);display:grid;place-items:center;padding:16px;z-index:20}
.kfg-kutu{width:min(440px,100%);max-height:92vh;overflow:auto;background:var(--murekkep2);border:1px solid var(--cizgi);border-top:4px solid var(--kirmizi);padding:22px}
.kfg-kutu h2{margin:0 0 6px;font-size:16px;letter-spacing:.08em;text-transform:uppercase}
.kfg-kutu-ozet{margin:0 0 14px;color:var(--krom2);font-size:13px}
.kfg-form{display:grid;gap:12px}
.kfg-form label{display:grid;gap:5px;font-size:12px;color:var(--krom2)}
.kfg-form input,.kfg-form textarea{background:var(--murekkep);border:1px solid var(--cizgi);color:var(--beyaz);padding:10px;font:inherit;border-radius:var(--radius);width:100%;min-width:0}
.kfg-onay{display:flex!important;align-items:flex-start;gap:8px;font-size:12px;color:var(--krom2)}
.kfg-onay input{width:auto;flex:none;margin-top:2px}
.kfg-hata{margin:0;color:var(--kirmizi);font-size:13px}
.kfg-sonuc{margin:12px 0 0;color:#2fb36b;font-size:14px}
.kfg-kutu-islem{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
@media (max-width:980px){
  .kfg{grid-template-columns:1fr;padding:14px;gap:14px}
  #sahne{min-height:320px}
  /* Tek sutuna ininde yapiskanlik anlamsiz: blok panelin onunu kapatir. */
  .kfg-sol__yapiskan{position:static}
}