/**
 * @file src/styles/print.css
 * @description Estilos de impressão para o BaZi PWA — @media print completo.
 *              Alinhado à spec docs/PDF_SPEC.md e ao DS v2.5 "Quiet Luxury Tupiniquim".
 *
 * MIGRAÇÃO v1.0 → v1.1 (Março 2026):
 *   Paleta v2.3 removida. Todos os valores hex migrados para DS v2.5:
 *   - bg:    #F7F4F0 (v2.3) → #F6F3ED  (var(--color-bg))
 *   - ink:   #1A1A2E (v2.3) → #1E1B15  (var(--color-text))
 *   - gold:  #B8860B (v2.3) → #967438  (var(--color-gold))
 *   - muted: #718096 (v2.3) → #7C7264  (var(--color-text-muted))
 *   - dim:   #5A5870 (v2.3) → #4C4538  (var(--color-text-secondary))
 *   Wu Xing migrado para valores v2.5 canônicos (--element-*-base).
 *
 * NOTA: @media print não herda custom properties em todos os UA —
 *   os valores são declarados como fallback literal inline, mas
 *   precedidos por var() para consistência com tokens.css.
 *   DEPENDÊNCIA: tokens.css carregado antes deste arquivo.
 *
 * @persona  Isabela Mont + Maya Chen — REQ-08
 * @version  1.1.0  (DS v2.5)
 * @sprint   S3·W1
 */


/* ═══════════════════════════════════════════════════════════════════════════
   VARIÁVEIS LOCAIS DE PRINT — espelham tokens.css v2.5 como valores fixos.
   Garantia para UAs que não propagam custom properties em @media print.
   ═══════════════════════════════════════════════════════════════════════════ */

@media print {
  :root {
    /* Superfícies v2.5 */
    --pdf-bg:          #F6F3ED;   /* --color-bg   */
    --pdf-surface:     #FDFCF9;   /* --color-surface */
    --pdf-subtle:      #EDE9E0;   /* --color-subtle */

    /* Texto v2.5 */
    --pdf-ink:         #1E1B15;   /* --color-text */
    --pdf-ink-sec:     #4C4538;   /* --color-text-secondary */
    --pdf-ink-muted:   #7C7264;   /* --color-text-muted */
    --pdf-ink-dim:     #ACA090;   /* --color-text-dim */

    /* Ouro v2.5 */
    --pdf-gold:        #967438;   /* --color-gold */
    --pdf-gold-border: rgba(150,116,56,0.20); /* --color-gold-border */
    --pdf-gold-bg:     rgba(150,116,56,0.06); /* --color-gold-bg ×0.75 */
    --pdf-gold-rule:   rgba(150,116,56,0.25); /* divisores */

    /* Wu Xing v2.5 — valores base canônicos */
    --pdf-water:  #2652A8;   /* --element-water-base */
    --pdf-wood:   #147A48;   /* --element-wood-base  */
    --pdf-fire:   #D3232E;   /* --element-fire-base  */
    --pdf-earth:  #B87C14;   /* --element-earth-base */
    --pdf-metal:  #848484;   /* --element-metal-base */

    /* Feedback v2.5 */
    --pdf-success: #2E7D52;  /* --color-feedback-success */
    --pdf-error:   #8C3030;  /* --color-feedback-error   */
  }
}


/* ═══════════════════════════════════════════════════════════════════════════
   @PAGE — Configuração da página física
   ═══════════════════════════════════════════════════════════════════════════ */

@page {
  size: 210mm 297mm portrait;   /* A4 portrait */
  margin: 20mm;
}

@page :first {
  margin: 20mm;
}


/* ═══════════════════════════════════════════════════════════════════════════
   @MEDIA PRINT — Regras globais
   ═══════════════════════════════════════════════════════════════════════════ */

@media print {

  /* Preservação de cor — crítico para Wu Xing badges */
  *,
  *::before,
  *::after {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Reset de animações */
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }

  /* Base de página — v2.5 */
  html,
  body {
    background: var(--pdf-bg, #F6F3ED) !important;
    color: var(--pdf-ink, #1E1B15) !important;
    font-family: 'Noto Sans', 'Helvetica Neue', Arial, sans-serif;
    font-size: 10pt;
    line-height: 1.6;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  /* Tipografia de impressão — sem bold (regra cardinal DS v2.5) */
  h1, h2, h3, h4, h5, h6,
  .sec-label,
  .pdf-section-title {
    font-family: 'Lora', Georgia, serif;
    font-size: 18pt;
    font-weight: 400;
    color: var(--pdf-ink, #1E1B15);
    margin-bottom: 4mm;
    padding-bottom: 2mm;
    border-bottom: 1px solid var(--pdf-gold-rule, rgba(150,116,56,0.25));
    page-break-after: avoid;
  }

  .cjk,
  .bazi-pillar__char,
  .p-char {
    font-family: 'Noto Serif SC', 'SimSun', serif;
    font-size: 14pt;
    font-style: normal;   /* CJK nunca em itálico — DS v2.5 */
  }

  .mono,
  .bazi-pillar__pinyin,
  .bazi-pillar__label,
  .p-py,
  .luck-py,
  .ic-title {
    font-family: 'JetBrains Mono', 'Courier New', monospace;
    font-size: 8pt;
    font-style: normal;   /* Mono nunca em itálico — DS v2.5 */
  }

  .pdf-legend,
  .print-legend {
    font-size: 8pt;
    font-style: italic;
    color: var(--pdf-ink-muted, #7C7264);
  }


  /* ═══════════════════════════════════════════════════════════════════════
     OCULTAR — Elementos de UI não relevantes para impressão
     ═══════════════════════════════════════════════════════════════════════ */

  header, nav, .topbar, .topbar-inner,
  footer:not(.pdf-footer),
  #calcForm, .form-section, .form-row,
  .btn, .calcBtn, #calcBtn,
  .pdf-export-btn, #pdfExportBtn,
  .btn-voltar-natal, #_btnVoltarNatal,
  button:not(.print-only),
  .sw-update-bar, #_errBanner, .err,
  .print-bar, .print-btn, .print-hint,
  #emptyState, .empty-state,
  #_shimmerWrap, .is-loading,
  .zi-panel, .zi-toggle-hd,
  .toast, .notification,
  [role="alert"]:not(.pdf-alert),
  .scroll-hint, .chart-tab, .tabs {
    display: none !important;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     EXIBIR — Conteúdo do relatório
     ═══════════════════════════════════════════════════════════════════════ */

  #results,
  .bazi-chart {
    display: block !important;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     CABEÇALHO CORRENTE — páginas 2–4
     ═══════════════════════════════════════════════════════════════════════ */

  .pdf-running-header {
    display: flex !important;
    justify-content: space-between;
    align-items: baseline;
    height: 12mm;
    border-bottom: 1px solid var(--pdf-gold-rule, rgba(150,116,56,0.25));
    margin-bottom: 4mm;
    padding-bottom: 2mm;
  }

  .pdf-running-header__brand {
    font-family: 'Lora', Georgia, serif;
    font-size: 11pt;
    color: var(--pdf-gold, #967438);
    display: flex;
    align-items: baseline;
    gap: 6px;
  }

  .pdf-running-header__brand-zh {
    font-family: 'Noto Serif SC', serif;
    font-size: 14pt;
    color: var(--pdf-gold, #967438);
    font-style: normal;
  }

  .pdf-running-header__meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 8pt;
    color: var(--pdf-ink-muted, #7C7264);
  }


  /* ═══════════════════════════════════════════════════════════════════════
     RODAPÉ CORRENTE
     ═══════════════════════════════════════════════════════════════════════ */

  .pdf-running-footer {
    display: block !important;
    text-align: center;
    font-family: 'Noto Sans', Arial, sans-serif;
    font-size: 8pt;
    font-style: italic;
    color: var(--pdf-ink-muted, #7C7264);
    border-top: 1px solid var(--pdf-gold-rule, rgba(150,116,56,0.20));
    padding-top: 2mm;
    margin-top: 4mm;
    height: 10mm;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     QUEBRAS DE PÁGINA
     ═══════════════════════════════════════════════════════════════════════ */

  .pdf-page-break {
    page-break-before: always;
    break-before: page;
  }

  .bazi-pillar, .pillar-card,
  .bazi-pillar__stem, .bazi-pillar__branch,
  .info-card, .luck-card, .star-card,
  .pdf-table, .pdf-pillar-card {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .sec-label, h2, h3, h4 {
    page-break-after: avoid;
    break-after: avoid;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     MAPA BAZI — Quatro Pilares
     ═══════════════════════════════════════════════════════════════════════ */

  .bazi-map,
  .pillars-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 4mm !important;
    width: 100%;
    margin-bottom: 6mm;
  }

  .bazi-pillar,
  .pillar-card {
    background: var(--pdf-surface, #FDFCF9) !important;
    border: 1px solid var(--pdf-gold-border, rgba(150,116,56,0.20)) !important;
    border-radius: 2mm !important;
    box-shadow: none !important;
    padding: 4mm !important;
    min-height: auto !important;
    transform: none !important;
  }

  /* Wu Xing — bordas superiores v2.5 */
  .bazi-pillar[data-element="wood"],
  .pillar-card[data-element="wood"]  { border-top: 3px solid var(--pdf-wood,  #147A48) !important; }
  .bazi-pillar[data-element="fire"],
  .pillar-card[data-element="fire"]  { border-top: 3px solid var(--pdf-fire,  #D3232E) !important; }
  .bazi-pillar[data-element="earth"],
  .pillar-card[data-element="earth"] { border-top: 3px solid var(--pdf-earth, #B87C14) !important; }
  .bazi-pillar[data-element="metal"],
  .pillar-card[data-element="metal"] { border-top: 3px solid var(--pdf-metal, #848484) !important; }
  .bazi-pillar[data-element="water"],
  .pillar-card[data-element="water"] { border-top: 3px solid var(--pdf-water, #2652A8) !important; }

  /* Badge de elemento — borda sem fundo */
  .bazi-pillar__element,
  .p-elem {
    background: transparent !important;
    border: 1px solid currentColor !important;
    font-size: 7pt !important;
    padding: 1px 4px !important;
  }

  /* Ten God */
  .bazi-pillar__ten-god,
  .p-god {
    font-size: 8pt;
    color: var(--pdf-ink-sec, #4C4538);
  }

  /* Troncos ocultos */
  .bazi-pillar__hidden-stems,
  .p-hidden {
    border-top: 1px dashed var(--pdf-gold-rule, rgba(150,116,56,0.25)) !important;
    font-size: 7pt;
    color: var(--pdf-ink-muted, #7C7264);
  }

  .bazi-pillar__hidden-stem {
    background: transparent !important;
    border: 1px solid rgba(76, 69, 56, 0.30) !important;   /* --color-text-secondary a 30% */
    color: var(--pdf-ink-sec, #4C4538) !important;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     CARDS DE INFORMAÇÃO
     ═══════════════════════════════════════════════════════════════════════ */

  .info-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 3mm !important;
  }

  .info-card {
    background: var(--pdf-surface, #FDFCF9) !important;
    border: 1px solid var(--pdf-gold-border, rgba(150,116,56,0.20)) !important;
    box-shadow: none !important;
    padding: 3mm !important;
  }

  .ic-val {
    font-size: 10pt;
    color: var(--pdf-ink, #1E1B15);
  }

  .ic-sub {
    font-size: 8pt;
    color: var(--pdf-ink-muted, #7C7264);
    font-style: italic;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     GRANDES CICLOS
     ═══════════════════════════════════════════════════════════════════════ */

  .luck-grid,
  .lp-grid {
    display: grid !important;
    grid-template-columns: repeat(8, 1fr) !important;
    gap: 2mm !important;
  }

  .luck-card {
    background: var(--pdf-surface, #FDFCF9) !important;
    border: 1px solid var(--pdf-gold-border, rgba(150,116,56,0.20)) !important;
    box-shadow: none !important;
    padding: 2mm !important;
    text-align: center;
  }

  .luck-card.current {
    border-color: var(--pdf-gold, #967438) !important;
    background: var(--pdf-gold-bg, rgba(150,116,56,0.06)) !important;
  }

  .luck-chars {
    font-family: 'Noto Serif SC', serif;
    font-size: 12pt;
    font-style: normal;
  }

  .luck-age,
  .luck-years,
  .luck-py {
    font-size: 7pt;
    color: var(--pdf-ink-muted, #7C7264);
  }


  /* ═══════════════════════════════════════════════════════════════════════
     BARRA DE BALANÇO DOS ELEMENTOS
     ═══════════════════════════════════════════════════════════════════════ */

  .elem-fill {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .elem-track {
    background: var(--pdf-gold-bg, rgba(150,116,56,0.06)) !important;
    border: 1px solid var(--pdf-gold-rule, rgba(150,116,56,0.15)) !important;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     ESTRELAS SIMBÓLICAS
     ═══════════════════════════════════════════════════════════════════════ */

  .stars-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 2mm !important;
  }

  .star-card {
    background: transparent !important;
    border: 1px solid var(--pdf-gold-rule, rgba(150,116,56,0.15)) !important;
    box-shadow: none !important;
    padding: 2mm !important;
    font-size: 9pt;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     INTERAÇÕES ENTRE RAMOS
     ═══════════════════════════════════════════════════════════════════════ */

  .interact-list { font-size: 9pt; }

  .interact-item {
    border-bottom: 1px solid var(--pdf-gold-bg, rgba(150,116,56,0.10)) !important;
    padding: 1mm 0 !important;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     ÁREA DE NOTAS DO CONSULTOR (Pág. 4)
     ═══════════════════════════════════════════════════════════════════════ */

  .pdf-notes-area {
    display: block !important;
    width: 100%;
    margin-top: 4mm;
  }

  .pdf-notes-area__line {
    border-bottom: 1px solid var(--pdf-gold-border, rgba(150,116,56,0.20));
    height: 8mm;
    display: block;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     CAPA — Página 1
     ═══════════════════════════════════════════════════════════════════════ */

  .pdf-cover {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 257mm;
    text-align: center;
    page-break-after: always;
    break-after: page;
  }

  .pdf-cover__zh {
    font-family: 'Noto Serif SC', serif;
    font-size: 72pt;
    color: var(--pdf-gold, #967438);
    line-height: 1;
    margin-bottom: 8mm;
    font-style: normal;
  }

  .pdf-cover__title {
    font-family: 'Lora', Georgia, serif;
    font-size: 18pt;
    color: var(--pdf-ink, #1E1B15);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 12mm;
  }

  .pdf-cover__rule {
    width: 60mm;
    border: none;
    border-top: 1px solid var(--pdf-gold-rule, rgba(150,116,56,0.40));
    margin: 6mm auto;
  }

  .pdf-cover__name {
    font-family: 'Lora', Georgia, serif;
    font-size: 24pt;
    color: var(--pdf-ink, #1E1B15);
    margin-bottom: 4mm;
  }

  .pdf-cover__meta {
    font-family: 'Noto Sans', Arial, sans-serif;
    font-size: 10pt;
    color: var(--pdf-ink-muted, #7C7264);
    line-height: 1.8;
  }

  .pdf-cover__gen {
    font-family: 'JetBrains Mono', monospace;
    font-size: 8pt;
    color: var(--pdf-ink-sec, #4C4538);
    margin-top: 12mm;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     LINKS
     ═══════════════════════════════════════════════════════════════════════ */

  a,
  a:visited {
    color: inherit !important;
    text-decoration: none !important;
  }

  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 7pt;
    color: var(--pdf-ink-muted, #7C7264);
  }

  a[href^="#"]::after,
  a[href^="javascript"]::after,
  button::after {
    content: none;
  }


  /* ═══════════════════════════════════════════════════════════════════════
     OVERRIDE DE DARK MODE — forçar light para impressão
     ═══════════════════════════════════════════════════════════════════════ */

  [data-theme="dark"],
  [data-theme="dark"] * {
    background-color: transparent !important;
    color: var(--pdf-ink, #1E1B15) !important;
  }

  [data-theme="dark"] .bazi-pillar,
  [data-theme="dark"] .pillar-card,
  [data-theme="dark"] .info-card,
  [data-theme="dark"] .luck-card,
  [data-theme="dark"] .star-card {
    background: var(--pdf-surface, #FDFCF9) !important;
  }

}
/* fim @media print */