/* ============================================================================
   Juicy — Dashboard Design System · RESET
   ----------------------------------------------------------------------------
   El PRIMER archivo de elementos de la cadena. Hasta 0.9.12 no existía: el
   producto corría sobre los defaults del navegador + un mini-reset DISPERSO en
   main.css (líneas 94-165) + el `box-sizing` global que aportaba `bootstrap-grid`.
   Aquí se consolida ese reset en UN sitio, con dueño. Para qué:
     · main.css puede morir sin llevarse el reset (contrato del strangler).
     · se puede tirar `bootstrap-grid` sin perder el `box-sizing` global —
       resulta que main.css:109 (`*{box-sizing}`) YA lo daba, así que hoy está
       por partida triple; esto lo deja en UN dueño (ver el plan, fase Bootstrap).
     · el DS queda portable (Electron, contrato D2): no hereda reset de ningún
       framework externo.

   Carga en la cadena de TOKENS, al final (tras `foundation`, que define
   `--font-sans`, y `primitives`, que define los neutrales) y ANTES de `main`.
   Mientras main.css conserve su copia de estas reglas, GANA (misma
   especificidad, carga después) → añadir este archivo no mueve un pixel. El día
   que se borra la copia de main.css, este toma el relevo. Igual que los tokens.

   ⚠️ REGLA DE ESTA FASE (decisión del dueño, 2026-07-17): reset MODERNO, pero
   CALIBRADO PARA NO CAMBIAR EL RENDER DE HOY. Las ideas del reset moderno que SÍ
   cambiarían el aspecto actual NO se aplican: quedan listadas abajo como
   "ideales diferidos", para decidirse a propósito y no de contrabando.
   ============================================================================ */

/* `box-sizing` heredable en TODO, pseudo-elementos incluidos. main.css hacía
   `*{box-sizing}` (sin `::before/::after`); `bootstrap-grid` sí los cubría. Se
   conserva la conducta de bootstrap (con pseudos) para no depender de él. */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Sin márgenes ni paddings heredados del navegador en la raíz. */
html,
body {
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;   /* iOS no infla el texto al girar. No mueve layout. */
  -moz-tab-size: 4;
  tab-size: 4;
}

/* body: los mismos valores que traía main.css. La fuente sale del token del DS
   (`--font-sans`) en vez del alias `--primaryFont` de main.css — mismo primario
   (Montserrat), solo cambia la lista de respaldo, que no se ve porque Montserrat
   carga. OJO `line-height: 100%` (=1) es inusual —el reset moderno usaría 1.5—
   pero el producto lo fija a 1 y lo sube por elemento (h 130%, p/ul 150%);
   cambiarlo movería TODO. Se conserva; el 1.5 es IDEAL DIFERIDO. */
body {
  font-family: var(--font-sans);
  font-weight: 500;
  line-height: 100%;
  color: var(--neutral-500);
  background: var(--neutral-100);
}

/* Medios fluidos. NO se añade `display: block` (que el reset moderno pone):
   volvería BLOQUE a las imágenes inline y podría mover layout → IDEAL DIFERIDO. */
img,
picture,
svg,
video,
canvas {
  max-width: 100%;
}

img {
  border: none;
}
img,svg,video{
	display: block;
}

/* Enlaces del dashboard: heredan color (currentColor) y van sin subrayado. */
a {
  color: currentColor;
  text-decoration: none;
}

/* Los controles heredan la tipografía. Solo la FAMILIA, como hoy: el reset
   moderno usa `font: inherit` (tamaño + peso + interlineado), que cambiaría el
   tamaño de todo input/button crudo que no pase por el DS → IDEAL DIFERIDO.
   `outline: none` se CONSERVA para no cambiar la conducta (ver deuda abajo). */
input,
select,
textarea,
button {
  font-family: inherit;
  outline: none;
}

button {
  cursor: pointer;
}

/* Interlineado por elemento (main.css lo fijaba suelto en su bloque MISC). */
h1, h2, h3, h4, h5, h6 {
  line-height: 100%;
  margin: 0;
}

p,
ul,
ol {
  line-height: 150%;
  margin: 0 0 25px;
}

p:last-child {
  margin-bottom: 0;
}

/* Los ICONOS son una tipografía (uicons): el glifo lo pinta un `::before`, y su caja la
   decide el `line-height` de ese pseudo-elemento, no el tamaño de la fuente. Vino de
   main.css (2026-07-27), tal cual.

   Por qué es RESET y no decoración: sin esta línea el glifo hereda el `line-height` del
   contexto y la caja del icono cambia de alto según dónde esté. Vivía en el CSS legacy,
   que el front nuevo no importa a propósito, así que allá TODOS los iconos median distinto
   — medido en la campana del header: 20 de alto contra los 27 del dashboard PHP. No se
   veía en el espejo porque los componentes con caja fija (icon-chip, botones) la tapan;
   asoma justo donde el icono va suelto. */
/* Los cuatro selectores son los de main.css, LETRA POR LETRA: el último es
   `span[class*="fi-rr-"]` SIN espacio delante, a diferencia de su hermano `i`. Parece un
   descuido del original y lo es, pero "arreglarlo" aquí estrecharía lo que casa y este
   movimiento no puede cambiar el render. Si algún día se normaliza, se mide aparte. */
i[class^="fi-rr-"]::before,
i[class*=" fi-rr-"]::before,
span[class^="fi-rr-"]::before,
span[class*="fi-rr-"]::before {
  line-height: 1.5;
}

/* ============================================================================
   IDEALES DIFERIDOS — el reset moderno los trae; NO se aplican porque cambian el
   render de HOY. Se deciden con el dueño (ver el plan, §reset/Bootstrap):

     1. `line-height` del body a 1.5 (hoy 100%/=1, compensado elemento por
        elemento). Es lo correcto de raíz, pero re-fluiría cada bloque de texto.
     2. `img, svg, video { display: block }` (hoy inline). Quita el hueco
        fantasma bajo las imágenes, pero mueve las que hoy fluyen en línea.
     3. Controles con `font: inherit` completo (hoy solo `font-family`): unificaría
        el tamaño de los controles crudos con el del cuerpo.

   DEUDA CONOCIDA (no es un ideal, es un problema): `outline: none` en los
   controles MATA el anillo de foco nativo — un problema de accesibilidad. Se
   conserva aquí SOLO porque quitarlo cambiaría la conducta de foco de esta fase.
   El DS ya pinta foco propio en field.css/button.css; cuando se decida, este
   `outline: none` se va y los controles crudos recuperan su anillo.
   ============================================================================ */