/* =============================================================================
   ACENCY — SISTEMA VISUAL DE LA WEB PÚBLICA (acency-legal.web.app)
   =============================================================================

   Única fuente de verdad visual de `public/`. Cada página la enlaza y, en su
   propio <style>, solo ADAPTA su estructura (sus clases) a estos tokens.

   ── Reglas (las vigila test/arquitectura/web_publica_tema_test.dart) ─────────
   · Los colores son ESPEJO de lib/core/constantes.dart: cada token lleva en su
     comentario el nombre Dart del que sale y el test exige que el hex coincida.
     Se usan los valores `…Fijo` (tema claro): la app tiene el oscuro apagado
     (`kModoOscuroHabilitado = false`) y abre estas páginas con fondo blanco.
   · Ningún <style> de página escribe un color literal: solo var(--ac-…).
     Los ÚNICOS literales de color de la web viven en este archivo.
   · El turquesa de marca (#29DBCB) NO es color de texto sobre blanco (1.9:1,
     reprueba WCAG). Para texto, enlaces y foco: --ac-primario-texto (5.2:1).
   · Cambiar este archivo = renombrarlo a -v2.css y actualizar los <link>
     (se sirve con caché `immutable` de un año, ver firebase.json).

   ── Restricciones del entorno ───────────────────────────────────────────────
   · CSP `default-src 'self'`: nada de fuentes ni CSS externos, nada de @import.
     Letra del sistema = Roboto en Android, la misma que pinta la app.
   · El WebView de la app tiene JavaScript APAGADO: nada aquí depende de JS.
   · CSS de 2020 (sin anidamiento, :has() ni color-mix()) para WebViews viejos.

   ── Tamaños de letra ────────────────────────────────────────────────────────
   Decisión del titular (21-oct-2026): cuerpo 16 px en celular y 17 px en PC.
   Cada rol quedó ≥ al tamaño MÁS GRANDE que tenía en cualquier documento
   antes de unificar: ningún texto legal se ve más chico que antes.
   ========================================================================== */

:root {
  /* ── Marca ── */
  --ac-primario: #29DBCB;          /* kPrimary */
  --ac-primario-hondo: #1BC5B6;    /* kPrimaryDeep */
  --ac-primario-texto: #0B7A71;    /* kPrimaryTextoFijo */

  /* ── Texto ── */
  --ac-negro: #1A1A1A;             /* kBlackFijo */
  --ac-gris-oscuro: #616161;       /* kGrayDarkFijo */
  --ac-texto-tenue: #6B6B6B;       /* kTextoTenueFijo */
  --ac-gris-medio: #BDBDBD;        /* kGrayMidFijo (solo bordes/decoración, NUNCA texto) */

  /* ── Superficies ── */
  --ac-fondo: #F5F6F8;             /* kFondoAppFijo */
  --ac-superficie: #FFFFFF;        /* kSuperficieFijo */
  --ac-superficie-suave: #F9FAFB;  /* kSuperficieSuaveFijo */
  --ac-gris-claro: #F2F2F2;        /* kGrayLightFijo */
  --ac-borde: #E0E0E0;             /* kBordeFijo */
  --ac-divisor: #EDEDED;           /* kDivisorFijo */

  /* ── Semánticos (relleno/borde) ── */
  --ac-error: #F44336;             /* kError */
  --ac-aviso: #FF9800;             /* kWarning */
  --ac-exito: #4CAF50;             /* kSuccess */
  --ac-info: #42A5F5;              /* kInfo */

  /* ── Semánticos (texto, ≥ 4.5:1 sobre blanco) ── */
  --ac-error-texto: #C62828;       /* kErrorTextoFijo */
  --ac-aviso-texto: #AD4F08;       /* kWarningOscuroFijo */
  --ac-exito-texto: #2A752E;       /* kSuccessOscuroFijo */
  --ac-morado-texto: #5E35B1;      /* kMoradoTextoFijo */

  /* ── Tintes de fondo (los alfa que usa la app: 0.06–0.12 del token) ── */
  --ac-tinte-primario: rgba(41, 219, 203, 0.08);
  --ac-tinte-primario-fuerte: rgba(41, 219, 203, 0.14);
  --ac-tinte-error: rgba(244, 67, 54, 0.06);
  --ac-tinte-aviso: rgba(255, 152, 0, 0.08);
  --ac-tinte-exito: rgba(76, 175, 80, 0.08);
  --ac-tinte-info: rgba(66, 165, 245, 0.08);
  --ac-seleccion: rgba(41, 219, 203, 0.28);
  --ac-sombra: 0 1px 2px rgba(26, 26, 26, 0.04), 0 8px 24px -16px rgba(26, 26, 26, 0.18);

  /* ── Tipografía ── */
  --ac-fuente: Roboto, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --ac-fuente-mono: ui-monospace, "Roboto Mono", Menlo, Consolas, "Courier New", monospace;
  --ac-tx-cuerpo: 16px;    /* texto de las cláusulas */
  --ac-tx-recuadro: 15px;  /* avisos, recuadros, índice, notas al pie de documento */
  --ac-tx-tabla: 14px;
  --ac-tx-nota: 13px;      /* metadatos, fechas, pie */
  --ac-tx-rotulo: 12px;    /* rótulos en MAYÚSCULAS */
  --ac-tx-codigo: 13px;
  --ac-tx-h1: 26px;
  --ac-tx-parte: 20px;     /* separadores de parte / título de artículo */
  --ac-tx-h3: 18px;
  --ac-tx-h4: 16px;
  --ac-alto-linea: 1.6;
  --ac-peso-titulo: 800;   /* kPesoTitulo */
  --ac-peso-fuerte: 700;

  /* ── Forma ── */
  --ac-radio: 16px;        /* tarjetas */
  --ac-radio-chico: 10px;  /* recuadros, chips, tablas */
  --ac-ancho: 920px;       /* ancho de lectura del documento */
  --ac-ancho-amplio: 1180px; /* documentos con índice lateral */
  --ac-gutter: 16px;

  color-scheme: light;
}

/* Títulos: crecen desde tableta (601 px), donde los documentos originales ya
   los agrandaban. */
@media (min-width: 601px) {
  :root {
    --ac-tx-h1: 34px;
    --ac-tx-parte: 24px;
    --ac-tx-h3: 19px;
  }
}
/* Texto corrido: 17 px solo en PC (decisión del titular). */
@media (min-width: 921px) {
  :root {
    --ac-tx-cuerpo: 17px;
    --ac-tx-recuadro: 16px;
    --ac-tx-tabla: 15px;
    --ac-gutter: 32px;
  }
}

/* =============================================================================
   BASE — elementos sueltos. Las páginas lo afinan desde su adaptador.
   ========================================================================== */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

body {
  margin: 0;
  background: var(--ac-fondo);
  color: var(--ac-negro);
  font-family: var(--ac-fuente);
  font-size: var(--ac-tx-cuerpo);
  line-height: var(--ac-alto-linea);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-wrap: break-word;
}

::selection { background: var(--ac-seleccion); color: var(--ac-negro); }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ac-fuente);
  color: var(--ac-negro);
  line-height: 1.25;
}

strong, b { font-weight: var(--ac-peso-fuerte); }

a { color: var(--ac-primario-texto); text-decoration: underline; text-underline-offset: 2px; }
a:hover { color: var(--ac-negro); }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 2px solid var(--ac-primario-texto);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Igual que el texto que lo rodea: así nunca queda más chico que el párrafo. */
code, kbd, samp, pre { font-family: var(--ac-fuente-mono); font-size: 1em; }
code {
  background: var(--ac-gris-claro);
  border: 1px solid var(--ac-borde);
  border-radius: 6px;
  padding: 1px 6px;
  color: var(--ac-negro);
  overflow-wrap: anywhere;
}

hr { border: none; border-top: 1px solid var(--ac-divisor); }

/* Correos, CLABE, URLs y RFC largos no rompen el ancho del celular. */
td, th, li, p, dd { overflow-wrap: anywhere; }

img, svg { max-width: 100%; }

/* =============================================================================
   COMPONENTES COMPARTIDOS — usados tal cual por index.html, 404.html y
   Cookies; las demás páginas reproducen el mismo aspecto con sus clases.
   ========================================================================== */

/* Cabecera blanca como la barra de la app, con franja turquesa. */
.ac-cabecera,
body > header {
  background: var(--ac-superficie);
  border-top: 4px solid var(--ac-primario);
  border-bottom: 1px solid var(--ac-borde);
}

/* Tarjeta blanca de la app. */
.ac-tarjeta {
  background: var(--ac-superficie);
  border: 1px solid var(--ac-borde);
  border-radius: var(--ac-radio);
  box-shadow: var(--ac-sombra);
}

/* =============================================================================
   IMPRESIÓN — copia en papel / PDF del documento (derecho del usuario a
   conservarlo). Cada página conserva SU conjunto de elementos ocultos al
   imprimir; aquí no se oculta nada.
   ========================================================================== */
@media print {
  :root { --ac-tx-cuerpo: 11.5pt; --ac-tx-recuadro: 11pt; --ac-tx-tabla: 10pt; --ac-tx-nota: 9.5pt; --ac-tx-rotulo: 9pt; --ac-tx-codigo: 9.5pt; --ac-tx-h1: 20pt; --ac-tx-parte: 15pt; --ac-tx-h3: 13pt; --ac-tx-h4: 12pt; }
  body { background: #FFFFFF; color: #000000; line-height: 1.45; }
  a { color: #000000; }
  body > header, .ac-cabecera { border-bottom-color: #000000; }
  .ac-tarjeta { box-shadow: none; }
  table, blockquote, pre { break-inside: avoid; }
  h1, h2, h3, h4 { break-after: avoid; }
  @page { margin: 18mm 16mm; }
}
