/* Painel VIXPAR — porte do layout/estilo do painel legado (CTA/HTML). Funcional > bonito. */
:root{
  --red:#e11d48;--yellow:#fbbf24;--green:#059669;--blue:#0057d8;--orange:#f97316;
  --ink:#0b1736;--muted:#64748b;--line:#e7edf5
}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",Arial,sans-serif;background:#f8fafc;color:var(--ink)}

/* ===== Header (porte do header oficial VIXPAR) ===== */
header{background:#fff;border-bottom:1px solid #e5e7eb;padding:22px 28px}
.header-grid{display:grid;grid-template-columns:330px 1fr 230px;gap:30px;align-items:center}
.logo-strip{display:flex;align-items:center;justify-content:flex-start;min-width:0;white-space:nowrap}
.brand-wordmark{font-size:45px;font-weight:900;letter-spacing:6px;color:#0b1b46;line-height:1;white-space:nowrap}
.logo-separator{height:72px;width:2px;background:#cbd5e1;margin-left:26px;flex:0 0 auto}
.title-block{padding-left:0;border-left:0;min-width:0}
header h1{margin:0;font-size:30px;line-height:1.15;color:#0b1b46;font-weight:900;letter-spacing:-.35px}
header p{margin-top:12px;font-size:15px;color:#64748b;font-weight:700}
.header-actions{display:flex;flex-direction:column;gap:9px;align-items:flex-end;justify-self:end}
button{border:1px solid #e2e8f0;border-radius:10px;padding:10px 14px;font-weight:800;cursor:pointer;background:#f1f5f9;color:#0f172a}
button.primary{background:#fff;color:#0f172a;min-width:200px;min-height:50px;font-size:15px;border-radius:14px}

/* ===== Tabs ===== */
.tabs{display:flex;gap:8px;padding:14px 28px 0;background:#f8fafc;flex-wrap:wrap}
.tab{background:#fff;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;padding:12px 20px;font-size:14px;font-weight:800;color:#475569}
.tab.active{color:#0b1b46;box-shadow:0 -2px 8px rgba(15,23,42,.04);position:relative;top:1px;border-bottom:2px solid #fff}

.wrap{padding:18px 28px 36px}

/* ===== Cards ===== */
.cards{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:14px;margin-bottom:18px}
.card{background:#fff;border-radius:18px;padding:18px;box-shadow:0 2px 12px rgba(15,23,42,.05);border:1px solid var(--line);display:flex;gap:14px;align-items:center}
.ico{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:24px;font-weight:900;flex:0 0 auto}
.ico.blue{background:#0b63ce}.ico.red{background:#e11d48}.ico.yellow{background:#fbbf24}.ico.green{background:#059669}.ico.orange{background:#f97316}
.card small{display:block;color:#475569;font-weight:800;font-size:12px}
.card .val{font-size:28px;font-weight:900;margin:4px 0;color:#102044}
.card .sub{font-size:12px;color:#64748b;font-weight:700}

/* ===== Panels / tables ===== */
.panel{background:#fff;border-radius:18px;box-shadow:0 2px 12px rgba(15,23,42,.05);border:1px solid var(--line);overflow:auto;margin-bottom:18px}
.panel-head{display:flex;align-items:center;justify-content:space-between;padding:17px 18px;border-bottom:1px solid var(--line);gap:16px;flex-wrap:wrap}
.panel h2{margin:0;font-size:18px}
.legend{display:flex;gap:18px;font-size:13px;font-weight:800;align-items:center;flex-wrap:wrap}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px}
.dot.red{background:var(--red)}.dot.yellow{background:var(--yellow)}.dot.green{background:var(--green)}.dot.gray{background:#94a3b8}

table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:980px}
th{background:#071b3a;color:#fff;text-align:left;padding:12px 9px;white-space:nowrap;font-size:12px}
td{border-bottom:1px solid #eef2f7;padding:10px 9px;vertical-align:middle}
td.num,th.num{text-align:right}
tr.critico td{background:#fff1f2}
tr.atencao td{background:#fffbeb}
tr.ok td{background:#f0fdf4}
tr.sem td{background:#f1f5f9}
tr.best td.best-price{font-weight:900;color:#047857}

.badge{display:inline-block;padding:5px 9px;border-radius:999px;color:#fff;font-weight:900;font-size:11px;white-space:nowrap}
.badge.critico{background:var(--red)}.badge.atencao{background:var(--yellow);color:#0b1736}.badge.ok{background:var(--green)}.badge.sem{background:#64748b}
.badge.atrasado{background:var(--red)}.badge.bloqueado{background:#7c3aed}.badge.em_aberto{background:var(--orange)}
.badge.faturado{background:#0b63ce}.badge.cancelado{background:#64748b}.badge.verificar{background:#0891b2}
.badge.hoje{background:var(--green)}.badge.proximos_2d{background:var(--orange)}.badge.futuro{background:#64748b}
.badge.neutro{background:#94a3b8}

.bar{width:86px;height:9px;background:#e5e7eb;border-radius:99px;overflow:hidden;display:inline-block;vertical-align:middle;margin-right:8px}
.bar span{display:block;height:100%;background:#0057d8;border-radius:99px}
.bar.crit span{background:var(--red)}.bar.warn span{background:var(--yellow)}
.muted{color:#94a3b8}

.filters{display:flex;gap:10px;flex-wrap:wrap;padding:14px 18px;align-items:center;border-bottom:1px solid var(--line)}
.filter-label{font-size:12px;font-weight:900;color:#334155;margin-right:-5px}
select,input{border:1px solid #cbd5e1;border-radius:12px;padding:9px 10px;min-width:150px;min-height:42px}
.counter{font-size:13px;font-weight:800;color:#334155}

/* ===== Boletos groups ===== */
.bgroup{border-bottom:1px solid var(--line)}
.bgroup-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:#f8fafc;font-weight:900}
.bgroup-head .gval{color:#047857}
.bgroup table{min-width:760px}

.error-box{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;border-radius:14px;padding:16px 18px;margin-bottom:18px;font-weight:700}
.empty{padding:18px;color:#64748b;font-weight:700}
.hidden{display:none}

@media print{.header-actions,.tabs,.filters,.no-print{display:none}body{background:#fff}.card,.panel{box-shadow:none}.block.hidden{display:block!important}table{font-size:10px;min-width:auto}}
@media(max-width:1100px){.header-grid{grid-template-columns:1fr;gap:14px}.logo-separator{display:none}.header-actions{align-items:flex-start;justify-self:start}.cards{grid-template-columns:repeat(2,minmax(170px,1fr))}}
@media(max-width:720px){.cards{grid-template-columns:1fr}.brand-wordmark{font-size:34px;letter-spacing:5px}header h1{font-size:22px}}