/* Relatórios de Chamados CEAC - Plugin Tecnologia */
:root{
  --petroleo:#0F262C; --petroleo2:#15343B; --linha-escura:#26525C;
  --fundo:#EEF3F2; --papel:#FFFFFF; --linha:#DCE5E4; --texto:#132A30; --suave:#5B7478; --apagado:#8AA0A3;
  --ti:#2F8FC9; --ok:#1E9E6A; --ok-claro:#DDF4EA; --atencao:#C98A12; --atencao-claro:#FBEFD2;
  --fora:#D64535; --fora-claro:#FBE1DD; --solic:#6E5BC7; --solic-claro:#ECE8FB; --area:#D7772A; --area-claro:#FCE8D6;
  --disp:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;
  --corpo:"Atkinson Hyperlegible","Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--corpo);font-size:15px;line-height:1.45;color:var(--texto);background:var(--fundo);-webkit-text-size-adjust:100%}
a{color:var(--ti)}
:focus-visible{outline:2px solid var(--ti);outline-offset:2px}
.num{font-family:var(--disp);font-variant-numeric:tabular-nums}

/* Barra do topo */
.topo{background:var(--petroleo);color:#ECF4F2;padding:14px clamp(16px,3vw,40px);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.marca{display:flex;align-items:center;gap:12px;font-family:var(--disp);font-weight:800;font-size:19px;letter-spacing:-.01em}
.marca .faixa{display:flex;gap:3px;width:34px;height:8px}
.marca .faixa i{flex:1;border-radius:3px}
.topo nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.topo nav a{color:#ECF4F2;text-decoration:none;font-size:14px;padding:7px 14px;border-radius:999px;border:1px solid var(--linha-escura)}
.topo nav a:hover{border-color:#7FC6F0}

.pagina{max-width:1320px;margin:0 auto;padding:clamp(16px,3vw,36px)}
h1{font-family:var(--disp);font-weight:800;font-size:clamp(26px,3vw,38px);letter-spacing:-.02em;line-height:1.05;margin:0 0 6px}
.sub{color:var(--suave);margin:0 0 22px}
h2{font-family:var(--disp);font-weight:600;font-size:19px;margin:0 0 4px;letter-spacing:-.01em}
.desc{color:var(--suave);font-size:13.5px;margin:0 0 14px;max-width:75ch}
.cartao{background:var(--papel);border:1px solid var(--linha);border-radius:18px;padding:clamp(16px,2vw,26px)}

/* Botões e campos */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:700;border:0;border-radius:12px;padding:12px 20px;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn svg{width:17px;height:17px}
.btn-principal{background:var(--petroleo);color:#fff}
.btn-principal:hover{background:#18404A}
.btn-claro{background:var(--papel);color:var(--texto);border:1px solid var(--linha)}
.btn-claro:hover{border-color:var(--suave)}
.btn-ok{background:var(--ok);color:#fff}
.btn-ok:hover{filter:brightness(.95)}
.btn-fora{background:var(--fora);color:#fff}
.btn-fora:hover{filter:brightness(.95)}
label{display:block;font-size:13px;font-weight:700;color:var(--suave);margin:0 0 6px}
input[type=text],input[type=password],select{width:100%;font:inherit;color:var(--texto);background:#F7FAF9;border:1px solid var(--linha);border-radius:12px;padding:11px 13px;min-height:46px}
input:focus,select:focus{outline:2px solid var(--ti);outline-offset:1px;border-color:transparent;background:#fff}
.erro{background:var(--fora-claro);border:1px solid var(--fora);color:#7A1E14;border-radius:12px;padding:10px 14px;margin:0 0 16px;font-size:14px}

/* Filtros */
.grade-filtros{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px 18px}
.acoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;align-items:center}
.atalhos{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.atalhos button{font:inherit;font-size:13px;background:#F1F6F5;border:1px solid var(--linha);border-radius:999px;padding:6px 12px;cursor:pointer;color:var(--texto)}
.atalhos button:hover{border-color:var(--suave)}

/* Indicadores */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:18px}
.kpi{background:var(--papel);border:1px solid var(--linha);border-radius:16px;padding:16px 18px}
.kpi .v{font-family:var(--disp);font-weight:800;font-size:clamp(26px,2.4vw,34px);line-height:1;letter-spacing:-.02em}
.kpi .v small{font-size:.5em;color:var(--suave);font-weight:600;margin-left:2px}
.kpi .r{font-weight:700;margin-top:8px;font-size:14px}
.kpi .s{color:var(--suave);font-size:12.5px;margin-top:2px}
.kpi.destaque{background:var(--petroleo);border-color:var(--petroleo);color:#ECF4F2}
.kpi.destaque .s,.kpi.destaque .v small{color:#93B3B2}
.bom{color:var(--ok)} .medio{color:var(--atencao)} .ruim{color:var(--fora)}
.kpi.destaque .bom{color:#5CD6A4} .kpi.destaque .medio{color:#F4C257} .kpi.destaque .ruim{color:#F46B5E}

.regra{background:var(--papel);border:1px dashed var(--linha-escura);border-radius:14px;padding:12px 16px;color:var(--suave);font-size:13.5px;margin-bottom:18px}
.regra b{color:var(--texto)}
.regra summary{cursor:pointer;color:var(--texto);font-size:15px}
.calculo{display:grid;grid-template-columns:minmax(150px,max-content) 1fr;gap:6px 16px;margin:12px 0 2px}
.calculo dt{font-weight:700;color:var(--texto)}
.calculo dd{margin:0}
@media (max-width:640px){.calculo{grid-template-columns:1fr}.calculo dd{margin-bottom:6px}}

.duas{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;margin-bottom:18px}
.bloco{margin-bottom:18px}

/* Tabelas */
.tabela-rolagem{overflow-x:auto;margin:0 -4px;padding:0 4px}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:12px;font-weight:700;color:var(--suave);padding:8px 10px;border-bottom:2px solid var(--linha);white-space:nowrap}
td{padding:10px;border-bottom:1px solid var(--linha);vertical-align:top}
tr:hover td{background:#F7FAF9}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.barra{display:flex;height:10px;border-radius:5px;overflow:hidden;background:#EDF2F1;min-width:120px;gap:2px}
.barra i{display:block;height:100%}
.selo{display:inline-block;font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px;white-space:nowrap}
.s-no_prazo{background:var(--ok-claro);color:#0F6B47}
.s-fora,.s-estourado{background:var(--fora-claro);color:#9A2A1E}
.s-justificado{background:#E3F1FA;color:#1D6390}
.s-sem_prazo{background:#EEF1F1;color:var(--suave)}
.s-aberto_no_prazo{background:#E3F1FA;color:#1D6390}
.s-aguardando{background:var(--solic-claro);color:#4B3AA0}
.s-pausado{background:var(--area-claro);color:#8E4A12}
.f-excelente{background:var(--ok-claro);color:#0F6B47}
.f-bom{background:#E3F1FA;color:#1D6390}
.f-regular{background:var(--atencao-claro);color:#8A5B00}
.f-ruim{background:var(--fora-claro);color:#9A2A1E}
.faixas{display:flex;height:10px;border-radius:5px;overflow:hidden;gap:2px;margin-top:10px;background:#EDF2F1}
.faixas i{display:block;height:100%}
.id{font-family:var(--disp);font-weight:700;color:var(--suave)}
.assunto{font-weight:700}
.mini{display:block;font-size:12px;color:var(--suave);margin-top:2px}
.filtro-tabela{max-width:320px;margin-bottom:12px}
.vazio{padding:40px 10px;text-align:center;color:var(--suave)}

/* Login */
.tela-login{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:var(--petroleo)}
.login-lado{color:#ECF4F2;padding:clamp(28px,5vw,72px);display:flex;flex-direction:column;justify-content:space-between;gap:40px;
  background:radial-gradient(900px 500px at 10% 0%, #1d4a53 0%, transparent 60%), var(--petroleo)}
.login-lado h1{font-size:clamp(34px,4.4vw,58px);max-width:12ch;margin-top:30px}
.login-lado p{color:#93B3B2;max-width:44ch;font-size:16px}
.login-lado .faixa-grande{display:flex;height:14px;gap:5px;max-width:420px}
.login-lado .faixa-grande i{border-radius:5px}
.login-form{background:var(--fundo);display:flex;align-items:center;justify-content:center;padding:clamp(24px,5vw,64px)}
.login-caixa{width:100%;max-width:380px}
.login-caixa h2{font-size:26px;font-weight:800;margin-bottom:6px}
.login-caixa .campo{margin-bottom:16px}
.login-caixa .btn{width:100%;margin-top:6px}
.rodape{color:var(--apagado);font-size:12px;margin-top:26px}

@media (max-width:900px){
  .duas{grid-template-columns:1fr}
  .tela-login{grid-template-columns:1fr}
  .login-lado{gap:20px;padding-bottom:28px}
  .login-lado h1{margin-top:10px}
}
@media (max-width:640px){
  .topo{padding:12px 14px}
  .acoes .btn{flex:1}
  .kpis{grid-template-columns:1fr 1fr}
  table.responsiva thead{display:none}
  table.responsiva tr{display:block;border-bottom:1px solid var(--linha);padding:10px 0}
  table.responsiva td{display:flex;justify-content:space-between;gap:12px;border:0;padding:4px 2px;text-align:right}
  table.responsiva td::before{content:attr(data-rot);font-size:12px;color:var(--suave);font-weight:700;text-align:left}
  table.responsiva td.bloco-td{display:block;text-align:left}
  table.responsiva td.bloco-td::before{display:none}
}
@media print{
  .topo nav,.acoes,.filtro-tabela,.nao-imprimir{display:none!important}
  body{background:#fff}
  .cartao,.kpi{break-inside:avoid}
}