/* El Almacén Distribuciones — generated from tokens.json */
:root, [data-theme="claro"] {
  --azul-marino: #00205b;
  --naranja-logistico: #ff8200;
  --azul-cobalto: #005eb8;
  --gris-tecnico: #75787b;
  --blanco: #ffffff;
  --negro: #111111;
  --cobalto-oscuro: #00478c;
  --cobalto-suave: #e6f0fa;
  --tinta: #0f1b3d;
  --tinta-secundaria: #3a3d42;
  --tinta-suave: #5b5e62;
  --tinta-placeholder: #6b6f75;
  --tinta-inactiva: #4a4d52;
  --fondo-app: #f2f2f3;
  --relleno-neutro: #edeeef;
  --borde: #e3e4e5;
  --borde-sobre-gris: #dcddde;
  --borde-control: #c8c9cb;
  --sobre-marino: #d5dbea;
  --sobre-marino-suave: #c4cce0;
  --sobre-marino-tenue: #a9b4d0;
  --linea-sobre-marino: #22407a;
  --linea-translucida: rgba(255, 255, 255, 0.18);
  --pista-sobre-naranja: rgba(0, 32, 91, 0.18);
  --naranja-suave: #fff1e3;
  --aviso: #8f4700;
  --aviso-fuerte: #5c2e00;
  --aviso-icono: #b35a00;
  --seleccion: #ffd3a6;
  --error: #b42318;
  --error-suave: #fdecea;
  --error-texto: #8c1d13;
  --exito: #1e6b3a;
  --exito-suave: #e5f3ea;
  --sombra-flotante: 0 6px 16px rgba(0, 32, 91, 0.18);
}
:root {
  --espacio-2: 2px;
  --espacio-4: 4px;
  --espacio-6: 6px;
  --espacio-8: 8px;
  --espacio-10: 10px;
  --espacio-12: 12px;
  --espacio-14: 14px;
  --espacio-16: 16px;
  --espacio-20: 20px;
  --espacio-24: 24px;
  --espacio-28: 28px;
  --espacio-32: 32px;
  --espacio-40: 40px;
  --espacio-56: 56px;
  --radio-2: 2px;
  --radio-4: 4px;
  --radio-6: 6px;
  --radio-8: 8px;
  --radio-10: 10px;
  --radio-12: 12px;
  --radio-14: 14px;
  --radio-16: 16px;
  --radio-20: 20px;
  --radio-pildora: 999px;
  --grosor-fino: 1px;
  --grosor-medio: 1.5px;
  --grosor-fuerte: 2px;
  --grosor-indicador: 3px;
  --alto-xs: 32px;
  --alto-chip: 36px;
  --alto-s: 40px;
  --alto-toque: 44px;
  --alto-campo: 48px;
  --alto-boton: 52px;
  --alto-cta: 54px;
  --alto-opcion: 56px;
  --alto-barra: 64px;
  --ancho-contenedor: 1120px;
  --t-mini: 12px;
  --t-chico: 13px;
  --t-secundario: 14px;
  --t-cuerpo: 16px;
  --t-bajada: 18px;
  --t-subtitulo: 22px;
  --t-titulo-pantalla: 26px;
  --t-titulo-seccion: 30px;
  --t-titular: 40px;
  --t-promesa: 64px;
  --t-portada: 104px;
  --font-titulares: Archivo, sans-serif;
  --font-texto: Inter, system-ui, sans-serif;
  --curva-salida: cubic-bezier(0.23, 1, 0.32, 1);
  --duracion-presion: 120ms;
  --duracion-color: 160ms;
  --duracion-barra: 200ms;
  --duracion-celebracion: 300ms;
}
.titular { font-family: var(--font-titulares); font-size: 40px; line-height: 1.04; font-weight: 700; letter-spacing: -0.015em; }
.titulo-seccion { font-family: var(--font-titulares); font-size: 30px; line-height: 1.1; font-weight: 800; letter-spacing: -0.01em; }
.titulo-exito { font-family: var(--font-titulares); font-size: 30px; line-height: 1.1; font-weight: 900; letter-spacing: -0.01em; }
.titulo-estado { font-family: var(--font-titulares); font-size: 26px; line-height: 1.1; font-weight: 800; letter-spacing: -0.01em; }
.titulo-pantalla { font-family: var(--font-titulares); font-size: 26px; line-height: 1.15; font-weight: 800; letter-spacing: -0.01em; }
.titulo-rubro { font-family: var(--font-titulares); font-size: 22px; font-weight: 700; }
.titulo-atributo { font-family: var(--font-titulares); font-size: 22px; font-weight: 800; }
.titulo-barra { font-family: var(--font-titulares); font-size: 18px; font-weight: 800; }
.titulo-tarjeta { font-family: var(--font-titulares); font-size: 16px; font-weight: 700; }
.bajada { font-family: var(--font-texto); font-size: 18px; line-height: 1.55; font-weight: 400; }
.cuerpo { font-family: var(--font-texto); font-size: 16px; line-height: 1.65; font-weight: 400; }
.cuerpo-app { font-family: var(--font-texto); font-size: 16px; line-height: 1.5; font-weight: 400; }
.secundario { font-family: var(--font-texto); font-size: 14px; line-height: 1.5; font-weight: 400; }
.nota { font-family: var(--font-texto); font-size: 14px; line-height: 1.45; font-weight: 400; }
.metadato { font-family: var(--font-texto); font-size: 13px; font-weight: 400; letter-spacing: 0.01em; }
.texto-mini { font-family: var(--font-texto); font-size: 12px; font-weight: 400; letter-spacing: 0.01em; }
.boton { font-family: var(--font-texto); font-size: 16px; font-weight: 600; }
.boton-m { font-family: var(--font-texto); font-size: 16px; font-weight: 600; }
.boton-s { font-family: var(--font-texto); font-size: 14px; font-weight: 600; }
.etiqueta-campo { font-family: var(--font-texto); font-size: 13px; font-weight: 600; }
.nombre-producto { font-family: var(--font-texto); font-size: 16px; line-height: 1.25; font-weight: 600; }
.etiqueta-estado { font-family: var(--font-texto); font-size: 12px; font-weight: 600; letter-spacing: 0.01em; }
.rotulo-nav { font-family: var(--font-texto); font-size: 12px; font-weight: 500; letter-spacing: 0.01em; }
.importe { font-family: var(--font-texto); font-size: 40px; font-weight: 700; letter-spacing: -0.02em; }
.saldo { font-family: var(--font-texto); font-size: 22px; font-weight: 800; }
.total-pedido { font-family: var(--font-texto); font-size: 18px; font-weight: 800; }
.precio { font-family: var(--font-texto); font-size: 18px; font-weight: 700; }
.precio-linea { font-family: var(--font-texto); font-size: 14px; font-weight: 700; }
.codigo { font-family: var(--font-texto); font-size: 13px; font-weight: 400; }
@font-face { font-family: "Archivo"; src: url("fonts/Archivo-Variable.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/Inter-Variable.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap; }