/* =======================================================
   VISY - TEMA ESCURO (opcional)
   2026-10-10: tema claro passou a ser o padrao. Todas as regras
   deste arquivo valem SOMENTE sob html[data-bs-theme="dark"]
   (alternador no menu do usuario). As cores vem dos tokens
   --vz-* de visy-2026.css. Sidebar/hamburger/backdrop/scrollbar
   foram movidos para visy-2026.css e pages/index.css.
   ======================================================= */

/* ── Paleta de cores escuras ── */
html[data-bs-theme="dark"] {
    /* Fase 2026: aliases legados -> tokens Visy 2026 (visy-2026.css) */
    --dk-bg-0:      var(--vz-bg);          /* fundo da pagina */
    --dk-bg-1:      var(--vz-surface);     /* cards / paineis */
    --dk-bg-2:      var(--vz-surface-2);   /* sub-paineis / hover */
    --dk-bg-3:      var(--vz-field);       /* inputs / dropdowns */
    --dk-border:    var(--vz-line);        /* bordas */
    --dk-text-1:    var(--vz-text);        /* texto principal */
    --dk-text-2:    var(--vz-muted);       /* texto secundario */
    --dk-text-3:    var(--vz-faint);       /* placeholder / desabilitado */
    --dk-accent:    var(--vz-primary);     /* azul de destaque */
    --dk-shadow:    rgba(0, 0, 0, 0.45);   /* sombras */

    /* Override das variaveis originais do style.css */
    --first-color:       var(--vz-surface);
    --first-color-light: var(--vz-muted);
    --black-color:       var(--vz-text);
    --white-color:       var(--vz-surface);
}

/* ============================================================
   GERAL
   ============================================================ */
html[data-bs-theme="dark"] body {
    background: var(--dk-bg-0) !important;
    color: var(--dk-text-1) !important;
}

/* Texto */
html[data-bs-theme="dark"] h1,
html[data-bs-theme="dark"] h2,
html[data-bs-theme="dark"] h3,
html[data-bs-theme="dark"] h4,
html[data-bs-theme="dark"] h5,
html[data-bs-theme="dark"] h6 { color: var(--dk-text-1) !important; }
html[data-bs-theme="dark"] .text-dark { color: var(--dk-text-1) !important; }
html[data-bs-theme="dark"] .text-muted { color: var(--dk-text-2) !important; }
html[data-bs-theme="dark"] .form-label { color: var(--dk-text-2) !important; }
html[data-bs-theme="dark"] p,
html[data-bs-theme="dark"] li { color: inherit; }

/* Links */
html[data-bs-theme="dark"] a:not(.btn):not(.nav_link):not(.nav_logout):not(.dropdown-item) {
    color: var(--dk-text-2) !important;
}
html[data-bs-theme="dark"] a:not(.btn):not(.nav_link):not(.nav_logout):not(.dropdown-item):hover {
    color: var(--dk-text-1) !important;
}

/* ============================================================
   CARDS / MINI-STAT
   ============================================================ */
html[data-bs-theme="dark"] .mini-stat {
    background-color: var(--dk-bg-1) !important;
}

html[data-bs-theme="dark"] .card {
    background-color: var(--dk-bg-1) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .card-body {
    background-color: var(--dk-bg-1) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .card-header {
    background-color: var(--dk-bg-2) !important;
    border-bottom-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .card-footer {
    background-color: var(--dk-bg-2) !important;
    border-top-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .card-title { color: var(--dk-text-2) !important; }

html[data-bs-theme="dark"] .bx-shadow {
    box-shadow: 0 2px 12px rgba(0,0,0,0.35) !important;
}
html[data-bs-theme="dark"] .cai {
    box-shadow: 0 2px 12px rgba(0,0,0,0.35) !important;
}

/* ============================================================
   FORMULÁRIOS
   ============================================================ */
html[data-bs-theme="dark"] .form-control {
    background-color: var(--dk-bg-3) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .form-control::placeholder { color: var(--dk-text-3) !important; }
html[data-bs-theme="dark"] .form-control:focus {
    background-color: var(--dk-bg-3) !important;
    border-color: rgba(var(--vz-primary-rgb), 0.45) !important;
    color: var(--dk-text-1) !important;
    box-shadow: 0 0 0 0.2rem rgba(var(--vz-primary-rgb), 0.12) !important;
}
html[data-bs-theme="dark"] .form-control:disabled,
html[data-bs-theme="dark"] .form-control[readonly] {
    background-color: var(--dk-bg-2) !important;
    color: var(--dk-text-3) !important;
}

html[data-bs-theme="dark"] .form-select {
    background-color: var(--dk-bg-3) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
    /* Seta branca */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%238b949e' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
}
html[data-bs-theme="dark"] .form-select:focus {
    background-color: var(--dk-bg-3) !important;
    border-color: rgba(var(--vz-primary-rgb), 0.45) !important;
    color: var(--dk-text-1) !important;
    box-shadow: 0 0 0 0.2rem rgba(var(--vz-primary-rgb), 0.12) !important;
}

html[data-bs-theme="dark"] .input-group-text {
    background-color: var(--dk-bg-2) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text-2) !important;
}

/* Checkbox */
html[data-bs-theme="dark"] .checkbox label::before {
    background-color: var(--dk-bg-3) !important;
    border-color: rgba(255,255,255,0.2) !important;
}
html[data-bs-theme="dark"] .checkbox label::after { color: var(--dk-text-1) !important; }

/* ============================================================
   ABAS (Bootstrap nav-tabs)
   ============================================================ */
html[data-bs-theme="dark"] .nav-tabs {
    border-bottom-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .nav-tabs .nav-link {
    color: var(--dk-text-2) !important;
}
html[data-bs-theme="dark"] .nav-tabs .nav-link:hover {
    color: var(--dk-text-1) !important;
    border-color: transparent !important;
}
html[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    color: var(--dk-accent) !important;
    background: transparent !important;
    border-bottom-color: var(--dk-accent) !important;
}
html[data-bs-theme="dark"] .nav-tabs .nav-link.disabled {
    color: var(--dk-text-3) !important;
}

/* Style.css nav-tabs override */
html[data-bs-theme="dark"] .nav.nav-tabs > li > a,
html[data-bs-theme="dark"] .nav.tabs-vertical > li > a {
    color: var(--dk-text-2) !important;
}
html[data-bs-theme="dark"] .nav.nav-tabs > li > a.active,
html[data-bs-theme="dark"] .nav.nav-tabs > li > a:hover,
html[data-bs-theme="dark"] .nav.tabs-vertical > li > a:hover {
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .nav.nav-tabs > li > a.active {
    background-color: transparent !important;
}
html[data-bs-theme="dark"] .tab-content {
    background: var(--dk-bg-1) !important;
    color: var(--dk-text-1) !important;
}

/* ============================================================
   DATEPICKER
   ============================================================ */
html[data-bs-theme="dark"] .datepicker {
    background-color: var(--dk-bg-2) !important;
    border-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .datepicker th,
html[data-bs-theme="dark"] .datepicker td {
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .datepicker table tr td:hover,
html[data-bs-theme="dark"] .datepicker table tr th:hover {
    background: var(--dk-bg-3) !important;
}
html[data-bs-theme="dark"] .datepicker table tr td.old,
html[data-bs-theme="dark"] .datepicker table tr td.new {
    color: var(--dk-text-3) !important;
}
html[data-bs-theme="dark"] .datepicker table tr td.today,
html[data-bs-theme="dark"] .datepicker table tr td.today:hover {
    background-color: rgba(var(--vz-primary-rgb),0.18) !important;
    color: var(--dk-accent) !important;
}
html[data-bs-theme="dark"] .datepicker table tr td.active,
html[data-bs-theme="dark"] .datepicker table tr td.active:hover {
    background-color: var(--dk-accent) !important;
    color: #fff !important;
}
html[data-bs-theme="dark"] .datepicker-dropdown:after { border-bottom-color: var(--dk-bg-2) !important; }
html[data-bs-theme="dark"] .datepicker-dropdown:before { border-bottom-color: var(--dk-border) !important; }
html[data-bs-theme="dark"] .datepicker .datepicker-switch,
html[data-bs-theme="dark"] .datepicker .prev,
html[data-bs-theme="dark"] .datepicker .next {
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .datepicker .datepicker-switch:hover,
html[data-bs-theme="dark"] .datepicker .prev:hover,
html[data-bs-theme="dark"] .datepicker .next:hover {
    background: var(--dk-bg-3) !important;
}

/* ============================================================
   TABELAS / DATATABLES
   ============================================================ */

/* Bootstrap 5 — sobrescreve as variáveis CSS antes de qualquer regra */
html[data-bs-theme="dark"] .table {
    --bs-table-bg:            transparent;
    --bs-table-border-color:  var(--dk-border);
    --bs-table-color:         var(--dk-text-1);
    --bs-table-striped-bg:    rgba(255,255,255,0.03);
    --bs-table-striped-color: var(--dk-text-1);
    --bs-table-active-bg:     var(--dk-bg-2);
    --bs-table-active-color:  var(--dk-text-1);
    --bs-table-hover-bg:      var(--dk-bg-2);
    --bs-table-hover-color:   var(--dk-text-1);
    color: var(--dk-text-1) !important;
    border-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .table > :not(caption) > * > * {
    background-color: var(--bs-table-bg, transparent) !important;
    border-bottom-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .table thead th,
html[data-bs-theme="dark"] .table thead td {
    background-color: var(--dk-bg-2) !important;
    color: var(--dk-text-2) !important;
    border-bottom-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: rgba(255,255,255,0.03);
    background-color: rgba(255,255,255,0.03) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .table tbody tr:hover > td,
html[data-bs-theme="dark"] .table tbody tr:hover > th { background-color: var(--dk-bg-2) !important; }

/* DataTables — linhas odd/even geradas pelo plugin */
html[data-bs-theme="dark"] table.dataTable tbody tr {
    background-color: transparent !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] table.dataTable tbody tr.odd { background-color: rgba(255,255,255,0.03) !important; }
html[data-bs-theme="dark"] table.dataTable tbody tr.even { background-color: transparent !important; }
html[data-bs-theme="dark"] table.dataTable tbody tr:hover { background-color: var(--dk-bg-2) !important; }
html[data-bs-theme="dark"] table.dataTable thead th,
html[data-bs-theme="dark"] table.dataTable thead td {
    background-color: var(--dk-bg-2) !important;
    color: var(--dk-text-2) !important;
    border-bottom: 1px solid var(--dk-border) !important;
}
html[data-bs-theme="dark"] table.dataTable.stripe tbody tr.odd,
html[data-bs-theme="dark"] table.dataTable.display tbody tr.odd { background-color: rgba(255,255,255,0.03) !important; }
html[data-bs-theme="dark"] table.dataTable.hover tbody tr:hover,
html[data-bs-theme="dark"] table.dataTable.display tbody tr:hover { background-color: var(--dk-bg-2) !important; }

/* DataTables controles */
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_info,
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length label,
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter label {
    color: var(--dk-text-2) !important;
}
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter input,
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length select {
    background-color: var(--dk-bg-3) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
    border-radius: 5px;
    padding: 2px 6px;
}
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--dk-text-2) !important;
    background: transparent !important;
    border-color: transparent !important;
}
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--dk-bg-2) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: rgba(var(--vz-primary-rgb),0.18) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-accent) !important;
}
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
html[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    color: var(--dk-text-3) !important;
}

/* ============================================================
   MODAL
   ============================================================ */
html[data-bs-theme="dark"] .modal-content {
    background-color: var(--dk-bg-1) !important;
    border-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .modal-header {
    background-color: var(--dk-bg-2) !important;
    border-bottom-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .modal-footer {
    background-color: var(--dk-bg-2) !important;
    border-top-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .modal-title { color: var(--dk-text-1) !important; }
html[data-bs-theme="dark"] .modal-body { color: var(--dk-text-1) !important; }
/* Botão "X" de fechar visível em fundo escuro */
html[data-bs-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
    opacity: 0.6 !important;
}
html[data-bs-theme="dark"] .btn-close:hover { opacity: 1 !important; }

/* ============================================================
   DROPDOWN
   ============================================================ */
html[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--dk-bg-2) !important;
    border-color: var(--dk-border) !important;
    box-shadow: 0 8px 24px var(--dk-shadow) !important;
}
html[data-bs-theme="dark"] .dropdown-item {
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .dropdown-item:hover,
html[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: var(--dk-bg-3) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .dropdown-divider { border-color: var(--dk-border) !important; }
html[data-bs-theme="dark"] .dropdown-header { color: var(--dk-text-3) !important; }

/* ============================================================
   PAGINATION (Bootstrap)
   ============================================================ */
html[data-bs-theme="dark"] .page-item .page-link {
    background-color: var(--dk-bg-1) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text-2) !important;
}
html[data-bs-theme="dark"] .page-item .page-link:hover {
    background-color: var(--dk-bg-2) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .page-item.active .page-link {
    background-color: var(--vz-primary) !important;
    border-color: var(--vz-primary) !important;
    color: #fff !important;
}
html[data-bs-theme="dark"] .page-item.disabled .page-link {
    background-color: var(--dk-bg-1) !important;
    color: var(--dk-text-3) !important;
}

/* ============================================================
   BOTÕES
   ============================================================ */
html[data-bs-theme="dark"] .btn-outline-primary {
    color: var(--dk-accent) !important;
    border-color: var(--dk-accent) !important;
}
html[data-bs-theme="dark"] .btn-outline-primary:hover {
    background-color: rgba(var(--vz-primary-rgb),0.15) !important;
    color: var(--dk-accent) !important;
}
html[data-bs-theme="dark"] .btn-outline-secondary {
    color: var(--dk-text-2) !important;
    border-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .btn-outline-secondary:hover {
    background-color: var(--dk-bg-2) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .btn-outline-danger {
    color: #ff6b6b !important;
    border-color: rgba(255,107,107,0.5) !important;
}
html[data-bs-theme="dark"] .btn-outline-danger:hover {
    background-color: rgba(255,107,107,0.15) !important;
}

/* ============================================================
   ALERTAS
   ============================================================ */
html[data-bs-theme="dark"] .alert-danger {
    background-color: rgba(239,83,80,0.14) !important;
    border-color: rgba(239,83,80,0.28) !important;
    color: #ff8a80 !important;
}
html[data-bs-theme="dark"] .alert-warning {
    background-color: rgba(255,193,7,0.12) !important;
    border-color: rgba(255,193,7,0.25) !important;
    color: #ffd54f !important;
}
html[data-bs-theme="dark"] .alert-success {
    background-color: rgba(76,175,80,0.14) !important;
    border-color: rgba(76,175,80,0.28) !important;
    color: #a5d6a7 !important;
}
html[data-bs-theme="dark"] .alert-info {
    background-color: rgba(33,150,243,0.12) !important;
    border-color: rgba(33,150,243,0.25) !important;
    color: #90caf9 !important;
}

/* ============================================================
   CARDS DE EVENTOS (facial, veículos, anti-intruso)
   ============================================================ */
html[data-bs-theme="dark"] .evento-unified-card,
html[data-bs-theme="dark"] .veiculo-card,
html[data-bs-theme="dark"] .deteccao-card,
html[data-bs-theme="dark"] .intruder-card {
    background: var(--dk-bg-2) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}
html[data-bs-theme="dark"] .evento-unified-card:hover,
html[data-bs-theme="dark"] .veiculo-card:hover,
html[data-bs-theme="dark"] .deteccao-card:hover,
html[data-bs-theme="dark"] .intruder-card:hover {
    box-shadow: 0 6px 18px rgba(0,0,0,0.5) !important;
}
html[data-bs-theme="dark"] .evento-unified-info {
    background: linear-gradient(to bottom, var(--dk-bg-2), var(--dk-bg-1)) !important;
}
html[data-bs-theme="dark"] .veiculo-info,
html[data-bs-theme="dark"] .deteccao-info,
html[data-bs-theme="dark"] .intruder-card .card-body {
    background: var(--dk-bg-2) !important;
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .intruder-card .card-footer {
    background-color: var(--dk-bg-1) !important;
    border-top-color: var(--dk-border) !important;
}
html[data-bs-theme="dark"] .intruder-card .card-footer .btn-primary {
    background-color: var(--vz-primary) !important;
    border: none !important;
}

html[data-bs-theme="dark"] .ev-nome,
html[data-bs-theme="dark"] .placa,
html[data-bs-theme="dark"] .nome {
    color: var(--dk-text-1) !important;
}
html[data-bs-theme="dark"] .ev-placa { color: var(--dk-text-1) !important; }
html[data-bs-theme="dark"] .ev-motivo { color: var(--dk-text-2) !important; }
html[data-bs-theme="dark"] .camera-info { color: var(--dk-text-2) !important; }
html[data-bs-theme="dark"] .timestamp { color: var(--dk-text-3) !important; }

/* Paginação customizada dos eventos */
html[data-bs-theme="dark"] .pagina-info { color: var(--dk-text-2) !important; }

/* ============================================================
   MODAL DE ALERTA FACIAL (Maps + Vídeo)
   ============================================================ */
html[data-bs-theme="dark"] .info-text {
    background-color: var(--dk-bg-2) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}
html[data-bs-theme="dark"] .info-text p { color: var(--dk-text-1) !important; }

/* ============================================================
   SWEETALERT2
   ============================================================ */
html[data-bs-theme="dark"] .swal2-popup {
    background: var(--dk-bg-2) !important;
    color: var(--dk-text-1) !important;
    border: 1px solid var(--dk-border) !important;
}
html[data-bs-theme="dark"] .swal2-title { color: var(--dk-text-1) !important; }
html[data-bs-theme="dark"] .swal2-html-container { color: var(--dk-text-2) !important; }
html[data-bs-theme="dark"] .swal2-icon.swal2-warning { border-color: #ffd54f !important; color: #ffd54f !important; }
html[data-bs-theme="dark"] .swal2-icon.swal2-error { border-color: #ff8a80 !important; color: #ff8a80 !important; }

/* ============================================================
   OVERRIDES — estilos inline hardcoded nos JSPs de dashboard
   (tabelas customizadas, cards, abas e componentes de página)
   ============================================================ */

/* Card container padrão dos dashboards */
html[data-bs-theme="dark"] .mini-stat.bx-shadow {
    background: var(--dk-bg-1) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.4) !important;
}
html[data-bs-theme="dark"] .mini-stat h4 { color: var(--dk-text-1) !important; }

/* Cabeçalho de tabelas customizadas (.table-tittle) */
html[data-bs-theme="dark"] .table-tittle {
    background-color: var(--dk-bg-2) !important;
}
html[data-bs-theme="dark"] .table-tittle td,
html[data-bs-theme="dark"] .table-tittle th {
    color: var(--dk-text-2) !important;
    border-bottom: 2px solid var(--dk-border) !important;
}

/* Células e hover das tabelas customizadas */
html[data-bs-theme="dark"] .table-show-users td,
html[data-bs-theme="dark"] .table-show-users th {
    color: var(--dk-text-1) !important;
    border-bottom: 1px solid var(--dk-border) !important;
}
html[data-bs-theme="dark"] .table-show-users tbody tr:hover,
html[data-bs-theme="dark"] .table-show-users tr:not(.table-tittle):hover {
    background-color: var(--dk-bg-2) !important;
}

/* Texto de paginação */
html[data-bs-theme="dark"] .pagina-info { color: var(--dk-text-2) !important; }

/* Abas (nav-tabs) com borda hardcoded */
html[data-bs-theme="dark"] .nav-tabs {
    border-bottom-color: var(--dk-border) !important;
}

/* Info de evento / card info com gradiente claro */
html[data-bs-theme="dark"] .evento-unified-info {
    background: linear-gradient(to bottom, var(--dk-bg-2), var(--dk-bg-1)) !important;
}

/* Card-body com gradiente claro (anti_intruso.jsp, etc.) */
html[data-bs-theme="dark"] .card-body {
    background: var(--dk-bg-1) !important;
}

/* Config cards em cadastro */
html[data-bs-theme="dark"] .config-card {
    background-color: var(--dk-bg-1) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-text-1) !important;
}

/* Coordinates info / info-box com fundo claro */
html[data-bs-theme="dark"] .coordinates-info,
html[data-bs-theme="dark"] .info-box {
    background-color: var(--dk-bg-2) !important;
    color: var(--dk-text-1) !important;
}

/* Btn-group hover em metricas */
html[data-bs-theme="dark"] .btn-group .btn:hover:not(.active),
html[data-bs-theme="dark"] .btn-group .btn-outline-primary:hover {
    background-color: var(--dk-bg-2) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text-1) !important;
}

/* ============================================================
   BADGES
   ============================================================ */
html[data-bs-theme="dark"] .badge-facial { background: rgba(29,78,216,0.25) !important; color: #93c5fd !important; }
html[data-bs-theme="dark"] .badge-veiculo { background: rgba(21,128,61,0.25) !important; color: #86efac !important; }
html[data-bs-theme="dark"] .badge-intruso { background: rgba(185,28,28,0.25) !important; color: #fca5a5 !important; }