:root {
    /* Legacy tokens — mevcut bileşenler kullanır, dokunma */
    --dk-navy: #1B2C4F;
    --dk-navy-dark: #0F1B33;
    --dk-orange: #F97316;
    --dk-orange-light: #FFEDD5;
    --dk-green: #10B981;
    --dk-red: #DC2626;
    --dk-text: #1F2937;
    --dk-muted: #6B7280;
    --dk-border: #E5E7EB;
    --dk-bg: #F9FAFB;
    --dk-card: #FFFFFF;

    /* === ELITE SHELL TOKENS (yeni tasarım sistemi) === */
    --primary:        #1B2C4F;
    --primary-light:  #2A3E6A;
    --accent:         #F97316;
    --success:        #10B981;
    --warning:        #F59E0B;
    --danger:         #DC2626;

    /* Surface katmanları */
    --surface-0:      #F8FAFC;
    --surface-1:      #FFFFFF;
    --surface-2:      #FAFBFC;
    --surface-hover:  #F1F5F9;

    /* Text */
    --text:           #0F172A;
    --text-muted:     #64748B;
    --text-subtle:    #94A3B8;

    /* Border */
    --border:         #E2E8F0;
    --border-strong:  #CBD5E1;

    /* Shadow */
    --shadow-sm:      0 1px 2px rgba(15,23,42,.05);
    --shadow-md:      0 4px 12px rgba(15,23,42,.06);
    --shadow-lg:      0 10px 25px rgba(15,23,42,.10);
    --shadow-drawer:  -10px 0 30px rgba(15,23,42,.15);

    /* Radius */
    --r-sm: 6px;  --r-md: 8px;  --r-lg: 12px;  --r-xl: 16px;

    /* Spacing (4-point grid) */
    --s-1: 4px;  --s-2: 8px;  --s-3: 12px;  --s-4: 16px;
    --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px;

    /* Boyut sabitleri */
    --topbar-h:  56px;
    --sidebar-w: 60px;
    --drawer-w-md: 420px;
    --drawer-w-lg: 520px;
    --drawer-w-lgw: 780px;   /* lg +%50 — ölçüm detayı (alt bar 6 buton) için geniş */
    --drawer-w-xl: 1040px;
}

html, body {
    background: var(--dk-bg);
    color: var(--dk-text);
    font-family: 'Inter', system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* ---- Navbar ---- */
.dk-navbar {
    background: var(--dk-navy);
    border-bottom: 2px solid var(--dk-orange);
}
.dk-navbar .navbar-brand,
.dk-navbar .nav-link {
    color: rgba(255,255,255,0.92);
}
.dk-navbar .nav-link:hover { color: #fff; }
.dk-navbar .nav-link.active {
    color: #fff;
    border-bottom: 2px solid var(--dk-orange);
    padding-bottom: calc(0.5rem - 2px);
}
.dk-navbar .navbar-brand i {
    color: var(--dk-orange);
    font-size: 1.4rem;
}
.dk-navbar .text-secondary { color: #94A3B8 !important; }

/* Bağlantı rozeti */
.dk-conn-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 14px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #fff;
    height: 28px;
    min-width: 130px;
    justify-content: center;
}
.dk-conn-online  { background: var(--dk-green); }
.dk-conn-offline { background: #6B7280; }

/* ---- Stat kartları ---- */
.dk-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.dk-stat {
    background: var(--dk-card);
    border-radius: 8px;
    padding: 16px 18px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    border: 1px solid var(--dk-border);
}
.dk-stat-label {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--dk-muted);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.dk-stat-value {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--dk-text);
    margin-top: 4px;
}
.dk-stat-approved { background: #ECFDF5; border-color: #A7F3D0; }
.dk-stat-approved .dk-stat-label, .dk-stat-approved .dk-stat-value { color: #047857; }
.dk-stat-pending { background: #FFF7ED; border-color: #FDBA74; }
.dk-stat-pending .dk-stat-label, .dk-stat-pending .dk-stat-value { color: #9A3412; }

/* ============================================================
   Detaylı stat kartları (Dashboard) — .dk-stat-grid / .dk-stat-card
   Eski .dk-stats / .dk-stat dokunulmadı (stats-drawer'da kullanılır).

   Kompakt elit tasarım: 2 satır grid (label+ikon / value+detay),
   gradyansız beyaz zemin, sol kenarda 2px renk vurgusu.
   Yükseklik ~66-72px (önceki ~130px). Bilgi yoğunluğu artar,
   görsel gürültü azalır.
   ============================================================ */
.dk-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}

.dk-stat-card {
    --accent-color: var(--primary);
    --accent-tint:  rgba(27, 44, 79, 0.08);
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    column-gap: 10px;
    row-gap: 3px;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    padding: 10px 12px 10px 14px;
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}
.dk-stat-card:hover {
    border-color: var(--accent-color);
    box-shadow: var(--shadow-md);
}
.dk-stat-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 2px;
    background: var(--accent-color);
}

/* Renk accent şemaları — beyaz zemin, sadece accent rengi değişir */
.dk-stat-card[data-accent="primary"] { --accent-color: var(--primary);  --accent-tint: rgba(27,44,79,0.08); }
.dk-stat-card[data-accent="success"] { --accent-color: var(--success);  --accent-tint: rgba(16,185,129,0.10); }
.dk-stat-card[data-accent="warning"] { --accent-color: #F59E0B;          --accent-tint: rgba(245,158,11,0.10); }
.dk-stat-card[data-accent="accent"]  { --accent-color: var(--accent);    --accent-tint: rgba(249,115,22,0.10); }
.dk-stat-card[data-accent="info"]    { --accent-color: #3B82F6;          --accent-tint: rgba(59,130,246,0.10); }

/* Üst satır: label (sol) + ikon (sağ) */
.dk-stat-card-head {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    align-items: center;
    line-height: 1;
}
.dk-stat-card-icon {
    grid-column: 2;
    grid-row: 1 / span 2;
    width: 30px;
    height: 30px;
    background: var(--accent-tint);
    color: var(--accent-color);
    border-radius: var(--r-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    flex-shrink: 0;
    align-self: center;
}
.dk-stat-card-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    line-height: 1.2;
}

/* Alt satır: value (sol, büyük) + foot (altında küçük) */
.dk-stat-card-value {
    grid-column: 1;
    grid-row: 2;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.1;
    font-family: 'JetBrains Mono', 'Inter', monospace;
    letter-spacing: -0.02em;
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
}
.dk-stat-card-value-sm {
    font-size: 1rem;
    font-family: 'Inter', sans-serif;
    letter-spacing: 0;
    font-weight: 600;
}

/* Alt detay satırı — value'nun yanında ya da altında */
.dk-stat-card-foot {
    font-size: 10.5px;
    color: var(--text-muted);
    line-height: 1.3;
    font-weight: 500;
    font-family: 'Inter', sans-serif;
    letter-spacing: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}
/* Foot'u value'nun YANINA al — kompakt görünüm */
.dk-stat-card-value .dk-stat-card-foot {
    margin-left: 2px;
}
.dk-stat-card-foot strong {
    color: var(--text);
    font-weight: 700;
}
.dk-stat-card-foot i {
    font-size: 11px;
    line-height: 1;
}
.dk-stat-card-foot .text-success { color: var(--success) !important; }
.dk-stat-card-foot .text-muted   { color: var(--text-subtle) !important; }

/* Onaylı kartında progress bar — kompakt için 2px + grid sonuna */
.dk-stat-progress {
    grid-column: 1 / -1;
    grid-row: 3;
    height: 2px;
    background: rgba(15,23,42,0.06);
    border-radius: 999px;
    overflow: hidden;
    margin-top: 4px;
}
.dk-stat-progress > span {
    display: block;
    height: 100%;
    background: var(--accent-color);
    border-radius: 999px;
    transition: width 400ms ease;
}

/* ---- Card ---- */
.dk-card {
    background: var(--dk-card);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    border: 1px solid var(--dk-border);
    overflow: hidden;
}
.dk-card-header {
    background: var(--dk-navy);
    color: #fff;
    padding: 12px 20px;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.dk-card-body { padding: 0; }

/* ---- Tablo ---- */
.dk-table {
    width: 100%;
    border-collapse: collapse;
}
.dk-table thead th {
    background: #FFFFFF;
    color: var(--dk-text);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 12px 16px;
    border-bottom: 2px solid var(--dk-orange);
    text-align: left;
}
.dk-table tbody tr {
    border-bottom: 1px solid var(--dk-border);
    transition: background 0.12s ease;
}
.dk-table tbody tr:hover { background: #F9FAFB; }
/* İÇERİDE — 1. tartımı yapılmış, 2. tartımı bekleyen araç: belirgin sarı, en üstte sıralanır */
.dk-table tbody tr.dk-row-pending { background: #FEF08A; }
.dk-table tbody tr.dk-row-pending:hover { background: #FDE047; }
.dk-table tbody tr.dk-row-orphan { background: #FB923C; border-bottom: 2px solid #7F1D1D; }
.dk-table tbody td {
    padding: 12px 16px;
    font-size: 0.88rem;
    vertical-align: middle;
}
.dk-mono { font-family: 'JetBrains Mono', Consolas, monospace; font-weight: 700; }
.dk-net { color: var(--dk-orange); font-weight: 700; }

.dk-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.dk-badge-single  { background: #E5E7EB; color: var(--dk-text); }
.dk-badge-first   { background: #FED7AA; color: #9A3412; }
.dk-badge-second  { background: #DBEAFE; color: #1E40AF; }
.dk-badge-orphan  { background: #FB923C; color: #7F1D1D; }
.dk-badge-pending { background: #FEF3C7; color: #92400E; }

.dk-empty {
    padding: 60px 20px;
    text-align: center;
    color: var(--dk-muted);
}
.dk-empty i { font-size: 3rem; color: #CBD5E1; }
.dk-empty .title { font-weight: 700; margin-top: 12px; }
.dk-empty .sub { font-size: 0.85rem; }

/* ---- Footer ---- */
.dk-footer {
    background: #FFFFFF;
    border-top: 1px solid var(--dk-border);
    padding: 12px 0;
    margin-top: 40px;
    color: var(--dk-muted);
    font-size: 0.78rem;
}

/* ---- Detay sayfa ---- */
.dk-snapshot {
    background: #0B0B0B;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dk-snapshot img { width: 100%; height: auto; display: block; }
.dk-snapshot .dk-stamp {
    position: absolute;
    bottom: 8px;
    left: 8px;
    background: rgba(0,0,0,0.55);
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    padding: 3px 8px;
    border-radius: 4px;
}
.dk-snapshot .placeholder {
    color: #9CA3AF;
    text-align: center;
}
.dk-snapshot .placeholder i { font-size: 2.4rem; }

/* Net vurgu kutusu (detay sayfası) */
.dk-net-card {
    background: var(--dk-orange-light);
    border: 2px solid var(--dk-orange);
    border-radius: 8px;
    padding: 16px 20px;
}
.dk-net-card .label { color: var(--dk-orange); font-weight: 700; }
.dk-net-card .value { color: var(--dk-orange); font-size: 1.8rem; font-weight: 700; }

/* Detay info satırı */
.dk-info-row { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--dk-border); }
.dk-info-row .k { color: var(--dk-muted); font-size: 0.78rem; font-weight: 700; text-transform: uppercase; }
.dk-info-row .v { font-weight: 600; }

/* Filtre çubuğu */
.dk-filter-bar {
    background: #FFFFFF;
    border: 1px solid var(--dk-border);
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 16px;
}
.dk-preset-btn {
    background: #FFFFFF;
    border: 1px solid var(--dk-border);
    border-radius: 4px;
    padding: 5px 14px;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--dk-text);
    cursor: pointer;
}
.dk-preset-btn:hover { background: var(--dk-orange-light); border-color: var(--dk-orange); }
.dk-preset-btn.active { background: var(--dk-orange); border-color: var(--dk-orange); color: #fff; }

/* =============================================================
   ELITE APP SHELL — Topbar + Icon Sidebar + Main + Drawer
   Mevcut .dk-* sınıflarına dokunmaz; yenisi paralel sistem.
   ============================================================= */

html, body { margin: 0; padding: 0; height: 100%; }
body.app-shell {
    background: var(--surface-0);
    color: var(--text);
    overflow: hidden;
}

/* App layout: grid (topbar üst, sidebar sol, main sağ) */
.app-shell-root {
    display: grid;
    grid-template-rows: var(--topbar-h) 1fr;
    grid-template-columns: var(--sidebar-w) 1fr;
    grid-template-areas:
        "topbar topbar"
        "sidebar main";
    height: 100vh;
}

/* ---------- TOPBAR ---------- */
.app-topbar {
    grid-area: topbar;
    background: var(--primary);
    color: #fff;
    display: flex;
    align-items: center;
    padding: 0 var(--s-5);
    border-bottom: 1px solid var(--primary-light);
    z-index: 30;
    box-shadow: var(--shadow-md);
}
.app-topbar .brand {
    display: flex;
    align-items: center;
    gap: var(--s-3);
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.app-topbar .brand-mark {
    width: 32px; height: 32px;
    background: var(--accent);
    border-radius: var(--r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.02em;
}
.app-topbar .brand-sub {
    color: rgba(255,255,255,0.6);
    font-size: 12px;
    font-weight: 400;
    margin-left: var(--s-2);
}
.app-topbar .spacer { flex: 1; }
.app-topbar .topbar-actions {
    display: flex;
    align-items: center;
    gap: var(--s-2);
}

/* ============================================================
   Topbar Hızlı Arama
   Plaka / firma / oturum ID için live dropdown'lu arama.
   ============================================================ */
.topbar-search {
    position: relative;
    flex: 0 1 480px;
    min-width: 240px;
    margin: 0 var(--s-4);
}
.topbar-search > .bi-search {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255,255,255,0.5);
    font-size: 13px;
    pointer-events: none;
}
.topbar-search input {
    width: 100%;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    color: white;
    padding: 8px 14px 8px 36px;
    border-radius: var(--r-sm);
    font-size: 13px;
    font-family: 'Inter', sans-serif;
    transition: all 150ms;
}
.topbar-search input::placeholder {
    color: rgba(255,255,255,0.42);
}
.topbar-search input:focus {
    background: rgba(255,255,255,0.10);
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(249,115,22,0.18);
    outline: none;
}

/* Dropdown */
.topbar-search-results {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0; right: 0;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-lg);
    z-index: 60;
    max-height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
}
.topbar-search-results.open { display: block; }

.topbar-search-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    padding: 10px 12px;
    background: #fff;
    border: none;
    border-bottom: 1px solid var(--border);
    text-align: left;
    cursor: pointer;
    transition: background 120ms;
    font-family: 'Inter', sans-serif;
}
.topbar-search-item:last-child { border-bottom: none; }
.topbar-search-item:hover,
.topbar-search-item.active {
    background: var(--surface-hover);
}
.topbar-search-icon {
    width: 30px; height: 30px;
    border-radius: var(--r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 14px;
}
.topbar-search-icon.ok   { background: rgba(16,185,129,0.12);  color: var(--success); }
.topbar-search-icon.warn { background: rgba(245,158,11,0.14);  color: #B45309; }
.topbar-search-body {
    flex: 1;
    min-width: 0;
}
.topbar-search-line1 {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    line-height: 1.2;
}
.topbar-search-line2 {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-top: 2px;
    font-size: 11px;
    color: var(--text-muted);
    line-height: 1.3;
}
.topbar-search-line2 > span:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    flex: 1;
}
.topbar-search-plate {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    font-size: 13px;
    color: var(--text);
}
.topbar-search-plate mark,
.topbar-search-line2 mark {
    background: #FEF3C7;
    color: #92400E;
    padding: 0 2px;
    border-radius: 2px;
    font-weight: 700;
}
.topbar-search-type {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 2px 6px;
    background: var(--surface-2);
    color: var(--text-muted);
    border-radius: 999px;
    flex-shrink: 0;
}
.topbar-search-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    color: var(--text-subtle);
    white-space: nowrap;
    flex-shrink: 0;
}
.topbar-search-empty {
    padding: 24px 16px;
    text-align: center;
    color: var(--text-muted);
    font-size: 12px;
}

/* Mobil — topbar dar olduğunda */
@media (max-width: 640px) {
    .topbar-search { display: none; }
}
.app-topbar .icon-btn {
    background: transparent;
    border: none;
    color: rgba(255,255,255,0.75);
    width: 36px; height: 36px;
    border-radius: var(--r-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    transition: background 150ms ease, color 150ms ease;
}
.app-topbar .icon-btn:hover {
    background: rgba(255,255,255,0.08);
    color: #fff;
}
.app-topbar .icon-btn .badge-dot {
    position: absolute;
    top: 6px; right: 6px;
    width: 8px; height: 8px;
    background: var(--accent);
    border-radius: 50%;
    border: 2px solid var(--primary);
}

/* Bağlantı durumu rozeti (topbar) */
.app-topbar .conn-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 14px;
    font-size: 11px;
    font-weight: 600;
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.85);
    height: 26px;
}
.app-topbar .conn-pill .dot {
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--text-subtle);
}
.app-topbar .conn-pill.online .dot { background: var(--success); box-shadow: 0 0 0 2px rgba(16,185,129,.2); }
.app-topbar .conn-pill.online { background: rgba(16,185,129,.12); color: #6EE7B7; }

/* ---------- ICON SIDEBAR ---------- */
.app-sidebar {
    grid-area: sidebar;
    background: var(--surface-1);
    border-right: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--s-3) 0;
    z-index: 20;
}
.app-sidebar .nav-item {
    width: 44px; height: 44px;
    border-radius: var(--r-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    cursor: pointer;
    margin-bottom: var(--s-2);
    position: relative;
    background: transparent;
    border: none;
    text-decoration: none;
    transition: background 150ms ease, color 150ms ease;
}
.app-sidebar .nav-item i { font-size: 19px; }
.app-sidebar .nav-item:hover { background: var(--surface-hover); color: var(--text); }
.app-sidebar .nav-item.active {
    background: rgba(249,115,22,0.12);
    color: var(--accent);
}
.app-sidebar .nav-item.active::before {
    content: '';
    position: absolute;
    left: -1px;
    top: 8px; bottom: 8px;
    width: 3px;
    background: var(--accent);
    border-radius: 0 2px 2px 0;
}
.app-sidebar .nav-item .tooltip {
    position: absolute;
    left: calc(100% + 8px);
    top: 50%;
    transform: translateY(-50%);
    background: var(--text);
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    padding: 5px 10px;
    border-radius: var(--r-sm);
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 150ms ease;
    z-index: 50;
}
.app-sidebar .nav-item:hover .tooltip { opacity: 1; }

/* Sidebar badge — bekleyen sayısı için sağ-üst circle */
.app-sidebar .nav-item {
    position: relative;
}
.nav-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 0 2px var(--primary);
    line-height: 1;
    pointer-events: none;
}

/* ============================================================
   Bekleyenler Drawer
   ============================================================ */
.dk-pending-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    margin-bottom: var(--s-4);
    font-size: 12px;
}
.dk-pending-total {
    font-weight: 700;
    color: var(--text);
    font-size: 13px;
}
.dk-pending-refresh {
    background: white;
    border: 1px solid var(--border-strong);
    border-radius: var(--r-sm);
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 600;
    color: var(--text);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 150ms;
}
.dk-pending-refresh:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.dk-pending-group {
    margin-bottom: var(--s-4);
}
.dk-pending-group-head {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    padding: 6px 4px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.dk-pending-group-count {
    background: var(--accent);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    padding: 1px 7px;
    border-radius: 999px;
    letter-spacing: 0;
}

.dk-pending-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.dk-pending-row {
    background: white;
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    padding: 10px 14px;
    transition: border-color 150ms, box-shadow 150ms;
    cursor: pointer;
}
.dk-pending-row:hover {
    border-color: var(--accent);
    box-shadow: var(--shadow-md);
}
.dk-pending-row-main {
    display: grid;
    grid-template-columns: 130px 130px 70px 1fr 110px;
    gap: 12px;
    align-items: center;
    font-size: 12px;
}
.dk-pending-row-time {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--text-muted);
}
.dk-pending-row-plate {
    font-weight: 700;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    color: var(--text);
}
.dk-pending-row-type {
    text-align: left;
}
.dk-pending-type-badge {
    display: inline-block;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    padding: 2px 8px;
    border-radius: 4px;
    background: var(--surface-2);
    color: var(--text-muted);
}
.dk-pending-type-badge.t1 { background: #FED7AA; color: #9A3412; }
.dk-pending-type-badge.t2 { background: #DBEAFE; color: #1E40AF; }
.dk-pending-row-company {
    color: var(--text-muted);
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dk-pending-row-weight {
    text-align: right;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    color: var(--accent);
    font-size: 13px;
}
.dk-pending-row-foot {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed var(--border);
    font-size: 11px;
}
.dk-pending-row-id {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    color: var(--text-subtle);
}
.dk-pending-reason {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 10.5px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 999px;
}
.dk-pending-reason i { font-size: 11px; }
.dk-pending-reason.r-no-data  { background: #7F1D1D; color: #fff; }
.dk-pending-reason.r-no-plate { background: #FEF3C7; color: #92400E; }
.dk-pending-reason.r-awaiting { background: #DBEAFE; color: #1E40AF; }
.dk-pending-reason.r-orphan   { background: #FEE2E2; color: #991B1B; }

.dk-pending-detail-btn,
.dk-pending-assign-btn,
.dk-pending-delete-btn {
    background: white;
    border: 1px solid var(--border-strong);
    border-radius: var(--r-sm);
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: all 150ms;
}
.dk-pending-delete-btn {
    color: var(--danger);
    border-color: rgba(220, 38, 38, 0.35);
}
.dk-pending-delete-btn:hover:not(:disabled) {
    background: #FEE2E2;
    border-color: var(--danger);
}
.dk-pending-delete-btn:disabled { opacity: 0.6; cursor: wait; }
.dk-pending-detail-btn { color: var(--text-muted); }
.dk-pending-detail-btn:hover { border-color: var(--text); color: var(--text); }
.dk-pending-assign-btn {
    background: var(--accent);
    border-color: var(--accent);
    color: white;
}
.dk-pending-assign-btn:hover {
    background: #EA580C;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(249,115,22,0.30);
}

/* Mobil — kompakt grid */
@media (max-width: 720px) {
    .dk-pending-row-main {
        grid-template-columns: 1fr 1fr;
        gap: 6px;
    }
    .dk-pending-row-weight { text-align: left; }
}
.app-sidebar .spacer { flex: 1; }

/* Sidebar alt — bağlantı noktası */
.app-sidebar .conn-indicator {
    width: 44px; height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.app-sidebar .conn-indicator .dot {
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--text-subtle);
    transition: background 150ms ease, box-shadow 150ms ease;
}
.app-sidebar .conn-indicator.online .dot {
    background: var(--success);
    box-shadow: 0 0 0 3px rgba(16,185,129,.2);
}

/* ---------- MAIN CONTENT ---------- */
.app-main {
    grid-area: main;
    overflow: auto;
    padding: var(--s-6);
}

/* ---------- DRAWER (sağdan kayan panel) ---------- */
.drawer-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,0.45);
    backdrop-filter: blur(2px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 200ms ease;
    /* Tüm topbar'ların (tenant ve admin z-index:100) üstünde, toast'ın (9000) altında.
       Aksi halde sticky topbar drawer header'ını (kapatma tuşu dahil) örter. */
    z-index: 7900;
}
.drawer-backdrop.open {
    opacity: 1;
    pointer-events: auto;
}

.drawer {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: var(--drawer-w-md);
    max-width: 92vw;
    background: var(--surface-1);
    box-shadow: var(--shadow-drawer);
    transform: translateX(100%);
    transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    /* Topbar'ların üstünde (bkz. drawer-backdrop notu). */
    z-index: 8000;
}
.drawer.size-lg { width: var(--drawer-w-lg); }
.drawer.size-lgw { width: var(--drawer-w-lgw); }
.drawer.size-xl { width: var(--drawer-w-xl); }

/* ---- Drawer footer aksiyon barı — tutarlı buton sistemi ---- */
.dkf-bar { display: flex; align-items: center; gap: 8px; width: 100%; flex-wrap: wrap; }
.dkf-spacer { flex: 1 1 auto; min-width: 8px; }
.dkf-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    height: 38px; padding: 0 16px; border-radius: 9px;
    font-family: inherit; font-size: 12px; font-weight: 600; letter-spacing: .01em;
    border: 1px solid transparent; cursor: pointer; white-space: nowrap;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .05s ease;
}
.dkf-btn:active { transform: translateY(1px); }
.dkf-btn:disabled { opacity: .55; cursor: default; }
.dkf-btn i { font-size: 15px; line-height: 1; }
/* Nötr ikincil (geçmiş / düzenle / yazdır) */
.dkf-ghost { background: var(--surface-1); border-color: var(--border-strong); color: var(--text-secondary, #475569); }
.dkf-ghost:hover { background: var(--surface-2); border-color: var(--text-muted, #94a3b8); color: var(--text-primary, #0f172a); }
/* Yıkıcı (sil) — sade, hover'da belirginleşir */
.dkf-danger { background: transparent; border-color: color-mix(in srgb, var(--danger) 35%, transparent); color: var(--danger); }
.dkf-danger:hover { background: color-mix(in srgb, var(--danger) 10%, transparent); border-color: var(--danger); }
/* Birincil CTA (atama) */
.dkf-primary { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.12); }
.dkf-primary:hover { filter: brightness(.94); }
/* Başarı/WhatsApp CTA (fişi gönder) */
.dkf-success { background: #1F8B4C; border-color: #1F8B4C; color: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.12); }
.dkf-success:hover { background: #19733F; border-color: #19733F; }
.drawer.open { transform: translateX(0); }

/* Drawer stacking — birden çok drawer üst üste açıldığında */
.drawer.stacked { box-shadow: var(--shadow-lg); }

.drawer-header {
    display: flex;
    align-items: center;
    gap: var(--s-3);
    padding: var(--s-4) var(--s-5);
    border-bottom: 1px solid var(--border);
    background: var(--surface-1);
}
.drawer-header .drawer-icon {
    width: 32px; height: 32px;
    border-radius: var(--r-sm);
    background: rgba(249,115,22,0.1);
    color: var(--accent);
    display: flex;
    align-items: center;
    justify-content: center;
}
.drawer-header .drawer-icon i { font-size: 17px; }
.drawer-header .drawer-title {
    flex: 1;
    font-size: 15px;
    font-weight: 600;
    color: var(--text);
}
.drawer-header .drawer-subtitle {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 2px;
}
.drawer-header .drawer-close {
    background: transparent;
    border: none;
    color: var(--text-muted);
    width: 32px; height: 32px;
    border-radius: var(--r-sm);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 150ms ease;
}
.drawer-header .drawer-close:hover {
    background: var(--surface-hover);
    color: var(--text);
}

.drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: var(--s-5);
}

.drawer-footer {
    padding: var(--s-3) var(--s-5);
    border-top: 1px solid var(--border);
    background: var(--surface-2);
    display: flex;
    gap: var(--s-2);
    justify-content: flex-end;
}

/* Drawer loading state (içerik fetch edilirken) */
.drawer-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--s-10);
    color: var(--text-muted);
    gap: var(--s-3);
}
.drawer-loading .spinner {
    width: 36px; height: 36px;
    border: 3px solid var(--border);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: drawer-spin 800ms linear infinite;
}
@keyframes drawer-spin {
    to { transform: rotate(360deg); }
}

/* ---------- MOBILE (≤768px): drawer fullscreen, sidebar hamburger ---------- */
@media (max-width: 768px) {
    .app-shell-root {
        grid-template-columns: 0 1fr;
    }
    .app-sidebar {
        position: fixed;
        left: 0; top: var(--topbar-h); bottom: 0;
        transform: translateX(-100%);
        transition: transform 200ms ease;
        z-index: 25;
        box-shadow: var(--shadow-lg);
    }
    .app-sidebar.mobile-open { transform: translateX(0); }
    .drawer { width: 100vw; max-width: 100vw; }
}

/* =============================================================
   ÖLÇÜM KAYDET form — Elite tasarım
   Dashboard'da soldaki "ÖLÇÜM KAYDET" kartının içeriği.
   JS uyumu için tüm ID'ler korunmuştur (f-plate, f-company,
   f-type, f-linked-first, f-save, vb.).
   ============================================================= */

#assign-form {
    display: flex;
    flex-direction: column;
    gap: var(--s-3);
}

/* Form field grupları */
.dk-mr-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }

/* Yan yana iki alanlı satır (örn. Plaka + Firma). Çok dar ekranlarda otomatik alt alta düşer. */
.dk-mr-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
@media (max-width: 360px) {
    .dk-mr-row { grid-template-columns: 1fr; }
}

.dk-mr-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 4px;
}
.dk-mr-label .dk-mr-req {
    color: var(--accent);
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
}

/* Refined select — bootstrap form-select görünümünü override eder */
#assign-form .form-select.dk-mr-input {
    background-color: #fff;
    border: 1px solid var(--border-strong);
    border-radius: var(--r-sm);
    padding: 9px 32px 9px 12px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text);
    line-height: 1.3;
    transition: all 150ms ease;
    box-shadow: var(--shadow-sm);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2364748B'%3E%3Cpath d='M3.204 5L8 10.481 12.796 5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 12px;
    appearance: none;
    -webkit-appearance: none;
}
#assign-form .form-select.dk-mr-input:hover {
    border-color: #94A3B8;
}
#assign-form .form-select.dk-mr-input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(249,115,22,0.15);
    outline: none;
}
#assign-form .form-select.dk-mr-input:disabled {
    background-color: var(--surface-2);
    color: var(--text-muted);
    cursor: not-allowed;
}

/* Tartım Tipi — segmented control (3 buton grup) */
.dk-mr-segmented {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
    padding: 4px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
}
.dk-mr-segmented button {
    padding: 7px 6px;
    background: transparent;
    border: none;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--text-muted);
    cursor: pointer;
    transition: all 140ms ease;
    text-align: center;
    line-height: 1.2;
}
.dk-mr-segmented button:hover {
    color: var(--text);
    background: rgba(255,255,255,0.6);
}
.dk-mr-segmented button[aria-pressed="true"] {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 1px 3px rgba(27,44,79,0.25);
}

/* Otomatik öneri banner — refined */
#f-suggestion {
    background: linear-gradient(135deg, #FEF3C7 0%, #FDE68A 100%);
    border: 1px solid #F59E0B;
    border-left: 3px solid #D97706;
    border-radius: var(--r-sm);
    padding: 10px 12px;
    margin: 0;
    font-size: 11px;
    color: #78350F;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.45;
}
#f-suggestion i {
    color: #B45309;
    font-size: 14px;
    margin-top: 1px;
    flex-shrink: 0;
}

/* NET önizleme kartı — vurgulu, büyük rakamlar */
#f-net-preview {
    background: linear-gradient(135deg, #FFF7ED 0%, #FFEDD5 100%);
    border: 1px solid #FDBA74;
    border-left: 3px solid var(--accent);
    border-radius: var(--r-sm);
    padding: 12px 14px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
#f-net-preview > div {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
}
#f-net-preview .text-muted {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted) !important;
}
#f-net-preview #f-net-tare {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    color: var(--text);
}
#f-net-preview #f-net-net {
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 700;
    color: var(--accent) !important;
    line-height: 1;
}

/* Aksiyon butonları satırı — KAYDET (primary) + DARA KAYDI AL (secondary) */
.dk-mr-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 4px;
}

/* KAYDET butonu — büyük, prominent, hover lift */
#f-save.dk-mr-save {
    background: linear-gradient(135deg, var(--accent) 0%, #EA580C 100%);
    color: #fff;
    border: none;
    border-radius: var(--r-sm);
    padding: 13px 14px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    box-shadow: 0 4px 12px rgba(249,115,22,0.25), inset 0 1px 0 rgba(255,255,255,0.18);
    transition: all 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
#f-save.dk-mr-save:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(249,115,22,0.32), inset 0 1px 0 rgba(255,255,255,0.18);
}
#f-save.dk-mr-save:active:not(:disabled) {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(249,115,22,0.22);
}
#f-save.dk-mr-save:disabled {
    background: var(--text-subtle);
    box-shadow: none;
    cursor: wait;
    opacity: 0.7;
}
#f-save.dk-mr-save i {
    font-size: 15px;
}

/* DARA KAYDI AL — secondary aksiyon, ölçülü ve net */
.dk-mr-tare {
    background: #fff;
    color: var(--primary);
    border: 1.5px solid var(--border-strong);
    border-radius: var(--r-sm);
    padding: 13px 12px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    box-shadow: var(--shadow-sm);
    transition: all 180ms cubic-bezier(0.4, 0, 0.2, 1);
    line-height: 1.2;
}
.dk-mr-tare i { font-size: 14px; color: var(--primary); transition: color 180ms; }
.dk-mr-tare:hover:not(:disabled) {
    background: #FFF7ED;
    border-color: var(--accent);
    color: var(--accent);
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(249,115,22,0.10);
}
.dk-mr-tare:hover:not(:disabled) i { color: var(--accent); }
.dk-mr-tare:active:not(:disabled) { transform: translateY(0); }
.dk-mr-tare:disabled {
    background: var(--surface-2);
    color: var(--text-subtle);
    border-color: var(--border);
    cursor: not-allowed;
    opacity: 0.7;
    box-shadow: none;
}
.dk-mr-tare:disabled i { color: var(--text-subtle); }

/* Sonuç (hata/durum) satırı */
#f-result {
    margin: 0;
    font-size: 11px;
    color: var(--text-muted);
    text-align: center;
    min-height: 16px;
    line-height: 1.4;
}
#f-result .text-danger {
    color: var(--danger) !important;
    font-weight: 500;
}

/* Linked row container — animasyonlu görünüm */
#f-linked-row {
    margin: 0;
}

/* ============================================================
   Aktif Ölçüm Sticky Banner — Kantar üzerinde yük varken
   tüm sayfalarda alt şerit olarak görünür. Operatör drawer'da
   farklı işle uğraşsa bile aktif yükü kaybetmez.
   ============================================================ */
.dk-active-banner {
    position: fixed;
    left: var(--sidebar-w);
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
    color: #fff;
    z-index: 20;
    transform: translateY(110%);   /* gizliyken aşağıda */
    transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 -6px 18px rgba(15, 23, 42, 0.22);
    border-top: 2px solid var(--accent);
}
.dk-active-banner.active {
    transform: translateY(0);
}

.dk-active-banner-inner {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 10px 24px;
    min-height: 58px;
    max-width: 100%;
}

.dk-active-status {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-shrink: 0;
}
.dk-active-dot {
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 4px rgba(249,115,22,0.30);
    animation: dk-active-pulse 1.6s ease-in-out infinite;
    flex-shrink: 0;
}
@keyframes dk-active-pulse {
    0%, 100% { box-shadow: 0 0 0 4px rgba(249,115,22,0.30); }
    50%      { box-shadow: 0 0 0 9px rgba(249,115,22,0.06); }
}
.dk-active-label {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.88);
    white-space: nowrap;
}

/* Ağırlık göstergesi */
.dk-active-weight {
    display: flex;
    align-items: baseline;
    gap: 5px;
    font-family: 'JetBrains Mono', monospace;
    flex-shrink: 0;
}
.dk-active-weight #dk-active-weight-value {
    font-size: 28px;
    font-weight: 700;
    color: var(--accent);
    line-height: 1;
    transition: color 200ms;
    letter-spacing: -0.02em;
}
.dk-active-weight.stable #dk-active-weight-value {
    color: #34D399;   /* yeşil */
}
.dk-active-weight .unit {
    font-size: 13px;
    color: rgba(255,255,255,0.6);
}
.dk-active-badge {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    padding: 3px 9px;
    border-radius: 999px;
    margin-left: 10px;
    font-family: 'Inter', sans-serif;
}
.dk-active-badge.reading { background: rgba(249,115,22,0.25); color: #FED7AA; }
.dk-active-badge.stable  { background: rgba(16,185,129,0.25); color: #6EE7B7; }

/* Meta — plaka + oturum */
.dk-active-meta {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex: 1;
    font-size: 12px;
    color: rgba(255,255,255,0.65);
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
}
.dk-active-meta-label {
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.42);
}
.dk-active-meta-divider {
    color: rgba(255,255,255,0.30);
    margin: 0 4px;
}
.dk-active-meta #dk-active-plate {
    color: #fff;
    font-weight: 700;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
}
.dk-active-meta #dk-active-session-id {
    color: rgba(255,255,255,0.85);
    font-size: 11px;
    font-family: 'JetBrains Mono', monospace;
}

/* Aksiyon butonu */
.dk-active-action-btn {
    background: var(--accent);
    color: #fff;
    border: none;
    border-radius: var(--r-sm);
    padding: 9px 16px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 160ms;
    box-shadow: 0 2px 8px rgba(249,115,22,0.30);
    flex-shrink: 0;
    white-space: nowrap;
}
.dk-active-action-btn:hover {
    background: #EA580C;
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(249,115,22,0.40);
}
.dk-active-action-btn:active { transform: translateY(0); }
.dk-active-action-btn i { font-size: 13px; }

/* Mobil — kompakt mod, sidebar slide-in olduğu için sol margin yok */
@media (max-width: 768px) {
    .dk-active-banner {
        left: 0;
    }
    .dk-active-banner-inner {
        gap: 12px;
        padding: 8px 14px;
    }
    .dk-active-label { display: none; }
    .dk-active-meta-label { display: none; }
    .dk-active-meta-divider { display: none; }
    .dk-active-meta { gap: 6px; font-size: 11px; }
}

/* Yazdırma sırasında banner görünmez */
@media print {
    .dk-active-banner { display: none !important; }
}

/* ============================================================
   Araç Dara Geçmişi Drawer (timeline görünümü)
   openVehicleHistoryDrawer(vehicleId, plate)
   ============================================================ */
.dk-vh-summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    margin-bottom: var(--s-4);
    font-size: 12px;
    color: var(--text-muted);
}
.dk-vh-summary strong { color: var(--text); font-weight: 700; }
.dk-vh-summary-sep { color: var(--text-subtle); }

.dk-vh-timeline {
    position: relative;
    padding-left: 18px;
}
/* Sol dikey çizgi (timeline ekseni) */
.dk-vh-timeline::before {
    content: '';
    position: absolute;
    left: 7px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: var(--border);
    border-radius: 1px;
}

.dk-vh-entry {
    position: relative;
    margin-bottom: 14px;
}
.dk-vh-entry:last-child { margin-bottom: 0; }

.dk-vh-marker {
    position: absolute;
    left: -16px;
    top: 16px;
    width: 12px; height: 12px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--text-subtle);
    z-index: 1;
}
.dk-vh-entry.is-latest .dk-vh-marker {
    background: var(--accent);
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(249,115,22,0.18);
}

.dk-vh-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    padding: 11px 14px;
    box-shadow: var(--shadow-sm);
    transition: border-color 150ms;
}
.dk-vh-entry.is-latest .dk-vh-card {
    border-color: var(--accent);
    background: linear-gradient(135deg, #fff 0%, #FFF7ED 100%);
}

.dk-vh-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 5px;
}
.dk-vh-time {
    font-size: 11px;
    font-family: 'JetBrains Mono', monospace;
    color: var(--text-muted);
}
.dk-vh-current {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.08em;
    background: var(--accent);
    color: #fff;
    padding: 2px 8px;
    border-radius: 999px;
}

.dk-vh-tare {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
}
.dk-vh-tare-val {
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: -0.02em;
}
.dk-vh-entry.is-latest .dk-vh-tare-val { color: var(--accent); }

.dk-vh-delta {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    font-family: 'Inter', sans-serif;
}
.dk-vh-delta i { font-size: 11px; }
.dk-vh-delta-init { background: var(--surface-2); color: var(--text-muted); }
.dk-vh-delta-zero { background: var(--surface-2); color: var(--text-muted); }
.dk-vh-delta-up   { background: #FEE2E2; color: #991B1B; }
.dk-vh-delta-down { background: #D1FAE5; color: #047857; }

.dk-vh-meta {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed var(--border);
    font-size: 11px;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 5px;
}
.dk-vh-session-link {
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    padding: 2px 8px;
    font-size: 10px;
    font-weight: 700;
    font-family: 'JetBrains Mono', monospace;
    color: var(--accent);
    cursor: pointer;
    transition: all 120ms;
}
.dk-vh-session-link:hover {
    background: var(--accent);
    color: white;
    border-color: var(--accent);
}

/* ============================================================
   Ayarlar Drawer (settings-drawer.js)
   ============================================================ */
.dk-settings-intro {
    background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);
    border: 1px solid #93C5FD;
    border-left: 3px solid #2563EB;
    border-radius: var(--r-md);
    padding: 12px 14px;
    margin-bottom: var(--s-4);
}
.dk-settings-intro-head {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #1E40AF;
    margin-bottom: 5px;
}
.dk-settings-intro-head i { font-size: 13px; }
.dk-settings-intro-body {
    font-size: 11.5px;
    color: #1E3A8A;
    line-height: 1.5;
    margin-bottom: 6px;
}
.dk-settings-intro-body strong { color: #1E40AF; font-weight: 700; }
.dk-settings-intro-meta {
    font-size: 10.5px;
    color: rgba(30,58,138,0.65);
}
.dk-settings-intro-meta strong { color: #1E40AF; font-weight: 600; }

.dk-settings-section {
    margin-bottom: var(--s-4);
}
.dk-settings-section-head {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.dk-settings-section-head i { color: var(--accent); font-size: 14px; }

.dk-settings-fields {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.dk-settings-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.dk-settings-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--text);
}
.dk-settings-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}
.dk-settings-input {
    flex: 1;
    padding: 9px 56px 9px 12px;
    border: 1px solid var(--border-strong);
    border-radius: var(--r-sm);
    font-size: 13px;
    font-family: 'JetBrains Mono', monospace;
    background: white;
    transition: all 150ms;
    -moz-appearance: textfield;
}
.dk-settings-input::-webkit-outer-spin-button,
.dk-settings-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.dk-settings-input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(249,115,22,0.15);
    outline: none;
}
.dk-settings-unit {
    position: absolute;
    right: 12px;
    font-size: 11px;
    font-weight: 700;
    color: var(--text-muted);
    letter-spacing: 0.04em;
    pointer-events: none;
}
.dk-settings-hint {
    font-size: 11px;
    color: var(--text-muted);
    line-height: 1.4;
    padding-left: 2px;
}
#dk-settings-result {
    min-height: 20px;
}

/* ============================================================
   Atama Drawer (.dk-assign-summary) — geçmiş bekleyen oturumlar
   için openAssignDrawer(sessionId) ile açılır.
   ============================================================ */
.dk-assign-summary {
    background: linear-gradient(135deg, #F8FAFC 0%, #E2E8F0 100%);
    border: 1px solid var(--border-strong);
    border-radius: var(--r-md);
    padding: 12px 14px;
    margin-bottom: var(--s-4);
}

/* ============================================================
   Orphan 2. tartım uyarı banner'ı (session-drawer)
   "Tek Tartıma Çevir" aksiyonu içerir.
   ============================================================ */
.dk-orphan-banner {
    background: linear-gradient(135deg, #FEF3C7 0%, #FDE68A 100%);
    border: 1px solid #F59E0B;
    border-left: 4px solid #D97706;
    border-radius: var(--r-md);
    padding: 12px 14px;
    color: #78350F;
}
.dk-orphan-banner-head {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #92400E;
    margin-bottom: 6px;
}
.dk-orphan-banner-head i { font-size: 14px; color: #B45309; }
.dk-orphan-banner-body {
    font-size: 12px;
    line-height: 1.5;
    color: #78350F;
    margin-bottom: 10px;
}
.dk-orphan-banner-body strong {
    color: #7C2D12;
    font-weight: 700;
}
.dk-orphan-banner-preview {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 12px;
    background: rgba(255,255,255,0.55);
    border-radius: var(--r-sm);
    padding: 10px;
}
.dk-orphan-banner-preview > div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.dk-orphan-banner-preview .lbl {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #92400E;
}
.dk-orphan-banner-preview .val {
    font-size: 13px;
    font-weight: 700;
    color: #7C2D12;
    font-family: 'Inter', sans-serif;
}
.dk-orphan-banner-preview .val.dk-mono { font-family: 'JetBrains Mono', monospace; }
.dk-orphan-banner-preview .val.accent { color: #C2410C; font-size: 15px; }

.dk-orphan-convert-btn {
    width: 100%;
    background: #D97706;
    color: white;
    border: none;
    border-radius: var(--r-sm);
    padding: 10px 14px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: all 160ms;
    box-shadow: 0 2px 6px rgba(217,119,6,0.30);
}
.dk-orphan-convert-btn:hover:not(:disabled) {
    background: #B45309;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(217,119,6,0.40);
}
.dk-orphan-convert-btn:disabled {
    opacity: 0.65;
    cursor: wait;
}
.dk-orphan-convert-btn i { font-size: 14px; }
.dk-assign-summary-head {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 8px;
}
.dk-assign-summary-head i { font-size: 13px; color: var(--accent); }
.dk-assign-summary-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.dk-assign-summary-label {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 2px;
}
.dk-assign-summary-value {
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
}
.dk-assign-summary-value.accent { color: var(--accent); }
.dk-assign-summary-value.dk-mono { font-family: 'JetBrains Mono', monospace; }

/* Assign drawer'ında form için spacing (id="assign-form-drawer") */
#assign-form-drawer {
    display: flex;
    flex-direction: column;
    gap: var(--s-3);
}
/* Suggestion / NET preview — KAYDET formundaki ile aynı stil */
#ad-suggestion,
#ad-net-preview {
    margin: 0;
}
#ad-suggestion {
    background: linear-gradient(135deg, #FEF3C7 0%, #FDE68A 100%);
    border: 1px solid #F59E0B;
    border-left: 3px solid #D97706;
    border-radius: var(--r-sm);
    padding: 10px 12px;
    font-size: 11px;
    color: #78350F;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.45;
}
#ad-suggestion i { color: #B45309; font-size: 14px; margin-top: 1px; flex-shrink: 0; }
#ad-net-preview {
    background: linear-gradient(135deg, #FFF7ED 0%, #FFEDD5 100%);
    border: 1px solid #FDBA74;
    border-left: 3px solid var(--accent);
    border-radius: var(--r-sm);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
#ad-net-preview > div { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
#ad-net-preview .text-muted {
    font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--text-muted) !important;
}
#ad-net-tare { font-family: 'JetBrains Mono', monospace; font-size: 13px; color: var(--text); }
#ad-net-net  { font-family: 'JetBrains Mono', monospace; font-size: 18px; font-weight: 700; color: var(--accent); line-height: 1; }
#ad-result { min-height: 14px; text-align: center; }

/* ============================================================
   Fiş Yazdırma (Print Receipt)
   Ekranda gizli; @media print kuralları ile sadece fiş yazdırılır.
   A4 dikey, üst antet + oturum bilgileri + ağırlık tablosu + imza alanı.
   ============================================================ */

/* Ekran modunda fiş alanı tamamen gizli */
.dk-print-area { display: none; }

@media print {
    /* Tüm sayfayı sıfırla — sadece fiş görünsün */
    body, html { background: #fff !important; margin: 0; padding: 0; }
    body * { visibility: hidden !important; }
    .dk-print-area, .dk-print-area * { visibility: visible !important; }
    .dk-print-area {
        display: block !important;
        position: absolute;
        left: 0; top: 0;
        width: 100%;
    }
    /* Sayfa marjı — yazıcı destekliyorsa */
    @page { size: A4 portrait; margin: 15mm 18mm 15mm 18mm; }
    /* Tarayıcı UI artifaktları (header/footer) gizle istenirse @page header/footer none ekleyebiliriz */
}

/* ---- Fiş şablonu ---- */
.dk-receipt {
    font-family: 'Inter', system-ui, sans-serif;
    color: #0F172A;
    font-size: 11pt;
    line-height: 1.4;
    max-width: 174mm;       /* 210 - 18*2 ≈ A4 içi */
    margin: 0 auto;
}

/* Antet */
.dk-receipt-head {
    border-bottom: 2px solid #0F172A;
    padding-bottom: 10pt;
    margin-bottom: 14pt;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16pt;
}
.dk-receipt-brand {
    display: flex;
    align-items: center;
    gap: 10pt;
}
.dk-receipt-brand-mark {
    width: 42pt; height: 42pt;
    background: #0F172A;
    color: #fff;
    border-radius: 6pt;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 16pt;
    letter-spacing: 0.04em;
}
.dk-receipt-title {
    font-size: 16pt;
    font-weight: 800;
    color: #0F172A;
    letter-spacing: 0.02em;
    line-height: 1.1;
}
.dk-receipt-subtitle {
    font-size: 10pt;
    color: #64748B;
    margin-top: 2pt;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.dk-receipt-meta {
    text-align: right;
    font-size: 9pt;
    color: #475569;
    line-height: 1.5;
}
.dk-receipt-meta strong { color: #0F172A; font-weight: 700; }
.dk-receipt-meta .dk-receipt-id {
    font-family: 'JetBrains Mono', monospace;
    font-size: 8.5pt;
    color: #94A3B8;
    margin-top: 4pt;
}

/* Genel bilgi grid (Plaka / Firma / Tip / Saat) */
.dk-receipt-info {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10pt;
    margin-bottom: 16pt;
}
.dk-receipt-info-item {
    border: 1px solid #E2E8F0;
    border-radius: 5pt;
    padding: 8pt 10pt;
}
.dk-receipt-info-label {
    font-size: 8pt;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
    margin-bottom: 3pt;
}
.dk-receipt-info-value {
    font-size: 11pt;
    font-weight: 700;
    color: #0F172A;
}
.dk-receipt-info-value.dk-mono {
    font-family: 'JetBrains Mono', monospace;
}

/* Ağırlık paneli — büyük rakamlar */
.dk-receipt-weights {
    border: 2px solid #0F172A;
    border-radius: 6pt;
    padding: 14pt;
    margin-bottom: 16pt;
}
.dk-receipt-weights-title {
    font-size: 9pt;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #64748B;
    margin-bottom: 10pt;
    border-bottom: 1px dashed #CBD5E1;
    padding-bottom: 6pt;
}
.dk-receipt-weight-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 14pt;
    margin-bottom: 8pt;
}
.dk-receipt-weight-row:last-child { margin-bottom: 0; }
.dk-receipt-weight-cell {
    text-align: center;
}
.dk-receipt-weight-label {
    font-size: 8pt;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
    margin-bottom: 4pt;
}
.dk-receipt-weight-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22pt;
    font-weight: 700;
    color: #0F172A;
    line-height: 1;
}
.dk-receipt-weight-value.accent { color: #EA580C; }
.dk-receipt-weight-unit {
    font-size: 11pt;
    color: #64748B;
    margin-left: 2pt;
}

/* Çift tartım için 1./2. tartım yan yana kart düzeni — her kart kendi anlık görüntüsünü içerir */
.dk-receipt-pair {
    margin-top: 14pt;
    margin-bottom: 4pt;
}
.dk-receipt-pair-title {
    font-size: 9pt;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #64748B;
    margin-bottom: 8pt;
    border-bottom: 1px solid #CBD5E1;
    padding-bottom: 4pt;
}
.dk-receipt-pair-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8pt;
}
.dk-receipt-pair-card {
    border: 1px solid #CBD5E1;
    border-radius: 4pt;
    overflow: hidden;
    background: #fff;
    page-break-inside: avoid;  /* yazdırırken iki kart birden bölünmesin */
}
.dk-receipt-pair-card-head {
    background: #0F172A;
    color: #fff;
    padding: 5pt 8pt;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 9pt;
    font-weight: 700;
    letter-spacing: 0.06em;
}
.dk-receipt-pair-num {
    font-weight: 800;
}
.dk-receipt-pair-role {
    background: rgba(255,255,255,0.18);
    border-radius: 999px;
    padding: 1pt 6pt;
    font-size: 7.5pt;
    letter-spacing: 0.08em;
}
.dk-receipt-pair-card-info {
    padding: 6pt 8pt;
    border-bottom: 1px dashed #E2E8F0;
}
.dk-receipt-pair-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8pt;
    padding: 2pt 0;
    font-size: 9pt;
}
.dk-receipt-pair-row .lbl {
    font-size: 7.5pt;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748B;
}
.dk-receipt-pair-row .val {
    font-weight: 700;
    color: #0F172A;
}
.dk-receipt-pair-row .val.dk-mono { font-family: 'JetBrains Mono', monospace; }
.dk-receipt-pair-weight {
    font-size: 11pt !important;
    color: #EA580C !important;
}

/* Pair card snapshot — img veya fallback */
.dk-receipt-pair-snapshot {
    position: relative;
    background: #F8FAFC;
    height: 42mm;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dk-receipt-pair-snapshot img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.dk-receipt-pair-snapshot-fallback {
    display: none;
    font-size: 8.5pt;
    color: #94A3B8;
    font-style: italic;
}
.dk-receipt-pair-snapshot.empty img { display: none; }
.dk-receipt-pair-snapshot.empty .dk-receipt-pair-snapshot-fallback { display: block; }

/* Snapshot küçük önizleme (opsiyonel) */
.dk-receipt-snapshot {
    margin: 14pt 0;
    text-align: center;
}
.dk-receipt-snapshot img {
    max-width: 60mm;
    max-height: 45mm;
    border: 1px solid #CBD5E1;
    border-radius: 3pt;
}

/* Alt — imza alanı */
.dk-receipt-footer {
    margin-top: 28pt;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30pt;
}
.dk-receipt-sign {
    border-top: 1px solid #0F172A;
    padding-top: 6pt;
    font-size: 9pt;
    color: #475569;
    text-align: center;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* En altta küçük "yazdırıldı" notu */
.dk-receipt-print-note {
    margin-top: 18pt;
    font-size: 8pt;
    color: #94A3B8;
    text-align: center;
    font-style: italic;
}

/* ============================================================
   Günlük Özet / Sevk Raporu — A4 yazdırma şablonu
   openDailyReport() ile dk-print-area'ya inject edilir.
   Bu kurallar da .dk-print-area altına geldiği için yine
   @media print kapsamında görünür.
   ============================================================ */
.dk-daily-report {
    font-family: 'Inter', system-ui, sans-serif;
    color: #0F172A;
    font-size: 10pt;
    line-height: 1.4;
    max-width: 174mm;
    margin: 0 auto;
}

/* Antet */
.dk-rep-head {
    border-bottom: 2px solid #0F172A;
    padding-bottom: 10pt;
    margin-bottom: 14pt;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16pt;
}
.dk-rep-brand {
    display: flex;
    align-items: center;
    gap: 10pt;
}
.dk-rep-brand-mark {
    width: 42pt; height: 42pt;
    background: #0F172A;
    color: #fff;
    border-radius: 6pt;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 16pt;
    letter-spacing: 0.04em;
}
.dk-rep-brand-title {
    font-size: 16pt;
    font-weight: 800;
    color: #0F172A;
    letter-spacing: 0.02em;
    line-height: 1.1;
}
.dk-rep-brand-sub {
    font-size: 9pt;
    color: #64748B;
    margin-top: 2pt;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.dk-rep-meta {
    text-align: right;
    font-size: 9pt;
}
.dk-rep-date {
    font-weight: 700;
    color: #0F172A;
    font-size: 11pt;
    margin-bottom: 2pt;
}
.dk-rep-printed {
    color: #94A3B8;
    font-size: 8pt;
}

/* KPI bloğu (üst — 4 kutu) */
.dk-rep-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6pt;
    margin-bottom: 16pt;
}
.dk-rep-kpi {
    border: 1px solid #CBD5E1;
    border-radius: 5pt;
    padding: 8pt 10pt;
    text-align: center;
}
.dk-rep-kpi.accent {
    border-color: #EA580C;
    background: #FFF7ED;
}
.dk-rep-kpi-label {
    font-size: 7.5pt;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748B;
    margin-bottom: 3pt;
}
.dk-rep-kpi-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 16pt;
    font-weight: 700;
    color: #0F172A;
    letter-spacing: -0.02em;
    line-height: 1.1;
}
.dk-rep-kpi.accent .dk-rep-kpi-value { color: #EA580C; }

/* Section başlığı + tablo */
.dk-rep-section {
    margin-bottom: 14pt;
    page-break-inside: avoid;
}
.dk-rep-section-title {
    font-size: 9.5pt;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #0F172A;
    margin-bottom: 5pt;
    padding-bottom: 3pt;
    border-bottom: 1px solid #CBD5E1;
}

.dk-rep-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 9pt;
}
.dk-rep-table th,
.dk-rep-table td {
    padding: 4pt 6pt;
    text-align: left;
    border-bottom: 1px solid #E2E8F0;
    vertical-align: top;
}
.dk-rep-table thead th {
    font-size: 7.5pt;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748B;
    background: #F8FAFC;
    border-bottom: 1.5px solid #CBD5E1;
}
.dk-rep-table tbody tr:last-child td { border-bottom: none; }
.dk-rep-table .dk-rep-num { text-align: right; }
.dk-rep-table .dk-mono { font-family: 'JetBrains Mono', monospace; }
.dk-rep-table .dk-rep-net { font-weight: 700; color: #EA580C; }

/* Ölçüm tablosu yoğunlaşırsa font küçülsün */
.dk-rep-table.sz-sm { font-size: 8pt; }
.dk-rep-table.sz-sm th, .dk-rep-table.sz-sm td { padding: 3pt 5pt; }
.dk-rep-table.sz-xs { font-size: 7.5pt; }
.dk-rep-table.sz-xs th, .dk-rep-table.sz-xs td { padding: 2.5pt 4pt; }

.dk-rep-empty {
    padding: 14pt;
    text-align: center;
    color: #94A3B8;
    font-style: italic;
    border: 1px dashed #CBD5E1;
    border-radius: 4pt;
}

/* Alt — imza alanı */
.dk-rep-footer {
    margin-top: 24pt;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24pt;
    page-break-inside: avoid;
}
.dk-rep-sign {
    border-top: 1px solid #0F172A;
    padding-top: 6pt;
    font-size: 9pt;
    color: #475569;
    text-align: center;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* Dashboard'daki RAPOR butonu — küçük "outline-light" stiline benzer ama "light" zemin */
.dk-daily-report-btn {
    background: var(--accent) !important;
    color: white !important;
    border: 1px solid var(--accent) !important;
    transition: all 150ms;
}
.dk-daily-report-btn:hover {
    background: #EA580C !important;
    border-color: #EA580C !important;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(249,115,22,0.30);
}

/* ============================================================
   Image Viewer (Lightbox) — DkImageViewer.open(url, {title, caption})
   Drawer'lardan görüntü büyütme için tam ekran overlay.
   ============================================================ */
.dk-image-viewer {
    position: fixed;
    inset: 0;
    background: rgba(7, 11, 22, 0.92);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 9000; /* drawer (8000) ve backdrop (7900) üstünde */
    display: none;
    flex-direction: column;
    opacity: 0;
    transition: opacity 180ms ease;
}
.dk-image-viewer.open {
    display: flex;
    opacity: 1;
}
.dk-iv-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    background: rgba(15, 23, 42, 0.6);
    border-bottom: 1px solid rgba(255,255,255,0.08);
    color: #E2E8F0;
}
.dk-iv-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.dk-iv-title i {
    font-size: 16px;
    color: var(--accent);
}
.dk-iv-actions {
    display: flex;
    gap: 6px;
}
.dk-iv-btn {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.10);
    color: #E2E8F0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    transition: all 130ms;
}
.dk-iv-btn:hover {
    background: rgba(255,255,255,0.14);
    border-color: rgba(255,255,255,0.20);
    color: white;
}
.dk-iv-btn-close:hover {
    background: rgba(239, 68, 68, 0.25);
    border-color: rgba(239, 68, 68, 0.55);
}
.dk-iv-stage {
    flex: 1;
    overflow: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    position: relative;
}
.dk-iv-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    cursor: zoom-in;
    transition: transform 220ms cubic-bezier(.22,.61,.36,1);
    box-shadow: 0 12px 40px rgba(0,0,0,0.55);
    border-radius: 6px;
    background: #0F172A;
}
.dk-iv-img.zoomed {
    transform: scale(2);
    cursor: zoom-out;
    max-width: none;
    max-height: none;
}
.dk-iv-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.dk-iv-spinner .spinner {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255,255,255,0.18);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: dk-iv-spin 0.8s linear infinite;
}
@keyframes dk-iv-spin { to { transform: rotate(360deg); } }
.dk-iv-error {
    color: #FCA5A5;
    text-align: center;
    font-size: 13px;
}
.dk-iv-error i {
    font-size: 32px;
    opacity: 0.6;
    margin-bottom: 8px;
    display: block;
}
.dk-iv-caption {
    padding: 10px 18px 14px;
    color: #94A3B8;
    font-size: 12px;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    background: rgba(15, 23, 42, 0.4);
    border-top: 1px solid rgba(255,255,255,0.05);
    min-height: 1.2em;
}

/* ============================================================
   Drawer içinde snapshot bloğu — assign-drawer + paylaşılan stil
   ============================================================ */
.dk-snap-block {
    background: #0F172A;
    border: 1px solid var(--border);
    border-radius: var(--r-md);
    overflow: hidden;
    margin-bottom: var(--s-4);
    position: relative;
}
.dk-snap-block-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: rgba(15, 23, 42, 0.6);
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.dk-snap-block-title {
    font-size: 10px;
    font-weight: 700;
    color: var(--accent);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
}
.dk-snap-zoom-btn {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    color: #E2E8F0;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 130ms;
}
.dk-snap-zoom-btn:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: white;
}
.dk-snap-img-wrap {
    cursor: zoom-in;
    display: block;
    text-decoration: none;
}
.dk-snap-img {
    display: block;
    width: 100%;
    max-height: 320px;
    object-fit: contain;
    background: #0F172A;
}
.dk-snap-missing {
    padding: 26px 16px;
    text-align: center;
    color: #64748B;
    font-size: 12px;
    background: #0F172A;
}
.dk-snap-missing i {
    font-size: 28px;
    opacity: 0.4;
    display: block;
    margin-bottom: 6px;
}

/* ============================================================
   Topbar Kullanıcı Menüsü — login sonrası açılır dropdown
   ============================================================ */
.topbar-user-wrap {
    position: relative;
    margin-left: 4px;
}
.topbar-user-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #FFFFFF;
    border: 1.5px solid #CBD5E1;
    border-radius: 999px;
    padding: 6px 12px 6px 8px;
    color: #0F172A;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 130ms;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}
.topbar-user-btn:hover {
    background: var(--accent);
    color: #FFFFFF;
    border-color: var(--accent);
    box-shadow: 0 2px 6px rgba(249, 115, 22, 0.30);
}
.topbar-user-btn:hover .topbar-user-role {
    background: rgba(255, 255, 255, 0.95);
    color: var(--accent);
}
.topbar-user-btn i.bi-person-circle {
    font-size: 20px;
    color: var(--accent);
}
.topbar-user-btn:hover i.bi-person-circle { color: #FFFFFF; }
.topbar-user-name {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: inherit;
}
.topbar-user-role {
    background: var(--accent);
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    padding: 2px 7px;
    border-radius: 4px;
    line-height: 1.2;
}

.topbar-user-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 240px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
    overflow: hidden;
    z-index: 1000;
}
.topbar-user-menu[hidden] { display: none; }
.topbar-user-menu-head {
    padding: 14px 16px;
    background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
    color: white;
}
.topbar-user-menu-name { font-size: 13px; font-weight: 700; }
.topbar-user-menu-email {
    font-size: 11px;
    color: #94A3B8;
    margin-top: 2px;
    font-family: 'JetBrains Mono', monospace;
}
.topbar-user-menu-tenant {
    font-size: 10px;
    color: var(--accent);
    margin-top: 6px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 5px;
}
.topbar-user-menu-tenant i { font-size: 12px; }
.topbar-user-menu form { margin: 0; }
.topbar-user-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    width: 100%;
    text-decoration: none;
    color: #0F172A;
    background: #FFFFFF;
    border: 0;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 120ms, color 120ms;
    font-family: inherit;
    text-align: left;
}
.topbar-user-menu-item:hover {
    background: #FFF7ED;
    color: var(--accent);
}
.topbar-user-menu-item i {
    font-size: 16px;
    color: var(--accent);
    width: 18px;
    text-align: center;
}
.topbar-user-menu-item:hover i { color: var(--accent); }
.topbar-user-menu-item.danger {
    color: #B91C1C;
}
.topbar-user-menu-item.danger i { color: #DC2626; }
.topbar-user-menu-item.danger:hover { background: #FEE2E2; color: #7F1D1D; }
.topbar-user-menu-item.danger:hover i { color: #7F1D1D; }
.topbar-user-menu-item + .topbar-user-menu-item,
.topbar-user-menu form .topbar-user-menu-item {
    border-top: 1px solid #F1F5F9;
}

/* ============================================================
   Settings sayfaları (/settings/users + /settings/kantars)
   ============================================================ */
.dk-settings-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px;
}
.dk-settings-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 22px;
}
.dk-settings-head h1 {
    font-size: 22px;
    font-weight: 700;
    color: var(--text);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.dk-settings-head h1 i { color: var(--accent); }
.dk-settings-head p.muted {
    color: var(--text-muted);
    font-size: 12px;
    margin: 4px 0 0 0;
}
.dk-settings-table-wrap {
    background: white;
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
}
.dk-settings-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}
.dk-settings-table thead th {
    background: #F8FAFC;
    color: var(--text-muted);
    padding: 11px 16px;
    text-align: left;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--border);
}
.dk-settings-table tbody td {
    padding: 14px 16px;
    border-top: 1px solid var(--border);
    font-size: 13px;
    vertical-align: middle;
}
.dk-settings-table tbody tr:first-child td { border-top: 0; }
.dk-settings-table tbody tr:hover { background: #FFFBEB; }