/* Paleta de colores - Pétalos Rosados */
:root {
    /* Colores principales - Tema pétalos rosados */
    --color-primario: #E91E63;           /* Rosa pétalos medio-oscuro para títulos */
    --color-secundario: #F06292;        /* Rosa pétalos claro para subtítulos */
    --color-terciario: #7A3E52;         /* Rosa oscuro */
    --color-acento: #FFF0F5;            /* Lavanda rubor */
    --color-texto: #6A3448;             /* Rosa mucho más oscuro para texto */
    
    /* RGB values for rgba usage */
    --color-primario-rgb: 233, 30, 99;
    --color-secundario-rgb: 240, 98, 146;
    
    /* Variables adicionales para el refactor - Tema pétalos rosados */
    --color-fondo-principal: #FFF8FA;   /* Rosa muy claro */
    --color-sombra-principal: rgba(233, 30, 99, 0.10);     /* Sombra rosa suave */
    --color-sombra-secundaria: rgba(233, 30, 99, 0.07);    /* Sombra rosa ligera */
    --color-hover-boton: #6A3448;       /* Rosa mucho más oscuro para hover */
    --color-boton-transparente: rgba(233, 30, 99, 0.13);   /* Fondo transparente de botones */
    --color-sombra-media: rgba(233, 30, 99, 0.15);         /* Sombra rosa media */
    --color-bg-gradiente-cuenta: linear-gradient(90deg, #FFF0F5 0%, #FFF8FA 100%);  /* Gradiente cuenta bancaria */
    --color-borde-bancario: #F8BBD9;    /* Rosa suave para datos bancarios */
    --color-cuenta-sombra: rgba(233, 30, 99, 0.2);
    
    /* Variables para formularios profesionales - Tema pétalos rosados */
    --color-borde-formulario: #F8BBD9;  /* Rosa suave para formularios */
    --color-texto-formulario: #6A3448;  /* Rosa mucho más oscuro para texto de formularios */
    --color-hover-formulario: #FFF8FA;  /* Rosa muy claro para hover */
    --color-flecha-select: #6A3448;     /* Rosa mucho más oscuro para flechas */
    --color-radio-si: #10b981;          /* Verde para "Sí" */
    --color-radio-no: #ef4444;          /* Rojo para "No" */
    
    /* Variables para elementos especiales - Tema pétalos rosados */
    
    /* Variables para countdown */
    /* Variables para elementos especiales */
    --color-wave: #FF8FA6;
    

    
    /* Variables para modales */
    --color-modal-imagen-fondo: linear-gradient(135deg, #FFF8FA 0%, #F8BBD9 100%);
    --color-fondo-timeline: #FFF8FA;
    
    /* Variable para indicadores de carrusel */
    --color-puntos-inactivos: rgba(var(--color-primario-rgb), 0.25); /* Puntos de carrusel no activos */
}
