/**
 * Joicy Nails VIP Academy - Sistema de Temas Minimalista de Alto Contraste
 * Dorado más cálido y luminoso (#D4AF37 / #F3D068) con textos nítidos y legibles
 */

:root, [data-theme="dark"] {
    --bg-main: #0B0B0D;
    --bg-card: #141417;
    --bg-card-hover: #1C1C21;
    --bg-input: #19191D;
    --bg-sidebar: #0F0F12;
    --bg-glass: rgba(20, 20, 23, 0.88);

    /* Bordes limpios */
    --border-color: rgba(255, 255, 255, 0.1);
    --border-color-strong: rgba(212, 175, 55, 0.45);
    --border-subtle: rgba(255, 255, 255, 0.07);

    /* Dorado Vibrante & Elegante */
    --gold-primary: #D4AF37;
    --gold-light: #F3D068;
    --gold-dark: #B38E22;
    --gold-soft: rgba(212, 175, 55, 0.14);
    --gold-gradient: linear-gradient(135deg, #D4AF37 0%, #F5D76E 50%, #C99E28 100%);
    --gold-glow: 0 4px 18px rgba(212, 175, 55, 0.22);

    /* Textos con Alta Legibilidad y Contraste (WCAG AAA) */
    --text-primary: #FFFFFF;
    --text-secondary: #E2E8F0;
    --text-muted: #94A3B8;
    --text-dark: #0B0B0D;

    /* Estados */
    --color-success: #10B981;
    --color-danger: #EF4444;
    --color-warning: #F59E0B;
    --color-info: #38BDF8;

    --navbar-bg: rgba(11, 11, 13, 0.9);
}

[data-theme="light"] {
    --bg-main: #F1F5F9;
    --bg-card: #FFFFFF;
    --bg-card-hover: #F8FAFC;
    --bg-input: #FFFFFF;
    --bg-sidebar: #FFFFFF;
    --bg-glass: rgba(255, 255, 255, 0.94);

    --border-color: #E2E8F0;
    --border-color-strong: rgba(196, 152, 38, 0.55);
    --border-subtle: #EDF2F7;

    --gold-primary: #B48C20;
    --gold-light: #D4AF37;
    --gold-dark: #8F6B12;
    --gold-soft: rgba(180, 140, 32, 0.12);
    --gold-gradient: linear-gradient(135deg, #B48C20 0%, #D4AF37 50%, #8F6B12 100%);
    --gold-glow: 0 4px 15px rgba(180, 140, 32, 0.16);

    /* Textos Oscuros de Alto Contraste en Modo Claro */
    --text-primary: #0F172A;
    --text-secondary: #334155;
    --text-muted: #64748B;
    --text-dark: #FFFFFF;

    --navbar-bg: rgba(255, 255, 255, 0.95);
}

/* ============================================================
   PALETAS DE COLOR DE ACENTO PERSONALIZABLES (VIP)
   Dorado, Fucsia Glam, Blanco Clásico, Púrpura Real, Azul Zafiro
   ============================================================ */

/* 1. FUCSIA GLAM */
[data-color="fuchsia"],
[data-theme="dark"][data-color="fuchsia"] {
    --gold-primary: #E11D48;
    --gold-light: #FB7185;
    --gold-dark: #BE123C;
    --gold-soft: rgba(225, 29, 72, 0.18);
    --gold-gradient: linear-gradient(135deg, #E11D48 0%, #F43F5E 50%, #BE123C 100%);
    --gold-glow: 0 4px 20px rgba(225, 29, 72, 0.32);
    --border-color-strong: rgba(225, 29, 72, 0.55);
}
[data-theme="light"][data-color="fuchsia"] {
    --gold-primary: #BE123C;
    --gold-light: #E11D48;
    --gold-dark: #9F1239;
    --gold-soft: rgba(190, 18, 60, 0.12);
    --gold-gradient: linear-gradient(135deg, #BE123C 0%, #E11D48 50%, #9F1239 100%);
    --gold-glow: 0 4px 15px rgba(190, 18, 60, 0.2);
    --border-color-strong: rgba(190, 18, 60, 0.45);
}

/* 2. BLANCO CLÁSICO / PLATA MINIMALISTA */
[data-color="classic"],
[data-theme="dark"][data-color="classic"] {
    --gold-primary: #F1F5F9;
    --gold-light: #FFFFFF;
    --gold-dark: #94A3B8;
    --gold-soft: rgba(255, 255, 255, 0.16);
    --gold-gradient: linear-gradient(135deg, #CBD5E1 0%, #FFFFFF 50%, #94A3B8 100%);
    --gold-glow: 0 4px 18px rgba(255, 255, 255, 0.25);
    --border-color-strong: rgba(255, 255, 255, 0.5);
}
[data-theme="light"][data-color="classic"] {
    --gold-primary: #334155;
    --gold-light: #475569;
    --gold-dark: #1E293B;
    --gold-soft: rgba(51, 65, 85, 0.12);
    --gold-gradient: linear-gradient(135deg, #334155 0%, #475569 50%, #1E293B 100%);
    --gold-glow: 0 4px 15px rgba(51, 65, 85, 0.18);
    --border-color-strong: rgba(51, 65, 85, 0.4);
}

/* 3. PÚRPURA REAL */
[data-color="purple"],
[data-theme="dark"][data-color="purple"] {
    --gold-primary: #8B5CF6;
    --gold-light: #C084FC;
    --gold-dark: #6D28D9;
    --gold-soft: rgba(139, 92, 246, 0.18);
    --gold-gradient: linear-gradient(135deg, #8B5CF6 0%, #A855F7 50%, #6D28D9 100%);
    --gold-glow: 0 4px 20px rgba(139, 92, 246, 0.32);
    --border-color-strong: rgba(139, 92, 246, 0.55);
}
[data-theme="light"][data-color="purple"] {
    --gold-primary: #6D28D9;
    --gold-light: #8B5CF6;
    --gold-dark: #5B21B6;
    --gold-soft: rgba(109, 40, 217, 0.12);
    --gold-gradient: linear-gradient(135deg, #6D28D9 0%, #8B5CF6 50%, #5B21B6 100%);
    --gold-glow: 0 4px 15px rgba(109, 40, 217, 0.2);
    --border-color-strong: rgba(109, 40, 217, 0.45);
}

/* 4. AZUL ZAFIRO */
[data-color="blue"],
[data-theme="dark"][data-color="blue"] {
    --gold-primary: #0EA5E9;
    --gold-light: #38BDF8;
    --gold-dark: #0284C7;
    --gold-soft: rgba(14, 165, 233, 0.18);
    --gold-gradient: linear-gradient(135deg, #0EA5E9 0%, #38BDF8 50%, #0369A1 100%);
    --gold-glow: 0 4px 20px rgba(14, 165, 233, 0.32);
    --border-color-strong: rgba(14, 165, 233, 0.55);
}
[data-theme="light"][data-color="blue"] {
    --gold-primary: #0284C7;
    --gold-light: #0EA5E9;
    --gold-dark: #0369A1;
    --gold-soft: rgba(2, 132, 199, 0.12);
    --gold-gradient: linear-gradient(135deg, #0284C7 0%, #0EA5E9 50%, #0369A1 100%);
    --gold-glow: 0 4px 15px rgba(2, 132, 199, 0.2);
    --border-color-strong: rgba(2, 132, 199, 0.45);
}

/* ============================================================
   SINCRONIZACIÓN DE PALETAS CON BOOTSTRAP Y COMPONENTES
   Garantiza que .text-warning, .border-warning, .btn-outline-warning,
   .bg-warning, .btn-gold, badges y tabs adopten el color seleccionado
   ============================================================ */

/* Variables Bootstrap warning asociadas a cada color */
[data-color="fuchsia"] {
    --bs-warning: #E11D48;
    --bs-warning-rgb: 225, 29, 72;
}
[data-color="classic"] {
    --bs-warning: #CBD5E1;
    --bs-warning-rgb: 203, 213, 225;
}
[data-color="purple"] {
    --bs-warning: #8B5CF6;
    --bs-warning-rgb: 139, 92, 246;
}
[data-color="blue"] {
    --bs-warning: #0EA5E9;
    --bs-warning-rgb: 14, 165, 233;
}
[data-color="gold"] {
    --bs-warning: #D4AF37;
    --bs-warning-rgb: 212, 175, 55;
}

/* Forzar en todos los elementos temáticos cuando data-color está activo */
[data-color]:not([data-color="gold"]) .text-warning,
[data-color] .text-gold-light,
[data-color] .text-gold-primary,
[data-color] .text-gold-gradient {
    color: var(--gold-light) !important;
}

[data-color]:not([data-color="gold"]) .border-warning,
[data-color] .border-gold {
    border-color: var(--gold-primary) !important;
}

[data-color]:not([data-color="gold"]) .bg-warning {
    background-color: var(--gold-primary) !important;
    color: #FFFFFF !important;
}

[data-color]:not([data-color="gold"]) .btn-outline-warning {
    color: var(--gold-light) !important;
    border-color: var(--gold-primary) !important;
}

[data-color]:not([data-color="gold"]) .btn-outline-warning:hover,
[data-color]:not([data-color="gold"]) .btn-outline-warning:focus,
[data-color]:not([data-color="gold"]) .btn-outline-warning:active {
    background-color: var(--gold-primary) !important;
    border-color: var(--gold-primary) !important;
    color: #FFFFFF !important;
}

[data-color] .btn-gold {
    background: var(--gold-gradient) !important;
    box-shadow: var(--gold-glow) !important;
}
[data-color="fuchsia"] .btn-gold,
[data-color="purple"] .btn-gold,
[data-color="blue"] .btn-gold {
    color: #FFFFFF !important;
}
[data-color="gold"] .btn-gold,
[data-color="classic"] .btn-gold {
    color: #0B0B0D !important;
}

[data-color] .btn-outline-gold {
    border-color: var(--gold-primary) !important;
    color: var(--gold-light) !important;
}
[data-color] .btn-outline-gold:hover {
    background-color: var(--gold-soft) !important;
    border-color: var(--gold-light) !important;
}

[data-color] .provider-card-select.active {
    border-color: var(--gold-primary) !important;
    background: var(--gold-soft) !important;
    box-shadow: var(--gold-glow) !important;
}

[data-color] .form-control-vip:focus,
[data-color] .form-select-vip:focus {
    border-color: var(--gold-primary) !important;
    box-shadow: 0 0 0 3px var(--gold-soft) !important;
}

[data-color] .sidebar-link.active i,
[data-color] .sidebar-link:hover i {
    color: var(--gold-primary) !important;
}

[data-color] .nav-tabs-vip .nav-link.active {
    color: var(--gold-primary) !important;
    border-bottom-color: var(--gold-primary) !important;
}

[data-color] .badge-vip {
    border-color: var(--gold-primary) !important;
    color: var(--gold-light) !important;
    background: var(--gold-soft) !important;
}

[data-color] .color-palette-card.active-palette {
    border-color: var(--gold-primary) !important;
    box-shadow: var(--gold-glow) !important;
}

/* ============================================================
   REGLAS ESPECÍFICAS PARA MODO CLARO EN PANELES (ADMIN & ALUMNA)
   Garantiza que todas las letras, títulos y tablas se lean nítidas
   ============================================================ */
[data-theme="light"] body {
    background-color: var(--bg-main) !important;
    color: var(--text-primary) !important;
}

[data-theme="light"] .app-wrapper {
    background-color: var(--bg-main) !important;
    color: var(--text-primary) !important;
}

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

/* Encabezados y Tipografía en Modo Claro */
[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: #0F172A !important;
}

[data-theme="light"] p {
    color: #334155;
}

/* Anular la clase text-white de Bootstrap en Modo Claro */
[data-theme="light"] .text-white {
    color: #0F172A !important;
}

[data-theme="light"] .text-secondary {
    color: #475569 !important;
}

[data-theme="light"] .text-muted {
    color: #64748B !important;
}

/* Fondos oscuros convertidos a claros en Modo Claro */
[data-theme="light"] .bg-dark {
    background-color: #FFFFFF !important;
    color: #0F172A !important;
}

[data-theme="light"] .bg-black {
    background-color: #F8FAFC !important;
    color: #0F172A !important;
}

[data-theme="light"] .border-secondary,
[data-theme="light"] .border-dark {
    border-color: #E2E8F0 !important;
}

/* Sidebar & Topbar en Modo Claro */
[data-theme="light"] .app-sidebar {
    background-color: #FFFFFF !important;
    border-right: 1px solid #E2E8F0 !important;
}

[data-theme="light"] .sidebar-header {
    border-bottom: 1px solid #E2E8F0 !important;
}

[data-theme="light"] .sidebar-footer {
    border-top: 1px solid #E2E8F0 !important;
}

[data-theme="light"] .sidebar-link {
    color: #334155 !important;
}

[data-theme="light"] .sidebar-link i {
    color: #64748B !important;
}

[data-theme="light"] .sidebar-link:hover {
    background-color: #F1F5F9 !important;
    color: #0F172A !important;
}

[data-theme="light"] .sidebar-link:hover i {
    color: var(--gold-primary) !important;
}

[data-theme="light"] .sidebar-link.active {
    background-color: rgba(180, 140, 32, 0.12) !important;
    color: var(--gold-dark) !important;
    border: 1px solid rgba(180, 140, 32, 0.3) !important;
    font-weight: 600;
}

[data-theme="light"] .sidebar-link.active i {
    color: var(--gold-dark) !important;
}

[data-theme="light"] .app-topbar {
    background-color: #FFFFFF !important;
    border-bottom: 1px solid #E2E8F0 !important;
}

[data-theme="light"] .app-topbar h4 {
    color: #0F172A !important;
}

/* Tarjetas VIP & Stat Cards en Modo Claro */
[data-theme="light"] .card-vip {
    background-color: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
    color: #0F172A !important;
}

[data-theme="light"] .card-vip:hover {
    border-color: rgba(180, 140, 32, 0.45) !important;
    box-shadow: 0 4px 16px rgba(180, 140, 32, 0.08) !important;
}

[data-theme="light"] .card {
    background-color: #FFFFFF !important;
    border-color: #E2E8F0 !important;
    color: #0F172A !important;
}

[data-theme="light"] .stat-card {
    background-color: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03) !important;
}

[data-theme="light"] .stat-card:hover {
    border-color: rgba(180, 140, 32, 0.45) !important;
}

[data-theme="light"] .stat-card .stat-icon {
    background: rgba(180, 140, 32, 0.1) !important;
    color: var(--gold-dark) !important;
}

[data-theme="light"] .stat-card .stat-number {
    color: #0F172A !important;
}

[data-theme="light"] .stat-card .stat-label {
    color: #64748B !important;
}

/* Formularios & Controles en Modo Claro */
[data-theme="light"] .form-label {
    color: #1E293B !important;
    font-weight: 600;
}

[data-theme="light"] .form-check-label {
    color: #1E293B !important;
}

[data-theme="light"] .form-control-vip, 
[data-theme="light"] .form-select-vip,
[data-theme="light"] .form-control,
[data-theme="light"] .form-select {
    background-color: #FFFFFF !important;
    border: 1px solid #CBD5E1 !important;
    color: #0F172A !important;
}

[data-theme="light"] .form-control-vip:focus, 
[data-theme="light"] .form-select-vip:focus,
[data-theme="light"] .form-control:focus,
[data-theme="light"] .form-select:focus {
    background-color: #FFFFFF !important;
    border-color: var(--gold-primary) !important;
    color: #0F172A !important;
    box-shadow: 0 0 0 3px rgba(180, 140, 32, 0.2) !important;
}

[data-theme="light"] .form-control-vip::placeholder,
[data-theme="light"] .form-control::placeholder {
    color: #94A3B8 !important;
}

[data-theme="light"] .form-control-vip:disabled,
[data-theme="light"] .form-control-vip[readonly],
[data-theme="light"] .form-control:disabled.form-control-vip,
[data-theme="light"] .form-control[readonly].form-control-vip {
    background-color: #F1F5F9 !important;
    border-color: #CBD5E1 !important;
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

[data-theme="light"] .input-group-text-vip {
    background-color: #F8FAFC !important;
    border: 1px solid #CBD5E1 !important;
    border-right: none !important;
    color: var(--gold-dark) !important;
}

/* Tablas & DataTables en Modo Claro */
[data-theme="light"] .table,
[data-theme="light"] .table-dark {
    --bs-table-bg: transparent !important;
    --bs-table-color: #0F172A !important;
    --bs-table-striped-bg: #F8FAFC !important;
    --bs-table-striped-color: #0F172A !important;
    --bs-table-hover-bg: #F1F5F9 !important;
    --bs-table-hover-color: #0F172A !important;
    --bs-table-border-color: #E2E8F0 !important;
    color: #0F172A !important;
    background-color: #FFFFFF !important;
}

[data-theme="light"] .table th,
[data-theme="light"] .table td {
    color: #0F172A !important;
    border-color: #E2E8F0 !important;
    background-color: transparent !important;
}

[data-theme="light"] .table thead th {
    background-color: #F8FAFC !important;
    color: #0F172A !important;
    font-weight: 600;
    border-bottom: 2px solid #CBD5E1 !important;
}

[data-theme="light"] .table tbody tr:hover td {
    background-color: #F8FAFC !important;
}

[data-theme="light"] .dataTables_wrapper .dataTables_length,
[data-theme="light"] .dataTables_wrapper .dataTables_filter,
[data-theme="light"] .dataTables_wrapper .dataTables_info,
[data-theme="light"] .dataTables_wrapper .dataTables_paginate {
    color: #334155 !important;
}

[data-theme="light"] .dataTables_wrapper .dataTables_filter input {
    background: #FFFFFF !important;
    border: 1px solid #CBD5E1 !important;
    color: #0F172A !important;
    border-radius: 6px;
    padding: 4px 8px;
}

[data-theme="light"] .page-link {
    background-color: #FFFFFF !important;
    border-color: #CBD5E1 !important;
    color: #334155 !important;
}

[data-theme="light"] .page-item.active .page-link {
    background-color: var(--gold-primary) !important;
    border-color: var(--gold-primary) !important;
    color: #0B0B0D !important;
}

/* Modales en Modo Claro */
[data-theme="light"] .modal-content {
    background-color: #FFFFFF !important;
    border: 1px solid #CBD5E1 !important;
    color: #0F172A !important;
}

[data-theme="light"] .modal-header,
[data-theme="light"] .modal-footer {
    border-color: #E2E8F0 !important;
}

[data-theme="light"] .modal-title {
    color: #0F172A !important;
}

[data-theme="light"] .btn-close {
    filter: none !important;
}

/* Pestañas de Navegación */
[data-theme="light"] .nav-tabs-vip {
    border-bottom: 1px solid #E2E8F0 !important;
}

[data-theme="light"] .nav-tabs-vip .nav-link {
    color: #64748B !important;
}

[data-theme="light"] .nav-tabs-vip .nav-link:hover {
    color: #0F172A !important;
}

[data-theme="light"] .nav-tabs-vip .nav-link.active {
    color: var(--gold-dark) !important;
    border-bottom: 2px solid var(--gold-dark) !important;
}

/* Botón de Alternar Tema */
[data-theme="light"] .btn-theme-toggle {
    border-color: #CBD5E1 !important;
    color: #334155 !important;
    background: #FFFFFF !important;
}

[data-theme="light"] .btn-theme-toggle:hover {
    border-color: var(--gold-primary) !important;
    color: var(--gold-dark) !important;
}

/* Preservar botones y badges con sus colores correctos */
[data-theme="light"] .btn-gold {
    background: var(--gold-gradient) !important;
    color: #0B0B0D !important;
    border: none !important;
}

[data-theme="light"] .btn-gold * {
    color: #0B0B0D !important;
}

[data-theme="light"] .badge.bg-primary,
[data-theme="light"] .badge.bg-danger,
[data-theme="light"] .badge.bg-success,
[data-theme="light"] .badge.bg-info {
    color: #FFFFFF !important;
}

[data-theme="light"] .badge.bg-warning {
    color: #0B0B0D !important;
}

[data-theme="light"] .badge.bg-dark {
    background-color: #E2E8F0 !important;
    color: #0F172A !important;
}

[data-theme="light"] .badge.bg-secondary {
    background-color: #E2E8F0 !important;
    color: #334155 !important;
}

/* Chatbot en Modo Claro (Pantalla completa y flotante) */
[data-theme="light"] .joicy-chat-window {
    background: #FFFFFF !important;
    border: 1px solid #CBD5E1 !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15) !important;
}

[data-theme="light"] .chat-window-header {
    background: #FFFFFF !important;
    border-bottom: 1px solid #E2E8F0 !important;
}

[data-theme="light"] .chat-header-title {
    color: #0F172A !important;
}

[data-theme="light"] .chat-messages-container {
    background: #F8FAFC !important;
}

[data-theme="light"] .chat-msg.assistant .msg-bubble {
    background: #FFFFFF !important;
    color: #0F172A !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .chat-quick-suggestions {
    background: #FFFFFF !important;
    border-top: 1px solid #E2E8F0 !important;
}

[data-theme="light"] .btn-suggestion {
    background: #F1F5F9 !important;
    border: 1px solid #CBD5E1 !important;
    color: #334155 !important;
}

[data-theme="light"] .btn-suggestion:hover {
    background: var(--gold-soft) !important;
    border-color: var(--gold-primary) !important;
    color: var(--gold-dark) !important;
}

[data-theme="light"] .chat-input-area {
    background: #FFFFFF !important;
    border-top: 1px solid #E2E8F0 !important;
}

[data-theme="light"] .chat-input-field {
    background: #F8FAFC !important;
    border: 1px solid #CBD5E1 !important;
    color: #0F172A !important;
}

[data-theme="light"] .chat-input-field:focus {
    background: #FFFFFF !important;
    color: #0F172A !important;
    border-color: var(--gold-primary) !important;
}

/* Chatbot de Alumna en Pantalla Completa (alumna/chatbot.php) */
[data-theme="light"] #mainChatContainer {
    background: #F8FAFC !important;
}

[data-theme="light"] #mainChatContainer .chat-msg.assistant .msg-bubble {
    background: #FFFFFF !important;
    color: #0F172A !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

[data-theme="light"] #searchHistory {
    background: #F8FAFC !important;
    color: #0F172A !important;
    border: 1px solid #CBD5E1 !important;
}

/* FullCalendar en Modo Claro */
[data-theme="light"] .fc {
    color: #0F172A !important;
}

[data-theme="light"] .fc th,
[data-theme="light"] .fc td {
    border-color: #E2E8F0 !important;
}

[data-theme="light"] .fc-col-header-cell {
    background-color: #F8FAFC !important;
    color: #1E293B !important;
}

[data-theme="light"] .fc-daygrid-day-number {
    color: #334155 !important;
}

[data-theme="light"] .fc-toolbar-title {
    color: #0F172A !important;
}

[data-theme="light"] .fc-button {
    background-color: #FFFFFF !important;
    border-color: #CBD5E1 !important;
    color: #334155 !important;
}

[data-theme="light"] .fc-button-active {
    background-color: var(--gold-primary) !important;
    border-color: var(--gold-primary) !important;
    color: #0B0B0D !important;
}