/* ── 00-tokens.css ── */
/* Tokens de SRC — fuente única (spec C1 §B4). Copiados del Sistema Visual §2 el 24-sep-2026.
   Nadie los usa todavía: C3 irá pasando valores literales a estas variables. */
:root {
  /* Paleta viva (§2.1) */
  --sdei-negro: #000000;
  --sdei-blanco: #ffffff;
  --sdei-gris-texto: #333333;
  --sdei-gris-medio: #666666;
  --sdei-gris-accesible: #767676;
  --sdei-gris-borde: #e2e8f0;
  /* Escala de lectura de página de venta (§2.2) */
  --sdei-texto-h1: clamp(30px, 4.8vw, 48px);
  --sdei-texto-entradilla: 15px;
  --sdei-texto-cuerpo: 14px;
  --sdei-texto-apoyo: 12px;
  --sdei-texto-titulo-seccion: 11px;
  --sdei-texto-etiqueta: 10px;
  /* Tracking (§2.3) */
  --sdei-tracking-display: -0.5px;
  --sdei-tracking-etiqueta: 1.5px;
  --sdei-tracking-seccion: 2px;
  --sdei-tracking-kicker: 3px;
  /* Pesos (§2.4) */
  --sdei-peso-ligero: 300;
  --sdei-peso-normal: 400;
  --sdei-peso-medio: 500;
  --sdei-peso-marcado: 600;
}

/* ── 20-componentes/formulario-iman.css ── */
/* Formulario del imán dentro de su página: fichas de imán (15133 ES, 15164 EN; grupo .sdei-mag-alta) y sus páginas
   de gracias (15269 ES, 15165 EN). Pedido del 25-sep-2026: src-web/PEDIDO-sdei-css-formulario-iman-2026-09-25.md.
   Valores copiados del <style> en línea del pie 13489 ES, que sigue vivo hasta la migración C3. Acotado a
   .sdei-mag-alta: no toca el formulario del pie ni el de /suscribete/. Desviación consciente: placeholder #888 del pie
   → gris accesible (suelo de contraste del Sistema Visual). Las reglas que tocan clases de bloques ajenos están en
   40-plugins/imanes-bloques.css.
   Sin !important: medido el 26-sep en el banco de pruebas (ficha inyectada en /colecciones/ava/, hoja tras la de sdei),
   quitándolos de uno en uno no cambia ningún valor computado, y en :hover/:focus las únicas reglas rivales son de GP,
   sin !important y con menos especificidad. */
.sdei-mag-alta .sdei-magnet-wrapper { font-family: 'Poppins', sans-serif; width: 100%; max-width: 500px; }

.sdei-mag-alta .sdei-input {
  width: 100%;
  padding: 18px;
  border: 1px solid var(--sdei-negro);
  border-radius: 0;
  background: transparent;
  color: var(--sdei-negro);
  font-family: inherit;
  font-size: 13px; /* sdei-permitido: mismo tamaño que el formulario del pie 13489 (en línea hasta C3) */
  text-transform: uppercase;
  letter-spacing: 1px;
  box-sizing: border-box;
  outline: none;
  transition: border-width 0.1s;
}
.sdei-mag-alta .sdei-input::placeholder { color: var(--sdei-gris-accesible); }
/* Foco: GP tiene input[type="text"]:focus (0,2,1) con fondo base-2 y borde contrast-3, que ganaría a la regla base (0,2,0).
   Esta (0,3,0) lo gana sin !important (medido en el banco de pruebas del 26-sep). */
.sdei-mag-alta .sdei-input:focus { border-color: var(--sdei-negro); border-width: 2px; background-color: transparent; color: var(--sdei-negro); }

.sdei-mag-alta .sdei-consent-group { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 25px; }
.sdei-mag-alta .sdei-checkbox {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border: 1px solid var(--sdei-negro);
  border-radius: 0;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
  margin-top: 2px;
}
.sdei-mag-alta .sdei-checkbox:checked { background-color: var(--sdei-negro); }
.sdei-mag-alta .sdei-checkbox:checked::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 10px;
  border: solid var(--sdei-blanco);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.sdei-mag-alta .sdei-consent-label { font-size: var(--sdei-texto-titulo-seccion); line-height: 1.5; color: var(--sdei-negro); cursor: pointer; }
.sdei-mag-alta .sdei-consent-label a { color: var(--sdei-negro); text-decoration: underline; }

.sdei-mag-alta .sdei-btn {
  width: 100%;
  padding: 20px;
  background-color: var(--sdei-negro);
  color: var(--sdei-blanco);
  border: 1px solid var(--sdei-negro);
  border-radius: 0;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: var(--sdei-peso-medio);
  font-size: var(--sdei-texto-apoyo);
  cursor: pointer;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.sdei-mag-alta .sdei-btn:hover { background-color: var(--sdei-blanco); color: var(--sdei-negro); }
.sdei-mag-alta .sdei-btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* Botón de cierre y de descarga: un <a class="sdei-btn">, mismo aspecto que el del formulario. */
.sdei-mag-alta a.sdei-btn { display: block; max-width: 500px; margin: 0 auto; box-sizing: border-box; text-align: center; text-decoration: none; line-height: 1.4; }

/* Textos de apoyo. Con `p.` porque la hoja de colección tiene `.sdei-col-compra p:not([class*="sdei-col-"])` (0,2,1)
   a 14px/#333; a igual especificidad gana esta hoja, que carga después (medido en el banco de pruebas del 25-sep). */
.sdei-mag-alta p.sdei-mag-micro { font-size: var(--sdei-texto-apoyo); line-height: 1.6; color: var(--sdei-gris-accesible); margin: 14px 0 0; }
.sdei-mag-alta p.sdei-mag-recaptcha { font-size: var(--sdei-texto-etiqueta); line-height: 1.5; color: var(--sdei-gris-accesible); margin: 10px 0 0; }
.sdei-mag-alta p.sdei-mag-recaptcha a { color: inherit; text-decoration: underline; }

/* Hero de la ficha de imán (DEC SEO-IMAN-3b): la cabecera pequeña es un <h1> y hereda la tipografía de título del tema
   (medido: Cormorant 10px, line-height 11px). Vuelve a la del cuerpo, como la cabecera <p> de la colección, que no
   cambia: allí .sdei-col-kicker es un <p>. */
h1.sdei-col-kicker { font-family: inherit; line-height: 1.5; }
/* Línea de autora bajo la entradilla (solo en 15133 / 15164). */
.sdei-col-hero p.sdei-mag-autora { font-size: var(--sdei-texto-apoyo); color: var(--sdei-gris-accesible); margin-top: 14px; }

/* Maqueta B (Dani, 25-sep): cabecera en dos columnas core, galería de 3 y botón de cierre. */
.sdei-mag-cabecera { gap: 48px; }
/* El grupo del cierre no es sdei-col-*: su inner-container hereda 30 px de relleno de GP (medido: botón a 240 de 300 px
   a 390). `> div` es ese inner-container (un wp:group tiene un solo hijo). */
.sdei-mag-alta.sdei-mag-cierre > div { padding-left: 0; padding-right: 0; }
.sdei-mag-cierre { margin: 40px 0 56px; }

/* Páginas de gracias (15269 ES, 15165 EN): el titular es un <h1 class="sdei-col-h1"> y el tema lo pone en mayúsculas.
   Acotado a .sdei-mag-alta: la colección AVA también tiene un <h1 class="sdei-col-h1"> y ese SÍ va en mayúsculas
   (la regresión del 26-sep lo cazó con la regla sin acotar). El botón de descarga, alineado a la izquierda. */
.sdei-mag-alta h1.sdei-col-h1 { text-transform: none; }
.sdei-col-hero a.sdei-btn { margin: 28px 0 24px; }

/* ── 40-plugins/core-tabla-texto.css ── */
/* Tabla de TEXTO (bloque core/table con la clase `sdei-tabla-texto`), p. ej. la de grosores de la guía de hilos
   (página 10609, ES y EN). En móvil, la «Matriz de tabla» del Personalizador está pensada para tablas numéricas
   (min-width 600px, nowrap, primera columna fija de 150px, celdas de 85px a 16px y etiqueta «DESLIZAR →»): con texto,
   la tabla medía 1.185px en un marco de 285px. Esta variante la deja caber en el ancho y partir líneas.
   Especificidad: una clase más que el Personalizador, y !important donde él lo usa. El CSS del bloque core
   (.has-fixed-layout td { word-break: break-word }) partía palabras por la mitad: se anula. */
@media (max-width: 767px) {
  /* El scroll horizontal del marco se conserva solo como red en pantallas muy estrechas; sin la etiqueta. */
  figure.wp-block-table.sdei-tabla-texto {
    padding-top: 0 !important;
  }

  figure.wp-block-table.sdei-tabla-texto::before {
    content: none;
  }

  figure.wp-block-table.sdei-tabla-texto table {
    width: 100% !important;
    min-width: 0;
    table-layout: auto !important;
  }

  figure.wp-block-table.sdei-tabla-texto td,
  figure.wp-block-table.sdei-tabla-texto th {
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
    padding: 10px 4px !important;
  }

  figure.wp-block-table.sdei-tabla-texto thead th {
    font-size: var(--sdei-texto-etiqueta) !important;
    letter-spacing: 0;
  }

  figure.wp-block-table.sdei-tabla-texto thead th:first-child,
  figure.wp-block-table.sdei-tabla-texto tbody td:first-child {
    position: static !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 10px 4px !important;
  }

  figure.wp-block-table.sdei-tabla-texto td:not(:first-child),
  figure.wp-block-table.sdei-tabla-texto th:not(:first-child) {
    min-width: 0 !important;
    padding: 10px 4px !important;
    font-size: var(--sdei-texto-apoyo) !important;
  }
}

/* ── 40-plugins/imanes-bloques.css ── */
/* Páginas de imán y pie con el imán: reglas que tienen que nombrar clases de GenerateBlocks o de reCAPTCHA (por eso
   van en esta capa y no en 20-componentes/formulario-iman.css). Pedido del 25-sep-2026:
   src-web/PEDIDO-sdei-css-formulario-iman-2026-09-25.md. */

/* Pie 13489 y /suscribete/ 10088 (versiones de la fase B, 3-oct): el título del bloque del imán (h6 GB 284cd0a2) pasa a
   ser un enlace a la ficha (DEC SEO-IMAN-6). Medido en el banco de pruebas (/tienda/, 25-sep): hereda todo del h6 y no
   se distingue como enlace. El !important es obligado: el pie en línea lleva .site-footer a{text-decoration:none !important}.
   Hoy el <a> no existe → sin efecto. */
.site-footer h6.gb-text-284cd0a2 a:hover,
.site-footer h6.gb-text-284cd0a2 a:focus-visible { text-decoration: underline !important; text-underline-offset: 4px; }

/* Línea bajo la imagen del bloque (GB ee73bab9): sin regla propia sale a 16px/300 negro. Hoy el <p> está vacío en todas
   las páginas: `:not(:empty)` evita que el cambio de tamaño mueva su margen y la altura del pie antes de la fase B. */
.gb-element-ee73bab9 > p:not(:empty) { font-size: var(--sdei-texto-cuerpo); font-weight: var(--sdei-peso-ligero); color: var(--sdei-gris-texto); margin-top: 12px; }

/* Insignia de reCAPTCHA: se oculta porque el texto legal va visible junto al formulario (igual que hace el pie en
   línea). Solo en páginas con el formulario del imán en su contenido: el resto de la web no cambia. */
body:has(.sdei-mag-alta) .grecaptcha-badge { visibility: hidden; }

/* ── 90-sonda (generada) ── */
:root { --sdei-css-activo: "e585f4a6"; }
