/* ============================================================
   EGRENT · Stampa A4
   Nasconde shell/sidebar/topbar. Il contenuto di .route-host
   diventa un documento A4 pulito con header brand + footer.
   Per stampe mirate aggiungi body.print-target-{contract|invoice|damage}.
   ============================================================ */

@page {
  size: A4;
  margin: 18mm 16mm 20mm 16mm;
}

@media print {
  /* Reset generale */
  html, body {
    background: #fff !important;
    color: #000 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* Nasconde cromature dell'app */
  .topbar,
  .sidebar,
  .cmdk,
  .toast,
  .modal-scrim,
  .no-print,
  .page-head .btn,
  .page-head .seg,
  .page-tabs,
  .chevron,
  button {
    display: none !important;
  }

  /* Rendi il layout lineare */
  .app,
  .layout,
  .main,
  .route-host,
  .page-enter {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    position: static !important;
    width: 100% !important;
    background: #fff !important;
  }

  /* Header di stampa: solo la data, valorizzata via JS su document.body.dataset.printDate
     prima di window.print() — niente testo fisso, cosi' non dipende dal progetto/azienda. */
  body::before {
    content: attr(data-print-date);
    display: block;
    font-family: ui-sans-serif, system-ui, sans-serif;
    font-size: 9pt;
    color: #666;
    border-bottom: 1px solid #999;
    padding-bottom: 4mm;
    margin-bottom: 6mm;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  /* Piè di pagina: valorizzato via JS su document.body.dataset.printFooter (es. ragione
     sociale da Setup azienda); vuoto se non impostato, nessun dato d'esempio stampato. */
  body::after {
    content: attr(data-print-footer);
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    font-family: ui-sans-serif, system-ui, sans-serif;
    font-size: 8pt;
    color: #888;
    border-top: 1px solid #ccc;
    padding-top: 3mm;
  }

  /* Titolo pagina */
  .page-head {
    padding: 0 0 6mm 0 !important;
    border: none !important;
    background: transparent !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 12mm !important;
  }
  .page-head h1 {
    font-size: 22pt !important;
    font-weight: 600 !important;
    color: #000 !important;
    letter-spacing: -0.3pt !important;
    margin: 0 !important;
  }
  .page-head .pg-meta {
    font-size: 10pt !important;
    color: #555 !important;
  }
  .page-head .badge {
    display: inline-block !important;
    padding: 2pt 6pt !important;
    border: 1px solid #888 !important;
    background: #fff !important;
    color: #000 !important;
    font-size: 8.5pt !important;
    border-radius: 2pt !important;
  }
  .page-head .bdot { display: none !important; }

  /* Panel → sezioni stampabili */
  .panel {
    border: 1px solid #bbb !important;
    background: #fff !important;
    margin-bottom: 6mm !important;
    page-break-inside: avoid;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  .panel-h {
    background: #f5f5f5 !important;
    border-bottom: 1px solid #bbb !important;
    padding: 3mm 4mm !important;
  }
  .panel-h h3 {
    font-size: 10.5pt !important;
    font-weight: 600 !important;
    color: #000 !important;
    margin: 0 !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
  }
  .panel-h .sub,
  .panel-h .meta {
    font-size: 9pt !important;
    color: #666 !important;
  }

  /* Griglia dettagli */
  .fgrid {
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: 3mm 6mm !important;
    padding: 4mm !important;
  }
  .fgrid .f { padding: 0 !important; }
  .fgrid .c4 { grid-column: span 4; }
  .fgrid .c6 { grid-column: span 6; }
  .fgrid .c12 { grid-column: span 12; }
  .fgrid label {
    font-size: 8pt !important;
    color: #777 !important;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: block;
    margin-bottom: 1mm;
  }
  .fgrid .f > div:last-child {
    font-size: 10pt !important;
    color: #000 !important;
  }

  /* KPI */
  .kpi {
    border: 1px solid #bbb !important;
    background: #fafafa !important;
    padding: 3mm !important;
    border-radius: 0 !important;
  }
  .kpi-l { font-size: 8pt !important; color: #666 !important; text-transform: uppercase; }
  .kpi-v { font-size: 14pt !important; font-weight: 600 !important; color: #000 !important; }
  .kpi-d { font-size: 8pt !important; color: #666 !important; }

  /* Tabelle */
  table.tbl, table.li-tbl {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 9pt !important;
    page-break-inside: auto;
  }
  table.tbl thead, table.li-tbl thead { display: table-header-group; }
  table.tbl tr, table.li-tbl tr { page-break-inside: avoid; }
  table.tbl th, table.tbl td,
  table.li-tbl th, table.li-tbl td {
    border-bottom: 1px solid #ddd !important;
    padding: 2mm 3mm !important;
    color: #000 !important;
    background: transparent !important;
  }
  table.tbl th, table.li-tbl th {
    background: #f0f0f0 !important;
    text-transform: uppercase;
    font-size: 8pt !important;
    letter-spacing: 0.05em;
    font-weight: 600 !important;
    border-bottom: 1.5pt solid #666 !important;
  }
  .mono, .id { font-family: ui-monospace, monospace !important; }

  /* Dettaglio pagina interna: grid a 1 colonna in stampa */
  [style*="grid-template-columns"] {
    display: block !important;
  }

  /* Stato/badge monocromatici */
  .badge {
    background: #fff !important;
    color: #000 !important;
    border: 1px solid #888 !important;
    padding: 1pt 4pt !important;
    font-size: 8.5pt !important;
    font-weight: 500 !important;
  }

  /* Sparkbar diventa riga semplice */
  .sparkbar {
    height: 2pt !important;
    background: #eee !important;
  }
  .sparkbar span {
    background: #333 !important;
  }

  /* Evita page break dentro firma/totali */
  .totals, .signature-box { page-break-inside: avoid; }

  /* Page breaks utili */
  .page-break { page-break-before: always; }
  h1, h2, h3 { page-break-after: avoid; }

  /* Nasconde scroll */
  * { overflow: visible !important; }

  /* Colonna laterale del dettaglio contratto */
  [style*="340px"] > div:last-child {
    margin-top: 6mm;
  }
}