/* Paleta y tipografía de Profetor: una sola fuente de verdad.
 *
 * La usan tanto la portada pública (landing.css) como la aplicación (site.css).
 * Van juntas a propósito: si cada superficie tuviera su propia copia, con el
 * tiempo se separarían y el producto se vería como dos productos distintos.
 *
 * Tema claro, de registro académico: papel, tinta y el azul institucional.
 * Sobre fondo claro el azul de marca #0038a8 contrasta de sobra, así que es el
 * acento tal cual (en el tema oscuro anterior había que aclararlo). El rojo de
 * marca queda reservado para el punto del isotipo (_Marca.cshtml), nunca para
 * estados del alumno.
 */

:root {
  /* Superficies: la página es papel; las tarjetas y tablas, blanco. */
  --fondo: #f4f4f1;
  --fondo-2: #fbfbf9;
  --superficie: #ffffff;
  --superficie-2: #ecedea;

  --borde: #dcdcd6;
  --borde-fuerte: #bfc1ba;

  /* Tinta, de más a menos énfasis. */
  --texto: #15203a;
  --texto-2: #4a5468;
  --texto-3: #7a8294;

  --acento: #0038a8;
  --acento-fuerte: #002c86;
  --acento-suave: rgba(0, 56, 168, .08);
  --acento-borde: rgba(0, 56, 168, .32);

  /* Marca: solo para el isotipo. */
  --rojo-marca: #d52b1e;

  /* Estados de una sesión. Separados del acento y del rojo de marca para que
     el significado no dependa del color corporativo. Oscuros para que el texto
     sobre su versión suave siga leyéndose. */
  --limpio: #1b7a4e;
  --dudoso: #9a6410;
  --sospechoso: #b42318;
  --limpio-suave: rgba(27, 122, 78, .12);
  --dudoso-suave: rgba(154, 100, 16, .13);
  --sospechoso-suave: rgba(180, 35, 24, .11);

  /* Tres roles tipográficos: serif para titulares (peso institucional), sans
     para el cuerpo (claridad) y monoespaciada para datos y etiquetas técnicas.
     Todas del sistema: la página que promete que los datos no salen del país no
     debería pedirle una tipografía a un tercero. */
  --serif: ui-serif, Georgia, "Times New Roman", Times, serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "Cascadia Code", "SF Mono", Consolas, "Liberation Mono", monospace;

  --radio: 6px;
}

/* Isotipo (SVG inline en _Marca.cshtml): la P en el color de acento, el punto
   en rojo de marca. Se dimensiona en em para que acompañe al texto que lo rodea. */
.logo-marca {
  display: inline-block;
  width: 1.15em;
  height: 1.15em;
  color: var(--acento);
  flex: 0 0 auto;
  vertical-align: -.2em;
}

/* "tor" del nombre en acento: el guiño a la privacidad que el producto promete. */
.marca-tor { color: var(--acento); }
