/*
 * Global light-lock UX contract for GPS Singburi.
 * Locks visual baseline to light mode even when legacy dark-mode flags are present.
 */
body.app-shell.light-theme-lock {
    color-scheme: light;
    --bg-primary: #f0f9ff;
    --bg-secondary: #ffffff;
    --bg-surface: #f8fafc;
    --text-primary: #0f172a;
    --text-secondary: #334155;
    --border-color: #dbeafe;
    --surface-shadow: none;
}

/* Normalize if dark-mode accidentally remains on html. */
body.app-shell.light-theme-lock.dark-mode {
    background: #f0f9ff !important;
    color: #0f172a !important;
    --bg-primary: #f0f9ff !important;
    --bg-secondary: #ffffff !important;
    --bg-surface: #f8fafc !important;
    --text-primary: #0f172a !important;
    --text-secondary: #334155 !important;
    --border-color: #dbeafe !important;
    --surface-shadow: none !important;
}

/* Content surfaces never inherit a forced dark canvas. */
body.app-shell.light-theme-lock .main-content-wrapper,
body.app-shell.light-theme-lock .page-content,
body.app-shell.light-theme-lock .main-page,
body.app-shell.light-theme-lock .report-shell,
body.app-shell.light-theme-lock .app-footer {
    background: #f0f9ff !important;
    color: #0f172a !important;
}

/* Keep card/table blocks flat and readable across every page. */
body.app-shell.light-theme-lock .page-content :is(
    .dash-card,
    .stat-card,
    .content-card,
    .card,
    .card-body,
    .card-header,
    .table-section,
    .main-content-container,
    .report-card,
    .report-table-wrapper,
    .dataTables_wrapper,
    .sys-notify-shell,
    .line-reports-card,
    .line-ctn-card,
    .report-table,
    .report-page
) {
    background: #ffffff !important;
    border-color: var(--border-color) !important;
    box-shadow: var(--surface-shadow) !important;
    color: #0f172a !important;
}

body.app-shell.light-theme-lock .page-content :is(
    .dash-card,
    .stat-card,
    .content-card,
    .card,
    .table-section,
    .main-content-container,
    .report-card,
    .report-table-wrapper,
    .dataTables_wrapper,
    .sys-notify-shell,
    .line-reports-card,
    .line-ctn-card
) :is(
    [style*="box-shadow: 0 10px 15px -3px"],
    [style*="box-shadow:0 10px 15px -3px"],
    [style*="box-shadow: 0 4px 6px"],
    [style*="box-shadow:0 4px 6px"],
    [style*="box-shadow: 0 10px 30px"]
) {
    box-shadow: none !important;
}

/* Inputs and select controls always readable. */
body.app-shell.light-theme-lock .page-content :is(input, select, textarea, .custom-input, .custom-select, .form-control, .form-select) {
    background: #ffffff !important;
    border-color: #bfdbfe !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
}

/* Flat, consistent buttons everywhere (no raised shadows). */
body.app-shell.light-theme-lock .page-content :is(button, input[type="button"], input[type="submit"], a.btn, .report-btn, .action-btn, .btn-action, .save-btn, .filter-btn, .page-btn, .btn-pg, .admin-replay-search-btn, .admin-replay-control-btn, .admin-replay-play-btn, .layer-toggle-btn, .map-type-btn) {
    box-shadow: none !important;
    transform: none !important;
}

/* Keep map/detail buttons readable and blue by default contract. */
body.app-shell.light-theme-lock .page-content :is(button, input[type="button"], input[type="submit"], a.btn, .report-btn, .action-btn, .btn-action):not(:where(.btn-link, .btn-close, .logout-btn, [class*="danger"], [class*="delete"], [class*="mdvr-"], [class*="dvr-"])) {
    background: #0369a1 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border-color: #38bdf8 !important;
}

/* Disabled controls remain legible without looking like enabled actions. */
body.app-shell.light-theme-lock .page-content :is(
    button:disabled, button.disabled, button[aria-disabled="true"],
    input[type="button"]:disabled, input[type="submit"]:disabled,
    a.btn.disabled, a.btn[aria-disabled="true"],
    .page-btn.disabled, .btn-pg.disabled,
    .page-item.disabled .page-link, .paginate_button.disabled
),
body.app-shell.light-theme-lock .page-content :is(
    button:disabled, button.disabled, button[aria-disabled="true"],
    .page-btn.disabled, .btn-pg.disabled,
    .page-item.disabled .page-link, .paginate_button.disabled
):hover {
    background: #e2e8f0 !important;
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
    border-color: #94a3b8 !important;
    opacity: 1 !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
}

body.app-shell.light-theme-lock .page-content :is(
    button:disabled, button.disabled, button[aria-disabled="true"],
    .page-btn.disabled, .btn-pg.disabled, .page-item.disabled .page-link
) :is(span, i) {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
    opacity: 1 !important;
}

/* Icon-only badges in report headings should not have dark chips. */
body.app-shell.light-theme-lock .page-content .report-page h2 > span:first-child,
body.app-shell.light-theme-lock .page-content .report-header h2 > span:first-child,
body.app-shell.light-theme-lock .page-content .report-header h3 > span:first-child,
body.app-shell.light-theme-lock .page-content .report-card h2 > span:first-child,
body.app-shell.light-theme-lock .page-content .dashboard-header h2 > span:first-child {
    background: transparent !important;
    color: #0284c7 !important;
}

/* Admin replay: clean cards, controls and timeline text visibility. */
body.app-shell.light-theme-lock.page-admin_replay .admin-replay-layout,
body.app-shell.light-theme-lock.page-admin_replay .admin-replay-sidebar,
body.app-shell.light-theme-lock.page-admin_replay .admin-replay-map {
    background: transparent !important;
    color: #0f172a !important;
}

body.app-shell.light-theme-lock.page-admin_replay .admin-replay-sidebar .sidebar-section,
body.app-shell.light-theme-lock.page-admin_replay .admin-replay-summary,
body.app-shell.light-theme-lock.page-admin_replay .admin-replay-route-list,
body.app-shell.light-theme-lock.page-admin_replay #vehicle-detail-panel,
body.app-shell.light-theme-lock.page-admin_replay .admin-replay-controls,
body.app-shell.light-theme-lock.page-admin_replay #map-control-panel {
    background: #ffffff !important;
    border: 1px solid #dbeafe !important;
    box-shadow: none !important;
    border-radius: 12px !important;
    color: #0f172a !important;
}

body.app-shell.light-theme-lock.page-admin_replay .admin-replay-route-list,
body.app-shell.light-theme-lock.page-admin_replay #summary-card,
body.app-shell.light-theme-lock.page-admin_replay #vehicle-detail-panel,
body.app-shell.light-theme-lock.page-admin_replay #route-list {
    border-color: #e2e8f0 !important;
}

body.app-shell.light-theme-lock.page-admin_replay .admin-replay-speed,
body.app-shell.light-theme-lock.page-admin_replay .replay-input,
body.app-shell.light-theme-lock.page-admin_replay .replay-date-cell,
body.app-shell.light-theme-lock.page-admin_replay .replay-time-cell {
    background: #ffffff !important;
    border-color: #bfdbfe !important;
    color: #0f172a !important;
}

body.app-shell.light-theme-lock.page-admin_replay .admin-replay-route-list [style*="color:#f8fafc"],
body.app-shell.light-theme-lock.page-admin_replay .admin-replay-route-list [style*="color:#94a3b8"] {
    color: #334155 !important;
}

body.app-shell.light-theme-lock.page-admin_replay #route-list > div {
    color: #475569 !important;
}

body.app-shell.light-theme-lock.page-admin_replay .admin-replay-route-list .timeline-item,
body.app-shell.light-theme-lock.page-admin_replay .timeline-item,
body.app-shell.light-theme-lock.page-admin_replay .timeline-event {
    color: #0f172a !important;
}

body.app-shell.light-theme-lock.page-admin_replay .timeline-event {
    background: #f8fafc !important;
}

body.app-shell.light-theme-lock.page-admin_replay .timeline-path-location,
body.app-shell.light-theme-lock.page-admin_replay .timeline-event-desc,
body.app-shell.light-theme-lock.page-admin_replay .timeline-event-time,
body.app-shell.light-theme-lock.page-admin_replay .event-type-label {
    color: #334155 !important;
}

body.app-shell.light-theme-lock.page-admin_replay #panel-speed,
body.app-shell.light-theme-lock.page-admin_replay #panel-location-text,
body.app-shell.light-theme-lock.page-admin_replay #panel-license,
body.app-shell.light-theme-lock.page-admin_replay #panel-latlng,
body.app-shell.light-theme-lock.page-admin_replay #panel-time,
body.app-shell.light-theme-lock.page-admin_replay #panel-sat,
body.app-shell.light-theme-lock.page-admin_replay #panel-gsm,
body.app-shell.light-theme-lock.page-admin_replay #panel-extv,
body.app-shell.light-theme-lock.page-admin_replay #panel-batv,
body.app-shell.light-theme-lock.page-admin_replay #panel-fuel,
body.app-shell.light-theme-lock.page-admin_replay #panel-temp,
body.app-shell.light-theme-lock.page-admin_replay #total-distance {
    color: #0f172a !important;
    opacity: 1 !important;
}

/* POI map page (admin) explicit dark inline fix. */
body.app-shell.light-theme-lock.page-poi .poi-map-page,
body.app-shell.light-theme-lock.page-admin_poi_map .poi-map-page,
body.app-shell.light-theme-lock.page-admin_poi .poi-map-page {
    color: #0f172a !important;
    background: transparent !important;
}

body.app-shell.light-theme-lock.page-poi .poi-map-head,
body.app-shell.light-theme-lock.page-admin_poi_map .poi-map-head,
body.app-shell.light-theme-lock.page-admin_poi .poi-map-head {
    color: #0f172a !important;
}

body.app-shell.light-theme-lock.page-poi .poi-map-head h1,
body.app-shell.light-theme-lock.page-admin_poi_map .poi-map-head h1,
body.app-shell.light-theme-lock.page-admin_poi .poi-map-head h1 {
    color: #0f172a !important;
}

body.app-shell.light-theme-lock.page-poi .poi-map-head h1 i,
body.app-shell.light-theme-lock.page-admin_poi_map .poi-map-head h1 i,
body.app-shell.light-theme-lock.page-admin_poi .poi-map-head h1 i {
    color: #0284c7 !important;
}

body.app-shell.light-theme-lock.page-poi .poi-map-status,
body.app-shell.light-theme-lock.page-admin_poi_map .poi-map-status,
body.app-shell.light-theme-lock.page-admin_poi .poi-map-status {
    background: #f1f5f9 !important;
    border: 1px solid #dbeafe !important;
    color: #334155 !important;
}

body.app-shell.light-theme-lock.page-poi .poi-map-legend,
body.app-shell.light-theme-lock.page-admin_poi_map .poi-map-legend,
body.app-shell.light-theme-lock.page-admin_poi .poi-map-legend {
    color: #334155 !important;
}

body.app-shell.light-theme-lock.page-poi .poi-coverage-map,
body.app-shell.light-theme-lock.page-admin_poi_map .poi-coverage-map,
body.app-shell.light-theme-lock.page-admin_poi .poi-coverage-map {
    background: #ffffff !important;
    border: 1px solid #dbeafe !important;
    box-shadow: none !important;
}

body.app-shell.light-theme-lock.page-poi .poi-map-popup,
body.app-shell.light-theme-lock.page-admin_poi_map .poi-map-popup,
body.app-shell.light-theme-lock.page-admin_poi .poi-map-popup {
    color: #0f172a !important;
}

body.app-shell.light-theme-lock.page-poi .leaflet-control,
body.app-shell.light-theme-lock.page-admin_poi_map .leaflet-control,
body.app-shell.light-theme-lock.page-admin_poi .leaflet-control {
    color: #0f172a !important;
}

/* Report pages: enforce light shells and readable table text. */
body.app-shell.light-theme-lock [class*='page-report'] .report-page,
body.app-shell.light-theme-lock [class*='page-report'] .report-form,
body.app-shell.light-theme-lock [class*='page-report'] .user-report-shell {
    background: #ffffff !important;
    border-color: #dbeafe !important;
    color: #0f172a !important;
}

body.app-shell.light-theme-lock [class*='page-report'] .report-card,
body.app-shell.light-theme-lock [class*='page-report'] .report-table-wrapper,
body.app-shell.light-theme-lock [class*='page-report'] .dataTables_wrapper,
body.app-shell.light-theme-lock [class*='page-report'] .report-filter-card,
body.app-shell.light-theme-lock [class*='page-report'] .trip-table-scroll {
    background: #ffffff !important;
    border-color: #dbeafe !important;
    box-shadow: none !important;
}

body.app-shell.light-theme-lock.report-surface :is(
    .trip-table-scroll,
    .distance-table-scroll,
    .legacy-report-scroll
) {
    background: #ffffff !important;
    border-color: #dbeafe !important;
    box-shadow: none !important;
}

body.app-shell.light-theme-lock [class*='page-report'] .report-table,
body.app-shell.light-theme-lock [class*='page-report'] .trip-table,
body.app-shell.light-theme-lock [class*='page-report'] .dataTable {
    color: #0f172a !important;
}

body.app-shell.light-theme-lock [class*='page-report'] .report-table thead th,
body.app-shell.light-theme-lock [class*='page-report'] .trip-table thead th,
body.app-shell.light-theme-lock [class*='page-report'] .dataTables_wrapper table th,
body.app-shell.light-theme-lock [class*='page-report'] table th,
body.app-shell.light-theme-lock [class*='page-report'] th {
    color: #0f172a !important;
    background: #eff6ff !important;
    border-bottom: 1px solid #dbeafe !important;
}

body.app-shell.light-theme-lock [class*='page-report'] .report-table td,
body.app-shell.light-theme-lock [class*='page-report'] .trip-table td,
body.app-shell.light-theme-lock [class*='page-report'] .dataTable td,
body.app-shell.light-theme-lock [class*='page-report'] table td {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: #e2e8f0 !important;
}

body.app-shell.light-theme-lock [class*='page-report'] .status-map-dialog,
body.app-shell.light-theme-lock [class*='page-report'] .status-map-footer,
body.app-shell.light-theme-lock [class*='page-report'] .longstop-map-dialog,
body.app-shell.light-theme-lock [class*='page-report'] .longstop-map-footer {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: #dbeafe !important;
}

body.app-shell.light-theme-lock [class*='page-report'] .status-map-canvas,
body.app-shell.light-theme-lock [class*='page-report'] #status-map-canvas,
body.app-shell.light-theme-lock [class*='page-report'] .longstop-map-canvas {
    background: #e2e8f0 !important;
}

body.app-shell.light-theme-lock [class*='page-report'] .status-location-btn,
body.app-shell.light-theme-lock [class*='page-report'] .longstop-location-btn,
body.app-shell.light-theme-lock [class*='page-report'] #status-location-btn {
    background: transparent !important;
    color: #0284c7 !important;
}

/* 2026 light shell: a quiet navigation rail that belongs to the content theme. */
body.app-shell.light-theme-lock .sidebar {
    background: #f8fbff !important;
    color: #0f172a !important;
    border-right: 1px solid #dbeafe !important;
    box-shadow: none !important;
}

body.app-shell.light-theme-lock .sidebar-menu {
    padding: 10px 9px 18px !important;
    scrollbar-color: #bfdbfe transparent;
}

body.app-shell.light-theme-lock .sidebar-menu::-webkit-scrollbar-thumb {
    background: #bfdbfe !important;
}

body.app-shell.light-theme-lock .sidebar-menu a,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action {
    min-height: 40px;
    margin: 2px 0 !important;
    padding: 9px 13px;
    color: #334155 !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 9px !important;
    box-shadow: none !important;
    transform: none !important;
    font-size: 0.86rem;
    font-weight: 550;
}

body.app-shell.light-theme-lock .sidebar-menu a i,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action i {
    color: #0284c7 !important;
    opacity: 0.9;
    transform: none !important;
}

body.app-shell.light-theme-lock .sidebar-menu a:hover,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action:hover {
    color: #075985 !important;
    background: #eff6ff !important;
    border-color: #dbeafe !important;
    box-shadow: none !important;
    transform: none !important;
}

body.app-shell.light-theme-lock .sidebar-menu a.active {
    color: #075985 !important;
    background: #e0f2fe !important;
    border-color: #bae6fd !important;
    box-shadow: inset 3px 0 0 #0284c7 !important;
    font-weight: 700;
}

body.app-shell.light-theme-lock .sidebar-menu a.active i {
    color: #0284c7 !important;
    opacity: 1;
    transform: none !important;
}

body.app-shell.light-theme-lock .sidebar-menu a.is-navigating {
    color: #075985 !important;
    background: #dbeafe !important;
}

body.app-shell.light-theme-lock .menu-category {
    padding: 15px 13px 5px;
    color: #64748b !important;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.09em;
}

body.app-shell.light-theme-lock .sidebar.collapsed {
    width: 64px;
}

body.app-shell.light-theme-lock .sidebar.collapsed .sidebar-menu a,
body.app-shell.light-theme-lock .sidebar.collapsed .sidebar-menu button.sidebar-action {
    width: 44px;
    min-height: 42px;
    margin: 3px auto !important;
    padding: 9px 0;
    justify-content: center;
}

/* Dashboard surfaces use Royal Amethyst Light theme with rich tinted icons and subtle shadows. */
body.app-shell.light-theme-lock.page-home .admin-dashboard-container {
    background: linear-gradient(180deg, #faf5ff 0%, #f3e8ff 50%, #f8fafc 100%) !important;
}

body.app-shell.light-theme-lock.page-home .command-health-grid,
body.app-shell.light-theme-lock.page-home .primary-kpi-rail,
body.app-shell.light-theme-lock.page-home .operations-ribbon,
body.app-shell.light-theme-lock.page-home .analytics-workspace .dashboard-analytics-grid,
body.app-shell.light-theme-lock.page-home .operations-rail {
    background: #ffffff !important;
    border-color: #ddd6fe !important;
    box-shadow: 0 8px 24px rgba(109, 40, 217, 0.06) !important;
}

body.app-shell.light-theme-lock.page-home .section-header {
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%) !important;
    border-color: #ddd6fe !important;
}

@media (max-width: 767px) {
    body.app-shell.light-theme-lock .sidebar,
    body.app-shell.light-theme-lock .sidebar.mobile-open {
        width: min(286px, 86vw) !important;
        background: #f8fbff !important;
        box-shadow: 18px 0 44px rgba(15, 23, 42, 0.16) !important;
    }

    body.app-shell.light-theme-lock .sidebar .sidebar-menu a,
    body.app-shell.light-theme-lock .sidebar .sidebar-menu button.sidebar-action {
        width: 100%;
        min-height: 44px;
        margin: 2px 0 !important;
        padding: 10px 14px;
        justify-content: flex-start;
    }
}

/* Topbar icon/readability polish for light-lock shell. */
body.app-shell.light-theme-lock .main-header .topbar-notification,
body.app-shell.light-theme-lock .main-header .logout-btn,
body.app-shell.light-theme-lock .main-header .hamburger-btn,
body.app-shell.light-theme-lock .main-header .status-summary-btn {
    box-shadow: none !important;
    transform: none !important;
}

body.app-shell.light-theme-lock .topbar-notification .fa-bell,
body.app-shell.light-theme-lock .main-header .fa-solid,
body.app-shell.light-theme-lock .main-header .fa-regular,
body.app-shell.light-theme-lock .main-header .logout-btn i,
body.app-shell.light-theme-lock .main-header .hamburger-btn i {
    color: currentColor !important;
    opacity: 1 !important;
}

body.app-shell.light-theme-lock .topbar-notification-wrap {
    position: relative !important;
}


/* ── K2STrack Light Sidebar & SweetAlert2 Light Theme Contract ───────── */
body.app-shell.light-theme-lock .sidebar {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    color: #0f172a !important;
    border-right: 1px solid #dbeafe !important;
    box-shadow: 4px 0 20px rgba(2, 132, 199, 0.05) !important;
}

body.app-shell.light-theme-lock .sidebar .menu-category {
    color: #0284c7 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action {
    color: #334155 !important;
    font-weight: 500 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a i,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action i {
    color: #0284c7 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a:hover,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action:hover {
    background: #e0f2fe !important;
    color: #0369a1 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a.active {
    background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(2, 132, 199, 0.25) !important;
    font-weight: 600 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a.active i {
    color: #ffffff !important;
}

/* SweetAlert2 Light Theme Overrides */
body.app-shell.light-theme-lock .swal2-popup {
    background: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid #dbeafe !important;
    border-radius: 18px !important;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.14) !important;
}

body.app-shell.light-theme-lock .swal2-title,
body.app-shell.light-theme-lock .swal2-html-container {
    color: #0f172a !important;
}

body.app-shell.light-theme-lock .swal-input-dark,
body.app-shell.light-theme-lock .swal2-input,
body.app-shell.light-theme-lock .swal2-select,
body.app-shell.light-theme-lock .swal2-textarea {
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    border-radius: 10px !important;
}

body.app-shell.light-theme-lock .swal2-popup label {
    color: #334155 !important;
}


/* ==========================================================================
   K2S SIGNATURE — Royal Purple & Light Theme Override (Global App Shell)
   ========================================================================== */
body.app-shell.light-theme-lock {
    color-scheme: light;
    --primary-color: #6d28d9 !important;
    --primary-gradient: linear-gradient(135deg, #5b21b6 0%, #7c3aed 100%) !important;
    --accent-color: #8b5cf6 !important;
    --bg-primary: #faf5ff !important;
    --bg-secondary: #ffffff !important;
    --bg-surface: #f5f3ff !important;
    --text-primary: #1e1b4b !important;
    --text-secondary: #475569 !important;
    --border-color: #ddd6fe !important;
    --system-button-blue: #6d28d9 !important;
    --system-button-blue-hover: #5b21b6 !important;
    --system-button-blue-active: #4c1d95 !important;
    --system-button-blue-border: #a78bfa !important;
    background: #faf5ff !important;
    color: #1e1b4b !important;
}

/* Top Header Bar in Royal Purple Gradient */
body.app-shell.light-theme-lock .main-header {
    background: linear-gradient(135deg, #4c1d95 0%, #6d28d9 55%, #7c3aed 100%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16) !important;
    box-shadow: 0 4px 20px rgba(91, 33, 182, 0.22) !important;
    color: #ffffff !important;
}

/* Light Sidebar with Purple Accents */
body.app-shell.light-theme-lock .sidebar {
    background: linear-gradient(180deg, #ffffff 0%, #faf5ff 100%) !important;
    color: #1e1b4b !important;
    border-right: 1px solid #ddd6fe !important;
    box-shadow: 4px 0 20px rgba(109, 40, 217, 0.06) !important;
}

body.app-shell.light-theme-lock .sidebar .menu-category {
    color: #6d28d9 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action {
    color: #334155 !important;
    font-weight: 500 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a i,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action i {
    color: #7c3aed !important;
}

body.app-shell.light-theme-lock .sidebar-menu a:hover,
body.app-shell.light-theme-lock .sidebar-menu button.sidebar-action:hover {
    background: #f3e8ff !important;
    color: #5b21b6 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a.active {
    background: linear-gradient(135deg, #5b21b6 0%, #7c3aed 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(109, 40, 217, 0.28) !important;
    font-weight: 600 !important;
}

body.app-shell.light-theme-lock .sidebar-menu a.active i {
    color: #ffffff !important;
}

/* Main Content & Cards in Soft Lavender Mist + Crisp White */
body.app-shell.light-theme-lock .main-content-wrapper,
body.app-shell.light-theme-lock .page-content,
body.app-shell.light-theme-lock .main-page,
body.app-shell.light-theme-lock .report-shell,
body.app-shell.light-theme-lock .app-footer {
    background: #faf5ff !important;
    color: #1e1b4b !important;
}

/* Table Headers in Soft Amethyst Tint */
body.app-shell.light-theme-lock .page-content :is(
    table thead th,
    .custom-table th,
    .dark-th,
    .report-table thead th,
    .sysmon-table th
) {
    background: linear-gradient(135deg, #f3e8ff 0%, #ede9fe 100%) !important;
    color: #4c1d95 !important;
    border-bottom: 1px solid #c4b5fd !important;
}

body.app-shell.light-theme-lock .page-content table tbody tr:hover td {
    background-color: #faf5ff !important;
}

/* Inputs & Selects with Purple Focus Ring */
body.app-shell.light-theme-lock .page-content :is(input, select, textarea, .custom-input, .custom-select, .form-control, .form-select) {
    background: #ffffff !important;
    border-color: #ddd6fe !important;
    color: #1e1b4b !important;
    -webkit-text-fill-color: #1e1b4b !important;
}

body.app-shell.light-theme-lock .page-content :is(input, select, textarea, .custom-input, .custom-select, .form-control, .form-select):focus {
    border-color: #7c3aed !important;
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.16) !important;
}

/* Action Buttons in Royal Purple */
body.app-shell.light-theme-lock .page-content :is(button, input[type="button"], input[type="submit"], a.btn, .report-btn, .action-btn, .btn-action):not(:where(.btn-link, .btn-close, .logout-btn, [class*="danger"], [class*="delete"], [class*="mdvr-"], [class*="dvr-"])) {
    background: #6d28d9 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border-color: #a78bfa !important;
}

body.app-shell.light-theme-lock .page-content :is(button, input[type="button"], input[type="submit"], a.btn, .report-btn, .action-btn, .btn-action):not(:where(.btn-link, .btn-close, .logout-btn, [class*="danger"], [class*="delete"], [class*="mdvr-"], [class*="dvr-"])):hover {
    background: #5b21b6 !important;
    border-color: #c4b5fd !important;
}


/* ==========================================================================
   Sub-Screen & Utility Page Purple-Light Overrides
   (vt200_pulse_test, realtime_history_import, poi_map, system_notifications)
   ========================================================================== */
body.app-shell.light-theme-lock .vt200-test-page,
body.app-shell.light-theme-lock .history-import-page,
body.app-shell.light-theme-lock .poi-map-page,
body.app-shell.light-theme-lock .sys-notify-page {
    background: #faf5ff !important;
    color: #1e1b4b !important;
}

body.app-shell.light-theme-lock .vt200-test-header h2,
body.app-shell.light-theme-lock .history-import-header h1,
body.app-shell.light-theme-lock .poi-map-head h1,
body.app-shell.light-theme-lock .vt200-panel-title,
body.app-shell.light-theme-lock .history-import-card-title h2,
body.app-shell.light-theme-lock .history-import-card-title h3,
body.app-shell.light-theme-lock .history-import-window strong {
    color: #1e1b4b !important;
}

body.app-shell.light-theme-lock .vt200-test-header p,
body.app-shell.light-theme-lock .history-import-header p,
body.app-shell.light-theme-lock .poi-map-head p,
body.app-shell.light-theme-lock .poi-map-legend,
body.app-shell.light-theme-lock .history-import-window span,
body.app-shell.light-theme-lock .vt200-command-help span,
body.app-shell.light-theme-lock .vt200-preview small {
    color: #475569 !important;
}

body.app-shell.light-theme-lock .vt200-panel,
body.app-shell.light-theme-lock .history-import-card,
body.app-shell.light-theme-lock .history-import-window,
body.app-shell.light-theme-lock .poi-map-status {
    background: #ffffff !important;
    border: 1px solid #ddd6fe !important;
    color: #1e1b4b !important;
    box-shadow: 0 8px 24px rgba(109, 40, 217, 0.06) !important;
}

body.app-shell.light-theme-lock .vt200-mode-fixed,
body.app-shell.light-theme-lock .vt200-command-help div,
body.app-shell.light-theme-lock .vt200-preview {
    background: #f5f3ff !important;
    border: 1px solid #ddd6fe !important;
    color: #1e1b4b !important;
}

body.app-shell.light-theme-lock .vt200-table th {
    background: #f3e8ff !important;
    color: #4c1d95 !important;
    border-bottom: 1px solid #c4b5fd !important;
}

body.app-shell.light-theme-lock .vt200-table td {
    color: #1e1b4b !important;
    border-bottom: 1px solid #ede9fe !important;
}

body.app-shell.light-theme-lock .poi-coverage-map {
    background: #f8fafc !important;
    border: 1px solid #ddd6fe !important;
    box-shadow: 0 8px 24px rgba(109, 40, 217, 0.06) !important;
}

/* ==========================================================================
   High-Contrast Readability & Empty-State Pill Contract
   Eliminates all washed-out gray-on-gray boxes, placeholders, and muted text
   ========================================================================== */
body.app-shell.light-theme-lock .report-state-cell,
body.app-shell.light-theme-lock td.dataTables_empty {
    background: #ffffff !important;
    color: #3b0764 !important;
    font-weight: 700 !important;
    padding: 44px 20px !important;
}

body.app-shell.light-theme-lock .report-state-box,
body.app-shell.light-theme-lock .db-state-box {
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%) !important;
    border: 1.5px solid #c4b5fd !important;
    color: #3b0764 !important;
    -webkit-text-fill-color: #3b0764 !important;
    font-weight: 700 !important;
    font-size: 0.94rem !important;
    border-radius: 999px !important;
    padding: 12px 24px !important;
    box-shadow: 0 4px 14px rgba(109, 40, 217, 0.08) !important;
}

body.app-shell.light-theme-lock .report-state-box span,
body.app-shell.light-theme-lock .db-state-box span {
    color: #3b0764 !important;
    -webkit-text-fill-color: #3b0764 !important;
    font-weight: 700 !important;
}

body.app-shell.light-theme-lock .report-state-box i,
body.app-shell.light-theme-lock .report-state-box.is-empty i,
body.app-shell.light-theme-lock .report-state-box.is-loading i,
body.app-shell.light-theme-lock .db-state-box i {
    color: #6d28d9 !important;
    -webkit-text-fill-color: #6d28d9 !important;
}

body.app-shell.light-theme-lock .report-state-box.is-error,
body.app-shell.light-theme-lock .db-state-box.is-error {
    background: #fef2f2 !important;
    border-color: #fca5a5 !important;
    color: #b91c1c !important;
    -webkit-text-fill-color: #b91c1c !important;
}

body.app-shell.light-theme-lock .report-state-box.is-error span,
body.app-shell.light-theme-lock .report-state-box.is-error i {
    color: #b91c1c !important;
    -webkit-text-fill-color: #b91c1c !important;
}

/* Date Preset Label ("ช่วงวันที่") & Form Labels */
body.app-shell.light-theme-lock .report-date-presets-label,
body.app-shell.light-theme-lock .page-content label {
    color: #2e1065 !important;
    font-weight: 700 !important;
}

/* Select2 & Input Placeholders High Contrast */
body.app-shell.light-theme-lock .page-content .select2-container--default .select2-selection--single .select2-selection__rendered,
body.app-shell.light-theme-lock .page-content .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #334155 !important;
    -webkit-text-fill-color: #334155 !important;
    font-weight: 600 !important;
}

body.app-shell.light-theme-lock .page-content input::placeholder,
body.app-shell.light-theme-lock .page-content textarea::placeholder {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
    opacity: 1 !important;
}

/* Force all low-contrast gray text utilities and inline styles in page-content to crisp dark slate/indigo */
body.app-shell.light-theme-lock .page-content :is(
    .text-slate-300,
    .text-slate-400,
    .text-slate-500,
    .text-gray-300,
    .text-gray-400,
    .text-gray-500,
    .text-muted,
    [style*="color:#94a3b8"],
    [style*="color: #94a3b8"],
    [style*="color:#64748b"],
    [style*="color: #64748b"],
    [style*="color:#cbd5e1"],
    [style*="color: #cbd5e1"],
    [style*="color:#f1f5f9"],
    [style*="color: #f1f5f9"],
    [style*="color:#e2e8f0"],
    [style*="color: #e2e8f0"]
):not(:where(button, a.btn, .report-btn, .badge, .status-badge)) {
    color: #334155 !important;
}

/* Report Summary Footer High Contrast */
body.app-shell.light-theme-lock .report-summary-footer td {
    background: #f3e8ff !important;
    border-top: 2px solid #a78bfa !important;
    color: #1e1b4b !important;
    font-weight: 800 !important;
}

body.app-shell.light-theme-lock .report-summary-footer .report-summary-label {
    color: #4c1d95 !important;
}

body.app-shell.light-theme-lock .report-summary-footer .report-summary-value {
    color: #6d28d9 !important;
}

/* Disabled buttons: readable lavender instead of muddy gray */
body.app-shell.light-theme-lock .page-content :is(
    button:disabled,
    button[disabled],
    input:disabled,
    input[disabled],
    .btn.disabled,
    .page-btn.disabled,
    .btn-pg.disabled
) {
    background: #ede9fe !important;
    color: #4c1d95 !important;
    -webkit-text-fill-color: #4c1d95 !important;
    border-color: #c4b5fd !important;
    opacity: 0.9 !important;
}

/* System Settings Longdo Usage Cards & Command History Table */
body.app-shell.light-theme-lock .system-page .card-header,
body.app-shell.light-theme-lock .longdo-usage-panel,
body.app-shell.light-theme-lock .longdo-usage-card {
    background: #f5f3ff !important;
    border-color: #ddd6fe !important;
    color: #1e1b4b !important;
}

body.app-shell.light-theme-lock .longdo-usage-head h4,
body.app-shell.light-theme-lock .longdo-usage-title,
body.app-shell.light-theme-lock .longdo-usage-number {
    color: #2e1065 !important;
}

body.app-shell.light-theme-lock .longdo-usage-head p,
body.app-shell.light-theme-lock .longdo-usage-foot {
    color: #475569 !important;
}

/* Topbar Status Summary Pills (Offline & N/A visibility) */
body.app-shell.light-theme-lock .app-header .status-summary-btn,
body.app-shell.light-theme-lock .app-header .status-summary-btn span,
body.app-shell.light-theme-lock .app-header .status-summary-btn strong {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* ==========================================================================
   Mobile DVR (Live Wall, Monitor Only, Replay - CCTV & Live Popup)
   Royal Amethyst Purple & Light Theme UI + Sleek Black Video Monitor Screens
   Full-Bleed Edge-to-Edge Layout (Zero Left/Right/Top/Bottom Padding)
   ========================================================================== */
body.app-shell.page-mobile_dvr .page-content,
body.app-shell.page-mobile_dvr_replay .page-content,
body.app-shell.page-mobile-dvr .page-content,
body.app-shell.page-mobile-dvr-replay .page-content {
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}

body.app-shell.page-mobile_dvr .app-footer,
body.app-shell.page-mobile_dvr_replay .app-footer,
body.app-shell.page-mobile-dvr .app-footer,
body.app-shell.page-mobile-dvr-replay .app-footer {
    display: none !important;
}

body.app-shell.light-theme-lock .mdvr-shell {
    flex: 1 1 auto !important;
    width: 100% !important;
    height: calc(100dvh - var(--header-height, 65px)) !important;
    min-height: calc(100dvh - var(--header-height, 65px)) !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #faf5ff !important;
    color: #1e1b4b !important;
}

body.app-shell.light-theme-lock .mdvr-left-panel,
body.app-shell.light-theme-lock .mdvr-replay-left,
body.app-shell.light-theme-lock .mdvr-table-wrap,
body.app-shell.light-theme-lock .mdvr-replay-table-wrap,
body.app-shell.light-theme-lock .mdvr-minimap-section {
    background: #ffffff !important;
    border-color: #ddd6fe !important;
}

body.app-shell.light-theme-lock .mdvr-panel-header,
body.app-shell.light-theme-lock .mdvr-minimap-header {
    background: linear-gradient(135deg, #f3e8ff 0%, #ede9fe 100%) !important;
    border-bottom: 1px solid #c4b5fd !important;
    color: #3b0764 !important;
}

body.app-shell.light-theme-lock .mdvr-panel-title,
body.app-shell.light-theme-lock .mdvr-wall-title {
    color: #2e1065 !important;
    font-weight: 800 !important;
}

body.app-shell.light-theme-lock .mdvr-panel-title i,
body.app-shell.light-theme-lock .mdvr-wall-title i {
    color: #6d28d9 !important;
}

body.app-shell.light-theme-lock .mdvr-badge-count {
    background: #ffffff !important;
    color: #5b21b6 !important;
    border: 1px solid #c4b5fd !important;
}

body.app-shell.light-theme-lock .mdvr-filter-bar,
body.app-shell.light-theme-lock .mdvr-replay-form,
body.app-shell.light-theme-lock .mdvr-replay-pagination {
    background: #faf5ff !important;
    border-color: #ddd6fe !important;
    color: #334155 !important;
}

body.app-shell.light-theme-lock .mdvr-right-panel {
    background: #050811 !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.app-shell.light-theme-lock .mdvr-replay-right {
    background: #050811 !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
}

body.app-shell.light-theme-lock .mdvr-wall-grid {
    padding: 0 !important;
    margin: 0 !important;
    gap: 2px !important;
    background: #000000 !important;
}

body.app-shell.light-theme-lock .mdvr-wall-toolbar,
body.app-shell.light-theme-lock .mdvr-replay-topbar {
    background: #ffffff !important;
    border: 0 !important;
    border-bottom: 1px solid #ddd6fe !important;
    border-radius: 0 !important;
    margin: 0 !important;
    box-shadow: 0 2px 8px rgba(109, 40, 217, 0.05) !important;
}

body.app-shell.light-theme-lock .mdvr-tile,
body.app-shell.light-theme-lock .mdvr-replay-player-stage {
    background: #050811 !important;
    border: 1px solid #1e293b !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.app-shell.light-theme-lock .mdvr-replay-player-stage {
    border: 0 !important;
}

body.app-shell.light-theme-lock .mdvr-tile.is-selected {
    border: 2px solid #22c55e !important;
    box-shadow: inset 0 0 0 1px rgba(34, 197, 94, 0.35) !important;
}

body.app-shell.light-theme-lock .mdvr-tile-stage,
body.app-shell.light-theme-lock .mdvr-tile-placeholder {
    background: radial-gradient(circle at 50% 35%, #111827 0%, #070b14 62%, #000000 100%) !important;
}

body.app-shell.light-theme-lock .mdvr-tile-placeholder-badge {
    background: rgba(139, 92, 246, 0.18) !important;
    border: 1px solid rgba(167, 139, 250, 0.45) !important;
    color: #c4b5fd !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45) !important;
}

body.app-shell.light-theme-lock .mdvr-tile-placeholder-title {
    color: #f8fafc !important;
    -webkit-text-fill-color: #f8fafc !important;
}

body.app-shell.light-theme-lock .mdvr-tile-placeholder-sub {
    color: #94a3b8 !important;
    -webkit-text-fill-color: #94a3b8 !important;
}

body.app-shell.light-theme-lock .mdvr-tile-channel-tag {
    background: rgba(5, 8, 17, 0.84) !important;
    border: 1px solid rgba(148, 163, 184, 0.28) !important;
    color: #f8fafc !important;
    -webkit-text-fill-color: #f8fafc !important;
}

body.app-shell.light-theme-lock .mdvr-tile-bar {
    background: #050811 !important;
    border-top: 1px solid #1e293b !important;
}

body.app-shell.light-theme-lock .mdvr-tile-bar-status {
    color: #cbd5e1 !important;
    -webkit-text-fill-color: #cbd5e1 !important;
    font-weight: 600 !important;
}

body.app-shell.light-theme-lock .page-content .mdvr-tile button.mdvr-ctrl-btn {
    background: transparent !important;
    border: 0 !important;
    color: #cbd5e1 !important;
    -webkit-text-fill-color: #cbd5e1 !important;
}

body.app-shell.light-theme-lock .page-content .mdvr-tile button.mdvr-ctrl-btn:hover {
    background: rgba(255, 255, 255, 0.14) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body.app-shell.light-theme-lock .page-content .mdvr-tile button.mdvr-ctrl-btn.is-active {
    background: rgba(34, 197, 94, 0.2) !important;
    color: #4ade80 !important;
    -webkit-text-fill-color: #4ade80 !important;
}

body.app-shell.light-theme-lock .page-content .mdvr-tile button.mdvr-ctrl-btn.is-danger-active {
    background: rgba(239, 68, 68, 0.24) !important;
    color: #f87171 !important;
    -webkit-text-fill-color: #f87171 !important;
}

/* Live DVR Popup Dialog Light-Purple Overrides */
body.app-shell.light-theme-lock .dvr-live-panel {
    background: #ffffff !important;
    border: 1px solid #c4b5fd !important;
    color: #1e1b4b !important;
    box-shadow: 0 24px 64px rgba(59, 7, 100, 0.22) !important;
}

body.app-shell.light-theme-lock .dvr-live-header,
body.app-shell.light-theme-lock .dvr-live-footer {
    background: linear-gradient(135deg, #f3e8ff 0%, #ede9fe 100%) !important;
    border-color: #c4b5fd !important;
    color: #2e1065 !important;
}

body.app-shell.light-theme-lock .dvr-live-header h2 {
    color: #2e1065 !important;
}

body.app-shell.light-theme-lock .dvr-live-layouts,
body.app-shell.light-theme-lock .dvr-live-toolbar,
body.app-shell.light-theme-lock .dvr-mode-tabs,
body.app-shell.light-theme-lock .dvr-history-form,
body.app-shell.light-theme-lock .dvr-history-results {
    background: #faf5ff !important;
    border-color: #ddd6fe !important;
    color: #1e1b4b !important;
}

body.app-shell.light-theme-lock .dvr-history-form label,
body.app-shell.light-theme-lock .dvr-live-meta,
body.app-shell.light-theme-lock .dvr-history-empty {
    color: #3b0764 !important;
}

body.app-shell.light-theme-lock .dvr-history-form input,
body.app-shell.light-theme-lock .dvr-history-form select {
    background: #ffffff !important;
    border-color: #c4b5fd !important;
    color: #1e1b4b !important;
}

body.app-shell.light-theme-lock .dvr-layout-button,
body.app-shell.light-theme-lock .dvr-mode-tab,
body.app-shell.light-theme-lock .dvr-live-icon-button,
body.app-shell.light-theme-lock .dvr-live-command,
body.app-shell.light-theme-lock .dvr-live-choice {
    background: #ffffff !important;
    border: 1px solid #c4b5fd !important;
    color: #4c1d95 !important;
}

body.app-shell.light-theme-lock .dvr-layout-button.active,
body.app-shell.light-theme-lock .dvr-layout-button[aria-pressed="true"],
body.app-shell.light-theme-lock .dvr-mode-tab.active,
body.app-shell.light-theme-lock .dvr-mode-tab[aria-selected="true"],
body.app-shell.light-theme-lock .dvr-live-choice.active,
body.app-shell.light-theme-lock .dvr-live-choice[aria-pressed="true"],
body.app-shell.light-theme-lock .dvr-live-command-primary {
    background: #6d28d9 !important;
    border-color: #7c3aed !important;
    color: #ffffff !important;
}

/* ==========================================================================
   Global Select2 Dropdowns, DataTables Pagination & Stat Value Safeguards
   ========================================================================== */
body.app-shell.light-theme-lock .select2-dropdown {
    background-color: #ffffff !important;
    border: 1px solid #ddd6fe !important;
    color: #1e1b4b !important;
    box-shadow: 0 12px 32px rgba(109, 40, 217, 0.14) !important;
}

body.app-shell.light-theme-lock .select2-search--dropdown .select2-search__field {
    background-color: #faf5ff !important;
    border: 1px solid #c4b5fd !important;
    color: #1e1b4b !important;
    -webkit-text-fill-color: #1e1b4b !important;
    border-radius: 8px !important;
}

body.app-shell.light-theme-lock .select2-results__option {
    color: #1e1b4b !important;
    font-weight: 500 !important;
}

body.app-shell.light-theme-lock .select2-container--default .select2-results__option--highlighted[aria-selected],
body.app-shell.light-theme-lock .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #6d28d9 !important;
    color: #ffffff !important;
}

body.app-shell.light-theme-lock .dataTables_wrapper .dataTables_paginate .paginate_button {
    background: #ffffff !important;
    border: 1px solid #ddd6fe !important;
    color: #4c1d95 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

body.app-shell.light-theme-lock .dataTables_wrapper .dataTables_paginate .paginate_button.current,
body.app-shell.light-theme-lock .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: #6d28d9 !important;
    border-color: #6d28d9 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body.app-shell.light-theme-lock .stat-card .stat-value {
    color: #1e1b4b !important;
}

/* Prevent accidental white text inside light table cells & cards */
body.app-shell.light-theme-lock .page-content table tbody td :is(
    [style*="color:#fff"],
    [style*="color: #fff"],
    [style*="color:#ffffff"],
    [style*="color: #ffffff"],
    [style*="color:#f8fafc"],
    [style*="color: #f8fafc"]
):not(:where(button, a.btn, .badge, .role-badge, .status-badge, .reason-chip, .user-badge, i)) {
    color: #1e1b4b !important;
}