/* ===== Master Veri — CRM Ayarlar kalıbı: solda dikey menü, sağda kartlar ===== */
.master-duzen { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 22px; align-items: start; }
.master-menu { position: sticky; top: 12px; border-right: 1px solid var(--line); padding-right: 14px; }
.master-menu .sekme-bar.master-sekmeler { flex-direction: column; gap: 4px; border-bottom: 0; margin: 0; }
/* `white-space: normal` ŞART. Taban `.sekme` kuralı `nowrap` diyor — yatay
   sekme çubuğunda doğru, ama burada menü dikey ve 250px'lik kolonda
   "Üretim Metodu Tanımlama" gibi uzun etiketler sağdan TAŞIYORDU.
   `min-width: 0` da gerekli: flex öğesi varsayılan olarak içeriğinden küçülmez
   ve sarma devreye girmez. */
.master-menu .sekme { justify-content: flex-start; width: 100%; min-width: 0;
  padding: 10px 12px; border-bottom: 0; margin: 0; white-space: normal;
  line-height: 1.3; text-align: left;
  border-radius: 8px; color: var(--ink); font-weight: 400; font-size: var(--yazi-md); }
.master-menu .sekme .ic { width: 20px; text-align: center; flex: 0 0 auto; }
.master-menu .sekme:hover { background: var(--panel-2); color: var(--ink); }
.master-menu .sekme.aktif { background: var(--brand-soft); color: var(--brand-dark); font-weight: 700; border-bottom: 0; }
.master-menu .sekme .sekme-say { margin-left: auto; }

/* ÇEKMECE — alt bölümü olan menü başlıkları (Tanımlar, Kullanıcılar).
   Alt başlıklar panel içinde ikinci bir sekme çubuğu olmak yerine menünün
   altına iniyor; iki katmanlı sekme kalmıyor. */
.mm-cekmece { display: flex; flex-direction: column; }
.mm-bas .mm-ok {
  margin-left: auto; font-size: var(--yazi-xs); color: var(--muted);
  transition: transform .15s;
}
.mm-cekmece.acik .mm-bas .mm-ok { transform: rotate(90deg); }
.mm-govde { display: flex; flex-direction: column; gap: 2px; padding: 2px 0 4px; }
.mm-alt {
  border: 0; background: transparent; cursor: pointer; font: inherit;
  font-size: var(--yazi-sm); color: var(--muted); text-align: left;
  /* Girinti başlıkla hizalı: ikon 20px + 8px boşluk + 12px iç boşluk */
  padding: 7px 12px 7px 40px; border-radius: 8px; line-height: 1.25;
}
.mm-alt:hover { background: var(--panel-2); color: var(--ink); }
.mm-alt.aktif { background: var(--brand-soft); color: var(--brand-dark); font-weight: 700; }
/* Sağ sütun: paneller kart; iki sütuna sığanlar yan yana */
.master-icerik .panel { border-radius: 10px; }
#view-master .master-icerik .grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.master-icerik .panel.akordeon > h2 { font-size: var(--yazi-lg); }
@media (max-width: 960px) {
  .master-duzen { grid-template-columns: 1fr; }
  .master-menu { position: static; border-right: 0; padding-right: 0; }
  .master-menu .sekme-bar.master-sekmeler { flex-direction: row; flex-wrap: wrap; }
  .master-menu .sekme { width: auto; }
  #view-master .master-icerik .grid-2 { grid-template-columns: 1fr; }
}
/* VSRM Bağlantısı paneli: form ızgarası pencere dışında da üç sütun, etiket üstte, kutu tam genişlik
   (#popupGovde kuralı yalnız pencerede geçerliydi; panelde etiket ve kutu iç içe geçiyordu) */
.vb .form-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 16px; }
.vb .form-izgara label { display: flex; flex-direction: column; gap: 5px; font-size: var(--yazi-sm); color: var(--muted); font-weight: 700; }
.vb .form-izgara label small { font-weight: 400; }
.vb .form-izgara input { width: 100%; box-sizing: border-box; border: 1px solid var(--line-strong); border-radius: var(--radius); padding: 8px 10px; font: inherit; color: var(--ink); }
.vb .form-izgara input:focus { outline: 2px solid var(--brand-line); border-color: var(--brand); }
@media (max-width: 900px) { .vb .form-izgara { grid-template-columns: minmax(0, 1fr); } }


/* ================= İş Emri Detay — çekmece menü (KD-0027, 2026-09-10) =================
   Ürünler bloğu hep açık; altındaki bölümler kapalı çekmece. Başlık büyük ve
   koyu (brand-dark), özet sağda; açılınca Master Veri akordeonuyla aynı
   yumuşak geçiş (I-35). Çekmece içindeki eski panel başlıkları (h5) gizli —
   ad zaten çekmecede yazıyor, iki kez okutmak gürültü. */
.ie-blok { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); margin: 0 0 14px; overflow: hidden; }
.ie-blok-bas { display: flex; align-items: baseline; gap: 12px; padding: 12px 16px; background: #f3f3f3; border-left: 4px solid var(--brand); }
.ie-blok-ad, .ick-ad { font-size: var(--yazi-lg); font-weight: 700; color: var(--brand-dark); letter-spacing: .01em; }
.ie-blok-ozet { font-size: var(--yazi-sm); color: var(--muted); }
.ie-blok .table-wrap { margin: 0; }
.ie-blok .ie-urun-tablo { margin: 0; }

.ie-cekmece { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); margin: 0 0 12px; overflow: hidden; }
.ie-cekmece-bas { width: 100%; display: flex; align-items: center; gap: 12px; padding: 12px 16px;
  background: #f3f3f3; border: 0; border-left: 4px solid var(--brand); cursor: pointer;
  font: inherit; text-align: left; color: var(--ink); user-select: none; }
.ie-cekmece.kapali > .ie-cekmece-bas { border-left-color: var(--line-strong); }
.ie-cekmece-bas:hover { background: #e6e6e6; }
.ie-cekmece-bas:focus-visible { outline: 2px solid var(--brand-dark); outline-offset: -2px; }
.ick-ok { display: inline-block; color: var(--muted); transition: transform .3s ease; }
.ie-cekmece.kapali .ick-ok { transform: rotate(-90deg); }
.ick-ozet { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; font-size: var(--yazi-sm); }
.ick-notr { color: var(--muted); }
.ick-tamam { color: var(--brand-dark); font-weight: 700; }
.ick-bekleyen { background: var(--brand-dark); color: #fff; font-weight: 700; padding: 2px 9px; border-radius: 999px; }
.ie-cekmece > .akordeon-govde { display: grid; grid-template-rows: 1fr; transition: grid-template-rows .4s cubic-bezier(.4,0,.2,1); }
.ie-cekmece > .akordeon-govde > .akordeon-ic { min-height: 0; overflow: hidden; opacity: 1; transition: opacity .3s ease .1s; }
.ie-cekmece.kapali > .akordeon-govde { grid-template-rows: 0fr; }
.ie-cekmece.kapali > .akordeon-govde > .akordeon-ic { opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility 0s .4s; }
.ie-cekmece .ie-malzeme { margin: 0; padding: 14px 16px; background: #fff; border: 0; border-radius: 0; }
.ie-cekmece .iem-baslik h5, .ie-cekmece .ie-panel-bas h5 { display: none; }
.ie-cekmece .panel-bos-not { margin: 0; }
.ie-cekmece .ie-urun-blok { border: 0; padding: 14px 16px; margin: 0; }
.ie-cekmece .ie-urun-blok + .ie-urun-blok { border-top: 1px solid var(--line); }
/* Tablo başlığı ilk bakışta ayrılsın: kalın, koyu, tonlu zemin */
.ie-cekmece thead th { background: #eef1f2; color: var(--brand-dark); font-weight: 700; }
/* Çekmece başlığındaki özet içeride bir daha çizilmesin (eski panel başlığı) */
.ie-cekmece .iem-baslik > .fs-ozet { display: none; }

/* Yükleme Özeti: saat küçük ve soluk, tarih tam punto (Selim 2026-09-10) */
#yuklemeTablo .yuk-saat { font-size: var(--yazi-xs); color: var(--muted); margin-left: 3px; }
/* "Ne değişti ›" düğmesi kırpılmasın: sütun düğme genişliğine göre (düğme 96px
   + hücre dolgusu 24 + hover kayması; ölçüldü VSRM P2c, 2026-10-02) */
#yuklemeTablo col.c-nd { width: 7.75rem; }
/* Yükleme Özeti sayaç başlığı: global `.num` nowrap'ı yeniyor, iki sözcüklü
   başlık + "?" iki satıra iner (KD-0029). */
.table-wrap #yuklemeTablo th.num { white-space: normal; }

/* Eylem düğmeleri sağa yaslı — ilk eylem (İptal) boşluğu alır. Birleştir
   düğmesi KD-0078 ile kalktı; yaslama onunla birlikte kaybolmasın. */
#ieIptalKip { margin-left: auto; }
.ie-arac-bar #ieExcel { margin-left: 0; }

/* İç (aşama) çekmeceleri: üst çekmeceden bir kademe küçük, girintili */
.ie-cekmece.kucuk { margin: 0 0 8px; border-color: var(--line); }
.ie-cekmece.kucuk > .ie-cekmece-bas { padding: 9px 14px; background: #f7f7f7; }
.ie-cekmece.kucuk .ick-ad { font-size: var(--yazi-md); }
.ie-cekmece.kucuk .sk-govde { padding: 12px 14px; }
.ie-cekmece.kucuk > .akordeon-govde > .akordeon-ic > .bos { padding: 16px; }

/* ---- Bölüm türleri (Selim 2026-09-29, ekran notu [19]-[22]) ----
   "Açılır menülerin farkını algılayamıyorum; malzeme ile ön hazırlık aynı
   formdaymış gibi." Üç görünüm, renkler token'dan, yeni metin yok:
   SÜREÇ (Üretim Ağacı & Rota) tonlu çerçeve — içindeki aşamalar o zeminde
   beyaz kart; KAYNAK (Malzeme, Tedarikçi, Satın Alma, Zaman, Maliyet, Lot)
   beyaz başlık, lacivert şerit, süreçten boşlukla ayrı grup; AŞAMA (iç)
   şeridi ve adı üstteki ilerleme çubuğunun rengini taşır. */
.ie-cekmece.surec { border-color: var(--brand-line); }
.ie-cekmece.surec > .ie-cekmece-bas,
.ie-cekmece.surec.kapali > .ie-cekmece-bas { background: var(--brand-soft); border-left: 6px solid var(--brand); }
.ie-cekmece.surec > .ie-cekmece-bas:hover { background: var(--panel); }
.ie-cekmece.surec > .akordeon-govde > .akordeon-ic { background: var(--brand-soft); border-top: 1px solid var(--brand-line); }
.ie-cekmece.surec .ie-urun-blok { background: transparent; }

.ie-cekmece.surec + .ie-cekmece.kaynak { margin-top: var(--bosluk-5); }
.ie-cekmece.kaynak { margin-bottom: var(--bosluk-2); }
.ie-cekmece.kaynak > .ie-cekmece-bas { background: var(--panel); border-left-color: var(--brand-dark); }
.ie-cekmece.kaynak.kapali > .ie-cekmece-bas { border-left-color: var(--line-strong); }
.ie-cekmece.kaynak > .ie-cekmece-bas:hover { background: var(--panel-2); }
.ie-cekmece.kaynak > .akordeon-govde > .akordeon-ic { border-top: 1px solid var(--line); }

.ie-cekmece.kucuk { background: var(--panel); }
.ie-cekmece.kucuk > .ie-cekmece-bas,
.ie-cekmece.kucuk.kapali > .ie-cekmece-bas { background: var(--panel); border-left: 4px solid var(--line-strong); }
.ie-cekmece.kucuk > .ie-cekmece-bas:hover { background: var(--panel-2); }
.ie-cekmece.kucuk.asama-onhazirlik > .ie-cekmece-bas { border-left-color: var(--amber); }
.ie-cekmece.kucuk.asama-uretim > .ie-cekmece-bas { border-left-color: var(--brand); }
.ie-cekmece.kucuk.asama-sevkiyat > .ie-cekmece-bas { border-left-color: var(--green); }
.ie-cekmece.kucuk.asama-onhazirlik > .ie-cekmece-bas .ick-ad { color: var(--amber); }
.ie-cekmece.kucuk.asama-uretim > .ie-cekmece-bas .ick-ad { color: var(--brand); }
.ie-cekmece.kucuk.asama-sevkiyat > .ie-cekmece-bas .ick-ad { color: var(--green); }

/* <details> geçişi (KD-0043): içerik yükseklikle birlikte solarak gelir */
details.gecis { box-sizing: border-box; }
details[open] > :not(summary) { animation: det-acilis .35s ease; }
@keyframes det-acilis { from { opacity: 0; } to { opacity: 1; } }
/* Ürün kartı sayfalarında çekmece HAREKETSİZ açılır (Selim 2026-09-29,
   ekran notu [7]–[10]: "animasyonları beğenmedim, ekran otomatik kayıyor").
   Kayma/yükseklik tarafı ekranlar/ortak.js'teki summary işleyicisinde. */
#view-urun details[open] > :not(summary),
#view-yarimamul details[open] > :not(summary) { animation: none; }

/* Rotadan havuza geri sürüklerken havuz hedef olduğunu söyler (KD-0045) */
.rb-liste.rb-geri-hedef { outline: 2px dashed var(--brand); outline-offset: -2px; background: var(--brand-soft); }


/* EKSİK TANIMLI SATIN ALMA SATIRI (kullanıcı isteği 2026-09-14).
   Rozet tek başına küçük kalıyordu; tedarikçisi seçilmemiş parça listede
   göze çarpmalı — o parça sipariş açılamaz durumda. */
.eksik-tanim-satir > td { background: var(--red-bg); }
.eksik-tanim-satir:hover > td { background: #fde8e8; }


/* MALZEME KUTUSU — hammadde kutusunun kardeşi (kullanıcı isteği 2026-09-14).
   İkisi ayrı soru: malzeme "neden yapılıyor", hammadde "hangi stok
   kaleminden kesiliyor". Durum etiketi kütüphanede olup olmadığını söylüyor;
   olmaması hata değil, yalnız bilgi — CAD'den gelen ad kütüphaneye girmeden
   önce de yazılabilmeli. */
/* 2026-09-23: tek metin kutusu yerine Kategori → Malzeme kademesi. Kademe
   sınıfları hammadde seçicisinden (`hmb-`) geliyor; "aynısı olsun" denen şey
   görünüm, ikinci bir stil yazmak ikisinin ayrışmasını beklemek olurdu. */
.malzeme-kutu > h5 { margin: 0 0 8px; font-size: var(--yazi-lg); }
.malzeme-kutu .mlz-ekle { margin-bottom: 6px; }
.mlz-durum:empty { display: none; }

/* ÇOKLU SEÇİMLİ AÇILIR MENÜ (Selim 2026-10-01) — Malzeme Kategorisi ve
   Malzeme Çeşidi. Kapalıyken 'select' görünümünde bir düğme; açılınca onay
   kutulu panel sayfanın üstüne açılır (altındaki hammadde kutusunu itmez). */
.cs { position: relative; }
.cs-dugme {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 220px; height: var(--row-h); padding: 0 10px;
  font: inherit; font-size: var(--yazi-md); font-weight: 400; color: var(--ink); text-align: left;
  background: var(--panel); border: 1px solid var(--line-strong); border-radius: var(--radius);
  cursor: pointer;
}
.cs-dugme::after {
  content: ''; flex: none; margin-top: 4px;
  border: 5px solid transparent; border-top-color: var(--muted);
}
.cs-dugme[aria-expanded='true'] { border-color: var(--brand); }
.cs-ozet { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-ozet.bos { color: var(--faint); }
.cs-panel {
  position: absolute; z-index: 30; top: calc(100% + 2px); left: 0;
  display: flex; flex-direction: column; gap: 2px;
  min-width: 100%; max-height: 260px; overflow-y: auto; padding: 4px;
  background: var(--panel); border: 1px solid var(--line-strong); border-radius: var(--radius);
}
.cs-panel[hidden] { display: none; }
.cs-og {
  display: flex; align-items: center; gap: 8px; padding: 5px 8px;
  border-radius: var(--radius); font-size: var(--yazi-sm); font-weight: 400;
  color: var(--ink); white-space: nowrap; cursor: pointer;
}
.cs-og:hover { background: var(--hover); }
.cs-og input { flex: none; margin: 0; }

/* Hammaddenin malzeme kademesi sabit okuma alanına döndü (5. istek). Üç
   durumun üçü de GÖRÜNÜR: seçili, seçilmemiş, defterde yok. Sessiz boş liste
   ekranı bozuk gösterir. */
.hmb-cins-sabit {
  min-width: 130px; max-width: 260px; padding: 6px 9px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--panel); font-size: var(--yazi-sm); font-weight: 400;
  white-space: normal;
}
.hmb-cins-sabit.ok    { border-color: var(--brand); background: var(--brand-soft); color: var(--brand); font-weight: 700; }
.hmb-cins-sabit.yok   { color: var(--muted); font-style: italic; }
.hmb-cins-sabit.eksik { border-color: var(--red-line); background: var(--red-bg); color: var(--red); }

/* Malzeme ve Hammadde tek çekmecede (3. istek): iki kutu alt alta, aralarında
   ince ayraç — tek başlık altında ama hâlâ iki ayrı soru. */
.mh-govde > .hmb-kutu { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }

.mlz-durum { font-size: var(--yazi-sm); }
.mlz-durum.serbest { color: var(--amber); }
.mlz-durum.yok     { color: var(--red); }

/* SEVK EDİLMİŞ SEVKİYAT SATIRI — üstü çizili (kullanıcı isteği 2026-09-29).
   Satır silinmiyor: "bu tarihte şu kadar sevk edildi" bir kayıt. Çizgi
   METNE veriliyor, satıra değil — `<tr>` üzerinde `line-through` bazı
   tarayıcılarda hücre kenarlıklarını da çiziyor. */
.sk-sevk td { color: var(--muted); }
.sk-sevk td:not(.satir-eylem) { text-decoration: line-through; }
/* Rozetin üstü ÇİZİLMİYOR: durum etiketi bir işaret, cümle değil. */
.sk-sevk .badge, .sk-sevk .ie-badge { text-decoration: none; }

/* İŞ EMRİ ÜRÜN LİSTESİ — çıktısı yerinde olan ürün (sevk edilmiş ya da
   stoğa alınmış) üstü çizili. Sevkiyat Kalemleri'ndeki `.sk-sevk` ile aynı
   dil ve aynı gerekçe: satır silinmiyor, iş bitti diye işaretleniyor.

   Tarih GİRDİSİ ve yüzdeler çizilmiyor: girdi hâlâ kullanılabilir olmalı,
   yüzde de bir sayı değil bir ölçüm. */
.ie-cikti td { color: var(--muted); }
.ie-cikti td:not(.iut-teslim):not(.iut-yuzde) { text-decoration: line-through; }
.ie-cikti .badge, .ie-cikti .ie-badge { text-decoration: none; }

/* ==========================================================================
   DAR EKRAN (< 1400px) — Selim kararı 2026-09-29: "Sağ panel daralır, tablo
   kayar." Sütun sıfıra inip başlık kırpılmaz; tablo en az okunur genişliğini
   korur ve KENDİ KABINDA (.table-wrap) yatay kayar — sayfa kaymaz.
   ========================================================================== */
/* Tablo alt sınırları: sabit sütunların toplamı + esneyen sütuna okunur pay.
   İş Emri Oluştur: 560px sabit + Ürün Adı ≥ 160 (1280'de 22px'e iniyordu). */
.sip-tablo { min-width: 720px; }
/* Yükleme Özeti: sabit sütunlar 916px (VSRM P2c: 6 sayaç sütunu) + Dosya ≥ 124. */
#yuklemeTablo { min-width: 1040px; }
/* Üretim Metodları: 610px sabit + Üretim Metodu adı ≥ 180 (1280'de 60px, 1024'te 0). */
#pmListe { min-width: 790px; }
/* Sevkiyat Kuyruğu: ürün hücresi (kod · Rev · ad) sarabilsin — tek satıra
   zorlanan ad tabloyu 1280'de 101px taşırıyordu. Kod yine tek satır.
   İKİ SATIRLI hücre: metin üst/alt çizgiye yapışmasın diye dikey dolgu
   (satır − satır içi düğme farkı, 34−28 → 3px) YALNIZ bu hücrede; genel
   td dolgusu 0 kalır, --row-h tek kaynak. */
#sevkTablo td:nth-child(3) { white-space: normal; min-width: 140px; padding-block: calc((var(--row-h) - var(--tik-h)) / 2); }
#sevkTablo td:nth-child(3) > b { white-space: nowrap; }
/* Panel başlığındaki düğmeler başlıkla aynı satıra sığmazsa alt satıra iner;
   başlığı üç satıra ezmez, panelin dışına taşmaz (Master Veri, 1024'te 66-118px). */
.panel.akordeon > h2, .master-icerik .panel > h2:has(> .btn) { flex-wrap: wrap; row-gap: var(--bosluk-2); }
.master-icerik .panel > h2:has(> .btn) { display: flex; align-items: center; gap: var(--bosluk-2); }
.master-icerik .panel > h2:has(> .btn) .sablon-btn { margin-left: auto; }
/* Bağlantılar / Yedekleme kutuları sabit 560-620px isteyip kartın dışına
   taşıyordu (1024'te 144-204px): kabın genişliğini aşmasın. */
#view-master .vb { min-width: min(560px, 100%); }
#view-master .yd { min-width: min(620px, 100%); }
@media (max-width: 1399px) {
  /* Sağ panel daralır (340 → 300), tabloya yer açılır. */
  .sip-duzen { grid-template-columns: minmax(0, 1fr) 300px; }
  /* Ayarlar sol menüsü daralır (250 → 210). */
  .master-duzen { grid-template-columns: 210px minmax(0, 1fr); gap: var(--bosluk-4); }
  /* Süzgeç çipleri araç çubuğundan taşmasın; sığmazsa kendi içinde kayar
     (Kalite Tanımları, 1024'te 19-64px). 700px kuralının aynısı. */
  .toolbar .filtre-cipler { overflow-x: auto; max-width: 100%; }
}
@media (max-width: 1199px) {
  /* Ön Hazırlık / Sevkiyat aşamaları yan yana sığmıyor (aşama satırı eylemleri
     74-122px taşıyordu): alt alta. */
  #view-master .master-icerik .grid-2 { grid-template-columns: minmax(0, 1fr); }
}
