/* Tokens de diseño, siguiendo el lenguaje visual de nestjs.com.
   Medido del sitio real, no de memoria:
     fondo #050303 · texto #fff · apagado #9b9a9a · acento #ea2845
     Manrope · titulares de peso 500 · botones blancos con texto negro y r=20px

   El sitio de referencia es oscuro y no tiene modo claro. Éste tampoco: un
   modo claro a medias fue justo el fallo de la versión anterior, y mantener
   dos paletas coherentes cuesta más de lo que aporta aquí. */

:root {
  /* Marca */
  --nl-red:        #ea2845;
  --nl-red-soft:   #ff5c74;
  --nl-red-deep:   #c11a33;
  /* El oro de la greca del medallón. Forma parte de la identidad tanto como
     el rojo, y sin él el filete de la cabecera pierde el guiño andino. */
  --nl-gold:       #ffb75c;

  /* Superficies. El negro no es puro: lleva un punto cálido, como el original. */
  --nl-bg:          #050303;
  --nl-bg-subtle:   rgba(255, 255, 255, .04);
  --nl-bg-sunken:   rgba(255, 255, 255, .07);
  --nl-bg-solid:    #0e0a0b;   /* cuando hace falta opacidad real */
  --nl-border:      rgba(255, 255, 255, .12);
  --nl-border-soft: rgba(255, 255, 255, .07);

  /* Texto */
  --nl-text:        #ffffff;
  --nl-text-muted:  #9b9a9a;
  --nl-text-faint:  rgba(255, 255, 255, .45);
  --nl-text-invert: #000000;

  /* Código — los tonos de resaltado son los del tema oscuro de GitHub, que es
     lo que usa la referencia. */
  --nl-code-bg:          rgba(255, 255, 255, .05);
  --nl-code-text:        #e6edf3;
  --nl-code-border:      rgba(255, 255, 255, .1);
  --nl-code-inline-bg:   rgba(255, 255, 255, .08);
  --nl-code-inline-text: #ffa657;
  --nl-syntax-string:    #a5d6ff;
  --nl-syntax-keyword:   #ff7b72;
  --nl-syntax-comment:   #8b949e;

  --nl-on-code:            rgba(255, 255, 255, .6);
  --nl-on-code-strong:     #ffffff;
  --nl-code-overlay:        rgba(255, 255, 255, .08);
  --nl-code-overlay-hover:  rgba(255, 255, 255, .16);
  --nl-code-overlay-border: rgba(255, 255, 255, .18);

  /* Estados */
  --nl-warn:   #ffa657;
  --nl-danger: #ff7b72;
  --nl-ok:     #3fb950;

  /* Tipografía */
  --nl-font: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
             'Helvetica Neue', Arial, sans-serif;
  --nl-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo,
                  Consolas, monospace;

  /* Pesos. La referencia titula con 500, no con 800: el titular manda por
     tamaño y por aire, no por grosor. */
  --nl-weight-title: 500;
  --nl-weight-strong: 700;

  --nl-text-xs:   0.8125rem;
  --nl-text-sm:   0.9375rem;
  --nl-text-base: 1rem;
  --nl-text-lg:   1.1875rem;
  --nl-text-xl:   1.5rem;
  --nl-text-2xl:  2rem;
  --nl-text-3xl:  3rem;
  --nl-text-4xl:  4rem;

  --nl-space-1: 0.25rem;
  --nl-space-2: 0.5rem;
  --nl-space-3: 0.75rem;
  --nl-space-4: 1rem;
  --nl-space-5: 1.25rem;
  --nl-space-6: 1.5rem;
  --nl-space-8: 2rem;
  --nl-space-12: 3rem;
  --nl-space-16: 4rem;
  --nl-space-24: 6rem;

  /* Forma. El radio grande de los botones (20px) es una firma del original. */
  --nl-radius:      12px;
  --nl-radius-lg:   20px;
  --nl-radius-btn:  20px;
  --nl-radius-full: 999px;

  --nl-shadow-sm: 0 1px 2px rgba(0, 0, 0, .5);
  --nl-shadow:    0 8px 30px rgba(0, 0, 0, .6);
  --nl-shadow-lg: 0 20px 60px rgba(0, 0, 0, .7);
  --nl-glow-red:  0 0 60px color-mix(in srgb, var(--nl-red) 30%, transparent);

  --nl-transition: 180ms cubic-bezier(.4, 0, .2, 1);
  --nl-measure: 44rem;

  /* GeneratePress se pinta ENTERO con estas siete variables, que salen del
     Customizer como CSS en línea. Se remapean aquí, en :root y no dentro de
     una media query, porque ahora el tema es oscuro siempre: la cabecera, la
     barra lateral, el pie y el buscador siguen a la paleta sin que haya que
     perseguir un selector detrás de otro. */
  --contrast:   var(--nl-text);
  --contrast-2: var(--nl-text-muted);
  --contrast-3: var(--nl-text-faint);
  --base:       var(--nl-bg-sunken);
  --base-2:     var(--nl-bg);
  --base-3:     var(--nl-bg-solid);
  --accent:     var(--nl-red);

  --gp-search-modal-bg-color:         var(--nl-bg-solid);
  --gp-search-modal-text-color:       var(--nl-text);
  --gp-search-modal-overlay-bg-color: rgba(0, 0, 0, .75);
}