/* Colores específicos para plantilla Dinosaurios Tiernos - Verde claro turquesa con naranjo */
:root {
    --color-primario: #5eead4; /* Verde turquesa claro */
    --color-secundario: #fb923c; /* Naranjo cálido */
    --color-terciario: #2dd4bf; /* Turquesa medio */
    --color-acento: #f0fdfa; /* Turquesa muy claro */
    --color-texto: #134e4a; /* Verde azulado oscuro legible */

    /* RGB values for rgba usage */
    --color-primario-rgb: 94, 234, 212;
    --color-secundario-rgb: 251, 146, 60;

    /* Variables adicionales para el refactor */
    --color-fondo-principal: #f0fdfa; /* Fondo turquesa muy suave */
    --color-sombra-principal: rgba(94, 234, 212, 0.15); /* Sombra turquesa principal */
    --color-sombra-secundaria: rgba(94, 234, 212, 0.08); /* Sombra turquesa secundaria */
    --color-hover-boton: #14b8a6; /* Turquesa intenso para hover */
    --color-boton-transparente: rgba(94, 234, 212, 0.2); /* Botones semi-transparentes turquesa */
    --color-sombra-media: rgba(94, 234, 212, 0.18); /* Sombra turquesa media */
    --color-bg-gradiente-cuenta: linear-gradient(90deg, #f0fdfa 0%, #ccfbf1 100%); /* Gradiente turquesa */
    --color-borde-bancario: #99f6e4; /* Borde turquesa bancario */
    --color-cuenta-sombra: rgba(94, 234, 212, 0.25); /* Sombra turquesa cuenta */

    /* Variables para formularios profesionales */
    --color-borde-formulario: #99f6e4; /* Borde turquesa formulario */
    --color-texto-formulario: #134e4a; /* Texto turquesa formulario */
    --color-hover-formulario: #f0fdfa; /* Hover turquesa formulario */
    --color-flecha-select: #0f766e; /* Flecha turquesa select */
    --color-radio-si: #5eead4; /* Radio turquesa para sí */
    --color-radio-no: #fb923c; /* Radio naranjo para no */

    /* Variables para elementos especiales */

    /* Variables para countdown */
    /* Variables para elementos especiales */
    --color-wave: #fb923c;
    --color-fondo-timeline: #f0fdfa;

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