/* =====================================================================
   B2B B2B v3 — MAKİNE SİPARİŞ ARAYÜZÜ
   ---------------------------------------------------------------------
   DÜZEN KURALI (Not 1)
     Sayfa (body) DİKEY KAYMAZ. Yükseklik ekran yüksekliğine sabitlenir,
     kaydırma yalnız panellerin kendi içinde olur. "Seçilen opsiyonlar"
     şeridi her çözünürlükte ekranda kalır.
   KIRILIM NOKTALARI (Not 7)
     >= 1400px  masaüstü, fiyat paneli görselin üzerinde yüzer
     1024–1399  masaüstü/tablet yatay, fiyat paneli akışa girer
     768–1023   tablet, paneller alt alta
     < 768      telefon, sekmeli tek panel + alt fiyat çubuğu
   ===================================================================== */

/* Renk token'lari, kirilim noktalari, odak halkasi, dokunma hedefi ve
   yazdirma kurallari assets/b2b-base.css dosyasindan gelir.
   Burada ayni isimlerle bir kopya duruyordu; ortak dosya ONCE yuklendigi
   icin bu kopya onu eziyordu ve --muted gibi ortak iyilestirmeler bu
   yuzeyde uygulanmiyordu (olculdu: acik zeminde 4.35 kontrast).
   Kopya kaldirildi, bu dosya yalnizca MAKINE SIPARISE OZGU olani icerir. */

/* Yeni not — koyu/açık tema. Tercih localStorage'da (aynı domain'deki tüm
   B2B alt siteleriyle ortak anahtar) tutulur; <html data-theme="dark">
   ile açılır. Aşağıdaki değişkenler yeniden tanımlanınca sayfanın geneli
   otomatik uyum sağlar (bkz. bu dosyadaki background:var(--surface) vb.). */

*{box-sizing:border-box}
/* hidden özniteliği display:flex/grid tanımlarını ezmelidir — aksi hâlde
   gizli katmanlar tıklamayı yakalar. */
[hidden]{display:none!important}
html,body{height:100%}
body{
  margin:0; font-family:var(--font); color:var(--ink); background:var(--paper);
  display:flex; flex-direction:column; overflow:hidden;         /* Not 1 */
  -webkit-font-smoothing:antialiased;
}
button{font:inherit;color:inherit}
img{display:block}
/* Güvenlik ağı: tarayıcı varsayılan form kontrolleri temayı takip etmez;
   burada temel bir renk verilir, daha özel kurallar (örn. .row-edit-input)
   zaten daha yüksek özgüllükle bunu ezer. */
input,select,textarea{background:var(--surface);color:var(--ink);border-color:var(--line)}
:focus-visible{outline:2px solid var(--red);outline-offset:2px;border-radius:4px}

/* ---------------------------------------------------------- başlık */
.site-header{
  flex:0 0 auto; background:var(--surface); border-bottom:1px solid var(--line);
  display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:16px; padding:8px 20px; min-height:var(--header-h);
}
.brand-button{
  display:flex; align-items:center; gap:12px; background:none; border:0;
  cursor:pointer; padding:0; text-align:left;min-width:0;
  text-decoration:none; color:inherit;
}
.brand-button img{height:30px;width:auto}

/* Not 2 (yeşil) — "Ürün değiştir" ve fiyat listesi tarihi logonun altında */
.header-context{
  grid-column:1; display:flex; align-items:center; gap:10px;
  margin-top:2px; min-height:var(--context-h);min-width:0;max-width:100%;
}
.header-context[hidden]{display:none}
.header-context-meta{font-size:11.5px;color:var(--muted);white-space:nowrap}

/* Menu daha once flex-wrap:wrap idi: orta sutun daralinca her baglanti alt
   alta gecip basligi 300 px'e kadar sisiriyordu (1123-1366 px'de 6 satir,
   1600 px'de 2 satir olctuk) ve konfigurator panellerine yer kalmiyordu.
   Artik tek satirda kalir, sigmazsa kendi icinde yatay kayar. */
.main-nav{
  grid-column:2;display:flex;justify-content:center;gap:4px;
  flex-wrap:nowrap;overflow-x:auto;min-width:0;scrollbar-width:none;
}
.main-nav::-webkit-scrollbar{display:none}
.nav-link{flex:0 0 auto;white-space:nowrap}
.nav-secondary{display:contents}
.nav-more-items{display:flex;gap:4px}
.nav-more-toggle,.nav-short{display:none}
.nav-link{
  background:none;border:0;padding:7px 14px;border-radius:999px;
  font-size:13.5px;color:var(--muted);cursor:pointer;
}
.nav-link:hover{background:var(--line-soft);color:var(--ink)}
.nav-link.active{color:var(--ink);font-weight:600;background:var(--line-soft)}

.header-actions{grid-column:3;display:flex;align-items:center;gap:10px}
.header-tools-panel{display:flex;align-items:center;gap:10px}
.ghost-button.header-tools-toggle{display:none}
.header-tools-toggle .header-tools-emblem{
  display:block;width:28px;height:28px;object-fit:contain;
  filter:grayscale(1) brightness(1.2);
}
:root[data-theme="dark"] .header-tools-toggle .header-tools-emblem{
  filter:grayscale(1) brightness(2.2);
}
.rate-chip{
  display:flex;flex-direction:column;line-height:1.15;font-size:10.5px;color:var(--muted);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:4px 10px;
}
.rate-chip strong{font-size:12px;color:var(--ink);font-variant-numeric:tabular-nums}
.ghost-button,.session-button{
  border:1px solid var(--line);background:var(--surface);border-radius:999px;
  padding:6px 12px;font-size:12.5px;cursor:pointer;display:flex;align-items:center;gap:8px;
}
/* Cikis yap — b2bbayiportal'daki koyu .dark-button ile ayni renk
   (var(--panel)/var(--on-deep)), bu basligin kompakt olcusune uydurulmus. */
.logout-button{
  border:0;background:var(--panel);color:var(--on-deep);border-radius:999px;
  padding:6px 14px;font-size:12.5px;font-weight:700;cursor:pointer;
  display:flex;align-items:center;gap:6px;
}
.logout-button:hover{opacity:.88}
.logout-button:disabled{opacity:.6;cursor:default}

.session-button b{font-size:11px;color:var(--red-text);font-weight:600}
.session-button.impersonating{border-color:var(--warn);background:var(--warn-bg)}

/* Not 5 (v2) — opsiyona göre makine fotoğrafı: otomatik/manuel anahtarı */
.photo-mode-group{display:flex;align-items:center;gap:8px}
.photo-mode-label{font-size:11px;color:var(--muted);white-space:nowrap}
.photo-mode-segmented.segmented{gap:0;border:1px solid var(--line);border-radius:999px;padding:2px;flex-wrap:nowrap}
.photo-mode-segmented .segment{
  border:0;background:transparent;border-radius:999px;padding:5px 12px;font-size:12px;min-width:0;
}
.photo-mode-segmented .segment.active{background:var(--panel);color:#fff;font-weight:600}
.photo-fetch-btn{transition:opacity .16s ease}
.photo-fetch-btn.is-inactive{opacity:.35;pointer-events:none;cursor:default}
.photo-fetch-btn:disabled{opacity:.35;cursor:default}
.cart-button{
  /* Yeni not 15 — arka plan sabit koyu (--panel) olmalı; --ink koyu modda
     açık renge döndüğü için burada kullanılırsa metin (beyaz) görünmez
     kalıyordu. */
  background:var(--panel);color:#fff;border:0;border-radius:999px;
  padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;display:flex;gap:8px;align-items:center;
}
.cart-button b{background:var(--red);color:var(--on-red);border-radius:999px;padding:1px 7px;font-size:11px}

/* ------------------------------------------------- temsil çubuğu */
.impersonation-bar{
  flex:0 0 auto; display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:#1d2126; color:#fff; padding:8px 20px; font-size:13px;
}
.impersonation-dot{width:8px;height:8px;border-radius:50%;background:#f0b429;box-shadow:0 0 0 4px rgba(240,180,41,.2)}
.impersonation-meta{color:#a9b2b9;font-size:12px}
.impersonation-bar button{
  margin-left:auto;background:#fff;color:#15181b;border:0;border-radius:999px;
  padding:5px 14px;font-size:12px;font-weight:600;cursor:pointer;
}

/* Yeni not 8 — oturum yokken menü/sepet/kur çubuğu gizlenir, sadece
   marka logosu ve giriş kartı görünür kalır. */
body.needs-auth .main-nav,
body.needs-auth .header-actions .rate-chip,
body.needs-auth .header-actions .cart-button,
body.needs-auth .header-actions #layoutToggle,
body.needs-auth .header-actions #photoModeGroup{display:none}

/* ------------------------------------------------------- gövde */
#app{flex:1 1 auto;min-height:0;overflow:hidden;padding:14px 20px 16px}
.page{height:100%;min-height:0}

/* Giriş duvarı (auth-gate) */
.auth-gate{display:flex;align-items:center;justify-content:center}
.auth-gate-card{
  max-width:440px;width:100%;text-align:center;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);box-shadow:var(--shadow);padding:40px 32px;
  display:flex;flex-direction:column;align-items:center;gap:10px;
}
.auth-gate-logo{height:40px;margin-bottom:6px}
.auth-gate-card .kicker{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.auth-gate-card h1{margin:0;font-size:19px}
.auth-gate-card p{margin:0;font-size:13px;color:var(--muted);line-height:1.6}
.auth-gate-loading{margin:10px 0 0;font-size:13.5px;color:var(--muted)}
.auth-gate-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:10px}
.auth-gate-actions .button{text-decoration:none;display:inline-flex;align-items:center}
.auth-gate-form{display:flex;flex-direction:column;gap:12px;width:100%;margin-top:6px;text-align:left}
.auth-gate-form .field input{width:100%}
.auth-gate-submit{width:100%;justify-content:center}
.auth-gate-error{margin:0;font-size:12.5px;color:var(--red-text);text-align:left}
.auth-gate-note{margin:8px 0 0;font-size:12.5px;color:var(--muted)}
.auth-gate-note a{color:var(--red-text);font-weight:600}

/* Ürün seçimi ekranı kendi içinde kayabilir */
.category-page{overflow-y:auto;padding-right:6px}
.category-intro{max-width:60ch;margin:8px 0 22px}
.category-intro .kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.category-intro h1{font-size:clamp(26px,3.4vw,38px);margin:8px 0 8px;letter-spacing:-.02em}
.category-intro p{color:var(--muted);margin:0;font-size:15px}
.category-intro.compact h1{font-size:clamp(22px,2.6vw,28px)}
.category-nav-row{margin-bottom:8px}
.category-intro.category-intro-row{display:flex;align-items:flex-start;justify-content:space-between;gap:clamp(18px,4vw,64px);width:100%;max-width:1120px;min-width:0}
.category-intro-copy{flex:1 1 60ch;max-width:60ch;min-width:0}
.cart-currency-control{
  flex:0 1 330px;min-width:250px;max-width:100%;margin-top:26px;
  padding:12px 14px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius-sm);box-shadow:var(--shadow);
}
.cart-currency-label{display:block;margin-bottom:8px;color:var(--red-text);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.cart-currency-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:3px;background:var(--surface-soft);border:1px solid var(--line);border-radius:999px}
.cart-currency-options button{
  min-width:0;min-height:44px;padding:8px 10px;border:1px solid transparent;border-radius:999px;
  background:transparent;color:var(--ink);font-size:13px;font-weight:600;cursor:pointer;
}
.cart-currency-options button:hover{border-color:var(--line-strong)}
.cart-currency-options button.active,.cart-currency-options button[aria-pressed="true"]{background:var(--panel);color:var(--on-deep)}
.cart-currency-mixed{display:block;margin-top:8px;color:var(--muted);font-size:11.5px;line-height:1.35}
@media (max-width:860px){
  .category-intro-row{flex-direction:column;align-items:stretch;gap:0}
  .category-intro-copy{flex:0 1 auto;max-width:none;margin-bottom:12px}
  .cart-currency-control{flex:0 1 auto;width:100%;min-width:0;margin:0}
}

/* GERİ DÖNÜŞ DÜĞMESİ (.back-button)
   Hem kategori sayfalarında hem de konfigüratör başlığında kullanılır.
   Renkleri BİLEREK değişkenlere (--red vb.) bağlanmadı: koyu temada --red
   açık bir kırmızıya dönüyor ve üzerindeki beyaz yazının okunurluğu düşüyordu.
   Sabit marka kırmızısı #e2231a üzerinde beyaz yazı her iki temada da
   4,69:1 kontrast verir (WCAG AA). Odak halkası da temadan bağımsızdır. */
.back-button{
  display:inline-flex;align-items:center;gap:6px;
  background:#e2231a;color:#ffffff;border:1px solid #e2231a;
  border-radius:999px;padding:9px 16px;min-height:38px;
  font-size:13.5px;font-weight:600;line-height:1.2;cursor:pointer;
  text-decoration:none;white-space:normal;max-width:100%;overflow-wrap:anywhere;
}
.back-button:hover{background:#b81a13;border-color:#b81a13;color:#fff}
.back-button:active{background:#9e150f;border-color:#9e150f}
.back-button:focus-visible{outline:2px solid #ffffff;outline-offset:-4px;box-shadow:0 0 0 3px rgba(226,35,26,.55)}
/* NOT: Burada eskiden bir de .category-back kuralı vardı (background:none;
   border:0; color:var(--muted)). Kategori sayfalarındaki düğmede iki sınıf
   birlikte durduğu (class="category-back back-button") ve bu kural dosyada
   .back-button'dan SONRA geldiği için, aynı ağırlıktaki kurallardan sonraki
   kazanıyor ve kırmızı zemini/kenarlığı siliyordu: yazı beyaz kalıyor, zemin
   kayboluyordu — açık temada düğme tamamen görünmez oluyor, koyu temada düz
   yazıya dönüyordu (kullanıcı ekran görüntüleri, 03.09.2026). .category-back'i
   tek başına kullanan kalmadığı için kural tamamen kaldırıldı; sınıf yalnızca
   JS tarafındaki [data-category-back] eşleştirmesi için duruyor. */

.root-group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(380px,100%),1fr));gap:22px}
.root-group-card{
  display:grid;grid-template-rows:auto minmax(220px,1fr);gap:16px;text-align:left;
  background:var(--surface);border:1px solid var(--line);border-radius:26px;
  padding:28px;cursor:pointer;box-shadow:var(--shadow);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
  overflow:hidden;
}
.root-group-card:hover{transform:translateY(-3px);border-color:var(--red-text);box-shadow:0 26px 55px -28px rgba(20,23,26,.4)}
.root-group-copy{display:flex;flex-direction:column;gap:8px;max-width:78%}
.root-group-copy small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.root-group-copy strong{font-size:clamp(30px,3.4vw,46px);letter-spacing:-.03em;line-height:1.03}
.root-group-copy em{font-style:normal;font-size:15px;color:var(--muted)}
.root-group-copy b{font-size:13.5px;color:var(--red-text);margin-top:4px}
.root-group-visual{min-height:220px;border-radius:20px;display:flex;align-items:center;justify-content:center;padding:14px}
.root-group-visual img{width:100%;height:100%;max-height:260px;object-fit:contain}

.subgroup-grid,.family-pick-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(min(340px,100%),1fr))}
.subgroup-card{
  display:grid;grid-template-columns:minmax(140px,42%) 1fr;align-items:center;gap:20px;text-align:left;
  background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:20px;cursor:pointer;
  box-shadow:var(--shadow);transition:transform .16s ease,border-color .16s ease;min-height:200px;overflow:hidden;
}
.family-pick-card{
  display:grid;grid-template-columns:130px 1fr;align-items:center;gap:16px;text-align:left;
  background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:16px;cursor:pointer;
  box-shadow:var(--shadow);transition:transform .16s ease,border-color .16s ease;min-height:140px;overflow:hidden;
}
.subgroup-card:hover,.family-pick-card:hover{transform:translateY(-2px);border-color:var(--red-text)}
.subgroup-media,.family-pick-media{height:100%;min-height:160px;border-radius:16px;display:flex;align-items:center;justify-content:center;padding:10px}
.family-pick-media{min-height:100px}
.subgroup-media img,.family-pick-media img{width:100%;height:100%;max-height:190px;object-fit:contain}
.family-pick-media img{max-height:110px}
.subgroup-copy,.family-pick-copy{display:flex;flex-direction:column;gap:6px}
.subgroup-copy small,.family-pick-copy small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.subgroup-copy strong{font-size:26px;letter-spacing:-.02em}
.family-pick-copy strong{font-size:18px;letter-spacing:-.01em}
.subgroup-copy em,.family-pick-copy em{font-style:normal;font-size:13px;color:var(--muted);line-height:1.4}
.subgroup-copy span,.family-pick-copy span{font-size:12px;color:var(--muted);font-weight:600}

/* Not 9 (v2) — ana grup / makine tipi kartlarında doygun renkten
   saydama, oradan beyaza (var(--surface)/var(--panel)) geçişli degrade.
   Root kartlarda metin üstte/görsel altta olduğundan geçiş dikeydir ve
   metin BEYAZ olur.

   DÜZELTME (ölçüldü): alt seviye kartlarda degrade ters yöndeydi —
   doygun taraf SAĞDA, yani metnin altındaydı, ama metin rengi koyu
   kalmıştı. 44 satır yazı yoğunluğu 1.0'a varan tint üzerinde bitiyor,
   kontrast 1.48'e kadar düşüyordu. Tint yoğunluğunu azaltmak çözmüyor:
   açık zemin yazı renkleri hiçbir yoğunlukta 4.5'i geçmiyor. Bu yüzden
   degrade ters çevrildi; doygun taraf artık SOLDAKİ GÖRSEL sütununun
   altında ve metin başlamadan (%36) tamamen saydamlaşıyor.
   Görsel kutuları kasıtlı olarak şeffaf bırakıldı: ileride grup/makine
   görselleri şeffaf arka planlı hazırlandığında degrade ile kaynaşacak. */


/* =====================================================================
   KONFİGÜRATÖR — DÜZEN
   ===================================================================== */
.configurator{
  display:grid; gap:16px; height:100%; min-height:0; overflow:hidden;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  grid-template-rows:minmax(0,1fr);
  grid-template-areas:"visual side";
}
/* Not 6 (v2) — "Yatay görünüm": ızgara şekli aynı kalır (görsel solda ve
   geniş, paneller sağda dar bir sütunda); tek fark sağdaki iki panelin
   (1. Ürün seçimi / 2. Donanım) yan yana değil ALT ALTA dizilmesidir —
   bkz. aşağıdaki ".layout-horizontal .side-columns" kuralı. */
.configurator.layout-horizontal{
  grid-template-columns:minmax(0,1.35fr) minmax(280px,340px);
}
.visual-panel{grid-area:visual}
.config-side{grid-area:side}
.mobile-tabs{display:none}

/* Not 2 (turuncu) — makinede ne varyant kontrolü ne de opsiyon varsa yan
   sütun (config-side) hiç render edilmez; görsel + fiyat paneli tüm
   genişliği kullanır. */
.configurator.no-side{grid-template-columns:minmax(0,1fr);grid-template-areas:"visual"}
.configurator.no-side.layout-horizontal{grid-template-rows:minmax(0,1fr);grid-template-areas:"visual"}

/* --- görsel panel: satırlar sabit, yalnız içerik kayar --- */
.visual-panel{
  position:relative; min-width:0; min-height:0; overflow:hidden;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:18px; display:grid; gap:12px;
  grid-template-rows:auto minmax(0,1fr) auto;
  box-shadow:var(--shadow);
}
.visual-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.visual-title .kicker{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.visual-title h2{margin:4px 0 2px;font-size:clamp(20px,2.4vw,30px);letter-spacing:-.02em}
.visual-variant{margin:0;font-size:12.5px;color:var(--muted)}
.visual-code{font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}

.machine-stage{position:relative;min-height:0;display:flex;align-items:center;justify-content:center;padding:4px}
.machine-stage img{width:100%;height:100%;object-fit:contain}
.gallery-arrow{
  position:absolute;top:50%;z-index:2;transform:translateY(-50%);
  display:flex;align-items:center;justify-content:center;width:44px;height:44px;
  border:1px solid var(--line);border-radius:50%;background:var(--surface);
  color:var(--ink);box-shadow:var(--shadow);font-size:28px;line-height:1;cursor:pointer;
}
.gallery-arrow:hover{border-color:var(--red-text)}
.gallery-prev{left:8px}
.gallery-next{right:8px}
.gallery-position{
  position:absolute;bottom:4px;left:50%;transform:translateX(-50%);
  padding:2px 6px;border-radius:999px;background:var(--surface);
  color:var(--muted);font-size:10px;font-variant-numeric:tabular-nums;
}

/* Not 1 — bu şerit hiçbir çözünürlükte kaybolmaz */
.selected-options-wrap{
  display:flex;flex-direction:column;min-width:0;min-height:96px;max-height:26vh;
  border-top:1px solid var(--line);padding-top:10px;
}
.selected-options-head{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}
.selected-options-head strong{font-size:13px}
.selected-options-head small{font-size:11.5px;color:var(--muted);margin-left:auto}
.selected-options-list{
  flex:1 1 auto;min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;align-content:start;
}
.selected-empty{font-size:12.5px;color:var(--muted);padding:4px 0}
.selected-option-card{
  display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px;position:relative;
  background:var(--line-soft);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:6px 8px;cursor:pointer;text-align:left;
}
.selected-option-card:hover{border-color:var(--red-text)}
.selected-option-remove{
  position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;
  background:var(--red);color:var(--on-red);font-size:12px;line-height:18px;text-align:center;
}
.selected-option-media img{width:34px;height:34px;object-fit:contain}
.selected-option-copy{display:flex;flex-direction:column;min-width:0}
.selected-option-copy strong{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.selected-option-copy small{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}

/* ------------------------------------------------ fiyat paneli (Not 3)
   Geniş ekranda görselin sağ üstünde YÜZER (aynı grid alanına yerleşir),
   dar ekranda akışa girer, telefonda en altta sabit kalır. */
.price-panel-host{
  grid-area:visual; justify-self:end; align-self:start;
  width:310px; margin:16px; z-index:5;
  max-height:calc(100% - 32px); overflow-y:auto;
}
.price-panel{
  background:var(--panel);color:#fff;border-radius:var(--radius);padding:14px 16px;
  display:flex;flex-direction:column;gap:10px;
}
.price-lines{display:flex;flex-direction:column;gap:4px;font-size:12.5px}
.price-line{display:flex;justify-content:space-between;gap:12px}
.price-line span{color:#9aa3aa}
.price-line strong{font-variant-numeric:tabular-nums;font-weight:600}
.price-line.faint span,.price-line.faint strong{color:#767f86;font-weight:500}

.price-settings-toggle{
  display:flex;align-items:center;gap:8px;width:100%;background:rgba(255,255,255,.07);
  border:0;border-radius:var(--radius-sm);padding:8px 10px;color:#fff;cursor:pointer;font-size:12px;
}
.price-settings-toggle span{font-weight:600}
.price-settings-toggle em{font-style:normal;color:#9aa3aa;font-size:11px;margin-left:auto;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:62%}
.price-settings-toggle b{font-size:11px;color:#9aa3aa}

.price-settings{display:flex;flex-direction:column;gap:9px;background:rgba(255,255,255,.05);border-radius:var(--radius-sm);padding:10px}
.setting-row{display:grid;grid-template-columns:76px 1fr;align-items:center;gap:10px}
.setting-row>label{font-size:11px;color:#9aa3aa}
.mini-segmented{display:flex;gap:4px;flex-wrap:wrap}
.mini-segmented button{
  border:1px solid rgba(255,255,255,.18);background:transparent;color:#e7eaec;
  border-radius:999px;padding:3px 10px;font-size:11.5px;cursor:pointer;
}
.mini-segmented button.active{background:var(--red);border-color:var(--red);color:var(--on-red);font-weight:600}
.fx-inputs{display:flex;gap:8px}
.fx-inputs span{display:flex;align-items:center;gap:5px}
.fx-inputs i{font-style:normal;font-size:10.5px;color:#9aa3aa}
.fx-inputs input,.percent-input input{
  width:64px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);
  color:#fff;border-radius:6px;padding:4px 7px;font-size:12px;font-variant-numeric:tabular-nums;
}
.percent-input{display:flex;align-items:center;gap:5px;font-size:12px;color:#9aa3aa}
.locked-value{font-size:13px;font-weight:600;display:flex;flex-direction:column}
.locked-value em{font-style:normal;font-size:10.5px;color:#9aa3aa;font-weight:400}
.setting-note{margin:2px 0 0;font-size:10.5px;color:#767f86;line-height:1.45}

.price-totals{display:flex;flex-direction:column;gap:4px;border-top:1px solid rgba(255,255,255,.12);padding-top:9px;font-size:12.5px}
.total-line{display:flex;justify-content:space-between;gap:12px}
.total-line span{color:#9aa3aa}
.total-line strong{font-variant-numeric:tabular-nums}
.total-line.discount strong{color:#7dc3a0}
.total-line.faint span,.total-line.faint strong{color:#767f86}
.total-line.grand{margin-top:4px;align-items:baseline}
.total-line.grand span{color:#fff;font-size:12px}
.total-line.grand strong{font-size:24px;font-weight:700;letter-spacing:-.02em}

.add-cart{
  background:var(--red);color:var(--on-red);border:0;border-radius:var(--radius-sm);
  padding:11px 14px;font-size:13.5px;font-weight:700;cursor:pointer;width:100%;
}
.add-cart:hover{background:var(--red-dark)}

/* --------------------------------------------------------- yan panel */
/* Not 9 — Kullanıcı geri bildirimi (28 Ağustos): az içerikli bir makinede
   (az varyant / az opsiyon) yan panel(ler) yine de görsel panelin tam
   yüksekliğine ("stretch") zorlanıyordu; bu da içeriğin altında devasa,
   anlamsız bir boşluk bırakıyordu — hem dikey hem yatay görünümde.
   align-self:start ile .config-side artık kendi içeriği kadar yer kaplar
   (görsel panelin boyuna eşitlenmeye zorlanmaz), max-height:100% ile de
   mevcut alanı aşamaz — uzun opsiyon listeleri yine kendi içinde kayar
   (bkz. .panel-body{overflow-y:auto}). */
.config-side{min-height:0;overflow:hidden;display:flex;align-self:start;max-height:100%}
.side-columns{display:grid;grid-template-columns:minmax(190px,235px) minmax(0,1fr);gap:14px;min-height:0;width:100%}
.side-columns:has(.model-panel:only-child),
.side-columns:not(:has(.model-panel)){grid-template-columns:minmax(0,1fr)}
/* Donanım paneli yoksa (yalnızca ürün seçimi varsa) tek panel tüm yüksekliği
   kaplıyor ama içerik kısa olabiliyor — altta anlamsız boş alan bırakmak
   yerine içeriği dikeyde ortalıyoruz (dikey ve yatay görünümde aynı). */
.side-columns:has(.model-panel:only-child) .model-panel .panel-body{justify-content:center}
/* Not 9 (devam) — yalnızca DİKEY (grid tabanlı) düzende geçerli: satırı
   sınırlı (minmax(0,1fr)) bir ızgara izine çeviriyoruz ki her panel
   (.side-panel) kendi içeriği kadar küçülebilsin (align-self:start) ama
   gerektiğinde mevcut alanı aşmasın (max-height:100%) — kısa panel kısa
   kalır, uzun panel kendi içinde kayar. YATAY düzende .side-columns zaten
   flexbox'a geçiyor (aşağıda), bu kural orada devre dışı kalmalı; aksi
   halde align-self panelin GENİŞLİĞİNİ daraltır (flex-column'da cross-
   axis yatay olduğu için) — bu yüzden :not(.layout-horizontal) ile
   kapsam sınırlanıyor. */
.configurator:not(.layout-horizontal) .side-columns{grid-template-rows:minmax(0,1fr)}
.configurator:not(.layout-horizontal) .side-panel{align-self:start;max-height:100%}
.side-panel{
  display:flex;flex-direction:column;min-height:0;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;
}
.panel-heading{
  flex:0 0 auto;display:flex;justify-content:space-between;align-items:flex-start;gap:10px;
  padding:14px 16px 10px;border-bottom:1px solid var(--line-soft);
}
.panel-heading .kicker{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.panel-heading h2{margin:3px 0 0;font-size:17px;letter-spacing:-.01em}
.source-badge{font-size:10.5px;color:var(--muted);background:var(--line-soft);border-radius:999px;padding:3px 9px;white-space:nowrap}
.panel-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 16px 16px;display:flex;flex-direction:column;gap:14px}

.control-section{display:flex;flex-direction:column;gap:7px}
.control-label{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted)}
.control-label span{color:var(--ink);font-weight:600}
.segmented{display:flex;flex-wrap:wrap;gap:6px}
.segment{
  border:1px solid var(--line);background:var(--surface);border-radius:var(--radius-sm);
  padding:7px 13px;font-size:13px;cursor:pointer;min-width:42px;
}
.segment:hover{border-color:var(--red-text)}
.segment.active{background:var(--panel);color:#fff;border-color:var(--panel);font-weight:600}

.search-input{
  width:100%;border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:9px 12px;font-size:13px;
}
.option-categories{display:flex;flex-wrap:wrap;gap:6px}
.category-chip{
  border:1px solid var(--line);background:var(--surface);border-radius:999px;
  padding:5px 12px;font-size:12px;cursor:pointer;
}
.category-chip.active{background:var(--panel);color:#fff;border-color:var(--panel);font-weight:600}

.option-list{display:flex;flex-direction:column;gap:8px}
.option-card{
  display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:12px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:9px 12px;cursor:pointer;text-align:left;transition:border-color .14s ease;
}
.option-card:hover{border-color:var(--red-text)}
.option-card.selected{border-color:var(--red-text);background:var(--tint-soft)}
.option-image img{width:56px;height:44px;object-fit:contain}
/* Fiyat listesinde fotografi olmayan opsiyonlar. Eskiden makinenin kendi
   fotografina dusuluyordu; opsiyon yanlis urun gibi okunuyordu. */
.gorsel-yok{display:flex;align-items:center;justify-content:center;
  width:56px;height:44px;border:1px dashed var(--line);border-radius:8px;
  background:var(--line-soft);color:var(--muted)}
.gorsel-yok svg{width:22px;height:22px}
.selected-option-media .gorsel-yok{width:100%;height:100%;border-radius:0;border:0;background:transparent}
.selected-option-media .gorsel-yok svg{width:26px;height:26px}
.option-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.option-copy strong{font-size:13px;line-height:1.3}
.option-copy small{font-size:11px;color:var(--muted)}
.option-price{
  font-size:13px;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums;
  display:flex;align-items:center;gap:9px;
}
.option-price .toggle{
  width:34px;height:19px;border-radius:999px;background:var(--line);position:relative;flex:0 0 auto;
}
.option-price .toggle::after{
  content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;
  background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .16s ease;
}
.option-card.selected .option-price .toggle{background:var(--red)}
.option-card.selected .option-price .toggle::after{transform:translateX(15px)}

/* fiyat listesinde satırı olmayan opsiyon — gizlenmez, uyarı ile gösterilir */
.option-card.unpriced{
  opacity:.65;cursor:not-allowed;border-style:dashed;
  background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(0,0,0,.025) 10px 20px);
}
.option-card.unpriced .option-image img{filter:grayscale(1)}
.unpriced-price{
  font-size:11px;font-weight:700;color:var(--warn);background:var(--warn-bg);
  border:1px solid #f0d79a;border-radius:999px;padding:4px 10px;
}
.empty-state{font-size:13px;color:var(--muted);padding:16px 0;text-align:center}

/* --- Not 6 (v3): yatay düzen — sağdaki iki panel alt alta.
   Not 6 (v2)'de CSS grid'de "auto" satır + yüzde max-height kombinasyonu
   bazı makinelerde (donanım paneli VARKEN) satırın 0'a çökmesine ve
   panelin tamamen boş görünmesine yol açıyordu (Kullanıcı geri bildirimi).
   Flexbox'a geçildi: üst panel (ürün seçimi) içeriğine göre büyür, sabit
   bir px tavanında kendi içinde kaydırılır; alt panel (donanım) kalan
   tüm alanı kaplar — çökme riski olmayan, öngörülebilir bir düzen. */
.layout-horizontal .side-columns{
  display:flex;flex-direction:column;gap:14px;min-height:0;
}
/* max-height yalnızca donanım paneli DE varsa uygulanır — tek panel
   (yalnızca ürün seçimi) kaldığında sütunun tamamını kaplamalı, yoksa
   altta boş bir alan kalıyordu (Kullanıcı geri bildirimi). */
/* flex:0 1 auto iken panel, donanim paneliyle birlikte kucululup icerigini
   kendi icinde kaydirmak zorunda kaliyordu ("sekme icinde asagi kaydirmayalim"
   geri bildirimi). flex:0 0 auto ile once kendi icerigi kadar yer alir; tavan
   hem piksel hem de sutunun yuzdesi olarak sinirlidir, boylece kisa ekranlarda
   donanim panelini eziyor duruma dusmez. */
.layout-horizontal .side-columns:has(.option-panel) > .model-panel{flex:0 0 auto;max-height:min(340px,45%);min-height:0}
.layout-horizontal .side-columns > .option-panel{flex:1 1 auto;min-height:0}
.layout-horizontal .side-columns:has(.model-panel:only-child),
.layout-horizontal .side-columns:not(:has(.model-panel)){
  display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);
}
.layout-horizontal .selected-options-wrap{max-height:18vh}

/* =====================================================================
   SEPET ÇEKMECESİ
   ===================================================================== */
.drawer-backdrop{position:fixed;inset:0;background:rgba(20,23,26,.42);z-index:40}
.cart-drawer{
  position:fixed;top:0;right:0;height:100%;width:min(430px,92vw);background:var(--surface);
  z-index:41;transform:translateX(100%);transition:transform .22s ease;
  display:flex;flex-direction:column;box-shadow:-20px 0 50px -30px rgba(0,0,0,.5);
}
.cart-drawer.open{transform:translateX(0)}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line)}
.drawer-head h2{margin:2px 0 0;font-size:18px}
.drawer-head .kicker{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.icon-button{background:none;border:0;font-size:22px;cursor:pointer;color:var(--muted);line-height:1}
.drawer-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 18px;display:flex;flex-direction:column;gap:12px}
.drawer-foot{flex:0 0 auto;border-top:1px solid var(--line);padding:14px 18px;display:flex;flex-direction:column;gap:10px}
.drawer-total{display:flex;justify-content:space-between;font-size:14px}
.drawer-total strong{font-size:19px;font-variant-numeric:tabular-nums}
.cart-line{display:grid;grid-template-columns:60px 1fr;gap:10px;border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px}
.cart-line>img{width:60px;height:52px;object-fit:contain}
.cart-line-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.cart-line-copy strong{font-size:13px}
.cart-line-copy code{font-size:11px;color:var(--muted)}
.cart-line-copy small{font-size:11px;color:var(--muted)}
.cart-line-terms{font-size:10.5px;color:var(--red-text);font-weight:600}
.cart-line-actions{grid-column:1/-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px solid var(--line-soft);padding-top:8px}
.cart-line-actions>strong{margin-left:auto;font-variant-numeric:tabular-nums}
.qty{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;padding:2px 8px}
.qty button{background:none;border:0;cursor:pointer;font-size:15px;color:var(--muted);padding:0 4px}
.link-button{background:none;border:0;color:var(--muted);font-size:11.5px;cursor:pointer;text-decoration:underline}
.link-button.danger{color:var(--red-text)}
.button{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius-sm);padding:9px 16px;font-size:13px;cursor:pointer}
.button.red{background:var(--red);border-color:var(--red);color:var(--on-red);font-weight:700}

/* =====================================================================
   SİPARİŞ / ÇIKTI EKRANI
   ===================================================================== */
.quote-page{overflow-y:auto;padding-right:6px}
.quote-toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.quote-toolbar h1{margin:4px 0 0;font-size:24px}
.quote-toolbar .kicker{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.quote-toolbar-actions{display:flex;gap:8px;flex-wrap:wrap}

/* Not 4 — KDV rejimi */
.vat-regime-bar{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 16px;margin-bottom:14px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
}
.vat-regime-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.vat-regime-choices{display:flex;gap:6px;flex-wrap:wrap}
.regime-chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 14px;font-size:12.5px;cursor:pointer}
.regime-chip.active{background:var(--panel);color:#fff;border-color:var(--panel);font-weight:600}
.vat-regime-help{flex:1 1 100%;margin:0;font-size:12px;color:var(--muted)}

.quote-paper{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.quote-empty{text-align:center;padding:60px 26px;display:flex;flex-direction:column;gap:12px;align-items:center}
.quote-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;border-bottom:2px solid var(--ink);padding-bottom:14px;margin-bottom:16px}
.quote-header img{height:36px}
.quote-meta{display:flex;flex-direction:column;text-align:right;gap:2px}
.quote-meta strong{font-size:14px;letter-spacing:.05em}
.quote-meta small{font-size:11.5px;color:var(--muted)}
.regime-stamp{color:var(--red-text)!important;font-weight:700}
.customer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-bottom:18px}
.field{display:flex;flex-direction:column;gap:4px}
.field.wide{grid-column:span 2}
.field span{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.field input,.field textarea{border:1px solid var(--line);border-radius:6px;padding:7px 10px;font:inherit;font-size:13px;width:100%}
.table-scroll{overflow-x:auto}
.order-table{width:100%;border-collapse:collapse;font-size:13px;min-width:680px}
.order-table th{text-align:left;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line);padding:8px 10px}
.order-table td{border-bottom:1px solid var(--line-soft);padding:10px;vertical-align:top}
.order-table td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
/* Sayı sütunlarının başlığı da sağa yaslı: "Adet", "Birim fiyat", "Tutar"
   başlıkları kendi değerlerinin tam üstünde durur. */
.order-table th.num{text-align:right}
.order-table th:first-child,.order-table td:first-child{width:34px}
.proforma-rate-field .percent-input input{width:92px}
.order-machine{display:flex;gap:10px;align-items:flex-start}
.order-machine img{width:64px;height:50px;object-fit:contain;flex:0 0 auto}
.order-machine code{display:block;font-size:11px;color:var(--muted);margin:2px 0 4px}
.option-tags{display:flex;flex-wrap:wrap;gap:4px}
.option-tag{font-size:10.5px;background:var(--line-soft);border-radius:999px;padding:2px 8px;color:var(--ink-soft)}
.quote-summary{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(240px,.9fr);gap:24px;margin-top:20px}
.terms strong{font-size:12px}
.terms p{font-size:12px;color:var(--muted);line-height:1.6;margin:6px 0}
.source-note{font-size:11px!important}
.totals{display:flex;flex-direction:column;gap:6px;align-self:start;border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px}
.total-row{display:flex;justify-content:space-between;gap:14px;font-size:13px}
.total-row strong{font-variant-numeric:tabular-nums}
.total-row.faint span,.total-row.faint strong{color:var(--muted)}
.total-row.note strong{color:var(--warn)}
.total-row.grand{border-top:1px solid var(--line);padding-top:8px;margin-top:4px;font-size:14px}
.total-row.grand strong{font-size:20px;font-weight:700}
.signature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}
.signature{border-top:1px solid var(--ink);padding-top:6px;font-size:11.5px;color:var(--muted);text-align:center}
.quote-footer{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:22px;border-top:1px solid var(--line-soft);padding-top:10px}

/* Yeni not — belge tipi seçimi (Sipariş fiyat listesi / Proforma Invoice) */
.doc-type-toggle{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.doc-type-chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;color:var(--ink-soft)}
.doc-type-chip.active{background:var(--panel);color:#fff;border-color:var(--panel)}

/* KDV dahil/hariç görünüm anahtarı + sayfa iskontosu, KDV rejim çubuğunun içinde */
.vat-display-toggle{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.doc-discount-field{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);font-weight:600}
.doc-discount-field .percent-input{margin-left:2px}
.doc-discount-field input{width:56px;border:1px solid var(--line);border-radius:6px;padding:5px 7px;font:inherit;font-size:13px}

/* Sipariş tablosunda satır bazlı düzenleme kontrolleri */
.row-edit-select{border:1px solid var(--line);border-radius:6px;padding:5px 6px;font:inherit;font-size:12.5px;background:var(--surface);min-width:64px}
.row-edit-percent{display:inline-flex;align-items:center;gap:3px}
.row-edit-input{width:48px;border:1px solid var(--line);border-radius:6px;padding:5px 6px;font:inherit;font-size:12.5px;text-align:right}
.row-edit-qty{width:44px}
.row-edit-price{width:78px}
.reset-price{margin-left:4px;font-size:11px}
.manual-flag{font-style:normal;color:var(--red-text);font-size:10.5px}
.print-only{display:none}

/* Yeni not 10 — Yazdır/PDF ve Sipariş talebi gönder butonları belgenin
   altına taşındı (hem sipariş hem proforma ekranı). */
.quote-bottom-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;flex-wrap:wrap}

/* Proforma Invoice — paketleme / nakliye ücret çubuğu */
.proforma-fee-bar{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 16px;margin-bottom:14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.fee-toggle{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap}
.fee-toggle input{width:15px;height:15px}
.fee-label-input{border:1px solid var(--line);border-radius:6px;padding:6px 9px;font:inherit;font-size:12.5px;width:150px}
.fee-label-input:disabled,.proforma-fee-bar input:disabled{opacity:.5;background:var(--line-soft)}

/* Yeni notlar 1/2/5 — KDV rejim çubuğu ve proforma ücret çubuğu AÇIK
   (beyaz) zeminlidir; .mini-segmented / .percent-input KOYU .price-panel
   için tasarlanmıştı (açık renk yazı) — bu iki çubukta metin/kutu
   görünmüyordu. Burada açık zemine uygun renklerle geçersiz kılınıyor. */
.vat-regime-bar .percent-input,
.proforma-fee-bar .percent-input{color:var(--muted)}
.vat-regime-bar .percent-input input,
.proforma-fee-bar .percent-input input{
  background:var(--surface);border:1px solid var(--line);color:var(--ink);
}
.vat-regime-bar .mini-segmented button{
  border-color:var(--line);background:var(--surface);color:var(--ink-soft);
}
.vat-regime-bar .mini-segmented button.active{background:var(--panel);border-color:var(--panel);color:#fff}

/* Proforma Invoice kağıdı — taraflar, ücret satırları */
.proforma-paper .quote-header{border-bottom-color:var(--ink)}
.proforma-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.party-block{display:flex;flex-direction:column;gap:4px;padding:10px 12px;background:var(--surface);border:1px solid var(--line-soft);border-radius:var(--radius-sm)}
.party-block strong{font-size:13.5px}
.party-block small{color:var(--muted);font-size:11.5px}
.party-label{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--red-text);font-weight:700}
.fee-row td{color:var(--muted);font-style:italic}
.fee-row code{display:none}

/* =====================================================================
   PENCERE, BİLDİRİM, ROL DEĞİŞTİRME
   ===================================================================== */
.modal-backdrop{position:fixed;inset:0;background:rgba(20,23,26,.5);z-index:90;display:flex;align-items:center;justify-content:center;padding:20px}
.modal{background:var(--surface);border-radius:var(--radius);width:min(560px,100%);max-height:86vh;display:flex;flex-direction:column;overflow:hidden}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
.modal-head h2{margin:0;font-size:17px}
#modalBody{padding:18px 20px;overflow-y:auto}
.role-intro{font-size:12.5px;color:var(--muted);line-height:1.6;margin:0 0 16px}
.role-block{margin-bottom:18px}
.role-block h4{margin:0 0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.role-block h4 em{font-style:normal;color:var(--red-text)}
.role-option{
  display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px 12px;cursor:pointer;margin-bottom:6px;
}
.role-option:hover{border-color:var(--red-text)}
.role-option.active{border-color:var(--red-text);background:var(--tint-soft)}
.role-option strong{font-size:13px}
.role-option small{font-size:11px;color:var(--muted)}
.role-customer{display:flex;gap:8px}
.role-customer input{flex:1 1 auto;border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 12px;font-size:13px}
.role-hint{display:block;font-size:11px;color:var(--muted);margin-top:5px}
#roleDealerSearch{width:100%;border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 12px;font-size:13px;margin-bottom:8px}
.role-dealer-list{max-height:230px;overflow-y:auto}
.modal-loading,.modal-error{font-size:13px;color:var(--muted)}
.modal-error{color:var(--red-text)}
.modal-actions{display:flex;justify-content:flex-end;margin-top:14px}
.cart-currency-modal-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:18px}
.cart-currency-modal-actions button{flex:1 1 145px;min-height:44px;white-space:normal;line-height:1.25;text-align:center}
@media (max-width:560px){
  .cart-currency-modal-actions{flex-direction:column}
  .cart-currency-modal-actions button{flex:0 0 auto;width:100%}
}

/* Yeni not 16 — Sipariş Geçmişi ekranı ve detay modalı */
.orders-page{overflow-y:auto;padding-right:6px}
.order-history-list{display:flex;flex-direction:column;gap:10px}
.order-history-card{
  display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;gap:14px;align-items:center;
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;background:var(--surface);
}
.order-history-icon{width:44px;height:44px;border-radius:12px;background:var(--panel);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:900}
.order-history-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.order-history-copy small{color:var(--red-text);font-weight:700;font-size:11px}
.order-history-copy strong{font-size:14px}
.order-history-copy span{color:var(--muted);font-size:11px}
.order-history-total{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.order-status{font-size:10px;font-weight:700;border-radius:999px;padding:4px 8px;background:var(--line-soft);color:var(--ink-soft)}
.order-status.approved,.order-status.completed{background:#e5f7ec;color:#096f39}
.order-status.submitted,.order-status.reviewing{background:#eef3ff;color:#245edb}
.order-status.rejected,.order-status.cancelled{background:#ffe8ea;color:#a80612}
.order-detail-summary{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:14px}
.order-detail-summary div{background:var(--surface);border-radius:var(--radius-sm);padding:10px 12px}
.order-detail-summary span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em}
.order-detail-summary strong{display:block;margin-top:4px;font-size:13px}
.order-detail-items{display:flex;flex-direction:column;gap:8px}
.order-detail-item{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;border:1px solid var(--line-soft);border-radius:var(--radius-sm);padding:10px 12px}
.order-detail-item small{color:var(--muted);display:block}
.empty-detail-note{font-size:13px;color:var(--muted)}

.toast-host{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:80;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{background:var(--panel);color:#fff;border-radius:999px;padding:10px 20px;font-size:13px;box-shadow:0 12px 30px -14px rgba(0,0,0,.6)}

/* =====================================================================
   DUYARLILIK (Not 7)
   ===================================================================== */
@media (min-width:1400px){
  /* Görselin sağ üstünde yüzen panel — ekran görüntüsündeki tasarım */
  .visual-top{padding-right:330px}
}

/* 1400px altında panel yüzmeyi bırakır, görselin altına iner */
@media (max-width:1399px){
  .configurator,.configurator.layout-horizontal{
    grid-template-rows:minmax(0,1fr) auto;
    grid-template-areas:"visual side" "price side";
  }
  .configurator.no-side,.configurator.no-side.layout-horizontal{
    grid-template-rows:minmax(0,1fr) auto;
    grid-template-areas:"visual" "price";
  }
  .price-panel-host{
    grid-area:price; justify-self:stretch; align-self:stretch;
    width:auto; margin:0; max-height:none; overflow:visible;
  }
  .price-panel{flex-direction:row;flex-wrap:wrap;align-items:flex-end;gap:14px}
  .price-panel>*{min-height:0}
  .price-lines{flex:1 1 180px}
  .price-settings-toggle{flex:1 1 240px;width:auto}
  .price-settings{flex:1 1 100%}
  .price-totals{flex:1 1 220px;border-top:0;padding-top:0}
  .add-cart{flex:0 0 auto;width:auto;min-width:230px}
}

@media (max-width:1100px){
  .configurator,.configurator.layout-horizontal{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:minmax(0,1fr) auto minmax(0,1fr);
    grid-template-areas:"visual" "price" "side";
  }
  .configurator.no-side,.configurator.no-side.layout-horizontal{
    grid-template-rows:minmax(0,1fr) auto;
    grid-template-areas:"visual" "price";
  }
  .side-columns{grid-template-columns:minmax(180px,220px) minmax(0,1fr)}
  .quote-summary{grid-template-columns:minmax(0,1fr)}

  .root-group-visual{min-height:190px}
  .root-group-visual img{max-height:220px}
}

/* Yeni not (boyutlandırma düzeltmesi) — 861-1100px aralığı (tablet ya da
   sunum sırasında küçültülmüş masaüstü penceresi): yukarıdaki kural
   görsel + fiyat + yan paneli SABİT, taşmayan (overflow:hidden) bir
   yüksekliğe sıkıştırıyordu. Üç panel aynı anda aynı sabit alana
   zorlanınca (özellikle pencere kısaltıldığında) hepsi anlamsızca
   küçülüyor, opsiyon listesi okunaksız hale geliyordu — kullanıcı
   bildirimi: "tam ekranda ayrı küçültülmüş ekranda ayrı sorunlar".
   <=860px (telefon) zaten sekmeli tek panel gösterdiği için bu aralığın
   DIŞINDA bırakıldı (min-width:861px) — oradaki tasarım değişmedi.
   Bu aralıkta artık normal bir sayfa gibi DİKEY KAYAR; her panel kendi
   içeriğine göre makul bir minimum yükseklik alır, hiçbiri zorla
   küçültülmez. */
@media (max-width:1100px) and (min-width:861px){
  #app{overflow-y:auto;overflow-x:hidden}
  .page{height:auto;min-height:100%}
  .configurator,.configurator.layout-horizontal{
    height:auto;overflow:visible;
    grid-template-rows:minmax(460px,70dvh) auto minmax(420px,auto);
  }
  .configurator.no-side,.configurator.no-side.layout-horizontal{
    grid-template-rows:minmax(460px,70dvh) auto;
  }
  .visual-panel{min-height:460px}
  .config-side,.side-columns{max-height:none}
  .configurator:not(.layout-horizontal) .side-panel{max-height:none}
}

/* Bu aralıkta fiyat paneli görselin altında ikinci bir ızgara satırıdır.
   Ayarlar açılınca auto satır büyür; sabit yükseklikteki ilk satır sıfıra
   yaklaşarak makine görselini gizliyordu. Panelleri sayfada kaydır ve görsel
   satırına hem fotoğraf hem seçili opsiyonlar için yeterli alan bırak. */
@media (min-width:1101px) and (max-width:1399px){
  #app{overflow-y:auto;overflow-x:hidden}
  .page{height:auto;min-height:100%}
  .configurator,.configurator.layout-horizontal{
    height:auto;min-height:100%;overflow:visible;
    grid-template-rows:minmax(500px,70dvh) auto;
  }
  .visual-panel{min-height:500px}
  .config-side,.side-columns{max-height:none}
  .configurator:not(.layout-horizontal) .side-panel{max-height:none}
}

/* Tablet genişliğinde ikinci kart satırı kısa görsel panelinde kesilmesin. */
@media (min-width:861px) and (max-width:1399px){
  .selected-options-list{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding:6px 0 2px}
  .selected-option-card{flex:0 0 180px}
  .selected-option-remove{top:2px;right:2px}
}

/* 1700px altında ana bağlantılar ve ikincil kontroller kısa menülere geçer;
   böylece başlıkta logo, hesap ve sepet için alan kalır. */
@media (max-width:1700px){
  :root{--header-h:auto}
  .site-header{align-items:center}
  .brand-button{order:1}
  .header-actions{order:2}
  .header-context{grid-column:1/-1;order:3;min-height:0}
  .main-nav{grid-column:1/-1;order:4;justify-content:center;overflow:visible}
  .nav-secondary{display:block;position:relative;flex:0 0 auto}
  .nav-more-toggle{display:flex;align-items:center;min-height:36px}
  .nav-more-items{
    display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:30;
    flex-direction:column;align-items:stretch;gap:2px;min-width:200px;
    padding:6px;background:var(--surface);border:1px solid var(--line);
    border-radius:var(--radius-sm);box-shadow:var(--shadow);
  }
  .nav-secondary.is-open .nav-more-items{display:flex}
  .nav-more-items .nav-link{text-align:left}
  .nav-secondary:has(.nav-more-items .active) .nav-more-toggle{color:var(--ink);font-weight:600;background:var(--line-soft)}
  .header-actions{position:relative;flex-wrap:nowrap}
  .ghost-button.header-tools-toggle{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0;font-size:20px}
  .header-tools-panel{
    display:none;position:absolute;right:0;top:calc(100% + 6px);z-index:31;
    flex-wrap:wrap;justify-content:flex-start;gap:8px;width:240px;
    padding:10px;background:var(--surface);border:1px solid var(--line);
    border-radius:var(--radius-sm);box-shadow:var(--shadow);
  }
  .header-actions.is-open .header-tools-panel{display:flex}
  .header-tools-panel .ghost-button{min-height:40px;min-width:40px}
  .header-tools-panel .rate-chip{flex:1 1 100%}
  .header-tools-panel .logout-button{min-height:40px}
  .header-actions .session-button{max-width:160px}
  .header-actions .session-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* Daha dar ekranlarda başlık boşlukları ve kontrol boyutları küçülür. */
@media (max-width:1280px){
  :root{--header-h:auto}
  .site-header{grid-template-columns:minmax(0,1fr) minmax(0,auto);gap:6px;padding:8px 12px}
  .header-context{grid-column:1/-1;order:3;min-height:0}
  .main-nav{grid-column:1/-1;order:4;justify-content:flex-start;overflow:visible;gap:2px;flex-wrap:nowrap}
  .nav-link{padding:5px 10px;font-size:12.5px}
  .header-actions{grid-column:2;order:2;gap:6px;min-width:0;justify-content:flex-end}
  #layoutToggle,#photoModeGroup{display:none}
  .cart-button{padding:7px 12px;font-size:12px}
  .session-button{padding:5px 10px;font-size:11.5px;max-width:130px}
  .session-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #app{padding:8px 12px 10px}
}

/* Konfigüratörde başlık biraz daralır; geri dönüş ve ana gezinme erişilebilir. */
@media (max-width:1280px){
  body[data-route="configurator"] .site-header{padding:6px 12px}
}

/* Tablet ve dar masaüstünde geri dönüş/tarih ile ana gezinme ikinci satırı
   paylaşır. Logo, hesap ve sepet ilk satırda kalır. */
@media (min-width:701px) and (max-width:1700px){
  .site-header{grid-template-columns:minmax(0,1fr) max-content}
  .brand-button{grid-column:1;grid-row:1}
  .header-actions{grid-column:2;grid-row:1;justify-content:flex-end}
  .header-context{grid-column:1;grid-row:2;order:3;margin-top:0}
  .main-nav{grid-column:2;grid-row:2;order:4;justify-content:flex-end}
  .site-header:has(.header-context[hidden]) .main-nav{grid-column:1/-1;justify-content:center}
}

@media (max-width:700px){
  body[data-route="configurator"] .header-context{grid-column:1/-1;order:3;margin-top:2px}
  .back-button{padding:9px 14px;font-size:13px}
  .brand-button img{height:26px}
  .cart-button .cart-label{display:none}
  .cart-button{min-height:40px;padding:8px 10px;gap:6px}
  .cart-icon{flex-shrink:0}
}

@media (max-width:860px){
  /* Telefon / küçük tablet: sekmeli tek panel.
     Seçilen opsiyonlar şeridi ve fiyat paneli hangi sekme açık olursa olsun
     ekranda kalır (Not 1). Yalnız fotoğraf ve galeri gizlenir. */
  .mobile-tabs{
    display:flex;gap:6px;overflow-x:auto;grid-row:1;grid-column:1;
  }
  .mobile-tabs button{
    border:1px solid var(--line);background:var(--surface);border-radius:999px;
    padding:7px 16px;font-size:13px;cursor:pointer;white-space:nowrap;
  }
  .mobile-tabs button.active{background:var(--panel);color:#fff;border-color:var(--panel);font-weight:600}

  .configurator,.configurator.layout-horizontal{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto minmax(150px,1fr) auto auto;
    grid-template-areas:none;
    gap:8px;
  }
  .config-side{grid-row:2;grid-column:1}
  .visual-panel{grid-row:3;grid-column:1;padding:12px}
  .price-panel-host{
    grid-row:4;grid-column:1;justify-self:stretch;align-self:stretch;
    width:auto;margin:0;max-height:none;overflow:visible;
  }
  /* Yan sütun yoksa telefonda boşluk bırakmadan görsel + fiyat panelini yukarı çek */
  .configurator.no-side{grid-template-rows:auto minmax(0,1fr) auto}
  .configurator.no-side .visual-panel{grid-row:2}
  .configurator.no-side .price-panel-host{grid-row:3}
  /* 1399px bloğunda açılan flex-wrap, sütun yönünde çok sütunlu bir
     yerleşim yaratıp panel yüksekliğini bozuyordu. Telefonda kapatılır. */
  .price-panel{flex-direction:column;flex-wrap:nowrap;align-items:stretch}
  .price-lines,.price-settings-toggle,.price-settings,.price-totals,.add-cart{flex:0 0 auto}
  .add-cart{width:100%}
  .mobile-tabs{flex:0 0 auto;min-height:38px;align-items:center}
  .mobile-tabs button{flex:0 0 auto}
  .side-columns{grid-template-columns:minmax(0,1fr)}

  /* Telefonda AYNI ANDA TEK panel açıktır. Yatay düzenin "ürün seçimi paneli
     en fazla %45" tavanı (.layout-horizontal ... > .model-panel) burada da
     uygulanıyordu: seçim paneli 168px'lik bir kutuya sıkışıp kendi içinde
     kayıyor, gizli donanım panelinin yeri de altta boş duruyordu — sıra
     sayısı düğmeleri yarım görünüyordu. Telefonda sayfa artık 861-1100px
     aralığındaki gibi normal kayar; açık olan panel sütunun tamamını alır. */
  #app{overflow-y:auto;overflow-x:hidden}
  .page{height:auto;min-height:100%}
  .configurator,.configurator.layout-horizontal{
    height:auto;overflow:visible;grid-template-rows:auto auto auto auto;
  }
  .configurator.no-side,.configurator.no-side.layout-horizontal{grid-template-rows:auto auto auto}
  .config-side,.side-columns{max-height:none;min-height:0}
  .config-side{align-self:stretch}
  .side-panel,
  .configurator:not(.layout-horizontal) .side-panel,
  .layout-horizontal .side-columns:has(.option-panel) > .model-panel,
  .layout-horizontal .side-columns > .option-panel{
    flex:1 1 auto;max-height:none;min-height:0;align-self:stretch;
  }
  .panel-body{overflow:visible}
  .configurator[data-mobile-tab="visual"] .visual-panel{min-height:min(60vh,380px)}
  /* Sayfa kaydığı için "sipariş listesine ekle" ekrandan çıkmasın. */
  .price-panel-host{position:sticky;bottom:0;z-index:5}

  .configurator[data-mobile-tab="visual"] .config-side{display:none}
  .configurator[data-mobile-tab="visual"] .visual-panel{grid-row:2}
  .configurator[data-mobile-tab="model"] .option-panel{display:none}
  .configurator[data-mobile-tab="options"] .model-panel{display:none}
  .configurator:not([data-mobile-tab="visual"]) .visual-top,
  .configurator:not([data-mobile-tab="visual"]) .machine-stage,
  .configurator:not([data-mobile-tab="visual"]) .gallery-strip{display:none}
  .configurator:not([data-mobile-tab="visual"]) .visual-panel{display:block;align-self:start}
  .configurator:not([data-mobile-tab="visual"]) .selected-options-wrap{border-top:0;padding-top:0}

  /* Telefonda seçilen opsiyonlar tek satır yatay şerittir — yer kaplamaz,
     ama hep görünür (Not 1). */
  .selected-options-wrap{max-height:none;min-height:0}
  .selected-options-list{
    display:flex;flex:0 0 auto;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:6px;padding-bottom:2px;
  }
  .selected-option-card{flex:0 0 auto;width:158px}
  .selected-options-head{margin-bottom:6px}

  /* Not 2/3 (telefon) — büyük kartlar tek sütuna iner, görsel üstte kalır */
  .root-group-grid{gap:14px}
  .root-group-card{padding:18px;border-radius:20px;gap:12px}
  .root-group-copy{max-width:100%}
  .root-group-visual{min-height:160px}
  .root-group-visual img{max-height:190px}
  .subgroup-grid,.family-pick-grid{gap:12px}
  .subgroup-card{grid-template-columns:1fr;min-height:0;gap:12px;padding:16px}
  .subgroup-media{min-height:150px}
  .subgroup-copy strong{font-size:21px}
  .family-pick-card{grid-template-columns:1fr;min-height:0;gap:10px;padding:14px}
  .family-pick-media{min-height:110px}

  /* Fiyat paneli telefonda özet gösterir; "Fiyat ayarları" açılınca detaylanır. */
  .price-panel{padding:10px 12px;gap:8px}
  .price-lines{display:none}
  .price-totals{border-top:0;padding-top:0}
  .price-totals .total-line:not(.grand){display:none}
  .price-panel.settings-open .price-lines{display:flex}
  .price-panel.settings-open .price-totals .total-line{display:flex}
  .price-panel.settings-open .price-totals{border-top:1px solid rgba(255,255,255,.12);padding-top:8px}
  .total-line.grand strong{font-size:20px}
  .add-cart{padding:10px 14px}
}

@media (max-width:560px){
  .session-button{max-width:92px;padding:5px 8px}
  .session-button b{display:none}
  .cart-button{padding:6px 10px;font-size:11.5px}
  .quote-paper{padding:16px}
  .customer-grid{grid-template-columns:minmax(0,1fr)}
  .field.wide{grid-column:span 1}
  .signature-row{grid-template-columns:minmax(0,1fr);gap:16px}
  .selected-options-list{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .doc-type-toggle,.doc-type-chip{width:100%}
  .doc-type-chip{text-align:center}
  .proforma-fee-bar{flex-direction:column;align-items:stretch}
  .fee-label-input,.proforma-fee-bar .percent-input{width:100%}
  .vat-display-toggle,.doc-discount-field{width:100%;justify-content:space-between}
}

/* =====================================================================
   YAZDIRMA
   ===================================================================== */
@media screen and (max-width:860px){
  /* iOS Safari, 16px'ten kucuk yazi tipli bir alana dokunulunca sayfayi otomatik
     yakinlastirir ve kullanici sayfayi kayik/zoomlu birakir. Telefonda tum form
     alanlarini 16px'e cikariyoruz; dar sayisal kutular yeni punto sigsin diye
     birkac piksel genisletildi. Kural yalnizca "screen" icin gecerlidir,
     yazdirma/PDF ciktisina dokunmaz. */
  .field input,.field textarea,.field select,
  .role-customer input,
  .fee-label-input,
  .doc-discount-field input,
  .row-edit-input,.row-edit-select,
  .fx-inputs input,.percent-input input{font-size:16px}
  .doc-discount-field input{width:64px}
  .row-edit-input{width:62px}
  .row-edit-select{min-width:78px}
  .fx-inputs input,.percent-input input{width:78px}
}

@media screen and (max-width:400px){
  .option-card{grid-template-columns:40px minmax(0,1fr);gap:6px 10px;padding:8px}
  .option-image{grid-row:1/3}
  .option-image img{width:40px;height:40px}
  .option-price{grid-column:2;justify-content:space-between}
}

/* Telefon yatayken / pencere kısayken panelleri erişilemez ölçüye
   sıkıştırma. Normal yüksek ekran düzeni korunur; kısa ekranda ana içerik
   kayar, model/opsiyon listesi kendi içinde kullanılabilir kalır. */
@media screen and (max-width:860px) and (max-height:700px){
  #app{overflow-y:auto;overflow-x:hidden}
  .configurator,.configurator.layout-horizontal{height:auto;min-height:100%;overflow:visible;grid-template-rows:auto minmax(210px,calc(100dvh - 360px)) auto auto}
  .configurator.no-side,.configurator.no-side.layout-horizontal{grid-template-rows:auto minmax(260px,calc(100dvh - 260px)) auto}
  .configurator[data-mobile-tab="visual"] .visual-panel{min-height:260px}
}
@media screen and (min-width:1101px) and (max-height:600px){
  #app{overflow-y:auto;overflow-x:hidden}
  .configurator,.configurator.layout-horizontal{min-height:560px}
}

/* Keep primary touch controls usable on tablets and narrow windows. */
@media screen and (max-width:1024px), screen and (pointer:coarse){
  .main-nav .nav-link,.header-actions .ghost-button,.header-actions .session-button,
  .header-actions .cart-button,.mobile-tabs button{min-height:44px}
  .icon-button{min-width:44px;min-height:44px}
  .cart-line .qty button{min-width:36px;min-height:44px}
  .search-input,.cart-drawer input{font-size:16px}
}
@media print{
  /* Yazdirmada tema degiskenlerini acik tema degerlerine dondurme isi
     artik assets/b2b-base.css icindeki yazdirma blogunda yapiliyor.
     Buradaki kopya kaldirildi: daha sonra yuklendigi icin ortak dosyadaki
     iyilestirilmis --muted degerini geri eskiye cekiyordu.
     Asagisi yalnizca bu yuzeye ozgu gizleme kurallari. */
  body{overflow:visible;height:auto;background:#fff;color:var(--ink)}
  .site-header,.no-print,.cart-drawer,.drawer-backdrop,.modal-backdrop,
  .toast-host,.impersonation-bar,.mobile-tabs{display:none!important}
  #app{overflow:visible;padding:0}
  .quote-page{overflow:visible}
  .quote-paper{border:0;box-shadow:none;padding:0}
  .field input,.field textarea{border:0;padding:0}
  .table-scroll{overflow:visible}
  .order-table{min-width:0}
  .print-only{display:inline}
  td.print-only{display:table-cell}
  .party-block{border:0;background:transparent;padding:0}
}

/* Katalog fiyatlarının KDV DAHİL olduğunu ekranda belli eden küçük etiketler
   (bkz. pricing.js başlığındaki not). Fiyat panelinde katalog satırlarının
   yanında ve opsiyon panelinin başlığında görünür. */
.vat-hint{
  font-style:normal;font-size:10px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted);border:1px solid var(--line);border-radius:999px;
  padding:1px 6px;margin-left:6px;white-space:nowrap;
}
.price-panel .vat-hint{color:#9aa3aa;border-color:rgba(255,255,255,.18)}
.panel-vat-note{display:block;margin-top:2px;font-size:11px;color:var(--muted)}
.manual-options{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--line);padding-top:18px;margin-top:4px;min-width:0}
.manual-heading h2{margin:5px 0;font-size:17px}.manual-heading small{color:var(--muted);font-size:11px}
.manual-option{display:grid;gap:9px;padding:10px;background:var(--line-soft);border-radius:10px;min-width:0}
.manual-option label{display:grid;gap:5px;font-size:12px;min-width:0}
.manual-option input{width:100%;min-width:0;box-sizing:border-box;min-height:40px;border:1px solid var(--line);border-radius:8px;padding:8px;background:var(--surface);color:var(--text);font:inherit}
.manual-options>.button{white-space:normal;min-height:44px}
.manual-options>.button[disabled]{opacity:.45;cursor:not-allowed}
.manual-uyari{color:var(--muted);font-size:11px}
.manual-price-field{display:flex;align-items:center;gap:0;border:1px solid var(--line);
  border-radius:8px;background:var(--surface);overflow:hidden;caret-color:var(--ink)}
.manual-price-field:focus-within{border-color:var(--ink-soft)}
.manual-price-field i{font-style:normal;font-weight:700;color:var(--muted);
  padding:0 4px 0 12px;flex:0 0 auto}
.manual-price-field input{border:0;border-radius:0;background:transparent;
  caret-color:var(--ink);font-variant-numeric:tabular-nums;font-weight:600;
  letter-spacing:.01em}
.manual-option input.hatali{border-color:var(--red);box-shadow:0 0 0 2px rgba(226,35,26,.16)}
.manual-price-field:has(input.hatali){border-color:var(--red);box-shadow:0 0 0 2px rgba(226,35,26,.16)}
.manual-price-field input.hatali{box-shadow:none}
.manual-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
/* "Kaydet" birincil eylem: kutunun icinde en belirgin dugme o olmali. */
.manual-save{background:var(--red);color:#fff;border-color:var(--red);font-weight:700;
  min-height:38px;padding:0 18px}
.manual-save:hover{filter:brightness(1.06)}
/* Kayitli satir: ad kirpilmasin. Ad+tutar ust satirda, Duzenle/Sil altta.
   Onceki yatay dizilimde dugmeler yeri kapip adi "a..."ya dusuruyordu. */
.manual-option.kayitli{display:grid;gap:8px;padding:10px 12px}
.manual-kayit{display:flex;align-items:baseline;gap:10px;min-width:0;flex-wrap:wrap;
  justify-content:space-between}
.manual-kayit strong{font-size:13px;font-weight:600;min-width:0;flex:1 1 120px;
  overflow-wrap:anywhere;line-height:1.35}
/* Tutar, katalog opsiyonlarinin fiyatiyla ayni tipografi (.option-price):
   ayni punto, ayni kalinlik, ayni rakam hizasi ve binlik ayraci. */
.manual-tutar{font-size:13px;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
/* Birim fiyat kirilimi — HER KALEM KENDI SATIRI. Opsiyon adi "Makine ve
   donanim", tutari "Birim fiyat" sutununun tam altina duser; hucre sirasi
   ana satirla birebir ayni uretilir. Makine satiri ile kirilim satirlari
   ayni <tbody class="order-line-group"> icindedir. Cikti tablosundaki
   data-allow-print-split gruplari sayfalar arasinda satir bazinda akar. */
.order-line-group{break-inside:avoid;page-break-inside:avoid}
.kirilim-basligi{display:block;margin-top:6px;font-size:10px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}
.opsiyon-satiri>td{border-bottom:0;padding-top:2px;padding-bottom:2px;
  font-size:12px;font-weight:400;color:var(--ink-soft)}
.opsiyon-satiri:last-child>td{padding-bottom:10px;border-bottom:1px solid var(--line-soft)}
/* Makine gorseli 64px + 10px bosluk: ad tam makine adinin altina gelsin. */
.opsiyon-ad{padding-left:84px}
.opsiyon-fiyat{font-variant-numeric:tabular-nums;white-space:nowrap}
.opsiyon-satiri.taban>td{font-weight:600;color:var(--ink)}
.manuel-etiket{font-style:normal;font-size:10px;color:var(--red-text);
  border:1px solid currentColor;border-radius:999px;padding:0 5px;margin-left:6px}

/* --- Yazdirma: birim fiyat kirilimi ------------------------------------
   Bu blok dosyanin SONUNDA durmak zorunda; ayni ozgullukteki temel
   kurallardan sonra gelmezse kagitta gecersiz kalir. */
@media print{
  .opsiyon-satiri>td{padding-top:1px;padding-bottom:1px;font-size:9.5px}
  .opsiyon-satiri:last-child>td{padding-bottom:7px}
  .opsiyon-ad{padding-left:74px}
  .kirilim-basligi{font-size:8px;margin-top:4px}
  .order-line-group{break-inside:avoid;page-break-inside:avoid}
  /* Makine/opsiyon grubu bos sayfa alani birakmadan satirlar arasinda bolunur. */
  .order-line-group[data-allow-print-split]{break-inside:auto;page-break-inside:auto}
  .order-line-group[data-allow-print-split]>tr{break-inside:avoid;page-break-inside:avoid}
  .order-line-group[data-allow-print-split] .opsiyon-satiri>td:first-child,
  .order-line-group[data-allow-print-split] .grup-toplam-satiri>td:first-child{color:var(--muted);font-size:10px}
}

/* Sipariş düzenleme (revizyon) bandı */
.order-edit-banner{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.6fr) auto;gap:14px;align-items:center;margin:0 0 14px;padding:14px 16px;border:2px solid var(--red, #e2231a);border-radius:14px;background:var(--surface, #fff)}
.order-edit-copy strong{display:block;font-size:15px}
.order-edit-copy span{display:block;font-size:12px;color:var(--muted);margin-top:3px}
.order-edit-reason{display:grid;gap:4px;font-size:12px;font-weight:600;color:var(--muted)}
.order-edit-reason textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:8px;padding:7px 9px;font:inherit;font-size:13px;color:var(--ink);background:var(--surface, #fff);resize:vertical}
.order-history-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:860px){.order-edit-banner{grid-template-columns:1fr}}

/* Müşteri teklifi (bayinin kendi müşterisine) */
.cq-info{margin:0 0 12px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface-alt, #f6f7f4);font-size:13px;color:var(--ink-soft)}
.cq-parties{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:16px;margin-bottom:14px}
.cq-party{display:grid;gap:3px;align-content:start;border:1px solid var(--line);border-radius:10px;padding:12px}
.cq-party .party-label{font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--red-text, #c01d17)}
.cq-party small{color:var(--muted);font-size:12px}
.cq-options{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.order-cq-tag{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:2px}
.order-saved .modal-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:12px}
@media (max-width:860px){.cq-parties{grid-template-columns:1fr}}

/* İmza: sabit alt şerit yerine kayan sayfanın en sonunda, küçük.
   (Bu uygulamada gövde kaymaz, sayfalar kendi içinde kayar.) */
body > .site-signature{display:none}


/* === 29.09 TELEFON DÜZENİ === ===================================== */
.add-cart-short{display:none}
.edit-reason-bottom{margin-top:16px}
.impersonation-exit-text{margin-left:6px}
#impersonationExit{display:inline-flex;align-items:center}

@media (max-width:860px){
  /* Temsil çubuğu: tek satır, uzun bayi adı kısalır; çıkış düğmesi küçük. */
  .impersonation-bar{flex-wrap:nowrap;gap:8px;padding:6px 12px;font-size:12px}
  .impersonation-label{min-width:0;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
  .impersonation-bar button{flex:0 0 auto;padding:5px 10px;font-size:14px;min-height:32px}
  .impersonation-exit-text{display:none}

  /* Başlık: aşağı kaydırınca gizlenir, yukarı kaydırınca geri gelir. */
  body.chrome-hidden .site-header,
  body.chrome-hidden .impersonation-bar{display:none}

  /* Fiyat paneli alta değil ÜSTE sabitlenir ve kapalıyken tek satırdır. */
  .price-panel-host{position:sticky;top:0;bottom:auto;z-index:6;grid-row:1}
  .mobile-tabs{grid-row:2}
  .config-side{grid-row:3}
  .visual-panel{grid-row:4}
  .configurator[data-mobile-tab="visual"] .visual-panel{grid-row:3}
  .configurator.no-side .visual-panel{grid-row:3}
  .configurator.no-side .price-panel-host{grid-row:1}
  .configurator,.configurator.layout-horizontal{grid-template-rows:auto auto auto auto}
  .price-panel{box-shadow:0 10px 24px -14px rgba(0,0,0,.55)}
  .price-panel:not(.settings-open){
    display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"toggle toggle" "total add";
    gap:6px 10px;padding:8px 10px;align-items:center;
  }
  .price-panel:not(.settings-open) .price-settings-toggle{grid-area:toggle;padding:4px 0;min-height:0;font-size:12px}
  .price-panel:not(.settings-open) .price-totals{grid-area:total}
  .price-panel:not(.settings-open) .total-line.grand{display:flex;flex-direction:column;align-items:flex-start;gap:0}
  .price-panel:not(.settings-open) .total-line.grand span{font-size:11px;opacity:.75}
  .price-panel:not(.settings-open) .total-line.grand strong{font-size:19px}
  .price-panel:not(.settings-open) .add-cart{grid-area:add;width:auto;padding:10px 14px}
  .add-cart-long{display:none}
  .add-cart-short{display:inline}
  /* Açılan ayarlar görsel sekmesini bütünüyle ekran altına itmesin. İçerik
     panelin içinde kayar; görsel ve seçenekler ana sayfada kalır. */
  .price-panel.settings-open{max-height:min(42dvh,360px);overflow-y:auto}

  /* Sipariş geçmişi kartı: yazılar üst üste binmez. */
  .order-history-card{grid-template-columns:44px minmax(0,1fr);grid-template-areas:"icon copy" "total total" "actions actions";gap:10px 12px;align-items:start}
  .order-history-icon{grid-area:icon}
  .order-history-copy{grid-area:copy}
  .order-history-copy small{word-break:break-word}
  .order-history-total{grid-area:total;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;text-align:left;gap:6px 10px;border-top:1px solid var(--line-soft);padding-top:8px}
  .order-history-actions{grid-area:actions;justify-content:stretch}
  .order-history-actions .button{flex:1 1 auto}

  /* Tüm form alanları 16px: iOS yakınlaştırması olmaz. */
  input,select,textarea{font-size:16px}
}

/* === 29.09 DENETİM: telefonda sipariş tablosu kart görünümü ============= */
.staff-order-hint{flex:1 1 100%;margin:0 0 4px;padding:10px 12px;border:1px dashed var(--line);border-radius:10px;color:var(--muted);font-size:13px;text-align:left}
/* 28.10.2026: dikey tablette (768–860px) de kart görünümü — tablo 830px
   genişlikteydi, KDV ve Tutar sütunları ekranın dışında kalıyordu. */
@media screen and (max-width:860px){
  .quote-paper .table-scroll{overflow-x:visible}
  .quote-paper .order-table{min-width:0;display:block}
  .quote-paper .order-table thead{display:none}
  .quote-paper .order-table tbody{display:block;border-top:1px solid var(--line);padding:10px 0}
  .quote-paper .order-table tr:not(.opsiyon-satiri){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 10px;align-items:end}
  .quote-paper .order-table td{border:0;padding:0}
  .quote-paper .order-table td.print-only{display:none!important}
  .quote-paper .order-table tr:not(.opsiyon-satiri) > td:first-child{display:none}
  .quote-paper .order-table tr:not(.opsiyon-satiri) > td:nth-child(2){grid-column:1/-1}
  .quote-paper .order-table tr:not(.opsiyon-satiri) > td.num{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;white-space:normal}
  .quote-paper .order-table tr:not(.opsiyon-satiri) > td.num::before{content:attr(data-label);font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
  .quote-paper .order-table tr:not(.opsiyon-satiri) > td.num:last-child strong{font-size:16px}
  .quote-paper .order-table tr.opsiyon-satiri{display:flex;justify-content:space-between;gap:10px;padding:3px 0;font-size:12px}
  .quote-paper .order-table tr.opsiyon-satiri td:empty,.quote-paper .order-table tr.opsiyon-satiri td:first-child{display:none}
  .quote-paper .order-table .row-edit-input{width:100%;max-width:120px}
  .quote-paper .order-table .row-edit-select{width:100%;max-width:120px}
}

/* === Sipariş düzenleme çubuğu (her ekranda) ============================ */
.edit-mode-bar{flex:0 0 auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:space-between;
  padding:8px 20px;background:#fff4d6;color:#5b4300;border-bottom:1px solid #f0d58a;font-size:13px}
.edit-mode-actions{display:flex;gap:8px}
.edit-mode-bar button{border:1px solid #c9a227;background:#fff;color:#3d2e00;border-radius:999px;padding:6px 12px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.edit-mode-bar button[data-editbar-open]{background:#3d2e00;color:#fff;border-color:#3d2e00}
:root[data-theme="dark"] .edit-mode-bar{background:#3a2f0e;color:#ffe7a3;border-color:#5a4a17}
.leave-edit p{margin:0 0 10px}
.leave-edit .modal-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:14px}
@media (max-width:860px){
  .edit-mode-bar{padding:6px 12px;font-size:12px;gap:6px}
  .edit-mode-actions{width:100%}
  .edit-mode-bar button{flex:1 1 auto;min-height:36px}
  body.chrome-hidden .edit-mode-bar{display:flex}
}
@media print{.edit-mode-bar{display:none!important}}

/* TR/EN dil düğmesi eklenince telefonda başlık sığsın diye küçük düğmeler
   biraz daraltıldı (logo görünür kalır). */
@media (max-width:700px){
  .header-actions{gap:4px}
  .header-actions .lang-toggle,.header-actions .theme-toggle{min-width:34px;padding:0 6px}
  .header-actions .session-button{max-width:72px}
  .header-actions .logout-button{padding:0 10px;font-size:12px}
}
@media (max-width:380px){
  .brand-button img{height:22px;object-fit:contain}
  .header-actions .session-button{max-width:56px;padding:5px 6px}
}

@media (max-width:900px){
  .main-nav .nav-full{display:none}
  .main-nav .nav-short{display:inline}
}
@media (max-width:700px){.main-nav{justify-content:space-between}}

/* Manuel opsiyon: para birimi seçimi (TL / USD / EUR) fiyat kutusunun sağında. */
.manual-price-field select{border:0;border-left:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);
  font:inherit;font-weight:700;font-size:13px;padding:0 8px;min-height:inherit;align-self:stretch;cursor:pointer}
.manual-price-field select:focus{outline:none}
.manual-tutar .manual-tl{display:block;font-size:11px;font-weight:500;color:var(--muted)}
/* Çıktı dili seçimi (yazdır düğmesinin yanında) */
.cikti-dili{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--muted);font-weight:600}
.cikti-dili button{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;
  min-height:32px;min-width:40px;padding:0 10px;font:inherit;font-weight:800;cursor:pointer}
.cikti-dili button.active{background:var(--ink);color:var(--surface);border-color:var(--ink)}
@media print{.cikti-dili{display:none!important}}
.manual-price-field input{flex:1 1 auto;min-width:0}

/* Birim fiyat kutusu: kuruşlu tutar (ör. 11509.09) kesilmeden görünsün. */
.order-table .row-edit-price{width:112px}
@media screen and (max-width:860px){ .quote-paper .order-table .row-edit-input.row-edit-price{max-width:150px} }

/* =====================================================================
   14.10.2026 BELGE REVİZYONU (Bilgilendirme Formu / Proforma / Müşteri
   teklifi — canlı belge ve kayıtlı çıktılar aynı kuralları kullanır)
   ===================================================================== */
/* Kâğıt: tarayıcının kendi üst/alt yazıları (tarih, sayfa adı, adres) basılmaz;
   sayfa kenar kutuları (boş) tanımlanınca Chrome/Edge onları kapatır.
   28.10.2026: çıktılarda imza yazısı yok. */
@page{
  size:A4;margin:12mm 12mm 14mm;
  @top-center{content:""}
  @bottom-center{content:""}
}
/* Fotoğraflar: makine 128×100 (eskisinin iki katı), opsiyon 64×50. */
.order-machine img{width:128px;height:100px;object-fit:contain}
.opsiyon-ad{padding-left:74px}
.opsiyon-satiri>td{vertical-align:middle}
.kirilim-ad{display:flex;align-items:center;gap:10px;min-width:0}
.kirilim-gorsel{width:64px;height:50px;object-fit:contain;flex:0 0 64px}
span.kirilim-gorsel{height:0}
/* Çıktıdaki alanlar: tek satır (Müşteri / Bayi · Teslim yeri · Ödeme şekli). */
.baski-alanlari{display:flex;gap:18px;margin:0 0 14px;padding:0 0 12px;border-bottom:1px solid var(--line-soft)}
.baski-alan{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:3px}
.baski-alan.genis{flex:2 1 0}
.baski-alan span{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.baski-alan strong{font-size:13px;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.baski-blok{display:none}
.baski-yalniz{display:none}
.belge-notu{white-space:pre-line}
.terms .belge-notu{font-size:11.5px;line-height:1.55;color:var(--ink-soft);margin:0 0 6px}
/* Toplamlar + imza alanları sayfa arasında bölünmez. */
.belge-son{break-inside:avoid;page-break-inside:avoid}
/* Müşteri teklifi: opsiyonlar fotoğraflı. */
.cq-opsiyonlar{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.cq-opsiyon{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--ink-soft)}
.cq-opsiyon .kirilim-gorsel{width:64px;height:50px;flex:0 0 64px;object-fit:contain}
.cq-opsiyon span.kirilim-gorsel{height:0}
/* WhatsApp düğmesi */
.button.whatsapp-button{display:inline-flex;align-items:center;gap:8px;background:#1f8f4e;border-color:#1f8f4e;color:#fff}
.button.whatsapp-button:hover{background:#18763f;border-color:#18763f;color:#fff}
.button.whatsapp-button svg{width:17px;height:17px;flex:0 0 auto}
@media print{
  .baski-blok{display:flex!important}
  .baski-yalniz{display:block!important}
  .banka-baski:has([data-baski]:empty){display:none!important}
  .totals .total-row.print-only{display:flex}
  .belge-notu:empty{display:none!important}
  .quote-page::after,.site-signature{display:none!important}
  .quote-summary{grid-template-columns:minmax(0,1.4fr) minmax(220px,.9fr)!important}
  .baski-alan strong{font-size:12px}
  .order-machine img{width:128px;height:100px}
  .opsiyon-ad{padding-left:74px}
  .belge-son{break-inside:avoid;page-break-inside:avoid}
}

/* === 28.10.2026 TELEFON / TABLET DENETİMİ ============================== */
/* Dokunmatik ekranlarda (telefon + tablet, yatay dahil) küçük kontroller
   parmakla rahat basılacak ölçüye büyütülür. Yazdırma/PDF'e etkisi yoktur. */
@media screen and (pointer:coarse){
  .fee-toggle{min-height:40px}
  .fee-toggle input{width:22px;height:22px}
  .row-edit-input,.row-edit-select{min-height:38px}
  .link-button.danger{min-width:44px;padding:0 8px}
  .price-panel:not(.settings-open) .price-settings-toggle{min-height:36px}
}
/* Telefonda üstteki kapalı fiyat şeridi: "Listeye ekle" düğmesi en az 230px
   geniş kaldığı için 360px ekranda "Genel toplam" tutarının sonu düğmenin
   altında kalıyordu (₺421.26… gibi). Düğme yazısı kadar daralır, tutar tam okunur. */
@media screen and (max-width:860px){
  .price-panel:not(.settings-open) .add-cart{min-width:0}
  .price-panel:not(.settings-open) .total-line.grand strong{white-space:nowrap}
}
/* ÇIKTI DÜZENİ v2 (28.10.2026) — Bilgilendirme Formu ve proforma çıktısı:
   makine ve opsiyonlar ayrı satır (birim fiyat / adet / para birimi / tutar),
   grup toplamı kutuda. Önceki düzen: git dalı "cikti-v1". */
.baski-satiri{display:none}
/* Telefon/tablet kart görünümündeki "tr{display:grid}" kuralı yalnız çıktı
   satırını ekranda göstermesin. */
@media screen{.quote-paper .order-table tr.baski-satiri{display:none!important}}
/* Çıktıda toplam kutusunda tek satır kaldıysa (Ara toplam yok) üst çizgisi olmaz. */
@media print{.totals .total-row.grand.baskida-tek{border-top:0;padding-top:0;margin-top:0}}
.grup-toplam-satiri>td{border-bottom:1px solid var(--line-soft);padding-top:6px;padding-bottom:12px;vertical-align:middle}
.grup-toplam-etiket{font-size:10px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700}
.grup-toplam-kutu{display:inline-block;border:1.5px solid var(--ink);border-radius:6px;padding:5px 10px;font-weight:700;font-size:13px;white-space:nowrap;font-variant-numeric:tabular-nums}
@media print{
  .order-table tr.baski-satiri{display:table-row}
  /* Sayı sütunları içerik kadar; makine adı sütunu kalan yeri alır. */
  .order-table th.num,.order-table td.num{width:1%;padding-left:14px;padding-right:4px}
  .order-machine strong{font-size:12px;line-height:1.3}
  .order-table tr.opsiyon-satiri:not(.taban)>td{font-size:11px;color:var(--ink)}
  .quote-summary{grid-template-columns:minmax(0,1.25fr) minmax(250px,1fr)!important}
}

/* 28.10.2026 — Belge notu: "Standart notu yazdır" düğmesi etiketin yanında. */
.not-alani .not-ust{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.not-standart-dugme{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;
  padding:4px 11px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap}
.not-standart-dugme:hover{border-color:var(--ink)}
.not-standart-dugme:focus-visible{outline:2px solid var(--red);outline-offset:2px}
@media screen and (pointer:coarse){.not-standart-dugme{min-height:36px;padding:0 12px}}
@media print{.not-alani{display:none!important}}

/* Konfigüratör: tablet ve masaüstünde fiyat önce, görsel altında. Açık fiyat
   ayarları kendi içinde kayar; toplam ve listeye ekleme düğmesi üst sırada
   kalır. Yüksekliğin geri kalanı görsel ve donanım panellerine ayrılır. */
@media screen and (min-width:768px){
  body[data-route="configurator"] #app{overflow:hidden}
  .configurator,.configurator.layout-horizontal{
    height:100%;min-height:0;overflow:hidden;gap:10px;
    grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr);
    grid-template-areas:"price price" "visual side";
  }
  .configurator.layout-horizontal{grid-template-columns:minmax(0,1.35fr) minmax(280px,340px)}
  .configurator.no-side,.configurator.no-side.layout-horizontal{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr);
    grid-template-areas:"price" "visual";
  }
  .price-panel-host{
    grid-area:price;grid-row:1;grid-column:1/-1;position:static;
    justify-self:stretch;align-self:stretch;width:auto;margin:0;
    max-height:none;min-height:0;overflow:visible;
  }
  .price-panel,.price-panel:not(.settings-open),.price-panel.settings-open{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(210px,.75fr);
    grid-template-areas:"lines totals toggle" "lines totals add";
    gap:7px 14px;align-items:center;padding:10px 14px;
    max-height:none;overflow:visible;
  }
  .price-panel.settings-open{
    grid-template-areas:"lines totals toggle" "lines totals add" "settings settings settings";
  }
  .price-panel .price-lines{grid-area:lines;display:flex;min-width:0}
  .price-panel .price-totals,.price-panel:not(.settings-open) .price-totals{
    grid-area:totals;display:flex;min-width:0;border-top:0;padding-top:0;
  }
  .price-panel .price-totals .total-line:not(.grand){display:flex}
  .price-panel .price-settings-toggle,.price-panel:not(.settings-open) .price-settings-toggle{
    grid-area:toggle;width:100%;min-width:0;padding:8px 10px;min-height:34px;
  }
  .price-panel .price-settings-toggle em{display:none}
  .price-panel .add-cart,.price-panel:not(.settings-open) .add-cart{
    grid-area:add;width:100%;min-width:0;min-height:40px;padding:8px 10px;
  }
  .price-panel .price-settings{
    grid-area:settings;min-width:0;min-height:0;
    max-height:min(20dvh,180px);overflow-y:auto;overscroll-behavior:contain;
  }
  .visual-panel{
    grid-area:visual;grid-row:2;grid-column:1;height:100%;min-height:0;
    padding:12px;grid-template-rows:auto minmax(0,1fr) auto;
  }
  .visual-top{padding-right:0}
  .selected-options-wrap{max-height:min(22dvh,120px)}
  .config-side{
    grid-area:side;grid-row:2;grid-column:2;align-self:stretch;
    height:100%;max-height:100%;min-height:0;overflow:hidden;
  }
  .side-columns{height:100%;max-height:100%;min-height:0}
  .configurator:not(.layout-horizontal) .side-panel{max-height:100%}
  .panel-body{overflow-y:auto}
}

@media screen and (min-width:768px) and (max-width:1399px){
  .add-cart-long{display:none}
  .add-cart-short{display:inline}
}

/* Dikey tablette fiyat ve sekmeler üstte kalır; seçilen bölüm kalan alanı
   kullanır. Görsel dışındaki sekmelerde seçilen opsiyonlar altta görünür. */
@media screen and (min-width:768px) and (max-width:860px){
  .configurator,.configurator.layout-horizontal,
  .configurator.no-side,.configurator.no-side.layout-horizontal{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto minmax(0,1fr) auto;
    grid-template-areas:none;
    height:100%;min-height:0;overflow:hidden;
  }
  .price-panel,.price-panel:not(.settings-open),.price-panel.settings-open{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(160px,.7fr);
  }
  .mobile-tabs{grid-row:2;grid-column:1}
  .config-side{grid-row:3;grid-column:1;align-self:stretch;height:100%;max-height:100%}
  .configurator .visual-panel,.configurator.no-side .visual-panel{
    grid-row:4;grid-column:1;height:auto;min-height:0;
  }
  .configurator[data-mobile-tab="visual"] .visual-panel,
  .configurator.no-side[data-mobile-tab="visual"] .visual-panel{
    grid-row:3;height:100%;min-height:0;display:grid;
  }
  .configurator[data-mobile-tab="visual"] .config-side{display:none}
  .configurator:not([data-mobile-tab="visual"]) .visual-panel{display:block;align-self:start}
  .configurator:not([data-mobile-tab="visual"]) .selected-options-wrap{border-top:0;padding-top:0}
  .configurator .side-columns{height:100%;max-height:100%}
  .configurator .side-panel,
  .configurator:not(.layout-horizontal) .side-panel,
  .layout-horizontal .side-columns:has(.option-panel) > .model-panel,
  .layout-horizontal .side-columns > .option-panel{
    max-height:100%;min-height:0;align-self:stretch;
  }
  .configurator .panel-body{overflow-y:auto}
}

/* Kısa yatay ekranda açık ayarlar fiyat satırını büyütüp fotoğrafı sıfıra
   indirmesin. Ayarlar fiyatın sağından açılır; toplam ve ekleme düğmesi
   yerinde kalır, fotoğraf solda görünmeye devam eder. */
@media screen and (min-width:768px) and (max-height:850px){
  .price-panel,.price-panel:not(.settings-open),.price-panel.settings-open{position:relative}
  .price-panel.settings-open{
    grid-template-areas:"lines totals toggle" "lines totals add";
  }
  .price-panel .price-settings{
    position:absolute;grid-area:auto;right:0;top:calc(100% + 6px);z-index:12;
    width:min(300px,48vw);max-height:min(27dvh,170px);
    overflow-y:auto;background:var(--panel);color:#fff;
    border:1px solid rgba(255,255,255,.18);border-radius:var(--radius-sm);
    box-shadow:0 14px 32px rgba(0,0,0,.28);
  }
}
@media screen and (min-width:768px) and (max-width:860px) and (max-height:850px){
  .price-panel .price-settings{top:calc(100% + 50px)}
  .configurator:has(.price-panel.settings-open) .machine-stage{justify-content:flex-start}
  .configurator:has(.price-panel.settings-open) .machine-stage img{max-width:calc(100% - min(300px,48vw))}
  .configurator:has(.price-panel.settings-open) .gallery-next{right:calc(min(300px,48vw) + 8px)}
  .configurator:has(.price-panel.settings-open) .gallery-position{left:calc((100% - min(300px,48vw))/2)}
}

/* Administrator display controls. */
.hide-catalog-prices .price-panel,.hide-catalog-prices .option-price,.hide-catalog-prices .selected-option-copy small{visibility:hidden}.hide-option-images .option-image,.hide-option-images .selected-option-media{display:none}.empty-state{padding:3rem;text-align:center}.root-group-visual img[src=""],.subgroup-media img[src=""]{display:none}