/* print.css — Hoja de impresión.
   A4, legible en blanco y negro, cuerpo >=12pt, sin fondos ni color.
   El uso de !important aquí está justificado: fuerza el blanco y negro y
   anula los estilos de pantalla al imprimir. */

@page {
  size: A4 portrait;
  margin: 1.2cm 1.3cm;
}

@media print {
  *,
  *::before,
  *::after {
    box-shadow: none !important;
    text-shadow: none !important;
  }

  /* El papel no tiene tema: siempre blanco y negro, pase lo que pase. */
  :root,
  :root[data-tema="oscuro"] {
    --fondo: #fff !important;
    --fondo-suave: #fff !important;
    --texto: #000 !important;
    --texto-suave: #000 !important;
    --acento: #000 !important;
    --acento-oscuro: #000 !important;
    --sobre-acento: #fff !important;
    --borde: #000 !important;
    --borde-fuerte: #000 !important;
    --foco: #000 !important;
    --atencion: #000 !important;
    --enlace-visitado: #000 !important;
  }

  html,
  body {
    background: #fff !important;
    color: #000 !important;
    font-size: 12pt;
    line-height: 1.35;
    text-align: left;
    font-synthesis: none; /* sin negritas ni cursivas sintetizadas al imprimir */
  }

  /* Elementos de pantalla que no aportan en papel. */
  .salto,
  .nav,
  .recordatorio,
  .tema,
  noscript,
  .boton,
  [hidden] {
    display: none !important;
  }

  .cabecera {
    background: #fff !important;
    color: #000 !important;
    border-bottom: 2pt solid #000;
    padding: 0 0 4pt;
  }

  .cabecera .marca {
    font-size: 9pt;
  }

  .cabecera .contexto {
    font-weight: 700;
    font-size: 11pt;
  }

  /* El contenido principal siempre visible (nunca se oculta main). */
  main {
    max-width: none;
    padding: 0;
  }

  h1 {
    font-size: 18pt;
    margin: 4pt 0 3pt;
    break-after: avoid;
  }

  h2 {
    font-size: 14pt;
    margin: 10pt 0 4pt;
    padding-bottom: 1pt;
    border-bottom: 1.5pt solid #000;
    break-after: avoid;
  }

  h3 {
    font-size: 12pt;
    margin: 0 0 2pt;
    break-after: avoid;
  }

  p,
  li {
    orphans: 3;
    widows: 3;
  }

  .entradilla {
    font-size: 12pt;
    margin: 2pt 0 5pt;
    color: #000 !important;
  }

  /* Resumen en negro sobre blanco: las impresoras no imprimen fondos. */
  .resumen {
    background: #fff !important;
    color: #000 !important;
    border: 1.5pt solid #000;
    border-radius: 4pt;
    padding: 4pt 6pt;
    font-size: 12pt;
    margin: 4pt 0 6pt;
    break-inside: avoid;
  }

  .resumen strong {
    color: #000 !important;
  }

  /* Fechas: dos columnas, grandes pero contenidas. */
  .rejilla-fechas {
    display: flex;
    gap: 8pt;
  }

  .fecha {
    flex: 1 1 50%;
    border: 1.5pt solid #000;
    border-radius: 4pt;
    background: #fff !important;
    padding: 4pt 6pt;
    break-inside: avoid;
  }

  .fecha .etiqueta {
    font-size: 9pt;
    color: #000;
  }

  .fecha .dia {
    font-size: 18pt;
    line-height: 1;
    color: #000;
  }

  .fecha .anio {
    font-size: 11pt;
    margin: 0 0 1pt;
  }

  .fecha .aclaracion,
  .nota-fechas,
  .fuente-fechas {
    font-size: 10pt;
  }

  /* Listas de pasos: no se cortan entre páginas. */
  .pasos,
  .avisos {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .pasos > li,
  .avisos > li {
    padding: 0 0 0 16pt;
    margin: 0 0 5pt;
    border: none;
    position: relative;
    break-inside: avoid;
  }

  .pasos > li::before,
  .avisos > li::before,
  .plan-preguntas > li::before {
    content: counter(paso);
    position: absolute;
    left: 0;
    top: 1pt;
    width: 12pt;
    height: 12pt;
    background: #000 !important;
    color: #fff !important;
    border-radius: 50%;
    font-size: 8pt;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .plazo {
    font-weight: 700;
    color: #000 !important;
    border-left: 2pt solid #000 !important;
    padding-left: 4pt;
  }

  .base-legal {
    font-size: 10pt;
    color: #000;
  }

  /* Checklist «Prepara tu voto»: líneas continuas para escribir a mano. */
  .plan-preguntas {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .plan-preguntas > li {
    padding: 0 0 0 16pt;
    margin: 0 0 8pt;
    position: relative;
    break-inside: avoid;
  }

  .plan-linea {
    display: block;
    min-height: 22pt;
    margin-top: 2pt;
    border-bottom: 1pt solid #000;
  }

  .aviso,
  .atencion {
    background: #fff !important;
    color: #000 !important;
    border: 1.5pt solid #000;
    border-left-width: 4pt;
    border-radius: 4pt;
    padding: 3pt 6pt;
    break-inside: avoid;
  }

  .atencion strong,
  .atencion h2,
  .atencion h3 {
    color: #000 !important;
  }

  .datos {
    width: 100%;
    border-collapse: collapse;
    break-inside: avoid;
  }

  .datos caption {
    text-align: left;
    font-weight: 700;
  }

  .datos th,
  .datos td {
    border: 1pt solid #000;
    padding: 3pt 4pt;
    text-align: left;
  }

  .datos thead th {
    background: #fff !important;
    color: #000 !important;
  }

  /* En papel la tabla vuelve a ser tabla: nunca el apilado de pantalla. */
  .datos {
    display: table !important;
  }

  .datos > thead {
    display: table-header-group !important;
    position: static !important;
    left: auto !important;
  }

  .datos > tbody {
    display: table-row-group !important;
  }

  .datos > thead > tr,
  .datos > tbody > tr {
    display: table-row !important;
  }

  .datos th,
  .datos td {
    display: table-cell !important;
  }

  .datos td::before {
    content: none !important;
  }

  /* Puertas de la portada: cajas negras sobre blanco. */
  .puertas,
  .claves {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .puerta,
  .claves > li {
    border: 1.5pt solid #000;
    background: #fff !important;
    color: #000 !important;
    padding: 4pt 6pt;
    margin: 0 0 5pt;
    break-inside: avoid;
  }

  .puerta-titulo,
  .puerta-texto {
    color: #000 !important;
  }

  details {
    border: none;
    padding: 0;
    margin: 0 0 3pt;
    break-inside: avoid;
  }

  summary {
    min-height: 0;
    font-size: 11pt;
    font-weight: 700;
    padding: 0;
    display: list-item;
  }

  details p {
    font-size: 10pt;
    margin: 0 0 3pt 12pt;
  }

  /* Enlaces: negro subrayado y, si son externos, con su URL a la vista. */
  a {
    color: #000 !important;
    text-decoration: underline;
  }

  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    word-break: break-all;
  }

  /* Un enlace tel: no sirve en papel: el número se imprime como texto normal. */
  .tel,
  .tel-texto {
    display: inline !important;
    min-height: 0;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    color: #000 !important;
    font-weight: 700;
    text-decoration: none !important;
    white-space: normal;
  }

  .tel .icono {
    display: none !important;
  }

  .pie {
    border-top: 1.5pt solid #000;
    padding: 3pt 0 0;
    break-inside: avoid;
  }

  .privacidad {
    font-size: 10pt;
  }

  .legal {
    font-size: 9pt;
    margin: 0;
  }
}