/* ============================================================
   AUTUNEO — Sistema tipográfico del frontoffice
   ------------------------------------------------------------
   Objetivo: una sola escala para todo el sitio. Se aplica de
   forma NO invasiva:
     · Los tokens (--aui-fs-*) quedan disponibles para que cada
       módulo/componente migre a ellos.
     · Las reglas base usan :where() → especificidad 0, así que
       CUALQUIER regla existente de un componente gana y no hay
       regresiones. Solo se “ordena” el texto que hoy no tiene
       ningún tamaño propio (CMS, contenido suelto, algunos
       módulos nativos).
     · Solo se normaliza de forma explícita un puñado de casos
       que hoy se ven claramente fuera de escala (h1 de 32px en
       Mi cuenta / CMS vs. 28px del resto del sitio).
   ============================================================ */

:root {
  /* Escala (desktop) */
  --aui-fs-h1: 1.875rem;    /* 30px  — título de página */
  --aui-fs-h2: 1.375rem;    /* 22px  — título de sección */
  --aui-fs-h3: 1.0625rem;   /* 17px  — subtítulo */
  --aui-fs-h4: 0.9375rem;   /* 15px  — encabezado menor */
  --aui-fs-body: 0.9375rem; /* 15px  — cuerpo */
  --aui-fs-lead: 1.0625rem; /* 17px  — entradilla */
  --aui-fs-small: 0.8125rem;/* 13px  — apoyo */
  --aui-fs-micro: 0.78rem;  /* 12.5px — etiquetas / overline */
  --aui-fs-btn: 0.875rem;   /* 14px  — botones */

  /* Interlineado */
  --aui-lh-tight: 1.2;
  --aui-lh-heading: 1.3;
  --aui-lh-body: 1.6;

  /* Tracking para etiquetas en mayúsculas */
  --aui-tracking-label: 0.04em;
}

@media (max-width: 600px) {
  :root {
    --aui-fs-h1: 1.5rem;    /* 24px */
    --aui-fs-h2: 1.25rem;   /* 20px */
    --aui-fs-lead: 1rem;    /* 16px */
  }
}

/* --- Base no invasiva (especificidad 0) -------------------- */
:where(h1) { font-size: var(--aui-fs-h1); line-height: var(--aui-lh-tight); }
:where(h2) { font-size: var(--aui-fs-h2); line-height: var(--aui-lh-heading); }
:where(h3) { font-size: var(--aui-fs-h3); line-height: var(--aui-lh-heading); }
:where(h4) { font-size: var(--aui-fs-h4); line-height: var(--aui-lh-heading); }
:where(h1, h2, h3, h4) { text-wrap: balance; }

/* Contenido editorial suelto (CMS, RTE, texto de módulos nativos) */
:where(.page-content, .rte-content, .cms-content, .rich-text) :where(p, li) {
  font-size: var(--aui-fs-body);
  line-height: var(--aui-lh-body);
}

/* Etiquetas de formulario nativas */
:where(.form-control-label, .form-group label) {
  font-size: var(--aui-fs-small);
}

/* --- Normalizaciones explícitas (casos fuera de escala) ---- */

/* h1 de páginas de contenido y de la cuenta: 32px → escala */
.page-content h1,
.page-cms .page-content h1,
.page-my-account .page-header h1,
.page-identity .page-header h1,
.page-addresses .page-header h1,
.page-history .page-header h1,
.page-order-detail .page-header h1,
.page-order-slip .page-header h1,
.page-addresses .page-header h1 {
  font-size: var(--aui-fs-h1);
  line-height: var(--aui-lh-tight);
}

/* "También te puede interesar" / accesorios: el <h2.section-title>
   sin regla propia caía al tamaño gigante de Bootstrap */
.product-accessories .section-title,
.crossselling .section-title,
h2.section-title:not([class*="ps-featuredproducts"]) {
  font-size: 24px;
  font-weight: 800;
  line-height: var(--aui-lh-heading);
}
