:root{

    /* Fondos oscuros utilizados por el dashboard */
    --bio-fondo-principal: #0f172a;
    --bio-fondo-secundario: #111c31;

    /* Color para elementos activos y resaltados */
    --bio-acento: #288cc6;
    --bio-acento-rgb: 40, 140, 198;

    /* Colores de texto del dashboard */
    --bio-texto-claro: #e2e8f0;
    --bio-texto-suave: #94a3b8;

    /*
        Nombres anteriores conservados temporalmente
        mientras actualizamos todas las pantallas.
    */
    --bio-azul-principal:
        var(--bio-acento);

    --bio-azul-oscuro:
        var(--bio-fondo-principal);

    --bio-azul-suave:
        var(--bio-texto-claro);

    --bio-azul-rgb:
        var(--bio-acento-rgb);

}