/* Relatórios e importação de demandas (11/11/2026). Central de relatórios (rl-), botão "Relatório" do topo e o menu
   dele (rl-menu, rl-pop), timbre da impressão da tela (cq-timbre) e a gaveta de importação por planilha (im-). */

/* ---------- Central de relatórios ---------- */
.rl { display: grid; grid-template-columns: 284px minmax(0, 1fr); gap: 18px; align-items: start; }
.rl-nav { position: sticky; top: 78px; display: grid; gap: 14px; max-height: calc(100vh - 100px); overflow: auto; padding: 14px 10px; }
.rl-grupo h3 { margin: 0 0 6px; padding: 0 10px; color: var(--nx-ink-3); font-size: 10.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.rl-assunto { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 10px; color: var(--nx-ink); font-size: 13px; text-decoration: none; transition: background-color var(--vz-rapido, 160ms), color var(--vz-rapido, 160ms); }
.rl-assunto .pi { display: grid; width: 26px; height: 26px; border-radius: 8px; background: var(--nx-surface-3); color: var(--nx-ink-2); font-size: 12px; place-items: center; }
.rl-assunto b { min-width: 30px; padding: 1px 8px; border-radius: 999px; background: var(--nx-surface-3); color: var(--nx-ink-2); font-size: 11.5px; font-variant-numeric: tabular-nums; font-weight: 650; text-align: center; }
.rl-assunto b.rl-zero { background: transparent; color: var(--nx-ink-4); }
.rl-assunto:hover { background: var(--nx-surface-2); }
.rl-assunto--on { background: color-mix(in srgb, var(--nx-teal-500) 12%, var(--nx-surface)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--nx-teal-500) 30%, transparent); font-weight: 650; }
.rl-assunto--on .pi { background: var(--nx-teal-600); color: #fff; }
.rl-assunto--on b { background: color-mix(in srgb, var(--nx-teal-500) 20%, var(--nx-surface)); color: var(--nx-teal-800); }
[data-theme=dark] .rl-assunto--on b { color: #9ff0e9; }

.rl-painel { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; min-width: 0; padding: 20px 22px 22px; }
.rl-cab { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 14px; align-items: center; }
.rl-cab__ic { display: grid; width: 44px; height: 44px; border-radius: 13px; background: linear-gradient(135deg, var(--nx-teal-500), var(--nx-teal-700)); box-shadow: 0 8px 18px -10px var(--nx-teal-600); color: #fff; font-size: 18px; place-items: center; }
.rl-cab h2 { margin: 0; font-size: 18px; font-weight: 720; letter-spacing: -0.015em; }
.rl-cab p { margin: 3px 0 0; color: var(--nx-ink-2); font-size: 13px; }
.rl-cab__acoes { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }

.rl-filtros { display: grid; grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 10px 12px; padding: 14px; border: 1px solid var(--nx-line); border-radius: 14px; background: var(--nx-surface-2); }
.rl-campo { display: grid; gap: 4px; min-width: 0; }
.rl-campo > span:first-child { color: var(--nx-ink-2); font-size: 11px; font-weight: 650; letter-spacing: 0.04em; text-transform: uppercase; }
.rl-campo .nx-select, .rl-campo .nx-input { width: 100%; min-width: 0; }
.rl-campo--periodo { grid-column: span 2; }
.rl-campo--periodo > div { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 8px; align-items: center; }
.rl-campo--periodo small { color: var(--nx-ink-3); }
.rl-campo--busca { grid-column: 1 / -1; }
.rl-campo--busca .nx-input { height: 40px; font-size: 13.5px; }
.rl-busca { position: relative; display: block; }
.rl-busca .pi { position: absolute; top: 50%; left: 11px; color: var(--nx-ink-3); font-size: 12px; transform: translateY(-50%); }
.rl-busca .nx-input { padding-left: 32px; }

.rl-colunas { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.rl-colunas > span { margin-right: 4px; color: var(--nx-ink-2); font-size: 11px; font-weight: 650; letter-spacing: 0.04em; text-transform: uppercase; }
.rl-col { display: inline-flex; gap: 6px; align-items: center; min-height: 30px; padding: 4px 11px; border: 1px solid var(--nx-line-2); border-radius: 999px; background: var(--nx-surface); color: var(--nx-ink-3); font: inherit; font-size: 12.2px; cursor: pointer; transition: background-color var(--vz-rapido, 160ms), border-color var(--vz-rapido, 160ms), color var(--vz-rapido, 160ms); }
.rl-col .pi { font-size: 11px; }
.rl-col--on { border-color: color-mix(in srgb, var(--nx-teal-500) 45%, transparent); background: color-mix(in srgb, var(--nx-teal-500) 10%, var(--nx-surface)); color: var(--nx-ink); }
.rl-col--on .pi { color: var(--nx-teal-600); }
.rl-col--grupo { border-style: dashed; color: var(--nx-ink-2); cursor: default; }

.rl-resumo { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }
.rl-total { display: flex; gap: 7px; align-items: baseline; padding-right: 16px; border-right: 1px solid var(--nx-line); }
.rl-total b { font-size: 26px; font-variant-numeric: tabular-nums; font-weight: 760; letter-spacing: -0.03em; line-height: 1; }
.rl-total span { color: var(--nx-ink-2); font-size: 12.5px; }
.rl-partes { display: flex; flex: 1; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.rl-partes li { display: inline-flex; gap: 6px; align-items: baseline; padding: 4px 11px; border: 1px solid var(--nx-line); border-radius: 999px; background: var(--nx-surface-2); font-size: 12px; }
.rl-partes li b { font-variant-numeric: tabular-nums; }
.rl-partes li span { color: var(--nx-ink-2); }
.rl-partes__mais { border-style: dashed !important; background: transparent !important; }

.rl-rola { max-height: 62vh; border: 1px solid var(--nx-line); border-radius: 12px; }
.rl-tab { margin: 0; }
.rl-tab thead th { position: sticky; top: 0; z-index: 1; background: var(--nx-surface-2); box-shadow: inset 0 -1px 0 var(--nx-line); white-space: nowrap; }
.rl-tab td { vertical-align: top; }
.rl-n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rl-d { font-variant-numeric: tabular-nums; white-space: nowrap; }
.rl-tab__grupo th { padding: 10px 12px 8px; background: color-mix(in srgb, var(--nx-teal-500) 8%, var(--nx-surface)); color: var(--nx-ink); font-size: 12.5px; font-weight: 700; letter-spacing: 0; text-align: left; text-transform: none; }
.rl-tab__grupo small { margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: var(--nx-surface); color: var(--nx-ink-2); font-size: 11px; font-weight: 600; }
.rl-corte, .rl-nada { display: flex; gap: 8px; align-items: center; margin: 0; color: var(--nx-ink-2); font-size: 12.5px; }
.rl-nada { justify-content: center; padding: 34px 12px; border: 1px dashed var(--nx-line-2); border-radius: 12px; }
.rl-vazio .mk-vazio { padding: 28px 12px; }

/* ---------- botão "Relatório" do topo e o menu ---------- */
.rl-menu { display: inline-flex; }
.rl-menu__botao { gap: 6px; border-radius: 10px; box-shadow: var(--vz-sombra, none); white-space: nowrap; }
.rl-menu__seta { font-size: 10px; opacity: 0.7; }
.rl-pop { position: fixed; z-index: 60; display: grid; gap: 2px; width: 330px; max-width: calc(100vw - 16px); padding: 6px; border: 1px solid var(--nx-line); border-radius: 14px; background: var(--nx-surface); box-shadow: 0 18px 40px -18px rgba(10, 30, 40, 0.45), 0 2px 6px rgba(10, 30, 40, 0.08); animation: rl-pop 140ms cubic-bezier(0.2, 0.7, 0.2, 1); }
@keyframes rl-pop { from { opacity: 0; transform: translateY(-4px); } }
.rl-pop > button, .rl-pop > a { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; align-items: start; width: 100%; padding: 9px 10px; border: 0; border-radius: 10px; background: none; color: var(--nx-ink); font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.rl-pop > button:hover, .rl-pop > a:hover, .rl-pop > button:focus-visible, .rl-pop > a:focus-visible { background: var(--nx-surface-2); outline: none; }
.rl-pop .pi { display: grid; width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--nx-teal-500) 12%, var(--nx-surface)); color: var(--nx-teal-700); font-size: 13px; place-items: center; }
[data-theme=dark] .rl-pop .pi { color: #9ff0e9; }
.rl-pop b { display: block; font-size: 13px; font-weight: 650; }
.rl-pop small { display: block; margin-top: 1px; color: var(--nx-ink-2); font-size: 11.8px; line-height: 1.4; }

/* ---------- timbre da impressão da tela ---------- */
.cq-timbre { display: none; }
@media print {
    @page { margin: 13mm 11mm 15mm; }
    .rl-menu, .rl-pop, .cq-tema, [data-tema] { display: none !important; }
    body.cq-imprimindo .cq-timbre { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center; margin: 0 0 14px; padding: 0 0 10px; border-bottom: 2px solid #10232a; color: #1f2a2d; }
    .cq-timbre img { height: 28px; }
    .cq-timbre__tit small { display: block; color: #0f6361; font-size: 8pt; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
    .cq-timbre__tit b { display: block; color: #10232a; font-size: 15pt; letter-spacing: -0.01em; }
    .cq-timbre__tit span { display: block; color: #52676d; font-size: 9pt; }
    .cq-timbre__meta { color: #52676d; font-size: 8.5pt; text-align: right; }
    body.cq-imprimindo { background: #fff !important; }
    body.cq-imprimindo .cq-corpo { padding: 0 !important; }
    body.cq-imprimindo .cq-rola, body.cq-imprimindo .rl-rola { max-height: none !important; overflow: visible !important; }
    body.cq-imprimindo .nx-card, body.cq-imprimindo .cq-cab { box-shadow: none !important; }
    body.cq-imprimindo .nx-card { break-inside: avoid-page; }
    body.cq-imprimindo .cq-cab__acoes, body.cq-imprimindo .nx-btn { display: none !important; }
    html { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ---------- gaveta de importação de demandas ---------- */
.im { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.im-passos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.im-passos li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding: 14px; border: 1px solid var(--nx-line); border-radius: 14px; background: var(--nx-surface-2); }
.im-passos__n { display: grid; width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(135deg, var(--nx-teal-500), var(--nx-teal-700)); color: #fff; font-size: 13px; font-weight: 750; place-items: center; }
.im-passos b { display: block; margin-top: 4px; font-size: 13.5px; }
.im-passos p { margin: 4px 0 10px; color: var(--nx-ink-2); font-size: 12.5px; line-height: 1.5; }
.im-passos .nx-btn { margin-top: 2px; }
.im-solta { display: grid; gap: 4px; justify-items: center; padding: 26px 16px; border: 2px dashed color-mix(in srgb, var(--nx-teal-500) 40%, var(--nx-line-2)); border-radius: 16px; background: color-mix(in srgb, var(--nx-teal-500) 4%, var(--nx-surface)); text-align: center; cursor: pointer; transition: border-color var(--vz-rapido, 160ms), background-color var(--vz-rapido, 160ms); }
.im-solta > .pi { margin-bottom: 4px; color: var(--nx-teal-600); font-size: 26px; }
.im-solta b { font-size: 14px; }
.im-solta small { color: var(--nx-ink-2); }
.im-solta:hover, .im-solta--sobre, .im-solta:focus-within { border-color: var(--nx-teal-500); background: color-mix(in srgb, var(--nx-teal-500) 9%, var(--nx-surface)); }
.im-solta--lendo { pointer-events: none; opacity: 0.8; }
.im-arquivo { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border: 1px solid var(--nx-line); border-radius: 12px; background: var(--nx-surface-2); }
.im-arquivo > .pi { display: grid; width: 36px; height: 36px; border-radius: 10px; background: #1d6f42; color: #fff; font-size: 16px; place-items: center; }
.im-arquivo b { display: block; font-size: 13.5px; overflow-wrap: anywhere; }
.im-arquivo small { color: var(--nx-ink-2); }
.im-resumo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.im-resumo__item { position: relative; display: grid; gap: 2px; padding: 12px 14px; overflow: hidden; border: 1px solid var(--nx-line); border-radius: 13px; background: var(--nx-surface); color: var(--nx-ink); font: inherit; text-align: left; cursor: pointer; transition: border-color var(--vz-rapido, 160ms), box-shadow var(--vz-rapido, 160ms); }
.im-resumo__item::before { position: absolute; inset: 0 0 auto; height: 3px; background: var(--nx-line-2); content: ""; }
.im-resumo__item--ok::before { background: var(--nx-ok, #1b6a3a); }
.im-resumo__item--crit::before { background: var(--nx-crit, #b42318); }
.im-resumo__item b { font-size: 24px; font-variant-numeric: tabular-nums; font-weight: 760; letter-spacing: -0.03em; line-height: 1.1; }
.im-resumo__item span { color: var(--nx-ink-2); font-size: 12px; }
.im-resumo__item:hover { border-color: var(--nx-line-2); }
.im-resumo__item--on { border-color: var(--nx-teal-500); box-shadow: inset 0 0 0 1px var(--nx-teal-500); }
.im-rola { max-height: 46vh; border: 1px solid var(--nx-line); border-radius: 12px; }
.im-tab { margin: 0; }
.im-tab thead th { position: sticky; top: 0; z-index: 1; background: var(--nx-surface-2); box-shadow: inset 0 -1px 0 var(--nx-line); white-space: nowrap; }
.im-tab td { vertical-align: top; }
.im-tab .ag-tipo { white-space: nowrap; }
.im-n { width: 56px; color: var(--nx-ink-3); font-variant-numeric: tabular-nums; text-align: right; }
.im-data { white-space: nowrap; }
.im-atraso { display: block; color: var(--nx-warn-forte, #8a5a00); font-size: 11px; }
.im-erros { margin: 6px 0 0; padding-left: 16px; color: var(--nx-crit, #b42318); font-size: 12px; line-height: 1.45; }
.im-linha--erro td { background: color-mix(in srgb, var(--nx-crit, #b42318) 4%, transparent); }
.im-linha--lancada td, .im-linha--repetida td { color: var(--nx-ink-3); }
.gq-aviso--crit { border-left-color: var(--nx-crit, #b42318); background: var(--nx-crit-bg, #fdecea); }
.gq-aviso--crit .pi { color: var(--nx-crit, #b42318); }

@media (max-width: 1100px) {
    .rl { grid-template-columns: minmax(0, 1fr); }
    .rl-nav { position: static; max-height: none; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
}
@media (max-width: 760px) {
    .rl-cab { grid-template-columns: 40px minmax(0, 1fr); }
    .rl-cab__acoes { grid-column: 1 / -1; justify-content: stretch; }
    .rl-cab__acoes .nx-btn { flex: 1; justify-content: center; }
    .rl-campo--periodo, .rl-campo--busca { grid-column: 1 / -1; }
    .rl-total { border-right: 0; }
    .rl-menu__botao span { display: none; }
    .im-passos, .im-resumo { grid-template-columns: minmax(0, 1fr); }
}