/* ============================================================
   ECES PAPER — MARKA + TASARIM KATMANI (v3 "sessiz profesyonel")
   docs/KURALLAR.md §15-§16: WowDash template dosyalarına dokunulmaz;
   tüm görsel özelleştirmeler yalnızca bu dosyada yaşar.

   v3 tasarım dili (kullanıcı geri bildirimi üzerine):
   - Nötr-öncelikli yüzeyler: renk yalnızca eylem ve durum bildirir.
   - Petrol yeşili tek vurgu; geniş dolgular yerine yumuşak tonlamalar.
   - Bol beyaz alan, ince (1px) yumuşak sınırlar, çok hafif gölgeler.
   - Tipografi: FIGTREE (Eces Paper'ın baştan beri kullandığı yazı),
     logoda SORA. İKİSİ DE KENDİ SUNUCUMUZDA. Baştaki kurulumda bu
     yazılar Google Fonts'tan çekiliyordu ve kullanıcının ağına HİÇ
     inmiyordu — tarayıcı sessizce Windows'un Segoe UI'sına düşüyordu,
     yani tasarlanan yazı hiç görünmedi. Artık woff2 dosyaları
     public/assets/fonts/ içinde: dış servise bağımlılık yok.
   ============================================================ */

/* ---------- 0) YAZI TİPLERİ (yerel, değişken woff2) ----------
   Tek dosya tüm kalınlıkları taşır. latin-ext altkümesi Türkçe
   ğ ş İ ı karakterleri için ŞARTTIR. font-display: swap → yazı inene
   kadar sayfa boş beklemez. */
@font-face {
  font-family: "Figtree";
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url(../fonts/figtree-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Figtree";
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url(../fonts/figtree-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Sora";
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url(../fonts/sora-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Sora";
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url(../fonts/sora-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---------- 1) Renk değişkenleri ----------
   Işık temasında template'in gri/birincil skalası yeniden ayarlanır.
   html[data-theme=light] kapsamı: koyu temanın kendi değerleri bozulmaz. */
html[data-theme=light] {
  /* Nötr gri hiyerarşisi — profesyonel, hafif soğuk */
  --neutral-50: #F8FAFC;
  --neutral-100: #F2F4F7;
  --neutral-200: #E9EDF1;
  --neutral-300: #D0D5DD;
  --neutral-400: #98A2B3;
  --neutral-500: #667085;
  --neutral-600: #475467;
  --neutral-700: #344054;
  --neutral-800: #1D2939;
  --neutral-900: #101828;

  /* AŞAMA 9 — derinlik: yüzeyler SAF BEYAZ, sayfa zemini belirgin gri.
     Önceden ikisi de #F6F8FA idi; kartlar zeminle aynı renk olunca ekran
     tek düz bir yüzey gibi görünüyordu ("cansız"). */
  --bg-color: #FFFFFF;           /* kart / satır / panel yüzeyi */
  --eces-tuval: #E9EEF3;         /* sayfa zemini — kartları yüzdürür */
  --border-color: #D7DEE7;       /* sınırlar görünür olsun */
  --input-form-light: #C3CCD8;

  /* Durum tonları: soluk zemin + okunur koyu metin (yumuşak rozetler) */
  --warning-100: #FDF0D3;
  --warning-600: #B25E09;
  --success-100: #DCF3E4;
  --success-600: #14804A;
  --danger-100: #FCE5E1;
  --danger-600: #C0362C;

  /* Petrol tonlarının açık basamakları — YALNIZ açık temada opak.
     Koyu temada aşağıdaki saydam karşılıklar geçerlidir; aksi halde
     koyu arayüzde parlak açık lekeler oluşur. */
  --primary-50: #EEF6F5;
  --primary-100: #D8EBE9;
  --primary-200: #B0D7D4;
}

:root {
  /* WowDash birincil skalası (mavi) → Eces petrol yeşili */
  --primary-300: #7FBCB8;
  --primary-400: #4CA09C;
  --primary-500: #2E8783;
  --primary-600: #17706B; /* ana marka rengi */
  --primary-700: #135C58;
  --primary-800: #0F4946;
  --primary-900: #0B3736;

  /* Eces kehribar vurgusu (yalnız logo ve marka öğeleri) */
  --eces-altin: #E19A2B;

  /* Katman değişkenleri */
  --eces-golge: 0 1px 2px rgba(16, 24, 40, 0.04);
  --eces-golge-2: 0 4px 14px rgba(16, 24, 40, 0.06);
  --eces-aktif-zemin: rgba(23, 112, 107, 0.08);
  --eces-aktif-metin: var(--primary-700);
  --eces-hover-zemin: rgba(16, 24, 40, 0.04);
}

[data-theme=dark] {
  --eces-golge: 0 1px 2px rgba(0, 0, 0, 0.25);
  --eces-golge-2: 0 4px 14px rgba(0, 0, 0, 0.3);
  --eces-aktif-zemin: rgba(76, 160, 156, 0.16);
  --eces-aktif-metin: var(--primary-300);
  --eces-hover-zemin: rgba(255, 255, 255, 0.05);

  /* Açık ton basamaklarının koyu tema karşılıkları: saydam petrol.
     Template'in koyu bloğunda unutulmuş açık değişkenler de burada
     düzeltilir (neutral-100, warning-100, danger-100) — koyu modda
     parlak beyaz/sarı leke kalmaz. */
  --primary-50: rgba(76, 160, 156, 0.12);
  --primary-100: rgba(76, 160, 156, 0.20);
  --primary-200: rgba(76, 160, 156, 0.32);
  --neutral-100: #232E3B;
  --warning-100: rgba(255, 159, 41, 0.15);
  --danger-100: rgba(239, 68, 68, 0.16);
}

/* ---------- 2) Tipografi ----------
   FIGTREE — Eces Paper'ın baştan beri kullandığı arayüz yazısı; artık
   kendi sunucumuzdan yükleniyor (yukarıdaki @font-face). Yedek olarak
   sistem yazısı bırakıldı: dosya bir şekilde inmezse arayüz yine okunur
   kalır. --eces-yazi tek yerde durur: değiştirmek gerekirse burası yeter. */
:root {
  --eces-yazi: "Figtree", -apple-system, BlinkMacSystemFont,
    "Segoe UI Variable Text", "Segoe UI", system-ui, Roboto, "Noto Sans",
    Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
}

body {
  font-family: var(--eces-yazi);
  background-color: var(--eces-tuval, var(--bg-color));
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--eces-yazi);
  letter-spacing: -0.012em;
  color: var(--text-primary-light);
}

/* Form ve düğme öğeleri tarayıcı varsayılanına düşmesin; ikon yazı
   tipleri (remixicon) BİLİNÇLİ olarak bu listede yoktur. */
.btn, .form-control, .form-select, .dropdown-menu, .sidebar-menu,
input, select, textarea, button, table, .modal, .pagination {
  font-family: var(--eces-yazi);
}

/* Sayısal değerler hizalı otursun (tablolar, sayaçlar, barkodlar) */
table, .eces-sayi, .eces-mkart .d, .utp-ozet-k .s {
  font-variant-numeric: tabular-nums;
}

/* ---------- 3) Sayfa düzeni ve ritim ----------
   Ferahlık: içerik alanına daha cömert dolgu + çok geniş ekranda
   satır uzunluğunu sınırlayan azami genişlik. */
.dashboard-main-body {
  padding: 1.75rem 2rem 2.5rem;
  max-width: 1560px;
  margin-inline: auto;
  width: 100%;
}

@media (max-width: 767px) {
  .dashboard-main-body {
    padding: 1.25rem 1rem 2rem;
  }
}

/* Sayfa başlığı bloğu: başlık + yardım + kırıntı */
.eces-sayfa-baslik {
  margin-bottom: 1.75rem;
}

.eces-sayfa-baslik h6 {
  font-size: 1.375rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.eces-altbaslik {
  font-size: 0.875rem;
  color: var(--neutral-500);
  margin-top: 0.375rem;
}

/* Form sayfaları: kart, sayfa başlığıyla aynı hizada sola yaslanır ve
   tek tip genişlikte kalır — ortada yüzen küçük kutu hissi yok. */
.eces-form-alan {
  max-width: 58rem;
}

.eces-kirinti {
  font-size: 0.8125rem;
  color: var(--neutral-500);
}

.eces-kirinti a {
  color: var(--neutral-500);
}

.eces-kirinti a:hover {
  color: var(--primary-600);
}

/* ---------- 4) Üst çubuk ---------- */
.navbar-header {
  border-bottom: 1px solid var(--border-color);
}

/* Barkod kutusu: dolgulu-sessiz görünüm; odakta markaya uyanır */
.navbar-search input {
  background-color: var(--neutral-100);
  border-color: transparent;
  border-radius: 0.625rem;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.navbar-search input:focus {
  background-color: var(--white);
  border-color: var(--primary-400);
  box-shadow: 0 0 0 3px rgba(23, 112, 107, 0.12);
}

.navbar-search .icon {
  color: var(--neutral-400);
}

/* ---------- 5) Kenar menüsü ----------
   Kaba dolu-renk aktif kutu yerine: yumuşak tonlu hap + kalın metin.
   Gezinme sessizleşir, aktif öğe yine ilk bakışta seçilir. */
.sidebar {
  border-inline-end: 1px solid var(--border-color);
}

.sidebar-logo,
.sidebar-menu-area {
  border-inline-end: 0;
}

.sidebar-logo {
  border-block-end: 1px solid var(--border-color);
}

.sidebar-menu > li + li {
  margin-block-start: 2px;
}

.sidebar-menu li a {
  padding: 0.5625rem 0.75rem;
  border-radius: 0.625rem;
  font-weight: 500;
  color: var(--neutral-600);
  transition: background-color 0.15s ease, color 0.15s ease;
}

.sidebar-menu li a:hover {
  background-color: var(--eces-hover-zemin);
  color: var(--text-primary-light);
}

.sidebar-menu li > a.active-page,
.sidebar-menu li > a.active-page:hover {
  background-color: var(--eces-aktif-zemin);
  color: var(--eces-aktif-metin);
  font-weight: 600;
}

.sidebar-menu li.dropdown.open > a,
.sidebar-menu li.dropdown.dropdown-open > a,
.sidebar-menu li.dropdown.open > a:hover,
.sidebar-menu li.dropdown.dropdown-open > a:hover {
  background-color: transparent;
  color: var(--text-primary-light);
}

.sidebar-menu .sidebar-submenu li.active-page a {
  background-color: var(--eces-aktif-zemin);
  color: var(--eces-aktif-metin);
}

.sidebar-menu li a .menu-icon {
  color: var(--neutral-400);
  transition: color 0.15s ease;
}

.sidebar-menu li a:hover .menu-icon,
.sidebar-menu li > a.active-page .menu-icon {
  color: inherit;
}

/* Bölüm başlıkları: küçük, aralıklı, çok sessiz */
.sidebar-menu .sidebar-menu-group-title {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--neutral-400);
  margin-block: 1.25rem 0.375rem;
  padding-inline: 0.75rem;
}

@media (min-width: 1650px) {
  .sidebar-menu .sidebar-menu-group-title {
    font-size: 0.6875rem;
  }
  .sidebar-menu li a {
    font-size: 0.9375rem;
  }
  .sidebar-menu li a .menu-icon {
    font-size: 1.25rem;
  }
}

/* ---------- 6) Kartlar ----------
   Ağır gölge yerine: 1px yumuşak sınır + zar gibi ince gölge. */
.card {
  border: 1px solid var(--border-color);
  box-shadow: var(--eces-golge);
}

.card .card-header {
  padding: 1.0625rem 1.5rem;
  border-bottom: 1px solid var(--border-color);
}

.card .card-body {
  padding: 1.5rem;
}

.card .card-title {
  font-size: 1rem !important;
  font-weight: 650;
  letter-spacing: -0.01em;
}

/* Tıklanabilir kartlar (panel özet kutuları) nazikçe yanıt verir */
a.card {
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

a.card:hover {
  border-color: var(--primary-200);
  box-shadow: var(--eces-golge-2);
  transform: translateY(-1px);
}

/* Panel özet kutusu içeriği */
.eces-ozet-deger {
  font-size: 1.625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.eces-ozet-ikon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* ---------- 7) Düğmeler ---------- */
.btn {
  font-weight: 600;
  letter-spacing: 0.005em;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.btn-primary {
  --bs-btn-bg: var(--primary-600);
  --bs-btn-border-color: var(--primary-600);
  --bs-btn-hover-bg: var(--primary-700);
  --bs-btn-hover-border-color: var(--primary-700);
  --bs-btn-active-bg: var(--primary-800);
  --bs-btn-active-border-color: var(--primary-800);
  --bs-btn-disabled-bg: var(--primary-300);
  --bs-btn-disabled-border-color: var(--primary-300);
  box-shadow: var(--eces-golge);
}

.btn-primary:focus-visible {
  box-shadow: 0 0 0 3px rgba(23, 112, 107, 0.25);
}

/* İkincil düğmeler ("Vazgeç" vb.): dolgulu gri kutu yerine hayalet düğme */
.btn.bg-neutral-200 {
  background-color: var(--white) !important;
  border: 1px solid var(--neutral-300);
  color: var(--neutral-600) !important;
}

.btn.bg-neutral-200:hover {
  background-color: var(--neutral-50) !important;
  border-color: var(--neutral-400);
  color: var(--neutral-700) !important;
}

/* Küçük tonlu düğmeler (Hepsini Seç vb.) */
.btn.bg-primary-50 {
  border: 1px solid transparent;
}

.btn.bg-primary-50:hover {
  background-color: var(--primary-100) !important;
}

/* ---------- 8) Formlar ---------- */
.form-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--neutral-700);
  margin-bottom: 0.375rem;
}

.form-control, .form-select {
  border-color: var(--neutral-300);
  color: var(--text-primary-light);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-control::placeholder {
  color: var(--neutral-400);
}

.form-control:focus, .form-select:focus {
  border-color: var(--primary-400);
  box-shadow: 0 0 0 3px rgba(23, 112, 107, 0.12);
}

.form-check-input:checked {
  background-color: var(--primary-600);
  border-color: var(--primary-600);
}

.form-check-input:focus {
  box-shadow: 0 0 0 3px rgba(23, 112, 107, 0.12);
}

/* ---------- 9) Tablolar ----------
   Sakin başlık satırı (küçük büyük-harf etiketler), ferah hücreler,
   fark edilir ama bağırmayan satır vurgusu. */
.bordered-table thead tr th,
.basic-border-table thead tr th,
.table.basic-table thead tr th {
  font-size: 0.75rem !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--neutral-500) !important;
  background-color: var(--neutral-50) !important;
  /* Yatay dolgu bilerek dar: sütun sayısı arttıkça (sevkiyat, irsaliye,
     üretim geçmişi) 16 px dolgu tabloyu 1920 px'in altındaki ekranlarda
     yana kaydırıyordu. 10 px ile liste 1440 px'te de sığıyor. */
  padding: 0.7rem 0.625rem !important;
}

.bordered-table tbody tr td,
.basic-border-table tbody tr td,
.table.basic-table tbody tr td {
  font-size: 0.8125rem;
  padding: 0.75rem 0.625rem !important;
  color: var(--neutral-600);
}

/* İlk ve son sütun kenardan biraz daha ferah dursun */
.bordered-table thead tr th:first-child,
.bordered-table tbody tr td:first-child,
.table.basic-table thead tr th:first-child,
.table.basic-table tbody tr td:first-child { padding-left: 1rem !important; }
.bordered-table thead tr th:last-child,
.bordered-table tbody tr td:last-child,
.table.basic-table thead tr th:last-child,
.table.basic-table tbody tr td:last-child { padding-right: 1rem !important; }

.bordered-table tbody tr:hover td,
.table.basic-table tbody tr:hover td {
  background-color: var(--neutral-50);
}

.bordered-table, .basic-border-table {
  border-color: var(--border-color);
}

/* ŞABLON TUZAĞI (kök neden): WowDash `.bordered-table`'a
   `min-width: max-content` veriyor — tablo ASLA daralmıyor, metin
   sarmalamıyor, bu yüzden sütunu çok olan listeler (sevkiyat, irsaliye,
   üretim geçmişi) 1920 px'in altındaki her ekranda yatay kayıyordu.
   Burada sıfırlanır: tablo kabına sığar, uzun metinler satır başı yapar.
   Gerçekten sığmadığı dar ekranlarda .table-responsive yine kaydırır. */
.bordered-table, .basic-border-table, .table.basic-table {
  min-width: 0;
  width: 100%;
}

.bordered-table thead tr th, .bordered-table tbody tr td {
  border-color: var(--border-color) !important;
}

/* ---------- 10) Rozetler ---------- */
.badge {
  font-weight: 600;
  letter-spacing: 0.01em;
  border-radius: 999px !important;
}

/* ---------- 11) Uyarı şeritleri ----------
   Bağıran renkli kutular yerine: kart yüzeyi + solda ince renk çizgisi.
   Renk yalnız kenarda ve ikonda konuşur; metin normal mürekkeptedir.
   Her iki temada da aynı sakin dil (yüzey değişkeni kendiliğinden döner). */
.alert {
  background-color: var(--white) !important;
  border: 1px solid var(--border-color) !important;
  border-inline-start-width: 3px !important;
  color: var(--text-secondary-light) !important;
  font-weight: 500 !important;
}

.alert.bg-success-100 { border-inline-start-color: var(--success-main) !important; }
.alert.bg-danger-100  { border-inline-start-color: #D92D20 !important; }
.alert.bg-warning-100 { border-inline-start-color: #D97706 !important; }

.alert.bg-success-100 > iconify-icon { color: var(--success-main); }
.alert.bg-danger-100  > iconify-icon { color: #F04438; }
.alert.bg-warning-100 > iconify-icon { color: #D97706; }

/* Aktif işlem çalışma kartı: tam sarı çerçeve yerine hafif amber iması */
.eces-aktif-kart {
  border-color: rgba(217, 119, 6, 0.4);
}

[data-theme=dark] .eces-aktif-kart {
  border-color: rgba(255, 159, 41, 0.35);
}

/* ---------- 12) Boş durumlar ----------
   Her zaman tam ortalı: ikon yumuşak halkada, altında mesaj + eylem. */
.eces-bos {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3.5rem 1.5rem;
  gap: 0.25rem;
}

.eces-bos-ikon {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 50%;
  background: var(--eces-aktif-zemin);
  color: var(--primary-500);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.875rem;
}

.eces-bos-baslik {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--neutral-700);
  margin: 0;
}

.eces-bos-aciklama {
  font-size: 0.875rem;
  color: var(--neutral-500);
  max-width: 30rem;
  margin: 0;
}

.eces-ikon {
  display: block;
}

/* ---------- 13) Sayfa yardımı (info düğmesi + pencere) ---------- */
.eces-info-dugme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.875rem;
  height: 1.875rem;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--neutral-400);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.eces-info-dugme:hover {
  background: var(--eces-aktif-zemin);
  color: var(--primary-600);
}

.eces-yardim h6 {
  font-size: 0.9375rem;
  font-weight: 650;
  margin: 1.125rem 0 0.5rem;
  color: var(--primary-700);
}

.eces-yardim h6:first-child {
  margin-top: 0;
}

.eces-yardim p,
.eces-yardim li {
  line-height: 1.65;
  color: var(--neutral-600);
}

.eces-yardim ul,
.eces-yardim ol {
  padding-left: 22px;
  margin-bottom: 8px;
  display: grid;
  gap: 6px;
}

.eces-yardim .ipucu {
  background: var(--primary-50);
  border-left: 3px solid var(--primary-400);
  border-radius: 8px;
  padding: 10px 14px;
  margin-top: 14px;
  color: var(--neutral-700);
}

[data-theme=dark] .eces-yardim .ipucu {
  background: var(--eces-aktif-zemin);
  color: var(--text-secondary-light);
}

/* ---------- 14) Pencereler (modal) ---------- */
.modal-content {
  border: 1px solid var(--border-color);
  box-shadow: var(--eces-golge-2);
}

.modal-header {
  padding: 1.125rem 1.5rem;
  border-bottom: 1px solid var(--border-color);
}

.modal-body {
  padding: 1.5rem;
}

.modal-footer {
  border-top: 1px solid var(--border-color);
}

/* ---------- 15) Sayfalama ---------- */
.pagination .page-link {
  border-color: var(--border-color);
  color: var(--neutral-600);
  font-weight: 500;
}

.pagination .page-item.active .page-link,
.pagination .page-link.active {
  background-color: var(--primary-600);
  border-color: var(--primary-600);
  color: #fff;
}

.pagination .page-link:focus {
  box-shadow: 0 0 0 3px rgba(23, 112, 107, 0.12);
}

/* ---------- 16) Alt bilgi ---------- */
.d-footer {
  background-color: transparent;
  border-top: 1px solid var(--border-color);
  font-size: 0.8125rem;
  color: var(--neutral-500);
}

/* ---------- 17) Erişilebilirlik: klavye odağı ---------- */
a:focus-visible,
button:focus-visible {
  outline: 2px solid rgba(23, 112, 107, 0.4);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ---------- 18) Logo ---------- */
.eces-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  line-height: 1;
  text-decoration: none;
}

.eces-mark {
  flex-shrink: 0;
  display: block;
  border-radius: 22%;
}

.eces-logo-soz {
  /* Logo yazısı SORA — marka kimliği (yerel woff2). */
  font-family: "Sora", var(--eces-yazi);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.05em;
  color: var(--neutral-900, #111827);
  white-space: nowrap;
}

.eces-logo-soz b {
  font-weight: 700;
  color: var(--eces-altin);
}

/* Kenar menüsü kapalıyken yalnız işaret (SVG) gösterilir */
.sidebar-logo .eces-logo-mini { display: none; }
.sidebar.active .sidebar-logo .eces-logo-full { display: none; }
.sidebar.active .sidebar-logo .eces-logo-mini { display: inline-flex; }
.sidebar.active:hover .sidebar-logo .eces-logo-full { display: inline-flex; }
.sidebar.active:hover .sidebar-logo .eces-logo-mini { display: none; }

[data-theme=dark] .eces-logo-soz {
  color: #E9F0EE;
}

/* ---------- 19) Giriş ekranı sol pano ---------- */
.eces-auth-pano {
  background:
    radial-gradient(120% 90% at 15% 10%, rgba(225, 154, 43, 0.10) 0%, rgba(225, 154, 43, 0) 45%),
    linear-gradient(160deg, #0B3736 0%, #0F4946 55%, #135C58 100%);
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.eces-auth-pano .eces-logo-dev .eces-logo-soz {
  font-size: 40px;
  color: #EAF2F0;
}

.eces-auth-pano .eces-slogan {
  color: rgba(234, 242, 240, 0.78);
  font-size: 18px;
  margin-top: 18px;
}

.eces-barkod-deko {
  display: inline-flex;
  align-items: flex-end;
  gap: 4px;
  height: 44px;
  margin-top: 40px;
}

.eces-barkod-deko i {
  display: block;
  height: 100%;
  background: #EAF2F0;
  opacity: 0.92;
  border-radius: 1px;
}

.eces-barkod-deko i.a {
  background: var(--eces-altin);
}

/* Şifre göster/gizle düğmesi (giriş ekranı) */
.eces-sifre-alani {
  position: relative;
}

.eces-sifre-alani input {
  padding-inline-end: 3.25rem;
}

.eces-sifre-dugme {
  position: absolute;
  inset-inline-end: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5rem;
  height: 2.5rem;
  border: 0;
  border-radius: 0.625rem;
  background: transparent;
  color: var(--neutral-400);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}

.eces-sifre-dugme:hover {
  color: var(--primary-600);
  background: var(--eces-aktif-zemin);
}

.eces-sifre-dugme:focus-visible {
  outline: 2px solid rgba(23, 112, 107, 0.4);
  outline-offset: 1px;
}

/* ---------- 20) Bobin zaman çizelgesi (EK-04) ---------- */
.eces-zaman {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.eces-olay {
  position: relative;
  display: flex;
  gap: 0;
  padding-left: 26px;
}

.eces-nokta {
  position: absolute;
  left: 0;
  top: 5px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  box-shadow: 0 0 0 3px var(--white);
}

.eces-olay:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 21px;
  bottom: -16px;
  width: 2px;
  background: var(--neutral-200, #EBECEF);
}

/* ---------- 21) Kullanıcı avatarı (baş harf) ---------- */
.eces-avatar {
  background-color: var(--primary-100);
  color: var(--primary-800);
  font-size: 15px;
  line-height: 1;
}

[data-theme=dark] .eces-avatar {
  background-color: var(--primary-800);
  color: #D8EBE9;
}

/* ---------- 22) Koyu tema okunurluk cilası ----------
   Açık temaya göre ayarlanmış metin tonları koyu zeminde sönük kalır;
   burada yalnız koyu temada parlaklıkları yükseltilir. */
[data-theme=dark] .text-primary-600 { color: var(--primary-300) !important; }
[data-theme=dark] .hover-text-primary:hover { color: var(--primary-300) !important; }
[data-theme=dark] .text-danger-600 { color: #F97066 !important; }
[data-theme=dark] .text-success-600 { color: #55C57E !important; }
[data-theme=dark] .text-warning-600 { color: #F7B155 !important; }
[data-theme=dark] .text-neutral-600 { color: var(--text-secondary-light) !important; }

[data-theme=dark] .form-label,
[data-theme=dark] .eces-bos-baslik {
  color: var(--text-secondary-light);
}

[data-theme=dark] .eces-bos-aciklama,
[data-theme=dark] .eces-altbaslik,
[data-theme=dark] .eces-kirinti,
[data-theme=dark] .eces-kirinti a,
[data-theme=dark] .d-footer {
  color: var(--neutral-400);
}

[data-theme=dark] .eces-yardim h6,
[data-theme=dark] .eces-bos-ikon {
  color: var(--primary-300);
}

[data-theme=dark] .bordered-table thead tr th,
[data-theme=dark] .basic-border-table thead tr th,
[data-theme=dark] .table.basic-table thead tr th {
  color: var(--neutral-400) !important;
}

[data-theme=dark] .bordered-table tbody tr td,
[data-theme=dark] .basic-border-table tbody tr td,
[data-theme=dark] .table.basic-table tbody tr td {
  color: var(--text-secondary-light);
}

/* Hayalet düğmeler koyu temada: dolgusuz, ince açık sınır */
[data-theme=dark] .btn.bg-neutral-200 {
  background-color: transparent !important;
  border-color: rgba(255, 255, 255, 0.18);
  color: var(--text-secondary-light) !important;
}

[data-theme=dark] .btn.bg-neutral-200:hover {
  background-color: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.3);
}

/* Uyarı şeridi metni koyu temada da nötr mürekkep kalır (renk kenarda) —
   yukarıdaki text-*-600 parlatmalarından sonra gelmeli */
[data-theme=dark] .alert {
  color: var(--text-secondary-light) !important;
}

/* ============================================================
   ÜRETİM TAKİP PANELİ (Aşama 7)
   Yerleşim: kullanıcının gönderdiği üretim paneli — yoğun, tek
   ekranda, bordürlü alt paneller, koyu başlıklı tablolar.
   Renk/tipografi: Eces Paper (petrol yeşili + sistem yazısı). Tüm renkler
   tema değişkenlerinden gelir; koyu tema kendiliğinden çalışır.
   ============================================================ */

/* --- özet kartlar --- */
.utp-ozet { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-bottom: 16px; }
.utp-ozet-k {
  background: var(--bg-color); border: 1px solid var(--border-color); border-left: 3px solid var(--neutral-300);
  border-radius: 12px; padding: 13px 16px;
}
.utp-ozet-k .s { font-size: 24px; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.utp-ozet-k .e { font-size: 12px; color: var(--neutral-500); margin-top: 3px; }
.utp-ozet-k.hazir { border-left-color: var(--primary-600); }
.utp-ozet-k.uretimde { border-left-color: #2E8783; }
.utp-ozet-k.bugun { border-left-color: var(--success-600); }
.utp-ozet-k.kalite { border-left-color: var(--warning-600); }
.utp-ozet-k.kalite.var { border-left-color: var(--danger-600); }

/* --- filtre çubuğu --- */
.utp-filtre { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; margin-bottom: 18px; }
.utp-filtre .alan { display: flex; flex-direction: column; gap: 4px; }
.utp-filtre label { font-size: 11.5px; font-weight: 600; color: var(--neutral-500); }

/* --- numaralı bölüm başlığı --- */
.utp-bolum { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 22px 0 10px; font-weight: 700; font-size: 15px; }
.utp-no {
  display: grid; place-items: center; min-width: 23px; height: 23px; border-radius: 7px;
  background: var(--primary-600); color: #fff; font-size: 12px; font-weight: 800; flex: none;
}
.utp-adet { background: var(--primary-50); color: var(--primary-600); font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.utp-ipucu { color: var(--neutral-500); font-size: 12px; font-weight: 400; }

/* --- iş satırı (kapalı) --- */
.utp-satir {
  display: flex; align-items: center; gap: 12px; justify-content: space-between; flex-wrap: wrap;
  background: var(--bg-color); border: 1px solid var(--border-color); border-radius: 13px;
  padding: 12px 16px; margin-bottom: 8px; text-decoration: none; color: inherit; transition: border-color .15s;
}
.utp-satir:hover { border-color: var(--primary-200); color: inherit; }
.utp-satir .ad { font-weight: 700; font-size: 14px; }
.utp-satir .alt { font-size: 12px; color: var(--neutral-500); margin-top: 2px; display: flex; flex-wrap: wrap; gap: 3px 14px; }
.utp-satir .alt b { color: var(--neutral-700); font-weight: 600; }
.utp-satir .sag { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.utp-ok { color: var(--neutral-400); font-size: 15px; flex: none; }

/* --- açık iş kartı --- */
.utp-is { border: 1px solid var(--primary-200); border-radius: 16px; background: var(--bg-color); overflow: hidden; margin-bottom: 10px; }
.utp-is-bas { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 15px 18px; border-bottom: 1px solid var(--border-color); }
.utp-is-bas h5 { font-size: 16.5px; font-weight: 700; margin: 0; }
.utp-is-govde { padding: 16px 18px; }
.utp-kunye { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; color: var(--neutral-500); margin-top: 5px; }
.utp-kunye b { color: var(--neutral-700); font-weight: 600; }

/* --- safha rotası --- */
.utp-rota { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 14px; }
.utp-safha {
  border: 1px solid var(--border-color); background: var(--bg-color); border-radius: 999px;
  padding: 7px 13px; font-size: 12px; font-weight: 600; color: var(--neutral-500);
  display: inline-flex; align-items: center; gap: 7px;
}
.utp-safha .yzd { background: var(--neutral-100); color: var(--neutral-600); font-size: 10.5px; font-weight: 700; padding: 1px 7px; border-radius: 999px; }
.utp-safha.bitti { color: var(--neutral-700); }
.utp-safha.bitti .yzd { background: var(--success-100); color: var(--success-600); }
.utp-safha.aktif { background: var(--primary-50); border-color: var(--primary-200); color: var(--primary-600); font-weight: 700; }
.utp-safha.aktif .yzd { background: var(--primary-100); color: var(--primary-600); }
.utp-safha.devredildi { text-decoration: line-through; opacity: .65; }
.utp-ayrac { color: var(--neutral-400); font-size: 13px; }

/* --- duruş şeridi --- */
.utp-durus {
  display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  background: var(--bg-color); border: 1px solid var(--border-color); border-left: 3px solid var(--danger-600);
  border-radius: 10px; padding: 11px 15px; margin-bottom: 14px;
}
.utp-durus b { font-size: 13px; color: var(--danger-600); }
.utp-durus span { font-size: 12px; color: var(--neutral-500); }

/* --- etiket başlığı --- */
.utp-etk { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--neutral-500); margin: 16px 0 8px; }
.utp-etk:first-child { margin-top: 0; }
.utp-etk .nrm { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--neutral-400); }

/* --- makine kartları --- */
.utp-makineler { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }
.utp-makine { border: 1px solid var(--border-color); border-radius: 11px; padding: 10px 12px; }
.utp-makine.secili { border-color: var(--primary-200); background: var(--primary-50); }
.utp-makine b { font-size: 12.5px; font-weight: 700; display: block; }
.utp-makine small { display: block; color: var(--neutral-500); font-size: 11.5px; margin-top: 2px; }

/* --- sipariş ilerlemesi --- */
.utp-kutu { border: 1px solid var(--border-color); border-radius: 12px; padding: 13px 15px; margin-top: 13px; }
.utp-ilerleme { display: grid; grid-template-columns: 150px 80px 1fr 170px; gap: 14px; align-items: center; }
.utp-ilerleme .k { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--neutral-500); }
.utp-ilerleme .v { font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; margin-top: 2px; }
.utp-cubuk { height: 9px; background: var(--neutral-200); border-radius: 999px; overflow: hidden; }
.utp-cubuk i { display: block; height: 100%; background: var(--primary-600); border-radius: 999px; }

/* --- reçete satırları --- */
.utp-recete { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--border-color); font-size: 12.5px; }
.utp-recete:last-child { border-bottom: 0; }
.utp-recete .k { color: var(--neutral-500); }
.utp-recete b { font-weight: 700; font-variant-numeric: tabular-nums; }

/* --- KPI --- */
.utp-kpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 13px; }
.utp-kpi .k { border: 1px solid var(--border-color); border-radius: 12px; padding: 11px 13px; }
.utp-kpi .kk { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--neutral-500); }
.utp-kpi .kv { font-size: 19px; font-weight: 800; margin-top: 3px; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.utp-kpi .ka { font-size: 11px; color: var(--neutral-500); margin-top: 1px; }
.utp-kpi .k.iyi .kv { color: var(--success-600); }
.utp-kpi .k.uyari .kv { color: var(--warning-600); }
.utp-kpi .k.kotu .kv { color: var(--danger-600); }

/* --- dilimleme planı --- */
.utp-plan { border: 1px solid var(--primary-200); border-radius: 13px; overflow: hidden; margin-top: 14px; }
.utp-plan-bas { background: var(--primary-50); border-bottom: 1px solid var(--primary-200); padding: 10px 15px; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; }
.utp-plan-bas b { font-size: 13px; font-weight: 800; color: var(--primary-600); }
.utp-plan-bas span { font-size: 11.5px; color: var(--neutral-500); }
.utp-plan-govde { padding: 14px 15px; }
.utp-serit { display: flex; height: 54px; border-radius: 9px; overflow: hidden; border: 1px solid var(--input-form-light); }
.utp-dilim { display: grid; place-items: center; gap: 1px; min-width: 0; background: var(--primary-50); border-right: 1px solid var(--bg-color); font-size: 12px; font-weight: 800; color: var(--primary-600); }
.utp-dilim:last-child { border-right: 0; }
.utp-dilim small { font-size: 9.5px; font-weight: 500; color: var(--neutral-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; padding-inline: 3px; }
.utp-dilim.fire { background: repeating-linear-gradient(135deg, var(--danger-100) 0 5px, transparent 5px 10px); color: var(--danger-600); font-size: 10px; min-width: 36px; }
.utp-serit-olcu { display: flex; justify-content: space-between; font-size: 11px; color: var(--neutral-500); margin-top: 5px; }
.utp-denetim { margin-top: 11px; border-radius: 9px; padding: 9px 13px; font-size: 12.5px; font-weight: 600; }
.utp-denetim.ok { background: var(--success-100); color: var(--success-600); }
.utp-denetim.uyari { background: var(--danger-100); color: var(--danger-600); }

/* "Kaça bölünecek?" — dilimlemenin ilk ve tek zorunlu sorusu */
.utp-bol-soru { background: var(--neutral-50); border: 1px solid var(--border-color); border-radius: 11px; padding: 12px 14px; margin-bottom: 14px; }
.utp-bol-soru .s { font-size: 13.5px; font-weight: 800; color: var(--neutral-700); margin-bottom: 9px; }
.utp-bol-ipucu { font-size: 11.5px; color: var(--neutral-500); align-self: center; flex: 1 1 220px; min-width: 0; }
.utp-bol-ozel { display: flex; flex-wrap: wrap; gap: 6px; border-top: 1px dashed var(--border-color); padding-top: 9px; }
.utp-bol-ozel[hidden] { display: none; }
/* Ana bobinde yapılmış, parçaya miras kalan adım: bitmiş ama soluk */
.utp-safha.devralindi { opacity: .8; }
.utp-safha.devralindi .yzd { background: var(--neutral-100); color: var(--neutral-600); }

/* --- tablolar: koyu petrol başlık + toplam şeridi --- */
.utp-tablo-sar { overflow-x: auto; border: 1px solid var(--border-color); border-radius: 11px; }
.utp-tablo { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 640px; margin: 0; }
.utp-tablo thead th { background: var(--primary-600); color: #fff; text-align: left; padding: 9px 12px; font-weight: 600; font-size: 11.5px; white-space: nowrap; }
.utp-tablo td { padding: 9px 12px; border-bottom: 1px solid var(--border-color); vertical-align: middle; }
.utp-tablo tbody tr:last-child td { border-bottom: 0; }
.utp-tablo .sag { text-align: right; }
.utp-tablo .sayi { font-variant-numeric: tabular-nums; }
.utp-toplam { background: var(--primary-600); color: #fff; padding: 9px 13px; font-size: 12px; font-weight: 600; display: flex; flex-wrap: wrap; gap: 4px 18px; border-radius: 0 0 10px 10px; margin-top: -1px; }

/* --- alt eylem çubuğu + not --- */
.utp-eylem { display: flex; justify-content: space-between; gap: 9px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border-color); }
.utp-eylem .sol, .utp-eylem .sag { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; }
.utp-eylem .bilgi { font-size: 11.5px; color: var(--neutral-500); padding-inline: 4px; }

@media (max-width: 900px) {
  .utp-ilerleme { grid-template-columns: 1fr 1fr; }
  .utp-ilerleme .cub, .utp-ilerleme .sagyaz { grid-column: 1 / -1; text-align: left !important; }
}
/* Tablo içi sayı girdileri: sağa hizalı ve dar — sütun başlığıyla aynı eksende */
.utp-tablo td input.form-control { max-width: 132px; margin-left: auto; text-align: right; }
.utp-tablo td:has(input) { text-align: right; }

/* Koyu temada pasif/salt-okunur girdiler parlak leke bırakmasın */
[data-theme=dark] .form-control:disabled,
[data-theme=dark] .form-control[readonly],
[data-theme=dark] .form-select:disabled {
  background-color: var(--neutral-100);
  color: var(--neutral-500);
  opacity: 1;
}

/* ---------- Aşama 7b: katlanır bölümler, makine/operatör, yoğunlaştırma ---------- */
.utp-bolum-kat > summary { list-style: none; cursor: pointer; }
.utp-bolum-kat > summary::-webkit-details-marker { display: none; }
.utp-bolum-kat > summary::after {
  content: "⌄"; margin-left: auto; color: var(--neutral-400); font-size: 15px; transition: transform .15s;
}
.utp-bolum-kat[open] > summary::after { transform: rotate(180deg); }
.utp-bolum-kat > summary:hover .utp-adet { background: var(--primary-100); }

/* katlanır iç bölümler (dilimleme, sayaç, soy ağacı, kalite, duruş) */
.utp-katlanir { border: 1px solid var(--border-color); border-radius: 12px; margin-top: 12px; }
.utp-katlanir > summary {
  padding: 11px 15px; cursor: pointer; font-weight: 600; font-size: 13px; list-style: none;
  display: flex; align-items: center; gap: 8px;
}
.utp-katlanir > summary::-webkit-details-marker { display: none; }
.utp-katlanir > summary::after { content: "⌄"; margin-left: auto; color: var(--neutral-400); }
.utp-katlanir[open] > summary { border-bottom: 1px solid var(--border-color); }
.utp-katlanir[open] > summary::after { content: "⌃"; }
.utp-katlanir > summary .nrm { font-weight: 400; color: var(--neutral-500); font-size: 12px; }
.utp-katlanir > *:not(summary) { padding: 0 15px 14px; }
.utp-katlanir > .utp-plan { margin: 14px 15px; padding: 0; }
.utp-katlanir > .utp-tablo-sar { padding: 0; margin: 14px 15px 0; }
.utp-katlanir > .utp-toplam { margin: 0 15px 14px; border-radius: 0 0 10px 10px; }

/* makine kartı: bitmiş hali soluk */
.utp-makine.bitti { opacity: .72; }
.utp-makine.ekle { border-style: dashed; }

/* sayaç giriş şeridi */
.utp-sayac-form { border: 1px solid var(--primary-200); background: var(--primary-50); border-radius: 12px; padding: 12px 14px; margin-top: 10px; }

/* operatör rozetleri */
.utp-op {
  display: inline-flex; align-items: center; gap: 6px; background: var(--neutral-100);
  border-radius: 999px; padding: 4px 6px 4px 12px; font-size: 12px; font-weight: 600;
}
.utp-op-sil { border: 0; background: none; color: var(--neutral-500); cursor: pointer; font-size: 15px; line-height: 1; padding: 0 5px; }
.utp-op-sil:hover { color: var(--danger-600); }

/* uzun süren duruş: daha güçlü uyarı */
.utp-durus.uzun { background: var(--danger-100); border-color: var(--danger-600); }

/* ---------- yoğunlaştırma: kart daha kısa dursun ---------- */
.utp-is-govde { padding: 13px 15px; }
.utp-is-bas { padding: 12px 15px; }
.utp-is-bas h5 { font-size: 15.5px; }
.utp-kunye { font-size: 11.5px; gap: 3px 13px; }
.utp-rota { gap: 5px; margin-bottom: 11px; }
.utp-safha { padding: 5px 11px; font-size: 11.5px; }
.utp-etk { margin: 13px 0 7px; }
.utp-kutu { padding: 11px 13px; margin-top: 11px; }
.utp-kpi { gap: 8px; margin-top: 11px; }
.utp-kpi .k { padding: 9px 11px; }
.utp-kpi .kv { font-size: 17px; }
.utp-makine { padding: 9px 11px; }
.utp-recete { padding: 5px 0; font-size: 12px; }
.utp-ilerleme .v { font-size: 15px; }
.utp-satir { padding: 10px 14px; margin-bottom: 6px; }
.utp-ozet-k { padding: 11px 14px; }
.utp-ozet-k .s { font-size: 21px; }
.utp-tablo td, .utp-tablo thead th { padding: 7px 10px; }
.utp-eylem { margin-top: 13px; padding-top: 11px; }

/* ===== Depo: makine ayarı (ölçü) grupları ===== */
.eces-olcu-grup { border: 1px solid var(--border-color); border-radius: 12px; padding: 12px 14px; margin-bottom: 16px; background: var(--neutral-50); }
.eces-olcu-grup .bas { font-size: 13px; font-weight: 700; color: var(--neutral-700); margin-bottom: 9px; }
.eces-olcu-grup .bas span { font-weight: 400; color: var(--neutral-500); font-size: 11.5px; }
.eces-olcu-grup .satir { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 6px; }
.eces-olcu-grup .etk { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--neutral-500); min-width: 54px; }
.eces-olcu-grup .hap {
  display: inline-flex; align-items: center; gap: 6px; text-decoration: none;
  background: var(--bg-color); border: 1px solid var(--border-color); border-radius: 999px;
  padding: 5px 12px; font-size: 12.5px; font-weight: 600; color: var(--neutral-700);
}
.eces-olcu-grup .hap:hover { border-color: var(--primary-200); color: var(--primary-600); }
.eces-olcu-grup .hap b { background: var(--neutral-100); color: var(--neutral-600); border-radius: 999px; padding: 0 7px; font-size: 11px; font-weight: 700; }
.eces-olcu-grup .hap.aktif { background: var(--primary-50); border-color: var(--primary-200); color: var(--primary-600); }
.eces-olcu-grup .hap.aktif b { background: var(--primary-100); color: var(--primary-600); }

/* ============================================================
   AŞAMA 8 — RENK VE İKON TURU (panel + bölme ekranı)
   Kullanıcı geri bildirimi: "çok sade kaldı, hiçbir şey anlamıyorum".
   Amaç: ekranı okunur kılan RENK KODU (durum = renk) ve yerleşik SVG
   ikonlar. Palet değişmedi — mevcut petrol/yeşil/amber/kırmızı
   token'ları kullanılıyor, koyu tema kendiliğinden çalışıyor.
   ============================================================ */

/* Yerleşik ikonların satır içi hizası. (Dosyanın başındaki .eces-ikon
   display:block idi — metin yanında kullanınca satırı kırıyordu; ikonlar
   hep bir kapsayıcı span/flex içinde durduğu için inline-block güvenli.) */
.eces-ikon { display: inline-block; flex: none; vertical-align: -.18em; }
.btn .eces-ikon { margin-right: 5px; }

/* --- özet kartlar: ikon rozeti + renkli sayı --- */
.utp-ozet-k { display: flex; align-items: center; gap: 12px; }
.utp-ozet-k .roz {
  display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; flex: none;
  background: var(--neutral-100); color: var(--neutral-600);
}
.utp-ozet-k.hazir .roz { background: var(--primary-50); color: var(--primary-600); }
.utp-ozet-k.uretimde .roz { background: var(--primary-100); color: var(--primary-600); }
.utp-ozet-k.uretimde .s { color: var(--primary-600); }
.utp-ozet-k.bugun .roz { background: var(--success-100); color: var(--success-600); }
.utp-ozet-k.bugun .s { color: var(--success-600); }
.utp-ozet-k.kalite .roz { background: var(--warning-100); color: var(--warning-600); }
.utp-ozet-k.kalite.var .roz { background: var(--danger-100); color: var(--danger-600); }
.utp-ozet-k.kalite.var .s { color: var(--danger-600); }

/* --- bölüm başlığı: ikon --- */
.utp-bolum .bas-ikon { color: var(--primary-600); }

/* --- iş satırı: durumu renkli kenar çizgisi söyler --- */
.utp-satir { border-left: 3px solid var(--neutral-200); }
.utp-satir.dur-uretimde { border-left-color: var(--primary-600); }
.utp-satir.dur-durusta { border-left-color: var(--danger-600); }
.utp-satir.dur-bloke { border-left-color: var(--warning-600); }
.utp-satir.dur-hazir { border-left-color: var(--neutral-300); }
.utp-satir:hover { border-color: var(--primary-200); box-shadow: 0 1px 3px rgba(16, 24, 40, .06); }
.utp-satir:hover.dur-durusta { border-left-color: var(--danger-600); }
.utp-satir:hover.dur-bloke { border-left-color: var(--warning-600); }

/* --- safha rotası: her durum kendi rengiyle --- */
.utp-safha.bitti { background: var(--success-100); border-color: transparent; color: var(--success-600); }
.utp-safha.bitti .yzd { background: transparent; padding: 0; }
.utp-safha.bitti.devralindi { background: var(--neutral-100); color: var(--neutral-600); opacity: 1; }
.utp-safha.aktif { box-shadow: 0 0 0 3px var(--primary-50); }
.utp-safha .nokta { width: 7px; height: 7px; border-radius: 999px; background: currentColor; flex: none; }
.utp-safha.aktif .nokta { animation: utp-nabiz 1.8s ease-in-out infinite; }
@keyframes utp-nabiz { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }

/* --- KPI: iyi/uyarı/kötü artık zeminden de belli --- */
.utp-kpi .k.iyi { background: var(--success-100); border-color: transparent; }
.utp-kpi .k.uyari { background: var(--warning-100); border-color: transparent; }
.utp-kpi .k.kotu { background: var(--danger-100); border-color: transparent; }
.utp-kpi .k.iyi .kk, .utp-kpi .k.uyari .kk, .utp-kpi .k.kotu .kk { color: inherit; opacity: .75; }
.utp-kpi .kk { display: flex; align-items: center; gap: 5px; }

/* --- ilerleme çubuğu: dolulukla renk değiştirir --- */
.utp-cubuk i.az { background: var(--warning-600); }
.utp-cubuk i.tam { background: var(--success-600); }

/* --- bölme ekranı: şerit daha okunur, bıçak konumları görünür --- */
.utp-plan-bas b { display: inline-flex; align-items: center; gap: 7px; }
.utp-serit { height: 62px; }
.utp-dilim { background: var(--primary-50); }
.utp-dilim:nth-of-type(even) { background: var(--primary-100); }
.utp-dilim.fire { background: repeating-linear-gradient(135deg, var(--danger-100) 0 5px, transparent 5px 10px); }
.utp-dilim span { font-size: 13.5px; }
.utp-bicak {
  display: flex; flex-wrap: wrap; align-items: center; gap: 5px 8px; margin-top: 7px;
  font-size: 12px; color: var(--neutral-600);
}
.utp-bicak .etk { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; color: var(--neutral-500); }
.utp-bicak .k {
  background: var(--neutral-100); border-radius: 7px; padding: 2px 8px;
  font-weight: 700; font-variant-numeric: tabular-nums; color: var(--neutral-700);
}
.utp-bicak .k.kenar { background: var(--danger-100); color: var(--danger-600); }

/* seçenek düğmeleri: seçili olan belirgin */
.utp-bol-soru .s { display: flex; align-items: center; gap: 7px; }
#dilim-secenek .btn { display: inline-flex; align-items: center; gap: 6px; }

/* çıkacak bobinler tablosunda satır vurgusu */
.utp-tablo tbody tr:hover { background: var(--neutral-50); }
.utp-tablo .yeni-kod { display: inline-flex; align-items: center; gap: 5px; }

/* denetim şeridi ikonlu; "dikkat" = plan geçerli ama fire yüksek */
.utp-denetim { display: flex; align-items: flex-start; gap: 8px; }
.utp-denetim.dikkat { background: var(--warning-100); color: var(--warning-600); }

/* --- depo ölçü hapları: başlıkta ikon --- */
.eces-olcu-grup .bas { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.eces-olcu-grup .etk { display: inline-flex; align-items: center; gap: 5px; }

/* --- katlanır başlıklara ikon hizası --- */
.utp-katlanir > summary .sum-ikon { color: var(--primary-600); margin-right: 6px; }

@media (max-width: 640px) {
  .utp-ozet-k .roz { width: 32px; height: 32px; border-radius: 9px; }
  .utp-serit { height: 52px; }
}

/* ============================================================
   AŞAMA 9 — CANLILIK VE KONTRAST
   Kullanıcı: "sistem çok cansız, buraya girince iş yapasım gelmiyor".
   Kök neden: kart yüzeyi ile sayfa zemini aynı renkti, sınırlar ve
   ikincil metinler fazla soluktu. Çözüm: beyaz yüzey + gri tuval,
   görünür sınır ve gölge, doygun renk vurguları, daha koyu mürekkep.
   Palet aynı — yalnız tonlar güçlendi; koyu tema korunur.
   ============================================================ */

html[data-theme=light] {
  --neutral-500: #566175;        /* ikincil metin: okunur koyulukta */
  --neutral-400: #7C8698;
  /* Doygun vurgular — yalnız ikon kutucukları ve dolu rozetler için */
  --eces-dolu-petrol: #17706B;
  --eces-dolu-yesil: #14804A;
  --eces-dolu-amber: #B25E09;
  --eces-dolu-kirmizi: #C0362C;
}
[data-theme=dark] {
  --eces-dolu-petrol: #2E8783;
  --eces-dolu-yesil: #1E9A5C;
  --eces-dolu-amber: #C97A15;
  --eces-dolu-kirmizi: #D14A3E;
}

/* --- kartlar yüzeyden ayrılsın --- */
.card,
.utp-is,
.utp-kutu,
.eces-olcu-grup,
.utp-satir {
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .04);
}
.card { border: 1px solid var(--border-color); }

/* --- ÖZET KARTLAR: doygun ikon kutucuğu + büyük sayı --- */
.utp-ozet-k { padding: 15px 17px; border-left-width: 4px; transition: transform .12s, box-shadow .12s; }
.utp-ozet-k:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(16, 24, 40, .09); }
.utp-ozet-k .roz { width: 44px; height: 44px; border-radius: 13px; color: #fff; }
.utp-ozet-k.hazir .roz { background: var(--eces-dolu-petrol); color: #fff; }
.utp-ozet-k.uretimde .roz { background: var(--eces-dolu-petrol); color: #fff; }
.utp-ozet-k.bugun .roz { background: var(--eces-dolu-yesil); color: #fff; }
.utp-ozet-k.kalite .roz { background: var(--eces-dolu-amber); color: #fff; }
.utp-ozet-k.kalite.var .roz { background: var(--eces-dolu-kirmizi); color: #fff; }
.utp-ozet-k .s { font-size: 30px; color: var(--neutral-900); }
.utp-ozet-k .e { font-size: 12.5px; color: var(--neutral-600); }
[data-theme=dark] .utp-ozet-k .s { color: var(--text-primary-light); }

/* --- BÖLÜM BAŞLIĞI: daha iri, daha koyu --- */
.utp-bolum { font-size: 16.5px; color: var(--neutral-900); margin-top: 26px; }
[data-theme=dark] .utp-bolum { color: var(--text-primary-light); }
.utp-no { min-width: 26px; height: 26px; font-size: 13px; }
.utp-adet { background: var(--eces-dolu-petrol); color: #fff; font-size: 11.5px; padding: 3px 11px; }
.utp-ipucu { color: var(--neutral-500); }

/* --- İŞ SATIRI: belirgin şerit + üstüne gelince vurgu --- */
.utp-satir { border-left-width: 4px; padding: 14px 17px; }
.utp-satir:hover { background: var(--primary-50); }
.utp-satir .ad { font-size: 14.5px; color: var(--neutral-900); }
[data-theme=dark] .utp-satir .ad { color: var(--text-primary-light); }
.utp-satir .alt { color: var(--neutral-500); font-size: 12.2px; }
.utp-ok { color: var(--primary-600); font-size: 17px; font-weight: 700; }

/* --- SAFHA ROTASI: çalışan safha DOLU petrol, biten güçlü yeşil --- */
.utp-safha { padding: 8px 14px; font-size: 12.5px; }
.utp-safha.bitti { background: var(--success-100); color: var(--success-600); font-weight: 700; }
.utp-safha.aktif {
  background: var(--eces-dolu-petrol); border-color: var(--eces-dolu-petrol); color: #fff;
  box-shadow: 0 2px 8px rgba(23, 112, 107, .28);
}
.utp-safha.aktif .yzd { background: rgba(255, 255, 255, .22); color: #fff; }
.utp-ayrac { color: var(--neutral-400); font-weight: 700; }

/* --- KPI: üstte renk şeridi, daha iri sayı --- */
.utp-kpi .k { position: relative; overflow: hidden; padding-top: 14px; }
.utp-kpi .k::before {
  content: ''; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--neutral-300);
}
.utp-kpi .k.iyi::before { background: var(--eces-dolu-yesil); }
.utp-kpi .k.uyari::before { background: var(--eces-dolu-amber); }
.utp-kpi .k.kotu::before { background: var(--eces-dolu-kirmizi); }
.utp-kpi .kv { font-size: 21px; }
.utp-kpi .kk { color: var(--neutral-600); }

/* --- İLERLEME ÇUBUĞU: daha kalın, okunur --- */
.utp-cubuk { height: 11px; }
.utp-ilerleme .v { font-size: 19px; color: var(--neutral-900); }
[data-theme=dark] .utp-ilerleme .v { color: var(--text-primary-light); }
.utp-ilerleme .k, .utp-etk { color: var(--neutral-600); }

/* --- TABLOLAR: zebra + satır vurgusu + belirgin başlık --- */
.table > :not(caption) > * > * { border-bottom-color: var(--border-color); }
.table tbody tr:nth-child(even) > * { background-color: var(--neutral-50); }
.table tbody tr:hover > * { background-color: var(--primary-50); }
.table thead th {
  background: var(--neutral-100) !important; color: var(--neutral-700) !important;
  font-weight: 700 !important; border-bottom: 2px solid var(--border-color) !important;
}
[data-theme=dark] .table thead th { color: var(--text-primary-light) !important; }

/* --- DÜĞMELER: hayaletlere sınır, birincilde gölge --- */
.btn.bg-neutral-200 {
  border: 1px solid var(--border-color) !important;
  background-color: var(--bg-color) !important;
  color: var(--neutral-700) !important;
  font-weight: 600;
}
.btn.bg-neutral-200:hover {
  background-color: var(--neutral-100) !important;
  border-color: var(--input-form-light) !important;
}
.btn-primary { box-shadow: 0 1px 2px rgba(16, 24, 40, .08); font-weight: 600; }
.btn-primary:hover { background-color: var(--primary-700) !important; border-color: var(--primary-700) !important; }
.btn.bg-primary-50 { border: 1px solid var(--primary-200) !important; font-weight: 600; }

/* --- FORM ALANLARI: görünür sınır + belirgin odak --- */
.form-control, .form-select { border-color: var(--input-form-light); }
.form-control:focus, .form-select:focus {
  border-color: var(--primary-500);
  box-shadow: 0 0 0 3px rgba(23, 112, 107, .14);
}
.form-label, label.form-label { color: var(--neutral-700); font-weight: 600; }

/* --- ROZETLER: biraz daha doygun --- */
.badge { font-weight: 700; }

/* --- MAKİNE KARTLARI + KUTULAR --- */
.utp-makine { background: var(--bg-color); }
.utp-makine.secili { border-color: var(--primary-500); box-shadow: 0 0 0 3px var(--primary-50); }
.utp-makine b { font-size: 13px; color: var(--neutral-900); }
[data-theme=dark] .utp-makine b { color: var(--text-primary-light); }

/* --- DEPO ÖLÇÜ HAPLARI: daha okunur --- */
.eces-olcu-grup { background: var(--bg-color); }
.eces-olcu-grup .hap { border-color: var(--input-form-light); font-size: 13px; padding: 6px 13px; }
.eces-olcu-grup .hap.aktif { background: var(--eces-dolu-petrol); border-color: var(--eces-dolu-petrol); color: #fff; }
.eces-olcu-grup .hap.aktif b { background: rgba(255, 255, 255, .22); color: #fff; }

/* --- KATLANIR BAŞLIKLAR: tıklanabilir olduğu belli olsun --- */
.utp-katlanir > summary { font-weight: 700; color: var(--neutral-800); padding: 11px 13px; border-radius: 10px; }
.utp-katlanir > summary:hover { background: var(--primary-50); }
[data-theme=dark] .utp-katlanir > summary { color: var(--text-primary-light); }

/* --- SAYFA BAŞLIĞI --- */
.dashboard-main-body > .d-flex h6,
.eces-sayfa-baslik { color: var(--neutral-900); }

/* --- KENAR MENÜSÜ: aktif sayfa artık ilk bakışta görünüyor --- */
.sidebar-menu li > a.active-page,
.sidebar-menu li > a.active-page:hover {
  background: var(--primary-50) !important;
  color: var(--primary-700) !important;
  font-weight: 700 !important;
  box-shadow: inset 3px 0 0 var(--eces-dolu-petrol);
}
.sidebar-menu li a { color: var(--neutral-700); font-weight: 500; }
.sidebar-menu li a:hover { background: var(--neutral-100); color: var(--neutral-900); }
.sidebar-menu .sidebar-menu-group-title { color: var(--neutral-500); font-weight: 700; letter-spacing: .06em; }
[data-theme=dark] .sidebar-menu li a { color: var(--text-secondary-light); }
[data-theme=dark] .sidebar-menu li > a.active-page { color: var(--primary-300) !important; }

/* --- ÜST ÇUBUK: barkod kutusu ekranın ana aleti, öne çıksın --- */
.navbar-header { box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }
.navbar-search input {
  border: 1px solid var(--input-form-light);
  background-color: var(--bg-color);
  font-weight: 500;
}
.navbar-search input::placeholder { color: var(--neutral-500); }
.navbar-search .icon { color: var(--primary-600); }

/* --- ROZETLER: soluk değil, okunur --- */
.badge.bg-neutral-200 { background: var(--neutral-100) !important; color: var(--neutral-700) !important; }
.badge.bg-primary-50 { background: var(--primary-100) !important; color: var(--primary-700) !important; }
.badge.bg-success-100 { color: var(--success-600) !important; }
.badge.bg-warning-100 { color: var(--warning-600) !important; }
.badge.bg-danger-100 { color: var(--danger-600) !important; }
[data-theme=dark] .badge.bg-primary-50 { color: var(--primary-300) !important; }

/* --- KART BAŞLIKLARI --- */
.card-header { background: var(--neutral-50); border-bottom: 1px solid var(--border-color); }
.card-title { color: var(--neutral-900); font-weight: 700; }
[data-theme=dark] .card-header { background: transparent; }
[data-theme=dark] .card-title { color: var(--text-primary-light); }

/* --- SAYFA BAŞLIĞI ve KIRINTI --- */
.dashboard-main-body h1, .dashboard-main-body h4, .dashboard-main-body h5 { color: var(--neutral-900); }
[data-theme=dark] .dashboard-main-body h1,
[data-theme=dark] .dashboard-main-body h4,
[data-theme=dark] .dashboard-main-body h5 { color: var(--text-primary-light); }

/* --- KABUL: parti toplamı şeridi (tek satır, kompakt) ---
   Etiket ile değer YAN YANA durur; kalemler ince dikey çizgiyle ayrılır.
   Böylece şerit ~34 px yüksekliğinde kalır ve formu aşağı itmez. */
/* --- DİLİM DÖKÜMÜ (Aşama 13) ---
   Dilimleme artık yeni barkod açmaz; parçalar aynı palette durur ve
   dökümü barkod detayında, iş kartında bu blokta görünür. */
.eces-dilim-dokum .baslik {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin-bottom: 10px; color: var(--neutral-900);
}
.eces-dilim-dokum .baslik b { font-size: 15px; }
.eces-dilim-dokum .baslik span { font-size: 13px; color: var(--neutral-500); }
.eces-dilim-dokum .baslik .zaman { margin-left: auto; font-size: 12.5px; }
.eces-dilim-dokum .uyari-satir {
  margin: 0 0 12px; font-size: 12.5px; line-height: 1.5; color: var(--neutral-700);
  background: var(--neutral-50); border-radius: 10px; padding: 8px 11px;
  box-shadow: inset 3px 0 0 var(--eces-dolu-amber, #D97706);
}
.eces-dilim-dokum tfoot .toplam td {
  background: var(--primary-50); font-size: 13px; border-top: 1px solid var(--border-color);
}
.eces-dilim-dokum .alt-bilgi {
  display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 12px; font-size: 12.5px;
}
.eces-dilim-dokum .alt-bilgi i { font-style: normal; color: var(--neutral-500); }
.eces-dilim-dokum .alt-bilgi b { color: var(--neutral-900); font-variant-numeric: tabular-nums; }
[data-theme=dark] .eces-dilim-dokum .baslik,
[data-theme=dark] .eces-dilim-dokum .alt-bilgi b { color: var(--text-primary-light); }
[data-theme=dark] .eces-dilim-dokum .uyari-satir { color: var(--text-secondary-light); }

/* Dilimleme formundaki bilgi/uyarı şeritleri ve parça numarası */
.utp-dilim-bilgi {
  display: flex; align-items: flex-start; gap: 9px; margin-bottom: 14px;
  padding: 9px 12px; border-radius: 10px; font-size: 12.5px; line-height: 1.5;
  background: var(--neutral-50); color: var(--neutral-700);
  box-shadow: inset 3px 0 0 var(--primary-600);
}
.utp-dilim-bilgi.uyari { box-shadow: inset 3px 0 0 var(--eces-dolu-amber, #D97706); }
.utp-dilim-bilgi svg { flex: none; margin-top: 1px; }
[data-theme=dark] .utp-dilim-bilgi { color: var(--text-secondary-light); }
.utp-parca-no {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 26px; height: 22px; padding: 0 7px; border-radius: 7px;
  background: var(--primary-50); color: var(--primary-600); font-weight: 800; font-size: 12px;
}
.utp-kpi .k.vurgu { box-shadow: inset 0 0 0 1px var(--primary-200); }
.utp-kpi .k.vurgu .kv { color: var(--primary-600); }

/* --- KABUL EKRANI BOBİN SATIRI (Aşama 12) ---
   Satır: sıra no · miktar · en · gramaj · AÇIKLAMA. Açıklama bobin başına
   girildiği için satır beş sütuna çıktı; genişlikler yüzde değil flex ile
   verilir ki başlık şeridi ve satırlar her ekran boyunda hizalı kalsın.
   Dar ekranda satır sarmalanır — yatay kaydırma olmaz. */
.eces-kabul-satir { display: flex; align-items: center; gap: 8px; }
.eces-kabul-satir .kb-sira {
  flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--primary-50); color: var(--primary-600);
  font-weight: 800; font-size: 13px;
}
.eces-kabul-satir .kb-miktar { flex: 1 1 140px; min-width: 0; }
.eces-kabul-satir .kb-olcu { flex: 0 0 96px; width: 96px; min-width: 0; }
.eces-kabul-satir .kb-aciklama {
  flex: 2 1 200px; min-width: 0;
  /* rows="1" ile tek satır yüksekliğinde durur, gerekirse aşağı çekilir */
  resize: vertical; min-height: 40px; line-height: 1.4;
}
/* Başlık şeridi: aynı flex kalıbı, girdi yerine yazı */
.eces-kabul-basliklar {
  font-size: 13px; font-weight: 600; color: var(--neutral-500);
}
.eces-kabul-basliklar .kb-sira { background: transparent; }
.eces-kabul-basliklar .kb-aciklama {
  min-height: 0; resize: none; overflow-wrap: anywhere;
}
@media (max-width: 991.98px) {
  /* Başlıklar kaybolur; her alanın kendi placeholder'ı adını söyler.
     Satır üç kata iner: [no + miktar] / [en + gramaj] / [açıklama] */
  .eces-kabul-basliklar { display: none; }
  .eces-kabul-satir { flex-wrap: wrap; row-gap: 6px; }
  .eces-kabul-satir .kb-miktar { flex: 1 1 calc(100% - 40px); }
  .eces-kabul-satir .kb-olcu { flex: 1 1 calc(50% - 24px); width: auto; margin-left: 40px; }
  .eces-kabul-satir .kb-olcu + .kb-olcu { margin-left: 0; }
  .eces-kabul-satir .kb-aciklama { flex: 1 1 calc(100% - 40px); margin-left: 40px; }
}
[data-theme=dark] .eces-kabul-satir .kb-sira { color: var(--primary-300); }

.eces-parti-toplam {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0;
  margin-top: 8px; padding: 6px 12px; border-radius: 10px;
  background: var(--neutral-50); border: 1px solid var(--border-color);
}
.eces-parti-toplam.dolu { background: var(--primary-50); border-color: var(--primary-200); }
.eces-parti-toplam .k { display: flex; align-items: baseline; gap: 6px; }
.eces-parti-toplam .k + .k { margin-left: 13px; padding-left: 13px; border-left: 1px solid var(--border-color); }
.eces-parti-toplam .e { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--neutral-500); }
.eces-parti-toplam .d { font-size: 14px; font-weight: 800; color: var(--neutral-900); font-variant-numeric: tabular-nums; }
.eces-parti-toplam .vurgu .d { font-size: 17px; color: var(--primary-600); }
.eces-parti-toplam .not { margin: 0 0 0 auto; padding-left: 14px; font-size: 10.5px; color: var(--neutral-500); }
@media (max-width: 767.98px) {
  .eces-parti-toplam .k + .k { margin-left: 0; padding-left: 0; border-left: 0; }
  .eces-parti-toplam .k { flex: 1 1 100%; }
  .eces-parti-toplam .not { margin-left: 0; padding-left: 0; }
}
[data-theme=dark] .eces-parti-toplam .d { color: var(--text-primary-light); }
[data-theme=dark] .eces-parti-toplam .vurgu .d { color: var(--primary-300); }

/* --- TABLO BAŞLIĞINDA EXCEL TARZI SÜZGEÇ ---
   ŞABLON TUZAĞI: WowDash stilleri input'lara appearance:none veriyor ve
   sınır/zemin bırakmıyor → ham onay kutusu GÖRÜNMEZ oluyordu. Buradaki
   kutu tamamen elle çizilir; seçili satır ayrıca zeminden de bellidir. */
.eces-th { display: inline-flex; align-items: center; gap: 6px; }
.eces-suzgec { position: relative; display: inline-block; }
.eces-suzgec > summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 4px;
  min-width: 24px; height: 24px; padding: 0 5px; justify-content: center; border-radius: 7px;
  color: var(--neutral-400); border: 1px solid transparent;
}
.eces-suzgec > summary::-webkit-details-marker { display: none; }
.eces-suzgec > summary:hover { background: var(--neutral-100); color: var(--primary-600); }
.eces-suzgec.secili > summary {
  background: var(--eces-dolu-petrol); color: #fff; border-color: var(--eces-dolu-petrol);
}
.eces-suzgec .say { font-style: normal; font-size: 11px; font-weight: 800; }
.eces-suzgec[open] > summary { background: var(--primary-600); color: #fff; border-color: var(--primary-600); }

.eces-suzgec .kutu {
  position: absolute; z-index: 60; top: calc(100% + 7px); left: 0; min-width: 252px; max-width: 330px;
  background: var(--bg-color); border: 1px solid var(--border-color); border-radius: 13px;
  box-shadow: 0 12px 32px rgba(16, 24, 40, .18); padding: 12px; text-transform: none;
  letter-spacing: 0; font-weight: 400;
  max-height: min(70vh, 520px); overflow-y: auto; overscroll-behavior: contain;
}
/* Sağ kenardaki sütunlarda menü ekrandan taşmasın */
.eces-suzgec.saga .kutu { left: auto; right: 0; }

/* seçili değerlerin özeti */
.eces-suzgec .ozet {
  display: flex; flex-wrap: wrap; align-items: center; gap: 5px;
  padding-bottom: 9px; margin-bottom: 9px; border-bottom: 1px solid var(--border-color);
}
.eces-suzgec .ozet .e { font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--neutral-500); }
.eces-suzgec .ozet .rz {
  background: var(--primary-100); color: var(--primary-700); border-radius: 999px;
  padding: 2px 9px; font-size: 11.5px; font-weight: 700;
}

.eces-suzgec .ara-sar { margin-bottom: 9px; }
.eces-suzgec .suz-ara { font-size: 12.5px; }
.eces-suzgec .ara-sar .bos { display: block; margin-top: 7px; font-size: 12px; color: var(--neutral-500); text-align: center; }

.eces-suzgec .bslk {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
  color: var(--neutral-500); margin: 9px 2px 5px;
}
.eces-suzgec .bslk:first-of-type { margin-top: 0; }
.eces-suzgec .tumu {
  border: 0; background: transparent; color: var(--primary-600); cursor: pointer;
  font-size: 10.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 2px 4px;
  border-radius: 5px;
}
.eces-suzgec .tumu:hover { background: var(--primary-50); }

.eces-suzgec .liste {
  max-height: 208px; overflow-y: auto; overscroll-behavior: contain;
  display: flex; flex-direction: column; gap: 2px;
  padding-right: 3px; scrollbar-width: thin;
  scrollbar-color: var(--input-form-light) transparent;
}
.eces-suzgec .liste::-webkit-scrollbar { width: 9px; }
.eces-suzgec .liste::-webkit-scrollbar-track { background: transparent; }
.eces-suzgec .liste::-webkit-scrollbar-thumb { background: var(--input-form-light); border-radius: 999px; border: 2px solid var(--bg-color); }
.eces-suzgec .liste::-webkit-scrollbar-thumb:hover { background: var(--neutral-400); }

/* Listenin devamı varsa altta solma — "burası bitti" sanılmasın */
.eces-suzgec .liste-sar { position: relative; }
.eces-suzgec .liste-sar::after {
  content: ''; position: absolute; left: 0; right: 10px; bottom: 0; height: 30px;
  background: linear-gradient(to bottom, transparent, var(--bg-color) 85%);
  pointer-events: none; opacity: 0; transition: opacity .15s;
}
.eces-suzgec .liste-sar.kayar::after { opacity: 1; }
.eces-suzgec .bslk .kac {
  font-style: normal; background: var(--neutral-100); color: var(--neutral-600);
  border-radius: 999px; padding: 1px 7px; margin-left: 4px; font-size: 10px;
}
.eces-suzgec .liste label {
  display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 8px;
  font-size: 13px; color: var(--neutral-700); cursor: pointer; margin: 0;
  border: 1px solid transparent; transition: background .12s, border-color .12s;
}
.eces-suzgec .liste label:hover { background: var(--neutral-50); }

/* SEÇİLİ SATIR: zemin + kalın yazı + sol renk çizgisi — gözden kaçmaz */
.eces-suzgec .liste label.isaretli,
.eces-suzgec .liste label:has(input:checked) {
  background: var(--primary-50); border-color: var(--primary-200);
  color: var(--primary-700); font-weight: 700;
  box-shadow: inset 3px 0 0 var(--eces-dolu-petrol);
}

/* ONAY KUTUSU: tamamen elle çizilir (şablon appearance:none veriyor) */
.eces-suzgec .liste input[type="checkbox"] {
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  width: 18px; height: 18px; flex: none; margin: 0; position: relative; cursor: pointer;
  border: 2px solid var(--input-form-light); border-radius: 5px;
  background: var(--bg-color); transition: background .12s, border-color .12s;
}
.eces-suzgec .liste input[type="checkbox"]:hover { border-color: var(--primary-400); }
.eces-suzgec .liste input[type="checkbox"]:checked {
  background: var(--eces-dolu-petrol); border-color: var(--eces-dolu-petrol);
}
.eces-suzgec .liste input[type="checkbox"]:checked::after {
  content: ''; position: absolute; left: 4px; top: 0; width: 5px; height: 10px;
  border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg);
}
.eces-suzgec .liste input[type="checkbox"]:focus-visible {
  outline: 3px solid var(--primary-200); outline-offset: 1px;
}

.eces-suzgec .liste .ad { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eces-suzgec .liste .adet {
  background: var(--neutral-100); color: var(--neutral-600); border-radius: 999px;
  padding: 1px 8px; font-size: 11px; font-weight: 700;
}
.eces-suzgec .liste label.isaretli .adet,
.eces-suzgec .liste label:has(input:checked) .adet { background: var(--primary-200); color: var(--primary-700); }

.eces-suzgec .ipucu { margin: 9px 2px 0; font-size: 11px; color: var(--neutral-500); }
.eces-suzgec .eylem { display: flex; align-items: center; gap: 12px; margin-top: 9px; padding-top: 10px; border-top: 1px solid var(--border-color); }

[data-theme=dark] .eces-suzgec .liste label { color: var(--text-secondary-light); }
[data-theme=dark] .eces-suzgec .liste label.isaretli,
[data-theme=dark] .eces-suzgec .liste label:has(input:checked) { color: var(--primary-300); }

/* Süzgeç açıkken tablo taşmayı kırpmasın */
.table-responsive:has(.eces-suzgec[open]) { overflow: visible; }


/* --- CARİ HAREKET RAPORU: mutabakat şeridi --- */
.eces-mutabakat {
  display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px;
  margin-bottom: 20px;
}
.eces-mutabakat .k {
  flex: 1 1 170px; background: var(--bg-color); border: 1px solid var(--border-color);
  border-left: 4px solid var(--neutral-300); border-radius: 12px; padding: 13px 16px;
  display: flex; flex-direction: column; gap: 2px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
}
.eces-mutabakat .e { font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--neutral-500); }
.eces-mutabakat .e small { font-weight: 500; text-transform: none; letter-spacing: 0; }
.eces-mutabakat .d { font-size: 22px; font-weight: 800; color: var(--neutral-900); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.eces-mutabakat .d i { font-style: normal; font-size: 13px; font-weight: 600; color: var(--neutral-500); }
.eces-mutabakat .y { font-size: 11.5px; color: var(--neutral-500); }
.eces-mutabakat .op { align-self: center; font-size: 20px; font-weight: 800; color: var(--neutral-400); }
.eces-mutabakat .giren { border-left-color: var(--eces-dolu-yesil); }
.eces-mutabakat .giren .d { color: var(--success-600); }
.eces-mutabakat .cikan { border-left-color: var(--eces-dolu-kirmizi); }
.eces-mutabakat .cikan .d { color: var(--danger-600); }
.eces-mutabakat .bakiye { border-left-color: var(--eces-dolu-petrol); background: var(--primary-50); }
.eces-mutabakat .bakiye .d { color: var(--primary-600); }
.eces-mutabakat .stok { border-left-color: var(--eces-dolu-amber); }
[data-theme=dark] .eces-mutabakat .d { color: var(--text-primary-light); }

/* cari künyesi (rapor başlığı altında) */
.eces-cari-kunye { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 12.5px; color: var(--neutral-600); }
.eces-cari-kunye b { color: var(--neutral-500); font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; margin-right: 5px; }

/* devir ve toplam satırları */
.eces-devir-satiri > * { background: var(--neutral-50) !important; color: var(--neutral-600); }
.eces-toplam-satiri > * { background: var(--primary-50) !important; border-top: 2px solid var(--primary-200) !important; }
[data-theme=dark] .eces-devir-satiri > * { background: rgba(255,255,255,.04) !important; }


/* --- KATEGORİ AÇILIR MENÜ: alt maddelerde ikon hizası --- */
.sidebar-menu .sidebar-submenu li a { display: flex; align-items: center; gap: 10px; }
.sidebar-menu .sidebar-submenu li a .menu-icon { font-size: 17px; width: 17px; height: 17px; flex: none; }
.sidebar-menu .sidebar-submenu li a.active-page .menu-icon { color: var(--primary-600); }
.sidebar-menu li.dropdown > a { font-weight: 600; }
.sidebar-menu li.dropdown.dropdown-open > a,
.sidebar-menu li.dropdown.open > a { color: var(--primary-700); }
[data-theme=dark] .sidebar-menu li.dropdown.dropdown-open > a { color: var(--primary-300); }


/* --- SEVKİYAT: adım rozeti, cari seçim kartları, alıcı künyesi --- */
.eces-adim {
  display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 7px;
  background: var(--eces-dolu-petrol); color: #fff; font-size: 12px; font-weight: 800;
  margin-right: 6px; vertical-align: -3px;
}
.eces-cari-sec { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); gap: 12px; }
.eces-cari-sec .kart {
  display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: inherit;
  background: var(--bg-color); border: 1px solid var(--border-color); border-left: 4px solid var(--primary-200);
  border-radius: 13px; padding: 15px 17px; transition: border-color .12s, box-shadow .12s, transform .12s;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
}
.eces-cari-sec .kart:hover {
  border-left-color: var(--eces-dolu-petrol); border-color: var(--primary-200);
  box-shadow: 0 6px 18px rgba(16, 24, 40, .1); transform: translateY(-1px); color: inherit;
}
.eces-cari-sec .ust { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.eces-cari-sec .ad { font-size: 14.5px; font-weight: 700; color: var(--neutral-900); }
.eces-cari-sec .ok { color: var(--primary-600); font-size: 19px; font-weight: 700; }
.eces-cari-sec .sayi { font-size: 12.5px; color: var(--neutral-600); }
.eces-cari-sec .sayi b { font-size: 19px; font-weight: 800; color: var(--primary-600); margin-right: 3px; }
.eces-cari-sec .alt { display: flex; flex-wrap: wrap; gap: 6px; }
.eces-cari-sec .rz { background: var(--primary-50); color: var(--primary-700); border-radius: 999px; padding: 2px 10px; font-size: 11.5px; font-weight: 700; }
.eces-cari-sec .il { color: var(--neutral-500); font-size: 11.5px; align-self: center; }
[data-theme=dark] .eces-cari-sec .ad { color: var(--text-primary-light); }

.eces-alici-kart {
  background: var(--primary-50); border: 1px solid var(--primary-200); border-radius: 13px;
  padding: 14px 17px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px;
}
.eces-alici-kart .bas { display: flex; flex-direction: column; gap: 1px; }
.eces-alici-kart .e { font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--primary-600); }
.eces-alici-kart .ad { font-size: 16px; font-weight: 800; color: var(--neutral-900); }
.eces-alici-kart .bilgi { display: flex; flex-wrap: wrap; gap: 4px 22px; font-size: 12.5px; color: var(--neutral-700); flex: 1 1 340px; min-width: 0; }
.eces-alici-kart .bilgi b { display: block; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--neutral-500); }
.eces-alici-kart .eylem { display: flex; gap: 8px; margin-left: auto; }
[data-theme=dark] .eces-alici-kart .ad { color: var(--text-primary-light); }
[data-theme=dark] .eces-alici-kart .bilgi { color: var(--text-secondary-light); }

/* --- ANA PANEL: BÖLÜM BAŞLIĞI + TIKLANABİLİR ÖZET KUTULARI ---
   Kutuların tamamı <a> etiketidir; sol kenardaki renk şeridi kutunun
   hangi bölüme ait olduğunu bir bakışta söyler, sağdaki ok işaretiyle
   "buraya tıklanır" mesajı açıkça verilir. */
.eces-bolum-basligi { display: flex; align-items: center; gap: 10px; margin: 0 0 11px; }
.eces-bolum-basligi .rz {
  width: 21px; height: 21px; border-radius: 7px; display: grid; place-items: center;
  background: var(--primary-600); color: #fff; font-size: 11.5px; font-weight: 800; flex: none;
}
.eces-bolum-basligi h6 {
  margin: 0; font-size: 12.5px; font-weight: 800; letter-spacing: .07em;
  text-transform: uppercase; color: var(--neutral-600);
  /* Dar ekranda satır başı yapabilsin: nowrap iken uzun başlık (ör.
     "Sevkiyat ve Belge — Eylül 2026") sayfayı yana taşırıyordu. */
  min-width: 0; overflow-wrap: anywhere;
}
.eces-bolum-basligi .cizgi { flex: 1 1 24px; min-width: 16px; height: 1px; background: var(--border-color); }
.eces-bolum-basligi a {
  font-size: 12px; font-weight: 700; color: var(--primary-600); text-decoration: none;
  white-space: nowrap; border-bottom: 1px solid transparent;
}
.eces-bolum-basligi a:hover { border-bottom-color: currentColor; }
[data-theme=dark] .eces-bolum-basligi h6 { color: var(--text-secondary-light); }

.eces-mkart {
  position: relative; overflow: hidden; height: 100%;
  display: flex; align-items: center; gap: 12px;
  padding: 13px 14px 13px 17px; border-radius: 14px; text-decoration: none;
  background: var(--bg-color); border: 1px solid var(--border-color);
  box-shadow: var(--eces-golge);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.eces-mkart::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 4px; background: var(--mk); }
.eces-mkart:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(16, 24, 40, .10); border-color: var(--mk); }
[data-theme=dark] .eces-mkart:hover { box-shadow: 0 10px 22px rgba(0, 0, 0, .35); }
.eces-mkart:focus-visible { outline: 2px solid var(--mk); outline-offset: 2px; }
.eces-mkart .ik {
  width: 40px; height: 40px; border-radius: 11px; flex: none;
  display: grid; place-items: center; background: var(--mk-yumusak); color: var(--mk);
}
.eces-mkart .gv { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.eces-mkart .e {
  font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--neutral-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.eces-mkart .d { font-size: 22px; font-weight: 800; line-height: 1.1; color: var(--neutral-900); font-variant-numeric: tabular-nums; }
.eces-mkart .a { font-size: 11.5px; color: var(--neutral-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eces-mkart .ok { margin-left: auto; color: var(--neutral-300); flex: none; transition: color .15s ease, transform .15s ease; }
.eces-mkart:hover .ok { color: var(--mk); transform: translateX(2px); }
[data-theme=dark] .eces-mkart .d { color: var(--text-primary-light); }
[data-theme=dark] .eces-mkart .ok { color: var(--neutral-500); }

.eces-mkart.t-petrol { --mk: var(--eces-dolu-petrol); --mk-yumusak: var(--primary-50); }
.eces-mkart.t-yesil { --mk: var(--eces-dolu-yesil); --mk-yumusak: var(--success-100); }
.eces-mkart.t-amber { --mk: var(--eces-dolu-amber); --mk-yumusak: var(--warning-100); }
.eces-mkart.t-kirmizi { --mk: var(--eces-dolu-kirmizi); --mk-yumusak: var(--danger-100); }
.eces-mkart.t-notr { --mk: var(--neutral-400); --mk-yumusak: var(--neutral-100); }

/* Hızlı işlemler listesi (panel sağ sütunu) */
.eces-hizli { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.eces-hizli a {
  display: flex; align-items: center; gap: 8px; min-width: 0;
  padding: 10px 12px; border-radius: 11px; text-decoration: none;
  font-size: 12.5px; font-weight: 600; color: var(--neutral-700);
  background: var(--neutral-50); border: 1px solid var(--border-color);
  transition: background .13s ease, color .13s ease, border-color .13s ease;
}
.eces-hizli a span { color: var(--primary-600); display: flex; flex: none; }
.eces-hizli a:hover { background: var(--primary-50); border-color: var(--primary-200); color: var(--primary-700); }
[data-theme=dark] .eces-hizli a { background: transparent; color: var(--text-secondary-light); }
[data-theme=dark] .eces-hizli a:hover { color: var(--primary-300); }
@media (max-width: 420px) { .eces-hizli { grid-template-columns: 1fr; } }

/* --- GİDEN İRSALİYELER: durum sekmeleri + satır içi kesme formu --- */
.eces-sekme { display: flex; flex-wrap: wrap; gap: 6px; }
.eces-sekme a {
  display: inline-flex; align-items: center; gap: 7px; text-decoration: none;
  padding: 7px 14px; border-radius: 999px; font-size: 13px; font-weight: 600;
  color: var(--neutral-600); background: var(--neutral-50); border: 1px solid var(--border-color);
}
.eces-sekme a i {
  font-style: normal; font-size: 11.5px; font-weight: 800;
  background: var(--neutral-200); color: var(--neutral-700); border-radius: 999px; padding: 1px 8px;
}
.eces-sekme a:hover { border-color: var(--primary-200); color: var(--primary-700); }
.eces-sekme a.aktif { background: var(--eces-dolu-petrol); border-color: var(--eces-dolu-petrol); color: #fff; }
.eces-sekme a.aktif i { background: rgba(255, 255, 255, .22); color: #fff; }
[data-theme=dark] .eces-sekme a { background: transparent; color: var(--text-secondary-light); }
[data-theme=dark] .eces-sekme a i { background: var(--neutral-100); color: var(--text-secondary-light); }
[data-theme=dark] .eces-sekme a.aktif, [data-theme=dark] .eces-sekme a.aktif i { color: #fff; }

/* İrsaliyesi kesilmemiş satır: soldan ince amber ima (bağıran dolgu yok) */
tr.eces-bekleyen-satir td:first-child { box-shadow: inset 3px 0 0 var(--eces-dolu-amber); }

tr.eces-irs-form > td { background: var(--neutral-50); padding: 16px 18px; }
[data-theme=dark] tr.eces-irs-form > td { background: rgba(255, 255, 255, .03); }
/* width:0 + min-width:100% → colspan'li hücrenin içeriği tablo genişliğini
   HESAPLAMAYA KATILMAZ ama hücreyi tam doldurur (ölçülerek eklendi). */
.eces-irs-sar { width: 0; min-width: 100%; }
.eces-irs-kes { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; }
.eces-irs-kes .bas {
  flex: 1 1 100%; font-size: 13.5px; font-weight: 800; color: var(--neutral-800);
  display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline;
}
.eces-irs-kes .bas span { font-size: 12px; font-weight: 500; color: var(--neutral-500); }
/* Alanlar daralabilir olmalı: colspan'li satır tabloyu genişletirse
   liste yana kaymaya başlıyordu (ölçüldü). */
.eces-irs-kes .alan { flex: 1 1 150px; min-width: 96px; }
.eces-irs-kes .alan.genis { flex: 2 1 180px; }
.eces-irs-kes .eylem { display: flex; gap: 8px; flex: 0 0 auto; }
[data-theme=dark] .eces-irs-kes .bas { color: var(--text-primary-light); }

/* --- ÜRETİM PANELİ: sayfa yenilemesiz işlem sırasında bekleme hâli ---
   İşlem sürerken panel hafifçe soluklaşır ve tıklama almaz; üstte ince bir
   ilerleme çizgisi akar. Böylece "bir şey oldu mu?" sorusu kalmaz. */
.utp-mesgul { position: relative; opacity: .55; pointer-events: none; transition: opacity .12s ease; }
.utp-mesgul::after {
  content: ""; position: absolute; left: 0; right: 0; top: -2px; height: 3px; border-radius: 3px;
  background: linear-gradient(90deg, transparent, var(--eces-dolu-petrol), transparent);
  background-size: 40% 100%; background-repeat: no-repeat;
  animation: utp-akan 1s linear infinite;
}
@keyframes utp-akan {
  from { background-position: -40% 0; }
  to { background-position: 140% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .utp-mesgul::after { animation: none; background-position: 50% 0; }
}

/* --- LİSTE SATIRINDAKİ İŞLEM DÜĞMELERİ ---
   Yan yana dururlar, yer kalmazsa alt alta geçerler; böylece "İşlem"
   sütunu tabloyu yana kaydırmaz. */
.eces-satir-eylem { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.eces-satir-eylem .btn { white-space: nowrap; font-size: 12.5px; }

/* ============================================================
   BÜYÜK HARF TURU KALDIRILDI (kullanıcı isteği)
   Başlık ve etiketler BÜYÜK HARF + geniş harf aralığıyla yazılıyordu.
   Sistem yazısı (Segoe UI) büyük harfte sert görünür ve Türkçede İ/ı
   ayrımı yüzünden okuması zorlaşır. Hepsi normal yazıma alındı; normal
   yazım gözde daha küçük durduğu için punto bir tık büyütüldü.
   GERİ ALMAK İÇİN: bu bloğu silmek yeterli, eski kurallar yerinde duruyor.
   ============================================================ */

/* Tablo başlıkları */
.bordered-table thead tr th,
.basic-border-table thead tr th,
.table.basic-table thead tr th {
  text-transform: none;
  letter-spacing: 0;
  font-size: 0.8125rem !important;
  font-weight: 600;
  color: var(--neutral-600) !important;
}
[data-theme=dark] .bordered-table thead tr th,
[data-theme=dark] .basic-border-table thead tr th,
[data-theme=dark] .table.basic-table thead tr th { color: var(--text-secondary-light) !important; }

/* Ana Panel bölüm başlıkları (Depo Durumu, Üretim ve Kalite …)
   ŞABLON TUZAĞI: style.css'te `h6 { font-size: var(--h6) !important }`
   var — bu yüzden buradaki punto da !important olmak ZORUNDA. Eskiden
   12,5 px yazıyordu ama ekranda 24 px büyük harf çıkıyordu; başlıkların
   bağırmasının asıl sebebi buydu (ölçüldü). */
.eces-bolum-basligi h6 {
  text-transform: none;
  letter-spacing: -0.01em;
  font-size: 15px !important;
  font-weight: 700;
  color: var(--neutral-800);
}
[data-theme=dark] .eces-bolum-basligi h6 { color: var(--text-primary-light); }

/* Özet kutusu etiketleri (Üretime hazır, Toplam stok …) */
.eces-mkart .e {
  text-transform: none;
  letter-spacing: 0;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--neutral-600);
}
.eces-mkart .a { font-size: 12px; }
[data-theme=dark] .eces-mkart .e { color: var(--text-secondary-light); }

/* Kenar menü grup başlığı */
.sidebar-menu .sidebar-menu-group-title {
  text-transform: none;
  letter-spacing: 0;
  font-size: 0.75rem;
  font-weight: 600;
}

/* Üretim paneli etiketleri */
.utp-etk,
.utp-ilerleme .k,
.utp-kpi .kk {
  text-transform: none;
  letter-spacing: 0;
  font-size: 12px;
  font-weight: 600;
}

/* Süzgeç menüsü başlıkları */
.eces-suzgec .bslk,
.eces-suzgec .tumu,
.eces-suzgec .ozet .e {
  text-transform: none;
  letter-spacing: 0;
  font-size: 12px;
  font-weight: 700;
}

/* Kart ve şerit etiketleri */
.eces-parti-toplam .e,
.eces-olcu-grup .etk,
.eces-mutabakat .e,
.eces-cari-kunye b,
.eces-alici-kart .e,
.eces-alici-kart .bilgi b {
  text-transform: none;
  letter-spacing: 0;
  font-size: 12px;
  font-weight: 600;
}

/* --- SİLME ONAY PENCERESİ ---
   Silme geri alınamaz; bu yüzden kendi penceresi var: ne silineceği,
   birlikte nelerin gideceği ve işaretlenmeden geçilemeyen onay kutusu. */
.eces-sil-perde {
  position: fixed; inset: 0; z-index: 1080; display: grid; place-items: center;
  background: rgba(16, 24, 40, .55); padding: 20px;
}
.eces-sil-perde[hidden] { display: none; }
.eces-sil-kutu {
  background: var(--bg-color); border: 1px solid var(--border-color); border-radius: 16px;
  box-shadow: 0 24px 60px rgba(16, 24, 40, .28); padding: 22px 24px;
  width: 100%; max-width: 30rem; max-height: 86vh; overflow-y: auto;
}
.eces-sil-kutu h6 {
  margin: 0 0 10px; font-size: 16px !important; font-weight: 700; color: var(--eces-dolu-kirmizi);
}
.eces-sil-kutu .kayit {
  margin: 0 0 14px; font-size: 15px; font-weight: 700; color: var(--neutral-900);
  background: var(--neutral-50); border: 1px solid var(--border-color);
  border-radius: 10px; padding: 9px 12px; overflow-wrap: anywhere;
}
.eces-sil-kutu .e {
  margin: 0 0 5px; font-size: 12px; font-weight: 600; color: var(--neutral-500);
}
.eces-sil-kutu .dokum {
  margin: 0 0 14px; padding: 0; list-style: none;
  display: flex; flex-wrap: wrap; gap: 6px;
}
.eces-sil-kutu .dokum li {
  background: var(--neutral-100); border-radius: 999px; padding: 3px 11px;
  font-size: 12.5px; color: var(--neutral-700);
}
.eces-sil-kutu .dokum b { color: var(--neutral-900); }
.eces-sil-kutu .uyari {
  margin: 0 0 14px; font-size: 13px; color: var(--neutral-700); line-height: 1.5;
  background: var(--danger-100); border-radius: 10px; padding: 10px 12px;
  box-shadow: inset 3px 0 0 var(--eces-dolu-kirmizi);
}
.eces-sil-kutu .onay {
  display: flex; gap: 9px; align-items: flex-start; cursor: pointer;
  font-size: 13px; color: var(--neutral-700); margin-bottom: 16px; line-height: 1.45;
}
/* ŞABLON TUZAĞI: WowDash input'lara appearance:none veriyor; onay kutusu
   görünmez kalıyordu — elle çizilir (süzgeçlerde de aynı çözüm). */
.eces-sil-kutu .onay input[type="checkbox"] {
  appearance: none; -webkit-appearance: none; flex: none;
  width: 18px; height: 18px; margin-top: 1px; border-radius: 5px;
  border: 1.5px solid var(--neutral-400); background: var(--bg-color); cursor: pointer;
}
.eces-sil-kutu .onay input[type="checkbox"]:checked {
  background: var(--eces-dolu-kirmizi) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/13px no-repeat;
  border-color: var(--eces-dolu-kirmizi);
}
.eces-sil-kutu .onay input[type="checkbox"]:focus-visible { outline: 2px solid var(--eces-dolu-kirmizi); outline-offset: 2px; }
.eces-sil-eksik {
  margin: -8px 0 14px; font-size: 13px; font-weight: 600;
  color: var(--eces-dolu-kirmizi);
}
.eces-sil-eksik[hidden] { display: none; }
.eces-sil-kutu .eylem { display: flex; flex-wrap: wrap; gap: 8px; }
.eces-sil-onayla { background: var(--eces-dolu-kirmizi); color: #fff; border-color: var(--eces-dolu-kirmizi); }
.eces-sil-onayla:hover { background: #A32C23; color: #fff; }
[data-theme=dark] .eces-sil-kutu .kayit { color: var(--text-primary-light); background: transparent; }
[data-theme=dark] .eces-sil-kutu .dokum li { color: var(--text-secondary-light); }
[data-theme=dark] .eces-sil-kutu .uyari,
[data-theme=dark] .eces-sil-kutu .onay { color: var(--text-secondary-light); }

/* surum-isareti: asama13-dilimleme-palet */