/**
 * CSS Variables Centralizadas - Marhoani
 * 
 * JERARQUÍA DE CARGA:
 * 1. Este archivo (variables raíz)
 * 2. daisyui-colors.css (aplica temas)
 * 3. style.css (componentes personalizados)
 * 
 * NO USAR !important aquí - confiar en especificidad natural
 */

:root {
    /* ========================================================================
       PALETA DE COLORES - ACTUALIZADA Y OPTIMIZADA
       ======================================================================== */
    
    /* Colores Primarios (Azul) - En HSL para DaisyUI */
    --p: 223 64% 38%;
    --pc: 0 0% 100%;
    --pf: 217 92% 60%;
    --color-primary: #1E3A8A;
    --color-primary-dark: #142864;
    --color-primary-light: #3B82F6;
    --color-primary-50: #F8FAFF;
    
    /* Colores Secundarios (Naranja) - Paleta del usuario - En HSL para DaisyUI */
    --s: 24 97% 53%;
    --sc: 0 0% 100%;
    --sf: 24 96% 58%;
    --color-secondary: #F97316;
    --color-secondary-dark: #EA580C;
    --color-secondary-light: #FDBA74;
    --color-secondary-50: #FFF7ED;
    
    /* Colores Accent (Verde) - Paleta del usuario - En HSL para DaisyUI */
    --a: 161 72% 35%;
    --ac: 0 0% 100%;
    --af: 166 82% 45%;
    --color-accent: #10B981;
    --color-accent-dark: #059669;
    --color-accent-light: #6EE7B7;
    --color-accent-50: #F0FDF4;
    
    /* Colores Complementarios (Púrpura) - Armonizado */
    --color-tertiary: #A855F7;
    --color-tertiary-dark: #7E22CE;
    --color-tertiary-light: #C4B5FD;
    --color-tertiary-50: #FAF5FF;
    
    /* Colores Neutrales */
    --color-dark: #0F172A;
    --color-gray: #6B7280;
    --color-gray-light: #E5E7EB;
    --color-light: #FFFFFF;
    
    /* Colores Semánticos */
    --color-success: #10B981;
    --color-warning: #F97316;
    --color-error: #EF4444;
    --color-info: #3B82F6;
    
    /* ========================================================================
       COLORES EN RGB (para DaisyUI y rgba)
       ======================================================================== */
    
    --color-primary-rgb: 30 58 138;
    --color-primary-dark-rgb: 20 40 100;
    --color-primary-light-rgb: 59 130 246;
    
    --color-secondary-rgb: 249 115 22;
    --color-secondary-dark-rgb: 234 88 12;
    --color-secondary-light-rgb: 253 186 116;
    
    --color-accent-rgb: 16 185 129;
    --color-accent-dark-rgb: 5 150 105;
    --color-accent-light-rgb: 110 231 183;
    
    --color-dark-rgb: 15 23 42;
    --color-gray-rgb: 107 114 128;
    --color-light-rgb: 255 255 255;
    
    /* ========================================================================
       TIPOGRAFÍA
       ======================================================================== */
    
    --font-family-base: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-black: 900;
    
    /* ESCALA DE TAMAÑOS DE FUENTE */
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-size-4xl: 2.25rem;
    --font-size-5xl: 3rem;
    --font-size-6xl: 3.75rem;
    --font-size-7xl: 4.5rem;
    
    --line-height-tight: 1.1;
    --line-height-normal: 1.6;
    --line-height-relaxed: 1.75;
    --line-height-loose: 2.0;
    
    /* ========================================================================
       ESPACIADO Y TAMAÑOS
       ======================================================================== */
    
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-base: 1rem;
    --spacing-md: 1.5rem;
    --spacing-lg: 2rem;
    --spacing-xl: 3rem;
    --spacing-2xl: 4rem;
    --spacing-3xl: 6rem;
    
    /* ========================================================================
       SOMBRAS
       ======================================================================== */
    
    --shadow-none: none;
    --shadow-sm: 0 1px 2px 0 rgba(var(--color-dark-rgb), 0.05);
    --shadow-base: 0 1px 3px 0 rgba(var(--color-dark-rgb), 0.1), 0 1px 2px 0 rgba(var(--color-dark-rgb), 0.06);
    --shadow-md: 0 4px 6px -1px rgba(var(--color-dark-rgb), 0.1), 0 2px 4px -1px rgba(var(--color-dark-rgb), 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(var(--color-dark-rgb), 0.1), 0 4px 6px -2px rgba(var(--color-dark-rgb), 0.05);
    --shadow-xl: 0 20px 25px -5px rgba(var(--color-dark-rgb), 0.1), 0 10px 10px -5px rgba(var(--color-dark-rgb), 0.04);
    --shadow-2xl: 0 25px 50px -12px rgba(var(--color-dark-rgb), 0.25);
    
    /* ========================================================================
       BORDES Y RADIOS
       ======================================================================== */
    
    --border-radius-sm: 0.375rem;
    --border-radius-base: 0.5rem;
    --border-radius-md: 0.75rem;
    --border-radius-lg: 1rem;
    --border-radius-xl: 1.5rem;
    --border-radius-2xl: 2rem;
    --border-radius-full: 999px;
    
    --border-width: 1px;
    --border-width-2: 2px;
    
    /* ========================================================================
       ANIMACIONES Y TRANSICIONES
       ======================================================================== */
    
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 300ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1);
    
    --animation-duration-fast: 0.15s;
    --animation-duration-normal: 0.3s;
    --animation-duration-slow: 0.5s;
    
    --animation-timing-ease-out: cubic-bezier(0.4, 0, 0.2, 1);
    --animation-timing-ease-in: cubic-bezier(0.4, 0, 1, 1);
    --animation-timing-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
    
    /* ========================================================================
       BLUR Y EFECTOS
       ======================================================================== */
    
    --backdrop-blur: 10px;
    --blur-sm: 4px;
    --blur-md: 8px;
    --blur-lg: 16px;
    
    /* ========================================================================
       TEMA CLARO - VALORES POR DEFECTO (tema marhoani)
       ======================================================================== */
    
    --text-primary: var(--color-dark);
    --text-secondary: var(--color-gray);
    --text-tertiary: var(--color-gray-light);
    --text-inverse: var(--color-light);
    
    --bg-primary: var(--color-light);
    --bg-secondary: rgb(248 250 252);
    --bg-tertiary: rgb(241 245 249);
    
    --border-color: rgb(241 245 249);
    --border-color-light: rgb(248 250 252);
    
    /* ========================================================================
       DAISYUI VARIABLES (para compatibilidad directa)
       ======================================================================== */
    
    /* Estas variables ya están definidas arriba en la sección "PALETA DE COLORES"
       No redefinir aquí para evitar sobrescribir valores HSL correctos */
}

/* ========================================================================
   TEMA OSCURO - marhoani-dark
   ======================================================================== */

[data-theme="marhoani-dark"] {
    color-scheme: dark;
    
    /* Colores inversos para tema oscuro */
    --text-primary: var(--color-light);
    --text-secondary: var(--color-gray-light);
    --text-tertiary: var(--color-gray);
    --text-inverse: var(--color-dark);
    
    --bg-primary: #1A1F35;
    --bg-secondary: #242C42;
    --bg-tertiary: #2D3548;
    
    --border-color: #3D4556;
    --border-color-light: #2D3548;
    
    /* Base colors oscuro (se heredan del archivo daisyui-colors.css) */
}

/* ========================================================================
   RESET GLOBAL
   ======================================================================== */

* {
    /* Sin usar !important - reset natural */
    box-sizing: border-box;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-family-base);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
    font-size: var(--font-size-base);
    color: var(--text-primary);
    background-color: var(--bg-primary);
    transition: background-color var(--transition-normal), color var(--transition-normal);
    letter-spacing: -0.01em;
}

/* ========================================================================
   COMPATIBILIDAD - Mapeo de variables antiguas (deprecadas, mantener por ahora)
   ======================================================================== */

:root {
    /* Mapeos para compatibilidad con código existente */
    --primary: var(--color-primary);
    --secondary: var(--color-secondary);
    --accent: var(--color-accent);
    --dark: var(--color-dark);
    --light: var(--color-light);
}