/* ==========================================
   CONFIGURACIÓN DE COLORES POR EVENTO
   ========================================== */

/* 
   ESTE ARCHIVO CONTIENE LOS COLORES ESPECÍFICOS DEL EVENTO
   Modifica estos valores para personalizar la apariencia
*/

:root {
    /* ====================================
       COLORES PRINCIPALES DEL EVENTO
       ==================================== */
    
    /* Colores base - PERSONALIZAR AQUÍ */
    --event-primary: #6c757d;           /* Color principal del evento */
    --event-secondary: #adb5bd;         /* Color secundario */
    --event-accent: #fd7e14;            /* Color de acento/destacado */
    --event-success: #28a745;           /* Color de éxito/confirmación */
    --event-warning: #ffc107;           /* Color de advertencia */
    --event-danger: #dc3545;            /* Color de error/peligro */
    
    /* Colores de texto */
    --event-text-dark: #495057;         /* Texto principal */
    --event-text-light: #6c757d;        /* Texto secundario */
    --event-text-muted: #adb5bd;        /* Texto deshabilitado */
    
    /* ====================================
       GRADIENTES DEL EVENTO
       ==================================== */
    
    /* Gradiente principal */
    --event-gradient-primary: linear-gradient(135deg, var(--event-primary) 0%, color-mix(in srgb, var(--event-primary) 80%, black) 100%);
    
    /* Gradiente secundario */
    --event-gradient-secondary: linear-gradient(135deg, var(--event-secondary) 0%, var(--event-primary) 100%);
    
    /* Gradiente de acento */
    --event-gradient-accent: linear-gradient(135deg, var(--event-accent) 0%, color-mix(in srgb, var(--event-accent) 80%, red) 100%);
    
    /* Gradiente neutro */
    --event-gradient-neutral: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
    
    /* ====================================
       SOMBRAS PERSONALIZADAS
       ==================================== */
    
    --event-shadow-color: color-mix(in srgb, var(--event-primary) 30%, transparent);
    --event-shadow-sm: 0 2px 4px var(--event-shadow-color);
    --event-shadow-md: 0 4px 6px var(--event-shadow-color);
    --event-shadow-lg: 0 10px 15px var(--event-shadow-color);
    --event-shadow-xl: 0 20px 25px var(--event-shadow-color);
    
    /* ====================================
       APLICACIÓN DE COLORES
       ==================================== */
    
    /* Sobrescribir variables del sistema con colores del evento */
    --primary: var(--event-primary);
    --secondary: var(--event-secondary);
    --accent: var(--event-accent);
    --text-dark: var(--event-text-dark);
    --text-light: var(--event-text-light);
    
    --gradient-primary: var(--event-gradient-primary);
    --gradient-secondary: var(--event-gradient-secondary);
    --gradient-accent: var(--event-gradient-accent);
    --gradient-neutral: var(--event-gradient-neutral);
    
    --shadow-sm: var(--event-shadow-sm);
    --shadow-md: var(--event-shadow-md);
    --shadow-lg: var(--event-shadow-lg);
    --shadow-xl: var(--event-shadow-xl);

    --primary: #432768;
    --secondary: #6ca8be;
    --terciary: #faa406; 
}

/* ====================================
   EJEMPLOS DE CONFIGURACIONES
   ==================================== */

/* 
   EJEMPLO 1: Evento médico (azules)
   --event-primary: #0056b3;
   --event-secondary: #6c9bd1;
   --event-accent: #17a2b8;
   
   EJEMPLO 2: Evento corporativo (grises/azul)
   --event-primary: #343a40;
   --event-secondary: #6c757d;
   --event-accent: #007bff;
   
   EJEMPLO 3: Evento científico (verdes)
   --event-primary: #155724;
   --event-secondary: #28a745;
   --event-accent: #20c997;
   
   EJEMPLO 4: Evento tecnológico (morados)
   --event-primary: #6f42c1;
   --event-secondary: #6610f2;
   --event-accent: #e83e8c;
   
   EJEMPLO 5: Evento educativo (naranjas)
   --event-primary: #fd7e14;
   --event-secondary: #ffc107;
   --event-accent: #dc3545;
*/

/* ====================================
   INSTRUCCIONES DE USO
   ==================================== */

/*
   CÓMO PERSONALIZAR LOS COLORES:
   
   1. Modifica las variables --event-* al inicio del archivo
   2. Los gradientes se generan automáticamente
   3. Las sombras se adaptan al color principal
   4. Guarda el archivo y recarga la página
   
   MODO DESARROLLO:
   - Usa los colores actuales (grises) para desarrollo
   - Cambia a colores específicos del evento antes del lanzamiento
   
   MODO PRODUCCIÓN:
   - Personaliza todos los colores según la identidad del evento
   - Prueba en diferentes dispositivos
   - Verifica contraste y accesibilidad
*/