/* Design unico do painel (ADM e cliente): tokens, campos, botoes, cartoes, tabelas, status.
   Carregado por ultimo em cada pagina, por isso sobrescreve o <style> interno e o tema futuro
   (mesma identidade nos dois). A cor da marca entra por --ac (inline no html); o resto deriva dela. */

/* ---------- tokens (claro) ---------- */
:root{
  --bg:#f4f6f8;--card:#ffffff;--tx:#0f172a;--mu:#5b6b82;--bd:#e2e8f0;--bd-in:#cbd5e1;--in:#ffffff;
  --ac:#2563eb;--ac-h:color-mix(in srgb,var(--ac) 86%,#000);--ac-s:color-mix(in srgb,var(--ac) 12%,transparent);
  --ac-tx:#ffffff;--ac2:#7c3aed;
  --ok:#15803d;--wa:#a16207;--er:#b91c1c;--in-c:#1d4ed8;
  --okb:#dcfce7;--wab:#fef3c7;--erb:#fee2e2;--inb:#e0e7ff;
  --focus:0 0 0 3px color-mix(in srgb,var(--ac) 35%,transparent);
  --sh:0 1px 2px rgba(15,23,42,.06),0 6px 18px -12px rgba(15,23,42,.18);
  --r:14px;--r-s:10px;--r-xs:8px;--r-pill:999px;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;
  --fs-xs:12px;--fs-s:13px;--fs-b:15px;--fs-l:16px;--fs-h:18px;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,Inter,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color-scheme:light;
}
/* ---------- tokens (escuro): sistema, ou escolha explicita, ou tema futuro ---------- */
@media(prefers-color-scheme:dark){:root:not([data-tema=claro]){
  --bg:#0b1220;--card:#131c2e;--tx:#e5e9f0;--mu:#94a3b8;--bd:#25314a;--bd-in:#3a4a6b;--in:#0b1220;
  --ac:#60a5fa;--ac-tx:#0b1220;--ac2:#a78bfa;--ok:#4ade80;--wa:#facc15;--er:#f87171;--in-c:#93c5fd;
  --okb:#12351f;--wab:#3b3410;--erb:#42181b;--inb:#1e2a52;
  --sh:0 1px 2px rgba(0,0,0,.35);color-scheme:dark}}
:root[data-tema=escuro],:root.futuro{
  --bg:#0b1220;--card:#131c2e;--tx:#e5e9f0;--mu:#94a3b8;--bd:#25314a;--bd-in:#3a4a6b;--in:#0b1220;
  --ac:#60a5fa;--ac-tx:#0b1220;--ac2:#a78bfa;--ok:#4ade80;--wa:#facc15;--er:#f87171;--in-c:#93c5fd;
  --okb:#12351f;--wab:#3b3410;--erb:#42181b;--inb:#1e2a52;
  --sh:0 1px 2px rgba(0,0,0,.35);color-scheme:dark}

/* ---------- base ---------- */
html{-webkit-text-size-adjust:100%;max-width:100%;overflow-x:hidden}
body,:root.futuro body{background:var(--bg);color:var(--tx);font-family:var(--font);font-size:var(--fs-b);line-height:1.5;letter-spacing:0;margin:0;max-width:100%;overflow-x:hidden}
:root.futuro body:not(.tela-login):not(.tela-fundo){background:var(--bg)}
:root.futuro[data-orbita=suave]{background:var(--bg)}
:root.futuro[data-orbita=suave] body{background:var(--bg)}
:root.futuro main{perspective:none}
:root.futuro main .card.t3d,:root.futuro main .card{transform:none!important}
:root.futuro main .card.t3d::after,:root.futuro .card::before{display:none}
:root.futuro header img,:root.futuro h2::before,:root.futuro .dot.vermelho{animation:none;box-shadow:none;filter:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
img,canvas,svg,video,iframe{max-width:100%}
h1,h2,h3{color:var(--tx);line-height:1.25}
:root.futuro h2,:root.futuro .card h3{font-size:var(--fs-s);letter-spacing:.04em;text-transform:uppercase;color:var(--mu);font-weight:600;background:none;-webkit-text-fill-color:currentColor}
:root.futuro h2::before{content:none}
:root.futuro header h1{font-size:var(--fs-h);text-transform:none;letter-spacing:0;background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:var(--tx);color:var(--tx);font-weight:700}
:root.futuro .big{background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:var(--tx);color:var(--tx);text-shadow:none;font-weight:700}
::selection{background:var(--ac-s)}
a{color:var(--ac);text-underline-offset:2px}
p{overflow-wrap:anywhere}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px;border-radius:var(--r-xs)}
:root.futuro input:focus,:root.futuro select:focus,:root.futuro textarea:focus{box-shadow:var(--focus)!important}

/* ---------- cabecalho, navegacao ---------- */
:root.futuro header{background:var(--card);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid var(--bd);border-image:none;padding:var(--s3) var(--s4);box-shadow:var(--sh)}
header small,:root.futuro header small,:root.futuro header h1 small{color:var(--mu);font-size:var(--fs-xs);font-weight:500;-webkit-text-fill-color:var(--mu);text-transform:none;letter-spacing:0}
:root.futuro nav{background:var(--card);backdrop-filter:none;-webkit-backdrop-filter:none;border-top:1px solid var(--bd)}
:root.futuro nav button{letter-spacing:0;text-shadow:none}
:root.futuro nav button.on{color:var(--ac);text-shadow:none;background:var(--ac-s);border-color:transparent}
:root.futuro nav button.on svg{filter:none}
@media(min-width:700px){
  :root.futuro nav{background:none;border:0}
  :root.futuro nav button{border-radius:var(--r-s);border:1px solid var(--bd);background:var(--card)}
  :root.futuro nav button.on{background:var(--ac-s);border-color:transparent;box-shadow:none}
}

/* ---------- campos: input, select, textarea, label ---------- */
input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=file]):not([type=hidden]),
select,textarea,:root.futuro input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=file]):not([type=hidden]),:root.futuro select,:root.futuro textarea{
  font:inherit;font-size:var(--fs-l);color:var(--tx);background:var(--in)!important;border:1px solid var(--bd-in)!important;
  border-radius:var(--r-s);padding:10px 12px;min-height:44px;width:100%;max-width:100%;min-width:0;box-sizing:border-box;box-shadow:none}
textarea{min-height:96px;line-height:1.45;resize:vertical}
select{appearance:auto}
input::placeholder,textarea::placeholder{color:var(--mu);opacity:.8}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ac)!important;box-shadow:var(--focus)!important}
input:disabled,select:disabled,textarea:disabled,[readonly]{opacity:.7}
input[type=color]{min-height:44px;padding:4px;width:100%;border-radius:var(--r-s);border:1px solid var(--bd-in);background:var(--in)}
input[type=checkbox],input[type=radio]{width:18px;height:18px;min-width:18px;min-height:18px;accent-color:var(--ac);margin:0;flex:none;cursor:pointer}
input[type=file]{font-size:var(--fs-s);color:var(--mu);max-width:100%}
label{color:var(--mu);font-size:var(--fs-s);font-weight:600;cursor:default}
label:not(.ck):not(.lin):not(:has(input[type=checkbox])):not(:has(input[type=radio])){display:block;margin:var(--s3) 0 var(--s1)}
label.ck,label:has(input[type=checkbox]){display:flex;gap:var(--s2);align-items:flex-start;color:var(--tx);font-weight:400;font-size:var(--fs-b);cursor:pointer}
.mdl label,#s-marca label,#s-atd label{display:block;margin:var(--s3) 0 var(--s1)}
.mdl .par{gap:var(--s2)}
.wa-sel,.atd-lista input,.atd-env input{font-size:var(--fs-l)}
.seg input{display:none}
.msg,#m{font-size:var(--fs-s)}

/* ---------- botoes ---------- */
button,.btn{font:inherit;font-size:var(--fs-b);font-weight:600;line-height:1.2;color:var(--tx);background:var(--card);border:1px solid var(--bd-in);border-radius:var(--r-s);padding:10px 16px;min-height:44px;cursor:pointer;transition:background .15s,border-color .15s,color .15s,box-shadow .15s,transform .05s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button:hover:not(:disabled){border-color:var(--ac);color:var(--ac)}
button:active:not(:disabled){transform:translateY(1px)}
button:disabled,.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.p,form>button,.cx0>button,body.tela-login button,:root.futuro .btn.p,:root.futuro #btUser,:root.futuro body.tela-login button{background:var(--ac);border-color:var(--ac);color:var(--ac-tx);font-weight:700;box-shadow:0 1px 2px rgba(15,23,42,.12)}
.btn.p:hover:not(:disabled),form>button:hover:not(:disabled),.cx0>button:hover:not(:disabled){background:var(--ac-h);border-color:var(--ac-h);color:var(--ac-tx)}
form>button,.cx0>button,body.tela-login button{width:100%;margin-top:var(--s3)}
.btn.d,:root.futuro .btn.d{border-color:var(--er);color:var(--er);background:var(--card)}
.btn.d:hover:not(:disabled){background:var(--erb);color:var(--er)}
:root.futuro .btn,:root.futuro .btn:hover:not(:disabled){box-shadow:none}
:root.futuro .btn:hover:not(:disabled){border-color:var(--ac);color:var(--ac)}
:root.futuro .btn.p:hover:not(:disabled){filter:none}
.ib{border-radius:var(--r-s);border-color:var(--bd-in);min-width:44px}
.sw button,.seg button{font-size:var(--fs-s);padding:8px 12px;min-height:40px;border-radius:var(--r-pill);background:var(--card)}
.sw button.on,.seg button.on,:root.futuro .sw button.on,:root.futuro .seg button.on{background:var(--ac);color:var(--ac-tx);border-color:var(--ac)}
.seg{border-radius:var(--r-s)}
.seg button{border-radius:0;min-height:40px}
.btns{gap:var(--s2)}

/* ---------- cartoes, modais, listas ---------- */
.card,.mdl,.cx0,form,#menuU,:root.futuro .card,:root.futuro .mdl,:root.futuro #menuU,:root.futuro body.tela-login form,:root.futuro body.tela-login .cx0,:root.futuro body.tela-fundo .card,:root.futuro body.tela-fundo form{
  background:var(--card);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--bd);border-radius:var(--r);box-shadow:var(--sh);transform:none}
.card{padding:var(--s4);min-width:0}
:root.futuro .card:hover{border-color:var(--bd);box-shadow:var(--sh)}
.card:hover{transform:none}
.ov{padding:var(--s4);background:rgba(15,23,42,.55)}
:root.futuro .ov{background:rgba(2,6,23,.6);backdrop-filter:none}
.mdl{padding:var(--s5) var(--s4)}
.mdl h3{font-size:var(--fs-h);color:var(--tx);text-transform:none;letter-spacing:0}
.row{border-color:var(--bd);gap:var(--s3)}
:root.futuro .row{border-color:var(--bd)}
:root.futuro .al{backdrop-filter:none;border:0}
#toast,:root.futuro #toast{background:var(--tx);color:var(--bg);border:0;box-shadow:var(--sh);border-radius:var(--r-s)}
.card h3,:root.futuro .card h3{margin-bottom:var(--s2)}

/* ---------- tabelas ---------- */
table{width:100%;border-collapse:collapse;font-size:var(--fs-s)}
th,td{text-align:left;padding:var(--s2);border-bottom:1px solid var(--bd);vertical-align:top;overflow-wrap:anywhere}
th{color:var(--mu);font-size:var(--fs-xs);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
tr:hover td{background:var(--ac-s)}
@media(max-width:700px){
  .tabela-scroll,.card:has(>table){overflow-x:auto}
}

/* ---------- status: tags e alertas ---------- */
.tag{font-size:var(--fs-xs);font-weight:600;padding:3px 10px;border-radius:var(--r-pill);background:var(--inb);color:var(--in-c);border:1px solid transparent;line-height:1.3}
.t-ok{background:var(--okb);color:var(--ok)}
.t-wa{background:var(--wab);color:var(--wa)}
.t-er{background:var(--erb);color:var(--er)}
:root.futuro .tag,:root.futuro .t-ok,:root.futuro .t-wa,:root.futuro .t-er{border:1px solid transparent}
.al{border-radius:var(--r-s);padding:var(--s3);font-size:var(--fs-s);border:1px solid transparent}
.al.erro{background:var(--erb);color:var(--er)}
.al.aviso{background:var(--wab);color:var(--wa)}
.al.info{background:var(--inb);color:var(--in-c)}
.al.ok{background:var(--okb);color:var(--ok)}
.cx{border-radius:var(--r-s)}
.cx.ok{border-color:var(--ok)}.cx.aviso{border-color:var(--wa)}.cx.erro{border-color:var(--er)}
.dot.verde,:root.futuro .dot.verde{background:var(--ok)}
.dot.amarelo,:root.futuro .dot.amarelo{background:var(--wa)}
.dot.vermelho,:root.futuro .dot.vermelho{background:var(--er)}
.bar,:root.futuro .bar{background:var(--bd);height:8px}
.bar i,:root.futuro .bar i{background:var(--ac);box-shadow:none}

/* ---------- layout e responsivo (gutter 16px, sem rolagem horizontal) ---------- */
main{padding:var(--s4);max-width:1100px;margin:0 auto;box-sizing:border-box}
.grid,.g2{gap:var(--s3)}
.grid>*,.g2>*,section>*,.card,.mdl,form,.cx0{min-width:0;max-width:100%}
.ov{padding:var(--s4)}
.mdl .btns{justify-content:flex-end}
.inlog,.cx-cmd,.cb-cmd,.pre{max-width:100%;overflow-x:auto}
.mu,small.mu{color:var(--mu)}
.big{font-size:28px;font-weight:700}
@media(max-width:480px){
  header{padding:var(--s2) var(--s4)}
  .card{padding:var(--s3)}
  .mdl{padding:var(--s4)}
  .mdl .par{grid-template-columns:1fr}
  .btns{flex-direction:row;flex-wrap:wrap}
  .btns>button,.btns>.btn{flex:1 1 auto}
}
@media(max-width:360px){
  main,.cx0,form{padding-left:var(--s3);padding-right:var(--s3)}
}
body.tela-login{padding:var(--s4)}