/* Global palette tokens */
:root {
    --app-bg: #F4F7FC;
    --app-surface: #FFFFFF;
    --app-primary: #1D4ED8;
    --app-text: #0B1437;
    --app-text-muted: #5B6B8C;
    --app-border: #D6DEEB;
    --app-danger: #FA3E3E;
    --app-on-primary: #FFFFFF;
    --app-primary-10: rgba(29, 78, 216, 0.1);
    --app-primary-20: rgba(29, 78, 216, 0.2);
    --app-danger-20: rgba(250, 62, 62, 0.2);
    --app-muted-20: rgba(101, 103, 107, 0.2);
    --status-inactive-text: #0C53B7;
    --status-inactive-bg: rgba(24, 144, 255, 0.16);
    --status-ocupado-text: #B78103;
    --status-ocupado-bg: rgba(255, 193, 7, 0.16);
    --status-active-text: #229A16;
    --status-active-bg: rgba(84, 214, 44, 0.16);
    --status-blocked-text: #B71C1C;
    --status-blocked-bg: rgba(255, 82, 82, 0.16);
    --status-finalizado-text: #1D4ED8;
    --status-finalizado-bg: rgba(29, 78, 216, 0.14);
    --status-aceptado-text: #0F5132;
    --status-aceptado-bg: rgba(25, 135, 84, 0.18);
    --status-pendiente-text: #8A6D3B;
    --status-pendiente-bg: rgba(255, 193, 7, 0.18);
    --status-cancelado-text: #B02A37;
    --status-cancelado-bg: rgba(220, 53, 69, 0.18);
}

/* Dark Mode Theme */
[data-theme="dark"] {
    --app-bg: #0B1026;
    --app-surface: #151C3D;
    --app-primary: #3B82F6;
    --app-text: #EAF0FF;
    --app-text-muted: #A9B4D0;
    --app-border: #2A3560;
    --app-danger: #F02849;
    --app-on-primary: #FFFFFF;
    --app-primary-10: rgba(59, 130, 246, 0.1);
    --app-primary-20: rgba(59, 130, 246, 0.2);
    --app-danger-20: rgba(240, 40, 73, 0.2);
    --app-muted-20: rgba(176, 179, 184, 0.2);
    --status-inactive-text: #6CB2FF;
    --status-inactive-bg: rgba(77, 163, 255, 0.2);
    --status-ocupado-text: #FFD166;
    --status-ocupado-bg: rgba(255, 209, 102, 0.2);
    --status-active-text: #7CFF6B;
    --status-active-bg: rgba(124, 255, 107, 0.2);
    --status-blocked-text: #FF7A7A;
    --status-blocked-bg: rgba(255, 122, 122, 0.2);
    --status-finalizado-text: #8CC2FF;
    --status-finalizado-bg: rgba(79, 156, 255, 0.22);
    --status-aceptado-text: #7CFFB2;
    --status-aceptado-bg: rgba(60, 209, 140, 0.22);
    --status-pendiente-text: #FFD166;
    --status-pendiente-bg: rgba(255, 209, 102, 0.22);
    --status-cancelado-text: #FF9AA5;
    --status-cancelado-bg: rgba(255, 122, 122, 0.22);

    --primary: var(--app-primary);
    --secondary: var(--app-surface);
    --white: var(--app-surface);
    --neutral: var(--app-surface);
    --danger: var(--app-danger);
    --warning: var(--app-danger);
    --dark: var(--app-text);
    --gray: var(--app-text-muted);
    --light: var(--app-border);
    --default: var(--app-text);
    --gray-dark: var(--app-text);
    --lighter: var(--app-border);
}

[data-theme="dark"] body {
    background-color: var(--app-bg);
    color: var(--app-text);
}

[data-theme="dark"] .bg-white {
    background-color: var(--app-surface) !important;
}

[data-theme="dark"] .table {
    color: var(--app-text);
}

[data-theme="dark"] .table-hover tbody tr:hover {
    color: var(--app-text);
    background-color: var(--app-border);
}

[data-theme="dark"] .table .thead-light th {
    color: var(--app-text-muted);
    background-color: var(--app-bg);
}

[data-theme="dark"] .form-control {
    background-color: var(--app-surface);
    color: var(--app-text);
    border-color: var(--app-border);
}

[data-theme="dark"] .card {
    background-color: var(--app-surface);
    border-color: var(--app-border);
}

[data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6, [data-theme="dark"] .h1, [data-theme="dark"] .h2, [data-theme="dark"] .h3, [data-theme="dark"] .h4, [data-theme="dark"] .h5, [data-theme="dark"] .h6 {
    color: var(--app-text);
}

/* Light Mode Theme */
[data-theme="light"] {
    --app-bg: #F4F7FC;
    --app-surface: #FFFFFF;
    --app-primary: #1D4ED8;
    --app-text: #0B1437;
    --app-text-muted: #5B6B8C;
    --app-border: #D6DEEB;
    --app-danger: #FA3E3E;
    --app-on-primary: #FFFFFF;
    --app-primary-10: rgba(29, 78, 216, 0.1);
    --app-primary-20: rgba(29, 78, 216, 0.2);
    --app-danger-20: rgba(250, 62, 62, 0.2);
    --app-muted-20: rgba(101, 103, 107, 0.2);
    --status-inactive-text: #0C53B7;
    --status-inactive-bg: rgba(24, 144, 255, 0.16);
    --status-ocupado-text: #B78103;
    --status-ocupado-bg: rgba(255, 193, 7, 0.16);
    --status-active-text: #229A16;
    --status-active-bg: rgba(84, 214, 44, 0.16);
    --status-blocked-text: #B71C1C;
    --status-blocked-bg: rgba(255, 82, 82, 0.16);
    --status-finalizado-text: #1D4ED8;
    --status-finalizado-bg: rgba(29, 78, 216, 0.14);
    --status-aceptado-text: #0F5132;
    --status-aceptado-bg: rgba(25, 135, 84, 0.18);
    --status-pendiente-text: #8A6D3B;
    --status-pendiente-bg: rgba(255, 193, 7, 0.18);
    --status-cancelado-text: #B02A37;
    --status-cancelado-bg: rgba(220, 53, 69, 0.18);

    --primary: var(--app-primary);
    --secondary: var(--app-surface);
    --white: var(--app-surface);
    --neutral: var(--app-surface);
    --danger: var(--app-danger);
    --warning: var(--app-danger);
    --dark: var(--app-text);
    --gray: var(--app-text-muted);
    --light: var(--app-border);
    --default: var(--app-text);
    --gray-dark: var(--app-text);
    --lighter: var(--app-border);
}

[data-theme="light"] body {
    background-color: var(--app-bg);
    color: var(--app-text);
}

[data-theme="light"] .bg-white {
    background-color: var(--app-surface) !important;
}

[data-theme="light"] .table {
    color: var(--app-text);
}

[data-theme="light"] .table-hover tbody tr:hover {
    color: var(--app-text);
    background-color: var(--app-border);
}

[data-theme="light"] .table .thead-light th {
    color: var(--app-text-muted);
    background-color: var(--app-bg);
}

[data-theme="light"] .form-control {
    background-color: var(--app-surface);
    color: var(--app-text);
    border-color: var(--app-border);
}

/* Estado badges normalized for light/dark themes */
[data-theme] .estado_inactivo {
    color: var(--status-inactive-text) !important;
    background-color: var(--status-inactive-bg) !important;
}

[data-theme] .estado_ocupado {
    color: var(--status-ocupado-text) !important;
    background-color: var(--status-ocupado-bg) !important;
}

[data-theme] .estado_activo {
    color: var(--status-active-text) !important;
    background-color: var(--status-active-bg) !important;
}

[data-theme] .estado_bloqueado {
    color: var(--status-blocked-text) !important;
    background-color: var(--status-blocked-bg) !important;
}

[data-theme] .estado_finalizado {
    color: var(--status-finalizado-text) !important;
    background-color: var(--status-finalizado-bg) !important;
}

[data-theme] .estado_aceptado {
    color: var(--status-aceptado-text) !important;
    background-color: var(--status-aceptado-bg) !important;
}

[data-theme] .estado_pendiente {
    color: var(--status-pendiente-text) !important;
    background-color: var(--status-pendiente-bg) !important;
}

[data-theme] .estado_cancelado {
    color: var(--status-cancelado-text) !important;
    background-color: var(--status-cancelado-bg) !important;
}

[data-theme="light"] .card {
    background-color: var(--app-surface);
    border-color: var(--app-border);
}

[data-theme="light"] h1, [data-theme="light"] h2, [data-theme="light"] h3, [data-theme="light"] h4, [data-theme="light"] h5, [data-theme="light"] h6, [data-theme="light"] .h1, [data-theme="light"] .h2, [data-theme="light"] .h3, [data-theme="light"] .h4, [data-theme="light"] .h5, [data-theme="light"] .h6 {
    color: var(--app-text);
}

[data-theme] .bg-primary {
    background-color: var(--app-primary) !important;
}

[data-theme] .text-primary {
    color: var(--app-primary) !important;
}

[data-theme] .border-primary {
    border-color: var(--app-primary) !important;
}

/* Text normalization */
[data-theme] body {
    color: var(--app-text);
}

[data-theme] a {
    color: var(--app-primary);
    text-decoration: none;
}

[data-theme] a:hover {
    color: var(--app-primary);
    opacity: 0.9;
    text-decoration: none;
}

[data-theme] a:focus,
[data-theme] a:active {
    text-decoration: none;
}

[data-theme] .text-muted,
[data-theme] .text-secondary,
[data-theme] .text-light {
    color: var(--app-text-muted) !important;
}

[data-theme] .text-default,
[data-theme] .text-dark {
    color: var(--app-text) !important;
}

[data-theme] .text-white {
    color: var(--app-on-primary) !important;
}

/* Inputs & labels */
[data-theme] .form-control,
[data-theme] .input-group-text,
[data-theme] label,
[data-theme] .form-control-label {
    color: var(--app-text);
}

[data-theme] .form-control::placeholder {
    color: var(--app-text-muted);
}

/* Focus + shadows normalized */
[data-theme] *:focus {
    outline: none;
}

[data-theme] a:focus,
[data-theme] button:focus,
[data-theme] input:focus,
[data-theme] select:focus,
[data-theme] textarea:focus,
[data-theme] .btn:focus,
[data-theme] .form-control:focus,
[data-theme] .custom-select:focus,
[data-theme] .custom-control-input:focus ~ .custom-control-label::before,
[data-theme] .custom-control-input:focus ~ .custom-control-label::after,
[data-theme] .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--app-primary) 30%, transparent) !important;
    border-color: var(--app-primary) !important;
}

[data-theme] .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    background-color: var(--app-surface);
}

[data-theme] .custom-control-input:focus:checked ~ .custom-control-label::before {
    background-color: var(--app-primary);
    border-color: var(--app-primary);
}

[data-theme] .btn:focus,
[data-theme] .btn.focus,
[data-theme] .btn:active:focus,
[data-theme] .btn.active:focus {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--app-primary) 35%, transparent) !important;
}

[data-theme] .card,
[data-theme] .modal-content,
[data-theme] .dropdown-menu {
    box-shadow: 0 8px 24px color-mix(in srgb, var(--app-text) 12%, transparent);
}

[data-theme] .shadow,
[data-theme] .shadow-sm,
[data-theme] .shadow-lg {
    box-shadow: 0 8px 24px color-mix(in srgb, var(--app-text) 12%, transparent) !important;
}

[data-theme] .navbar,
[data-theme] .sidenav {
    box-shadow: 0 6px 18px color-mix(in srgb, var(--app-text) 10%, transparent);
}

[data-theme] .form-control,
[data-theme] .input-group-text,
[data-theme] .custom-select {
    box-shadow: none;
}

/* Cards & modals */
[data-theme] .card,
[data-theme] .modal-content,
[data-theme] .dropdown-menu {
    background-color: var(--app-surface);
    color: var(--app-text);
    border-color: var(--app-border);
}

[data-theme] .dropdown-item {
    color: var(--app-text);
}

[data-theme] .dropdown-item:hover,
[data-theme] .dropdown-item:focus {
    background-color: var(--app-border);
    color: var(--app-text);
}

[data-theme] .modal-header,
[data-theme] .modal-footer {
    border-color: var(--app-border);
}

/* Tables */
[data-theme] .table,
[data-theme] .table th,
[data-theme] .table td {
    color: var(--app-text);
}

[data-theme] .table thead th {
    border-bottom-color: var(--app-border);
}

[data-theme] .table-bordered,
[data-theme] .table-bordered th,
[data-theme] .table-bordered td {
    border-color: var(--app-border);
}

/* Sidenav + topnav text/icon contrast */
[data-theme] .sidenav,
[data-theme] .navbar-vertical {
    background-color: var(--app-surface);
    color: var(--app-text);
}

[data-theme] .sidenav .nav-link {
    color: var(--app-text);
}

[data-theme] .sidenav .nav-link .nav-link-text,
[data-theme] .sidenav .nav-link i {
    color: inherit;
}

[data-theme] .sidenav .nav-link:hover {
    background-color: var(--app-border);
    color: var(--app-text);
}

[data-theme] .sidenav .nav-link.active {
    background-color: var(--app-border);
    color: var(--app-text);
}

[data-theme] .sidenav .nav-link.active .icon-brand-green {
    color: var(--app-primary);
}

[data-theme] .sidenav .nav-link:not(.active) .icon-brand-green {
    color: var(--app-text-muted);
}

[data-theme] .topnav-brand-bg,
[data-theme] .topnav-brand-bg .nav-link,
[data-theme] .topnav-brand-bg .nav-link-text,
[data-theme] .topnav-brand-bg .dropdown-toggle,
[data-theme] .topnav-brand-bg .media-body span {
    color: var(--app-on-primary) !important;
}

[data-theme] .topnav-brand-bg .dropdown-menu .dropdown-item {
    color: var(--app-text);
}

/* Active item for vertical navbar */
[data-theme] .navbar-vertical.navbar-expand-xs .navbar-nav > .nav-item > .nav-link.active {
    background-color: var(--app-border) !important;
    color: var(--app-text) !important;
    box-shadow: none;
}

[data-theme] .navbar-vertical.navbar-expand-xs .navbar-nav > .nav-item > .nav-link.active .icon-brand-green {
    color: var(--app-primary) !important;
}

/* Sidenav toggler theme colors only */
[data-theme] .sidenav-toggler {
    border-color: var(--app-border);
    background: var(--app-surface);
}

[data-theme] .sidenav-toggler .sidenav-toggler-line {
    background-color: var(--app-text);
}

/* Keep mobile sidenav toggler consistent */
@media (max-width: 991.98px) {
    [data-theme] .sidenav-toggler {
        border: 1px solid var(--app-border);
        background: var(--app-surface);
        border-radius: 10px;
    }

    [data-theme] .sidenav-toggler-inner {
        width: 18px;
        height: 14px;
    }

    [data-theme] .sidenav-toggler-line {
        background-color: var(--app-text) !important;
        height: 2px;
        border-radius: 2px;
    }
}

/* Topnav mobile sidenav toggler (match navbar brand colors) */
[data-theme] .navbar-top .sidenav-toggler {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 30px;
    padding: 0;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--app-on-primary) 40%, transparent);
    background: color-mix(in srgb, var(--app-on-primary) 16%, transparent);
    box-sizing: border-box;
    margin-right: 8px;
}

[data-theme] .navbar-top .sidenav-toggler .sidenav-toggler-line {
    background-color: var(--app-on-primary);
}

[data-theme] .navbar-top .sidenav-toggler .sidenav-toggler-inner,
.navbar-top .sidenav-toggler .sidenav-toggler-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    gap: 4px;
}

[data-theme] .navbar-top .sidenav-toggler .sidenav-toggler-line,
.navbar-top .sidenav-toggler .sidenav-toggler-line {
    margin: 0 !important;
    width: 16px;
    height: 2px;
    border-radius: 2px;
}

/* Override utility padding that offsets the icon */
[data-theme] .navbar-top .sidenav-toggler.pr-3,
.navbar-top .sidenav-toggler.pr-3 {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

[data-theme="dark"] .navbar-top .sidenav-toggler {
    border-color: color-mix(in srgb, var(--app-on-primary) 30%, transparent);
    background: color-mix(in srgb, var(--app-on-primary) 12%, transparent);
}

/* Remove the expanding circle/pill effect in topnav */
[data-theme] .navbar-top .sidenav-toggler .sidenav-toggler-inner:before {
    display: none !important;
}

[data-theme] .navbar-top .sidenav-toggler.active .sidenav-toggler-line:first-child,
[data-theme] .navbar-top .sidenav-toggler.active .sidenav-toggler-line:last-child {
    width: 18px;
    transform: none;
}

/* Collapse chevron colors in sidebar */
[data-theme] .navbar-vertical .navbar-nav .nav-link[data-toggle='collapse']:after {
    color: var(--app-text-muted);
}

[data-theme] .navbar-vertical .navbar-nav .nav-link[data-toggle='collapse'][aria-expanded='true']:after {
    color: var(--app-primary);
}

/* Pagination active state */
[data-theme] .pagination .page-item.active .page-link,
[data-theme] .page-item.active .page-link {
    background-color: var(--app-primary) !important;
    border-color: var(--app-primary) !important;
    color: var(--app-on-primary) !important;
}

/* DateRangePicker normalization */
[data-theme] .daterangepicker {
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    color: var(--app-text);
}

[data-theme] .daterangepicker:before,
[data-theme] .daterangepicker:after {
    border-bottom-color: var(--app-surface);
}

[data-theme] .daterangepicker .calendar-table {
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
}

[data-theme] .daterangepicker .calendar-table th,
[data-theme] .daterangepicker .calendar-table td {
    color: var(--app-text);
}

[data-theme] .daterangepicker th.month {
    color: var(--app-text);
}

[data-theme] .daterangepicker td.off,
[data-theme] .daterangepicker td.off.in-range,
[data-theme] .daterangepicker td.off.start-date,
[data-theme] .daterangepicker td.off.end-date {
    color: var(--app-text-muted);
    background-color: var(--app-surface);
}

[data-theme] .daterangepicker td.available:hover,
[data-theme] .daterangepicker th.available:hover {
    background-color: var(--app-primary);
    color: var(--app-on-primary);
}

[data-theme] .daterangepicker td.in-range {
    background-color: var(--app-bg);
    color: var(--app-text);
}

[data-theme] .daterangepicker td.active,
[data-theme] .daterangepicker td.active:hover,
[data-theme] .daterangepicker td.start-date,
[data-theme] .daterangepicker td.end-date {
    background-color: var(--app-primary);
    border-color: var(--app-primary);
    color: var(--app-on-primary);
}

[data-theme] .daterangepicker .ranges {
    background-color: var(--app-surface);
    border-right: 1px solid var(--app-border);
}

[data-theme] .daterangepicker .ranges li {
    color: var(--app-text);
}

[data-theme] .daterangepicker .ranges li:hover {
    background-color: var(--app-border);
}

[data-theme] .daterangepicker .ranges li.active {
    background-color: var(--app-primary);
    color: var(--app-on-primary);
}

[data-theme] .daterangepicker .drp-buttons {
    border-top: 1px solid var(--app-border);
    background-color: var(--app-surface);
}

[data-theme] .daterangepicker .drp-selected {
    color: var(--app-text-muted);
}

[data-theme] .daterangepicker .drp-buttons .btn {
    background-color: var(--app-primary);
    border-color: var(--app-primary);
    color: var(--app-on-primary);
}

[data-theme] .daterangepicker .drp-buttons .btn:hover {
    opacity: 0.9;
}

[data-theme] .daterangepicker .drp-buttons .btn.btn-default,
[data-theme] .daterangepicker .drp-buttons .btn.cancelBtn {
    background-color: var(--app-surface);
    border-color: var(--app-border);
    color: var(--app-text);
}

/* DataTables filter normalization */
[data-theme] div.dataTables_wrapper div.dataTables_filter label {
    color: var(--app-text-muted);
    font-weight: 600;
}

[data-theme] div.dataTables_wrapper div.dataTables_filter input {
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    color: var(--app-text);
    border-radius: 8px;
    padding: 6px 10px;
    height: 34px;
}

[data-theme] div.dataTables_wrapper div.dataTables_filter input:focus {
    border-color: var(--app-primary);
    outline: none;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--app-primary) 25%, transparent);
}

/* DataTables buttons */
[data-theme] .dt-buttons .btn,
[data-theme] .dt-buttons .dt-button {
    background-color: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text) !important;
}

[data-theme] .dt-buttons .btn:hover,
[data-theme] .dt-buttons .dt-button:hover {
    background-color: var(--app-border) !important;
    color: var(--app-text) !important;
}

[data-theme] .dt-buttons .btn.btn-success,
[data-theme] .dt-buttons .btn.btn-danger,
[data-theme] .dt-buttons .btn.btn-info {
    background-color: var(--app-primary) !important;
    border-color: var(--app-primary) !important;
    color: var(--app-on-primary) !important;
}

[data-theme] .dt-buttons .btn.btn-success:hover,
[data-theme] .dt-buttons .btn.btn-danger:hover,
[data-theme] .dt-buttons .btn.btn-info:hover {
    opacity: 0.9;
}

[data-theme] .dt-buttons .btn i {
    color: inherit;
}

/* Card header without border */
[data-theme] .card-header.border-0 {
    background-color: var(--app-surface);
    color: var(--app-text);
}

/* Modal blur + themed overlay */
[data-theme] .modal.show {
    backdrop-filter: blur(4px);
}

[data-theme] .modal-backdrop.show {
    background-color: var(--app-bg);
    opacity: 0.6;
}

[data-theme] .modal-content {
    background-color: var(--app-surface);
    color: var(--app-text);
    border-color: var(--app-border);
}

/* Modal close button contrast */
[data-theme] .modal .close,
[data-theme] .modal-header .close,
[data-theme] .close.close-modal {
    color: var(--app-text-muted);
    opacity: 1;
    text-shadow: none;
    border-radius: 999px;
    padding: 4px 8px;
}

[data-theme] .modal .close:hover,
[data-theme] .modal .close:focus,
[data-theme] .close.close-modal:hover,
[data-theme] .close.close-modal:focus {
    color: var(--app-text);
    opacity: 1;
    background-color: var(--app-border);
}

[data-theme] .modal .close span,
[data-theme] .modal-header .close span,
[data-theme] .close.close-modal span {
    color: inherit;
}

/* Global scrollbar colors (webkit + scrollbar plugin) */
[data-theme] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[data-theme] ::-webkit-scrollbar-thumb {
    background: var(--app-primary);
    border-radius: 4px;
}

[data-theme] ::-webkit-scrollbar-thumb:hover {
    background: var(--app-primary);
    box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
}

[data-theme] ::-webkit-scrollbar-track {
    background: var(--app-border);
    border-radius: 4px;
}

[data-theme] .scrollbar-inner .scroll-element_track,
[data-theme] .scrollbar-outer .scroll-element_track,
[data-theme] .scrollbar-rail .scroll-element_track,
[data-theme] .scrollbar-light .scroll-element_track,
[data-theme] .scrollbar-macosx .scroll-element_track,
[data-theme] .scrollbar-dynamic .scroll-element_track,
[data-theme] .scrollbar-chrome .scroll-element_track {
    background-color: var(--app-border) !important;
}

[data-theme] .scrollbar-inner .scroll-bar,
[data-theme] .scrollbar-outer .scroll-bar,
[data-theme] .scrollbar-rail .scroll-bar,
[data-theme] .scrollbar-light .scroll-bar,
[data-theme] .scrollbar-macosx .scroll-bar,
[data-theme] .scrollbar-dynamic .scroll-bar,
[data-theme] .scrollbar-chrome .scroll-bar {
    background-color: var(--app-primary) !important;
}

/* Button normalization (global) */
[data-theme] button,
[data-theme] .btn,
[data-theme] .dt-button,
[data-theme] input[type='button'],
[data-theme] input[type='submit'],
[data-theme] input[type='reset'] {
    border-radius: 8px;
    font-weight: 600;
    border: 1px solid var(--app-border);
    background-color: var(--app-surface);
    color: var(--app-text);
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

[data-theme] button:hover,
[data-theme] .btn:hover,
[data-theme] .dt-button:hover,
[data-theme] input[type='button']:hover,
[data-theme] input[type='submit']:hover,
[data-theme] input[type='reset']:hover {
    background-color: var(--app-border);
    color: var(--app-text);
}

[data-theme] .btn-primary,
[data-theme] .btn-success,
[data-theme] .btn-info {
    background-color: var(--app-primary) !important;
    border-color: var(--app-primary) !important;
    color: var(--app-on-primary) !important;
}

[data-theme] .btn-danger {
    background-color: var(--app-danger) !important;
    border-color: var(--app-danger) !important;
    color: var(--app-on-primary) !important;
}

[data-theme] .btn-outline-primary,
[data-theme] .btn-outline-success,
[data-theme] .btn-outline-info {
    background-color: transparent !important;
    border-color: var(--app-primary) !important;
    color: var(--app-primary) !important;
}

[data-theme] .btn-outline-danger {
    background-color: transparent !important;
    border-color: var(--app-danger) !important;
    color: var(--app-danger) !important;
}

[data-theme] .btn-primary:hover,
[data-theme] .btn-success:hover,
[data-theme] .btn-info:hover,
[data-theme] .btn-danger:hover {
    opacity: 0.9;
}

/* Custom button classes used in views */
[data-theme] .btn-brand-solid,
[data-theme] .boton-save,
[data-theme] .btn-login-submit,
[data-theme] .toggle-eye-btn {
    background-color: var(--app-primary) !important;
    border-color: var(--app-primary) !important;
    color: var(--app-on-primary) !important;
}

[data-theme] .btn-brand-outline {
    background-color: transparent !important;
    border-color: var(--app-primary) !important;
    color: var(--app-primary) !important;
}

/* Cancel buttons in modals */
[data-theme] .btn-secondary,
[data-theme] .btn-outline-secondary,
[data-theme] .modal .btn.btn-link,
[data-theme] .btn.btn-white,
[data-theme] .modal [data-dismiss='modal'] {
    background-color: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text-muted) !important;
}

[data-theme] .btn-secondary:hover,
[data-theme] .btn-outline-secondary:hover,
[data-theme] .modal .btn.btn-link:hover,
[data-theme] .btn.btn-white:hover,
[data-theme] .modal [data-dismiss='modal']:hover {
    background-color: var(--app-border) !important;
    color: var(--app-text) !important;
}

/* Custom cancel button classes */
[data-theme] .pasajeros-btn-cancel,
[data-theme] .adminusuarios-btn-cancel,
[data-theme] .estpasajeros-btn-cancel,
[data-theme] .btn-modal-cancel {
    background-color: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text-muted) !important;
}

[data-theme] .pasajeros-btn-cancel:hover,
[data-theme] .adminusuarios-btn-cancel:hover,
[data-theme] .estpasajeros-btn-cancel:hover,
[data-theme] .btn-modal-cancel:hover {
    background-color: var(--app-border) !important;
    color: var(--app-text) !important;
}

/* DataTables responsive control icon */
[data-theme] table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child:before,
[data-theme] table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child:before {
    background-color: var(--app-primary) !important;
    color: var(--app-on-primary) !important;
    border: 1px solid var(--app-primary) !important;
}

[data-theme] table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before,
[data-theme] table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
    background-color: var(--app-danger) !important;
    border-color: var(--app-danger) !important;
    color: var(--app-on-primary) !important;
}

/* Custom toggle normalization */
[data-theme] .custom-toggle-slider {
    background-color: var(--app-surface) !important;
    border: 1px solid var(--app-border) !important;
}

[data-theme] .custom-toggle-slider:before {
    background-color: var(--app-text) !important;
}

[data-theme] .custom-toggle input:checked + .custom-toggle-slider {
    background-color: var(--app-primary) !important;
    border-color: var(--app-primary) !important;
}

[data-theme] .custom-toggle input:checked + .custom-toggle-slider:before {
    background-color: var(--app-on-primary) !important;
}

/* Registro pages using gradient backgrounds */
[data-theme] body.bg-gradient-primary,
[data-theme] .header.bg-gradient-primary {
    background: var(--app-bg) !important;
}

/* Sidenav toggler spacing and contrast */

.theme-toggle-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
}

.theme-switch {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 1000;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    background: var(--app-surface);
    color: var(--app-text);
    border: 1px solid var(--app-border);
    border-radius: 999px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    font-size: 12px;
    font-weight: 600;
}

.theme-switch--top {
    position: static;
    right: auto;
    bottom: auto;
    margin-right: 12px;
    box-shadow: none;
}

.theme-switch-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.theme-switch-label {
    width: 40px;
    height: 22px;
    background: var(--app-border);
    border-radius: 999px;
    position: relative;
    cursor: pointer;
    transition: background 0.2s ease;
}

.theme-switch-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.theme-switch-input:checked + .theme-switch-label {
    background: var(--app-primary);
}

.theme-switch-input:checked + .theme-switch-label .theme-switch-thumb {
    transform: translateX(18px);
    background: var(--app-on-primary);
    border-color: var(--app-primary);
}

.theme-switch-text {
    user-select: none;
}
/* Lists text normalization */
[data-theme] ul,
[data-theme] ol {
  color: var(--app-text);
}

[data-theme] ul li,
[data-theme] ol li {
  color: var(--app-text);
}
[data-theme] .custom-control-label::before {
  background-color: var(--app-surface) !important;
  border-color: var(--app-border) !important;
}

[data-theme] .custom-control-label::after {
  background-color: transparent !important;
}
/*
[data-theme] .custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
}

[data-theme] .custom-control-input:checked ~ .custom-control-label::after {
  background-color: var(--app-on-primary) !important;
}

[data-theme] .custom-control-input:disabled ~ .custom-control-label::before {
  background-color: var(--app-border) !important;
  border-color: var(--app-border) !important;
}*/
/* Custom control visibility (checkbox/radio) 
[data-theme] .custom-control-label::before {
  background-color: var(--app-surface) !important;
  border: 2px solid var(--app-primary) !important;
}

[data-theme] .custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
}

[data-theme] .custom-control-input:checked ~ .custom-control-label::after {
  background-color: var(--app-on-primary) !important;
}*/
/* Custom checkbox checkmark 
[data-theme] .custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='white' d='M6.173 12.252L2.4 8.48l1.4-1.4 2.373 2.373 5.027-5.026 1.4 1.4z'/%3E%3C/svg%3E");
  background-size: 12px 12px;
  background-position: center;
  background-repeat: no-repeat;
}*/

/* Leaflet popup normalization */
[data-theme] .leaflet-popup-content-wrapper,
[data-theme] .leaflet-popup-tip {
  background: var(--app-surface);
  color: var(--app-text);
  border: 1px solid var(--app-border);
  box-shadow: 0 10px 26px color-mix(in srgb, var(--app-text) 18%, transparent);
}

[data-theme] .leaflet-popup-content-wrapper {
  border-radius: 12px;
}

[data-theme] .leaflet-popup-content {
  margin: 12px 14px;
  color: var(--app-text);
}

[data-theme] .leaflet-popup-content h1,
[data-theme] .leaflet-popup-content h2,
[data-theme] .leaflet-popup-content h3,
[data-theme] .leaflet-popup-content h4,
[data-theme] .leaflet-popup-content h5,
[data-theme] .leaflet-popup-content h6 {
  color: var(--app-text);
}

[data-theme] .leaflet-popup-content p,
[data-theme] .leaflet-popup-content span,
[data-theme] .leaflet-popup-content small {
  color: var(--app-text-muted);
}

[data-theme] .leaflet-popup-content a {
  color: var(--app-primary);
}

[data-theme] .leaflet-popup-content a:hover {
  opacity: 0.9;
}

[data-theme] .leaflet-popup-close-button {
  color: var(--app-text-muted) !important;
  text-shadow: none;
  border-radius: 999px;
  padding: 2px 6px !important;
  top: 6px;
  right: 6px;
}

[data-theme] .leaflet-popup-close-button:hover,
[data-theme] .leaflet-popup-close-button:focus {
  color: var(--app-text) !important;
  background-color: var(--app-border);
}

[data-theme] .leaflet-popup-content button,
[data-theme] .leaflet-popup-content .btn,
[data-theme] .leaflet-popup-content input[type='button'],
[data-theme] .leaflet-popup-content input[type='submit'],
[data-theme] .leaflet-popup-content input[type='reset'] {
  border-radius: 8px;
  font-weight: 600;
  border: 1px solid var(--app-border);
  background-color: var(--app-surface);
  color: var(--app-text);
}

[data-theme] .leaflet-popup-content button:hover,
[data-theme] .leaflet-popup-content .btn:hover,
[data-theme] .leaflet-popup-content input[type='button']:hover,
[data-theme] .leaflet-popup-content input[type='submit']:hover,
[data-theme] .leaflet-popup-content input[type='reset']:hover {
  background-color: var(--app-border);
  color: var(--app-text);
}

[data-theme] .leaflet-popup-content .btn-primary,
[data-theme] .leaflet-popup-content .btn-success,
[data-theme] .leaflet-popup-content .btn-info {
  background-color: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
  color: var(--app-on-primary) !important;
}

[data-theme] .leaflet-popup-content .btn-danger {
  background-color: var(--app-danger) !important;
  border-color: var(--app-danger) !important;
  color: var(--app-on-primary) !important;
}

/* Select2 normalized for light/dark themes */
[data-theme] .select2-container--default .select2-selection--single {
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 4px;
    height: 51px;
    padding: 10px 12px;
}

[data-theme] .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--app-text);
    line-height: 28px;
    padding-left: 0;
}

[data-theme] .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--app-text-muted);
}

[data-theme] .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 51px;
    right: 10px;
}

[data-theme] .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: var(--app-text-muted) transparent transparent transparent;
}

[data-theme] .select2-container--default .select2-dropdown {
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    color: var(--app-text);
}

[data-theme] .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    color: var(--app-text);
}

[data-theme] .select2-container--default .select2-results__option {
    color: var(--app-text);
}

[data-theme] .select2-container--default .select2-results__option--selected {
    background-color: var(--app-primary-10);
    color: var(--app-text);
}

[data-theme] .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--app-primary);
    color: var(--app-on-primary);
}

[data-theme] .select2-container--default .select2-selection--single.select2-selection--clearable .select2-selection__clear {
    color: var(--app-text-muted);
}

[data-theme] .select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: var(--app-bg);
    color: var(--app-text-muted);
}

[data-theme] .select2-container--default .select2-results__options {
    background-color: var(--app-surface);
    color: var(--app-text);
}

[data-theme] .select2-container--default .select2-results__option {
    color: var(--app-text);
}

[data-theme] .select2-container--default .select2-results__option--disabled {
    color: var(--app-text-muted);
}

/* Select2 stronger overrides for selected/hovered options */
[data-theme] .select2-container--default .select2-results__option {
    background-color: var(--app-surface);
    color: var(--app-text) !important;
}

[data-theme] .select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: var(--app-primary-10) !important;
    color: var(--app-text) !important;
}

[data-theme] .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--app-primary) !important;
    color: var(--app-on-primary) !important;
}

[data-theme] .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--app-text) !important;
}

[data-theme] .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--app-text-muted) !important;
}