/**
 * Contenido del editor de bloques.
 *
 * El diseño aprobado no tenía páginas de texto largo, así que su CSS no define estilos para
 * listas, citas ni tablas: toda su tipografía es de clase y la aplican los templates. Cuando el
 * cliente crea una página por su cuenta —una política de privacidad, un texto curatorial— el
 * editor produce esos elementos sin clase y saldrían con la tipografía del navegador.
 *
 * Este archivo cubre solo lo que el editor puede generar y el diseño no contemplaba. Los
 * párrafos y encabezados no están aquí: los marca `nuka_clases_contenido()` con las clases del
 * diseño, para que una página nueva se vea igual que las páginas maquetadas a mano.
 *
 * Va aparte del CSS del diseño por la misma razón que formulario.css: ese CSS es el contrato que
 * el tema reproduce y no se toca.
 */

/* Medida de lectura. Un texto legal a todo el ancho del contenedor es ilegible. */
.nuka-contenido {
  max-width: 68ch;
}

/* --- Listas --- */

.nuka-contenido ul,
.nuka-contenido ol {
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: 1.7;
  color: var(--color-text);
  margin-bottom: var(--space-lg);
  padding-left: var(--space-lg);
}

.nuka-contenido ul {
  list-style: square;
}

.nuka-contenido ol {
  list-style: decimal;
}

.nuka-contenido li {
  margin-bottom: var(--space-xs);
}

.nuka-contenido li::marker {
  color: var(--color-accent);
}

/* Listas anidadas: sin margen inferior extra, ya lo aporta el elemento padre. */
.nuka-contenido li > ul,
.nuka-contenido li > ol {
  margin-top: var(--space-xs);
  margin-bottom: 0;
}

/* --- Enlaces dentro del texto --- */

.nuka-contenido a {
  color: var(--color-text);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--color-accent);
  transition: color var(--transition-fast);
}

.nuka-contenido a:hover,
.nuka-contenido a:focus-visible {
  color: var(--color-accent);
}

/* --- Cita --- */

.nuka-contenido blockquote {
  margin: var(--space-xl) 0;
  padding-left: var(--space-lg);
  border-left: 2px solid var(--color-accent);
}

.nuka-contenido blockquote p:last-child {
  margin-bottom: 0;
}

/* --- Separador --- */

.nuka-contenido hr {
  border: 0;
  border-top: 1px solid var(--color-border);
  margin: var(--space-2xl) 0;
}

/* --- Tabla --- */

.nuka-contenido table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body);
  font-size: var(--text-small);
  margin-bottom: var(--space-lg);
}

.nuka-contenido th,
.nuka-contenido td {
  text-align: left;
  padding: var(--space-sm);
  border-bottom: 1px solid var(--color-border);
}

.nuka-contenido th {
  font-family: var(--font-display);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* El primer encabezado de la página no necesita separarse del borde superior: el hero ya
   aporta el aire. Los siguientes sí, para agrupar cada sección con su texto. */
.nuka-contenido > :is(h2, h3, h4) {
  margin-top: var(--space-2xl);
}

.nuka-contenido > :is(h2, h3, h4):first-child {
  margin-top: 0;
}