/* ===== Roboto global final override ===== */
html, body, button, input, select, textarea, option, table, th, td, a, label, summary, details,
.leaflet-container, .leaflet-control, .leaflet-popup-content, .leaflet-popup-content-wrapper, .leaflet-tooltip {
  font-family: 'Roboto', sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* User theme: dark mode overrides */
body.theme-dark,
body.theme-system {
  color-scheme: light;
}
body.theme-dark {
  --bg: #0f172a;
  --panel: #111827;
  --line: #334155;
  --text: #e5e7eb;
  --muted: #94a3b8;
  --blue: #60a5fa;
  --blue2: #3b82f6;
  --shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}
@media (prefers-color-scheme: dark) {
  body.theme-system {
    --bg: #0f172a;
    --panel: #111827;
    --line: #334155;
    --text: #e5e7eb;
    --muted: #94a3b8;
    --blue: #60a5fa;
    --blue2: #3b82f6;
    --shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
    color-scheme: dark;
  }
}
body.theme-dark #topbar,
body.theme-dark #sidebar,
body.theme-dark .panel,
body.theme-dark .module-box,
body.theme-dark .utility-panel,
body.theme-dark .action-card,
body.theme-dark .account-dropdown,
body.theme-dark .leaflet-control,
body.theme-dark .leaflet-control-layers,
body.theme-dark .leaflet-popup-content-wrapper,
body.theme-dark .leaflet-popup-tip {
  background: var(--panel) !important;
  color: var(--text) !important;
  border-color: var(--line) !important;
}
body.theme-dark input,
body.theme-dark select,
body.theme-dark textarea,
body.theme-dark button.icon-btn {
  background: #0b1220 !important;
  color: var(--text) !important;
  border-color: var(--line) !important;
}
body.theme-dark .brand h1,
body.theme-dark .user-name,
body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3,
body.theme-dark h4,
body.theme-dark label,
body.theme-dark .leaflet-control-layers label {
  color: var(--text) !important;
}
body.theme-dark .brand small,
body.theme-dark .user-role,
body.theme-dark .hint,
body.theme-dark .muted,
body.theme-dark small {
  color: var(--muted) !important;
}
body.theme-dark .account-dropdown a {
  color: var(--text) !important;
}
body.theme-dark .account-dropdown a.danger {
  color: #fca5a5 !important;
}
@media (prefers-color-scheme: dark) {
  body.theme-system #topbar,
  body.theme-system #sidebar,
  body.theme-system .panel,
  body.theme-system .module-box,
  body.theme-system .utility-panel,
  body.theme-system .action-card,
  body.theme-system .account-dropdown,
  body.theme-system .leaflet-control,
  body.theme-system .leaflet-control-layers,
  body.theme-system .leaflet-popup-content-wrapper,
  body.theme-system .leaflet-popup-tip {
    background: var(--panel) !important;
    color: var(--text) !important;
    border-color: var(--line) !important;
  }
  body.theme-system input,
  body.theme-system select,
  body.theme-system textarea,
  body.theme-system button.icon-btn {
    background: #0b1220 !important;
    color: var(--text) !important;
    border-color: var(--line) !important;
  }
  body.theme-system .brand h1,
  body.theme-system .user-name,
  body.theme-system h1,
  body.theme-system h2,
  body.theme-system h3,
  body.theme-system h4,
  body.theme-system label,
  body.theme-system .leaflet-control-layers label {
    color: var(--text) !important;
  }
  body.theme-system .brand small,
  body.theme-system .user-role,
  body.theme-system .hint,
  body.theme-system .muted,
  body.theme-system small {
    color: var(--muted) !important;
  }
  body.theme-system .account-dropdown a { color: var(--text) !important; }
  body.theme-system .account-dropdown a.danger { color: #fca5a5 !important; }
}

/* =========================================================
   DARK THEME CONTRAST FIX - bản đồ, sidebar, popup, admin
   ========================================================= */
body.theme-dark {
  color-scheme: dark;
  background: var(--bg) !important;
  color: var(--text) !important;
}
body.theme-dark,
body.theme-dark #app-container,
body.theme-dark #map-wrap {
  background: var(--bg) !important;
}

/* Sidebar/map cards: tránh chữ trắng trên nền trắng */
body.theme-dark .sidebar-inner,
body.theme-dark .panel,
body.theme-dark .module-box,
body.theme-dark .utility-panel {
  background: transparent !important;
  color: var(--text) !important;
}
body.theme-dark .layer-item,
body.theme-dark .result-item,
body.theme-dark .info-card,
body.theme-dark .mini-summary,
body.theme-dark .locked-box,
body.theme-dark .mode-tool-list > div,
body.theme-dark .nearest-item,
body.theme-dark .nearest-panel-item,
body.theme-dark .inventory-panel,
body.theme-dark .nearest-panel,
body.theme-dark .tram-staff-item,
body.theme-dark .tram-unit-list div,
body.theme-dark .nearest-distance,
body.theme-dark .inventory-unit-grid div,
body.theme-dark .inventory-kpi,
body.theme-dark .nearest-panel-summary div {
  background: #111827 !important;
  color: #e5e7eb !important;
  border-color: #334155 !important;
}
body.theme-dark .info-card b,
body.theme-dark .locked-box b,
body.theme-dark .panel h3,
body.theme-dark .sidebar-title,
body.theme-dark .popup-title,
body.theme-dark .tram-section h4,
body.theme-dark .tram-photo-details summary,
body.theme-dark .tram-details summary {
  color: #93c5fd !important;
}
body.theme-dark .hint,
body.theme-dark .locked-box,
body.theme-dark .result-item small,
body.theme-dark .tram-empty,
body.theme-dark .tram-note,
body.theme-dark .tram-staff-text,
body.theme-dark .tram-sub,
body.theme-dark .inventory-kpi span,
body.theme-dark .nearest-panel-summary span,
body.theme-dark .nearest-info small,
body.theme-dark .nearest-distance span {
  color: #cbd5e1 !important;
}

/* Checkbox/risk filter: giữ màu nhận diện nhưng tăng tương phản */
body.theme-dark .checkbox-group label {
  color: #e5e7eb !important;
}
body.theme-dark .checkbox-group label.risk-red {
  background: rgba(127, 29, 29, 0.9) !important;
  color: #fecaca !important;
  padding: 4px 6px;
}
body.theme-dark .checkbox-group label.risk-orange {
  background: rgba(124, 45, 18, 0.9) !important;
  color: #fed7aa !important;
  padding: 4px 6px;
}
body.theme-dark .checkbox-group label.risk-yellow {
  background: rgba(113, 63, 18, 0.9) !important;
  color: #fef08a !important;
  padding: 4px 6px;
}
body.theme-dark .checkbox-group label.risk-green {
  background: rgba(20, 83, 45, 0.9) !important;
  color: #bbf7d0 !important;
  padding: 4px 6px;
}
body.theme-dark .checkbox-group label.risk-unknown {
  background: #1f2937 !important;
  color: #e5e7eb !important;
  padding: 4px 6px;
}

/* Form controls + disabled buttons trong sidebar */
body.theme-dark input,
body.theme-dark select,
body.theme-dark textarea,
body.theme-dark .filter-select,
body.theme-dark .btn-grid button,
body.theme-dark .module-btn,
body.theme-dark .mode-btn,
body.theme-dark .mode-switch-btn,
body.theme-dark .business-mode-btn,
body.theme-dark [data-mode-btn] {
  background: #0b1220 !important;
  color: #e5e7eb !important;
  border-color: #334155 !important;
}
body.theme-dark input::placeholder,
body.theme-dark textarea::placeholder {
  color: #94a3b8 !important;
}
body.theme-dark button:disabled,
body.theme-dark input:disabled,
body.theme-dark select:disabled,
body.theme-dark textarea:disabled,
body.theme-dark .btn-grid button:disabled {
  background: #1f2937 !important;
  color: #94a3b8 !important;
  border-color: #334155 !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}
body.theme-dark .btn-grid button.active,
body.theme-dark .btn-grid button:hover:not(:disabled),
body.theme-dark .module-btn:hover,
body.theme-dark .module-btn.active,
body.theme-dark .module-btn[aria-pressed="true"] {
  background: #1e3a8a !important;
  color: #ffffff !important;
  border-color: #60a5fa !important;
}
body.theme-dark body[data-module-mode="incident"] .module-btn.active,
body.theme-dark body[data-module-mode="recovery"] .module-btn.active {
  color: #ffffff !important;
}

/* Topbar/account menu */
body.theme-dark .top-mode-switcher {
  background: #0b1220 !important;
  border-color: #334155 !important;
}
body.theme-dark .top-mode-btn {
  background: #111827 !important;
  color: #bfdbfe !important;
}
body.theme-dark .top-mode-btn.active,
body.theme-dark .top-mode-btn:hover {
  background: #3b82f6 !important;
  color: #ffffff !important;
}
body.theme-dark .account-dropdown a:hover,
body.theme-dark .account-dropdown a[aria-current="page"] {
  background: #1e293b !important;
  color: #bfdbfe !important;
}
body.theme-dark .account-dropdown a.danger:hover {
  background: #7f1d1d !important;
  color: #fecaca !important;
}

/* Leaflet controls, legend, attribution */
body.theme-dark .legend,
body.theme-dark .leaflet-control,
body.theme-dark .leaflet-control-layers,
body.theme-dark .leaflet-bar a,
body.theme-dark .leaflet-control-attribution {
  background: rgba(17, 24, 39, 0.96) !important;
  color: #e5e7eb !important;
  border-color: #334155 !important;
}
body.theme-dark .legend h4,
body.theme-dark .legend div,
body.theme-dark .leaflet-control-layers label,
body.theme-dark .leaflet-control-attribution a {
  color: #e5e7eb !important;
}
body.theme-dark .map-toolbar button,
body.theme-dark .mobile-menu-btn {
  background: #111827 !important;
  color: #bfdbfe !important;
  border-color: #334155 !important;
}

/* Popup/table content */
body.theme-dark .leaflet-popup-content-wrapper,
body.theme-dark .leaflet-popup-tip,
body.theme-dark .dnc-popup,
body.theme-dark .dnc-section,
body.theme-dark .dnc-popup-header,
body.theme-dark .dnc-table th,
body.theme-dark .dnc-table td,
body.theme-dark .incident-popup,
body.theme-dark .recovery-popup,
body.theme-dark .incident-table th,
body.theme-dark .incident-table td,
body.theme-dark .tram-table th,
body.theme-dark .tram-table td,
body.theme-dark .inventory-table th,
body.theme-dark .inventory-table td {
  background: #111827 !important;
  color: #e5e7eb !important;
  border-color: #334155 !important;
}
body.theme-dark .dnc-section-title,
body.theme-dark .incident-table th,
body.theme-dark .tram-table th,
body.theme-dark .inventory-table th {
  background: #1f2937 !important;
  color: #bfdbfe !important;
}
body.theme-dark .dnc-popup-title,
body.theme-dark .tram-title,
body.theme-dark .risk-popup-card,
body.theme-dark .nearest-head,
body.theme-dark .inventory-table-meta,
body.theme-dark .nearest-info strong,
body.theme-dark .nearest-distance b,
body.theme-dark .tram-staff-name {
  color: #e5e7eb !important;
}
body.theme-dark .dnc-popup-subtitle,
body.theme-dark .dnc-table th,
body.theme-dark .popup-grid b,
body.theme-dark .incident-sub {
  color: #cbd5e1 !important;
}
body.theme-dark .dnc-note,
body.theme-dark .nearest-note {
  background: #0f172a !important;
  color: #dbeafe !important;
  border-color: #334155 !important;
}
body.theme-dark .placeholder,
body.theme-dark .tram-photo {
  background: #0b1220 !important;
  border-color: #334155 !important;
  color: #94a3b8 !important;
}

/* Drawer chips/KPI */
body.theme-dark .tram-chip-list span,
body.theme-dark .inventory-chip-list span,
body.theme-dark .dnc-tag,
body.theme-dark .pill {
  background: #1e3a8a !important;
  color: #dbeafe !important;
}
body.theme-dark .tram-kpi,
body.theme-dark .inventory-kpi,
body.theme-dark .nearest-panel-summary div {
  background: #1f2937 !important;
}
body.theme-dark .tram-kpi b,
body.theme-dark .inventory-kpi b,
body.theme-dark .nearest-panel-summary b {
  color: #fbbf24 !important;
}

/* Trang quản trị có dùng body.theme-dark */
body.theme-dark .topbar,
body.theme-dark .card,
body.theme-dark .group,
body.theme-dark .wrap,
body.theme-dark .container {
  background: var(--panel) !important;
  color: var(--text) !important;
  border-color: var(--line) !important;
}
body.theme-dark .group summary,
body.theme-dark table,
body.theme-dark .table th,
body.theme-dark .table td,
body.theme-dark th,
body.theme-dark td {
  background: transparent !important;
  color: var(--text) !important;
  border-color: var(--line) !important;
}
body.theme-dark .table th,
body.theme-dark th,
body.theme-dark .muted {
  color: var(--muted) !important;
}
body.theme-dark .card h1,
body.theme-dark .card h2,
body.theme-dark .topbar h1,
body.theme-dark .topbar h2 {
  color: #bfdbfe !important;
}

/* system theme mirrors dark rules when OS is dark */
@media (prefers-color-scheme: dark) {
  body.theme-system {
    color-scheme: dark;
    background: var(--bg) !important;
    color: var(--text) !important;
  }
  body.theme-system #app-container,
  body.theme-system #map-wrap { background: var(--bg) !important; }
  body.theme-system .layer-item,
  body.theme-system .result-item,
  body.theme-system .info-card,
  body.theme-system .mini-summary,
  body.theme-system .locked-box,
  body.theme-system .mode-tool-list > div,
  body.theme-system .nearest-item,
  body.theme-system .nearest-panel-item,
  body.theme-system .inventory-panel,
  body.theme-system .nearest-panel,
  body.theme-system .legend,
  body.theme-system .leaflet-control,
  body.theme-system .leaflet-control-layers,
  body.theme-system .leaflet-bar a,
  body.theme-system .leaflet-control-attribution,
  body.theme-system .topbar,
  body.theme-system .card,
  body.theme-system .group,
  body.theme-system .wrap,
  body.theme-system .container {
    background: #111827 !important;
    color: #e5e7eb !important;
    border-color: #334155 !important;
  }
  body.theme-system .legend h4,
  body.theme-system .legend div,
  body.theme-system .account-dropdown a:hover { color: #e5e7eb !important; }
  body.theme-system input,
  body.theme-system select,
  body.theme-system textarea,
  body.theme-system .filter-select,
  body.theme-system .btn-grid button,
  body.theme-system .module-btn {
    background: #0b1220 !important;
    color: #e5e7eb !important;
    border-color: #334155 !important;
  }
  body.theme-system button:disabled,
  body.theme-system input:disabled,
  body.theme-system select:disabled,
  body.theme-system textarea:disabled,
  body.theme-system .btn-grid button:disabled {
    background: #1f2937 !important;
    color: #94a3b8 !important;
    border-color: #334155 !important;
    opacity: 1 !important;
  }
}