/**
 * 🎨 Variables CSS y Temas
 * Define todos los colores, tamaños y variables del tema
 */

:root {
    /* Colores primarios */
    --primary-color: #BE00FF;
    --primary-dark: #9900CC;
    --orange-color: #FA6400; /* PANTONE Bright Orange C */
    --success-color: #10b981;
    --danger-color: #ef4444;
    --warning-color: #f59e0b;
    --secondary-color: #6b7280;
    
    /* Colores de fondo */
    --background: #f9fafb;
    --card-bg: #ffffff;
    --sidebar-bg: #ffffff;
    
    /* Bordes y líneas */
    --border-color: #E6E6E6;
    --border-radius: 12px;
    --border-radius-sm: 8px;
    
    /* Texto */
    --text-primary: #111827;
    --text-secondary: #6b7280;
    --text-muted: #9ca3af;
    
    /* Tipografía Corporativa */
    --font-heading: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, Arial, sans-serif;
    --font-body: 'Manrope', -apple-system, BlinkMacSystemFont, Arial, sans-serif;
    
    /* Sombras */
    --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    
    /* Espaciado */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 0.875rem;
    --spacing-lg: 1.25rem;
    --spacing-xl: 1.75rem;
    --spacing-xxl: 2.5rem;
    
    /* Transiciones */
    --transition-fast: 0.15s ease-in-out;
    --transition-normal: 0.3s ease-in-out;
    --transition-slow: 0.5s ease-in-out;
    
    /* Z-index layers */
    --z-sidebar: 1000;
    --z-modal: 2000;
    --z-notification: 3000;
    --z-tooltip: 4000;
}