/* Baita 360 · marca Baita Kão: vermelho #C1222F · amarelo #E3AD00 · off white #FEF3D7 · azul #054083 */
:root{
  --bg:#FEF3D7; --card:#FFFFFF; --ink:#231815; --muted:#6E5A4E; --line:#EBD9AE;
  --red:#C1222F; --red-dk:#9E1A25; --amarelo-marca:#E3AD00; --azul-marca:#054083;
  --zap:#1B8A4B; --zap-dk:#146C3A;
  --verde:#1F8A4C;   --verde-lt:#E1F3E8;
  --amarelo:#E3AD00; --amarelo-lt:#FCEDC0;
  --vermelho:#C1222F; --vermelho-lt:#FBE3E5;
  --azul:#054083;    --azul-lt:#E0E9F5;
  --titulo:hwt-artz,"Anton","Bebas Neue",Impact,sans-serif;
  --corpo:Barlow,system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:500 16px/1.45 var(--corpo);-webkit-font-smoothing:antialiased}
h1,h2{margin:0;text-wrap:balance;font-weight:400}
h1{font-family:var(--titulo);text-transform:uppercase;letter-spacing:.01em;color:var(--red);font-size:clamp(30px,6vw,42px);line-height:1.02}
h2{font-family:var(--titulo);text-transform:uppercase;letter-spacing:.015em;font-size:24px;line-height:1.1}
p{margin:0}
code{font-family:ui-monospace,Consolas,monospace;font-size:.92em}
a{color:var(--red)}
:focus-visible{outline:3px solid var(--amarelo-marca);outline-offset:2px}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* topo */
.topo{position:sticky;top:0;z-index:10;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 16px;padding-top:calc(8px + env(safe-area-inset-top,0px));flex-wrap:wrap;box-shadow:0 4px 0 var(--amarelo-marca)}
.marca{display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none}
.marca img{width:46px;height:auto;display:block}
.marca span{font:400 24px/1 var(--titulo);letter-spacing:.06em;color:#fff}
.menu{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.menu a,.menu button{color:#FDE7E8;text-decoration:none;font:700 15px var(--corpo);padding:8px 10px;border-radius:10px;background:none;border:0;cursor:pointer}
.menu a[aria-current]{background:#ffffff26;color:#fff}
.menu .sair{margin:0}

.pagina{max-width:1100px;margin:0 auto;padding-inline:16px;padding-block:24px 80px;display:grid;gap:16px}
/* botões */
.btn{display:inline-flex;justify-content:center;align-items:center;gap:6px;font:400 19px/1 var(--titulo);text-transform:uppercase;letter-spacing:.04em;color:#fff;background:var(--red);border:0;border-radius:12px;padding:13px 18px;cursor:pointer;text-decoration:none}
.btn{box-shadow:0 4px 0 var(--red-dk)}
.btn:active{transform:translateY(2px);box-shadow:0 2px 0 var(--red-dk)}
.btn-sec{display:inline-flex;align-items:center;gap:6px;font:800 14px/1 var(--corpo);color:var(--ink);background:var(--card);border:2px solid var(--line);border-radius:10px;padding:9px 12px;cursor:pointer;text-decoration:none;white-space:nowrap;list-style:none}
.btn-sec::-webkit-details-marker{display:none}
.etq{display:inline-block;font-size:12px;font-weight:800;padding:2px 8px;border-radius:99px;background:var(--amarelo-lt);color:var(--ink);vertical-align:middle}
.etq-off{background:#eee;color:#555}
.dica{color:var(--muted);font-size:14px}

/* formulários */
.form{display:grid;gap:8px;max-width:440px}
.form label{font-weight:800;font-size:14px;margin-top:6px}
.form input,.form select,.grade-filtros input,.grade-filtros select,.obs textarea,.status select{width:100%;font:700 16px var(--corpo);color:var(--ink);background:var(--card);border:2px solid var(--line);border-radius:12px;padding:10px 12px}
.form input:focus,.form select:focus,.grade-filtros input:focus,.grade-filtros select:focus,.obs textarea:focus,.status select:focus{border-color:var(--red);outline:none}
.form .btn{margin-top:10px}
.form.linha{display:flex;gap:8px;max-width:none;margin-top:8px;flex-wrap:wrap}
.form.linha input{flex:1;min-width:0}
.form.linha .btn{margin:0}
.cartao{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px}
.aviso{padding:10px 14px;border-radius:12px;font-weight:700;font-size:15px}
.aviso.ok{background:var(--verde-lt);color:#14532F}
.aviso.erro{background:var(--vermelho-lt);color:#7F1620}
.caixa-login{max-width:400px;margin:8vh auto 0;display:grid;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px 20px}
.caixa-login .logo-login{display:block;width:140px;height:auto;margin:0 auto}

/* acessos */
.lista-acessos{display:grid;gap:10px}
.acesso{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;align-items:center}
.acesso.bloqueado{opacity:.6}
.acoes-acesso{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start}
.acoes-acesso form{margin:0}

/* painel da triagem */
.cabeca{display:grid;gap:10px}
.link-form{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:var(--card);border:1px dashed var(--line);border-radius:12px;padding:8px 10px;font-size:14px}
.link-form span{font-weight:800;color:var(--muted)}
.link-form code{color:var(--red);word-break:break-all;flex:1;min-width:0}

.contadores{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media (min-width:760px){.contadores{grid-template-columns:repeat(6,1fr)}}
.cont{display:grid;gap:2px;background:var(--card);border:2px solid var(--line);border-radius:14px;padding:10px 12px;text-decoration:none;color:var(--ink)}
.cont b{font:400 32px/1 var(--titulo);font-variant-numeric:tabular-nums}
.cont span{font-size:12.5px;font-weight:800;color:var(--muted);line-height:1.2}
.cont.ativo{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.c-verde{background:var(--verde-lt);border-color:#BFE3CD}
.c-amarelo{background:var(--amarelo-lt);border-color:#EFD27A}
.c-vermelho{background:var(--vermelho-lt);border-color:#F1C2C7}
.c-azul{background:var(--azul-lt);border-color:#B7C9E2}

.filtros{background:var(--card);border:1px solid var(--line);border-radius:14px}
.filtros summary{cursor:pointer;font-weight:900;padding:12px 14px}
.grade-filtros{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;padding:0 14px 14px}
.grade-filtros label{display:grid;gap:4px;font-size:13px;font-weight:800;color:var(--muted)}
.datas{display:grid;grid-template-columns:1fr 1fr;gap:10px;grid-column:1/-1}
.botoes-filtro{display:flex;gap:8px;align-items:end;grid-column:1/-1}

.barra-lista{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.lista{display:grid;gap:12px}
@media (min-width:900px){.lista{grid-template-columns:1fr 1fr}}
.vazio{background:var(--card);border-radius:14px;padding:24px;text-align:center;color:var(--muted);font-weight:700}

.cand{--cor:var(--muted);--cor-lt:#eee;background:var(--card);border:1px solid var(--line);border-left:8px solid var(--cor);border-radius:16px;padding:14px 14px 12px;display:grid;gap:10px;align-content:start}
.cand.t-verde{--cor:var(--verde);--cor-lt:var(--verde-lt)}
.cand.t-amarelo{--cor:var(--amarelo);--cor-lt:var(--amarelo-lt)}
.cand.t-vermelho{--cor:var(--vermelho);--cor-lt:var(--vermelho-lt)}
.cand.t-azul{--cor:var(--azul);--cor-lt:var(--azul-lt)}
.cand.apagado{opacity:.62}
.cand-topo{display:flex;justify-content:space-between;align-items:center;gap:8px}
.selo{font-weight:900;font-size:14px;background:var(--cor-lt);color:var(--ink);border-radius:99px;padding:4px 10px}
.quando{font-size:13px;color:var(--muted);font-weight:700;white-space:nowrap}
.cand-nome{font-size:25px;line-height:1.05}
.motivo{font-size:14px;color:var(--muted);font-weight:700;margin-top:-6px}
.dados{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:0}
.dados div{min-width:0}
.dados .largo{grid-column:1/-1}
.dados dt{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.dados dd{margin:0;font-weight:700;font-size:15px;overflow-wrap:anywhere}
.fala{background:var(--bg);border-radius:10px;padding:8px 10px;font-size:14.5px;overflow-wrap:anywhere}
.acoes{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:end}
.btn-whats{display:flex;justify-content:center;align-items:center;gap:8px;min-height:48px;background:var(--zap);color:#fff;font:800 15px/1.1 var(--corpo);border-radius:12px;text-decoration:none;padding:8px 10px;text-align:center}
.btn-whats:active{background:var(--zap-dk)}
.btn-whats::before{content:"";width:20px;height:20px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 18.2a8.2 8.2 0 0 1-4.2-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2zm4.5-6.1c-.2-.1-1.5-.7-1.7-.8s-.4-.1-.6.1-.7.8-.8 1-.3.2-.5.1a6.7 6.7 0 0 1-3.3-2.9c-.3-.4.3-.4.7-1.3a.5.5 0 0 0 0-.4l-.8-1.9c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 0 0-.7.3 3 3 0 0 0-.9 2.2 5.2 5.2 0 0 0 1.1 2.7 11.8 11.8 0 0 0 4.5 4c1.7.7 2.3.8 3.2.6a2.7 2.7 0 0 0 1.8-1.2 2.2 2.2 0 0 0 .1-1.3c0-.1-.2-.2-.5-.3z'/%3E%3C/svg%3E") center/contain no-repeat}
.status,.obs{display:grid;gap:4px}
.status span,.obs span{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.status select{min-height:48px;padding:8px 10px;font-size:15px}
.obs textarea{font-size:15px;font-weight:600;resize:vertical;min-height:52px;line-height:1.35}
.salvo{font-size:13px;font-weight:800;color:var(--muted);min-height:1.2em;margin-top:-4px}
.salvo.ok{color:var(--verde)}
.salvo.erro{color:var(--red)}

.paginas{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;font-weight:800;color:var(--muted)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));background:var(--ink);color:#fff;font-weight:800;padding:12px 18px;border-radius:12px;z-index:20;max-width:calc(100% - 32px);box-shadow:0 10px 30px -10px #0008}
.toast.erro{background:var(--red)}

@media (max-width:420px){
  .acoes{grid-template-columns:1fr}
  .dados{grid-template-columns:1fr 1fr}
}

/* tela inicial */
.grade-modulos{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.modulo-card{display:grid;gap:6px;align-content:start;background:var(--card);border:2px solid var(--line);border-top:6px solid var(--red);border-radius:16px;padding:16px;text-decoration:none;color:var(--ink);min-height:132px}
.modulo-card:hover{border-color:var(--red)}
.modulo-card b{font:400 28px/1 var(--titulo);text-transform:uppercase;letter-spacing:.02em;color:var(--red)}
.modulo-card span{font-size:15px;font-weight:600}
.modulo-card small{font-size:12.5px;font-weight:800;color:var(--muted)}
.modulo-card.admin{border-top-color:var(--azul-marca)}
.modulo-card.admin b{color:var(--azul-marca)}

/* acessos por área */
.acesso-quem{display:grid;gap:4px;min-width:0;flex:1 1 280px}
.etqs-mod{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.etq-mod{font-size:12.5px;font-weight:800;padding:3px 9px;border-radius:99px;background:var(--azul-lt);color:var(--azul-marca)}
.etq-mod.vazio-mod{background:#eee;color:#555}
.acoes-acesso details[open]{flex-basis:100%}
.painel-mod{margin-top:8px;background:var(--bg);border-radius:12px;padding:12px;max-width:none}
.check{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px}
.check input{width:20px;height:20px;accent-color:var(--red)}
.areas{border:2px dashed var(--line);border-radius:12px;padding:10px 12px 12px;margin:8px 0 0;display:grid;gap:6px}
.areas legend{font-weight:900;font-size:14px;padding:0 6px}
.aviso-banco{display:grid;gap:10px;border-color:var(--amarelo-marca);background:var(--amarelo-lt)}
.status select:disabled,.obs textarea[readonly]{background:var(--bg);color:var(--muted)}
