/* 
   ======================================================================================
   SIGGOT THEME SYSTEM (NATIVE DARK/LIGHT MODE)
   ======================================================================================
*/

:root {
    /* MODO CLARO (Default) */
    --primary-midnight: #f8fafc;
    --primary-glow: #3b82f6;
    --primary-glow-rgb: 59, 130, 246;
    --accent-emerald: #10b981;
    --accent-indigo: #6366f1;
    --text-main: #0f172a;
    --text-muted: #64748b;
    --glass-bg: rgba(255, 255, 255, 0.75);
    --glass-border: rgba(226, 232, 240, 0.8);
    --card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
    --transition-ultra: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* Background Elements */
    --bg-mesh-1: rgba(59, 130, 246, 0.05);
    --bg-mesh-2: rgba(99, 102, 241, 0.05);
    --bg-mesh-main: #f1f5f9;
    --bg-shimmer-secondary: #f8fafc;

    /* Navbar & Header */
    --nav-bg: rgba(248, 250, 252, 0.82);
    --nav-text: #475569;
    --nav-active: #0f172a;
    
    /* Input & Selects */
    --input-bg: #ffffff;
    --input-border: #e2e8f0;
    --input-text: #0f172a;
    --select-arrow: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23475569' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");

    /* Status & Alerts Light */
    --status-free-bg: rgba(34, 197, 94, 0.1);
    --status-busy-bg: rgba(239, 68, 68, 0.1);
    --status-expired-bg: rgba(249, 115, 22, 0.1);
    
    /* Calendar Filter Light */
    --calendar-filter: invert(0.4);
}

[data-theme='dark'] {
    /* MODO OSCURO */
    --primary-midnight: #020617;
    --primary-glow: #3b82f6;
    --primary-glow-rgb: 59, 130, 246;
    --accent-emerald: #10b981;
    --accent-indigo: #6366f1;
    --text-main: #f8fafc;
    --text-muted: #94a3b8;
    --glass-bg: rgba(15, 23, 42, 0.6);
    --glass-border: rgba(255, 255, 255, 0.05);
    --card-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
    
    /* Background Elements */
    --bg-mesh-1: rgba(59, 130, 246, 0.15);
    --bg-mesh-2: rgba(99, 102, 241, 0.15);
    --bg-mesh-main: #020617;
    --bg-shimmer-secondary: #020617;

    /* Navbar & Header */
    --nav-bg: rgba(15, 23, 42, 0.8);
    --nav-text: #94a3b8;
    --nav-active: #ffffff;

    /* Input & Selects */
    --input-bg: rgba(30, 41, 59, 0.5);
    --input-border: rgba(255, 255, 255, 0.1);
    --input-text: #ffffff;
    --select-arrow: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");

    /* Status & Alerts Dark */
    --status-free-bg: rgba(34, 197, 94, 0.15);
    --status-busy-bg: rgba(239, 68, 68, 0.15);
    --status-expired-bg: rgba(249, 115, 22, 0.15);

    /* Calendar Filter Dark */
    --calendar-filter: invert(1);
}

.theme-toggle-btn {
    transition: var(--transition-ultra);
    background: transparent;
}

.theme-toggle-btn:hover {
    background: var(--glass-border) !important;
    transform: scale(1.1);
}

/* --- GLOBAL TEXT OVERRIDES (CORRECCIÓN MODO CLARO) --- */
/* Aumentamos la especificidad con 'html' para ganar a los estilos de módulos */
html body, 
html p, 
html span, 
html b, 
html strong, 
html label, 
html h1, html h2, html h3, html h4, html h5, html h6,
html .text-body, 
html .text-dark, 
html .text-secondary,
html i.fas, html i.far, html i.fab, html i.fa-solid, html i.fa-regular,
html td, html th, html li, html option, html div:not(.not-theme),
html a, html input, html select, html textarea,
html .card *, 
html .premium-card *, 
html .modal-content * {
    color: var(--text-main) !important;
    transition: color 0.3s ease;
}

body {
    background-color: var(--bg-mesh-main) !important;
    transition: background-color 0.4s ease;
}

/* Global Dashboard Shimmer Override */
.dashboard-bg-shimmer {
    background:
        radial-gradient(circle at 0% 0%, var(--bg-mesh-1) 0%, transparent 50%),
        radial-gradient(circle at 100% 100%, var(--bg-mesh-2) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, var(--bg-mesh-main) 0%, var(--bg-shimmer-secondary) 100%) !important;
}

/* Excepciones Críticas: NO sobreescribir colores con significado */
html .text-success, html .text-success *,
html .alert-success, html .alert-success *,
html .bg-success *,
html .status-exists { color: var(--accent-emerald) !important; }

html .text-danger, html .text-danger *,
html .alert-danger, html .alert-danger *,
html .bg-danger *,
html .status-not-exists { color: #ef4444 !important; }

html .text-warning, html .text-warning *,
html .alert-warning, html .alert-warning *,
html .bg-warning * { color: #f59e0b !important; }

html .text-info, html .text-info *,
html .alert-info, html .alert-info *,
html .bg-info * { color: #3b82f6 !important; }

html .text-muted, html .text-muted * { color: var(--text-muted) !important; }

/* Botones y elementos que SIEMPRE deben ser blancos (sobre fondos oscuros forzados) */
html .btn-primary, html .btn-primary *,
html .btn-success, html .btn-success *,
html .btn-danger, html .btn-danger *,
html .btn-info, html .btn-info *,
html .bg-dark .text-white, html .bg-primary .text-white,
html .bg-danger .text-white, html .bg-success .text-white { 
    color: #ffffff !important; 
}

/* En modo claro, .text-white y .text-light deben ser oscuros para ser visibles, 
   A MENOS que estén dentro de un contenedor con fondo oscuro (como los de arriba) */
html:not([data-theme="dark"]) .text-white, 
html:not([data-theme="dark"]) .text-light {
    color: var(--text-main) !important;
}

/* Fallback Global Styles for non-refactored modules */
.card, .premium-card, .glass-premium {
    background-color: var(--sig-bg-card) !important;
    backdrop-filter: var(--sig-blur) !important;
    -webkit-backdrop-filter: var(--sig-blur) !important;
    border: 1px solid var(--sig-border) !important;
    border-radius: var(--sig-radius-lg) !important;
    box-shadow: var(--sig-shadow-premium) !important;
    color: var(--sig-text-main) !important;
    transition: var(--sig-transition);
}

.card:hover, .premium-card:hover {
    transform: translateY(-5px);
    border-color: var(--sig-primary-cyan) !important;
}

.btn-primary, .swal2-confirm {
    background: var(--sig-gradient-premium) !important;
    border: none !important;
    border-radius: var(--sig-radius-md) !important;
    font-weight: 600 !important;
    box-shadow: 0 10px 20px -5px rgba(6, 182, 212, 0.3) !important;
    transition: var(--sig-transition) !important;
}

.btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 15px 30px -5px rgba(6, 182, 212, 0.5) !important;
    filter: brightness(1.1);
}

.form-control, .form-select {
    background-color: var(--sig-bg-card) !important;
    border: 1px solid var(--sig-border) !important;
    color: var(--sig-text-main) !important;
    border-radius: var(--sig-radius-md) !important;
}

.form-control:focus, .form-select:focus {
    border-color: var(--sig-primary-cyan) !important;
    box-shadow: 0 0 0 4px rgba(6, 182, 212, 0.15) !important;
}

.table {
    border-color: var(--sig-border) !important;
    color: var(--sig-text-main) !important;
}

.modal-content {
    background-color: var(--sig-bg-main) !important;
    backdrop-filter: var(--sig-blur) !important;
    -webkit-backdrop-filter: var(--sig-blur) !important;
    border: 1px solid var(--sig-border) !important;
    border-radius: var(--sig-radius-xl) !important;
    box-shadow: var(--sig-shadow-premium) !important;
}

/* --- NAVBAR DYNAMISM --- */
html[data-theme="dark"] .siggot-navbar {
    background: var(--nav-bg) !important;
}

html:not([data-theme="dark"]) .siggot-navbar {
    background: #ffffff !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}

/* Forzar colores de items según el tema */
html[data-theme="dark"] .siggot-navbar .nav-link { color: var(--nav-text) !important; }
html[data-theme="dark"] .siggot-navbar .nav-link.active { color: var(--nav-active) !important; }

html:not([data-theme="dark"]) .siggot-navbar .nav-link { color: #475569 !important; }
html:not([data-theme="dark"]) .siggot-navbar .nav-link.active { color: #0f172a !important; }
html:not([data-theme="dark"]) .siggot-navbar .navbar-brand { color: #0f172a !important; }
html[data-theme="dark"] .siggot-navbar .navbar-toggler-icon {
    filter: brightness(0) invert(1) !important;
}

html:not([data-theme="dark"]) .siggot-navbar .navbar-toggler-icon {
    filter: brightness(0) !important;
}

.navbar-toggler:focus, .navbar-toggler:active {
    box-shadow: none !important;
    outline: none !important;
}

.navbar-toggler:hover {
    background: rgba(var(--primary-glow-rgb), 0.1) !important;
}

/* --- DROPDOWN DYNAMISM --- */
.dropdown-menu {
    background-color: var(--bg-mesh-main) !important;
    border: 1px solid var(--glass-border) !important;
    box-shadow: var(--card-shadow) !important;
    backdrop-filter: blur(10px);
}

.dropdown-item {
    color: var(--text-muted) !important;
}

.dropdown-item:hover {
    background-color: rgba(var(--primary-glow-rgb), 0.1) !important;
    color: var(--text-main) !important;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: var(--primary-glow) !important;
    color: #ffffff !important;
}

/* --- DASHBOARD ACTION CARDS FIX --- */
.action-card {
    background: var(--glass-bg) !important;
    border: 1px solid var(--glass-border) !important;
    color: var(--text-main) !important;
    box-shadow: var(--card-shadow) !important;
}

.action-card:hover {
    border-color: var(--primary-glow) !important;
    background: rgba(var(--primary-glow-rgb), 0.05) !important;
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.1) !important;
}

html[data-theme='dark'] .action-card:hover {
    box-shadow: 0 30px 60px -12px rgba(0, 0, 0, 0.5) !important;
}

/* --- EASY AUTOCOMPLETE THEME SYSTEM --- */
.easy-autocomplete {
    width: 100% !important;
    position: relative !important;
}

.easy-autocomplete input {
    color: var(--text-main) !important;
}

.easy-autocomplete-container {
    left: 0;
    top: 100%;
    z-index: 9999 !important;
    position: absolute;
    width: 100%;
}

.easy-autocomplete-container ul {
    background-color: var(--bg-mesh-main) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: 0.75rem !important;
    box-shadow: var(--card-shadow) !important;
    backdrop-filter: blur(15px);
    margin-top: 5px !important;
    padding: 5px 0 !important;
    max-height: 250px !important;
    overflow-y: auto !important;
}

/* For dark theme, give it a bit more punch to the shadow */
html[data-theme='dark'] .easy-autocomplete-container ul {
    background-color: #1e293b !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6) !important;
}

.easy-autocomplete-container ul li {
    background: transparent !important;
    border: none !important;
    color: var(--text-muted) !important;
    padding: 10px 15px !important;
    transition: all 0.2s ease;
    font-size: 0.9rem;
}

.easy-autocomplete-container ul li.selected {
    background-color: var(--primary-glow) !important;
    color: #ffffff !important;
}

.easy-autocomplete-container ul li b {
    color: var(--primary-glow) !important;
    font-weight: 700 !important;
}

.easy-autocomplete-container ul li:hover {
    background-color: rgba(var(--primary-glow-rgb), 0.1) !important;
    color: var(--text-main) !important;
}

.easy-autocomplete-container ul li.selected b,
.easy-autocomplete-container ul li:hover b {
    color: inherit !important;
}

.easy-autocomplete-container ul li div {
    display: block !important;
    color: inherit !important;
}

/* --- EASY-AUTOCOMPLETE + BOOTSTRAP INPUT-GROUP FIX --- */
.input-group>.easy-autocomplete,
.input-group>.easy-autocomplete.eac-square {
    flex: 1 1 auto !important;
    width: 1% !important;
    min-width: 0 !important;
    position: relative !important;
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.easy-autocomplete>input.form-control,
.easy-autocomplete>textarea.form-control,
.easy-autocomplete.eac-square>input.form-control {
    width: 100% !important;
    display: block !important;
    border-radius: 0.75rem !important;
    height: auto !important;
}

.input-group>.easy-autocomplete>input.form-control,
.input-group>.easy-autocomplete>textarea.form-control {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

/* --- SWEETALERT GLOBAL THEME (SA1 & SA2) --- */
.sweet-alert, .swal2-popup {
    background-color: var(--bg-mesh-main) !important;
    border: 1px solid var(--glass-border) !important;
    color: var(--text-main) !important;
    border-radius: 1.5rem !important;
    box-shadow: var(--card-shadow) !important;
    backdrop-filter: blur(20px) !important;
}

/* In dark mode we force a slightly different background for SwAl to pop */
[data-theme='dark'] .sweet-alert, 
[data-theme='dark'] .swal2-popup {
    background-color: #0f172a !important;
}

.sweet-alert h2, .swal2-title,
.sweet-alert p, .swal2-html-container {
    color: var(--text-main) !important;
}

[data-theme='dark'] .swal2-success-circular-line-left,
[data-theme='dark'] .swal2-success-circular-line-right,
[data-theme='dark'] .swal2-success-fix {
    background-color: transparent !important;
}

.sweet-alert button.confirm, .swal2-confirm {
    background-color: var(--primary-glow) !important;
    box-shadow: 0 0 15px rgba(var(--primary-glow-rgb), 0.4) !important;
    border-radius: 0.8rem !important;
}

.sweet-alert button.cancel, .swal2-cancel {
    background-color: var(--glass-border) !important;
    color: var(--text-main) !important;
    border-radius: 0.8rem !important;
}

.sweet-alert .sa-icon.sa-success::before,
.sweet-alert .sa-icon.sa-success::after,
.sweet-alert .sa-icon.sa-success .sa-fix {
    background-color: transparent !important;
}

/* SweetAlert Input Error Fix - Alta especificidad para ganar al tema global */
html body .sweet-alert .sa-input-error {
    display: none !important;
}
html body .sweet-alert .sa-input-error.show {
    display: block !important;
    height: auto !important;
    color: #ef4444 !important; /* Red-500 */
    font-weight: 700 !important;
    margin-top: 10px !important;
    opacity: 1 !important;
}

/* --- TOOLTIP THEME SYSTEM (BOOTSTRAP) --- */
.tooltip {
    z-index: 1080 !important;
}

.tooltip-inner {
    background-color: var(--bg-mesh-main) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--glass-border) !important;
    box-shadow: var(--card-shadow) !important;
    backdrop-filter: blur(10px) saturate(150%);
    padding: 0.6rem 1rem !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    border-radius: 0.75rem !important;
}

/* Fix arrows */
.bs-tooltip-top .tooltip-arrow::before, 
.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before {
    border-top-color: var(--glass-border) !important;
}

.bs-tooltip-bottom .tooltip-arrow::before, 
.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before {
    border-bottom-color: var(--glass-border) !important;
}

.bs-tooltip-start .tooltip-arrow::before, 
.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before {
    border-left-color: var(--glass-border) !important;
}

.bs-tooltip-end .tooltip-arrow::before, 
.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before {
    border-right-color: var(--glass-border) !important;
}
/* --- TRASLUCENT PREMIUM UTILITIES (tp-) --- */
.bg-tp-surface {
    background-color: var(--input-bg) !important;
}
.text-main {
    color: var(--text-main) !important;
}
.text-tp-text-muted {
    color: var(--text-muted) !important;
}
.border-tp-border {
    border-color: var(--glass-border) !important;
}

[data-theme='dark'] .bg-tp-surface {
    background-color: rgba(30, 41, 59, 0.5) !important;
}

/* Forzar estados de inputs en modo oscuro para evitar fondos blancos persistentes */
[data-theme='dark'] select,
[data-theme='dark'] input,
[data-theme='dark'] textarea {
    background-color: var(--input-bg) !important;
    color: var(--text-main) !important;
    border-color: var(--glass-border) !important;
}

[data-theme='dark'] select option {
    background-color: #0f172a !important; /* Fondo oscuro para opciones de select */
    color: #ffffff !important;
}

/* Modales: Ajustar botón de cierre (X) para que sea blanco en modo oscuro */
[data-theme='dark'] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%) !important;
}

.bg-tp-nav {
    background-color: rgba(255, 255, 255, 0.5) !important;
}

[data-theme='dark'] .bg-tp-nav {
    background-color: rgba(2, 6, 23, 0.6) !important;
}
