/* ==================================================================
 * print.css — Tarjetas Didácticas. Reglas @media print.
 *
 * Estrategia:
 *   - Al imprimir, ocultamos TODO excepto el panel de vista previa
 *     (las hojas de tarjetas).
 *   - Las páginas marcadas con .pagina-tarjetas--salto provocan
 *     un salto de página real.
 *   - Cada .pagina-tarjetas se imprime ocupando casi toda la hoja,
 *     manteniendo la correspondencia de cuadrícula entre anverso
 *     y reverso (ambos usan el mismo número de columnas/filas
 *     y el mismo orden de pares).
 * ================================================================== */

@media print {
  /* Ocultar todo por defecto */
  body * { visibility: hidden; }

  /* Mostrar solo el contenido del panel de vista previa */
  .panel-vista-previa,
  .panel-vista-previa * { visibility: visible; }

  /* Posicionar el panel de vista previa al inicio de la página */
  .panel-vista-previa {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0;
    padding: 0;
    border: none;
    box-shadow: none;
    min-height: 0;
  }

  /* Ocultar elementos de UI dentro del panel */
  .cali-previa-barra,
  .cali-estado,
  .acciones-exportacion,
  .instrucciones-impresion,
  .estado-vacio {
    display: none !important;
  }

  /* Reset visual del contenedor de vista previa */
  .contenedor-previa {
    border: none;
    background: none;
    padding: 0;
    max-height: none;
    overflow: visible;
  }
  .vista-previa {
    margin: 0;
    padding: 0;
  }

  .bloque-set__titulo {
    font-size: 14pt;
    color: #000;
    background: transparent;
    padding: 0 0 6pt 0;
    margin: 0 0 8pt 0;
    border-bottom: 1pt solid #999;
  }

  .bloque-set__titulo--salto {
    page-break-before: always;
    break-before: page;
    margin-top: 0;
  }

  .pagina-tarjetas {
    border: none;
    padding: 0;
    margin: 0;
    border-radius: 0;
    background: #fff;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .pagina-tarjetas--salto {
    page-break-before: always;
    break-before: page;
    margin-top: 0;
  }

  .pagina-tarjetas--salto::before {
    /* No mostrar el indicador visual de salto en impresión */
    display: none;
  }

  .pagina-tarjetas__encabezado {
    font-size: 10pt;
    color: #444;
    margin: 0 0 6pt 0;
    padding: 0 0 3pt 0;
    border-bottom: 0.5pt solid #999;
  }

  /* La cuadrícula se imprime con dimensiones de hoja real.
     Importante: mismas dimensiones en anverso y reverso. */
  .tarjetas-grid {
    aspect-ratio: auto;
    height: calc(100vh - 60pt);
    border: 0.5pt solid #ccc;
    padding: 2mm;
    gap: 2mm;
  }

  .tarjeta-flashcard {
    border: 0.5pt dashed #666;
    background: #fff !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .tarjeta-flashcard--vacia {
    background: #fff !important;
    border: none;
  }

  .tarjeta-flashcard__contenido {
    font-size: 11pt;
    color: #000;
  }

  .tarjeta-flashcard--reverso .tarjeta-flashcard__contenido {
    font-size: 10pt;
  }

  .tarjeta-flashcard__referencia {
    font-size: 7pt;
    color: #000;
    background: #fff !important;
  }

  /* Pie y encabezado del sitio fuera */
  .encabezado, .pie, .panel-configuracion, .cali-panel,
  .tool-sidebar, .tool-seo-content, .site-footer {
    display: none !important;
  }

  @page {
    size: A4 portrait;
    margin: 12mm;
  }
}