:root {
/*        BackGround*/
    --ds-body-background: #F8FAFC;
    --ds-gv-background: #fff;
    --background-modal-title: #F1F5F9;
    /* Marca CompetenciaPatinaje: azul pista + naranja de acento */
    --ds-primary: #0B4F8F;
    --ds-primary-hover: #093D70;
    --ds-primary-mid: #062B4F;
    --ds-primary-light: #E4EEF8;
    /* Fondo del banner de pantalla (antes iba fijo en generales.css) */
    --ds-banner-bg: #EDF3FA;

    --ds-accent: #EA5B2B;
    --ds-accent-hover: #D94C1D;
    /* Podio de la pagina publica de resultados (wfPosiciones). Oscuros a
       proposito: el numero del lugar va en blanco encima. */
    --ds-oro: #9A6F00;
    --ds-oro-bg: #FFFBEB;
    --ds-plata: #64748B;
    --ds-bronce: #A0522D;
    /* Hits de la fase 3 (wfTiempos, wfPosiciones). Cuatro colores que se
       repiten: lo que importa es que dos hits seguidos NO se parezcan,
       no que el hit 5 tenga color propio. El -bg es el fondo del
       separador y de la etiqueta; el otro, la franja y el texto. */
    --ds-hit-1: #0B4F8F;
    --ds-hit-1-bg: #E4EEF8;
    --ds-hit-2: #B3471A;
    --ds-hit-2-bg: #FDEDE6;
    --ds-hit-3: #15803D;
    --ds-hit-3-bg: #EAFBF0;
    --ds-hit-4: #6D28D9;
    --ds-hit-4-bg: #F1EBFD;
    /* Carriles de un grupo de la eliminatoria (Skatecross y Team Cross):
       1 rojo, 2 amarillo, 3 verde, 4 azul, como en la hoja del juez. El
       color es el fondo de la etiqueta; -texto, la letra encima. */
    --ds-carril-rojo: #DC2626;
    --ds-carril-rojo-texto: #FFFFFF;
    --ds-carril-amarillo: #FACC15;
    --ds-carril-amarillo-texto: #422006;
    --ds-carril-verde: #16A34A;
    --ds-carril-verde-texto: #FFFFFF;
    --ds-carril-azul: #2563EB;
    --ds-carril-azul-texto: #FFFFFF;
   /* Colores Textos*/
    --ds-texto-primary: #0F172A;
    --ds-texto-nav: #FFFFFF;
    --ds-text-title: #0F172A;
    --ds--text-all: #475569;
    --ds--text-1: #0B4F8F;

     /*Colores semánticos */
    --ds-success: #16A34A;
    --ds-success-bg: #F0FDF4;
    --ds-success-border: #BBF7D0;
    --ds-warning: #D97706;
    --ds-warning-bg: #FFFBEB;
    --ds-warning-border: #FDE68A;
    --ds-danger: #DC2626;
    --ds-danger-bg: #FEF2F2;
    --ds-danger-border: #FECACA;
    --ds-info: #0369A1;
    --ds-info-bg: #F0F9FF;
    --ds-info-border: #BAE6FD;
     /*Escala de grises */
    --ds-gray-50: #F8FAFC;
    --ds-gray-100: #F1F5F9;
    --ds-gray-200: #E2E8F0;
    --ds-gray-300: #CBD5E1;
    --ds-gray-400: #94A3B8;
    --ds-gray-500: #64748B;
    --ds-gray-600: #475569;
    --ds-gray-700: #334155;
    --ds-gray-800: #1E293B;
    --ds-gray-900: #0F172A;
    /*     Sidebar (antes oscuro; ahora claro con item activo en lavanda) */
    --ds-sidebar-bg: #FFFFFF;
    --ds-sidebar-hover: #F8FAFC;
    --ds-sidebar-active: #0B4F8F;
    --ds-sidebar-active-bg: #E4EEF8;
    --ds-sidebar-text: #475569;
    --ds-sidebar-muted: #94A3B8;
    --ds-sidebar-border: #E2E8F0;
   /*  Bordes y radios */
    --ds-border: 0.5px solid var(--ds-gray-400);
    --ds-radius-sm: 6px;
    --ds-radius: 8px;
    --ds-radius-lg: 12px;
    --ds-radius-xl: 16px;
    --gv-border: #E4E4E7;
     /*Transición estándar*/ /*(usada en dashboard.css y menu.css) */
    --ds-transition: all 0.15s ease-in-out;

}