/*
 * Alfion STS Web — uygulama stili (#41: tamamen yeni, modern görünüm; WPF taklit edilmez, yalnız STS renkleri + logosu).
 * DevExtreme bileşenlerinin teması ayrı: libs/devextreme/css/dx.sts.light.css (Fluent SaaS tabanı, Theme\sts-theme.json).
 * Simgeler: icons/sprite.svg (Lucide, ISC) — Html.Icon / Sts.icon. Hedef çözünürlük 1600 ve 1920 genişlik (1366 ve 2464'te de
 * bozulmaz). Sayfaya özgü kurallar dosyanın sonunda, ekran adıyla.
 */
:root {
    --brand: #F5941C;
    --brand-600: #E3830B;
    --brand-700: #B8640A;
    --brand-50: #FFF6EB;
    --brand-100: #FDEBD3;
    --brand-200: #FBD7A8;
    --navy: #002B47;
    --navy-700: #0B3B5E;
    --navy-500: #1D5A86;
    --navy-50: #EAF1F6;

    --bg: #F3F5F8;
    --surface: #FFFFFF;
    --surface-2: #F8FAFC;
    --line: #E4E8EE;
    --line-strong: #D2D9E2;
    --text: #0F172A;
    --text-2: #334155;
    --muted: #64748B;
    --faint: #94A3B8;

    --ok: #19914B; --ok-50: #E7F6EE; --ok-700: #116337;
    --warn: #B36B00; --warn-50: #FFF4DE; --warn-700: #7A4A00; --warn-500: #DB8B00;
    --bad: #DC2828; --bad-50: #FDECEC; --bad-700: #9B1C1C;
    --info: #2563EB; --info-50: #EAF1FE;

    --radius-lg: 14px;
    --radius: 10px;
    --radius-sm: 7px;
    --shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);
    --shadow: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
    --shadow-lg: 0 16px 40px rgba(16, 24, 40, .16), 0 2px 6px rgba(16, 24, 40, .06);
    --focus-ring: 0 0 0 3px rgba(245, 148, 28, .28);

    --sidebar-w: 264px;
    --sidebar-w-collapsed: 72px;
    --topbar-h: 60px;
    --content-pad: 24px;
    --font: 'Segoe UI Variable Text', 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
    --font-mono: 'Cascadia Mono', Consolas, ui-monospace, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; font-family: var(--font); font-size: 14px; line-height: 1.45; color: var(--text); background: var(--bg); -webkit-font-smoothing: antialiased; }
a { color: var(--navy-500); }
[hidden] { display: none !important; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.icon { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; }
kbd {
    display: inline-flex; align-items: center; padding: 1px 6px; border: 1px solid var(--line-strong); border-bottom-width: 2px;
    border-radius: 5px; background: var(--surface); font-family: var(--font); font-size: 11px; font-weight: 600; color: var(--muted);
}

/* ---------------------------------------------------------------- düğmeler (DevExtreme dışı sayfalar: giriş, hata) */
.button {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 40px; padding: 8px 18px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
    background: var(--surface); color: var(--text); font: inherit; font-weight: 600; text-decoration: none; cursor: pointer;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.button:hover { background: var(--surface-2); border-color: var(--faint); }
.button:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.button-primary { background: var(--brand); border-color: var(--brand); color: #fff; }
.button-primary:hover { background: var(--brand-600); border-color: var(--brand-600); }

.icon-button {
    display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; flex: none;
    border: 0; border-radius: var(--radius-sm); background: none; color: var(--text-2); cursor: pointer;
}
.icon-button .icon { width: 20px; height: 20px; }
.icon-button:hover { background: var(--surface-2); color: var(--text); }
.icon-button:focus-visible { outline: none; box-shadow: var(--focus-ring); }

/* ---------------------------------------------------------------- uyarı kutuları */
.notice { display: flex; gap: 10px; margin: 0 0 16px; padding: 10px 14px; border: 1px solid transparent; border-radius: var(--radius-sm); text-align: left; }
.notice-error { background: var(--bad-50); border-color: #F7C9C9; color: var(--bad-700); }
.notice-info { background: var(--brand-50); border-color: var(--brand-200); color: var(--brand-700); }
/* Yetkiler (#15): son AD eşitlemesi + durdurulan toplu pasife almanın onay şeridi. */
.ad-sync-hold { align-items: flex-start; justify-content: space-between; gap: 16px; }
.ad-sync-body { min-width: 0; }
.ad-sync-reason { margin: 4px 0 0; }
.ad-sync-names { margin: 8px 0 0; max-height: 96px; overflow: auto; color: var(--text-2); font-size: 13px; overflow-wrap: anywhere; }
.ad-sync-actions { display: flex; gap: 8px; flex: none; }
.ad-sync-last { margin: 0 0 12px; }
/* Kullanıcılar (#16): kullanıcı kartı penceresi — kartı basılan kişi. */
.user-card-dialog .user-card-name { margin: 0 0 14px; font-weight: 600; color: var(--text); }

/* ---------------------------------------------------------------- oturumsuz sayfalar (giriş, terminal listesi, hata) */
/* Ekranın ortasında tek kart; logo + ad kartın başında (_AuthBrand). Zemin düz (sahibi: sade giriş ekranı). */
.sts-auth { background: var(--bg); }
.auth { min-height: 100vh; display: grid; place-items: center; padding: 32px 16px; }
.auth-logo { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 22px; }
.auth-logo img { width: 60px; height: 60px; }
.auth-logo-name { font-size: 24px; font-weight: 700; letter-spacing: .01em; color: var(--navy); }
.auth-logo-name span { color: var(--brand); }
.auth-card {
    width: 100%; max-width: 420px; padding: 32px 32px 18px;
    background: var(--surface); border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow-lg);
}
.auth-card-head { text-align: center; }
.auth-card-wide { max-width: 640px; }
.auth-card-head { margin-bottom: 22px; }
.auth-eyebrow { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; background: var(--brand-50); color: var(--brand-700); font-size: 12px; font-weight: 600; }
.auth-eyebrow .icon { width: 14px; height: 14px; }
.auth-terminal-name, .auth-title { margin: 10px 0 2px; font-size: 26px; line-height: 1.2; font-weight: 700; color: var(--text); }
.auth-hospital { color: var(--muted); font-size: 14px; }
.auth-text { color: var(--muted); margin: 6px 0 18px; }
.auth-form { text-align: left; display: grid; gap: 14px; }
.auth-form .button { width: 100%; margin-top: 6px; min-height: 44px; font-size: 15px; }
.auth-hint { display: flex; align-items: center; gap: 8px; margin: 16px 0 0; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--surface-2); color: var(--muted); font-size: 13px; }
.auth-hint .icon { color: var(--brand-600); }
.auth-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 24px; padding-top: 14px; border-top: 1px solid var(--line); }
.auth-version { color: var(--faint); font-size: 12px; }
.auth-logo-small { display: none; }

.field { display: grid; gap: 6px; }
.field label { font-weight: 600; font-size: 13px; color: var(--text-2); }
.field-control { position: relative; }
.field-control .icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--faint); pointer-events: none; }
.field input {
    width: 100%; height: 44px; padding: 8px 12px 8px 40px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
    font: inherit; font-size: 15px; color: var(--text); background: var(--surface); transition: border-color .15s, box-shadow .15s;
}
.field input:hover { border-color: var(--faint); }
.field input:focus { outline: none; border-color: var(--brand); box-shadow: var(--focus-ring); }
.field input.masked { -webkit-text-security: disc; }
.field-hint { color: var(--faint); font-size: 12px; }

.language-form { margin: 0; }
.language-label { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.language-label select {
    font: inherit; font-size: 13px; padding: 4px 8px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--text);
}

.terminal-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; text-align: left; }
.terminal-link {
    display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius);
    background: var(--surface); text-decoration: none; color: var(--text); transition: border-color .15s, box-shadow .15s, background .15s;
}
.terminal-link:hover, .terminal-link:focus-visible { border-color: var(--brand); background: var(--brand-50); box-shadow: var(--shadow); outline: none; }
.terminal-link .icon { width: 20px; height: 20px; color: var(--brand-600); }
.terminal-text { display: grid; gap: 2px; min-width: 0; }
.terminal-name { font-weight: 600; font-size: 15px; color: var(--text); }
.terminal-url { font-family: var(--font-mono); font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; }

/* ---------------------------------------------------------------- uygulama kabuğu */
.app { display: grid; grid-template-columns: var(--sidebar-w) minmax(0, 1fr); height: 100vh; transition: grid-template-columns .2s ease; }
.sidebar-collapsed .app { grid-template-columns: var(--sidebar-w-collapsed) minmax(0, 1fr); }

.sidebar { display: flex; flex-direction: column; min-height: 0; background: var(--surface); border-right: 1px solid var(--line); }
.sidebar-brand { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; height: var(--topbar-h); padding: 0 10px 0 16px; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; text-decoration: none; color: var(--text); }
.brand-mark { display: block; width: 34px; height: 34px; flex: none; }
.brand-text { font-size: 18px; font-weight: 700; letter-spacing: .01em; white-space: nowrap; color: var(--navy); }
.brand-product { color: var(--brand); }

.nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 10px 0 16px; scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
.nav-section { margin-top: 14px; }
.nav-section-title { padding: 0 22px 6px; font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); white-space: nowrap; }
.nav-link {
    position: relative; display: flex; align-items: center; gap: 12px; width: calc(100% - 20px); min-height: 38px; margin: 1px 10px; padding: 7px 12px;
    border: 0; border-radius: 8px; background: none; color: var(--text-2); font: inherit; font-weight: 500; text-align: left; text-decoration: none; cursor: pointer;
    transition: background .12s, color .12s;
}
.nav-link:hover { background: var(--surface-2); color: var(--text); }
.nav-link:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.nav-icon { width: 19px; height: 19px; color: var(--muted); }
.nav-link:hover .nav-icon { color: var(--text-2); }
.nav-text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-caret { width: 16px; height: 16px; color: var(--faint); transition: transform .15s; }
.nav-group.is-open > .nav-toggle .nav-caret { transform: rotate(90deg); }
.nav-sub { display: none; padding: 2px 0 4px; }
.nav-group.is-open > .nav-sub { display: block; }
.nav-link.level-2, .nav-link.level-3 { min-height: 32px; padding: 5px 12px 5px 43px; font-size: 13.5px; }
.nav-link.level-3 { padding-left: 55px; }
.nav-sub .nav-toggle.level-2 { font-weight: 600; color: var(--text-2); }
.nav-link.is-active { background: var(--brand-50); color: var(--brand-700); font-weight: 600; }
.nav-link.is-active .nav-icon { color: var(--brand-600); }
.nav-link.level-1.is-active::before {
    content: ""; position: absolute; left: -10px; top: 7px; bottom: 7px; width: 3px; border-radius: 0 3px 3px 0; background: var(--brand);
}
.nav-link.level-2.is-active::before, .nav-link.level-3.is-active::before {
    content: ""; position: absolute; left: 26px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--brand);
}
.nav-link.level-3.is-active::before { left: 38px; }
.nav-link.not-ported { color: var(--faint); }
.nav-link.not-ported .nav-icon { color: #C2C9D2; }

.sidebar-foot { flex: none; padding: 10px 22px; border-top: 1px solid var(--line); font-size: 11px; color: var(--faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Daraltılmış menü: yalnız simgeler (başlıklar, alt öğeler ve yazılar gizli; simgenin üzerine gelince adı görünür). */
.sidebar-collapsed .sidebar-brand { padding: 0; justify-content: center; }
.sidebar-collapsed .brand { display: none; }
.sidebar-collapsed .nav-section { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.sidebar-collapsed .nav-section-title,
.sidebar-collapsed .nav-text,
.sidebar-collapsed .nav-caret,
.sidebar-collapsed .nav-sub { display: none !important; }
.sidebar-collapsed .nav-link { justify-content: center; width: calc(100% - 16px); margin: 1px 8px; padding: 9px 0; }
.sidebar-collapsed .nav-link.level-1.is-active::before { left: -8px; }
.sidebar-collapsed .nav-group:has(.nav-sub .is-active) > .nav-toggle { background: var(--brand-50); }
.sidebar-collapsed .nav-group:has(.nav-sub .is-active) > .nav-toggle .nav-icon { color: var(--brand-600); }
.sidebar-collapsed .sidebar-foot { display: none; }

.main { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.topbar {
    flex: none; position: relative; z-index: 5; display: flex; align-items: center; gap: 6px;
    height: var(--topbar-h); padding: 0 16px 0 10px; background: rgba(255, 255, 255, .92); border-bottom: 1px solid var(--line);
    backdrop-filter: saturate(1.4) blur(8px);
}
.menu-toggle { display: none; }
.breadcrumb { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px; margin-left: 4px; overflow: hidden; white-space: nowrap; font-size: 13.5px; color: var(--muted); }
.breadcrumb a { color: var(--muted); text-decoration: none; }
.breadcrumb a:hover { color: var(--text); text-decoration: underline; }
.crumb-sep { color: var(--line-strong); }
.crumb { overflow: hidden; text-overflow: ellipsis; }
.crumb-current { color: var(--text); font-weight: 600; }
.search-trigger {
    display: inline-flex; align-items: center; gap: 10px; width: 260px; height: 36px; padding: 0 8px 0 12px; flex: none;
    border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); color: var(--muted); font: inherit; cursor: pointer;
}
.search-trigger:hover { border-color: var(--line-strong); background: var(--surface); }
.search-trigger:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.search-trigger-text { flex: 1 1 auto; text-align: left; }
.terminal-chip {
    display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; margin-left: 6px; flex: none;
    border-radius: 999px; background: var(--brand-50); color: var(--brand-700); font-weight: 600; font-size: 13px; white-space: nowrap;
}
.terminal-chip .icon { width: 16px; height: 16px; }
.user-button {
    display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 8px 0 4px; margin-left: 4px; flex: none;
    border: 0; border-radius: 999px; background: none; color: var(--text); font: inherit; cursor: pointer;
}
.user-button:hover { background: var(--surface-2); }
.user-button:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.avatar {
    display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%;
    background: var(--navy); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .03em;
}
.user-name { font-weight: 600; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-caret { width: 16px; height: 16px; color: var(--muted); }

.content { flex: 1 1 auto; min-height: 0; overflow: auto; padding: var(--content-pad); }
/* Başlık şeridi (Smog'un kompakt başlığı): içeriğin üstüne yapışan beyaz şerit — solda simge + başlık + kayıt sayısı, sağda
   sayfanın araç çubuğu (Sts.pageToolbar: arama, Excel, yazdır, yenile, en sağda "Yeni"). */
.page-header {
    position: sticky; top: calc(-1 * var(--content-pad)); z-index: 6;
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    min-height: 60px; margin: calc(-1 * var(--content-pad)) calc(-1 * var(--content-pad)) 18px; padding: 10px var(--content-pad);
    background: var(--surface); border-bottom: 1px solid var(--line); box-shadow: 0 1px 3px rgba(16, 24, 40, .05);
}
.page-heading { display: flex; align-items: center; gap: 10px; min-width: 0; flex: none; }
.page-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; background: var(--brand-50); color: var(--brand-600); flex: none; }
.page-icon .icon { width: 19px; height: 19px; }
.page-title { margin: 0; font-size: 19px; line-height: 1.25; font-weight: 700; color: var(--text); letter-spacing: -.01em; white-space: nowrap; }
.page-count { padding: 1px 9px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--text-2); font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.page-count:empty { display: none; }
.page-actions { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.page-actions:empty { display: none; }
.page-actions > div { width: 100%; }
.page-actions .dx-toolbar { background: transparent; }
.page-header-home { display: none; }

/* ---------------------------------------------------------------- kartlar ve ortak parçalar */
.card, .panel { min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.panel { padding: 16px 20px 20px; }
.card-head, .panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; margin-bottom: 12px; }
.card-head { margin: 0; padding: 14px 20px; border-bottom: 1px solid var(--line); }
.card-body { padding: 16px 20px 20px; }
.card-title, .panel-head h2 { margin: 0; font-size: 16px; font-weight: 600; color: var(--text); }
.card-subtitle { margin: 2px 0 0; color: var(--muted); font-size: 13px; }
.panel-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.panel-hint { margin: 0 0 12px; color: var(--muted); }
/* Uzun panelde düğme şeridi görünür alanın altına yapışır (1366x768'de Kaydet kaydırmadan erişilir). bottom = .content'in iç
   boşluğu — yoksa şeridin altında kayan satırlar görünür. */
.panel-foot {
    position: sticky; bottom: calc(-1 * var(--content-pad)); z-index: 2; justify-content: flex-end;
    margin: 16px -20px -20px; padding: 12px 20px; background: var(--surface); border-top: 1px solid var(--line);
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}
.panel-foot:empty { display: none; }
.page-fill { height: 100%; display: flex; flex-direction: column; }
.grid-fill { flex: 1 1 auto; min-height: 280px; }
.status-chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; }
.status-danger { background: var(--bad-50); color: var(--bad-700); }
.status-warning { background: var(--warn-50); color: var(--warn-700); }
.status-ok { background: var(--ok-50); color: var(--ok-700); }
/* Liste üstü süzgeç şeridi (rapor / geçmiş ekranları): dar ekranda alt satıra kayar. */
.filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; padding: 0 0 14px; }
.filter-field { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 600; color: var(--text-2); white-space: nowrap; }
.section-title { margin: 28px 0 12px; font-size: 16px; font-weight: 600; }
/* Sts.printGrid'in yazdırma çerçevesi: sıfır boyutlu (display:none / visibility:hidden çerçeveyi bazı tarayıcılar boş basar). */
.print-frame { position: fixed; right: 0; bottom: 0; width: 0; height: 0; border: 0; }

/* ---------------------------------------------------------------- pano (anasayfa) — karşılama şeridi + gridstack kartları
   Kart = .widget (başlık şeridi + gövde); özet kartı .widget-kpi. Düzenleme kipinde (.is-editing) kartlar kesik çizgili, başlıktan
   sürüklenir, sağ alt köşeden boyutlanır, gizle düğmesi görünür. gridstack'in 8 px kenar boşluğu ızgaranın kenarında geri alınır. */
.dashboard { display: grid; gap: 16px; }
.hero {
    position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 24px;
    border-radius: var(--radius-lg); color: #fff;
    background:
        radial-gradient(circle at 96% 0%, rgba(29, 90, 134, .75) 0, rgba(29, 90, 134, 0) 50%),
        linear-gradient(120deg, var(--navy) 0%, #0B4268 100%);
    box-shadow: var(--shadow);
}
.hero > * { position: relative; z-index: 1; }
.hero-greeting { margin: 0; font-size: 22px; font-weight: 700; }
.hero-sub { margin: 4px 0 0; color: rgba(255, 255, 255, .78); }
.hero-facts { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; }
.hero-fact { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .16); font-weight: 600; }
.hero-fact .icon { width: 16px; height: 16px; color: var(--brand); }
.hero-actions { display: flex; gap: 8px; }
.hero-actions:empty { display: none; }
.hero .dx-button.hero-button { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3); color: #fff; }
.hero .dx-button.hero-button .dx-icon { color: #fff; }
.hero .dx-button.hero-button.dx-state-hover { background: rgba(255, 255, 255, .22); }

.dashboard-editbar {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding: 12px 16px;
    border: 1px solid var(--brand-200); border-radius: var(--radius-lg); background: var(--brand-50);
}
.dashboard-editbar-text { display: grid; gap: 2px; color: var(--brand-700); }
.dashboard-editbar-text strong { font-size: 14.5px; }
.dashboard-editbar-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.dashboard-editbar-actions:empty { display: none; }

.dashboard-grid { margin: -8px; }
.dashboard-grid.grid-stack { min-height: 120px; }
.widget {
    position: relative; height: 100%; display: flex; flex-direction: column; min-height: 0; overflow: hidden;
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm);
}
.widget-head { flex: none; display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 10px 12px 10px 16px; border-bottom: 1px solid var(--line); }
.widget-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--brand-50); color: var(--brand-600); flex: none; }
.widget-icon .icon { width: 17px; height: 17px; }
.widget-titles { flex: 1 1 auto; min-width: 0; }
.widget-title { margin: 0; font-size: 14.5px; font-weight: 600; line-height: 1.3; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.widget-note { margin: 1px 0 0; font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.widget-count { flex: none; padding: 1px 9px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); color: var(--text-2); font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.widget-count:empty { display: none; }
.widget-link { flex: none; font-size: 13px; white-space: nowrap; }
.widget-body { position: relative; flex: 1 1 auto; min-height: 0; }
.widget-plot { position: absolute; inset: 10px 14px 12px; }
.widget-grid-host { position: absolute; inset: 0; }
.widget-scroll { position: absolute; inset: 0; overflow-y: auto; padding: 4px 16px 10px; }
.widget-message { margin: 0; padding: 22px 16px; color: var(--muted); text-align: center; }
.widget-message.is-error { color: var(--bad-700); }
.widget.is-loading .widget-body::before,
.widget-kpi.is-loading .kpi-value { opacity: .35; }
.widget.is-loading .widget-body::before {
    content: ""; position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%;
    border: 3px solid var(--brand-100); border-top-color: var(--brand); animation: sts-spin .8s linear infinite;
}
@keyframes sts-spin { to { transform: rotate(360deg); } }
/* Kartın tablosu: sıkı satır, başlık zeminsiz; uyarı satırı (Bowie-Dick) kırmızı. */
.widget .widget-grid { font-size: 13.5px; }
.widget .widget-grid .dx-datagrid-headers { background: transparent; }
.widget .widget-grid .dx-datagrid-headers .dx-header-row > td { padding-top: 8px; padding-bottom: 8px; }
/* Dar kartta uzun kolon başlığı ("Tamamlandı", "İptal Edildi") kesilmek yerine sözcük sınırında iki satıra iner. */
.widget .widget-grid .dx-datagrid-headers .dx-header-row > td .dx-datagrid-text-content { white-space: normal; overflow-wrap: normal; text-overflow: clip; }
.widget .widget-grid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td { padding-top: 7px; padding-bottom: 7px; }
.widget .widget-grid .dx-datagrid-rowsview .dx-row.row-alert > td { background: var(--bad-50); }
.widget .widget-grid td.cell-strong { font-weight: 700; }
.widget .widget-grid .status-chip { padding: 1px 8px; font-size: 12px; }
/* Özet kartı */
.widget-kpi { flex-direction: row; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 18px; }
.kpi-text { min-width: 0; }
.kpi-label { margin: 0; color: var(--muted); font-weight: 600; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi-value { margin: 6px 0 2px; font-size: 30px; line-height: 1.1; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.kpi-note { margin: 0; color: var(--muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi-icon { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--brand-50); color: var(--brand-600); }
.kpi-icon .icon { width: 22px; height: 22px; }
.kpi-icon.navy { background: var(--navy-50); color: var(--navy-500); }
.kpi-icon.ok { background: var(--ok-50); color: var(--ok); }
.kpi-icon.bad { background: var(--bad-50); color: var(--bad); }
/* Düzenleme kipi */
.widget-hide { display: none; flex: none; width: 30px; height: 30px; color: var(--muted); }
.widget-hide .icon { width: 17px; height: 17px; }
.dashboard-grid.is-editing .widget-hide { display: inline-flex; }
.dashboard-grid.is-editing .widget-kpi .widget-hide { position: absolute; top: 6px; right: 6px; background: var(--surface); }
.dashboard-grid.is-editing .widget { border: 1px dashed var(--brand); box-shadow: none; }
.dashboard-grid.is-editing .widget-drag { cursor: move; }
.dashboard-grid.is-editing .widget-head { background: var(--brand-50); }
.dashboard-grid .grid-stack-placeholder > .placeholder-content { border: 2px dashed var(--brand); border-radius: var(--radius-lg); background: rgba(245, 148, 28, .08); }
.add-card-list { display: grid; gap: 8px; }
.add-card-row { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius); }
.add-card-title { flex: 1 1 auto; min-width: 0; font-weight: 600; color: var(--text); }
/* Kısayollar ve son değişiklikler kartları */
.shortcut-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; align-content: start; padding-top: 12px; }
.shortcut {
    display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius);
    background: var(--surface); color: var(--text); text-decoration: none; transition: border-color .15s, box-shadow .15s;
}
.shortcut:hover, .shortcut:focus-visible { border-color: var(--brand-200); box-shadow: var(--shadow); outline: none; }
.shortcut-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--brand-50); color: var(--brand-600); flex: none; }
.shortcut-text { display: grid; min-width: 0; }
.shortcut-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shortcut-path { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.activity { list-style: none; margin: 0; }
.activity li { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--line); }
.activity li:last-child { border-bottom: 0; }
.activity-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--surface-2); color: var(--text-2); }
.activity-icon .icon { width: 16px; height: 16px; }
.activity-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.activity-meta { font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.activity-time { font-size: 12px; color: var(--faint); white-space: nowrap; }
.empty-note { margin: 0; padding: 18px 0; color: var(--muted); text-align: center; }

/* ---------------------------------------------------------------- bilgi / hata sayfaları */
.page-message { max-width: 560px; margin: 8vh auto 0; padding: 32px; text-align: center; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.page-message-icon { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: var(--brand-50); color: var(--brand-600); }
.page-message-icon .icon { width: 28px; height: 28px; }
.page-message-code { font-size: 46px; font-weight: 700; color: var(--brand); line-height: 1; }
.page-message-title { margin: 16px 0 8px; font-size: 20px; color: var(--text); }
.page-message-text { margin: 0 0 20px; color: var(--muted); }

/* ---------------------------------------------------------------- DevExtreme uyarlamaları */
.dx-button-mode-contained.dx-button-default .dx-button-text { font-weight: 600; }
/* Tablo kartı (Sts.grid → sts-grid): beyaz zemin, ince çerçeve, yuvarlak köşe; araç çubuğu kartın üstünde. Panel içindeki tablo
   gölgesiz ve daha küçük köşeli. */
.sts-grid { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); overflow: hidden; }
.sts-grid .dx-datagrid { background: var(--surface); }
.sts-grid .dx-datagrid-header-panel { padding: 12px 16px 10px; border-bottom: 1px solid var(--line); }
.sts-grid .dx-datagrid-header-panel .dx-toolbar { margin-bottom: 0; background: transparent; }
.panel .sts-grid, .sts-dialog .sts-grid { border-radius: var(--radius); box-shadow: none; }
.dx-datagrid { font-size: 14px; }
/* Okunurluk (sahibi: Smog'daki gibi): veri koyu ve dolgun, başlık / etiket silik ve küçük. Girdi değerleri yarı kalın (18.10.2026:
   "az daha koyulaşsın"). */
.dx-datagrid-headers .dx-header-row > td { font-weight: 600; font-size: 13px; color: var(--muted); }
.dx-datagrid .dx-datagrid-rowsview .dx-row.dx-data-row > td { color: var(--text); font-weight: 500; }
.dx-field-item-label-text, .dx-field-item-label .dx-field-item-label-content { color: var(--muted); font-weight: 500; font-size: 13px; }
.dx-texteditor .dx-texteditor-input { color: var(--text); font-weight: 600; }
.dx-texteditor .dx-placeholder::before { color: var(--faint); font-weight: 400; }
/* Süzgeç satırı: her kolonda belirgin bir arama kutusu (beyaz zemin, ince çerçeve) ve içinde büyüteç — işlem seçici ("ABC") kapalı
   (Sts.grid → showOperationChooser: false). Fluent teması kutuyu çerçevesiz çizdiğinden satır boş görünüyordu. */
.dx-datagrid .dx-datagrid-filter-row > td.dx-editor-cell { padding: 6px 8px !important; }
/* Tema hücre düzenleyicisinin çerçevesini (0,5,0) ve 48 px yüksekliğini (0,4,0) sıfırlar → bu seçiciler ondan güçlü olmalı. */
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row.dx-datagrid-filter-row > td.dx-editor-cell .dx-texteditor {
    background: var(--surface); border: 1px solid var(--line-strong); border-radius: 6px; box-shadow: none;
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row.dx-datagrid-filter-row > td.dx-editor-cell .dx-texteditor.dx-state-hover { border-color: var(--faint); }
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row.dx-datagrid-filter-row > td.dx-editor-cell .dx-texteditor.dx-state-focused { border-color: var(--brand); box-shadow: var(--focus-ring); }
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row.dx-datagrid-filter-row > td.dx-editor-cell .dx-texteditor:not(.dx-tagbox) .dx-texteditor-input {
    height: 30px; min-height: 30px; line-height: 30px;
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row.dx-datagrid-filter-row > td.dx-editor-cell .dx-textbox:not(.dx-dropdowneditor) .dx-texteditor-input,
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row.dx-datagrid-filter-row > td.dx-editor-cell .dx-numberbox .dx-texteditor-input {
    padding-left: 30px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 21-4.34-4.34'/%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: 9px center; background-size: 14px 14px;
}
/* Açılır süzgeç (evet / hayır, liste): büyüteçsiz, dar iç boşluk → "(Tümü)" 90 px'lik kolona sığar. */
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row.dx-datagrid-filter-row > td.dx-editor-cell .dx-dropdowneditor .dx-texteditor-input {
    padding-left: 8px; padding-right: 0; font-size: 13px; font-weight: 500;
}
.dx-datagrid .dx-datagrid-content .dx-datagrid-table .dx-row.dx-datagrid-filter-row > td.dx-editor-cell .dx-dropdowneditor .dx-dropdowneditor-button { width: 24px; min-width: 24px; }
/* Form içindeki normal düğmeler zeminle ayırt edilsin (Fluent'ta beyaz düğme beyaz formda kayboluyordu). */
.dx-button-mode-contained.dx-button-normal { background-color: #EEF2F6; border: 1px solid #D5DCE4; color: var(--text); box-shadow: none; }
.dx-button-mode-contained.dx-button-normal.dx-state-hover { background-color: #E2E8F0; border-color: #C8D1DC; }
.dx-button-mode-contained.dx-button-normal .dx-icon { color: var(--text-2); }
/* ---------------------------------------------------------------- formlar (Smog: etiket alanın ÜSTÜNDE, küçük ve silik; değer koyu)
   Başlıklı grup (itemType 'group' + caption) karttır: açık gri başlık şeridi + beyaz gövde (Smog card-header). */
.dx-form .dx-field-item-label-location-top { padding-bottom: 5px; }
.dx-form .dx-field-item-label-location-top .dx-field-item-label-text { font-size: 12.5px; font-weight: 500; color: var(--muted); }
.dx-form .dx-field-item-required-mark { color: var(--bad); }
.dx-form .dx-checkbox-text { color: var(--text); font-weight: 500; }
/* Satır içi onay kutusu yanındaki etiketli alanla aynı hizada (etiket yüksekliği kadar aşağıda); iki kutu tek hücrede alt alta. */
.dx-form .form-check-bottom .dx-checkbox { margin-top: 26px; }
.dx-form .form-check-stack { padding-top: 22px; }
.dx-form .form-check-stack .dx-field-item { padding-top: 0 !important; padding-bottom: 6px !important; }
/* Yalnız onay kutularından oluşan kart (Durum): satırlar sık — kart yanındaki kartla aynı boya yakın kalır, boşluk birikmez. */
.dx-form .form-check-list .dx-layout-manager .dx-field-item:not(.dx-first-row) { padding-top: 6px; }
.dx-form .form-check-list .dx-layout-manager .dx-field-item:not(.dx-last-row) { padding-bottom: 6px; }
.dx-form .form-check-list .dx-layout-manager .dx-field-item.dx-first-row { padding-top: 2px; }
/* Salt-okunur AÇIK anahtar soluk turuncu (Fluent açık / kapalıyı aynı griyle çiziyordu). */
.dx-switch.dx-switch-on-value.dx-state-readonly .dx-switch-container::before { background-color: var(--brand-200); border-color: var(--brand-200); }
.dx-switch.dx-switch-on-value.dx-state-readonly .dx-switch-handle::before { background-color: #fff; }
.dx-form .dx-form-group-with-caption {
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); overflow: hidden;
}
.dx-form .dx-form-group-with-caption > .dx-form-group-caption {
    display: block; margin: 0; padding: 11px 18px; background: var(--surface-2); border-bottom: 1px solid var(--line);
    font-size: 14px; line-height: 1.4; font-weight: 600; color: var(--text-2);
}
.dx-form .dx-form-group-with-caption > .dx-form-group-content { margin: 0; padding: 14px 18px 18px; border-top: 0; }
/* Aynı satırdaki kartlar aynı boyda (sahibi 18.10.2026: sağ sütun sol sütunla aynı yerde bitsin, aradaki boşluk kalksın): satır
   hücresi (dx-box-item-content) zaten satır boyunda bir flex sütunudur; kart zincirini onu dolduracak şekilde uzatır. */
.dx-form .dx-box-item-content > .dx-field-item-has-group:has(> .dx-field-item-content > .dx-form-group-with-caption) { flex: 1 1 auto; display: flex; flex-direction: column; }
.dx-form .dx-field-item-has-group > .dx-field-item-content:has(> .dx-form-group-with-caption) { flex: 1 1 auto; display: flex; flex-direction: column; }
.dx-form .dx-field-item-content > .dx-form-group-with-caption { flex: 1 1 auto; }
/* Barkod alanları ve kolonları: rakamlar eşit genişlikte (okuması ve karşılaştırması kolay). */
.barcode-field .dx-texteditor-input, .dx-datagrid .dx-row > td.barcode-cell { font-variant-numeric: tabular-nums; }
/* Ayrı sayfa formu (Sts.definitionPage 'page'): liste gizlenir, kartlar içeriği doldurur; başlık "Kullanıcı: Ayşe Personel". */
.page.is-form { height: auto; }
.page.is-form > :not(.form-page) { display: none !important; }
.form-page { min-width: 0; padding-bottom: 6px; }
.page-title-prefix { color: var(--muted); font-weight: 600; }
.crumb-link { cursor: pointer; }
.crumb-link:hover, .crumb-link:focus-visible { color: var(--text); text-decoration: underline; outline: none; }
/* Kutu içi eylem düğmesi ("İsmini Getir" gibi): turuncu zeminli küçük hap. */
.dx-texteditor-buttons-container .dx-button-mode-text:not(.dx-clear-button-area):not(.dx-dropdowneditor-button) {
    margin: 4px; min-height: 0; border-radius: 6px; background: var(--brand-50); color: var(--brand-700);
}
.dx-texteditor-buttons-container .dx-button-mode-text:not(.dx-dropdowneditor-button) .dx-button-text { font-weight: 600; font-size: 13px; }
.dx-texteditor-buttons-container .dx-button-mode-text:not(.dx-dropdowneditor-button).dx-state-hover { background: var(--brand-100); }
.dx-datagrid .dx-datagrid-headers { background: var(--surface-2); }
/* Satır yüksekliği ~40 px (Fluent varsayılanı 49 px): 1600 / 1920'de ekrana daha çok satır sığar. */
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td { padding-top: 9px; padding-bottom: 9px; }
/* Simge kolonunda (24 px kutu) dikey boşluk az: satır yazılı satırlarla aynı boyda kalır. */
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td.dx-command-edit.dx-command-edit-with-icons { padding-top: 7px; padding-bottom: 7px; }
/* Düzenleyicili hücre (onay kutusu kolonu) DevExtreme'in görünmez ::before aralayıcısıyla temanın 48 px satırını korur; bizim 9 px'lik
   satırla birleşince satır 67 px oluyordu → aralayıcı yazı satırı yüksekliğine. */
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-data-row > td.dx-editor-cell::before { height: 20px !important; padding-top: 0 !important; padding-bottom: 0 !important; }
.dx-datagrid-total-footer .dx-datagrid-summary-item { font-weight: 600; color: var(--text); }
/* Satırdaki küçük metin düğmeleri (Detay / Sil). DevExtreme'in ikonlu komut kolonu kuralı (20 px yazı, sıfır iç boşluk) :not()
   zinciriyle yüksek özgüllüktedir — bu seçici ondan güçlü olmalı. */
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td.dx-command-edit.dx-command-edit-with-icons .dx-link.grid-button:not(.dx-link-icon),
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td.dx-command-edit .dx-link.grid-button:not(.dx-link-icon) {
    display: inline-block; width: auto; height: auto; margin: 0 2px; padding: 2px 10px; border: 1px solid var(--line-strong);
    border-radius: 6px; background: var(--surface); color: var(--text-2); text-decoration: none; font-size: 12.5px; font-weight: 600; line-height: 20px;
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td.dx-command-edit .dx-link.grid-button:not(.dx-link-icon):hover { border-color: var(--brand); color: var(--brand-700); background: var(--brand-50); }
/* Satır işlemleri simge (Smog yerleşimi): aralıklı (sahibi 18.10.2026: "düzenle ile sil arası açılsın" — simge merkezleri 38 px
   arayla), renkle ayrılır — düzenle lacivert, sil kırmızı, diğerleri gri; üzerine gelince hafif zemin. Temanın ikonlu komut kolonu
   kuralı (:not() zinciri, 20 px kutu) bundan önce geliyordu → seçici onunkiyle aynı zincir + .dx-link-icon. Kolon genişliği
   Sts.buttonsColumnWidth. */
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td:not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link.dx-link-icon {
    width: 30px; height: 24px; line-height: 24px; margin: 0 4px; border-radius: 7px; font-size: 18px; text-align: center; color: var(--text-2);
}
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td:not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link.dx-link-icon:hover { background: var(--surface-2); }
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td:not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link.dx-link-icon.dx-icon-edit { color: var(--navy-500); }
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td:not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link.dx-link-icon.dx-icon-edit:hover { background: var(--navy-50); }
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td:not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link.dx-link-icon.grid-icon-danger { color: #C2453B; }
.dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table .dx-row > td:not(.dx-validation-pending):not(.dx-datagrid-select-all).dx-command-edit.dx-command-edit-with-icons .dx-link.dx-link-icon.grid-icon-danger:hover { background: var(--bad-50); color: var(--bad); }
/* Uzun metin kolonu satır kaydırır; diğerleri tek satır, kesilen metin üzerine gelince görünür (cellHintEnabled). */
.dx-datagrid .dx-row > td.cell-wrap { white-space: normal; overflow-wrap: anywhere; }
/* Aynı sınıf başlıkta: uzun başlık kesilmek yerine sözcük sınırında satır kaydırır. */
.dx-datagrid-headers .dx-row > td.cell-wrap .dx-datagrid-text-content { white-space: normal; overflow-wrap: normal; text-overflow: clip; }

/* Açılır pencere ve onay: beyaz başlık, üstte ince turuncu vurgu; alt düğme şeridi gri. */
.sts-dialog .dx-overlay-content { border-top: 3px solid var(--brand); }
.sts-dialog .dx-popup-title { border-bottom: 1px solid var(--line); }
.sts-dialog .dx-popup-title .dx-toolbar-label { font-size: 17px; font-weight: 600; color: var(--text); }
.sts-dialog .dx-popup-bottom { background: var(--surface-2); border-top: 1px solid var(--line); }
/* Doğrulama iletisi alanın altında açılır; içerik kırpılmasın. */
.sts-dialog .dx-popup-content { overflow: visible; padding-bottom: 28px; }
/* Ekrana sığmayan uzun form (ör. Kullanıcılar: izin listesi) pencerenin içinde kayar. */
.sts-dialog.sts-dialog-scroll .dx-popup-content { overflow-y: auto; }
/* Tanımlama formu penceresi (Sts.definitionPage 'dialog', Smog: basit bilgi ortada açılır): eylemler başlığın sağında; uzun içerik
   pencerenin içinde kayar. */
.sts-form-dialog .dx-popup-title { padding-top: 10px; padding-bottom: 10px; }
.sts-dialog.sts-form-dialog .dx-popup-content { overflow-y: auto; padding: 18px 22px 26px; }
.sts-dialog-body { display: flex; align-items: flex-start; gap: 14px; padding: 6px 2px; }
.sts-dialog-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; background: var(--brand-50); color: var(--brand-600); font-size: 22px; }
.sts-dialog-danger .dx-overlay-content { border-top-color: var(--bad); }
.sts-dialog-danger .sts-dialog-icon { background: var(--bad-50); color: var(--bad); }
.sts-dialog-message { margin: 0; padding-top: 10px; color: var(--text-2); font-size: 15px; white-space: pre-line; }
/* WPF #424 kabul notu penceresi (scanner.js): notun kendisi okunur büyüklükte, satır sonları korunur; uzun not pencerede kayar. */
/* WPF #422: Cihazlar formunun "Cihaz testleri" kartı — ilk satırın onay kutusu, etiketli kutularla aynı hizada. */
.device-tests .device-test-first { padding-top: 24px; }
/* WPF #426: tamamlanma tarihinin yanındaki "Bitiş tarihini düzelt" simgesi (çalışma ekranı başlık kartı). */
.cycle-correct { display: inline-flex; vertical-align: middle; margin-left: 6px; }
.cycle-correct .dx-button { min-width: 28px; height: 28px; }
.correction-note-label { margin-top: 12px; }
.reception-note-text {
    margin: 0; padding: 4px 2px; max-height: 50vh; overflow-y: auto;
    color: var(--text); font-size: 15px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere;
}

/* Bildirimler: beyaz kart, renkli şerit ve gölge (sağ altta). */
.sts-toast .dx-toast-content { display: block; padding: 0; border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-lg); color: var(--text); line-height: 1.4; }
.sts-toast .sts-toast-content { padding: 12px 16px; border: 1px solid var(--line); border-left-width: 5px; border-radius: 12px; background: var(--surface); }
.sts-toast .dx-toast-icon { display: none; }
.sts-toast-title { font-weight: 700; font-size: 14.5px; margin-bottom: 2px; }
.sts-toast-message { font-size: 14px; color: var(--text-2); white-space: pre-line; }
.sts-toast-error .sts-toast-content { border-left-color: var(--bad); }
.sts-toast-error .sts-toast-title { color: var(--bad-700); }
.sts-toast-success .sts-toast-content { border-left-color: var(--ok); }
.sts-toast-success .sts-toast-title { color: var(--ok-700); }
.sts-toast-info .sts-toast-content, .sts-toast-warning .sts-toast-content { border-left-color: var(--brand); }
.sts-toast-info .sts-toast-title, .sts-toast-warning .sts-toast-title { color: var(--brand-700); }

/* Menü araması (Ctrl+K) ve kullanıcı menüsü */
.command-palette .dx-overlay-content { border-radius: 16px; box-shadow: var(--shadow-lg); }
.command-palette .dx-popup-content { padding: 14px; }
.command-palette .dx-list { margin-top: 10px; }
.palette-item { display: grid; gap: 1px; padding: 2px 0; }
.palette-name { font-weight: 600; color: var(--text); }
.palette-path { font-size: 12px; color: var(--muted); }
.palette-item.not-ported .palette-name { color: var(--faint); }
.command-palette .dx-list-item.dx-list-item-selected { background: var(--brand-50); }
.user-menu .dx-menu-item-content { padding-top: 8px; padding-bottom: 8px; }

/* ---------------------------------------------------------------- dar ekran: menü çekmece olur */
.backdrop { display: none; }
@media (max-width: 1279px) {
    :root { --content-pad: 16px; }
    .search-trigger { width: auto; }
    .search-trigger-text, .search-trigger kbd { display: none; }
    .user-name { display: none; }
}
@media (max-width: 1100px) {
    .app, .sidebar-collapsed .app { grid-template-columns: minmax(0, 1fr); }
    .sidebar {
        position: fixed; inset: 0 auto 0 0; width: 280px; max-width: 86vw; z-index: 1500;
        transform: translateX(-102%); transition: transform .2s ease; box-shadow: var(--shadow-lg);
    }
    .sidebar-collapse { display: none; }
    body.menu-open .sidebar { transform: none; }
    body.menu-open .backdrop { display: block; position: fixed; inset: 0; z-index: 1400; background: rgba(15, 23, 42, .35); }
    .menu-toggle { display: inline-flex; }
    /* Çekmecede daraltma uygulanmaz. */
    .sidebar-collapsed .brand { display: inline-flex; }
    .sidebar-collapsed .nav-section-title, .sidebar-collapsed .nav-text, .sidebar-collapsed .nav-caret { display: revert !important; }
    .sidebar-collapsed .nav-group.is-open > .nav-sub { display: block !important; }
    .sidebar-collapsed .nav-link { justify-content: flex-start; width: calc(100% - 20px); margin: 1px 10px; padding: 7px 12px; }
    .terminal-chip span { max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
    .hero { flex-direction: column; align-items: flex-start; }
    .hero-facts { justify-content: flex-start; }
}
@media (max-width: 560px) {
    .auth-card { padding: 24px 18px 12px; border-radius: 14px; }
    .terminal-list { grid-template-columns: minmax(0, 1fr); }
    .terminal-chip { display: none; }
}

/* ================================================================ ekranlara özgü */

/* Setler: solda setler, sağda odaklı setin aletleri; alet takibi kapalıysa tek kolon. */
.sets-layout { flex: 1 1 auto; min-height: 280px; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 3fr); gap: 16px; }
@media (max-width: 1599px) { .sets-layout { grid-template-columns: minmax(0, 68fr) minmax(0, 32fr); } }
.sets-layout-single { grid-template-columns: minmax(0, 1fr); }
.sets-layout > div { min-height: 0; }
/* Set sayfası: set bilgileri üstte; altta set içeriği (sol) + seçili alet (sağ), dar ekranda alt alta. */
.set-page { display: grid; gap: 16px; align-content: start; }
/* İki panel aynı yerde biter (sahibi 18.10.2026): set içeriği tablosu panelin kalan yüksekliğini doldurur (en az 520 px). */
.set-body { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(420px, 1fr); gap: 16px; align-items: stretch; }
.set-body > .panel { display: flex; flex-direction: column; min-width: 0; }
.set-items-host { position: relative; flex: 1 1 auto; min-height: 520px; }
.set-items-host > .set-items-grid { position: absolute; inset: 0; }
@media (max-width: 1250px) { .set-body { grid-template-columns: minmax(0, 1fr); } }
.transfer-form { display: grid; gap: 12px; }
.transfer-row { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 10px; align-items: baseline; }
.transfer-label { color: var(--muted); }
.transfer-value { font-weight: 600; color: var(--text); overflow-wrap: anywhere; }

/* Alet Servis Kayıtları (#29): solda alet kartı, sağda tüm kayıtlar; dar ekranda alt alta. */
.service-page { display: grid; grid-template-columns: minmax(520px, 2fr) minmax(0, 3fr); gap: 16px; align-items: start; }
@media (max-width: 1500px) { .service-page { grid-template-columns: minmax(0, 1fr); } }
.service-search { max-width: none; }
.service-hint { margin: 12px 0 0; }
.service-search-name { font-weight: 600; }
.service-search-meta { font-size: 12px; color: var(--muted); }
#itemCard { margin-top: 16px; display: grid; gap: 14px; }
#itemCard[hidden] { display: none; }
.service-card-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.service-card-head h2 { margin: 0; font-size: 20px; font-weight: 600; color: var(--text); }
.service-status { display: flex; gap: 6px; flex-wrap: wrap; }
.service-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 16px; margin: 0; }
.service-facts dt { color: var(--muted); }
.service-facts dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.service-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.service-subtitle { margin: 4px 0 0; font-size: 14px; font-weight: 600; color: var(--text); }
.service-deleted { margin: 0; padding: 8px 12px; border-radius: var(--radius-sm); background: var(--bad-50); color: var(--bad-700); }
.service-deleted[hidden] { display: none; }
.service-record-item { margin: 0 0 12px; }

/* Ortam Barkodları (#21): solda ortam + barkodlar, sağda föyün önizlemesi (föy biçimi barcode-sheet.css); dar ekranda alt alta. */
.stage-barcodes { display: grid; grid-template-columns: minmax(500px, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 1250px) { .stage-barcodes { grid-template-columns: minmax(0, 1fr); } }
.stage-barcodes .filter-bar { padding-bottom: 8px; }
.stage-barcodes-foot { justify-content: space-between; align-items: center; }
.stage-barcodes-summary { font-weight: 600; color: var(--text); }
/* Seçim onay kutusundan okunur: seçili satır boyanmaz (hepsi seçili açılır), basılmayacak satır soluk. */
#barcodesGrid .dx-datagrid-rowsview .dx-selection.dx-row > td,
#barcodesGrid .dx-datagrid-rowsview .dx-selection.dx-row:hover > td { background-color: transparent; color: var(--text); }
#barcodesGrid .dx-datagrid-rowsview .dx-data-row:not(.dx-selection) > td:not(.dx-command-select):not(.dx-command-drag) { color: var(--faint); }
.sheet-preview { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; }
.sheet-preview-page { display: grid; gap: 6px; justify-items: start; }
.sheet-preview-caption { font-size: 12px; color: var(--muted); }
.sheet-preview .sheet-page { zoom: var(--sheet-zoom, 0.6); box-shadow: var(--shadow); }

/* Alet Fotoğrafları: sayı, düğmeler, ilerleme, sonuç. */
.item-images { display: grid; gap: 18px; }
.item-images-line { margin: 0; font-size: 16px; font-weight: 600; color: var(--text); min-height: 1.4em; }
.item-images-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.item-images-options { display: grid; gap: 6px; justify-items: start; }
.item-images-hint { margin: 0 0 6px 30px; font-size: 13px; color: var(--muted); }

/* Cihaz Döngü Sayıları (#40-5): cihaz başına kart; geniş ekranda satıra sığdığı kadar kart. */
.cycle-counters { display: grid; gap: 22px; align-content: start; }
.cycle-counters-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.cycle-counters-intro p { margin: 0 0 4px; color: var(--muted); }
.device-groups { display: grid; gap: 26px; }
.device-group-title { margin: 0 0 12px; font-size: 16px; font-weight: 600; color: var(--text); }
.device-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.device-card {
    display: grid; gap: 14px; align-content: start; padding: 16px 18px;
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm);
}
.device-card.is-editing { border-color: var(--brand); box-shadow: var(--shadow), var(--focus-ring); }
.device-card-title { margin: 0; font-size: 15px; font-weight: 600; color: var(--text); }
.device-card-values { display: flex; flex-wrap: wrap; gap: 14px 28px; }
.device-counter { display: grid; gap: 4px; align-content: start; }
.device-counter-label { font-size: 12px; color: var(--muted); }
/* Değer satırı düzenleme kutusuyla aynı yükseklikte: "Değiştir" kartı (ve satırını) uzatmaz. */
.device-counter-value { font-size: 30px; font-weight: 700; line-height: 36px; color: var(--text); font-variant-numeric: tabular-nums; }
.device-card-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* Parametreler (sahibi 18.10.2026: gruplar ve hizalar düzensizdi): ayar kartları — her parametre tek satır, solda adı, sağda anahtar /
   kutu (hepsi aynı sağ kenarda); kartlar sütunlara yükseklikleri dengelenerek dağılır (parameters.js), sütunun son kartı uzar →
   sütunlar aynı yerde biter. Düzenle / Kaydet / İptal başlık şeridinde. */
.parameters-actions { display: flex; justify-content: flex-end; gap: 8px; }
.settings-note { display: flex; align-items: center; gap: 8px; margin: -4px 0 14px; color: var(--muted); font-size: 13px; }
.settings-note .icon { width: 16px; height: 16px; color: var(--navy-500); }
.settings { display: grid; grid-template-columns: repeat(var(--settings-cols, 1), minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.settings-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.settings-col > .settings-card:last-child { flex: 1 1 auto; }
.settings-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); overflow: hidden; }
.settings-card-head { display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 9px 18px; background: var(--surface-2); border-bottom: 1px solid var(--line); }
.settings-card-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--brand-50); color: var(--brand-600); flex: none; }
.settings-card-icon .icon { width: 17px; height: 17px; }
.settings-card-title { margin: 0; font-size: 15px; font-weight: 600; color: var(--text); }
.settings-card-tag { margin-left: auto; padding: 2px 10px; border-radius: 999px; background: var(--navy-50); color: var(--navy-500); font-size: 12px; font-weight: 600; white-space: nowrap; }
.setting-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 54px; padding: 8px 18px; border-bottom: 1px solid var(--line); }
.setting-row:last-child { border-bottom: 0; }
.setting-label { flex: 1 1 auto; min-width: 0; color: var(--text-2); font-weight: 500; }
.setting-control { flex: none; display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.setting-control .dx-textbox { width: 170px; }
.setting-row.is-wide .setting-control { flex: 0 1 470px; min-width: 240px; }
.setting-row.is-wide .setting-control > div, .setting-row.is-wide .setting-control .dx-textbox { width: 100%; }
.setting-state { min-width: 52px; text-align: right; font-size: 13px; font-weight: 600; color: var(--faint); }
.setting-state.is-on { color: var(--ok-700); }
.settings.is-editing .setting-row.is-toggle { cursor: pointer; }
.settings.is-editing .setting-row.is-toggle:hover { background: var(--surface-2); }
.setting-row.is-logo { align-items: flex-start; padding-top: 12px; padding-bottom: 12px; }
.parameter-logo {
    width: 150px; height: 90px; display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface);
}
.parameter-logo img { max-width: 100%; max-height: 100%; }
.parameter-logo-buttons { display: grid; gap: 8px; }

/* Kullanıcı formu: fotoğraf, terminal / izin onay kutusu listeleri. */
.user-photo {
    width: 150px; height: 150px; display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-2);
}
.user-photo img { max-width: 100%; max-height: 100%; }
.user-photo-buttons { display: flex; gap: 8px; margin-top: 8px; }
/* Tekli alet / ÇKM formu: fotoğraf. */
.item-photo {
    width: 200px; height: 200px; display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-2);
}
.item-photo img { max-width: 100%; max-height: 100%; }
.item-photo-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.user-check-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; padding: 6px 0 10px; }
.user-check-list-single { grid-template-columns: minmax(0, 1fr); }
/* Yetkiler kartı: izin grupları sütunlara dağılır (geniş ekranda 3-4 sütun). */
.user-permissions { column-width: 300px; column-gap: 28px; margin-top: 6px; }
.user-permission-block { break-inside: avoid; margin-bottom: 12px; }
.user-permission-group { padding: 6px 10px; border-radius: 6px; background: var(--brand-50); color: var(--brand-700); font-size: 13px; font-weight: 700; }
.user-role-hint { align-self: end; padding-bottom: 8px; font-size: 13px; font-style: italic; color: var(--brand-700); }

/* ---------------------------------------------------------------- Faz 3: barkod okuyucu göstergesi (üst çubuk, scanner.js)
   Okutma işlenirken turuncu döner, bitince kısa yeşil yanıp söner; kuyrukta bekleyen okutma sayısı rozet. */
.scan-indicator {
    position: relative; display: inline-grid; place-items: center; width: 34px; height: 34px; margin-left: 6px; flex: none;
    border-radius: 999px; color: var(--muted); background: var(--surface-2); border: 1px solid var(--line); transition: color .15s, background .15s, border-color .15s;
}
.scan-indicator .icon { width: 18px; height: 18px; }
.scan-indicator.is-busy { color: var(--brand-700); background: var(--brand-50); border-color: var(--brand-200); animation: scan-pulse 1s ease-in-out infinite; }
.scan-indicator.is-flash { color: var(--ok-700); background: var(--ok-50); border-color: #B7E3C8; }
.scan-queue { position: absolute; top: -5px; right: -5px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px; background: var(--brand); color: #fff; font-size: 11px; font-weight: 700; line-height: 17px; text-align: center; }
.scan-queue:empty { display: none; }
@keyframes scan-pulse { 50% { box-shadow: 0 0 0 4px rgba(245, 148, 28, .18); } }

/* Tutanak önizleme penceresi (Sts.printReport): PDF tarayıcının görüntüleyicisinde, pencereyi doldurur. */
.sts-report-viewer .dx-popup-content { padding: 0; overflow: hidden; }
/* Tutanak önizlemesi (sts.js renderPdf, pdf.js): sayfalar pencere genişliğinde, gri zeminde gölgeli kâğıt; kaydırma çubuğunun yeri
   hep ayrılır (çubuk çıkınca genişlik değişip sayfalar yeniden çizilmesin). */
.report-preview { box-sizing: border-box; height: 100%; overflow-y: auto; scrollbar-gutter: stable; padding: 16px 20px; background: #E7EAEF;
    display: flex; flex-direction: column; align-items: center; gap: 16px; }
.report-page { flex: none; display: block; background: #fff; border-radius: 2px; box-shadow: 0 1px 3px rgba(15, 23, 42, .16), 0 0 0 1px rgba(15, 23, 42, .06); }
.report-preview-status { margin: auto; color: var(--muted); font-size: 15px; }
.report-preview-status.is-error { color: var(--bad-700); font-weight: 600; }

/* ---------------------------------------------------------------- Faz 3: Kirli Giriş (kabul) listesi — üstte liste, altta seçili kabulün
   içeriği (#360); eşleşen içerik satırı kalın. Yükseklik = içerik alanı − başlık şeridi (çift kaydırma çubuğu olmasın). */
.reception-list { height: calc(100% - 78px); min-height: 560px; gap: 16px; }
.reception-list-grid { flex: 1 1 62%; min-height: 260px; }
.reception-content { flex: 1 1 38%; min-height: 220px; display: flex; flex-direction: column; overflow: hidden; }
.reception-content .card-head { padding: 10px 18px; }
.reception-content-grid { flex: 1 1 auto; min-height: 0; }
.reception-content-grid.sts-grid { border: 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); box-shadow: none; }
.sts-grid .dx-datagrid-rowsview .dx-row.row-match > td { font-weight: 700; color: var(--text); background: var(--brand-50); }

/* ---------------------------------------------------------------- Faz 3: kabul ekranı — üstte başlık bilgileri (tam genişlik), solda
   kalemler (en yeni üstte), sağda son okutma + elle ekleme. Okutma serisinde göz hep sağ üstteki karta ve listenin başına gider. */
.reception {
    height: calc(100% - 78px); min-height: 600px;
    display: grid; grid-template-columns: minmax(0, 1fr) 400px; grid-template-rows: auto minmax(0, 1fr); gap: 16px;
}
.reception-head { grid-column: 1 / -1; padding: 14px 20px 16px; }
.reception-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1.3fr)) minmax(0, 1fr); gap: 12px 20px; align-items: end; }
.reception-field { min-width: 0; }
.reception-field-label { margin-bottom: 6px; font-size: 12.5px; font-weight: 500; color: var(--muted); }
.reception-field-value {
    min-height: 32px; display: flex; align-items: center; padding: 0 12px; border-radius: var(--radius-sm); background: var(--surface-2);
    border: 1px solid var(--line); font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.reception-field-value.is-muted { color: var(--text-2); font-weight: 500; }
.reception-items { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.reception-items .card-head { padding: 10px 18px; }
.reception-items-title { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; min-width: 0; }
.reception-counts { display: flex; flex-wrap: wrap; gap: 6px; }
.count-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 500; }
.count-chip b { font-weight: 700; font-variant-numeric: tabular-nums; }
.reception-grid { flex: 1 1 auto; min-height: 0; }
.reception-grid.sts-grid { border: 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); box-shadow: none; }
.dx-datagrid .dx-row > td.cell-strong { font-weight: 600; }
/* Malzeme türü rozetleri: set lacivert, tekli alet turuncu, ÇKM mavi, sarf yeşil, paket gri. */
.kind-chip { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.kind-set { background: var(--navy-50); color: var(--navy-700); }
.kind-soloItem { background: var(--brand-50); color: var(--brand-700); }
.kind-reusable { background: var(--info-50); color: var(--info); }
.kind-consumable { background: var(--ok-50); color: var(--ok-700); }
/* #55 bildirim satırı türleri: açık kayıtlar nötr, döngü / otoklav kehribar, sarf stoğu sarfla aynı yeşil. */
.kind-reception, .kind-delivery, .kind-packaging, .kind-surgery, .kind-return, .kind-transfer { background: var(--surface-2); color: var(--text-2); box-shadow: inset 0 0 0 1px var(--line); }
.kind-cycle, .kind-device { background: var(--warn-50); color: var(--warn-700); }
.kind-stock { background: var(--ok-50); color: var(--ok-700); }
.kind-package { background: var(--surface-2); color: var(--text-2); border: 1px solid var(--line); }
/* Yeni eklenen kalem kısa süre yeşil vurgulanır. */
.dx-datagrid .dx-row.row-fresh > td { animation: row-fresh 2.4s ease-out; }
@keyframes row-fresh { 0%, 35% { background: var(--ok-50); } 100% { background: transparent; } }

.reception-side { display: flex; flex-direction: column; gap: 16px; min-height: 0; overflow-y: auto; }
/* Son okutma kartı: sol kenar rengi sonucu söyler (okunuyor turuncu, eklendi yeşil, hata kırmızı). */
.scan-card { padding: 16px 20px 18px; border-left: 5px solid var(--line-strong); transition: border-color .2s, background .2s; }
.scan-card.is-reading { border-left-color: var(--brand); }
.scan-card.is-ok { border-left-color: var(--ok); background: linear-gradient(90deg, var(--ok-50), var(--surface) 70%); }
.scan-card.is-error { border-left-color: var(--bad); background: linear-gradient(90deg, var(--bad-50), var(--surface) 70%); }
.scan-card.is-done { border-left-color: var(--ok); }
.scan-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; color: var(--muted); font-size: 12.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.scan-card-icon { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--brand-50); color: var(--brand-600); }
.scan-card-icon .icon { width: 16px; height: 16px; }
.scan-card-body { display: grid; gap: 4px; min-height: 64px; }
.scan-title { font-size: 20px; font-weight: 700; line-height: 1.25; color: var(--text); }
.scan-title.is-muted { color: var(--faint); font-weight: 600; }
.scan-card.is-ok .scan-title { color: var(--ok-700); }
.scan-card.is-error .scan-title { color: var(--bad-700); }
.scan-detail { font-size: 15px; font-weight: 600; color: var(--text-2); overflow-wrap: anywhere; }
.scan-meta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 2px; color: var(--muted); font-size: 13px; }

.manual-card .card-head, .note-card .card-head { padding: 12px 20px; }
.manual-card .card-body, .note-card .card-body { padding: 14px 20px 18px; }
.manual-row { display: grid; gap: 6px; margin-bottom: 14px; }
.manual-row:last-child { margin-bottom: 0; }
.manual-label { font-size: 12.5px; font-weight: 500; color: var(--muted); }
.manual-inputs { display: flex; align-items: center; gap: 8px; min-width: 0; }
.manual-select { flex: 1 1 auto; min-width: 0; }
.manual-quantity { width: 110px; flex: none; }
.manual-row > #manualMaterial + .manual-inputs { margin-top: 6px; }
.manual-inputs .manual-label { flex: none; }
.note-text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-weight: 600; }
.note-text.is-muted { color: var(--faint); font-weight: 500; }
.note-card .reception-field-label { margin-top: 10px; }
.note-actions { display: flex; justify-content: flex-end; margin-top: 14px; }
.note-dialog .note-counter { margin-top: 6px; text-align: right; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.note-dialog .sts-dialog-message { margin: 0 0 12px; }
/* "Teslimat Bitir": başlık şeridinin birincil düğmesi biraz daha iri (dokunmatik terminal). */
.reception-end.dx-button { min-height: 40px; }
.reception-end.dx-button .dx-button-text { font-size: 15px; }

@media (max-width: 1700px) {
    .reception { grid-template-columns: minmax(0, 1fr) 360px; }
}
@media (max-width: 1500px) {
    .reception { grid-template-columns: minmax(0, 1fr) 340px; }
    .reception-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
    .reception, .reception-list { height: auto; }
    .reception { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
    .reception-items { min-height: 460px; }
    .reception-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------------------------------------------------------------- Faz 3: İlk Yıkama (#45) — çalışma ekranı: üstte durum + döngü no'ları +
   tarihler, solda yük (en yeni üstte), sağda son okutma, elle ekleme (yalnız Yükleniyor) ve testler. Izgara kabul ekranıyla aynı. */
.cycle {
    height: calc(100% - 78px); min-height: 600px;
    display: grid; grid-template-columns: minmax(0, 1fr) 400px; grid-template-rows: auto minmax(0, 1fr); gap: 16px;
}
.cycle-head { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; padding: 14px 20px 16px; }
.cycle-summary { display: flex; align-items: center; gap: 18px; flex: none; }
.cycle-state.status-chip { padding: 6px 14px; font-size: 15px; }
.cycle-numbers { display: flex; gap: 12px; }
.cycle-number { display: grid; gap: 2px; padding: 2px 14px; border-left: 3px solid var(--brand); }
.cycle-number.is-upcoming { border-left-color: var(--line-strong); }
.cycle-number-label { font-size: 12px; font-weight: 500; color: var(--muted); white-space: nowrap; }
.cycle-number-value { font-size: 22px; font-weight: 700; line-height: 1.1; color: var(--text); font-variant-numeric: tabular-nums; }
.cycle-number.is-upcoming .cycle-number-value { color: var(--text-2); }
.cycle-fields { flex: 1 1 560px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px 20px; align-items: end; }
.cycle-items { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.cycle-items .card-head { padding: 10px 18px; }
.cycle-grid { flex: 1 1 auto; min-height: 0; }
.cycle-grid.sts-grid { border: 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); box-shadow: none; }
.cycle-side { display: flex; flex-direction: column; gap: 16px; min-height: 0; overflow-y: auto; }
.status-info { background: var(--info-50); color: var(--info); }
/* Tamamlanmış çalışmadan geri çekilen satır: soluk, adı üstü çizili; iptal rozeti ve kim / ne zaman son kolonda. */
.dx-datagrid .dx-row.row-canceled > td { color: var(--faint); }
.dx-datagrid .dx-row.row-canceled > td .cell-name { text-decoration: line-through; }
.cell-sub { margin-top: 3px; font-size: 12px; color: var(--muted); white-space: normal; }
.cell-sub.cell-line { margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tests-card .card-head { padding: 12px 20px; }
.tests-card .card-body { padding: 4px 20px 16px; }
.tests-card .panel-hint { margin: 8px 0 4px; }
.test-row { padding: 12px 0; border-top: 1px solid var(--line); }
.test-row:first-child { border-top: 0; }
.test-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.test-name { font-weight: 600; color: var(--text); }
.test-pending { color: var(--faint); font-size: 12.5px; }
.test-note { margin: 6px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text-2); }
.test-note.is-failed { color: var(--bad-700); }
.test-meta { margin-top: 4px; font-size: 12px; color: var(--muted); }
.test-actions { display: flex; gap: 8px; margin-top: 10px; }
.test-actions > div { flex: 1 1 0; min-width: 0; }
.test-actions .dx-button { width: 100%; }
/* Axis (#64): biyolojik test satırında "QR Kod Oku" (tam genişlik, Başarılı / Başarısız'ın altında) ve penceresi. */
.test-axis { margin-top: 8px; }
.test-axis .dx-button { width: 100%; }
.test-axis-button .dx-button-content { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.test-axis-icon { width: 17px; height: 17px; }
.axis-qr-row { display: flex; gap: 8px; align-items: center; }
.axis-qr-box { flex: 1 1 auto; min-width: 0; }
.axis-read { flex: none; }
.axis-qr-box input { font-variant-numeric: tabular-nums; }
.axis-status { display: flex; align-items: center; gap: 8px; margin-top: 12px; color: var(--muted); font-size: 13px; }
.axis-spinner { width: 14px; height: 14px; border: 2px solid var(--line-strong); border-top-color: var(--brand); border-radius: 50%; animation: axis-spin .8s linear infinite; }
@keyframes axis-spin { to { transform: rotate(360deg); } }
.axis-result { display: flex; align-items: center; gap: 10px; margin-top: 14px; }
.axis-result-label { font-size: 12.5px; font-weight: 500; color: var(--muted); }
.axis-line { margin: 8px 0 0; color: var(--text-2); font-size: 13px; overflow-wrap: anywhere; }
.axis-dialog .note-warning { margin: 12px 0 0; }
.axis-note { margin-top: 14px; }
.test-ok.dx-button.dx-button-mode-outlined:not(.dx-state-disabled) { border-color: var(--ok); color: var(--ok-700); }
.test-ok.dx-button.dx-button-mode-outlined:not(.dx-state-disabled) .dx-icon { color: var(--ok-700); }
.test-fail.dx-button.dx-button-mode-outlined:not(.dx-state-disabled) { border-color: var(--bad); color: var(--bad-700); }
.test-fail.dx-button.dx-button-mode-outlined:not(.dx-state-disabled) .dx-icon { color: var(--bad-700); }
/* Çalıştır / Tamamla / İptal: başlık şeridinin birincil düğmeleri biraz daha iri (dokunmatik terminal). */
.cycle-action.dx-button { min-height: 40px; }
.cycle-action.dx-button .dx-button-text { font-size: 15px; }
.date-dialog .sts-dialog-message, .autoload-dialog .sts-dialog-message { margin: 0 0 14px; }
/* Sterilizasyon (#48): başarısız teste rağmen tamamlama açıklaması (başlık kartının altında tam satır), not penceresinin üstündeki uyarı,
   çalışırken etiketindeki döngü no'su farklı satırın rozeti. */
.cycle-completion { flex: 1 1 100%; margin: 0; flex-direction: column; gap: 2px; }
.cycle-completion-text { white-space: pre-wrap; overflow-wrap: anywhere; }
.cycle-completion-meta { font-size: 12.5px; opacity: .85; }
.note-dialog .note-warning { margin: 0 0 14px; padding: 10px 12px; border: 1px solid #F7C9C9; border-radius: var(--radius-sm); background: var(--bad-50); color: var(--bad-700); }
.cell-chip-line { margin-top: 4px; }
.location-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.location-meta { display: flex; align-items: center; gap: 8px; margin-top: 3px; white-space: nowrap; }
.location-meta .cell-sub { margin-top: 0; }
.label-mismatch.status-chip { font-size: 12px; padding: 2px 8px; }
.autoload-dialog .sts-dialog-message { font-size: 15px; font-weight: 600; color: var(--text); }
.filter-check { margin-left: 4px; }

@media (max-width: 1700px) {
    .cycle { grid-template-columns: minmax(0, 1fr) 360px; }
}
@media (max-width: 1500px) {
    .cycle { grid-template-columns: minmax(0, 1fr) 340px; }
    .cycle-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
    .cycle { height: auto; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
    .cycle-items { min-height: 460px; }
    .cycle-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------------------------------------------------------------- Faz 3: Set ekranı (#46) — üstte set kartı (+ Temiz Alan'da gireceği cihaz /
   yazıcı), sekmeler; "İçerik"te sayım sürerken iki liste yan yana (sahibi kararı) + ilerleme çubuğu, "Geçmiş"te set ve alet geçmişi. */
.set-screen { height: calc(100% - 78px); min-height: 620px; display: flex; flex-direction: column; gap: 14px; }
.set-head { flex: none; display: grid; gap: 10px; padding: 12px 20px 14px; }
.set-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.set-state.status-chip { padding: 6px 14px; font-size: 15px; }
.status-neutral { background: var(--surface-2); color: var(--text-2); border: 1px solid var(--line); }
.set-barcode { font-family: var(--font-mono); font-size: 13px; color: var(--muted); }
.set-temporary { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--warn-700); }
.set-temporary .icon { width: 16px; height: 16px; }
.set-fields { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px 20px; align-items: end; }
.reception-field-value.is-danger { color: var(--bad-700); }
.set-device { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 28px; padding-top: 10px; border-top: 1px solid var(--line); }
.set-device-field { display: flex; align-items: center; gap: 10px; }
.set-device-label { font-size: 12.5px; font-weight: 500; color: var(--muted); white-space: nowrap; }
.set-device-select { width: 260px; }
.set-daily-box { width: 110px; }
.set-tabs { flex: none; align-self: flex-start; }
.set-tabs.dx-tabs { width: auto; min-width: 280px; background: none; }
.set-tabs .dx-tab { padding: 8px 22px; }
.set-tabs .dx-tab-text { font-size: 14px; font-weight: 600; }
.set-content { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 12px; }
.set-progress { flex: none; display: flex; align-items: center; gap: 14px; padding: 10px 18px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); }
.set-progress-bar { flex: 1 1 auto; height: 12px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--line); overflow: hidden; }
.set-progress-bar span { display: block; height: 100%; width: 0; border-radius: 999px; background: var(--brand); transition: width .35s ease; }
.set-progress.is-done .set-progress-bar span { background: var(--ok); }
.set-progress-text { flex: none; font-size: 15px; font-weight: 600; color: var(--text); font-variant-numeric: tabular-nums; }
.set-progress.is-done .set-progress-text { color: var(--ok-700); }
.set-lists { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.set-lists.is-counting { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.set-list { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.set-list .card-head { padding: 10px 18px; }
.set-grid { flex: 1 1 auto; min-height: 0; }
.set-grid.sts-grid { border: 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); box-shadow: none; }
.item-flags { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-left: 8px; vertical-align: middle; }
.status-chip.item-flag { padding: 1px 8px; font-size: 11.5px; }
.dx-datagrid .dx-row > td .cell-muted { color: var(--faint); font-style: italic; }
.dx-datagrid .dx-row.row-untracked > td.barcode-cell { color: var(--faint); }
.set-history { flex: 1 1 auto; min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 16px; }
/* Alet seçilince iki geçmiş eşit pay alır, her biri en az ~3 satır (terminal Edge --app penceresi 1600×900'de ~820 px: sayfa biraz kayar). */
.set-history.has-item { grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); }
.set-screen:has(> .set-history.has-item:not([hidden])) { min-height: 780px; }
.set-history:not(.has-item) #itemHistoryGrid { display: none; }
.set-history-card { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.set-history-card .card-head { padding: 8px 18px; }
.set-history-item { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; min-width: 0; }
.set-export-grid { position: fixed; left: -10000px; top: 0; width: 800px; }
.set-action.dx-button { min-height: 40px; }
.set-action.dx-button .dx-button-text { font-size: 15px; }

/* Alet detayı penceresi (her sayfada — item-detail.js). */
.item-detail { display: grid; gap: 16px; }
.item-detail-head { display: flex; gap: 18px; align-items: flex-start; }
.item-detail-photo { flex: none; width: 200px; height: 200px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-2); overflow: hidden; }
.item-detail-photo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.item-detail-nophoto { font-size: 42px; color: var(--faint); }
.item-detail-info { flex: 1 1 auto; min-width: 0; display: grid; gap: 8px; align-content: start; }
.item-detail-set { font-size: 13px; font-weight: 600; color: var(--muted); }
.item-detail-title { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 18px; font-weight: 700; color: var(--text); }
.item-detail-codes { display: flex; flex-wrap: wrap; gap: 8px; }
.item-code { padding: 3px 10px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); font-family: var(--font-mono); font-size: 13px; color: var(--text); cursor: copy; }
.item-code:hover { border-color: var(--brand); background: var(--brand-50); }
.item-detail-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; color: var(--text-2); }
.item-detail-meta .is-danger { color: var(--bad-700); font-weight: 600; }
.item-detail-flags { display: flex; flex-wrap: wrap; gap: 10px 28px; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.item-detail-note { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: flex-start; }
.item-detail-grow { flex: 1 1 320px; }
.item-detail-section { font-size: 14px; font-weight: 600; color: var(--text); }

@media (max-width: 1400px) {
    .set-fields { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
    .set-screen { height: auto; }
    .set-lists.is-counting { grid-template-columns: minmax(0, 1fr); }
    .set-list { min-height: 420px; }
    .set-history { grid-template-rows: auto; }
    .set-history-card { min-height: 380px; }
    .set-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .item-detail-head { flex-direction: column; }
}

/* ---------------------------------------------------------------- Faz 3: Paketleme (#47) — paketleme ekranı kabul / yıkama ekranıyla aynı ızgara:
   üstte paketleme kartı (durum + ad, bölüm / yazıcı / gireceği cihaz + günlük no / grup paketi), solda paketler (en yeni üstte), sağda son
   okutma (kapalıda durum + etiket özeti) ve elle ekleme. Listeler kabul listesinin düzenini (.reception-list) kullanır. */
.packaging {
    height: calc(100% - 78px); min-height: 600px;
    display: grid; grid-template-columns: minmax(0, 1fr) 400px; grid-template-rows: auto minmax(0, 1fr); gap: 16px;
}
.packaging-head { grid-column: 1 / -1; display: grid; gap: 12px; padding: 12px 20px 16px; }
.packaging-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.packaging-state.status-chip { padding: 6px 14px; font-size: 15px; }
.packaging-name { font-size: 13px; font-weight: 500; color: var(--muted); }
.packaging-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 1.5fr); gap: 12px 20px; align-items: end; }
.packaging-fields.no-device { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.6fr); }
.packaging-fields.is-readonly { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.packaging-device, .packaging-group { display: flex; align-items: center; gap: 10px; min-width: 0; }
.packaging-device-select, .packaging-group-name { flex: 1 1 auto; min-width: 0; }
.packaging-daily { flex: none; width: 104px; }
.packaging-group .dx-switch { flex: none; }
.packaging-items { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.packaging-items .card-head { padding: 10px 18px; }
.packaging-group-hint.status-chip { white-space: nowrap; }
.packaging-grid { flex: 1 1 auto; min-height: 0; }
.packaging-grid.sts-grid { border: 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); box-shadow: none; }
.packaging-side { display: flex; flex-direction: column; gap: 16px; min-height: 0; overflow-y: auto; }
/* Elle ekleme: süre + paketteki adet, paket sayısı + Ekle iki satırda (820 px yüksek terminal penceresinde kart kaymasın). */
.manual-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 12px; align-items: end; }
.manual-grid .manual-row { margin-bottom: 14px; }
.manual-grid .manual-row:nth-last-child(-n+2) { margin-bottom: 0; }
.manual-add .dx-button { width: 100%; }
/* Paketleme Bitir sonrası etiket özeti: yazıcı başına basılan / basılamayan. */
.label-summary { display: grid; gap: 6px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.label-summary-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-size: 13.5px; }
.label-summary-printer { font-weight: 600; color: var(--text); overflow-wrap: anywhere; }
.label-summary-count { color: var(--ok-700); font-weight: 600; font-variant-numeric: tabular-nums; }
.label-summary-row.is-failed .label-summary-count, .label-summary-row.is-failed { color: var(--bad-700); }
.packaging-action.dx-button { min-height: 40px; }
.packaging-action.dx-button .dx-button-text { font-size: 15px; }
/* SKT'si geçmiş paket (Tek Paketler, WPF #366). */
.cell-expired { color: var(--bad-700); font-weight: 600; }
/* Dar kolonların WPF başlıkları ("Ster. Kal. Sür.", "Günlük Döngü") kesilmesin: başlık satırı gerekirse iki satıra iner (paketleme tabloları). */
.grid-wrap-headers .dx-datagrid-headers .dx-datagrid-table .dx-header-row > td { white-space: normal; vertical-align: bottom; }
.grid-wrap-headers .dx-datagrid-headers .dx-header-row .dx-datagrid-text-content { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.25; }
/* Ortam + sterillik hücresi: uzun ortam adı kısalır, rozet hep görünür. */
.stage-cell { display: flex; align-items: center; gap: 8px; min-width: 0; }
.stage-cell-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stage-cell .status-chip { flex: none; }

/* Paket ekranı: set ekranının kartı (.set-head / .set-device) + paket geçmişi. */
.package-screen { height: calc(100% - 78px); min-height: 560px; display: flex; flex-direction: column; gap: 16px; }
.package-history { flex: 1 1 auto; min-height: 300px; display: flex; flex-direction: column; overflow: hidden; }
.package-history .card-head { padding: 10px 18px; }
.package-screen .set-fields { grid-template-columns: repeat(5, minmax(0, 1fr)); }

@media (max-width: 1700px) {
    .packaging { grid-template-columns: minmax(0, 1fr) 340px; }
}
@media (max-width: 1500px) {
    .packaging { grid-template-columns: minmax(0, 1fr) 320px; }
    .packaging-fields, .packaging-fields.no-device { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .packaging-fields.is-readonly { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
    .packaging, .package-screen { height: auto; }
    .packaging { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
    .packaging-items { min-height: 460px; }
    .packaging-fields.is-readonly { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------------------------------------------------------------- Faz 3: Steril Depo (#49) — teslimat / iade / transfer ekranı kabul ekranının ızgarası
   (.reception*), listeler kabul listesinin düzeni (.reception-list). Burada yalnız depoya özgüler: SKT onayı, stok farkı, hareket yönü, Depodan Çıkar. */
.depot-fields-transfer { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cell-strong-text { font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; }
.depot-operation .cell-chip-line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 3px; }
.depot-operation .cell-chip-line .cell-sub { margin-top: 0; }
.approval-chip.status-chip { padding: 1px 8px; font-size: 11.5px; }
/* #357 SKT'si geçmiş misafir set onayı: setin adı / barkodu / SKT'si kutuda, altında zorunlu not. */
.approval-facts { display: grid; gap: 6px; margin-bottom: 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-2); }
.approval-name { font-size: 16px; font-weight: 700; color: var(--text); overflow-wrap: anywhere; }
.approval-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
/* Mevcut Stok: depodaki paket adedi + stoktan fazlaysa fark rozeti (#366), satır açık sarı. */
.stock-listed { display: inline-flex; align-items: center; gap: 10px; }
.stock-listed b { font-weight: 600; font-variant-numeric: tabular-nums; min-width: 32px; text-align: right; }
.sts-grid .dx-datagrid-rowsview .dx-row.row-warning > td { background: var(--warn-50); }
/* Stok Hareketleri: adet hareketin yönüyle renkli. */
.movement-in { color: var(--ok-700); font-weight: 700; }
.movement-out { color: var(--bad-700); font-weight: 700; }
/* ÇKM kullanımı: kalan iri, "sayı / sınır" silik. */
.usage-remaining { font-weight: 700; font-variant-numeric: tabular-nums; }
.usage-detail { margin-left: 8px; color: var(--muted); font-size: 12.5px; font-variant-numeric: tabular-nums; }

/* Stok Düzeltme penceresi. */
.depot-correction .reception-field-label { margin-top: 12px; }
.depot-correction .reception-field-label:first-of-type { margin-top: 0; }
.depot-correction-inputs { display: flex; align-items: center; gap: 12px; }
.depot-correction-quantity { flex: none; width: 170px; }
.depot-current-chip:empty { display: none; }

/* #366 Depodan Çıkar: üstte kip + uyuşmazlık özeti, barkod / seçim şeridi, aday tablosu (pencerenin kalanını doldurur), altta neden / stoktan düş / not. */
.depot-dialog .dx-popup-content { overflow: hidden; padding: 16px 20px 16px; }
.depot-removal { height: 100%; display: flex; flex-direction: column; gap: 12px; min-height: 0; }
.depot-removal-top { display: flex; align-items: center; gap: 12px; }
.depot-removal-summary { display: grid; gap: 6px; }
.depot-removal-summary.is-hidden { display: none; }
.depot-summary-count { font-weight: 600; color: var(--warn-700); }
/* Çok sarfta rozetler ~3 satır yükseklikte kendi içinde kayar (tablo pencerede kalsın). */
.depot-summary-chips { display: flex; flex-wrap: wrap; gap: 6px; max-height: 92px; overflow-y: auto; padding-right: 4px; }
.depot-summary-chip { display: inline-flex; padding: 3px 10px; border-radius: 999px; background: var(--warn-50); color: var(--warn-700); font-size: 12.5px; font-weight: 600; }
.depot-summary-ok { color: var(--ok-700); font-weight: 600; }
.depot-removal-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.depot-removal-barcode { width: 300px; }
.depot-removal-info { margin-left: auto; color: var(--text-2); font-weight: 600; font-variant-numeric: tabular-nums; }
.depot-removal-grid { flex: 1 1 auto; min-height: 220px; }
.depot-removal-footer { display: grid; grid-template-columns: minmax(260px, 340px) auto minmax(0, 1fr); align-items: end; gap: 12px 20px; }
.depot-removal-deduct { padding-bottom: 6px; white-space: nowrap; }
.depot-removal-field { min-width: 0; }
@media (max-width: 1100px) {
    .depot-removal-footer { grid-template-columns: minmax(0, 1fr); }
}

/* ---------------------------------------------------------------- Faz 4: bildirimler (#53) — zil + panel, menü rozeti, Bildirimler sayfası, pano kartı
   Önem renkleri: Uyarı kehribar (--warn-500 / --warn), Bilgi mavi (--info), Kritik kırmızı (#54). Rozet = dikkat isteyen başlık sayısı. */
.notify-bell { position: relative; margin-left: 2px; }
.notify-bell[aria-expanded="true"] { background: var(--surface-2); color: var(--text); }
.notify-badge {
    position: absolute; top: 0; right: -2px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px; border: 2px solid var(--surface);
    background: var(--warn); color: #fff; font-size: 11px; font-weight: 700; line-height: 15px; text-align: center; font-variant-numeric: tabular-nums;
}
.notify-badge.is-critical { background: var(--bad); }
.notify-badge[hidden], .nav-badge[hidden] { display: none; }
.nav-badge {
    flex: none; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--warn); color: #fff;
    font-size: 11.5px; font-weight: 700; line-height: 20px; text-align: center; font-variant-numeric: tabular-nums;
}
.nav-badge.is-critical { background: var(--bad); }
/* Daraltılmış menüde rozet simgenin köşesinde nokta. */
@media (min-width: 1101px) {
    .sidebar-collapsed .nav-badge { position: absolute; top: 6px; right: 12px; min-width: 9px; width: 9px; height: 9px; padding: 0; font-size: 0; border: 2px solid var(--surface); box-sizing: content-box; }
}
/* Eski adlar (WPF'in uyarı listeleri) yalnız Ctrl+K aramasında. */
.nav-alias { display: none !important; }

.notify-dot { flex: none; width: 10px; height: 10px; border-radius: 999px; background: var(--info); }
.notify-dot.level-2 { background: var(--warn-500); }
.notify-dot.level-3 { background: var(--bad); }

.notify-popover .dx-popup-content { padding: 0; }
.notify-panel { display: flex; flex-direction: column; min-width: 0; }
.notify-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px 12px; border-bottom: 1px solid var(--line); }
.notify-panel-titles { display: grid; gap: 2px; min-width: 0; }
.notify-panel-titles strong { font-size: 15px; color: var(--text); }
.notify-panel-titles span { font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notify-panel-link { flex: none; font-size: 13px; font-weight: 600; white-space: nowrap; }
.notify-panel .notify-list { padding: 6px; }
.notify-loading { height: 72px; }
.notify-list { display: grid; align-content: start; gap: 2px; }
.notify-row {
    display: grid; grid-template-columns: 10px minmax(0, 1fr) auto 16px; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 8px;
    color: var(--text); text-decoration: none;
}
.notify-row:hover { background: var(--surface-2); }
.notify-row:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.notify-row-text { display: grid; gap: 1px; min-width: 0; }
.notify-row-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notify-row-parts { font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notify-row-count { font-size: 15px; font-weight: 700; color: var(--info); font-variant-numeric: tabular-nums; }
.notify-row.level-2 .notify-row-count { color: var(--warn-700); }
.notify-row.level-3 .notify-row-count { color: var(--bad-700); }
.notify-row-go { width: 16px; height: 16px; color: var(--faint); }
.notify-empty { display: grid; justify-items: center; gap: 4px; padding: 24px 16px 26px; text-align: center; color: var(--muted); font-size: 13px; }
.notify-empty strong { color: var(--text); font-size: 15px; }
.notify-empty-icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 6px; border-radius: 999px; background: var(--ok-50); color: var(--ok); }
.notify-empty-icon .icon { width: 24px; height: 24px; }

/* Sayfa: kutucuklar (önem şeridi + sayı + başlık + kırılım; seçili kutucuk turuncu çerçeve) ve liste. */
.notify-page { gap: 14px; }
.notify-tiles { flex: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.notify-tile {
    position: relative; display: grid; gap: 2px; min-width: 0; padding: 12px 14px 12px 18px; overflow: hidden;
    border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm);
    font: inherit; text-align: left; color: var(--text); cursor: pointer; transition: border-color .12s, box-shadow .12s, background .12s;
}
.notify-tile::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--info); }
.notify-tile.level-2::before { background: var(--warn-500); }
.notify-tile.level-3::before { background: var(--bad); }
.notify-tile.is-clear::before { background: var(--line-strong); }
.notify-tile:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.notify-tile:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.notify-tile.is-selected { border-color: var(--brand); background: var(--brand-50); box-shadow: 0 0 0 1px var(--brand); }
.notify-tile-level { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.notify-tile-level .notify-dot { width: 8px; height: 8px; }
.notify-tile.is-clear .notify-dot { background: var(--line-strong); }
.notify-tile-count { font-size: 26px; font-weight: 700; line-height: 1.2; color: var(--info); font-variant-numeric: tabular-nums; }
.notify-tile.level-2 .notify-tile-count { color: var(--warn-700); }
.notify-tile.level-3 .notify-tile-count { color: var(--bad-700); }
.notify-tile.is-clear .notify-tile-count { color: var(--faint); }
.notify-tile-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notify-tile-parts { min-height: 17px; font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notify-cat { display: inline-flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.notify-cat-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.notify-kind { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; max-width: 100%; }
.notify-kind .kind-chip { padding: 2px 8px; font-size: 12px; }
.notify-status { display: grid; justify-items: start; gap: 2px; min-width: 0; }
.notify-status-line { display: flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.notify-status-line .status-chip { flex: none; }
.notify-status-date { min-width: 0; font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.notify-status-detail { max-width: 100%; font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Panonun "Dikkat gerektirenler" kartı: zil panelinin satırları. */
.widget-attention .widget-body { overflow-y: auto; }
.widget-attention .notify-list { padding: 6px 8px 8px; }
/* Sayaç kartından Bildirimler sayfasına (düzenlemede kart sürüklenir, tıklama gezinmez). */
.widget-kpi.kpi-link { cursor: pointer; transition: box-shadow .12s, border-color .12s; }
.widget-kpi.kpi-link:hover { border-color: var(--line-strong); box-shadow: var(--shadow); }
.widget-kpi.kpi-link:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.dashboard-grid.is-editing .widget-kpi.kpi-link { cursor: move; }

/* ---------------------------------------------------------------- Faz 4: kritik olaylar (#54) — kırmızı şerit (üst çubuğun altında, herkese), zil paneli
   ve Bildirimler sayfasındaki kartlar, ayrıntı sayfası. Kırmızı yalnız onay bekleyen olayda; onaylanan yeşil, 7 günden eski gri. */
.critical-band {
    flex: none; position: relative; z-index: 4; display: flex; align-items: center; gap: 14px; min-width: 0; padding: 10px 16px 10px 14px;
    background: linear-gradient(90deg, #B91C1C, #DC2626); color: #fff; border-bottom: 1px solid #991B1B; box-shadow: 0 2px 6px rgba(153, 27, 27, .22);
}
.critical-band.is-min { padding-top: 5px; padding-bottom: 5px; }
.critical-band-icon { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 999px; background: rgba(255, 255, 255, .18); }
.critical-band.is-min .critical-band-icon { width: 26px; height: 26px; }
.critical-band-icon .icon { width: 20px; height: 20px; }
.critical-band.is-min .critical-band-icon .icon { width: 15px; height: 15px; }
.critical-band-text { flex: 1 1 auto; display: grid; gap: 1px; min-width: 0; }
.critical-band-title { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.critical-band.is-min .critical-band-title { font-size: 14px; }
.critical-band-sub { font-size: 13px; color: rgba(255, 255, 255, .92); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.critical-band-tag {
    flex: none; padding: 1px 8px; border-radius: 999px; background: #fff; color: var(--bad-700);
    font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; line-height: 17px;
}
.critical-band-actions { flex: none; display: flex; align-items: center; gap: 8px; }
.critical-band-pager { display: inline-flex; align-items: center; gap: 2px; margin-right: 2px; font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.critical-band-count { min-width: 36px; text-align: center; }
.critical-band-nav { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: #fff; cursor: pointer; }
.critical-band-nav:hover { background: rgba(255, 255, 255, .16); }
.critical-band-nav .icon { width: 16px; height: 16px; }
.critical-band-button {
    display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 1px solid rgba(255, 255, 255, .6); border-radius: 8px;
    background: transparent; color: #fff; font: inherit; font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.critical-band.is-min .critical-band-button { height: 28px; }
.critical-band-button:hover { background: rgba(255, 255, 255, .14); color: #fff; }
.critical-band-button.is-solid { background: #fff; border-color: #fff; color: var(--bad-700); }
.critical-band-button.is-solid:hover { background: #FEF2F2; color: var(--bad-700); }
.critical-band-button .icon { width: 16px; height: 16px; }
.critical-band button:focus-visible, .critical-band a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
@media (max-width: 1100px) {
    .critical-band { flex-wrap: wrap; }
    .critical-band-actions { margin-left: auto; }
}

/* Zil paneli / pano kartı: önce kritik olaylar (kırmızı kartlar), sonra başlıklar. */
.notify-section-title { padding: 8px 10px 4px; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.notify-section-title.is-critical { color: var(--bad-700); }
.notify-critical-list { display: grid; gap: 6px; padding: 2px 0 6px; }
.notify-critical {
    display: grid; grid-template-columns: 32px minmax(0, 1fr) 16px; align-items: center; gap: 10px; padding: 9px 10px;
    border: 1px solid #F5C2C2; border-left: 4px solid var(--bad); border-radius: 8px; background: var(--bad-50); color: var(--text); text-decoration: none;
}
.notify-critical:hover { background: #FBDCDC; }
.notify-critical:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.notify-critical-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 999px; background: var(--bad); color: #fff; }
.notify-critical-icon .icon { width: 17px; height: 17px; }
.notify-critical-text { display: grid; gap: 1px; min-width: 0; }
.notify-critical-title { font-weight: 700; color: var(--bad-700); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notify-critical-sub { font-size: 12.5px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notify-critical .notify-row-go { color: var(--bad-700); }

/* Bildirimler sayfası: kutucukların üstünde kapsamdaki etkin kritik olaylar. */
.critical-cards { flex: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 12px; }
.critical-card {
    display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 14px; min-width: 0; padding: 12px 14px;
    border: 1px solid #F5C2C2; border-left: 5px solid var(--bad); border-radius: var(--radius); background: var(--bad-50); color: var(--text);
    text-decoration: none; box-shadow: var(--shadow-sm); transition: box-shadow .12s, border-color .12s;
}
.critical-card:hover { border-color: #EFA3A3; box-shadow: var(--shadow); }
.critical-card:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.critical-card-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 999px; background: var(--bad); color: #fff; }
.critical-card-icon .icon { width: 21px; height: 21px; }
.critical-card-text { display: grid; gap: 2px; min-width: 0; }
.critical-card-title { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 15px; font-weight: 700; color: var(--bad-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.critical-card-sub { font-size: 12.5px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.critical-card-go { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 8px; background: var(--bad); color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; }
.critical-card-go .icon { width: 16px; height: 16px; }
.critical-card .critical-band-tag, .critical-hero .critical-band-tag { background: var(--bad); color: #fff; }
.critical-hero.is-acknowledged .critical-band-tag { background: var(--ok); }
.critical-hero.is-past .critical-band-tag { background: var(--faint); }

/* Ayrıntı: olay kartı (tam genişlik), altında yük (sol) + onay ve zaman çizelgesi (sağ). */
.critical-page { display: grid; gap: 16px; }
.critical-hero {
    display: grid; grid-template-columns: 56px minmax(0, 1fr) minmax(340px, 38%); gap: 18px; align-items: start; padding: 18px 20px;
    border: 1px solid #F5C2C2; border-left: 6px solid var(--bad); border-radius: var(--radius-lg); background: var(--bad-50); box-shadow: var(--shadow-sm);
}
.critical-hero.is-acknowledged { border-color: #BFE3CD; border-left-color: var(--ok); background: var(--ok-50); }
.critical-hero.is-past { border-color: var(--line); border-left-color: var(--faint); background: var(--surface); }
.critical-hero-icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 999px; background: var(--bad); color: #fff; }
.critical-hero.is-acknowledged .critical-hero-icon { background: var(--ok); }
.critical-hero.is-past .critical-hero-icon { background: var(--faint); }
.critical-hero-icon .icon { width: 28px; height: 28px; }
.critical-hero-main { display: grid; gap: 4px; min-width: 0; }
.critical-hero-top { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
/* Kartın zemini durum çipinin zeminiyle aynı renk: çip beyaz zeminde çerçeveli. */
.critical-hero-top .status-chip { background: var(--surface); border: 1px solid currentColor; padding: 2px 10px; }
.critical-hero-title { font-size: 22px; font-weight: 700; line-height: 1.25; color: var(--bad-700); letter-spacing: -.01em; }
.critical-hero.is-acknowledged .critical-hero-title { color: var(--ok-700); }
.critical-hero.is-past .critical-hero-title { color: var(--text); }
.critical-hero-source { font-size: 14.5px; font-weight: 600; color: var(--text-2); }
.critical-hero-advice { margin: 6px 0 0; max-width: 820px; color: var(--text-2); }
.critical-facts {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; margin: 0; padding: 12px 16px;
    border: 1px solid rgba(15, 23, 42, .07); border-radius: var(--radius); background: rgba(255, 255, 255, .8);
}
.critical-fact { display: grid; gap: 1px; min-width: 0; }
.critical-fact.is-wide { grid-column: 1 / -1; }
.critical-fact dt { font-size: 12px; font-weight: 500; color: var(--muted); }
.critical-fact dd { margin: 0; font-weight: 600; color: var(--text); overflow-wrap: anywhere; }
.critical-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; align-items: start; }
.critical-panel-titles { display: grid; gap: 2px; min-width: 0; }
.critical-load { display: flex; flex-direction: column; min-height: 440px; }
.critical-load.is-empty { min-height: 0; }
.critical-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.critical-chip {
    display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 6px 0 12px; border: 1px solid var(--line); border-radius: 999px;
    background: var(--surface); font: inherit; font-size: 13px; font-weight: 600; color: var(--text-2); cursor: pointer;
}
.critical-chip:hover { border-color: var(--line-strong); background: var(--surface-2); }
.critical-chip:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.critical-chip.is-selected { border-color: var(--brand); background: var(--brand-50); color: var(--text); box-shadow: 0 0 0 1px var(--brand); }
.critical-chip.is-here { border-color: #EFA3A3; color: var(--bad-700); }
.critical-chip-count {
    min-width: 24px; padding: 1px 7px; border-radius: 999px; background: var(--bad-50); color: var(--bad-700);
    font-size: 12px; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums;
}
.critical-chip.is-all .critical-chip-count, .critical-chip.is-here .critical-chip-count { background: var(--bad); color: #fff; }
.critical-chip.is-done .critical-chip-count { background: var(--ok-50); color: var(--ok-700); }
.critical-grid { flex: 1 1 auto; min-height: 320px; }
.critical-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
.critical-name .kind-chip { flex: none; padding: 2px 8px; font-size: 12px; }
.critical-name-text { min-width: 0; font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.critical-cell-line { display: flex; align-items: center; gap: 8px; min-width: 0; }
.critical-cell-line .status-chip { flex: none; }
.critical-cell-muted { min-width: 0; font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.critical-cell-state { display: grid; justify-items: start; gap: 2px; min-width: 0; }
.critical-history-ack { display: grid; gap: 1px; min-width: 0; }
.critical-history-ack-by { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.critical-cell-state a.status-chip { text-decoration: none; }
.critical-cell-state a.status-chip:hover { text-decoration: underline; }
.critical-empty { display: grid; justify-items: center; gap: 8px; padding: 28px 16px 32px; color: var(--muted); text-align: center; }
.critical-empty-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 999px; background: var(--ok-50); color: var(--ok); }
.critical-empty-icon .icon { width: 24px; height: 24px; }
.critical-side { display: grid; gap: 16px; align-content: start; min-width: 0; }
.critical-ack-done, .critical-ack-wait { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 12px; padding: 12px; border-radius: var(--radius); background: var(--ok-50); }
.critical-ack-wait { background: var(--surface-2); border: 1px solid var(--line); }
.critical-ack-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 999px; background: var(--ok); color: #fff; }
.critical-ack-wait .critical-ack-icon { background: var(--faint); }
.critical-ack-icon .icon { width: 20px; height: 20px; }
.critical-ack-text { display: grid; gap: 2px; min-width: 0; }
.critical-ack-meta { font-size: 12.5px; color: var(--muted); }
.critical-ack-note { margin: 12px 0 0; padding: 10px 14px; border-left: 3px solid var(--ok); border-radius: 0 8px 8px 0; background: var(--surface-2); color: var(--text); white-space: pre-wrap; overflow-wrap: anywhere; }
.critical-ack-actions { display: flex; justify-content: flex-end; margin-top: 12px; }
.critical-timeline-list { display: grid; margin: 0; padding: 0; list-style: none; }
.critical-step { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; padding-bottom: 14px; }
.critical-step:last-child { padding-bottom: 0; }
.critical-step:not(:last-child)::before { content: ''; position: absolute; left: 14px; top: 32px; bottom: 2px; width: 2px; border-radius: 2px; background: var(--line); }
.critical-step-icon { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-2); color: var(--muted); }
.critical-step-icon .icon { width: 15px; height: 15px; }
.critical-step.tone-danger .critical-step-icon { border-color: #F5C2C2; background: var(--bad-50); color: var(--bad-700); }
.critical-step.tone-warn .critical-step-icon { border-color: #F3D9A5; background: var(--warn-50); color: var(--warn-700); }
.critical-step.tone-ok .critical-step-icon { border-color: #BFE3CD; background: var(--ok-50); color: var(--ok-700); }
.critical-step.is-pending .critical-step-icon { border-style: dashed; background: var(--surface); }
.critical-step-text { display: grid; gap: 1px; min-width: 0; padding-top: 4px; }
.critical-step-text > strong, .critical-step-text > a { font-weight: 600; }
.critical-step.is-pending .critical-step-text > strong { color: var(--muted); }
.critical-step-detail { font-size: 13px; color: var(--text-2); overflow-wrap: anywhere; }
.critical-step-meta { font-size: 12.5px; color: var(--muted); }
@media (max-width: 1500px) {
    .critical-hero { grid-template-columns: 56px minmax(0, 1fr); }
    .critical-facts { grid-column: 2 / -1; }
}
@media (max-width: 1100px) {
    .critical-layout { grid-template-columns: minmax(0, 1fr); }
    .critical-hero { grid-template-columns: minmax(0, 1fr); }
    .critical-hero-icon { display: none; }
    .critical-facts { grid-column: auto; }
}

/* ---------------------------------------------------------------- Faz 5: Raporlar (#57) — Yönetim Özeti (#58): "şu an" şeridi, gösterge kartları,
   grafik kartları, okutma yoğunluğu ve A4 yatay baskı (body.report-printing: sayfa baskı genişliğine alınır, grafikler yeniden çizilir). */
.report-view { display: flex; flex-direction: column; gap: 16px; }
.report-now { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 10px 16px; background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.report-now-title { display: inline-flex; align-items: center; gap: 7px; color: var(--text); }
.report-now-title .icon { width: 17px; height: 17px; color: var(--navy); }
.report-now-title small { color: var(--muted); font-size: 12px; }
.report-now-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; }
.report-now-more { margin-left: auto; }
.report-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
    border: 1px solid var(--line); color: var(--text-2); background: var(--surface-2); text-decoration: none; white-space: nowrap; }
.report-chip b { font-weight: 800; color: var(--text); font-variant-numeric: tabular-nums; }
a.report-chip:hover { border-color: var(--line-strong); }
.report-chip.crit { background: #B91C1C; border-color: #B91C1C; color: #fff; }
.report-chip.crit b { color: #fff; }
.report-chip.calm { background: var(--ok-50); border-color: #BFE3CF; color: var(--ok-700); }
.report-chip.lv2 { background: var(--warn-50); border-color: #F6D9A8; color: var(--warn-700); }
.report-chip.lv1 { background: var(--info-50); border-color: #CFE0F5; color: var(--navy-700); }
.report-link { color: var(--brand-700); font-weight: 700; font-size: 12.5px; text-decoration: none; white-space: nowrap; }
.report-link:hover { text-decoration: underline; }
.report-period { display: flex; align-items: baseline; gap: 12px; margin: 2px 2px -4px; }
.report-period b { font-size: 16px; font-weight: 700; color: var(--text); }
.report-period span { font-size: 12.5px; color: var(--muted); }
.report-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.report-kpi { min-width: 0; padding: 14px 16px 13px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.report-kpi-top { display: flex; align-items: center; gap: 8px; }
.report-kpi-icon { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--navy-50); color: var(--navy); flex: none; }
.report-kpi-icon .icon { width: 16px; height: 16px; }
.report-kpi-label { font-size: 13px; font-weight: 600; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-delta { margin-left: auto; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 800; white-space: nowrap; font-variant-numeric: tabular-nums;
    cursor: default; }
.report-delta.good { background: var(--ok-50); color: var(--ok-700); }
.report-delta.bad { background: var(--bad-50); color: var(--bad-700); }
.report-delta.neutral { background: var(--surface-2); color: var(--text-2); border: 1px solid var(--line); }
.report-kpi-value { margin-top: 8px; font-size: 30px; line-height: 1.1; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; letter-spacing: -.3px; }
.report-kpi-sub { margin-top: 4px; font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-row { display: grid; gap: 16px; }
.report-row-21 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.report-row-11 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.report-card { padding: 14px 16px 12px; }
.report-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; min-height: 24px; }
.report-card-head h2 { margin: 0; font-size: 15px; font-weight: 700; color: var(--text); white-space: nowrap; }
.report-card-head small { color: var(--muted); font-size: 12.5px; white-space: nowrap; }
.report-legend { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); white-space: nowrap; }
.report-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-left: 8px; }
.report-legend i.line { height: 3px; border-radius: 2px; }
.report-more { margin-left: auto; }
.report-chart { height: 260px; }
.report-empty { display: grid; place-items: center; height: 100%; min-height: 140px; color: var(--muted); font-size: 13.5px; }
.report-bars { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
.report-bar { display: grid; grid-template-columns: 1fr auto; row-gap: 5px; font-size: 13px; color: var(--text-2); }
.report-bar b { font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.report-bar i { grid-column: 1 / -1; display: block; height: 8px; border-radius: 99px; background: var(--surface-2); overflow: hidden; }
.report-bar s { display: block; height: 100%; border-radius: 99px; background: var(--navy-500); text-decoration: none; }
.report-hint { margin: 8px 0 0; font-size: 12px; color: var(--muted); }
.report-events { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; }
.report-events-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; font-size: 13px; color: var(--text); }
.report-events-empty { padding: 8px 0; font-size: 13px; color: var(--muted); }
.report-event { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 8px; text-decoration: none; color: var(--text-2); }
.report-event:hover { background: var(--surface-2); }
.report-event-dot { width: 9px; height: 9px; border-radius: 99px; background: var(--faint); flex: none; }
.report-event.pending .report-event-dot { background: #DC2626; }
.report-event-body { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.report-event-body b { font-size: 13px; font-weight: 700; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-event-body small { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-event-state { font-size: 11.5px; font-weight: 700; color: var(--muted); white-space: nowrap; }
.report-event.pending .report-event-state { color: var(--bad-700); }
.report-heat-grid { display: grid; grid-template-columns: 44px repeat(24, minmax(0, 1fr)); gap: 3px; align-items: center; }
.report-heat-grid span { font-size: 11px; color: var(--muted); }
.report-heat-grid .dd { font-weight: 600; color: var(--text-2); }
.report-heat-grid .cc { height: 28px; border-radius: 4px; border: 1px solid rgba(15, 23, 42, .05); }
.report-print-head { display: none; }
.report-presets .dx-button { min-width: 0; }
@media (max-width: 1440px) {
    .report-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1280px) {
    .report-row-21, .report-row-11 { grid-template-columns: minmax(0, 1fr); }
}
/* Faz 5 adım 2 (#59): Cihazlar ve Döngüler + Testler — süzgeç satırı, kartın içindeki tablolar, sekmeler, test türü toplamları ve Bowie-Dick takvimi
   (otoklav × gün; yargısız bilgi — yalnız başarısız test kırmızı). */
.report-filter-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.report-filter-row .report-period { margin: 0; }
.report-table-card { padding: 0; overflow: hidden; }
.report-table-card > .sts-grid { border: 0; border-radius: 0; box-shadow: none; }
.report-tabs-head { display: flex; align-items: center; gap: 12px; padding: 4px 12px 0 8px; border-bottom: 1px solid var(--line); }
.report-tabs-head .dx-tabs { width: auto; }
.report-card-pad { padding-left: 16px; padding-right: 16px; }
.report-card-head.report-card-pad { padding-top: 12px; margin-bottom: 4px; }
.report-chart.report-card-pad { padding-bottom: 8px; }
.report-card-actions { margin-left: auto; display: inline-flex; gap: 2px; }
.report-hinted { border-bottom: 1px dotted var(--faint); cursor: help; }
.report-test-totals { display: flex; flex-wrap: wrap; gap: 10px; }
.report-test-total { display: flex; flex-direction: column; min-width: 150px; padding: 10px 14px; background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.report-test-total .name { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.report-test-total b { margin-top: 2px; font-size: 22px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.report-test-total small { font-size: 12px; font-weight: 700; color: var(--bad-700); }
.report-cal-wrap { overflow-x: auto; }
.report-cal { display: grid; gap: 3px; align-items: center; min-width: min-content; }
.report-cal span { font-size: 12px; color: var(--text-2); }
.report-cal .head { font-size: 11px; color: var(--muted); text-align: center; }
.report-cal .head.weekend, .report-cal .cell.weekend { background: var(--surface-2); }
.report-cal .head.sum, .report-cal .sum { text-align: right; padding-right: 4px; white-space: nowrap; }
.report-cal .head.sum { white-space: normal; line-height: 1.25; }
.report-cal .sum { font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.report-cal .name { font-weight: 600; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.report-cal .cell { display: grid; place-items: center; height: 26px; border-radius: 4px; border: 1px solid var(--line); font-weight: 700; color: var(--navy-700); }
.report-cal .cell.failed { background: var(--bad-50); border-color: #F5C2C2; color: var(--bad-700); }
.report-cal-legend { gap: 4px; }
.report-cal-mark { display: inline-grid; place-items: center; width: 18px; height: 18px; margin-left: 10px; border-radius: 4px; border: 1px solid var(--line);
    font-weight: 700; color: var(--navy-700); }
.report-cal-mark.failed { background: var(--bad-50); border-color: #F5C2C2; color: var(--bad-700); }
/* Faz 5 adım 3 (#60): Setler — kullanım dağılımı şeridi (0 = atıl gri, sonra lacivert tonları); Alet Durumu — sekme notu; İzlenebilirlik — arama satırı,
   sonuç başlığı, hasta zinciri kartları (kayıt → malzeme → kullanımdan önceki son sterilizasyon + testler), adaylar. */
.report-usage { padding-bottom: 12px; }
.report-usage-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.report-usage-head b { font-size: 13px; font-weight: 700; color: var(--text); }
.report-usage-head small { font-size: 12px; color: var(--muted); }
.report-usage-track { display: flex; gap: 2px; height: 24px; border-radius: 6px; overflow: hidden; background: var(--surface-2); }
.report-usage-seg { display: grid; place-items: center; min-width: 34px; flex-basis: 0; font-size: 12px; font-weight: 700; color: #fff;
    font-variant-numeric: tabular-nums; cursor: default; }
.report-usage .u0 { background: #CBD5E1; color: var(--text-2); }
.report-usage .u1 { background: #A7C3DC; color: #0B3A5B; }
.report-usage .u2 { background: #6F9CC4; }
.report-usage .u3 { background: #3D6E99; }
.report-usage .u4 { background: #0B3A5B; }
.report-usage-legend { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 7px; font-size: 12px; color: var(--muted); }
.report-usage-key { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.report-usage-key i { width: 10px; height: 10px; border-radius: 3px; }
.report-tabs-note { margin-left: 8px; font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.trace-search-row { flex-wrap: nowrap; }
.trace-search { flex: 0 1 560px; min-width: 260px; }
.trace-result { display: flex; flex-direction: column; gap: 16px; }
.trace-head { padding: 14px 16px 12px; }
.trace-head-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.trace-head-top h2 { margin: 0; font-size: 17px; font-weight: 700; color: var(--text); }
.trace-scope { color: var(--muted); font-size: 12.5px; }
.trace-meta { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 10px; }
.trace-meta-item { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.trace-meta-item small { font-size: 11.5px; color: var(--muted); min-height: 14px; }
.trace-meta-item b { font-size: 13.5px; font-weight: 600; color: var(--text); }
.trace-head .report-hint { margin-top: 10px; }
.trace-record { padding: 0; overflow: hidden; }
.trace-record-head { display: flex; align-items: center; gap: 8px 14px; flex-wrap: wrap; padding: 10px 16px; border-bottom: 1px solid var(--line);
    background: var(--surface-2); font-size: 13px; color: var(--text-2); }
.trace-record-head b { color: var(--text); font-variant-numeric: tabular-nums; }
.trace-muted { color: var(--muted); font-size: 12.5px; }
.trace-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.trace-table th { text-align: left; font-weight: 600; font-size: 12px; color: var(--muted); padding: 8px 16px 6px; border-bottom: 1px solid var(--line); }
.trace-table td { padding: 8px 16px; border-bottom: 1px solid var(--line); vertical-align: middle; color: var(--text); }
.trace-table tr:last-child td { border-bottom: 0; }
.trace-table .trace-name { margin-left: 8px; font-weight: 600; }
.trace-table td .status-chip { margin-right: 4px; }
.trace-num { text-align: right; font-variant-numeric: tabular-nums; width: 64px; }
.trace-cycle-link, .trace-search-link { color: var(--navy-700); font-weight: 600; text-decoration: none; }
.trace-cycle-link:hover, .trace-search-link:hover { text-decoration: underline; }
.trace-critical { margin-left: 4px; color: var(--bad-700) !important; }
.trace-sub { display: block; font-size: 11.5px; color: var(--muted); }
.trace-records .dx-data-row { cursor: pointer; }
.trace-candidates h2 { margin: 0 0 8px; font-size: 15px; }
.trace-candidates h3 { margin: 12px 0 6px; font-size: 13px; color: var(--muted); font-weight: 600; }
.trace-candidate-list { display: flex; flex-direction: column; }
.trace-candidate { display: flex; align-items: center; gap: 12px; padding: 7px 4px; border-bottom: 1px solid var(--line); }
.trace-candidate:last-child { border-bottom: 0; }
/* A4 yatay baskı (2 sayfa: özet + iş hacmi / cihazlar, bölümler, yoğunluk): kabuk gizlenir, içerik baskı genişliğinde (report.js grafikleri bu genişliğe
   ve buradaki yüksekliklere yeniden çizer), kartlar sayfa arasında bölünmez. Adlandırılmış sayfa yalnız rapor basılırken (tablo baskısı dikey kalır). */
@page report { size: A4 landscape; margin: 10mm; }
body.report-printing .report-view { width: var(--report-print-width, 1040px); }
body.report-printing .report-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.report-printing .report-row-21 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
body.report-printing .report-row-11 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
body.report-printing .report-view { gap: 10px; }
body.report-printing #volumeChart { height: 205px; }
body.report-printing #devicesChart, body.report-printing #departmentsChart { height: 292px !important; }
body.report-printing .report-heat-grid .cc { height: 24px; }
body.report-printing .report-kpi { padding: 9px 12px; }
body.report-printing .report-kpi-label { font-size: 12px; }
body.report-printing .report-kpi-value { margin-top: 3px; font-size: 24px; }
body.report-printing .report-kpi-sub { white-space: normal; font-size: 11.5px; }
body.report-printing .report-now { padding: 7px 14px; }
body.report-printing .report-chip { padding: 2px 9px; font-size: 11.5px; }
body.report-printing .report-hint { display: none; }
body.report-printing .report-events a.report-event:nth-of-type(n+4) { display: none; }
body.report-printing .report-event { padding: 4px 6px; }
@media print {
    body.report-printing .sidebar, body.report-printing .topbar, body.report-printing .page-header, body.report-printing .critical-band,
    body.report-printing .backdrop, body.report-printing .report-more, body.report-printing .report-link { display: none !important; }
    body.report-printing { page: report; }
    body.report-printing .report-row-11 { break-before: page; }
    body.report-printing, body.report-printing .sts-app, body.report-printing .app, body.report-printing .main, body.report-printing .content {
        display: block !important; height: auto !important;
        overflow: visible !important; padding: 0 !important; margin: 0 !important; background: #fff !important; }
    body.report-printing .report-print-head { display: flex; align-items: baseline; gap: 14px; padding-bottom: 6px; border-bottom: 2px solid var(--brand);
        font-size: 12px; color: var(--muted); }
    body.report-printing .report-print-head b { font-size: 18px; color: var(--text); }
    body.report-printing .report-print-head span:last-child { margin-left: auto; }
    body.report-printing .report-kpi, body.report-printing .report-card, body.report-printing .report-now { box-shadow: none; break-inside: avoid; }
    body.report-printing .report-row { break-inside: avoid; }
    body.report-printing * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ---------------------------------------------------------------- Yapay Zeka Paneli (#66): solda liste, sağda seçili önerinin ayrıntısı */
/* Panel ekranın kalanını tam doldurur (düğme şeridi hep görünür): içerik bu sayfada esnek kolon — .page-fill'in %100'ü yapışkan başlık şeridiyle
   birlikte içeriği ~54 px taşırıyordu. Kısa pencerede en az 520 px; altında içerik kayar. */
.content:has(> .ai-page) { display: flex; flex-direction: column; }
.ai-page { flex: 1 1 auto; height: auto; min-height: 520px; }
.ai-layout { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(360px, 5fr) minmax(0, 8fr); grid-template-rows: minmax(0, 1fr); gap: 16px; }
.ai-list-panel, .ai-detail {
    min-height: 0; display: flex; flex-direction: column; overflow: hidden;
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm);
}
.ai-list { flex: 1 1 auto; min-height: 0; }
.ai-list .dx-list-item { border-top: 1px solid var(--line); }
.ai-list .dx-list-item:first-child { border-top-color: transparent; }
.ai-list .dx-list-item .dx-list-item-content { padding: 12px 16px; white-space: normal; }
/* Seçili öneri turuncu (Bildirimler'in seçili kutucuğu gibi); temanın gri seçim kuralları (0,4,0 – 0,6,0) bir sınıf fazlasıyla ezilir. */
.ai-list.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected,
.ai-list.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected.dx-state-hover:not(.dx-state-focused),
.ai-list.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused.dx-list-item-selected {
    background-color: var(--brand-50); color: var(--text); box-shadow: inset 3px 0 0 var(--brand);
}
.ai-list .dx-empty-message { padding: 24px 16px; color: var(--muted); }
.ai-item { display: grid; gap: 5px; min-width: 0; }
.ai-item-top { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 12px; color: var(--muted); }
.ai-item-cat { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; color: var(--text-2); }
.ai-item-date { margin-left: auto; flex: none; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ai-item-title {
    overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    font-weight: 600; line-height: 1.35; color: var(--text);
}
.ai-sev {
    flex: none; display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 999px;
    font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; background: var(--info-50); color: var(--info);
}
.ai-sev.level-2 { background: var(--warn-500); color: #fff; }
.ai-sev.level-3 { background: var(--bad); color: #fff; }
.ai-detail-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 20px 24px 24px; }
.ai-detail-head { display: grid; gap: 8px; margin-bottom: 14px; }
.ai-detail-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 12.5px; color: var(--muted); }
.ai-detail-title { margin: 0; font-size: 18px; line-height: 1.35; font-weight: 700; color: var(--text); }
.ai-body { margin: 0 0 14px; white-space: pre-wrap; line-height: 1.55; color: var(--text-2); }
.ai-generated {
    display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 8px 12px;
    border-radius: var(--radius-sm); background: var(--info-50); color: var(--info); font-size: 13px;
}
.ai-generated .icon { flex: none; width: 16px; height: 16px; }
.ai-section-title { margin: 4px 0 10px; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.ai-lines { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 18px; margin: 0 0 16px; }
.ai-lines dt { color: var(--muted); font-weight: 500; }
.ai-lines dd { margin: 0; color: var(--text); font-weight: 600; overflow-wrap: anywhere; }
.ai-table-grid { height: auto; }
/* Kanıt tablosu sığsın (7 kolonlu geri çağırma tablosu 1600'de en dar hâliyle 3 px taşıyordu): yan boşluk 16 → 10 px. Sözcük BÖLDÜRÜLMEZ
   (overflow-wrap: anywhere barkodları ikiye bölüyordu); daha dar pencerede tablo kendi içinde yatay kayar. */
.ai-table-grid .dx-datagrid .dx-row > td { padding-left: 10px; padding-right: 10px; }
.ai-table-grid .dx-row.is-link { cursor: pointer; }
.ai-table-note { margin: 8px 0 0; font-size: 12.5px; color: var(--muted); }
.ai-empty { display: grid; place-items: center; min-height: 220px; color: var(--muted); }
.ai-detail-actions {
    flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 24px;
    border-top: 1px solid var(--line); background: var(--surface-2);
}
.ai-feedback { margin-left: auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.ai-status { margin-right: 4px; font-size: 13px; color: var(--muted); white-space: nowrap; }
.ai-status.is-busy { color: var(--brand-700); font-weight: 600; }
@media (max-width: 1100px) {
    .ai-layout { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(220px, 38vh) minmax(0, 1fr); }
}