/* MultiCloud Solutions -- estilo do DOCUMENTO impresso (S102/OS2).
 *
 * Folha propria de proposito: nao cresce o main.css e nao herda tema. Papel
 * e sempre preto sobre branco (mesmo com o sistema em modo escuro). Serve o
 * layout layouts/print.php (.pd*) e o bloco do documento partials/quote-doc.php
 * (.qd*), que tambem aparece dentro da pagina publica de aprovacao.
 * A cor da marca entra so em detalhes (titulo, filete); nada de fundo cheio,
 * para imprimir bem em impressora monocromatica.
 */

:root { --pd-ink: #111827; --pd-muted: #4b5563; --pd-line: #d1d5db; --pd-brand: #1d4ed8; }

.pd { margin: 0; background: #e5e7eb; color: var(--pd-ink); font: 14px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
.pd *, .qd * { box-sizing: border-box; }

/* --- barra de ferramentas (so na tela) ------------------------------------ */
.pd__bar { display: flex; gap: 8px; justify-content: flex-end; align-items: center; flex-wrap: wrap; padding: 12px 16px; max-width: 210mm; margin: 0 auto; }
/* S194: papel ideal do documento, a esquerda da barra (a barra nao sai na impressao). */
.pd__paper { margin: 0 auto 0 0; font-size: 13px; color: var(--pd-muted); }
.pd__paper strong { color: var(--pd-ink); }
.pd__btn {
    font: inherit; font-weight: 600; cursor: pointer; text-decoration: none;
    padding: 8px 14px; border-radius: 4px; border: 1px solid var(--pd-brand);
    background: var(--pd-brand); color: #fff;
}
.pd__btn--ghost { background: #fff; color: var(--pd-brand); }
.pd__btn:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }

/* --- folha ---------------------------------------------------------------- */
.pd__sheet { max-width: 210mm; margin: 0 auto 24px; padding: 14mm; background: #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, .18); }
.pd--a5 .pd__sheet { max-width: 148mm; padding: 10mm; }
.pd--a5 .qd { font-size: 12px; }
.pd--a4l .pd__bar { max-width: 297mm; }
.pd--a4l .pd__sheet { max-width: 297mm; padding: 10mm; }
/* S194: A5 paisagem (tabela de precos de uma faixa so). */
.pd--a5l .pd__bar { max-width: 210mm; }
.pd--a5l .pd__sheet { max-width: 210mm; padding: 10mm; }
.pd--a5l .qd { font-size: 12px; }

/* --- documento ------------------------------------------------------------- */
.qd { position: relative; color: var(--pd-ink); background: #fff; font-size: 13px; line-height: 1.45; }
.qd p { margin: 0; }
.qd__mark {
    position: absolute; top: 34%; left: 0; right: 0; text-align: center; z-index: 0;
    font-size: 88px; font-weight: 800; letter-spacing: .1em; color: rgba(0, 0, 0, .06);
    transform: rotate(-24deg); pointer-events: none;
}
.qd > * { position: relative; z-index: 1; }
.qd > .qd__mark { position: absolute; z-index: 0; }

.qd__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 2px solid var(--pd-brand); }
.qd__logo { display: block; height: 40px; width: auto; margin-bottom: 6px; }
.qd__company { font-size: 12px; color: var(--pd-muted); overflow-wrap: anywhere; }
.qd__ident { text-align: right; }
.qd__kicker { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--pd-muted); }
.qd__number { font-size: 22px; font-weight: 800; color: var(--pd-brand); }
.qd__meta { font-size: 12px; color: var(--pd-muted); }
.qd__title { font-size: 18px; margin: 14px 0 10px; overflow-wrap: anywhere; }

.qd__box { border: 1px solid var(--pd-line); border-radius: 4px; padding: 8px 10px; margin: 0 0 10px; break-inside: avoid; }
.qd__h { margin: 0 0 4px; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--pd-muted); }
.qd__box p { overflow-wrap: anywhere; }

.qd__items { width: 100%; border-collapse: collapse; margin: 6px 0 10px; font-size: 12px; }
/* S194: respiro de 3px nas celulas (antes 5-6px) para a linha caber sem quebrar; codigo, unidade e numeros nunca quebram (.qd__nowrap, .qd__num). */
.qd__items th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--pd-muted); border-bottom: 2px solid var(--pd-ink); padding: 3px; }
.qd__items td { padding: 3px; border-bottom: 1px solid var(--pd-line); vertical-align: top; }
.qd__nowrap { white-space: nowrap; }
/* S194: titulo de coluna numerica alinha a direita como os valores; nas tabelas em paisagem (so tabela de precos) o item ocupa o que sobra e os valores ficam estreitos. */
.qd__items th.qd__num { text-align: right; }
.pd--a4l .qd__items .qd__wide, .pd--a5l .qd__items .qd__wide { width: auto; }
.pd--a4l .qd__items .qd__num, .pd--a5l .qd__items .qd__num { width: 1%; }
/* S194: linha-titulo da tabela (1a linha do thead, repetida em toda folha pelo navegador); some na tela. */
.qd__items .qd__thead-title { display: none; }
.qd__items tr { break-inside: avoid; }
.qd__wide { width: 42%; overflow-wrap: anywhere; }
.qd__num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.qd__desc { color: var(--pd-muted); font-size: 11px; }
.qd__tag { display: inline-block; margin-left: 6px; padding: 0 5px; border: 1px solid var(--pd-ink); border-radius: 2px; font-size: 10px; font-weight: 700; text-transform: uppercase; }

.qd__totals { display: flex; justify-content: flex-end; margin: 0 0 12px; break-inside: avoid; }
.qd__totals dl { margin: 0; min-width: min(280px, 100%); }
.qd__totals dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 3px 0; border-bottom: 1px solid var(--pd-line); }
.qd__totals dt { color: var(--pd-muted); }
.qd__totals dd { margin: 0; font-variant-numeric: tabular-nums; }
.qd__grand { font-size: 16px; font-weight: 800; border-bottom: 2px solid var(--pd-ink) !important; }
.qd__grand dt { color: var(--pd-ink); }
.qd__approval { border-color: var(--pd-ink); }

/* --- telas estreitas ------------------------------------------------------- */
@media (max-width: 640px) {
    .pd__sheet { padding: 12px; }
    .qd__ident { text-align: left; }
    .qd__items { display: block; overflow-x: auto; }
}

/* --- impressao -------------------------------------------------------------- */
/* Papel fixo por documento (S115): A4 retrato por padrao; orcamento, OS e tabela de precos em A5 (body.pd--a5). */
/* S193: marca e numeracao em cada folha, com espaco reservado no rodape. */
@page { size: A4 portrait; margin: 14mm 13mm;
    @bottom-center { content: "Papel A4 retrato"; font: 8pt/1 system-ui, sans-serif; color: #6b7280; } /* S194 */
    @bottom-left { content: "MultiCloud Solutions"; font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
    @bottom-right { content: "Página " counter(page) " de " counter(pages); font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
}
@page a5 { size: A5 portrait; margin: 10mm 9mm 14mm;
    @bottom-center { content: "Papel A5 retrato"; font: 8pt/1 system-ui, sans-serif; color: #6b7280; } /* S194 */
    @bottom-left { content: "MultiCloud Solutions"; font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
    @bottom-right { content: "Página " counter(page) " de " counter(pages); font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
}
body.pd--a5 { page: a5; }
@page a4l { size: A4 landscape; margin: 10mm 10mm 14mm;
    @bottom-center { content: "Papel A4 paisagem"; font: 8pt/1 system-ui, sans-serif; color: #6b7280; } /* S194 */
    @bottom-left { content: "MultiCloud Solutions"; font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
    @bottom-right { content: "Página " counter(page) " de " counter(pages); font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
}
body.pd--a4l { page: a4l; }
@page a5l { size: A5 landscape; margin: 9mm 10mm 14mm;
    @bottom-center { content: "Papel A5 paisagem"; font: 8pt/1 system-ui, sans-serif; color: #6b7280; } /* S194 */
    @bottom-left { content: "MultiCloud Solutions"; font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
    @bottom-right { content: "Página " counter(page) " de " counter(pages); font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
}
body.pd--a5l { page: a5l; } /* S194 */

/* S196: papeis NOMEADOS do portfolio de servicos (views/pages/services/portfolio.php),
   que leva a faixa de tecnologias no rodape de cada folha. O @page sem nome acima
   continua valendo (A4 retrato, 14mm 13mm): regras `@page` de mesmo nome somam, entao
   aqui so a margem de baixo cresce (20mm) para a faixa caber. A faixa (`@bottom-center`) vem de
   /impressao/tecnologias.css (SVG embutido, gerado pelo PrintAssetController): URL
   externa saia vazia na 1a impressao do Chromium (revisao Opus S196). */
/* Revisao S196: a duplicacao de @bottom-left/@bottom-right em relacao ao @page sem nome e intencional (a caixa @bottom-center e ocupada pela faixa de logos). */
@page techcorp {
    margin-bottom: 20mm;
    @bottom-left { content: "MultiCloud Solutions\A Papel A4 retrato"; white-space: pre; font: 8pt/1.3 system-ui, sans-serif; color: #6b7280; }
    @bottom-right { content: "Página " counter(page) " de " counter(pages); font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
}
@page techres {
    margin-bottom: 20mm;
    @bottom-left { content: "MultiCloud Solutions\A Papel A4 retrato"; white-space: pre; font: 8pt/1.3 system-ui, sans-serif; color: #6b7280; }
    @bottom-right { content: "Página " counter(page) " de " counter(pages); font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
}
@page techmix {
    margin-bottom: 20mm;
    @bottom-left { content: "MultiCloud Solutions\A Papel A4 retrato"; white-space: pre; font: 8pt/1.3 system-ui, sans-serif; color: #6b7280; }
    @bottom-right { content: "Página " counter(page) " de " counter(pages); font: 8pt/1 system-ui, sans-serif; color: #6b7280; }
}
/* Sem o atributo do segmento, vale o @page sem nome (A4 retrato) de sempre. */
/* Revisao S196: nao sobrescrevem os papeis fixos body.pd--a5/a4l/a5l (mesma especificidade, vence o ultimo). */
body[data-print-tech="corporativo"]:not(.pd--a5):not(.pd--a4l):not(.pd--a5l) { page: techcorp; }
body[data-print-tech="residencial"]:not(.pd--a5):not(.pd--a4l):not(.pd--a5l) { page: techres; }
body[data-print-tech="misto"]:not(.pd--a5):not(.pd--a4l):not(.pd--a5l) { page: techmix; }
@media print {
    .pd { background: #fff; }
    .pd__bar { display: none; }
    /* S194: `.pd .pd__sheet` (2 classes) empata com `.pd--a5 .pd__sheet` e vence por ordem: a folha usa a largura toda do papel. */
    .pd .pd__sheet { max-width: none; margin: 0; padding: 0; box-shadow: none; }
    .qd__items .qd__thead-title { display: table-row; }
    .qd__items .qd__thead-title th { text-align: left; font-size: 9pt; font-weight: 600; color: var(--pd-muted); text-transform: none; letter-spacing: 0; border-bottom: 1px solid var(--pd-line); }
    .qd__items thead { display: table-header-group; }
    /* S193: titulos acompanham o conteudo; notas encerram a folha sem se dividir. */
    .qd__h, .rp__h2, .rp__h3, h1, h2, h3 { break-after: avoid; }
    .pd p, .pd li { orphans: 3; widows: 3; }
    .pd-keep-head > .qd__h + * { break-before: avoid; }
    .pd-note { break-inside: avoid; break-after: page; }
    .pd-note:last-child { break-after: auto; }
    /* S194: QR e assinaturas fecham o documento, nao sao conteudo novo: a nota anterior nao abre folha nova por causa deles. */
    .pd-note:has(+ .pd-online), .pd-note:has(+ .pd-sign) { break-after: auto; }
    .pd-end { break-inside: avoid; }
}

/* --- pagina publica: o documento como "folha" sobre o tema do site ------------- */
.qd-paper { background: #fff; color: var(--pd-ink); border-radius: 4px; padding: 18px; box-shadow: 0 1px 6px rgba(0, 0, 0, .25); overflow-x: auto; }

/* --- S103/OS3: Ordem de Servico (views/admin/os/print.php) ------------------ */
.od__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.od__cols > .qd__box { margin: 0 0 10px; }
.od__visit { font-size: 12px; color: var(--pd-muted); }
/* S194/D: linhas de assinatura compartilhadas (partials/doc-sign.php); antes .od__sign* so da OS. */
.pd-sign { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 32px; margin-top: 36px; break-inside: avoid; }
.pd-sign__box { text-align: center; font-size: 12px; color: var(--pd-muted); }
.pd-sign__line { display: block; height: 34px; border-bottom: 1px solid var(--pd-ink); }
.pd-sign__box p { margin: 4px 0 0; }
@media (max-width: 640px) {
    .od__cols { grid-template-columns: minmax(0, 1fr); }
    .pd-sign { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); }
}

/* --- S103/OS4: relatorio tecnico, checklist e fotos na OS impressa ---------- */
.od__ck { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.od__ck li { margin: 2px 0; }
.od__photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.od__photo { margin: 0; break-inside: avoid; }
.od__photo img { display: block; max-width: 100%; height: auto; }
.od__photo figcaption { font-size: 11px; color: var(--pd-muted); }

/* --- S127/E: proposta de parceria (partials/partner-proposal-doc.php) -------- */
.pp__sec { break-inside: avoid-page; }
.pp__text p { margin: 0 0 8px; }
.pp__text ul { margin: 0 0 8px; padding-left: 20px; }
.pp__text li { margin: 2px 0; }
.pp-table { overflow-x: auto; margin: 0 0 8px; }
.pp-table table { width: 100%; border-collapse: collapse; font-size: 12px; }
.pp-table th, .pp-table td { border: 1px solid var(--pd-line); padding: 5px 7px; text-align: left; vertical-align: top; }
.pp-table thead th { background: #f3f4f6; }
.pp__items { margin-top: 8px; }
.pp__accepted { margin-top: 8px; padding: 8px 10px; border: 1px solid var(--pd-line); border-left: 3px solid var(--pd-brand); }
.pp__sign { margin-top: 24px; color: var(--pd-muted); }

/* --- S193/S194: tabelas de preco de referencia (views/admin/catalog/reference-print.php), A4 paisagem --------- */
.rp { font-size: 11px; line-height: 1.4; }
.rp p { margin: 0; }
.rp__page { break-after: page; }
.rp__page:last-child { break-after: auto; }
/* S194: abas da tabela e "Fontes e metodo" fluem (sem quebra forcada); so capa e "Como usar" tem folha propria. */
.rp__tab { margin-top: 8mm; }
.rp__page + .rp__tab { margin-top: 0; }
.rp__tab--short { break-inside: avoid; }
.rp__cover { text-align: left; padding: 24mm 8mm 0; min-height: 150mm; }
.rp__logo { display: block; height: 56px; width: auto; margin-bottom: 18mm; }
.rp__kicker { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--pd-muted); }
.rp__title { margin: 4px 0 10px; font-size: 32px; line-height: 1.15; color: var(--pd-brand); }
.rp__meta { font-size: 14px; color: var(--pd-muted); margin: 2px 0; }
.rp .rp__warn { display: inline-block; margin-top: 14mm; padding: 6px 12px; border: 2px solid var(--pd-ink); font-size: 14px; font-weight: 700; }
.rp__h2 { margin: 0 0 8px; font-size: 18px; padding-bottom: 4px; border-bottom: 2px solid var(--pd-brand); }
.rp__h3 { margin: 12px 0 4px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--pd-muted); }
.rp__text p { margin: 0 0 6px; }
.rp__text ul, .rp__list { margin: 0 0 8px; padding-left: 18px; }
.rp__text li, .rp__list li { margin: 2px 0; }
.rp__legend { width: 100%; border-collapse: collapse; margin: 4px 0 8px; font-size: 11px; }
.rp__legend th, .rp__legend td { border: 1px solid var(--pd-line); padding: 4px 6px; text-align: left; vertical-align: top; }
.rp__legend th { background: #f3f4f6; width: 24%; white-space: nowrap; }
.rp__index { columns: 2; margin: 0; padding-left: 18px; }
.rp__index li { break-inside: avoid; margin: 2px 0; }
.rp__tab-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; border-bottom: 2px solid var(--pd-brand); margin-bottom: 6px; }
.rp__tab-head .rp__h2 { border: 0; margin: 0; }
/* S194: layout automatico (colunas pelo conteudo) em vez de larguras fixas em %; unidade, numeros e "No catalogo" nao quebram. */
.rp__table { width: 100%; border-collapse: collapse; font-size: 9pt; table-layout: auto; }
.rp__table thead { display: table-header-group; }
.rp__table th { text-align: left; font-size: 8pt; text-transform: uppercase; letter-spacing: .05em; color: var(--pd-muted); border-bottom: 2px solid var(--pd-ink); padding: 3px; white-space: nowrap; }
.rp__table td { padding: 3px; border-bottom: 1px solid var(--pd-line); vertical-align: top; overflow-wrap: break-word; }
/* S194: linha-titulo (1a do thead, repetida em toda folha); na tela o .rp__tab-head ja mostra o titulo. */
.rp__table .rp__thead-title { display: none; }
.rp__table .rp__thead-title th { text-align: left; font-size: 8pt; font-weight: 600; color: var(--pd-muted); text-transform: none; letter-spacing: 0; border-bottom: 1px solid var(--pd-line); white-space: normal; }
.rp__table tr { break-inside: avoid; }
/* --- S194: sem larguras fixas (as 7 colunas dimensionam pelo conteudo; so o servico pode quebrar, se precisar) --- */
.rp__table .c-un, .rp__table .c-cat { white-space: nowrap; overflow-wrap: normal; }
/* S194: a <caption> (titulo + introducao da aba) alinha a esquerda como o texto; respiro entre Ancora (a direita) e No catalogo. */
.rp__lead { caption-side: top; text-align: left; }
.rp__table .c-cat { padding-left: 12px; }
.rp__table .c-num { text-align: right; white-space: nowrap; overflow-wrap: normal; font-variant-numeric: tabular-nums; }
.rp__grp { break-inside: avoid; }
.rp__grp tr:first-child:not(:last-child) td { border-bottom: 0; }
.rp__sub td { font-size: 8pt; color: var(--pd-muted); padding-top: 0; }
.rp__alert { display: inline-block; margin-left: 3px; padding: 0 4px; border: 1px solid var(--pd-ink); border-radius: 2px; font-size: 7.5pt; font-weight: 700; white-space: nowrap; }
.rp__note { margin-top: 6px; font-size: 10px; color: var(--pd-muted); }
.rp__foot { margin-top: 6px; font-size: 9px; color: var(--pd-muted); }
/* S194: continuacao da lista de fontes (ultima fonte, presa ao rodape no bloco .pd-end). */
.rp__list + .pd-end .rp__list--cont { margin-top: -8px; }
@media print {
    /* S194: A4 paisagem tem ~186mm uteis de altura; 230mm empurrava uma folha em branco. */
    .rp__cover { min-height: 150mm; }
    /* S194: o titulo grande + introducao vem na <caption> (so na 1a folha da aba); a linha-titulo do thead, discreta, repete o nome nas folhas seguintes. */
    .rp__table .rp__thead-title { display: table-row; }
    /* S194: titulo + introducao + 1as linhas ficam juntos (forma `break-before: avoid` nos 3 primeiros grupos). */
    .rp__lead { break-after: avoid; }
    .rp__tab .rp__table tbody:nth-of-type(-n+3) { break-before: avoid; }
    .rp__list li { break-inside: avoid; }
    /* S194: a nota da aba nao se divide. */
    .rp__note { break-inside: avoid; }
}
@media (max-width: 640px) {
    .rp__table { display: block; overflow-x: auto; table-layout: auto; }
    .rp__index { columns: 1; }
}

/* --- S194/D: cabecalho unico, totais em caixa, QR "ver online" e tipografia dos documentos --------------- */
/* Total em destaque na faixa de fatos do cabecalho (orcamento): caixa com filete, legivel em tons de cinza. */
.qd__fact-total { margin-top: 6px; padding: 3px 8px; border: 2px solid var(--pd-ink); display: inline-flex; gap: 10px; align-items: baseline; font-size: 12px; }
.qd__fact-total strong { font-size: 16px; font-variant-numeric: tabular-nums; }
/* Total geral maior, numa caixa com filete (nao so uma linha). */
.qd__totals .qd__grand { font-size: 17px; border: 2px solid var(--pd-ink) !important; padding: 5px 8px; margin-top: 4px; }
/* Titulos de secao com filete fino da marca. */
.qd__h { padding-bottom: 2px; border-bottom: 1px solid var(--pd-brand); }
/* Caixa "Ver online": QR + endereco escrito (fallback sem JS). */
.pd-online { display: flex; gap: 12px; align-items: center; }
.pd-online__qr { flex: 0 0 auto; width: 28mm; height: 28mm; }
.pd-online__qr svg { display: block; width: 100%; height: 100%; }
.pd-online__qr:not(.pd-online__qr--ok) { display: none; }
.pd-online__txt { min-width: 0; }
.pd-online__url { font-size: 11px; font-weight: 600; overflow-wrap: anywhere; word-break: break-all; }
@media print {
    /* corpo 10pt (A4) e rotulos 8pt; as regras de papel/titulo da S194 seguem valendo */
    .pd--a4 .qd { font-size: 10pt; }
    .qd__h, .qd__kicker, .qd__items th { font-size: 8pt; }
    .pd-sign, .pd-online { break-inside: avoid; }
}

/* --- S196: portfolio de servicos (views/pages/services/portfolio.php) --------
   A folha continua sendo o `.pd__sheet` do documento impresso; aqui vivem so as
   pecas do portfolio: capa, sumario, uma secao por segmento, cartao de servico,
   faixa de tecnologias e CTA. Papel sempre preto no branco; a marca entra so no
   icone do servico (azul na tela, preto no papel). O filtro de publico e da TELA
   (dentro da barra .pd__bar, que ja some ao imprimir). */
.pf { color: var(--pd-ink); }
.pf-cover {
    text-align: center; padding: 6mm 0 8mm; margin: 0 0 6mm;
    border-bottom: 2px solid var(--pd-brand); break-after: avoid;
}
.pf-cover__logo { display: block; height: 40px; width: auto; margin: 0 auto 6mm; }
.pf-cover__title { margin: 0 0 2mm; font-size: 26px; font-weight: 800; }
.pf-cover__sub { margin: 0; font-size: 13px; color: var(--pd-muted); }
/* Filtro Empresa/Casa/Tudo: links de TELA, dentro da barra (contrato S196). */
.pf-filter { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin: 0 auto 0 0; }
.pf-filter a {
    padding: 6px 10px; border: 1px solid var(--pd-line); border-radius: 4px;
    background: #fff; color: var(--pd-brand); font-size: 13px; text-decoration: none;
}
.pf-filter a[aria-current="page"] { background: var(--pd-brand); border-color: var(--pd-brand); color: #fff; }
.pf-filter a:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }
/* Sumario em 2 colunas (mesmo padrao do .rp__index). */
.pf-toc { columns: 2; column-gap: 8mm; margin: 6mm 0; font-size: 12px; }
.pf-toc h2 { column-span: all; } /* revisao Opus S196: titulo sobre as 2 colunas */
.pf-toc ul, .pf-toc ol { margin: 0; padding-left: 5mm; }
.pf-toc a { color: var(--pd-ink); text-decoration: none; }
.pf-toc li { break-inside: avoid; margin: 0 0 1mm; }
/* Cada segmento abre folha nova; o PRIMEIRO nao. O combinador pega qualquer
   .pf-section que venha depois de outro, mesmo com a faixa .pf-tech no meio. */
.pf-section ~ .pf-section { break-before: page; }
.pf-section__title { margin: 0 0 4mm; padding-bottom: 2mm; border-bottom: 2px solid var(--pd-brand); font-size: 20px; break-after: avoid; }
/* Cartao de servico: borda de papel, icone de 28px fixo a esquerda (o texto
   comeca depois dele pelo padding) e nunca dividido entre folhas. */
.pf-svc { position: relative; margin: 0 0 4mm; padding: 4mm 4mm 4mm 14mm; border: 1px solid var(--pd-line); border-radius: 4px; break-inside: avoid; }
.pf-svc__icon { position: absolute; top: 4mm; left: 4mm; width: 28px; height: 28px; }
.pf-svc__icon svg { display: block; width: 100%; height: 100%; }
/* S200: o icone agora pinta com currentColor -- azul da marca na tela (no papel segue preto, regra abaixo). */
.pf-svc__icon { color: var(--pd-brand); }
.pf-svc__title { margin: 0 0 1mm; font-size: 15px; }
/* Recursos em 2 colunas. */
.pf-svc__features { columns: 2; column-gap: 6mm; margin: 2mm 0; padding-left: 5mm; font-size: 12px; }
.pf-svc__features li { break-inside: avoid; margin: 0 0 1mm; }
.pf-svc__link { font-size: 11px; color: var(--pd-muted); overflow-wrap: anywhere; }
.pf-tech { margin: 4mm 0; break-inside: avoid; }
.pf-tech__strip { display: block; max-width: 100%; height: auto; margin: 0 0 2mm; }
.pf-tech__group { margin: 0 0 1mm; font-size: 11px; color: var(--pd-muted); }
.pf-cta { margin: 6mm 0 0; padding: 4mm; border: 1px solid var(--pd-ink); border-radius: 4px; break-inside: avoid; }

@media print {
    /* S196: o icone do servico carrega o gradiente da marca -- no papel vira preto solido. */
    .pf-svc__icon { color: #000; filter: grayscale(1) brightness(0); }
    /* O filtro de publico e so da tela (a barra ja some; aqui fica explicito). */
    .pf-filter { display: none; }
}
@media (max-width: 640px) {
    .pf-toc, .pf-svc__features { columns: 1; }
    .pf-svc { padding-left: 4mm; }
    .pf-svc__icon { position: static; margin: 0 0 2mm; }
}

/* S197: impressao monocromatica dos documentos + seletor de modo
   Modo preto e cinza para os documentos do painel (orcamento, OS, proposta,
   tabelas). O atributo html[data-print-mode] vem do layout de impressao e, nos
   documentos do painel, do seletor abaixo (print-doc.js troca o valor, nada e
   salvo). ADITIVO e so impressao: o modo colorido (padrao, sem o atributo) nao
   muda em nada. A marca vira preto pelo token --pd-brand, usado em titulos,
   filetes de capa/secao, total em caixa e links. Sem `print-color-adjust`. */
img.print-logo--mono { display: none; }
/* Seletor de modo: so na TELA, ao lado de "Papel ideal" na barra .pd__bar (que
   ja some no papel). Botao segmentado com os tokens do documento; cabe em 360px
   (a barra tem flex-wrap). */
.print-mode-switch { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; padding: 0; min-width: 0; border: 0; }
.print-mode-switch legend { padding: 0; font-size: 12px; color: var(--pd-muted); }
.print-mode-switch label { display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px; border: 1px solid var(--pd-line); border-radius: 4px; background: #fff; color: var(--pd-ink); font-size: 12px; cursor: pointer; }
.print-mode-switch label:has(input:checked) { border-color: var(--pd-brand); background: var(--pd-brand); color: #fff; }
.print-mode-switch label:has(input:focus-visible) { outline: 3px solid #93c5fd; outline-offset: 2px; }
.print-mode-switch input { margin: 0; accent-color: var(--pd-brand); }
@media print {
    /* Marca preta: cobre titulos (.qd__number, .rp__title), filetes de capa e
       de secao (.qd__head, .qd__h, .rp__h2, .pf-cover, .pf-section__title),
       total em caixa e os links do sumario. */
    html[data-print-mode="mono"] { --pd-brand: #000; }
    html[data-print-mode="mono"] a,
    html[data-print-mode="mono"] .qd__title,
    html[data-print-mode="mono"] .qd__number,
    html[data-print-mode="mono"] .rp__title,
    html[data-print-mode="mono"] .rp__h2,
    html[data-print-mode="mono"] .rp__h3,
    html[data-print-mode="mono"] .pf-cover__title,
    html[data-print-mode="mono"] .pf-section__title { color: #000; }
    /* Selos do documento: contorno preto, sem fundo. */
    html[data-print-mode="mono"] .qd__tag,
    html[data-print-mode="mono"] .rp__alert,
    html[data-print-mode="mono"] .badge,
    html[data-print-mode="mono"] .tag { background: transparent; border: 1px solid #000; color: #000; }
    /* O seletor nunca sai no papel (a barra ja some; aqui fica explicito). */
    .print-mode-switch { display: none; }
    /* Logo: no papel o modo mono troca a colorida pela preta; na tela a preta
       nunca aparece. Sem o atributo (ou "color") vale a colorida. */
    html[data-print-mode="color"] .print-logo--color { display: block; }
    html[data-print-mode="color"] .print-logo--mono { display: none; }
    html[data-print-mode="mono"] .print-logo--color { display: none; }
    html[data-print-mode="mono"] .print-logo--mono { display: block; }
}
/* ===== fim S197 ===== */
/* S202: tabela de chamados em A4 paisagem, sem cortar linhas entre folhas. */
.ticket-report-doc__table { table-layout: fixed; width: 100%; }
.ticket-report-doc__table th, .ticket-report-doc__table td { white-space: normal; padding: 2px 3px; font-size: 8pt; line-height: 1.15; }
.ticket-report-doc__table th { letter-spacing: 0; overflow-wrap: anywhere; } /* cabecalho nunca sangra para fora da celula */
.ticket-report-doc__col--code { width: 10%; }
.ticket-report-doc__col--opened { width: 9%; }
.ticket-report-doc__col--customer { width: 13%; }
.ticket-report-doc__col--subject { width: 22%; }
.ticket-report-doc__col--queue { width: 6%; }
.ticket-report-doc__col--priority { width: 7%; }
.ticket-report-doc__col--status { width: 8%; }
.ticket-report-doc__col--agent { width: 9%; }
.ticket-report-doc__col--resolved { width: 8%; }
.ticket-report-doc__col--sla { width: 8%; }
.ticket-report-doc__table :is(th, td):is(:nth-child(3), :nth-child(4)) { overflow-wrap: anywhere; }
.ticket-report-doc__table thead { display: table-header-group; }
.ticket-report-doc__table tr { break-inside: avoid; page-break-inside: avoid; }

/* S207: opt-in internal report tables: ONE table per section (thead repeats only on continuation pages).
   Lead (heading + description) stays with the first 3 records through break-after/before: avoid. */
.pd-keep { break-inside: avoid; page-break-inside: avoid; }
.pd-lead { caption-side: top; text-align: left; break-after: avoid; page-break-after: avoid; }
.pd-lead > * { break-after: avoid; }
.pd-table-set .pd-table { table-layout: fixed; width: 100%; }
.pd-table-set:has(> .qd__items) { margin-bottom: 10px; }
.pd-note:has(> .pd-table-set) { break-inside: auto; }
.pd-table-set .pd-table :is(th, td) { overflow-wrap: anywhere; }
.pd-table-set .pd-table :is(.qd__wide, .qd__num) { width: auto; }
.pd-table thead { display: table-header-group; }
.pd-table tr { break-inside: avoid; page-break-inside: avoid; }
/* One heading per page: the lead already names the section, so the thead title row (S194) would print it twice on the first page. */
.pd-table .qd__thead-title, .pd-table .rp__thead-title { display: none; }
.pd-table > thead tr { break-after: avoid; }
.pd-table > tbody:first-of-type > tr:nth-child(-n+3) { break-before: avoid; break-after: avoid; }
.pd-table > tbody.rp__grp:nth-of-type(-n+3) { break-before: avoid; break-after: avoid; }
.pd-col-ref-service { width: 36%; }
.pd-col-ref-unit { width: 10%; }
.pd-col-ref-num { width: 7%; }
.pd-col-ref-catalog { width: 26%; }
.pd-col-price-code { width: 12%; }
.pd-col-price-name { width: 60%; }
.pd-col-price-name-all { width: 40%; }
.pd-col-price-unit { width: 8%; }
.pd-col-price-num { width: 20%; }
.pd-col-price-num-all { width: 10%; }
.pd-col-work-ref { width: 18%; }
.pd-col-work-title { width: 42%; }
.pd-col-work-tech { width: 25%; }
.pd-col-work-hours { width: 15%; }
.pd-col-hours-label { width: 80%; }
.pd-col-hours-value { width: 20%; }
@media print {
    /* The reference table's fixed columns must allow long catalog warnings. */
    .pd-table-set .pd-table .c-cat { white-space: normal; }
}