/* ==========================================================================
   Design system AUF — extraído de www.auf.org.uy el 2026-08-20
   Fuente: colores computados del sitio en producción.
   Regla de oro: si un valor no está acá, no se usa. Nada a mano.
   ========================================================================== */

:root {
  /* --- Marca -------------------------------------------------------- */
  --auf-azul:          #006EA9;  /* institucional. Botones, texto de acción */
  --auf-azul-oscuro:   #076694;  /* hover del azul */
  --auf-azul-noche:    #004F7A;  /* fondos oscuros */
  --auf-celeste:       #42B6E5;  /* títulos y links. El color que más se ve */
  --auf-celeste-vivo:  #10A5DA;  /* franjas y destacados */
  --auf-marino:        #344C87;  /* segundo color de franja */
  --auf-verde:         #12A13C;  /* tercer color de franja / éxito */

  /* --- Neutros ------------------------------------------------------ */
  --auf-texto:         #212529;  /* texto general */
  --auf-texto-suave:   #696969;  /* texto secundario, menús de pie */
  --auf-gris-borde:    #D1D1D1;
  --auf-gris-fondo:    #F7F7F7;  /* fondo de bloques */
  --auf-blanco:        #FFFFFF;

  /* --- Estado (no están en el sitio; elegidos para combinar) --------- */
  --auf-ok:            #12A13C;
  --auf-espera:        #E8A33D;
  --auf-alerta:        #C4362F;

  /* --- Tipografía --------------------------------------------------- */
  --auf-font:          "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --auf-peso-liviano:  300;
  --auf-peso-normal:   400;
  --auf-peso-fuerte:   700;

  --auf-tam-titulo:    33px;  /* h2 del sitio */
  --auf-tam-subtitulo: 22px;  /* h3 */
  --auf-tam-base:      15px;
  --auf-tam-chico:     13px;

  /* --- Forma -------------------------------------------------------- */
  --auf-radio:         0;      /* el sitio no redondea NADA */
  --auf-borde:         1px solid var(--auf-azul);
  --auf-sombra:        0 1px 3px rgba(0,0,0,.08);

  /* --- Espaciado ---------------------------------------------------- */
  --auf-esp-1: 4px;
  --auf-esp-2: 8px;
  --auf-esp-3: 12px;
  --auf-esp-4: 16px;
  --auf-esp-5: 24px;
  --auf-esp-6: 32px;
}

/* --- Base ----------------------------------------------------------- */
body {
  font-family: var(--auf-font);
  font-size: var(--auf-tam-base);
  color: var(--auf-texto);
  background: var(--auf-blanco);
  margin: 0;
}

h1, h2 { font-size: var(--auf-tam-titulo);    font-weight: var(--auf-peso-normal); color: var(--auf-celeste); margin: 0 0 var(--auf-esp-4); }
h3     { font-size: var(--auf-tam-subtitulo); font-weight: var(--auf-peso-fuerte); margin: 0 0 var(--auf-esp-3); }
h4     { font-size: var(--auf-tam-base);      font-weight: var(--auf-peso-liviano); color: var(--auf-celeste); margin: 0 0 var(--auf-esp-2); }

a { color: var(--auf-celeste); text-decoration: none; }
a:hover { color: var(--auf-azul); text-decoration: underline; }

/* --- Botones (copiados tal cual del sitio) -------------------------- */
.auf-btn {
  font-family: var(--auf-font);
  font-size: var(--auf-tam-base);
  font-weight: var(--auf-peso-fuerte);
  padding: var(--auf-esp-1) var(--auf-esp-4);
  border: var(--auf-borde);
  border-radius: var(--auf-radio);
  background: transparent;
  color: var(--auf-azul);
  cursor: pointer;
  line-height: 1.7;
}
.auf-btn:hover        { background: var(--auf-azul); color: var(--auf-blanco); }
.auf-btn--lleno       { background: var(--auf-azul); color: var(--auf-blanco); }
.auf-btn--lleno:hover { background: var(--auf-azul-oscuro); }
.auf-btn--suave       { border-color: var(--auf-gris-borde); color: var(--auf-texto-suave); }
.auf-btn--suave:hover { background: var(--auf-gris-fondo); color: var(--auf-texto); }

/* --- Etiquetas de estado -------------------------------------------- */
.auf-tag {
  display: inline-block;
  font-size: 11px;
  font-weight: var(--auf-peso-fuerte);
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 2px var(--auf-esp-2);
  border: 1px solid currentColor;
  border-radius: var(--auf-radio);
  white-space: nowrap;
}
.auf-tag--pedido     { color: var(--auf-texto-suave); }
.auf-tag--definicion { color: var(--auf-marino); }
.auf-tag--desarrollo { color: var(--auf-celeste-vivo); }
.auf-tag--aprobacion { color: var(--auf-espera); }
.auf-tag--uso        { color: var(--auf-ok); }
.auf-tag--dormido    { color: var(--auf-gris-borde); }