/* ═══════════════════════════════════════════════════════════════════════════
   WM UYUM — WMOfis'e özgü köprü katmanı (EN SON yüklenir)

   Görsel dilin kaynağı wmwebdemuhasebe'dir: tokenlar ve bileşen sınıfları
   wwwroot/css/wmweb/*.css içinde BİREBİR kopyadır (scripts/wmweb-css-esitle.mjs).
   Tema anahtarı da aynıdır: <html class="dark"> + localStorage['wm-theme'] =
   'light' | 'dark'. Bu dosya yalnız WMOfis'te bulunan katmanları o tokenlara bağlar:

     1. DevExpress Fluent teması  → --app-* renkleri (vurgu + nötr skala + anlamsal)
     2. Bootstrap (Fluent bs5)    → --app-* renkleri
     3. Eski WMOfis tokenları     → --c-* / --wm-gray-* artık --app-*'tan türer;
                                    mk-* / wm-* sınıflı ~70 ekran kod değişmeden döner.
   Seçici özgüllüğü: kaynak dosyalar :root (0,1,0) ve html[data-wm-dark] (0,1,1)
   kullanır; burada html:root (0,1,1) / html:root.dark (0,2,1) ile kesin üstün gelinir.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── 0. Tailwind preflight (kapsamlı) ────────────────────────────────────
   wmweb bileşen CSS'leri Tailwind'in sıfırlama katmanına güvenir (başlık/paragraf boşluğu 0,
   düğme zemini şeffaf …). WMOfis'te Tailwind yok, yerine bootstrap reboot var. Sıfırlama
   YALNIZ wmweb bileşen kapları içinde ve :where() ile SIFIR özgüllükte uygulanır — bileşen
   sınıfları her zaman üstün gelir, eski mk-* ekranlar etkilenmez. */
:where(.wm-stok, .wm-ckart, .wm-dialog-mask, .wm-toast, .wm-liste-sec__mask, .wm-ckart__popup-mask, .wm-grid__menu)
  :where(h1, h2, h3, h4, h5, h6, p, ul, ol, figure, blockquote) { margin: 0; }
:where(.wm-stok, .wm-ckart, .wm-dialog-mask, .wm-toast, .wm-liste-sec__mask, .wm-ckart__popup-mask, .wm-grid__menu)
  :where(ul, ol) { padding: 0; list-style: none; }
:where(.wm-stok, .wm-ckart, .wm-dialog-mask, .wm-toast, .wm-liste-sec__mask, .wm-ckart__popup-mask, .wm-grid__menu)
  :where(h1, h2, h3, h4, h5, h6) { font-size: inherit; font-weight: inherit; line-height: inherit; }
:where(.wm-stok, .wm-ckart, .wm-dialog-mask, .wm-toast, .wm-liste-sec__mask, .wm-ckart__popup-mask, .wm-grid__menu)
  :where(button) { background-color: transparent; background-image: none; border: 0 solid; padding: 0; font: inherit; color: inherit; }
:where(.wm-stok, .wm-ckart, .wm-dialog-mask, .wm-toast, .wm-liste-sec__mask, .wm-ckart__popup-mask, .wm-grid__menu)
  :where(input, select, textarea) { font: inherit; color: inherit; }
:where(.wm-toast, .wm-dialog-mask) :where(svg) { display: block; }

/* Seçim popup'ı alanın (.wm-ckart__alan) İÇİNDE çizilir; alan girdisi kuralları popup arama
   kutusuna sızmasın (wmweb'de popup form kökündedir). */
.wm-ckart__alan .wm-ckart__popup-ara input:not([type=checkbox]),
.wm-ckart__alan .wm-ckart__popup-ara input:not([type=checkbox]):focus {
  flex: 1; height: auto; min-height: var(--app-kontrol-yukseklik);
  border: 0; border-radius: 0; padding: 0; background: transparent; box-shadow: none; outline: none;
}

/* ─── 1. DevExpress Fluent ─────────────────────────────────────────────────
   Fluent açık/koyu modu <html> üzerindeki dxbl-theme-fluent-mode-dark sınıfıyla
   döner (wm.js wmTema.uygula ekler). Vurgu skalası --dxbl-accent-color-* ile,
   anlamsal renkler doğrudan --app-* ile verilir. */
html:root {
  --DS-font-family-sans-serif: var(--font-sans);

  /* vurgu = wmweb primary #00215e (90 = ana ton) */
  --dxbl-accent-color-10: #eef1f8;  --dxbl-accent-color-20: #d7ddec;
  --dxbl-accent-color-30: #c0cadf;  --dxbl-accent-color-40: #a9b6d3;
  --dxbl-accent-color-50: #8294bb;  --dxbl-accent-color-60: #5a72a2;
  --dxbl-accent-color-70: #33508a;  --dxbl-accent-color-80: #1a3974;
  --dxbl-accent-color-90: #00215e;  --dxbl-accent-color-100: #001e56;
  --dxbl-accent-color-110: #001a4d; --dxbl-accent-color-120: #001747;
  --dxbl-accent-color-130: #001440; --dxbl-accent-color-140: #001034;
  --dxbl-accent-color-150: #000d28; --dxbl-accent-color-160: #00091b;
  --dxbl-accent-color-170: #00050f;
}

html:root.dark {
  /* vurgu = wmweb koyu primary #5b86f0 */
  --dxbl-accent-color-10: #e3eafd;  --dxbl-accent-color-20: #d4dffc;
  --dxbl-accent-color-30: #c6d5fa;  --dxbl-accent-color-40: #b7caf9;
  --dxbl-accent-color-50: #a8bff7;  --dxbl-accent-color-60: #93b0f5;
  --dxbl-accent-color-70: #7da0f3;  --dxbl-accent-color-80: #6c93f2;
  --dxbl-accent-color-90: #5b86f0;  --dxbl-accent-color-100: #537de6;
  --dxbl-accent-color-110: #4a74dc; --dxbl-accent-color-120: #436cd2;
  --dxbl-accent-color-130: #3b63c7; --dxbl-accent-color-140: #2c4789;
  --dxbl-accent-color-150: #1c2a4a; --dxbl-accent-color-160: #141e35;
  --dxbl-accent-color-170: #0c1220;

  /* Fluent'in gri nötr skalası koyu lacivert skalaya çevrilir (wmweb koyu zemin
     #0c1220 / yüzey #141c2e / metin #d2dbea). Hover/pressed ara tonları da buradan. */
  --DS-neutral-10: #f0f4fc;  --DS-neutral-20: #e1e8f3;  --DS-neutral-30: #d2dbea;
  --DS-neutral-40: #bcc6d8;  --DS-neutral-50: #a5b0c5;  --DS-neutral-60: #8f9bb3;
  --DS-neutral-70: #8491aa;  --DS-neutral-80: #7a87a1;  --DS-neutral-90: #6f7d98;
  --DS-neutral-100: #65738f; --DS-neutral-110: #5a6886; --DS-neutral-120: #4f5e7d;
  --DS-neutral-130: #455474; --DS-neutral-140: #3a4a6b; --DS-neutral-150: #364565;
  --DS-neutral-160: #32405e; --DS-neutral-170: #2e3c58; --DS-neutral-180: #2a3752;
  --DS-neutral-190: #26324b; --DS-neutral-200: #222d45; --DS-neutral-210: #1e293f;
  --DS-neutral-220: #1a2438; --DS-neutral-230: #141c2e; --DS-neutral-240: #10182a;
  --DS-neutral-250: #0c1220;
}

/* Anlamsal eşleme — iki modda da --app-* tokenlarından (html.dark ile kendiliğinden döner) */
html:root,
html:root.dark {
  --DS-color-surface-neutral-default-rest: var(--app-surface);
  --DS-color-surface-neutral-subdued-rest: var(--app-surface-alt);
  --DS-color-content-neutral-default-rest: var(--app-text-body);
  --DS-color-content-neutral-subdued-rest: var(--app-text-muted);
  --DS-color-border-neutral-default-rest: var(--app-border);
  --DS-color-border-neutral-subdued-rest: var(--app-border);
  --DS-color-content-primary-default-rest: var(--app-primary);
  --DS-color-surface-primary-subdued-rest: var(--app-primary-soft);
  --DS-color-border-focus: var(--app-primary);
}

/* ─── 2. Bootstrap (Fluent bs5) ────────────────────────────────────────────
   Sayfalarda kalan bootstrap sınıfları (alert, btn, table, px-4 …) aynı paleti kullanır.
   Koyu mod: <html data-bs-theme="dark"> (wmTema.uygula). */
html:root {
  --bs-body-font-family: var(--font-sans);
  --bs-body-color: var(--app-text-body);
  --bs-body-bg: var(--app-bg);
  --bs-border-color: var(--app-border);
  --bs-primary: var(--app-primary);
  --bs-primary-rgb: 0, 33, 94;
  --bs-link-color: var(--app-primary);
  --bs-link-color-rgb: 0, 33, 94;
  --bs-link-hover-color: var(--app-primary-hover);
  --bs-success: var(--app-success);
  --bs-danger: var(--app-error);
  --bs-warning: var(--app-warning);
}
html:root.dark {
  --bs-primary-rgb: 91, 134, 240;
  --bs-link-color-rgb: 91, 134, 240;
}

/* ─── 3. Eski WMOfis tokenları → wmweb tokenları ───────────────────────────
   lisans.css'teki --c-* / --wm-gray-* tanımları burada ezilir. data-wm-dark
   işareti (eski koyu tema bloğu) da aynı değerlere bağlanır; tek doğruluk
   kaynağı html.dark ile dönen --app-* tokenlarıdır. */
html:root,
html:root[data-wm-dark] {
  --c-surface: var(--app-surface);
  --c-bg-soft: var(--app-surface-alt);
  --c-bg-app: var(--app-bg);
  --c-bg: var(--app-bg);
  --c-heading: var(--app-text-primary);
  --c-text: var(--app-text-body);
  --c-muted: var(--app-text-muted);
  --c-faint: color-mix(in srgb, var(--app-text-muted) 72%, var(--app-surface));
  --c-border: var(--app-border);
  --c-border-soft: color-mix(in srgb, var(--app-border) 55%, var(--app-surface));
  --c-border-strong: color-mix(in srgb, var(--app-border-strong) 45%, var(--app-border));
  --c-primary: var(--app-primary);
  --c-primary-dark: var(--app-primary-hover);
  --c-primary-soft: var(--app-primary-soft);
  --c-danger: var(--app-error);
  --c-danger-soft: var(--app-error-light);
  --c-success: var(--app-success);
  --c-success-soft: var(--app-success-light);
  --c-warning: var(--app-warning-text);
  --c-warning-soft: var(--app-warning-light);
  --c-accent: var(--app-primary);
  --c-accent-dark: var(--app-primary-hover);
  --c-accent2: var(--app-accent);

  --wm-gray-50: var(--app-surface-alt);
  --wm-gray-100: color-mix(in srgb, var(--app-bg) 70%, var(--app-surface));
  --wm-gray-200: var(--app-border);
  --wm-gray-300: color-mix(in srgb, var(--app-border-strong) 40%, var(--app-border));
  --wm-gray-400: color-mix(in srgb, var(--app-text-muted) 70%, var(--app-surface));
  --wm-gray-500: var(--app-text-muted);
  --wm-gray-600: color-mix(in srgb, var(--app-text-muted) 50%, var(--app-text-body));
  --wm-gray-700: var(--app-text-body);
  --wm-gray-800: color-mix(in srgb, var(--app-text-body) 60%, var(--app-text-primary));
  --wm-gray-900: var(--app-text-primary);
  --wm-shadow: var(--app-shadow-sm);
  --wm-shadow-md: var(--app-shadow-md);
}

/* ─── 4. Sayfa kabı ────────────────────────────────────────────────────────
   wmweb'de liste ve form ekranları içerik alanını tam kaplar (.wm-stok / .wm-ckart
   height:100%). WMOfis içerik alanı akışlı olduğu için yükseklik burada verilir:
   pencere − üst çubuk (3.5rem) − içerik üst boşluğu (1.5rem) − alt pay. */
.wm-sayfa {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 3.5rem - 1.5rem - 14px);
  min-height: 460px;
  min-width: 0;
}
.wm-sayfa > .wm-stok,
.wm-sayfa > .wm-ckart { flex: 1 1 auto; min-height: 0; }
.wm-sayfa--popup { height: 100%; min-height: 0; }

/* ─── 5. Liste tablosu: DxGrid → wmweb data-grid görünümü ───────────────────
   Dış çerçeve .wm-grid (wmweb/data-grid.css) — içteki DxGrid çerçevesiz, tam yükseklik;
   satır 28px · hücre 11px · başlık 32px 12px/500 muted · hover primary %9 ·
   seçili/odak primary-soft + solda 3px çizgi · altta .wm-grid__durum. */
.wm-dxgrid { flex: 1 1 auto; min-height: 0; }
.wm-dxgrid > .dxbl-grid {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  border: 0;
  border-radius: 0;
  --dxbl-grid-font-family: var(--font-sans);
  --dxbl-grid-font-size: var(--font-size-xs);
  --dxbl-grid-line-height: 14px;
  --dxbl-grid-text-cell-padding-x: 12px;
  --dxbl-grid-text-cell-padding-y: 6.5px;
  --dxbl-grid-bg: var(--app-surface);
  --dxbl-grid-color: var(--app-text-body);
  --dxbl-grid-border-color: var(--app-border);
  --dxbl-grid-border-radius: 0;
  --dxbl-grid-header-bg: var(--app-surface-alt);
  --dxbl-grid-header-color: var(--app-text-muted);
  --dxbl-grid-header-font-weight: 500;
  --dxbl-grid-hover-bg: color-mix(in srgb, var(--app-primary) 9%, var(--app-surface));
  --dxbl-grid-hover-color: var(--app-text-body);
  --dxbl-grid-focus-bg: color-mix(in srgb, var(--app-primary) 14%, var(--app-primary-soft));
  --dxbl-grid-focus-color: var(--app-text-primary);
  --dxbl-grid-selection-color: var(--app-text-primary);
  --dxbl-grid-empty-data-area-padding-y: 0;
  --dxbl-grid-empty-data-area-padding-x: 0;
}
/* Yalnız yatay çizgiler (wmweb: dikey kolon çizgisi yok) */
.wm-dxgrid .dxbl-grid .dxbl-grid-table > tbody > tr > td,
.wm-dxgrid .dxbl-grid .dxbl-grid-table > thead > tr > th { border-left-width: 0; white-space: nowrap; }
.wm-dxgrid .dxbl-grid .dxbl-grid-table > thead > tr > th {
  height: 32px;
  font-size: var(--font-size-sm);
  letter-spacing: 0.01em;
  border-bottom: 1px solid var(--app-border);
}
.wm-dxgrid .dxbl-grid .dxbl-grid-table > thead .dxbl-grid-header-row > th:hover { color: var(--app-primary); }
/* Satır yüksekliği dolgu ile 28px (14px satır + 2×6.5px + 1px çizgi); sabit height verilmez —
   sanal kaydırmanın boşluk satırını da büyütür. */
.wm-dxgrid .dxbl-grid .dxbl-grid-table > tbody > tr:not(.dxbl-grid-empty-row) { cursor: pointer; }
.wm-dxgrid .dxbl-grid .dxbl-grid-focused-row > td:first-child,
.wm-dxgrid .dxbl-grid .dxbl-grid-selected-row > td:first-child { box-shadow: inset 3px 0 0 var(--app-primary); }
/* Satır menüsü kolonu — dar, ortalı, sabit (solda) */
/* 22px düğme + 2×2.5px dolgu + 1px çizgi = 28px satır. DevExpress dolgu kuralı çok özgül (:not zinciri);
   ezmek yerine hücrenin kendi dolgu değişkenleri verilir. */
.wm-dxgrid .dxbl-grid td.wm-dxgrid__islem,
.wm-dxgrid .dxbl-grid th.wm-dxgrid__islem {
  --dxbl-grid-text-cell-padding-y: 2.5px;
  --dxbl-grid-text-cell-padding-x: 6px;
  text-align: center; overflow: visible; line-height: 0;
}
/* Boş durum: wmweb .wm-grid__bos-kutu kendi boşluğunu verir */
.wm-dxgrid .dxbl-grid-empty-data-area { padding: 0; }
.wm-dxgrid .wm-grid__bos-kutu { position: static; }
/* Hücre içi rozetler tabloda sıkışmasın */
.wm-dxgrid .wm-badge { font-size: 10.5px; line-height: 1.3; padding: 1px 7px; }
.wm-dxgrid .wm-dxgrid__soluk > td { opacity: .55; }

/* Programla odaklanan menü / pencere kaplarında tarayıcı odak çerçevesi çizilmez (klavye odağı içerikte) */
.wm-grid__menu:focus, .wm-dialog:focus, .wm-liste-sec__panel:focus, .wm-ckart__popup:focus { outline: none; }

/* Satır menüsü perdesi (menü dışı tıklama) — menünün (z 90) hemen altında */
.wm-satir-menu__perde { position: fixed; inset: 0; z-index: 89; background: transparent; }

/* ─── 6. Form: sabit panel akışı ────────────────────────────────────────────
   wmweb formu serbest (mutlak konumlu, sürükle-bırak) panel düzenleyicisine sahiptir;
   WMOfis'te paneller 12 kolonluk akış ızgarasına dizilir (WmFormGrup Genislik). */
.wm-ckart__izgara--akis {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 10px;
  align-content: start;
  padding-bottom: 16px;
}
.wm-ckart__izgara--akis > .wm-ckart__kart { position: static; }
@media (max-width: 1100px) {
  .wm-ckart__izgara--akis > .wm-ckart__kart { grid-column: 1 / -1 !important; }
}
/* DevExpress editörleri form alanında wmweb girdisi ölçüsünde (sayfalarda kalan Dx* kontroller için) */
.wm-ckart__alan > .dxbl-text-edit,
.wm-ckart__alan > .dxbl-combobox,
.wm-ckart__alan > .dxbl-spin-edit,
.wm-ckart__alan > .dxbl-date-edit { flex: 1 1 auto; min-width: 0; }
/* Form paneli içinde açıklama satırı (tam genişlik, 11px muted) */
.wm-ckart__not { grid-column: 1 / -1; margin: 2px 0 0; font-size: 11px; line-height: 1.4; color: var(--app-text-muted); }
/* Rapor tanımı SQL / semantik sorgu alanı — eş aralıklı, geniş */
.wm-ckart__alan textarea.wm-rapor-sorgu { min-height: 320px; font-family: var(--font-mono); font-size: 12px; line-height: 1.5; white-space: pre; }
.wm-ckart__not--uyari { padding: 7px 10px; border-radius: var(--app-kontrol-radius); background: var(--app-warning-light); color: var(--app-warning-text); }

/* ─── 7. Katman sırası (geçiş dönemi) ───────────────────────────────────────
   Henüz dönüştürülmemiş ekranların mk-modal-ov katmanı z-index 1050. wmweb seçim popup'ları
   (920) ve toast (1000) bu modalların İÇİNDEN de açılabildiği için üste alınır; onay
   penceresi (1100) en üstte kalır. */
.wm-liste-sec__mask, .wm-ckart__popup-mask { z-index: 1080; }
.wm-toast { z-index: 1090; }

/* WmListe üst bilgi alanı (başlık ile tablo arasında; örn. özet kartları, hızlı form) */
.wm-liste__ust-bilgi { flex-shrink: 0; }
.wm-ozet-kartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px; }
.wm-ozet-kart { padding: 8px 12px; border: 1px solid var(--app-border); border-radius: 10px; background: var(--app-surface); box-shadow: var(--app-shadow-sm); }
.wm-ozet-kart__etiket { margin: 0 0 4px; font-size: 10px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--app-text-muted); }
.wm-ozet-kart__deger { display: flex; flex-wrap: wrap; gap: 10px; font-size: 12px; color: var(--app-text-body); font-variant-numeric: tabular-nums; }
.wm-ozet-kart__deger b { font-weight: 500; color: var(--app-text-primary); }
/* Seçim alanı (lookup) form alanı DIŞINDA da (eski mk-* modallar) wmweb ölçüsünde görünsün */
.wm-ckart__lookup > input { height: 100%; padding: 0 var(--app-kontrol-pad-x); border: 0; background: transparent; color: var(--app-text-body); font: inherit; font-size: 12px; outline: none; }
.wm-ckart__lookup:focus-within { border-color: var(--app-primary); box-shadow: var(--app-shadow-focus); }
/* Liste yerine takvim görünümü (Ziyaretler) — tablo çerçevesi içinde kaydırılır */
.wm-takvim { overflow: auto; padding: 8px; }
/* Elektronik onay beyanları — uzun metinli onay kutuları alt alta, satır kaydırarak */
.wm-onay-beyanlar { display: flex; flex-direction: column; gap: 8px; }
.wm-onay-beyanlar .wm-ckart__tek-kutu { white-space: normal; align-items: flex-start; line-height: 1.45; }
.wm-onay-beyanlar .wm-ckart__tek-kutu input { margin-top: 2px; flex-shrink: 0; }
/* Yardım Masası kuyruk düğmeleri (liste üst bilgisi) — dar ekranda yatay kayar */
.wm-kuyruklar { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: thin; }
.wm-kuyruklar > .wm-stok__btn { flex-shrink: 0; }
.wm-metin--tehlike { color: var(--app-error-text); font-weight: 500; }
/* Talep yazışma akışı (HelpdeskForm) — form paneli içinde tam genişlik */
.wm-hd-akis { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 8px; }
.wm-hd-akis .hd-entry { margin: 0; }
.wm-hd-akis .hd-entry-govde { white-space: pre-wrap; }
.wm-hd-satir { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
/* Onay penceresi çok satırlı mesaj (ör. toplu kurulum özeti) — tek satırlık mesajları etkilemez */
.wm-dialog__mesaj { white-space: pre-line; }
/* Form içi durum metni (wmweb listede rozet yok; form tablolarında renkli düz metin) */
.wm-durum { font-weight: 500; white-space: nowrap; }
.wm-durum--ok { color: var(--app-success-text); }
.wm-durum--uyari { color: var(--app-warning-text); }
.wm-durum--hata { color: var(--app-error-text); }
.wm-durum--notr { color: var(--app-text-muted); }
/* Sunucu log / komut çıktısı */
.wm-log { grid-column: 1 / -1; margin: 0; max-height: 340px; overflow: auto; padding: 8px 10px; border: 1px solid var(--app-border);
  border-radius: var(--app-kontrol-radius); background: var(--app-surface-alt); color: var(--app-text-body);
  font-family: var(--font-mono); font-size: 11px; line-height: 1.45; white-space: pre-wrap; }
/* Uzun işlem ilerlemesi (toplu kurulum) */
.wm-ilerleme { display: flex; flex-direction: column; gap: 8px; }
.wm-ilerleme__cubuk { height: 8px; border-radius: 4px; overflow: hidden; background: var(--app-border); }
.wm-ilerleme__cubuk > div { height: 100%; background: var(--app-primary); transition: width .3s; }
.wm-ilerleme__liste { margin: 0; padding: 0; list-style: none; max-height: 180px; overflow: auto; font-size: 12px; }
/* Sunucu işlem karoları — wmweb tokenlarıyla */
.wm-ckart .srv-tile { border-color: var(--app-border); border-radius: var(--app-kontrol-radius); background: var(--app-surface); color: var(--app-text-body); font-weight: 500; }
.wm-ckart .srv-tile:hover:not(.pasif):not(:disabled) { border-color: var(--app-primary); color: var(--app-primary); }
.wm-ckart .srv-tile.tehlike:hover:not(.pasif):not(:disabled) { border-color: var(--app-error); color: var(--app-error-text); }
/* Dosya önizleme penceresi (müşteri kartı › Dosyalar) — seçim popup'ı kabuğu, geniş gövde */
.wm-ckart__popup.wm-onizleme { width: min(960px, calc(100vw - 32px)); max-height: calc(100vh - 48px); }
.wm-onizleme__govde { flex: 1; min-height: 0; overflow: auto; background: var(--app-surface-alt); }
.wm-onizleme__govde img { display: block; max-width: 100%; margin: 0 auto; }
.wm-onizleme__govde iframe { display: block; width: 100%; height: 70vh; border: 0; background: #fff; }
/* Form içi tabloda açılır ayrıntı satırı (müşteri kartı › imza talebi imzacıları, sirkü yetkilileri) */
.wm-dg tr.wm-dg-ayrinti > td { padding: 8px 10px 10px; background: var(--app-surface-alt); }
.wm-dg tr.wm-dg-ayrinti .wm-dg { width: 100%; }
/* Komut / PEM metin alanı (müşteri kartı › Sunucular) — eş aralıklı */
.wm-ckart__alan textarea.wm-kod { font-family: var(--font-mono); font-size: 11.5px; line-height: 1.45; white-space: pre; }
/* Form tablosu satırındaki ikon düğme grubu */
.wm-islem-dugmeleri { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
/* Başka ekranlarda da kullanılan paneller (KontorPanel, MusteriIzinPanel, KvkkOzetPanel) kendi akış ızgarasını taşır:
   hem form gövdesinde (grid-column:1/-1 kabında) hem eski ekranlarda aynı görünür. */
.wm-panel-akis { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 10px; align-content: start; min-width: 0; }
.wm-panel-akis > .wm-ckart__kart { position: static; }
@media (max-width: 1100px) { .wm-panel-akis > .wm-ckart__kart { grid-column: 1 / -1 !important; } }
.wm-ozet-kart--ok { border-color: var(--app-success); }
.wm-ozet-kart--uyari { border-color: var(--app-warning); }
.wm-ozet-kart--hata { border-color: var(--app-error); }
/* Form sekmeleri — tüm sekmeler ilk bakışta görünsün: wmweb tek satırda yatay kaydırır; WMOfis'te sığmayan sekme
   alt satıra kayar (kullanıcı isteği 2026-09-26, müşteri kartı 13 sekme). Sekme genişliği içeriğe göre. */
.wm-ckart__sekme-ray { flex-wrap: wrap; overflow-x: visible; }
.wm-ckart__sekme { min-width: 0; flex: 0 1 auto; }
/* Görüntüleme tablosu (WmVeriGrid Liste / table.wm-dg--liste): wm-dg kolon sınıfları veri GİRİŞİ için sabit
   genişliklidir (dar 4.75rem, işlem 2.5rem en çok); görüntülemede telefon, durum+düğme, çoklu işlem düğmesi komşu
   hücreye taşıyordu. Burada kolonlar içeriğe göre açılır, dar/tarih/tutar/işlem kırılmaz. */
.wm-dg--liste :is(.wm-dg-dar, .wm-dg-tarih, .wm-dg-tutar, .wm-dg-islem, .wm-dg-check, .wm-dg-genis) { width: auto; max-width: none; }
.wm-dg--liste :is(.wm-dg-dar, .wm-dg-tarih, .wm-dg-tutar, .wm-dg-islem) { white-space: nowrap; overflow: visible; }
.wm-dg--liste .wm-dg-dar { min-width: 4.75rem; }
.wm-dg--liste .wm-dg-islem { min-width: 2.5rem; padding: 2px 6px !important; text-align: right !important; }
.wm-dg--liste .wm-dg-genis { min-width: 12rem; white-space: normal; }
.wm-dg--liste td { vertical-align: middle; }
/* Yardım dokümanları — kart görünümü (bilgi bankası) ve okuma sayfası, wmweb tokenlarıyla */
.wm-kb-kap { overflow: auto; padding: 10px; }
.wm-kb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
.wm-kb-card { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border: 1px solid var(--app-border); border-radius: 10px;
  background: var(--app-surface); box-shadow: var(--app-shadow-sm); cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease; }
.wm-kb-card:hover, .wm-kb-card:focus-visible { border-color: var(--app-primary); outline: none; }
.wm-kb-card h3 { margin: 0; font-size: 13px; font-weight: 600; color: var(--app-text-primary); }
.wm-kb-card__ust, .wm-kb-card__alt { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.wm-kb-card__ust { justify-content: space-between; }
.wm-kb-card__kategori { font-size: 11px; font-weight: 500; color: var(--app-primary); }
.wm-kb-card__meta { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; color: var(--app-text-muted); }
.wm-kb-card__meta .material-symbols-outlined { font-size: 14px; }
.wm-kb-card .wm-kb-ozet { margin: 0; font-size: 12px; line-height: 1.5; color: var(--app-text-body); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.wm-kb-etiket { display: inline-flex; align-items: center; padding: 1px 8px; border: 1px solid var(--app-border); border-radius: 999px;
  background: var(--app-surface-alt); color: var(--app-text-body); font-size: 11px; text-decoration: none; cursor: pointer; }
.wm-kb-etiket--aktif { border-color: var(--app-primary); background: var(--app-primary-soft); color: var(--app-primary); }
.wm-kb-okuma { grid-column: 1 / -1; white-space: pre-wrap; line-height: 1.6; font-size: 13px; color: var(--app-text-body); }
/* Dosya Yönetimi — WmListe gövdesinde klasör ağacı (filtre paneli görünümünde) + sağda konum, alt klasörler, dosyalar */
.wm-dosya__agac { display: flex; flex-direction: column; width: 260px; flex-shrink: 0; min-height: 0; overflow: hidden;
  border: 1px solid var(--app-border); border-radius: 12px; background: var(--app-surface); box-shadow: var(--app-shadow-sm); }
.wm-dosya__agac-head { display: flex; align-items: center; gap: 8px; padding: var(--app-grup-header-pad); border-bottom: 1px solid var(--app-border);
  background: linear-gradient(180deg, color-mix(in srgb, var(--app-primary-soft) 55%, var(--app-surface)), var(--app-surface)); }
.wm-dosya__agac-head .material-symbols-outlined { font-size: 18px; color: var(--app-primary); }
.wm-dosya__agac-head h2 { margin: 0; font-size: 12px; font-weight: 600; color: var(--app-text-primary); }
.wm-dosya__agac-govde { flex: 1; min-height: 0; overflow: auto; padding: 6px; }
.wm-dosya__dugum { display: flex; align-items: center; gap: 4px; min-height: 28px; padding: 0 8px 0 4px; border-radius: 7px; cursor: pointer;
  font-size: 12px; color: var(--app-text-body); user-select: none; }
.wm-dosya__dugum:hover { background: color-mix(in srgb, var(--app-primary) 9%, var(--app-surface)); }
.wm-dosya__dugum > .material-symbols-outlined { font-size: 17px; color: var(--app-text-muted); }
.wm-dosya__dugum--secili { background: var(--app-primary-soft); color: var(--app-primary); font-weight: 500; box-shadow: inset 3px 0 0 var(--app-primary); }
.wm-dosya__dugum--secili > .material-symbols-outlined { color: var(--app-primary); }
.wm-dosya__dugum--hedef, .wm-dosya__klasor--hedef { outline: 2px dashed var(--app-primary); outline-offset: -2px; background: var(--app-primary-soft); }
.wm-dosya__ok { display: inline-flex; width: 18px; flex-shrink: 0; justify-content: center; color: var(--app-text-muted); }
.wm-dosya__ok .material-symbols-outlined { font-size: 16px; }
.wm-dosya__dugum-ad { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wm-dosya__dugum-sayi { margin-left: auto; font-size: 10.5px; color: var(--app-text-muted); font-variant-numeric: tabular-nums; }
.wm-dosya__ipucu { padding: 8px 10px; border-top: 1px solid var(--app-border); font-size: 11px; color: var(--app-text-muted); background: var(--app-surface-alt); }
.wm-dosya__surukleniyor { opacity: .45; }
.wm-dosya__sag { display: flex; flex: 1 1 auto; flex-direction: column; gap: 8px; min-width: 0; min-height: 0; }
.wm-dosya__konum { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; min-height: 24px; font-size: 12px; color: var(--app-text-muted); }
.wm-dosya__konum-parca { padding: 2px 6px; border: 0; border-radius: 6px; background: transparent; color: var(--app-primary); font: inherit; cursor: pointer; }
.wm-dosya__konum-parca:hover { background: var(--app-primary-soft); }
.wm-dosya__konum-ayrac { font-size: 16px; }
.wm-dosya__konum-son { padding: 2px 6px; font-weight: 600; color: var(--app-text-primary); }
.wm-dosya__konum-sayi { margin-left: auto; font-size: 11px; }
.wm-dosya__klasorler { display: flex; flex-wrap: wrap; gap: 6px; flex-shrink: 0; max-height: 132px; overflow: auto; }
.wm-dosya__klasor { display: inline-flex; align-items: center; gap: 6px; max-width: 260px; height: 32px; padding: 0 10px; border: 1px solid var(--app-border);
  border-radius: var(--app-kontrol-radius); background: var(--app-surface); font-size: 12px; color: var(--app-text-body); cursor: pointer; user-select: none; }
.wm-dosya__klasor:hover { border-color: var(--app-primary); color: var(--app-primary); }
.wm-dosya__klasor > .material-symbols-outlined { font-size: 18px; color: var(--app-warning); }
.wm-dosya__klasor--ust > .material-symbols-outlined { color: var(--app-text-muted); }
.wm-dosya__klasor-ad { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.wm-dosya__klasor-sayi { font-size: 10.5px; color: var(--app-text-muted); white-space: nowrap; }
.wm-dosya__alan { overflow: hidden; }
.wm-dosya__satirlar { flex: 1; min-height: 0; overflow: auto; padding: 4px 0; }
.wm-dosya__satir { display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px 0 6px; font-size: 12px; color: var(--app-text-body);
  border-bottom: 1px solid color-mix(in srgb, var(--app-border) 60%, transparent); cursor: default; }
.wm-dosya__satir:hover { background: color-mix(in srgb, var(--app-primary) 9%, var(--app-surface)); }
.wm-dosya__satir-ad { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--app-text-primary); }
.wm-dosya__satir-bag { max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; color: var(--app-text-muted); }
.wm-dosya__satir-meta { width: 70px; text-align: right; font-size: 11px; color: var(--app-text-muted); font-variant-numeric: tabular-nums; }
.wm-dosya__karolar { display: grid; flex: 1; min-height: 0; overflow: auto; align-content: start; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; padding: 12px; }
.wm-dosya__karo { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 14px 8px 10px; border: 1px solid var(--app-border);
  border-radius: 10px; background: var(--app-surface); text-align: center; cursor: default; }
.wm-dosya__karo:hover { border-color: var(--app-primary); box-shadow: var(--app-shadow-sm); }
.wm-dosya__karo-menu { position: absolute; top: 4px; right: 4px; }
.wm-dosya__karo-ikon { font-size: 38px !important; }
.wm-dosya__karo-ad { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 500; color: var(--app-text-primary); }
.wm-dosya__karo-meta { font-size: 10.5px; color: var(--app-text-muted); }
.wm-dosya__tur { font-size: 18px; color: var(--app-text-muted); flex-shrink: 0; }
.wm-dosya__tur--word { color: #2b579a; }
.wm-dosya__tur--excel { color: #217346; }
.wm-dosya__tur--pdf { color: #c62828; }
.wm-dosya__tur--gorsel { color: #8e24aa; }
html.dark .wm-dosya__tur--word { color: #7ea6e0; }
html.dark .wm-dosya__tur--excel { color: #6fcf97; }
html.dark .wm-dosya__tur--pdf { color: #ef9a9a; }
html.dark .wm-dosya__tur--gorsel { color: #ce93d8; }
.wm-dosya__hucre-ad { display: inline-flex; align-items: center; gap: 6px; color: var(--app-text-primary); }
.wm-dosya__hucre-ad .wm-dosya__tur { font-size: 16px; }
.wm-dosya__hizli { margin-top: 6px; }
.wm-dosya__hizli-etiket { font-size: 12px; color: var(--app-text-body); }
.wm-dosya__baglanti { font-family: var(--font-mono); font-size: 11px; word-break: break-all; color: var(--app-text-body); }
.wm-dosya__word { grid-column: 1 / -1; min-height: 0; }
.wm-dosya__word-editor { height: calc(100vh - 3.5rem - 1.5rem - 170px); min-height: 420px; border: 1px solid var(--app-border); border-radius: 10px; overflow: hidden; }
/* DxUpload (Dosya Yönetimi üst bilgi) — yalnız yükleme sırasında dosya listesi görünür */
.wm-liste__ust-bilgi .dxbl-upload { border: 0; padding: 0; background: transparent; }
.wm-liste__ust-bilgi .dxbl-upload .dxbl-upload-container .dxbl-upload-file-list-view:not(:has(*)) { display: none; }
/* Araç çubuğunda yalnız ikonlu düğme (görünüm seçimi, klasör işlemleri) — ipucu data-ipucu ile */
.wm-stok__btn.wm-stok__btn--yalniz-ikon { padding-left: 7px; padding-right: 7px; gap: 0; }
@media (max-width: 900px) { .wm-dosya__agac { width: 200px; } }
/* Proje çalışma alanı — üst bilgi notu / hızlı form, Pano (kanban), Gantt; iş paketi formu bağ listesi ve günlük */
.wm-proje__not { margin-top: 6px; }
.wm-proje__hizli { margin-top: 6px; }
.wm-pano { overflow: auto; }
.wm-pano__kolonlar { display: flex; gap: 10px; min-width: max-content; min-height: 100%; padding: 10px; align-items: stretch; }
.wm-pano__kolon { display: flex; flex-direction: column; width: 264px; flex: 0 0 auto; border: 1px solid var(--app-border); border-radius: 10px;
  background: var(--app-surface-alt); }
.wm-pano__kolon-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; font-size: 12px;
  color: var(--app-text-primary); border-bottom: 3px solid var(--wm-pano-renk, var(--app-border)); }
.wm-pano__sayi { min-width: 22px; padding: 1px 7px; border-radius: 999px; background: var(--app-surface); font-size: 11px; text-align: center; color: var(--app-text-muted); }
.wm-pano__kartlar { display: flex; flex-direction: column; gap: 8px; padding: 8px; min-height: 120px; }
.wm-pano__kart { display: flex; flex-direction: column; gap: 4px; padding: 8px 10px; border: 1px solid var(--app-border); border-radius: 8px;
  background: var(--app-surface); box-shadow: var(--app-shadow-sm); }
.wm-pano__kart:hover { border-color: var(--app-primary); }
.wm-pano__kart-ust { font-size: 10.5px; color: var(--app-text-muted); }
.wm-pano__kart-konu { padding: 0; border: 0; background: none; text-align: left; font: inherit; font-size: 12px; font-weight: 500; color: var(--app-primary); cursor: pointer; }
.wm-pano__kart-konu:hover { text-decoration: underline; }
.wm-pano__kart-alt { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 11px; color: var(--app-text-muted); }
.wm-pano__durum { width: 118px; height: 24px; font-size: 11px; }
.wm-gantt { overflow: auto; }
.wm-gantt__govde { min-width: 720px; padding: 10px 12px; }
.wm-gantt__satir { display: flex; align-items: center; gap: 10px; height: 28px; border-bottom: 1px solid color-mix(in srgb, var(--app-border) 50%, transparent); }
.wm-gantt__ad { width: 240px; flex-shrink: 0; padding: 0; border: 0; background: none; text-align: left; font: inherit; font-size: 12px; color: var(--app-text-body);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.wm-gantt__ad:hover { color: var(--app-primary); }
.wm-gantt__ad > span { font-size: 11px; color: var(--app-text-muted); }
.wm-gantt__ray { position: relative; flex: 1; height: 16px; border-radius: 4px; background: var(--app-surface-alt); }
.wm-gantt__cubuk { position: absolute; top: 0; height: 16px; border-radius: 4px; opacity: .85; }
.wm-gantt__eksen { display: flex; justify-content: space-between; margin-left: 250px; padding-top: 6px; font-size: 11px; color: var(--app-text-muted); }
.wm-proje__baglar { grid-column: 1 / -1; margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; font-size: 12px; }
.wm-proje__baglar a, .wm-dg--liste a { color: var(--app-primary); text-decoration: none; }
.wm-proje__baglar a:hover, .wm-dg--liste a:hover { text-decoration: underline; }
.wm-proje__gunluk { padding: 8px 10px; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius); background: var(--app-surface); font-size: 12px; }
.wm-proje__gunluk-ust { display: flex; justify-content: space-between; gap: 8px; color: var(--app-text-primary); }
.wm-proje__gunluk-ust span { font-size: 11px; color: var(--app-text-muted); }
.wm-proje__gunluk-degisim { margin-top: 3px; font-size: 11px; font-style: italic; color: var(--app-text-muted); }
.wm-proje__gunluk-yorum { margin-top: 4px; white-space: pre-wrap; color: var(--app-text-body); }
/* Kampanya sihirbazı (KampanyaDetay) — çoklu seçim listeleri, değişken düğmeleri, önizleme, form içi tablo */
.wm-ckart__alan select.wm-kampanya__coklu { height: auto; min-height: 128px; padding: 4px; }
.wm-ckart__alan select.wm-kampanya__coklu--kisa { min-height: 92px; }
.wm-kampanya__degisken { height: 24px; padding: 0 8px; border: 1px solid var(--app-border); border-radius: 6px; background: var(--app-surface-alt);
  color: var(--app-text-body); font-family: var(--font-mono); font-size: 11px; cursor: pointer; }
.wm-kampanya__degisken:hover:not(:disabled) { border-color: var(--app-primary); color: var(--app-primary); }
.wm-kampanya__onizleme { grid-column: 1 / -1; width: 100%; height: 520px; border: 1px solid var(--app-border); border-radius: 10px; background: #fff; }
.wm-kampanya__sms { grid-column: 1 / -1; white-space: pre-wrap; padding: 12px; border: 1px dashed var(--app-border); border-radius: 10px;
  background: var(--app-surface-alt); font-size: 13px; color: var(--app-text-body); }
.wm-kampanya__kpi { grid-column: 1 / -1; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
.wm-kampanya__sayi { font-size: 18px; font-weight: 600; }
.wm-kampanya__tablo { grid-column: 1 / -1; display: flex; flex-direction: column; height: 420px; min-height: 0; }
.wm-kampanya__uzun { white-space: normal; align-items: flex-start; line-height: 1.45; }
.wm-kampanya__uzun input { margin-top: 2px; flex-shrink: 0; }
/* Yardım Masası yönetimi — ekip üyeleri onay listesi */
.wm-hd-uyeler { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 12px; max-height: 360px; overflow: auto;
  padding: 8px; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius); background: var(--app-surface-alt); }
.wm-hd-uyeler .wm-ckart__tek-kutu { min-width: 0; }
.wm-hd-uyeler .wm-durum { font-weight: 400; font-size: 11px; overflow: hidden; text-overflow: ellipsis; }
/* Yönetim (Admin) — lisans / güncelleme paneli, 2FA kurulum QR'ı, rol yetki matrisi */
.wm-admin__panel { overflow: auto; padding: 12px; gap: 12px; }
.wm-admin__kod { font-family: var(--font-mono); font-size: 11.5px; font-weight: 400; word-break: break-all; }
.wm-admin__alt-baslik { margin: 4px 0 0; font-size: 12px; font-weight: 600; color: var(--app-text-primary); }
.wm-admin__moduller { display: flex; flex-wrap: wrap; gap: 6px; }
.wm-admin__qr { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.wm-admin__qr img { width: 180px; height: 180px; border: 1px solid var(--app-border); border-radius: 8px; background: #fff; }
.wm-admin__qr code { flex: 1; min-width: 240px; padding: 8px 10px; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius); background: var(--app-surface-alt); }
.wm-admin__matris { min-width: 720px; }
.wm-admin__matris .wm-admin__matris-hucre { width: 84px; text-align: center; }
.wm-admin__matris td.wm-admin__matris-hucre input { width: 15px; height: 15px; cursor: pointer; }
.wm-admin__matris tbody tr:hover > td { background: color-mix(in srgb, var(--app-primary) 6%, transparent); }
.wm-admin__kolon { padding: 0; border: 0; background: none; font: inherit; font-weight: 500; color: inherit; cursor: pointer; }
.wm-admin__kolon:hover { color: var(--app-primary); text-decoration: underline; }
/* KVKK dosya kartı panelleri (Envanter / Değerlendirme / İhlal & Başvuru) — wmweb tokenlarıyla */
.wm-ckart__alan > .dxbl-tag-box { flex: 1 1 auto; min-width: 0; }
.wm-kvkk__liste { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 4px; max-height: 560px; overflow: auto; }
.wm-kvkk__oge { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius);
  background: var(--app-surface); text-align: left; font: inherit; font-size: 12px; color: var(--app-text-body); cursor: pointer; }
.wm-kvkk__oge:hover { border-color: var(--app-primary); }
.wm-kvkk__oge--secili { border-color: var(--app-primary); background: var(--app-primary-soft); box-shadow: inset 3px 0 0 var(--app-primary); }
.wm-kvkk__oge-ust { display: flex; justify-content: space-between; gap: 8px; color: var(--app-text-primary); }
.wm-kvkk__oge-alt { font-size: 11px; color: var(--app-text-muted); }
.wm-kvkk__cubuklar { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 6px 16px; font-size: 12px; }
.wm-kvkk__cubuk { display: flex; align-items: center; gap: 8px; }
.wm-kvkk__cubuk-ad { width: 120px; flex-shrink: 0; color: var(--app-text-body); }
.wm-kvkk__cubuk-ad small, .wm-kvkk__cubuk-deger small { color: var(--app-text-muted); }
.wm-kvkk__cubuk-ray { flex: 1; }
.wm-kvkk__cubuk-deger { width: 78px; text-align: right; font-variant-numeric: tabular-nums; }
.wm-kvkk__maddeler td { vertical-align: top; }
.wm-kvkk__alt > td:nth-child(1), .wm-kvkk__alt > td:nth-child(2) { padding-left: 22px !important; color: var(--app-text-body); }
.wm-kvkk__aciklama { margin-top: 2px; font-size: 11px; color: var(--app-text-muted); white-space: normal; }
.wm-kvkk__kaynak { margin-top: 1px; font-size: 10.5px; color: var(--app-text-muted); }
.wm-kvkk__secim { display: inline-flex; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius); overflow: hidden; }
.wm-kvkk__secim button { padding: 3px 9px; border: 0; border-right: 1px solid var(--app-border); background: var(--app-surface); color: var(--app-text-body); font: inherit; font-size: 11.5px; cursor: pointer; }
.wm-kvkk__secim button:last-child { border-right: 0; }
.wm-kvkk__secim button:hover:not(:disabled) { background: var(--app-primary-soft); }
.wm-kvkk__secim button:disabled { cursor: default; opacity: .75; }
.wm-kvkk__secim .wm-kvkk__secim--yok { background: var(--app-error-light, color-mix(in srgb, var(--app-error) 18%, var(--app-surface))); color: var(--app-error-text); font-weight: 600; }
.wm-kvkk__secim .wm-kvkk__secim--kismen { background: var(--app-warning-light); color: var(--app-warning-text); font-weight: 600; }
.wm-kvkk__secim .wm-kvkk__secim--tam { background: var(--app-success-light, color-mix(in srgb, var(--app-success) 18%, var(--app-surface))); color: var(--app-success-text); font-weight: 600; }
.wm-dg tr.wm-kvkk__bayrak > td { background: color-mix(in srgb, var(--app-error) 7%, transparent); }
.wm-kvkk__secimler { max-height: 180px; }
.wm-kvkk__surec { grid-column: 1 / -1; border: 1px solid var(--app-border); border-radius: 10px; background: var(--app-surface-alt); overflow: hidden; }
.wm-kvkk__surec > .wm-ckart__kart, .wm-kvkk__faaliyet > .wm-ckart__kart { margin: 8px 10px; }
.wm-kvkk__surec-head { display: flex; align-items: center; gap: 8px; padding: 8px 12px; font-size: 12.5px; }
.wm-kvkk__surec-head > .material-symbols-outlined { font-size: 18px; color: var(--app-primary); }
.wm-kvkk__surec-ad { font-weight: 600; color: var(--app-text-primary); }
.wm-kvkk__ayrac { color: var(--app-text-muted); }
.wm-kvkk__meta { font-size: 11.5px; color: var(--app-text-muted); }
.wm-kvkk__faaliyet { padding: 8px 12px 10px; border-top: 1px solid var(--app-border); background: var(--app-surface); }
.wm-kvkk__faaliyet-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12.5px; color: var(--app-text-primary); margin-bottom: 4px; }
.wm-kvkk__faaliyet-head > .material-symbols-outlined { font-size: 16px; color: var(--app-text-muted); }
.wm-kvkk__cipler span { display: inline-block; margin: 1px 3px 1px 0; padding: 0 7px; border: 1px solid var(--app-border); border-radius: 999px; background: var(--app-surface-alt);
  font-size: 11px; line-height: 18px; color: var(--app-text-body); white-space: nowrap; }
.wm-kvkk__cipler span.wm-kvkk__cip-bos { border-style: dashed; color: var(--app-text-muted); }
.wm-kvkk__cipler span.wm-kvkk__cip-hata { border-color: var(--app-error); color: var(--app-error-text); }
.wm-kvkk__cipler { white-space: normal !important; }
.wm-kvkk__tedbirler { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 4px 16px; font-size: 12px; }
.wm-kvkk__tur { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; margin-right: 2px; border-radius: 4px;
  background: var(--app-surface-alt); border: 1px solid var(--app-border); font-size: 10px; font-weight: 600; color: var(--app-text-muted); }
.wm-kvkk__tur--teknik { background: var(--app-primary-soft); border-color: var(--app-primary); color: var(--app-primary); }
/* Teklif formu — ürün kataloğu: arama + grup süzgeci + seviyeye göre gruplu kartlar */
.tkl-kat-arac { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tkl-kat-ara { flex: 0 1 300px; min-width: 200px; }
.tkl-kat-sekme { flex: 1 1 auto; min-width: 0; }
.tkl-kat-sayi { display: inline-flex; min-width: 18px; justify-content: center; margin-left: 2px; padding: 0 6px; border-radius: 999px;
  background: var(--app-surface-alt); border: 1px solid var(--app-border); font-size: 10.5px; font-weight: 500; color: var(--app-text-muted); }
.tkl-kat { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 12px; max-height: 440px; overflow: auto; padding-right: 2px; }
.tkl-kat-grup-bas { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; font-size: 12px; color: var(--app-text-primary); }
.tkl-kat-grup-bas > .material-symbols-outlined { font-size: 17px; color: var(--app-primary); }
.tkl-kat-grup-not { margin-left: 6px; font-size: 11px; color: var(--app-text-muted); }
.tkl-kat-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; }
.tkl-kart { position: relative; display: flex; flex-direction: column; gap: 4px; min-height: 76px; padding: 9px 10px 8px; text-align: left;
  border: 1px solid var(--app-border); border-radius: 10px; background: var(--app-surface); color: var(--app-text-body); font: inherit; cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.tkl-kart:hover { border-color: var(--app-primary); box-shadow: var(--app-shadow-sm); transform: translateY(-1px); }
.tkl-kart:focus-visible { outline: 2px solid var(--app-primary); outline-offset: 1px; }
.tkl-kart--secili { border-color: var(--app-primary); background: color-mix(in srgb, var(--app-primary) 6%, var(--app-surface)); box-shadow: inset 3px 0 0 var(--app-primary); }
.tkl-kart-ad { font-size: 12.5px; font-weight: 600; line-height: 1.3; color: var(--app-text-primary);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tkl-kart-alt { display: flex; align-items: center; gap: 6px; min-height: 16px; }
.tkl-kart-kod { font-family: var(--font-mono); font-size: 10.5px; color: var(--app-text-muted); }
.tkl-kart-ikon { font-size: 15px; color: var(--app-warning-text); }
.tkl-kart-fiyat { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: auto;
  font-size: 12.5px; font-weight: 600; color: var(--app-text-primary); font-variant-numeric: tabular-nums; }
.tkl-kart-ekle { font-size: 20px; color: var(--app-primary); opacity: .55; transition: opacity .15s ease; }
.tkl-kart:hover .tkl-kart-ekle { opacity: 1; }
.tkl-kart-adet { display: inline-flex; align-items: center; gap: 2px; padding: 1px 8px 1px 5px; border-radius: 999px; background: var(--app-primary);
  color: #fff; font-size: 11px; font-weight: 600; }
.tkl-kart-adet .material-symbols-outlined { font-size: 14px; }
.tkl-pctbar .wm-ckart__btn .material-symbols-outlined { font-size: 16px; }
/* Bağlantı (a) olarak yazılmış araç / form düğmeleri (ör. "Teklif ayarları", "Hızlı SMS") altı çizili görünmesin */
a.wm-stok__btn, a.wm-stok__btn:hover, a.wm-ckart__btn, a.wm-ckart__btn:hover { text-decoration: none; }

/* Tehlikeli işlem düğmesi (canlı veritabanı onarımı, kalıcı silme) — wmweb form düğmesinin hata tonu */
.wm-ckart__btn--tehlike { border-color: color-mix(in srgb, var(--app-error) 45%, var(--app-border)); background: var(--app-error-light); color: var(--app-error-text); }
.wm-ckart__btn--tehlike .material-symbols-outlined, .wm-ckart__btn--tehlike .wm-ckart__btn-yazi { color: var(--app-error-text); }
.wm-ckart__btn--tehlike:hover { border-color: var(--app-error); background: color-mix(in srgb, var(--app-error) 14%, var(--app-surface)); color: var(--app-error-text); }
.wm-ckart__not--hata { padding: 7px 10px; border-radius: var(--app-kontrol-radius); background: var(--app-error-light); color: var(--app-error-text);
  white-space: pre-wrap; font-family: var(--font-mono); font-size: 11.5px; }

/* ─── SQL Editörü (Pages/SqlEditor.razor) — WmForm kabuğunda nesne tarayıcı + çalışma paneli ───────────────
   Tablolar wmweb data-grid ölçüsünde (başlık 12px/500 muted, satır 11-12px, yalnız yatay çizgi), veri eş aralıklı. */
.wm-sql__icerik { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.wm-sql__satir { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.wm-sql__satir--arasi { justify-content: space-between; }
.wm-sql__baslik { margin-top: 4px; font-size: 10px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--app-text-muted); }
.wm-sql__satir--arasi .wm-sql__baslik { margin-top: 0; }
.wm-sql__kucuk { font-size: 11px; color: var(--app-text-muted); }
label.wm-sql__kucuk { min-height: 0; }
.wm-sql__bos { margin: 0; padding: 10px; font-size: 12px; color: var(--app-text-muted); }
.wm-sql__madde { grid-column: 1 / -1; margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px;
  font-size: 12px; line-height: 1.45; color: var(--app-text-body); }
.wm-sql__madde b { font-weight: 500; color: var(--app-text-primary); }
/* Nesne tarayıcı listeleri */
.wm-sql__liste { max-height: 220px; overflow: auto; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius); background: var(--app-surface); }
.wm-sql__liste--uzun { max-height: 46vh; }
.wm-sql__oge { display: block; width: 100%; padding: 6px 10px; border: 0; border-bottom: 1px solid var(--app-border); background: transparent;
  color: var(--app-text-body); font-size: 12px; line-height: 1.35; text-align: left; cursor: pointer; }
.wm-sql__oge:last-child { border-bottom: 0; }
.wm-sql__oge:hover { background: color-mix(in srgb, var(--app-primary) 9%, var(--app-surface)); }
.wm-sql__oge--aktif, .wm-sql__oge--aktif:hover { background: var(--app-primary-soft); box-shadow: inset 3px 0 0 var(--app-primary); color: var(--app-text-primary); }
.wm-sql__oge b { font-weight: 500; word-break: break-all; }
.wm-sql__oge small { display: block; margin-top: 1px; font-size: 10.5px; color: var(--app-text-muted); word-break: break-all; }
.wm-sql__tur { display: inline-block; margin-right: 6px; padding: 0 5px; border: 1px solid var(--app-border); border-radius: 4px;
  background: var(--app-surface-alt); color: var(--app-text-muted); font-size: 9.5px; line-height: 15px; text-transform: uppercase; vertical-align: 1px; }
.wm-sql__tur--master { border-color: color-mix(in srgb, var(--app-primary) 35%, var(--app-border)); background: var(--app-primary-soft); color: var(--app-primary); }
.wm-sql__tur--sistem { border-color: color-mix(in srgb, var(--app-warning) 45%, var(--app-border)); background: var(--app-warning-light); color: var(--app-warning-text); }
.wm-sql__turler { display: flex; flex-wrap: wrap; gap: 4px; }
.wm-sql__turler .wm-stok__btn { height: 26px; padding: 0 8px; font-size: 11px; }
/* Özet satırı (nesne / teşhis / sonuç bilgisi) */
.wm-sql__ozet { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: 12px; color: var(--app-text-muted); }
.wm-sql__ozet b { font-weight: 500; color: var(--app-text-primary); }
/* Tablolar */
.wm-sql__tablo-kutu { max-height: 52vh; overflow: auto; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius); background: var(--app-surface); }
.wm-sql__tablo-kutu--kisa { max-height: 26vh; }
.wm-sql__tablo { width: 100%; border-collapse: collapse; font-size: 11.5px; color: var(--app-text-body); }
.wm-sql__tablo th { position: sticky; top: 0; z-index: 1; height: 32px; padding: 0 10px; border-bottom: 1px solid var(--app-border);
  background: var(--app-surface-alt); color: var(--app-text-muted); font-size: 12px; font-weight: 500; text-align: left; white-space: nowrap; }
.wm-sql__tablo td { max-width: 420px; padding: 6px 10px; border-bottom: 1px solid var(--app-border); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wm-sql__tablo tbody tr:last-child td { border-bottom: 0; }
.wm-sql__tablo tbody tr:hover td { background: color-mix(in srgb, var(--app-primary) 6%, var(--app-surface)); }
.wm-sql__tablo b { font-weight: 500; color: var(--app-text-primary); }
.wm-sql__tablo .wm-durum { margin-left: 6px; font-size: 10.5px; }
.wm-sql__tablo td:first-child .wm-durum:first-child { margin-left: 0; }
.wm-sql__tablo--veri td { font-family: var(--font-mono); font-size: 11px; }
.wm-sql__tablo--anahtar th { position: static; height: auto; padding: 6px 10px; border-right: 1px solid var(--app-border); }
.wm-sql__sar { white-space: normal !important; min-width: 16rem; }
.wm-sql__null { color: var(--app-text-muted); font-style: italic; }
/* DDL / script / adım günlüğü — tema yüzeyinde eş aralıklı kod */
.wm-sql__kod { margin: 0; max-height: 56vh; overflow: auto; padding: 10px 12px; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius);
  background: var(--app-surface-alt); color: var(--app-text-body); font-family: var(--font-mono); font-size: 11.5px; line-height: 1.55; white-space: pre; }
.wm-sql__kod--kisa { max-height: 34vh; }
/* Sorgu alanı — wmweb form girdisi görünümü, eş aralıklı */
.wm-sql__sorgu { width: 100%; min-height: 140px; box-sizing: border-box; padding: 8px 10px; border: 1px solid var(--app-border); border-radius: var(--app-kontrol-radius);
  background: var(--app-surface); color: var(--app-text-body); font-family: var(--font-mono); font-size: 12px; line-height: 1.5; resize: vertical; }
.wm-sql__sorgu:focus { border-color: var(--app-primary); outline: none; box-shadow: var(--app-shadow-focus); }
/* Dışa aktarım paneli */
.wm-sql__disa { display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1px dashed var(--app-border); border-radius: 10px; background: var(--app-surface-alt); }
/* Form başlığı nötr durum rozeti (WmForm DurumSinif) — bağlı değil / beklemede */
.wm-ckart__rozet--notr { background: var(--app-surface-alt); color: var(--app-text-muted); box-shadow: inset 0 0 0 1px var(--app-border); }