/* NXLink light theme. Keep all palette values here. */
:root {
    --color-primary: #008A4E; /* Accessible normal-size text on white; reference green stays on solid buttons. */
    --color-bg: #F5F5F5;
    --color-surface: #FFFFFF;
    --color-text: #1F2329;
    --color-muted: #646A73;
    --color-primary-fill: #00A35C;
    --color-primary-hover: #008A4E;
    --color-primary-soft: #E6F6EE;
    --color-bg-app: #F5F5F5;
    --color-bg-surface: #FFFFFF;
    --color-border: #EBEDF0;
    --color-text-primary: #1F2329;
    --color-text-secondary: #646A73;
    --color-text-muted: #737A83; /* Darkened from #8F959E for readable small labels. */
    --color-table-header-bg: #F5F6F7;
    --color-row-hover: #FAFAFA;
    --color-success: #008A4E;
    --color-success-soft: #E6F6EE;
    --color-warning: #9A6000;
    --color-warning-soft: #FFF4DF;
    --color-danger: #C62823;
    --color-danger-soft: #FFF0EF;
    --color-info: #2457C5;
    --color-info-soft: #EAF0FF;
    --radius-card: 8px;
    --radius-button: 6px;
    --radius-pill: 999px;
    --shadow-card: 0 1px 2px rgb(0 0 0 / .04);
    --shadow-popover: 0 8px 24px rgb(31 35 41 / .12);
    --overlay: rgb(0 0 0 / .45);
}
/* Opt-in accents for decorative headings and asset navigation summaries. */
.nx-accent { color: var(--color-primary) !important; }
.nx-heading { color: var(--color-text-primary) !important; }
.nx-muted { color: var(--color-text-secondary) !important; }
.nx-asset-summary { background: var(--color-bg-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow-card); transition: background-color .15s, border-color .15s; }
a:hover .nx-asset-summary, a:focus-visible .nx-asset-summary { background: var(--color-primary-soft); border-color: var(--color-primary); }
html { color-scheme: light; }
body, body.bg-gray-900, .dk-app { background: var(--color-bg-app) !important; color: var(--color-text-primary); font: 14px/1.5 Inter, system-ui, sans-serif; }
.dk-shell { display: flex; min-height: 100vh; padding-top: 50px; }
.dk-shell--plain { padding-top: 0; }
.dk-main { min-width: 0; flex: 1; }
.dk-main > .dk-content { padding: 20px !important; }
.dk-topbar { position: fixed; inset: 0 0 auto; height: 50px; z-index: 1000; display: flex; align-items: center; gap: 16px; padding: 0 16px; background: var(--color-bg-surface); border-bottom: 1px solid var(--color-border); }
.dk-brand { width: 204px; flex: 0 0 204px; display: flex; align-items: center; gap: 8px; font-weight: 600; color: var(--color-primary); text-decoration: none; white-space: nowrap; }
.dk-brand img { max-width: 100%; height: 22px; width: auto; object-fit: contain; }
#sidebar .logo-long img, #sidebar .logo-short img { max-width: 100%; object-fit: contain; }
.dk-page-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-text-primary); font-weight: 500; }
.dk-topbar-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; min-width: 0; }
.dk-pill, .dk-icon-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; padding: 0 10px; border: 1px solid var(--color-border); border-radius: var(--radius-pill); background: var(--color-bg-surface); color: var(--color-text-primary); white-space: nowrap; text-decoration: none; }
.dk-icon-btn { width: 34px; padding: 0; border-color: transparent; position: relative; }
.dk-unread-count { position: absolute; inset: -6px -8px auto auto; min-width: 18px; padding: 0 4px; border-radius: var(--radius-pill); background: var(--color-danger); color: white; font-size: 10px; font-weight: 600; line-height: 18px; text-align: center; }
.dk-unread-count[hidden] { display: none; }
.dk-pill:hover, .dk-icon-btn:hover { background: var(--color-primary-soft); color: var(--color-primary); }
.dk-topbar-time { color: var(--color-text-secondary); font-size: 12px; white-space: nowrap; }
.dk-topbar-avatar { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; }
.dk-status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--color-success); }
.dk-topbar .dropdown-menu { z-index: 10020; }
#auxModal { z-index: 10050 !important; }
#sidebarBackdrop.sidebar-open { z-index: 9998 !important; }
.dk-topbar ~ .dk-shell #currentDateTime, .dk-topbar ~ .dk-shell #userTypeInfo { display: none; }
#sidebar { width: 220px !important; flex: 0 0 220px; top: 50px; height: calc(100vh - 50px); background: var(--color-bg-surface) !important; border-right: 1px solid var(--color-border) !important; box-shadow: none !important; backdrop-filter: none !important; z-index: 999 !important; }
#sidebar > div:first-child { display: none; }
#sidebar.sidebar-mini { width: 64px !important; flex-basis: 64px; }
#sidebar.sidebar-mini:hover { width: 220px !important; flex-basis: 220px; }
#sidebar nav a, #sidebar nav button.sidebar-menu-toggle { min-height: 38px; color: var(--color-text-primary) !important; border-radius: var(--radius-card); font-size: 14px; }
#sidebar nav i[class*="bx"] { font-size: 19px !important; }
#sidebar nav .fa-chevron-down { color: var(--color-text-secondary); }
#sidebar nav a:hover, #sidebar nav button.sidebar-menu-toggle:hover { background: var(--color-table-header-bg) !important; }
#sidebar nav .dk-active, #sidebar nav .dk-active:hover { background: var(--color-primary-soft) !important; color: var(--color-primary) !important; font-weight: 500; }
#sidebar .sidebar-scroll { scrollbar-color: var(--color-border) transparent; }
#sidebar .sidebar-scroll::-webkit-scrollbar-track { background: transparent; }
#sidebar .sidebar-scroll::-webkit-scrollbar-thumb { background: var(--color-border); }
#sidebar .sidebar-scroll::-webkit-scrollbar-thumb:hover { background: var(--color-text-muted); }
#sidebar .dk-sidebar-bottom { border-top: 1px solid var(--color-border); }
#sidebar .dk-profile-host { height: 0; padding: 0; border: 0; }
#sidebar #profileMenu { position: fixed; top: 46px; bottom: auto; right: 12px; left: auto; width: 255px; margin: 0; background: var(--color-bg-surface) !important; color: var(--color-text-primary); border: 1px solid var(--color-border); box-shadow: var(--shadow-popover); }
#sidebar #sidebar-notif-card { position: fixed; top: 50px; right: 12px; width: min(340px, calc(100vw - 24px)); padding: 12px; background: var(--color-bg-surface); border: 1px solid var(--color-border); border-radius: var(--radius-card); box-shadow: var(--shadow-popover); }
#sidebar #sidebar-notif-list { background: var(--color-bg-surface) !important; border-color: var(--color-border) !important; }
#sidebar #profileMenu { display: block !important; }
#sidebar #profileMenu .profile-info-block { display: block !important; }
#sidebar #profileMenu :is(.text-white, .text-gray-300) { color: var(--color-text-primary) !important; }
#sidebar #profileMenu :is(.text-gray-400, .text-gray-500) { color: var(--color-text-secondary) !important; }
#sidebar #profileMenu :is(.bg-gray-700, .bg-gray-800) { background: var(--color-table-header-bg) !important; }
#sidebar #profileMenu :is(.border-gray-700, .border-gray-800) { border-color: var(--color-border) !important; }
#sidebar #profileMenu :is(a, button):hover { background: var(--color-primary-soft) !important; color: var(--color-primary) !important; }
#sidebar #sidebar-notif-card .text-white { color: var(--color-text-primary) !important; }
#sidebar #sidebar-notif-card a:hover { background: var(--color-primary-soft) !important; }
#sidebar .dk-sidebar-collapse { align-self: flex-end; width: 28px; height: 28px; margin: 8px 8px 12px 0; background: var(--color-bg-surface); border: 1px solid var(--color-border); border-radius: 50%; color: var(--color-primary); z-index: 1; box-shadow: var(--shadow-card); }
#sidebar.sidebar-mini:not(:hover) .dk-sidebar-collapse { margin-right: 18px; }
/* Existing Tailwind CDN dark utilities in legacy screens. Keep specificity above utility rules. */
.dk-app .from-blue-900.via-indigo-900.to-gray-900, .dk-app .from-blue-900.via-gray-900.to-gray-900, .dk-app .from-blue-900.to-purple-900 { background: var(--color-bg-app) !important; }
.dk-app .from-blue-600.to-purple-600, .dk-app .from-blue-600.to-blue-800 { background: var(--color-primary-hover) !important; }
.dk-app .from-blue-600.to-purple-600.text-white, .dk-app .from-blue-600.to-purple-600 .text-white, .dk-app .from-blue-600.to-blue-800.text-white { color: white !important; }
.dk-app .bg-gray-900, .dk-app .bg-gray-950, .dk-app .bg-slate-900, .dk-app .bg-slate-950, .dk-app .bg-black, .dk-app .bg-dark, .dk-app .bg-\[\#0f172a\], .dk-app .bg-\[\#111827\] { background-color: var(--color-bg-surface) !important; }
.dk-app .bg-gray-900\/60, .dk-app .bg-gray-900\/70, .dk-app .bg-gray-900\/80, .dk-app .bg-gray-800\/60, .dk-app .bg-gray-800\/70, .dk-app .bg-gray-800\/80, .dk-app .bg-gray-800\/100 { background: var(--color-bg-surface) !important; }
.dk-app > .bg-gray-900, .dk-app main > .dk-content > .bg-gray-900 { background: var(--color-bg-app) !important; }
.dk-app .bg-gray-700\/10, .dk-app .bg-gray-700\/20, .dk-app .bg-gray-700\/30, .dk-app .bg-gray-700\/40, .dk-app .bg-gray-700\/50, .dk-app .bg-gray-700\/60, .dk-app .bg-gray-700\/70, .dk-app .bg-gray-700\/80 { background-color: var(--color-table-header-bg) !important; }
.dk-app .bg-gray-800, .dk-app .bg-gray-700, .dk-app .bg-gray-600, .dk-app .bg-slate-800, .dk-app .bg-slate-700, .dk-app .bg-gray-800\/50, .dk-app .bg-gray-900\/50, .dk-app .bg-gray-900\/60, .dk-app .bg-gray-900\/95 { background-color: var(--color-bg-surface) !important; }
.dk-app .text-white, .dk-app .text-gray-100, .dk-app .text-gray-200, .dk-app .text-gray-300, .dk-app .text-slate-100, .dk-app .text-slate-200 { color: var(--color-text-primary) !important; }
.dk-app .text-gray-400, .dk-app .text-slate-400, .dk-app .text-white\/90, .dk-app .text-white\/80 { color: var(--color-text-secondary) !important; }
.dk-app .text-light, .dk-app .text-light-emphasis { color: var(--color-text-primary) !important; }
.dk-app .btn-close-white { filter: none; }
.dk-app .text-gray-500, .dk-app .text-slate-500 { color: var(--color-text-muted) !important; }
.dk-app .bg-white\/10 { background: var(--color-bg-surface) !important; }
.dk-app .placeholder-white\/70::placeholder { color: var(--color-text-muted) !important; }
.dk-app .border-gray-700, .dk-app .border-gray-800, .dk-app .border-slate-700, .dk-app .border-gray-600 { border-color: var(--color-border) !important; }
.dk-app .bg-blue-600, .dk-app .bg-blue-500, .dk-app .bg-indigo-600, .dk-app .bg-green-500, .dk-app .bg-green-600, .dk-app .btn-primary, .dk-app .btn-success { background: var(--color-primary-hover) !important; border-color: var(--color-primary-hover) !important; color: white !important; }
.dk-app .bg-blue-600:hover, .dk-app .bg-green-600:hover, .dk-app .btn-primary:hover, .dk-app .btn-success:hover { background: var(--color-primary) !important; border-color: var(--color-primary) !important; }
.dk-app :is(.bg-blue-600, .bg-blue-500, .bg-green-500, .bg-green-600, .bg-emerald-500, .bg-teal-500, .bg-cyan-500, .bg-red-500, .bg-red-600, .bg-danger, .btn-danger).text-white { color: white !important; }
.dk-app .bg-blue-600 .text-white, .dk-app .bg-blue-500 .text-white, .dk-app .bg-green-500 .text-white { color: white !important; }
.dk-app .text-blue-400, .dk-app .text-blue-500, .dk-app .text-blue-600, .dk-app .text-green-400, .dk-app .text-green-500 { color: var(--color-primary) !important; }
.dk-app .bg-blue-50, .dk-app .bg-blue-100, .dk-app .bg-green-50, .dk-app .bg-green-100 { background: var(--color-primary-soft) !important; }
#quickAccessPanel { background: var(--color-bg-surface) !important; color: var(--color-text-primary) !important; border-left: 1px solid var(--color-border); }
#quickAccessPanel .text-white, #quickAccessPanel .text-gray-100, #quickAccessPanel .text-gray-200, #quickAccessPanel .text-gray-300 { color: var(--color-text-primary) !important; }
#quickAccessPanel .bg-gray-800, #quickAccessPanel .bg-gray-900 { background: var(--color-bg-surface) !important; }
#quickAccessPanel .border-gray-700 { border-color: var(--color-border) !important; }
/* Compact navigation shares one scroll area, including utility links. */
#sidebar .sidebar-scroll { min-height: 0; padding: 12px 0; }
#sidebar .sidebar-scroll nav ul { margin-bottom: 0; padding-bottom: 0; }
#sidebar .sidebar-scroll nav li { margin-top: 4px; }
#sidebar .sidebar-scroll nav li:first-child { margin-top: 0; }
#sidebar .dk-sidebar-bottom { margin-top: 16px; padding-top: 12px; padding-bottom: 0; }
#sidebar nav .menu-section > ul { padding-left: 28px; margin-top: 4px; }
#sidebar nav .menu-section > ul a { min-height: 32px; }
#sidebar nav :is(a, button):focus-visible,
#quickAccessPanel :is(button, input, textarea):focus-visible,
#toggleQuickAccess:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
/* Keep the panel below the fixed 50px application header and inside the viewport. */
#quickAccessPanel { top: 50px; bottom: 0; width: min(400px, 100vw); height: calc(100vh - 50px); height: calc(100dvh - 50px); overflow: hidden; box-shadow: var(--shadow-popover); }
#quickAccessPanel > div:first-child { flex-shrink: 0; padding: 16px 20px; }
#quickAccessPanel h2 { display: flex; align-items: center; gap: 8px; }
#quickAccessPanel h3 { color: var(--color-text-primary) !important; font-size: 14px; line-height: 1.5; }
#quickAccessPanel .qa-content { min-height: 0; padding: 16px 20px 24px; overscroll-behavior: contain; }
#quickAccessPanel .qa-content > div + div { margin-top: 24px; }
#quickAccessPanel .qa-filters { flex-shrink: 0; justify-content: flex-start; gap: 8px; padding: 12px 20px; border-bottom: 1px solid var(--color-border); }
#quickAccessPanel button { min-height: 36px; border-radius: var(--radius-button); transition: background-color .15s; }
#quickAccessPanel button:hover { transform: none; box-shadow: none; }
#quickAccessPanel .qa-filters button { margin: 0; background: var(--color-table-header-bg) !important; color: var(--color-text-secondary); border: 1px solid var(--color-border); }
#quickAccessPanel .qa-filters button[aria-pressed="true"] { background: var(--color-primary-soft) !important; border-color: var(--color-primary); color: var(--color-primary); }
#quickAccessPanel #filterUrgent[aria-pressed="true"] { color: var(--color-danger); background: var(--color-danger-soft) !important; border-color: var(--color-danger); }
#quickAccessPanel #filterAlarm[aria-pressed="true"] { color: var(--color-warning); background: var(--color-warning-soft) !important; border-color: var(--color-warning); }
#quickAccessPanel #taskList li { padding: 12px; border: 1px solid var(--color-border); border-left: 3px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-table-header-bg); line-height: 1.6; overflow-wrap: anywhere; }
#quickAccessPanel #taskList li:hover { transform: none; }
#quickAccessPanel #taskList li[data-priority="urgent"] { background: var(--color-danger-soft); border-left-color: var(--color-danger); }
#quickAccessPanel #taskList li[data-priority="alarm"] { background: var(--color-warning-soft); border-left-color: var(--color-warning); }
#quickAccessPanel .qa-status { display: block; font-size: 11px; font-weight: 600; color: var(--color-text-secondary); }
#quickAccessPanel [data-priority="urgent"] .qa-status { color: var(--color-danger); }
#quickAccessPanel .qa-label { display: block; font-size: 12px; font-weight: 500; color: var(--color-text-secondary); margin-bottom: 6px; }
#quickAccessPanel :is(input, textarea) { min-width: 0; width: 100%; background: var(--color-bg-surface) !important; color: var(--color-text-primary) !important; border: 1px solid var(--color-text-muted); text-align: left; min-height: 40px; }
#quickAccessPanel textarea { min-height: 88px; }
#quickAccessPanel .qa-reminder-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; margin-bottom: 12px; }
#quickAccessPanel .qa-reminder-fields label:first-child { grid-column: 1 / -1; }
#quickAccessPanel .qa-reminder-fields input { display: block; margin-top: 6px; }
#quickAccessPanel :is(.text-gray-400, .text-gray-500) { color: var(--color-text-secondary) !important; }
#quickAccessPanel :is(#setAlarm, #miniChatStartBtn, #miniChatSendBtn) { color: var(--color-bg-surface) !important; background: var(--color-primary-hover) !important; }
#quickAccessPanel button:disabled { opacity: .5; cursor: not-allowed; }
#quickAccessPanel .qa-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
#quickAccessPanel .qa-actions button, #quickAccessPanel :is(#quickHold, #quickUnhold) { background: var(--color-bg-surface) !important; border: 1px solid var(--color-border); color: var(--color-text-primary) !important; }
#quickAccessPanel .qa-actions button:hover, #quickAccessPanel :is(#quickHold, #quickUnhold):hover { background: var(--color-primary-soft) !important; border-color: var(--color-primary); }
#quickAccessPanel :is(#closeQuickAccess, #toggleMiniChat) { color: var(--color-text-secondary); padding: 4px 8px; }
#toggleQuickAccess { background: var(--color-primary-hover) !important; min-width: 36px; min-height: 44px; }
@media (prefers-reduced-motion: reduce) {
    #quickAccessPanel, #quickAccessPanel *, #sidebar { transition: none !important; animation: none !important; }
}
/* Legacy Blade inline palette: retain semantic foreground; only remap known dark surfaces. */
.dk-app :is([style*="background: #111827"], [style*="background:#111827"], [style*="background: #1f2937"], [style*="background:#1f2937"], [style*="background: #0f172a"], [style*="background:#0f172a"], [style*="background: #374151"], [style*="background:#374151"], [style*="background: #4b5563"], [style*="background:#4b5563"], [style*="background: #2d3748"], [style*="background:#2d3748"], [style*="background-color: #111827"], [style*="background-color:#111827"], [style*="background-color: #1f2937"], [style*="background-color:#1f2937"], [style*="background-color: #0f172a"], [style*="background-color:#0f172a"], [style*="background-color: #374151"], [style*="background-color:#374151"], [style*="background-color: #4b5563"], [style*="background-color:#4b5563"], [style*="background-color: #2d3748"], [style*="background-color:#2d3748"]) { background-color: var(--color-bg-surface) !important; }
.dk-app .shadow-lg, .dk-app .shadow-xl, .dk-app .shadow-2xl { box-shadow: var(--shadow-card) !important; }
.dk-app .card, .dk-app .bg-gray-800.rounded-2xl, .dk-app .bg-gray-800.rounded-xl { background: var(--color-bg-surface) !important; border: 1px solid var(--color-border); border-radius: var(--radius-card) !important; box-shadow: var(--shadow-card); }
.dk-app h1, .dk-app h2, .dk-app h3, .dk-app h4, .dk-app h5 { color: var(--color-text-primary); font-weight: 600; }
.dk-app .btn { border-radius: var(--radius-button); }
.dk-app .btn-secondary, .dk-app .btn-outline-secondary { background: var(--color-bg-surface); border-color: var(--color-border); color: var(--color-text-primary); }
.dk-app .btn-danger { background: var(--color-danger); border-color: var(--color-danger); color: white; }
.dk-app :is(input:not([type=checkbox]):not([type=radio]), textarea, select, .form-control, .form-select) { background-color: var(--color-bg-surface); color: var(--color-text-primary); border: 1px solid var(--color-border); border-radius: var(--radius-card); }
.dk-app :is(input, textarea, select, button, a):focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.dk-app :is(input, textarea, select, .form-control, .form-select):focus { border-color: var(--color-primary-fill); box-shadow: 0 0 0 3px var(--color-primary-soft); }
.dk-app :is(input, textarea, select):disabled { background: var(--color-table-header-bg); color: var(--color-text-secondary); }
.dk-app :is(input, textarea)::placeholder { color: var(--color-text-muted); }
.dk-app :is(input[type=checkbox], input[type=radio], .form-check-input) { accent-color: var(--color-primary-fill); }
.dk-app .form-check-input:checked { background-color: var(--color-primary-fill); border-color: var(--color-primary-fill); }
.dk-app :is(table, .table) { color: var(--color-text-primary); }
.dk-app :is(th, .table thead th, table.dataTable thead th) { background: var(--color-table-header-bg); color: var(--color-text-secondary); border-color: var(--color-border); font-weight: 500; }
.dk-app :is(td, .table td, table.dataTable td) { border-color: var(--color-border); }
.dk-app .table-dark, .dk-app .table-dark > :not(caption) > * > * { --bs-table-bg: var(--color-bg-surface); --bs-table-color: var(--color-text-primary); --bs-table-border-color: var(--color-border); --bs-table-striped-bg: var(--color-table-header-bg); --bs-table-striped-color: var(--color-text-primary); --bs-table-hover-bg: var(--color-row-hover); --bs-table-hover-color: var(--color-text-primary); background-color: var(--color-bg-surface); color: var(--color-text-primary); box-shadow: none; }
.dk-app .table-dark.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: var(--color-table-header-bg); color: var(--color-text-primary); }
.dk-app .table-dark thead th, .dk-app .table-dark > thead > tr > th { background-color: var(--color-table-header-bg); color: var(--color-text-secondary); }
.dk-app :is(tbody tr:hover, .table-hover tbody tr:hover) { background: var(--color-row-hover); }
.dk-app .table-responsive, .dk-app .dataTables_wrapper, .dk-app .dt-container { max-width: 100%; overflow-x: auto; }
.dk-app :is(.paginate_button.current, .dt-paging-button.current, .pagination .active .page-link) { background: var(--color-primary-soft) !important; color: var(--color-primary) !important; border-color: var(--color-border) !important; }
.dk-app :is(.page-link, .paginate_button, .dt-paging-button) { color: var(--color-primary); }
.dk-app :is(.nav-tabs .nav-link.active, .dropdown-item.active) { color: var(--color-primary); background: var(--color-primary-soft); border-color: var(--color-border); }
.dk-app :is(.breadcrumb, .breadcrumb-item, .breadcrumb-item a) { color: var(--color-text-secondary); }
.dk-app :is(.dropdown-menu, .popover, .offcanvas, .modal-content, .toast, .accordion-item, .tooltip-inner) { background: var(--color-bg-surface); color: var(--color-text-primary); border-color: var(--color-border); border-radius: var(--radius-card); box-shadow: var(--shadow-popover); }
.dk-app .dropdown-item { color: var(--color-text-primary); }
.dk-app .dropdown-item:hover { background: var(--color-primary-soft); color: var(--color-primary); }
.dk-app :is(.modal-header, .modal-footer, .accordion-button) { background: var(--color-bg-surface); color: var(--color-text-primary); border-color: var(--color-border); }
.modal-backdrop, .offcanvas-backdrop, #sidebarBackdrop.sidebar-open { background: var(--overlay); opacity: 1; }
.dk-app :is(.alert-danger, .bg-red-900\/20) { background: var(--color-danger-soft) !important; color: var(--color-danger) !important; border-color: var(--color-danger); }
.dk-app .alert-success { background: var(--color-success-soft); color: var(--color-success); }
.dk-app .alert-warning { background: var(--color-warning-soft); color: var(--color-warning); }
.dk-app .alert-info { background: var(--color-info-soft); color: var(--color-info); }
.dk-app :is(.badge, .rounded-full) { border-radius: var(--radius-pill); }
.dk-app :is(.select2-container--default .select2-selection, .select2-container--bootstrap-5 .select2-selection, .selectize-input, .flatpickr-input, .tox .tox-toolbar, .tox .tox-edit-area, .ui-datepicker) { background: var(--color-bg-surface) !important; color: var(--color-text-primary) !important; border-color: var(--color-border) !important; }
.dk-app :is(.select2-dropdown, .selectize-dropdown, .flatpickr-calendar, .tox .tox-dialog), .select2-dropdown, .selectize-dropdown, .flatpickr-calendar, .tox .tox-dialog { background: var(--color-bg-surface); color: var(--color-text-primary); border: 1px solid var(--color-border); box-shadow: var(--shadow-popover); }
.select2-container--default .select2-results__option--highlighted[aria-selected], .selectize-dropdown .active, .flatpickr-day.selected { background: var(--color-primary-hover) !important; color: white !important; }
.dk-app :is(.select2-container--default .select2-results__option--highlighted, .flatpickr-day.selected) { background: var(--color-primary-fill) !important; color: white !important; }
.swal2-popup { background: var(--color-bg-surface); color: var(--color-text-primary); border-radius: var(--radius-card); box-shadow: var(--shadow-popover); }
.swal2-confirm { background: var(--color-primary-fill) !important; }
.swal2-container.swal2-backdrop-show { background: var(--overlay) !important; }
.dk-app :is(.apexcharts-text, .apexcharts-legend-text, .chartjs-render-monitor) { color: var(--color-text-secondary) !important; }
.dk-app .apexcharts-gridline { stroke: var(--color-border); }
.dk-app .apexcharts-tooltip, .dk-app .apexcharts-xaxistooltip { background: var(--color-bg-surface) !important; color: var(--color-text-primary) !important; border-color: var(--color-border) !important; box-shadow: var(--shadow-popover) !important; }
.dk-app :is(.spinner-border, .spinner-grow) { color: var(--color-primary); }
.dk-app .placeholder, .dk-app .skeleton { background: var(--color-table-header-bg); }
* { scrollbar-width: thin; scrollbar-color: var(--color-border) transparent; }
::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-thumb { background: var(--color-border); border-radius: var(--radius-pill); }
::-webkit-scrollbar-track { background: transparent; }
/* Channel identity is conveyed by glyph and label, not a separate palette per card. */
.dk-app .dk-channel-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: var(--radius-card);
    background: var(--color-primary-soft);
    color: var(--color-primary);
}
.dk-app .dk-channel-summary .dk-channel-value { color: var(--color-text-primary); }
.dk-app .dk-channel-summary .space-y-3 i { color: var(--color-text-secondary); }
/* Shared component finish: match the login's quiet surfaces and green accents. */
.dk-app :is(.card, .metric-card, .content-card, .ed-stat-card, .license-kpi) {
    background: var(--color-bg-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
}
.dk-app :is(.card-header, .card-footer) {
    background: transparent;
    border-color: var(--color-border);
    padding: 16px 20px;
}
.dk-app .card-title { font-weight: 600; letter-spacing: -.02em; }
.dk-app :is(.metric-value, .license-kpi-number) { color: var(--color-text-primary); font-variant-numeric: tabular-nums; letter-spacing: -.035em; }
.dk-app :is(.metric-label, .license-kpi-note) { color: var(--color-text-secondary); }
.dk-app :is(.metric-icon, .license-kpi-icon, .card .avatar-title:not(img)) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--color-primary-soft) !important;
    color: var(--color-primary) !important;
    border-radius: var(--radius-card) !important;
    box-shadow: none;
    font-size: 20px;
    line-height: 1;
}
.dk-app :is(.metric-icon, .license-kpi-icon) { width: 44px; height: 44px; }
.dk-app .metric-icon.queue { background: var(--color-warning-soft) !important; color: var(--color-warning) !important; }
.dk-app .card .avatar-title:is(.bg-danger, .bg-soft-danger) { background: var(--color-danger-soft) !important; color: var(--color-danger) !important; }
.dk-app .card .avatar-title:is(.bg-warning, .bg-soft-warning) { background: var(--color-warning-soft) !important; color: var(--color-warning) !important; }
.dk-app .card .avatar-title:is(.bg-info, .bg-soft-info) { background: var(--color-info-soft) !important; color: var(--color-info) !important; }
.dk-app :is(.btn, .dk-icon-btn, .dk-pill, .dropdown-item, .nav-link, .page-link) {
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease, box-shadow 140ms ease;
}
.dk-app .btn-icon { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 36px; }
.dk-app .btn-outline-primary { color: var(--color-primary); border-color: var(--color-primary); background: transparent; }
.dk-app .btn-outline-primary:hover { background: var(--color-primary-soft); color: var(--color-primary); border-color: var(--color-primary); }
.dk-app :is(.btn-secondary, .btn-outline-secondary):hover { background: var(--color-table-header-bg); color: var(--color-text-primary); }
.dk-app .btn:disabled, .dk-app .btn.disabled { opacity: .55; box-shadow: none; }
.dk-app .dropdown-menu { padding: 6px; }
.dk-app .dropdown-item { border-radius: var(--radius-button); padding: 8px 12px; }
.dk-app .nav-tabs { border-color: var(--color-border); gap: 4px; }
.dk-app .nav-tabs .nav-link { color: var(--color-text-secondary); border-radius: var(--radius-button) var(--radius-button) 0 0; }
.dk-app .nav-tabs .nav-link.active { color: var(--color-primary); font-weight: 600; }
.dk-app .accordion-button:not(.collapsed) { background: var(--color-primary-soft); color: var(--color-primary); box-shadow: none; }
.dk-app .page-link { border-color: var(--color-border); }
.dk-app .page-link:hover { background: var(--color-primary-soft); color: var(--color-primary); }
.dk-app .page-item.disabled .page-link { color: var(--color-text-muted); background: var(--color-table-header-bg); }
@media (prefers-reduced-motion: reduce) {
    .dk-app *, .dk-app *::before, .dk-app *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@media (max-width: 767px) {
    .dk-topbar { gap: 8px; padding: 0 10px; }
    .dk-brand { width: auto; flex: 0 0 auto; }
    .dk-brand span, .dk-topbar-time, .dk-page-name, .dk-topbar .dk-optional { display: none; }
    .dk-topbar-actions { gap: 2px; }
    .dk-main > .dk-content { padding: 16px !important; }
    #sidebar, #sidebar.sidebar-mini { position: fixed; inset: 50px auto 0 0; height: calc(100vh - 50px); width: 220px !important; flex-basis: 220px; transform: translateX(-105%); }
    #sidebar.sidebar-open { transform: none; z-index: 9999 !important; }
    #sidebar.sidebar-mini.sidebar-open .logo-long, #sidebar.sidebar-mini.sidebar-open nav span, #sidebar.sidebar-mini.sidebar-open nav .fa-chevron-down { display: inline-flex; }
    #sidebar.sidebar-mini.sidebar-open .logo-short { display: none; }
    #sidebar.sidebar-mini.sidebar-open nav button, #sidebar.sidebar-mini.sidebar-open nav a { justify-content: flex-start; }
    #sidebar .dk-sidebar-collapse { display: none; }
}