/*
 * LIMPIEZA DE SOMBRAS - CONTENEDORES SECUNDARIOS
 * Elimina sombras de elementos internos manteniendo solo las principales
 */

/* ========== SOMBRAS NEUTRAS (tokens) ========== */
:root {
    /* Acento de borde sutil para separar del fondo claro */
    --elev-ring: 0 0 0 1px rgba(0, 0, 0, 0.03);
    /* Sombras suaves para sensación de "flotar" en modo claro */
    --elev-1: 0 1px 1px rgba(0, 0, 0, 0.03), 0 2px 4px rgba(0, 0, 0, 0.04);
    --elev-2: 0 1px 2px rgba(0, 0, 0, 0.04), 0 3px 8px rgba(0, 0, 0, 0.05);

    --vz-primary: #185FA5;
    --vz-info: #299cdb;

    --cc-primary: var(--vz-primary);
    --cc-info: var(--vz-info);
    --cc-gradient: linear-gradient(135deg, var(--cc-primary), var(--cc-info));

    --app-surface: #ffffff;
    --app-surface-2: #f8fafc;
    --app-border: rgba(15, 23, 42, 0.08);
    --app-radius-lg: 14px;
    --app-radius-md: 12px;
    --app-radius-sm: 10px;

    --app-topbar-bg: rgba(255, 255, 255, 0.92);
    --app-topbar-border: rgba(15, 23, 42, 0.08);

    --app-sidebar-bg: #0b1220;
    --app-sidebar-border: rgba(255, 255, 255, 0.10);
    --app-sidebar-item: rgba(255, 255, 255, 0.78);
    --app-sidebar-item-hover-bg: rgba(255, 255, 255, 0.10);
    --app-sidebar-item-hover-color: #ffffff;

    --bs-primary: #185FA5;
    --bs-primary-rgb: 24, 95, 165;
    --bs-primary-text-emphasis: #0f3c69;
    --bs-primary-bg-subtle: #d1e2f3;
    --bs-primary-border-subtle: #a3c5e8;

    --bs-info: #299cdb;
    --bs-info-rgb: 41, 156, 219;
    --bs-info-text-emphasis: #0b4b73;
    --bs-info-bg-subtle: #e0f3ff;
    --bs-info-border-subtle: #b3e1ff;

    --bs-link-color: #299cdb;
    --bs-link-hover-color: #1f80b8;
    --bs-link-color-rgb: 41, 156, 219;
    --bs-link-hover-color-rgb: 31, 128, 184;
    --bs-focus-ring-color: rgba(24, 95, 165, 0.25);
    --bs-heading-color: #313b5e;

    --bs-topbar-height: 84px;
    --bs-main-nav-item-font-size: 14px;
    --bs-main-nav-item-padding-y: 9px;
}

@media (prefers-color-scheme: dark) {
    :root {
        /* Anillo claro para separar del fondo oscuro */
        --elev-ring: 0 0 0 1px rgba(255, 255, 255, 0.04);
        /* Sombras más profundas en modo oscuro, manteniendo sutileza */
        --elev-1: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0, 0, 0, 0.25);
        --elev-2: 0 1px 2px rgba(0, 0, 0, 0.25), 0 3px 10px rgba(0, 0, 0, 0.3);
    }
}

/* Soporte explícito para clase .dark-mode */
html:not([data-bs-theme="light"]) .dark-mode {
    --elev-ring: 0 0 0 1px rgba(255, 255, 255, 0.04);
    --elev-1: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0, 0, 0, 0.25);
    --elev-2: 0 1px 2px rgba(0, 0, 0, 0.25), 0 3px 10px rgba(0, 0, 0, 0.3);

    --vz-primary: #185FA5;
    --vz-info: #299cdb;

    --cc-primary: var(--vz-primary);
    --cc-info: var(--vz-info);
    --cc-gradient: linear-gradient(135deg, var(--cc-primary), var(--cc-info));

    --bs-primary: #185FA5;
    --bs-primary-rgb: 24, 95, 165;
    --bs-primary-text-emphasis: #a3c5e8;
    --bs-primary-bg-subtle: rgba(24, 95, 165, 0.18);
    --bs-primary-border-subtle: rgba(24, 95, 165, 0.35);

    --bs-info: #299cdb;
    --bs-info-rgb: 41, 156, 219;
    --bs-info-text-emphasis: #b3e1ff;
    --bs-info-bg-subtle: rgba(41, 156, 219, 0.16);
    --bs-info-border-subtle: rgba(41, 156, 219, 0.32);

    --bs-link-color: #66c2ff;
    --bs-link-hover-color: #9ad6ff;
    --bs-link-color-rgb: 102, 194, 255;
    --bs-link-hover-color-rgb: 154, 214, 255;
    --bs-focus-ring-color: rgba(41, 156, 219, 0.28);
}

html[data-bs-theme="dark"],
html:not([data-bs-theme="light"]) .dark-mode {
    --bs-body-bg: #2d3748;
    --bs-body-bg-rgb: 45, 55, 72;
    --bs-secondary-bg: #374151;
    --bs-secondary-bg-rgb: 55, 65, 81;
    --bs-tertiary-bg: #4a5568;
    --bs-tertiary-bg-rgb: 74, 85, 104;
    --bs-border-color: #4a5568;
    --bs-border-color-translucent: rgba(255, 255, 255, 0.1);
    --bs-body-color: #e7edf3;
    --bs-secondary-color: #b7c1cc;
    --bs-focus-ring-color: rgba(41, 156, 219, 0.35);
    --bs-heading-color: #f1f5f9;
}

html[data-bs-theme="dark"] .card,
html[data-bs-theme="dark"] .modal-content,
html[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--bs-secondary-bg) !important;
    border-color: var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
}

html[data-bs-theme="dark"] .card.bg-white,
html[data-bs-theme="dark"] .card.bg-light,
html[data-bs-theme="dark"] .card[class*="bg-white"],
html[data-bs-theme="dark"] .card[class*="bg-light"] {
    background-color: var(--bs-secondary-bg) !important;
    border-color: var(--bs-border-color) !important;
    color: var(--bs-body-color) !important;
}

html[data-bs-theme="light"] .card,
html[data-bs-theme="light"] .modal-content,
html[data-bs-theme="light"] .dropdown-menu {
    color: var(--bs-body-color) !important;
}

html[data-menu-color="light"] {
    --bs-main-nav-bg: var(--app-sidebar-bg);
    --bs-main-nav-item-color: var(--app-sidebar-item);
    --bs-main-nav-border-color: var(--app-sidebar-border);
    --bs-main-nav-item-hover-bg: var(--app-sidebar-item-hover-bg);
    --bs-main-nav-item-hover-color: var(--app-sidebar-item-hover-color);
}

html[data-menu-color="dark"],
html[data-bs-theme="dark"][data-menu-color="light"] {
    --bs-main-nav-bg: var(--app-sidebar-bg);
    --bs-main-nav-item-color: var(--app-sidebar-item);
    --bs-main-nav-border-color: var(--app-sidebar-border);
    --bs-main-nav-item-hover-bg: var(--app-sidebar-item-hover-bg);
    --bs-main-nav-item-hover-color: var(--app-sidebar-item-hover-color);
}

html[data-topbar-color="light"],
html[data-topbar-color="dark"],
html[data-bs-theme="dark"][data-topbar-color="light"] {
    --bs-topbar-bg: var(--app-topbar-bg);
    --bs-topbar-item-color: rgba(15, 23, 42, 0.92);
    --bs-topbar-search-bg: rgba(15, 23, 42, 0.06);
}

.topbar {
    background: var(--bs-topbar-bg) !important;
    border-bottom: 1px solid var(--app-topbar-border);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.topbar .topbar-button,
.topbar .button-toggle-menu {
    color: var(--bs-topbar-item-color) !important;
}

.topbar .topbar-item .topbar-button.show,
.topbar .topbar-item .topbar-button.active,
.topbar .topbar-item .topbar-button:active,
.topbar .topbar-item .topbar-button:hover {
    color: var(--bs-topbar-item-color) !important;
}

html[data-bs-theme="dark"] {
    --app-topbar-bg: rgba(17, 24, 39, 0.78);
    --app-topbar-border: rgba(255, 255, 255, 0.10);
}

html[data-bs-theme="dark"][data-topbar-color="light"],
html[data-bs-theme="dark"][data-topbar-color="dark"] {
    --bs-topbar-item-color: rgba(255, 255, 255, 0.92);
    --bs-topbar-search-bg: rgba(255, 255, 255, 0.08);
}

.card,
.modal-content,
.dropdown-menu,
.offcanvas,
.toast {
    border-radius: var(--app-radius-lg);
}

.btn {
    border-radius: var(--app-radius-sm);
}

/* ========== ELIMINACIÓN GLOBAL DE SOMBRAS ========== */

/* Eliminar TODAS las sombras de elementos internos */
* {
    -moz-box-shadow: none !important;
    -webkit-text-shadow: none !important;
    -moz-text-shadow: none !important;
}

/* ========== CONTENEDORES PRINCIPALES - MANTENER SOMBRAS ========== */

/* Restaurar sombras SOLO en contenedores de primer nivel */
.card:not(.card .card):not(.modal .card):not(.dropdown .card):not(.popover .card):not(.tooltip .card),
.modal-content,
.dropdown-menu,

/* ========== ELIMINACIÓN GLOBAL DE SOMBRAS ========== */

/* Eliminar TODAS las sombras de elementos internos */
* {
    -moz-box-shadow: none !important;
    -webkit-text-shadow: none !important;
    -moz-text-shadow: none !important;
}