/* ==========================================================================
   VSRM YÜKLEMESİ (VSRM planı P2c, 2026-10-02) — ekranlar/vsrm-yukleme.js
   + Yükleme Özeti sayaç başlıkları. Renk ve yazı boyu yalnız tokens.css'ten
   (11 / 12.5 / 13.5 / 15 / 19 / 26); yeni renk yok.

   Ürünler sekmesinin tablosunu ORTAK çizici yazıyor (public/gozlem-tablo.js ·
   GozlemTablo); portal aynı sınıfları kendi jetonlarıyla çiziyor
   (public/portal/stiller/05-…, 06-…). Burada ERP görünümü.
   ========================================================================== */

/* ---- "?" düğmesi ve açıklama penceresi (gecmis-tablo.js) ----
   Parça geçmişi çekmecesindeki (.pg-ort) ile aynı görünüm. Pencere sabit
   konumlu; kabı `[data-pgt-balon-kabi].vy-soru-kap`. Yapışkan tablo başlığının
   (z-index 2) üstünde kalsın.

   GÖRÜNÜM KURALLARI BURADAN TAŞINDI → `bilesen/01-temel-dugme-panel-tablo.css`
   (KDE-0011, 2026-10-09, YALNIZ TAŞIMA — bildiriler birebir aynı, yalnız
   `.vy-soru-kap ` kapsamı düştü). Kurallarda VSRM'ye özgü hiçbir şey yoktu;
   kapsam yüzünden mekanizma yalnız bu ekranda çalışıyordu ve Stok
   tablosuna konan aynı düğmenin balonu `position` alamadan kayboluyordu.
   Bu ekranın görünümü DEĞİŞMEDİ: 01 daha önce yükleniyor, ezen kural yok. */
.vy-bas { display: inline-flex; align-items: center; gap: var(--bosluk-1); }

/* ---- Yükleme Özeti: Teslimat üçlüsü | Ürün üçlüsü ----
   GENİŞLİK ÖLÇÜLEREK (1440, 2026-10-02): başlığın en uzun satırı "TESLİMAT ?"
   81px, "DÖNEN ?" 68px (11px büyük harf + 20px düğme). Başlık hücresinin
   yatay dolgusu dar (6 + 8) — sayı hücresinin dolgusu aynı kalıyor. Tarih 9rem ·
   Müşteri 6rem · Ne değişti 7.75rem (uygulama katmanı) + 3 × 6.25 + 3 × 5.25 =
   916px; 1440'ta Dosya 186px (etiket sığar). Dar ekranda min-width (10-…css). */
#yuklemeTablo col.c-sayac { width: 6.25rem; }
#yuklemeTablo col.c-sayac.c-urun { width: 5.25rem; }
#yuklemeTablo th[data-sayac] { padding-left: 6px; padding-right: var(--bosluk-2) !important; }
/* Başlık metni akar, "?" son sözcüğün yanında (esnek kutu iki satırı tek blok
   sayıp düğmeyi yanına iterdi — sütun genişlerdi). */
#yuklemeTablo th[data-sayac] .vy-bas { display: inline; }
#yuklemeTablo th[data-sayac] .pgt-soru { margin-left: var(--bosluk-1); vertical-align: middle; }
#yuklemeTablo .grup-ayrac { border-left: 2px solid var(--line-strong); }

/* ---- Sayfa üstü: dosya etiketi + 6 sayaç ---- */
.vy-ust { display: flex; flex-direction: column; gap: var(--bosluk-3); }
.vy-dosya { font-size: var(--yazi-md); color: var(--ink); }
.vy-sayaclar {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
  border: 1px solid var(--line); border-radius: var(--radius);
}
.vy-sayac {
  display: flex; flex-direction: column; gap: var(--bosluk-1); min-width: 0;
  padding: var(--bosluk-2) var(--bosluk-3);
}
.vy-sayac + .vy-sayac { border-left: 1px solid var(--line); }
.vy-sayac.grup-ayrac { border-left: 2px solid var(--line-strong); }
.vy-sayac .vy-bas {
  font-size: var(--yazi-xs); font-weight: 700; letter-spacing: var(--harf-etiket);
  text-transform: uppercase; color: var(--muted);
}
/* Etiket METİN gibi akar, "?" son sözcüğün yanında: esnek kutuda iki satıra
   sarılan etiket + düğme tek blok sayılıyor, 390'da "?" hücreyi 13px aşıyordu
   (denetçi 2026-10-02). */
.vy-sayac .vy-bas { display: block; overflow-wrap: anywhere; }
.vy-sayac .vy-bas .pgt-soru { margin-left: var(--bosluk-1); vertical-align: middle; }
.vy-sayi { font-size: var(--yazi-baslik); font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }

/* ---- Sekmeler: sayfa düzeyinde şerit (Veri Panosu kalıbı) ---- */
/* Kenar payı açıkça sıfır: uygulama katmanındaki eski .sekme-bar kuralı -4px
   veriyor, şerit kabından 4px taşıyordu (görsel denetim, 2026-10-02). */
.vy-sekmeler { margin: 0 0 var(--bosluk-3); border: 1px solid var(--line); border-radius: var(--radius); }
/* Sekme paneli kendi blok bağlamı: içteki panelin alt kenar boşluğu dışarı
   taşmasın (taşarsa korunan alt boşlukla çakışıp 16px eksik ölçülüyordu). */
.vy-panel:not([hidden]) { display: flow-root; }

/* ---- Veri ---- */
.vy-veri-tablo td.vy-kod { font-weight: 700; white-space: nowrap; }
.vy-veri-tablo td.vy-tanim { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- Ürünler: gözlem tablosu (GozlemTablo sınıfları) ----
   Sabit yerleşim, ÖLÇÜLEREK (1440, 2026-10-02; en geniş içerik + 24 dolgu):
   kod + Rev 182 (13H30-58820-AA Rev AA 155; "Yeni Ürün" rozeti kodun ALTINDA, bu
   genişliğe katılmıyor) · tarih/termin 94 · adet 64 · statü rozeti 106 · iş emri
   no 148 (kalın bağlantı 122) · değişiklik rozeti 108 · Değişim Takibi rozeti 118
   = 914; ürün ismi kalanı alır (1440'ta ~188; uzun ad kırpılır, tam ad ipucunda).
   En az genişlik 1064 (isim ≥ 150) — 1440'ta kabına (1102) sığar; dar ekranda
   tablo kendi kabında yatay kayar, sayfa kaymaz. Başlıklar iki satıra sarabilir
   (ortak .sirala-satir nowrap'ı burada açık). */
.vy-arac .vy-cipler { flex-wrap: wrap; height: auto; min-height: var(--bant-boy); }
.vy-arac .vy-cipler .filtre-cip { height: auto; min-height: 26px; }
/* O yüklemede uyumsuz satır yoksa "Yalnız uyumsuz tarihler" pasif. */
.vy-arac .vy-cipler .filtre-cip:disabled { opacity: .55; cursor: default; background: none; }
.vy-urun-tablo { table-layout: fixed; min-width: 1064px; }
.vy-urun-tablo col.c-kod { width: 182px; }
.vy-urun-tablo col.c-tarih, .vy-urun-tablo col.c-termin { width: 94px; }
.vy-urun-tablo col.c-adet { width: 64px; }
.vy-urun-tablo col.c-statu { width: 106px; }
.vy-urun-tablo col.c-ie { width: 148px; }
.vy-urun-tablo col.c-tur { width: 108px; }
/* Değişiklik: satırın bütün rozetleri (Selim 2026-10-07); sığmazsa alt alta. İç
   sarmalayıcı esnek — hücre (td) tablo hücresi kalır. */
.vy-urun-tablo .vy-rozetler { display: flex; flex-wrap: wrap; gap: 3px; }
.vy-urun-tablo col.c-takip { width: 118px; }
.vy-urun-tablo .sirala-satir th { white-space: normal; line-height: 1.15; }
.vy-urun-tablo td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Başlık hücresiyle aynı yöne bakar (görsel denetim sutun-hizasi): VSRM tarihi
   ortalı (termin gibi, portaldaki görünüm), adet sağa yaslı (başlık da th.num). */
.vy-urun-tablo td.hucre-tarih { text-align: center; }
/* Kimlik grup başına bir kez (KD-0046): grubun ilk satırı üstten çizgiyle ayrılır. */
.vy-urun-tablo tbody tr.grup-bas > td { border-top: 2px solid var(--brand-line); }
.vy-urun-tablo tbody tr:first-child > td { border-top: 0; }
/* ÜRÜN GÖRSELİ (KDE-0030) — kutu ezilmesin: flex kabında 52px'lik görsel,
   uzun kod yer isteyince daralırdı. Ölçü öteki tablolarla aynı; satır
   bu tabloda zaten 52px, görsel yüksekliği artırmıyor. */
.vy-urun-tablo .hucre-kod-satir > .liste-gorsel { width: 52px; height: 36px; flex: 0 0 auto; }
.vy-urun-tablo .hucre-kod-satir { display: flex; align-items: center; gap: var(--bosluk-2); min-width: 0; }
.vy-urun-tablo .hucre-kod {
  min-width: 0; padding: 0; border: 0; background: none; cursor: pointer;
  font: inherit; font-weight: 700; color: var(--brand); text-align: left;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.vy-urun-tablo .hucre-kod:hover { color: var(--brand-dark); text-decoration: underline; }
.vy-urun-tablo .hucre-kod:focus-visible { outline: none; box-shadow: var(--odak); }
/* "Yeni Ürün" rozeti kodun altında kendi satırında; yalnız rozetli satır uzar. */
.vy-urun-tablo .vy-rozet-satir { margin-top: 3px; line-height: normal; }
.vy-urun-tablo td.hucre-kimlik:has(.vy-rozet-satir) { padding-top: var(--bosluk-1); padding-bottom: var(--bosluk-1); }
.vy-urun-tablo .hucre-rev { flex: 0 0 auto; font-size: var(--yazi-xs); font-weight: 700; color: var(--muted); }
.vy-urun-tablo .bos-deger { color: var(--muted); }
/* Uyumsuz tarih (yetişmesi imkânsız / sıkışık teslim): satır kırmızı, sebep ipucunda. */
.vy-urun-tablo tbody tr.uyumsuz > td { background: var(--red-row); color: var(--red); }
/* Kaldırılan teslimat: tarih ve adet hafif üstü çizili (parça geçmişindeki
   eskimiş değerle aynı çizgi); metin rengi aynı kalır (AAA). */
.vy-urun-tablo tr.vy-kaldirildi .hucre-tarih .sabit-deger,
.vy-urun-tablo tr.vy-kaldirildi td.num .sabit-deger {
  text-decoration: line-through; text-decoration-thickness: 1px;
  text-decoration-color: color-mix(in srgb, var(--muted) 55%, transparent);
}

/* ---- İş Emrine Etki: sınıf başına panel ---- */
.vy-etki h2 { display: flex; align-items: baseline; }
.vy-etki-tablo td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Gruplar alt alta hizalı: sabit yerleşim, ortak sütunlar aynı genişlikte;
   ürün ismi kalanı alır. Dar ekranda kendi kabında kayar. */
.vy-etki-tablo { table-layout: fixed; min-width: 860px; }
.vy-etki-tablo th.g-ie { width: 150px; }
/* 140 → 200px (ölçülen kusur 2026-10-11): kod 56px taşıyor ve ORTADAN
   KIRPILIYORDU. Hücre `nowrap` + `overflow: hidden` — kırpma bilinçli
   ("kod ve tarih sütunları tek satır kalır", denetçi RET 2) ama 140px bir
   kodu göstermeye yetmiyordu: sütunda önce 52px görsel duruyor (KDE-0030),
   koda ~76px kalıyor, 14 karakterlik parça numarası ~110px istiyor. Kırpma
   "uzun adı kısalt" değil, "kodu okunmaz yap" oluyordu.

   ÇÖZÜM GENİŞLETMEK, SARDIRMAK DEĞİL: sardırmak yukarıdaki kararı bozardı.
   52 + boşluk + 110 + dolgu ≈ 196 → 200px. Tablo zaten `min-width: 860px`
   ve kendi kabında kayıyor.

   İLK YAMA YANLIŞ ÖGEYEYDİ: `.pg-link`e `min-width: 0` yazmıştım — `min-width`
   satır içi ögede geçerli değil ve taşan kutu zaten o değildi. Ölçüm
   düzelmeyince kök sebep arandı. */
.vy-etki-tablo th.g-kod { width: 200px; }
.vy-etki-tablo th.g-gun { width: 110px; }
.vy-etki-tablo th.g-aralik { width: 190px; }
.vy-etki-tablo th.g-sayi { width: 100px; }
.vy-etki-tablo th.g-sayi.g-adet { width: 72px; }
/* Ürün ismi gerekirse İKİ SATIRA sarar (kırpılıp okunmaz olmasın — denetçi
   RET 2); kod ve tarih sütunları tek satır kalır. */
.vy-etki-tablo td.vy-isim-hucre { white-space: normal; overflow-wrap: anywhere; }
/* P3 — "Karar · Not" sütunu ve satır eylemleri (son yüklemede). Eylem
   sütunu düğmelerin ölçülen genişliği kadar; düğmeler içteki esnek kapta
   (hücrenin kendisi tablo hücresi kalır — td flex OLMAZ). */
.vy-etki-tablo th.g-karar-not { width: 130px; }
.vy-etki-tablo th.g-eylem-tarih { width: 140px; }   /* ölçülen düğme 111 px + 24 iç boşluk */
.vy-etki-tablo th.g-eylem-dustu { width: 220px; }   /* üç düğme 196 px + 24 */
.vy-etki-tablo th.g-eylem-adet { width: 230px; }    /* iki düğme 205 px + 24 */
.vy-etki-tablo td.vy-eylem-hucre { overflow: visible; text-overflow: clip; }
.vy-eylemler { display: flex; justify-content: flex-end; gap: var(--bosluk-2); }
/* 1280'de kabına sığar (ürün ismi sarar); dar ekranda kabında kayar. */
.vy-etki-tablo:has(th.g-eylem) { min-width: 900px; }

/* ---- Dar ekran ---- */
@media (max-width: 900px) {
  .vy-etki-tablo:has(th.g-eylem) { min-width: 1000px; }
  .vy-sayaclar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vy-sayac.grup-ayrac { border-left: 0; border-top: 2px solid var(--line-strong); }
  .vy-sayac:nth-child(n+4) { border-top: 2px solid var(--line-strong); }
  .vy-sayac:nth-child(5), .vy-sayac:nth-child(6) { border-left: 1px solid var(--line); }
}
@media (max-width: 720px) {
  .vy-arac input[type="search"] { min-width: 0; flex: 1 1 100%; }
  .vy-arac .sag { margin-left: 0; }
}

/* Üst çubuk başlığı (müşteri + tarih/saat) dar ekranda SARAR: ortak
   `.page-title` esnemiyor (flex 0 0 auto) ve 390'da başlık sağdan taşıyordu
   (ölçüldü: ana alan 403 > 390); çubuk da sabit yükseklikte (52/58px) olduğu
   için sarılan satır içeriğin üstüne biniyordu — çubuk içeriğe göre uzar
   (sütun esnek kabında küçülmesin diye flex-shrink 0).
   Yalnız bu görünüm açıkken. */
@media (max-width: 860px) {
  .app:has(#view-yukleme.active) .topbar { height: auto; flex-shrink: 0; padding-top: var(--bosluk-2); padding-bottom: var(--bosluk-2); }
  .app:has(#view-yukleme.active) .page-title { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
}