/* ============================================================
   CiberGantt — Hoja de impresión

   El «Imprimir / Exportar PDF» que había sólo ocultaba la
   navegación. El cronograma mide miles de píxeles de ancho y al
   imprimirlo salía la columna de tareas y el trozo de línea de
   tiempo que cupiera; el resto se perdía.

   Aquí se hace lo que faltaba:

     · hoja apaisada, que es la forma de un Gantt;
     · se sueltan los contenedores con scroll, para que el
       contenido entero cuente como contenido y no como algo
       recortado;
     · el panel izquierdo pasa a su versión compacta, que libera
       316 px para el cronograma;
     · y lo que aún sobresalga se reduce con una escala que
       calcula el JS antes de abrir el diálogo, en --cg-print-k.

   La escala va en una variable y no en un valor fijo porque
   depende del proyecto: uno de tres meses y otro de dos años no
   necesitan lo mismo.
   ============================================================ */

@media print {

  @page {
    size: A4 landscape;
    margin: 10mm;
  }

  /* ---------- Lo que no va al papel ---------- */

  .cg-noprint,
  #cg-sync, #cg-usuario, #cg-login, #cg-admin, #cg-cuenta,
  .cg-rail, .cg-side, .cg-toasts,
  .cg-subbar__acciones, .cg-toolbar { display: none !important; }

  /* ---------- El armazón deja de ser una pantalla ---------- */

  html, body { height: auto !important; overflow: visible !important; background: #fff !important; }
  .cg-app, .cg-body, .cg-main { height: auto !important; overflow: visible !important; display: block !important; }
  .cg-view { display: none !important; }
  .cg-view.is-active { display: block !important; height: auto !important; overflow: visible !important; }

  /* Cualquier caja con scroll pasa a mostrar todo su contenido. */
  .cg-scroll, .cg-gantt, .cg-gantt__panes,
  .cg-left, .cg-right, .cg-timehead, .cg-timebody {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }

  /* ---------- Encabezado de la hoja ---------- */

  .cg-print-head { display: block !important; margin: 0 0 10px; }
  .cg-print-head h1 { margin: 0; font-size: 15px; font-weight: 700; }
  .cg-print-head .cg-print-sub { font-size: 11px; color: #5a6779; }

  /* ---------- Cronograma ---------- */

  /* El panel izquierdo va compacto: en papel no hacen falta todas
     las columnas, y lo que libera se lo lleva la línea de tiempo. */
  .cg-left { width: var(--cg-left-w-compact) !important; }
  .cg-c-badges, .cg-c-people, .cg-c-progress { display: none !important; }

  /* La reducción la calcula el JS y la deja en --cg-print-k. */
  .cg-gantt__panes {
    transform: scale(var(--cg-print-k, 1));
    transform-origin: top left;
    width: calc(100% / var(--cg-print-k, 1));
  }

  /* Sin scroll, los dos paneles tienen que quedar pegados. */
  .cg-gantt__panes { display: flex !important; }
  .cg-left, .cg-right { flex: none !important; }
  .cg-right { width: auto !important; }

  /* Las filas no se parten por la mitad entre dos páginas. */
  .cg-lrow, .cg-row, .cg-feed__item, tr { break-inside: avoid; page-break-inside: avoid; }
  thead { display: table-header-group; }   /* la cabecera se repite */

  /* ---------- RACI y demás tablas ---------- */

  .cg-raci, .cg-table { width: auto !important; }
  .cg-raci-envoltura {
    transform: scale(var(--cg-print-k, 1));
    transform-origin: top left;
  }
  .cg-raci__key { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

  /* ---------- Que los colores salgan ---------- */

  .cg-bar, .cg-bar__fill, .cg-ms, .cg-dot, .cg-meter, .cg-meter__fill,
  .cg-avatar, .cg-pill, .cg-raci__key, .cg-per__rol {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* El fin de semana y el festivo se ven en papel como en pantalla. */
  .cg-wknd, .cg-hol { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Fuera de la impresión, el encabezado de la hoja no existe. */
.cg-print-head { display: none; }

/* ---------- Imprimir sólo el código QR de una invitación ----------
   Se activa poniendo data-cg-imprimir="qr" en <html>, que hace
   js/personas.js justo antes de llamar a print(). Todo lo demás se
   esconde: es una hoja para entregar en mano, no una captura de la
   aplicación. */

html[data-cg-imprimir="qr"] .cg-qr-hoja { display: block; }

@media print {
  html[data-cg-imprimir="qr"] #cg-root,
  html[data-cg-imprimir="qr"] .cg-modal,
  html[data-cg-imprimir="qr"] .cg-toasts { display: none !important; }

  html[data-cg-imprimir="qr"] .cg-qr-hoja {
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: absolute;
    inset: 0;
    background: #fff;
    color: #000;
  }

  html[data-cg-imprimir="qr"] .cg-qr-hoja__caja svg {
    width: 320px;
    height: 320px;
  }
}