/* Colores específicos para plantilla Perritos Patrulleros - Estilo Paw Patrol */
:root {
    --color-primario: #0d5fb5; /* Azul patrulla Paw Patrol */
    --color-secundario: #e63946; /* Rojo rescate */
    --color-terciario: #ffd60a; /* Amarillo distintivo patrulla */
    --color-acento: #4cc9f0; /* Azul cielo brillante */
    --color-texto: #1a1a2e; /* Texto oscuro para máximo contraste */
    
    /* RGB values for rgba usage */
    --color-primario-rgb: 13, 95, 181;
    --color-secundario-rgb: 230, 57, 70;
    
    /* Variables adicionales para el refactor */
    --color-fondo-principal: #e8f4fd; /* Fondo azul muy claro patrulla */
    --color-sombra-principal: rgba(13, 95, 181, 0.25); /* Sombra azul patrulla principal */
    --color-sombra-secundaria: rgba(230, 57, 70, 0.18); /* Sombra roja rescate secundaria */
    --color-hover-boton: #094a8f; /* Azul oscuro para hover */
    --color-boton-transparente: rgba(13, 95, 181, 0.15); /* Botones semi-transparentes azul patrulla */
    --color-sombra-media: rgba(13, 95, 181, 0.22); /* Sombra azul patrulla media */
    --color-bg-gradiente-cuenta: linear-gradient(90deg, #0d5fb5 0%, #4cc9f0 100%); /* Gradiente azul patrulla */
    --color-borde-bancario: #0d5fb5; /* Borde azul patrulla bancario */
    --color-cuenta-sombra: rgba(13, 95, 181, 0.30); /* Sombra azul patrulla cuenta */
    
    /* Variables para formularios profesionales */
    --color-borde-formulario: #0d5fb5; /* Borde azul patrulla formulario */
    --color-texto-formulario: #1a1a2e; /* Texto oscuro formulario */
    --color-hover-formulario: #e8f4fd; /* Hover azul muy claro formulario */
    --color-flecha-select: #0d5fb5; /* Flecha azul patrulla select */
    --color-radio-si: #0d5fb5; /* Radio azul patrulla para sí */
    --color-radio-no: #e63946; /* Radio rojo rescate para no */
    
    /* Variables para elementos especiales */
    
    /* Variables para countdown */
    /* Variables para elementos especiales */
    --color-wave: #0d5fb5;
    --color-fondo-timeline: #e8f4fd;
    
    /* Variables para modales */
    --color-modal-imagen-fondo: linear-gradient(135deg, #e8f4fd 0%, #b8e1f7 50%, #4cc9f0 100%); /* Gradiente azul claro modal */
    
    /* Variable para indicadores de carrusel */
    --color-puntos-inactivos: rgba(var(--color-primario-rgb), 0.25); /* Puntos de carrusel no activos */
}