/* ===== Tema "Circuito Neon" – Arte Simas (11/11/2026) =====
   Visual futurista e delicado: fundo preto-esverdeado, linhas de circuito finas, bordas de 1px com brilho suave,
   cantoneiras nos cards, rótulos em fonte mono e botões principais em degradê verde (como "Acessar"). */
:root{
  --neo:#39ff14; --neo2:#22d36b; --neo-soft:rgba(57,255,20,.14); --neo-line:rgba(120,255,140,.16); --neo-glow:0 0 0 1px rgba(57,255,20,.35),0 0 22px rgba(57,255,20,.18);
  --ink:#04080a; --glass:rgba(10,18,16,.62); --glass2:rgba(14,24,20,.78); --txt:#e7f2ea; --txt2:#8fa79a; --cy:#5ee7ff;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
/* ---------- fundo da Central ---------- */
#central{background:
  radial-gradient(900px 480px at 50% -8%,color-mix(in srgb,var(--neo) 13%,transparent),transparent 62%),
  radial-gradient(700px 420px at 105% 30%,rgba(34,211,107,.07),transparent 60%),
  radial-gradient(600px 400px at -5% 80%,rgba(94,231,255,.05),transparent 60%),
  #030605 !important;color:var(--txt)}
#central::before{background-image:
  linear-gradient(rgba(120,255,140,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(120,255,140,.045) 1px,transparent 1px),
  radial-gradient(circle at 1px 1px,rgba(120,255,140,.18) 1px,transparent 1.6px) !important;
  background-size:64px 64px,64px 64px,32px 32px !important;mask-image:linear-gradient(#000,rgba(0,0,0,.35) 70%,transparent) !important}
#central::after{content:"";position:fixed;left:0;right:0;top:0;height:1px;pointer-events:none;z-index:1;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--neo) 0%,transparent) 10%,color-mix(in srgb,var(--neo) 75%,transparent) 50%,color-mix(in srgb,var(--neo) 0%,transparent) 90%,transparent);
  box-shadow:0 0 18px color-mix(in srgb,var(--neo) 60%,transparent);animation:varre 7s ease-in-out infinite}
@keyframes varre{0%,100%{opacity:.35;transform:scaleX(.6)}50%{opacity:1;transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){#central::after{animation:none}}
#central ::-webkit-scrollbar{width:8px;height:8px}#central ::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--neo) 25%,transparent);border-radius:8px}#central ::-webkit-scrollbar-track{background:transparent}
#central{scrollbar-color:color-mix(in srgb,var(--neo) 30%,transparent) transparent}

/* ---------- cabeçalho ---------- */
#central .c-cab{padding:6px 0 14px;border-bottom:1px solid var(--neo-line);margin-bottom:22px}
#central .c-cab small{font-family:var(--mono);font-size:11px;letter-spacing:.32em;color:var(--neo);display:inline-flex;align-items:center;gap:8px}
#central .c-cab small::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--neo);box-shadow:0 0 10px var(--neo);animation:pisca 2s infinite}
@keyframes pisca{50%{opacity:.35}}
#central .c-cab h1{font-family:var(--display);font-weight:700;font-size:26px;letter-spacing:.02em;background:linear-gradient(90deg,#ffffff 0%,#c9ffd9 45%,var(--neo) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
#central .c-abas{gap:2px;padding:4px;border-radius:14px;background:rgba(255,255,255,.025);border:1px solid var(--neo-line);flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
#central .c-abas::-webkit-scrollbar{display:none}
#central .c-abas button{position:relative;white-space:nowrap;background:transparent;border:0;border-radius:10px;color:#a9bdb1;font-size:12.5px;font-weight:500;padding:9px 13px;letter-spacing:.01em;transition:color .15s,background .15s}
#central .c-abas button:hover{color:#fff;background:color-mix(in srgb,var(--neo) 6%,transparent)}
#central .c-abas button.on{color:#fff;background:linear-gradient(180deg,color-mix(in srgb,var(--neo) 16%,transparent),color-mix(in srgb,var(--neo) 4%,transparent));box-shadow:none}
#central .c-abas button.on::after{content:"";position:absolute;left:22%;right:22%;bottom:3px;height:2px;border-radius:2px;background:var(--neo);box-shadow:0 0 10px var(--neo)}
#central #c-fechar{border-radius:12px;border:1px solid var(--neo-line);background:rgba(255,255,255,.03);color:#cfe7d6}
#central #c-fechar:hover{border-color:var(--neo);color:var(--neo)}

/* ---------- textos ---------- */
#central .aviso-sync{font-size:13px;line-height:1.5;color:#b9cfc1;background:linear-gradient(90deg,color-mix(in srgb,var(--neo) 7%,transparent),color-mix(in srgb,var(--neo) 0%,transparent) 70%);border:0;border-left:2px solid var(--neo);border-radius:0 10px 10px 0;padding:10px 14px;margin-bottom:16px}
#central .aviso-sync b{color:#fff}
#central .fonte,#central .rv-n,#central .cz-sub,#central .rv-sub,#central .cl-sub{color:var(--txt2)}
#central .fonte{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;opacity:.7;margin-top:18px}
#central h3,#central h4{font-family:var(--display);letter-spacing:.01em}
#central .vazio{color:var(--txt2);font-family:var(--mono);font-size:12px;letter-spacing:.06em;padding:28px;text-align:center;border:1px dashed var(--neo-line);border-radius:14px}

/* ---------- KPIs: cartões de vidro com cantoneiras ---------- */
#central .kpis,#central .kpis4{gap:12px}
#central .kpi{position:relative;cursor:pointer;flex-direction:column;align-items:flex-start;gap:6px;padding:16px 18px;border-radius:14px;
  background:linear-gradient(160deg,color-mix(in srgb,var(--neo) 6%,transparent),rgba(255,255,255,.012) 55%);border:1px solid var(--neo-line);
  transition:transform .18s,border-color .18s,box-shadow .18s}
#central .kpi::before,#central .kpi::after{content:"";position:absolute;width:12px;height:12px;pointer-events:none;border-color:color-mix(in srgb,var(--neo) 55%,transparent);border-style:solid;opacity:.75;transition:all .2s}
#central .kpi::before{top:-1px;left:-1px;border-width:1px 0 0 1px;border-radius:14px 0 0 0}
#central .kpi::after{bottom:-1px;right:-1px;border-width:0 1px 1px 0;border-radius:0 0 14px 0}
#central .kpi:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--neo) 45%,transparent);box-shadow:var(--neo-glow)}
#central .kpi:hover::before,#central .kpi:hover::after{width:22px;height:22px;opacity:1}
#central .kpi b{font-family:var(--display);font-weight:700;font-size:28px;line-height:1;color:#fff}
#central .kpi span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--txt2)}
#central .kpi.k0 b{color:#b9c4ff}#central .kpi.k1 b{color:#ffd166}#central .kpi.k2 b{color:var(--cy)}#central .kpi.k3 b{color:var(--neo)}
#central .kpi.k-alerta{border-color:rgba(255,92,122,.4);background:linear-gradient(160deg,rgba(255,92,122,.09),rgba(255,255,255,.01) 55%)}
#central .kpi.k-alerta b{color:#ff8da3}#central .kpi.k-alerta::before,#central .kpi.k-alerta::after{border-color:rgba(255,92,122,.7)}
#central .kpi.on,#central .kpi.k-ativo{border-color:var(--neo);box-shadow:var(--neo-glow)}
#central .kpi .abre{position:absolute;right:12px;top:12px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--txt2);opacity:0;transition:opacity .15s}
#central .kpi:hover .abre{opacity:1;color:var(--neo)}

/* ---------- botões ---------- */
#central .btn{border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);color:#dbe9df;font-weight:500;padding:8px 13px;transition:all .15s;text-decoration:none}
#central .btn:hover{border-color:color-mix(in srgb,var(--neo) 50%,transparent);color:#fff;background:color-mix(in srgb,var(--neo) 6%,transparent)}
#central .btn.on{border-color:var(--neo);color:var(--neo);background:color-mix(in srgb,var(--neo) 8%,transparent)}
#central .btn.prim,.btn.prim{background:linear-gradient(180deg,color-mix(in srgb,var(--neo) 75%,#fff),var(--neo2));border:1px solid color-mix(in srgb,var(--neo) 60%,#fff);color:#031006;font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 6px 18px -6px color-mix(in srgb,var(--neo) 55%,transparent)}
#central .btn.prim:hover,.btn.prim:hover{filter:brightness(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 8px 24px -6px color-mix(in srgb,var(--neo) 75%,transparent);color:#031006}
#central .btn.urg,.btn.urg{background:linear-gradient(180deg,color-mix(in srgb,var(--neo) 75%,#fff),var(--neo2));border:1px solid rgba(160,255,150,.8);color:#031006;font-weight:800;animation:urgente 2.4s ease-in-out infinite}
@keyframes urgente{50%{box-shadow:0 0 0 4px color-mix(in srgb,var(--neo) 18%,transparent),0 0 24px color-mix(in srgb,var(--neo) 45%,transparent)}}
#central .btn.wa,.btn.wa{background:transparent;border:1px solid rgba(37,211,102,.35);color:#b6f5cf;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px}
#central .btn.wa::before,.btn.wa::before{content:"";width:14px;height:14px;flex:none;background:#25d366;-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2a10 10 0 0 0-8.7 14.9L2 22l5.2-1.3A10 10 0 1 0 12 2Zm5.3 14.1c-.2.6-1.3 1.2-1.8 1.2-.5.1-1 .1-3.2-.7-2.7-1.1-4.4-3.8-4.5-4-.1-.2-1.1-1.4-1.1-2.7s.7-1.9 1-2.2c.2-.3.5-.3.7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.4 0 .5l-.4.6-.4.4c-.1.1-.3.3-.1.6.2.3.7 1.2 1.6 1.9 1 .9 1.9 1.2 2.2 1.3.3.1.5.1.6-.1l.9-1c.2-.3.4-.2.6-.1l1.9.9c.3.1.5.2.5.3.1.2.1.6-.1 1.2Z"/></svg>') center/contain no-repeat;mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2a10 10 0 0 0-8.7 14.9L2 22l5.2-1.3A10 10 0 1 0 12 2Zm5.3 14.1c-.2.6-1.3 1.2-1.8 1.2-.5.1-1 .1-3.2-.7-2.7-1.1-4.4-3.8-4.5-4-.1-.2-1.1-1.4-1.1-2.7s.7-1.9 1-2.2c.2-.3.5-.3.7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.4 0 .5l-.4.6-.4.4c-.1.1-.3.3-.1.6.2.3.7 1.2 1.6 1.9 1 .9 1.9 1.2 2.2 1.3.3.1.5.1.6-.1l.9-1c.2-.3.4-.2.6-.1l1.9.9c.3.1.5.2.5.3.1.2.1.6-.1 1.2Z"/></svg>') center/contain no-repeat}
#central .btn.wa:hover,.btn.wa:hover{border-color:#25d366;background:rgba(37,211,102,.08);color:#fff}

/* ---------- cards (todas as abas) ---------- */
#central .rv-card,#central .cz,#central .cl,#central .mat,#central .fn-row,#central .mk-c,#central .col,#central .cartao,#central .rv-env,#central .rv-op,#central .pc-l,#central .fn-painel,#central .ad-win,#central .mk-w{
  background:linear-gradient(165deg,rgba(18,30,24,.72),rgba(8,14,12,.6));border:1px solid var(--neo-line);border-radius:16px;backdrop-filter:blur(6px);
  transition:border-color .2s,box-shadow .2s,transform .2s}
#central .rv-card,#central .cz,#central .cl,#central .mat,#central .fn-row,#central .mk-c{position:relative}
#central .rv-card::after,#central .cz::after,#central .cl::after,#central .mat::after,#central .fn-row::after,#central .mk-c::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;
  background:
   linear-gradient(var(--neo),var(--neo)) top left/14px 1px no-repeat,linear-gradient(var(--neo),var(--neo)) top left/1px 14px no-repeat,
   linear-gradient(var(--neo),var(--neo)) bottom right/14px 1px no-repeat,linear-gradient(var(--neo),var(--neo)) bottom right/1px 14px no-repeat;opacity:.45;transition:opacity .2s}
#central .rv-card:hover,#central .cz:hover,#central .cl:hover,#central .mat:hover,#central .fn-row:hover,#central .mk-c:hover{border-color:color-mix(in srgb,var(--neo) 32%,transparent);box-shadow:0 10px 40px -18px color-mix(in srgb,var(--neo) 35%,transparent)}
#central .rv-card:hover::after,#central .cz:hover::after,#central .cl:hover::after,#central .mat:hover::after,#central .fn-row:hover::after,#central .mk-c:hover::after{opacity:1}
#central .cl{border-left-width:1px}
#central .cl::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:2px;border-radius:2px;background:var(--cor);box-shadow:0 0 10px var(--cor)}
#central .mat{border-top-width:1px}

/* chips, tabelas e listas */
#central .rv-chip,#central .fn-chip,#central .st,#central .cl-pill,#central .pc-s,#central .tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;border-radius:6px}
#central .cl-falta span{font-family:var(--mono);font-size:10.5px;border-radius:5px;background:rgba(255,209,102,.08);color:#ffd166;border:1px solid rgba(255,209,102,.18)}
#central table th{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--txt2)}
#central .rv-r,#central .cz-r{border-bottom-color:rgba(120,255,140,.08)}
#central .rv-r.t b,#central .rv-acc{color:var(--neo)}
#central .sub-nav,#central #ft-bar .ft-g{background:rgba(255,255,255,.02);border:1px solid var(--neo-line)}
#central .sub-nav button.on,#central #ft-bar button.on{background:color-mix(in srgb,var(--neo) 14%,transparent);color:#fff;box-shadow:inset 0 -2px 0 var(--neo)}
#central #ft-bar .ft-r{font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;font-size:10.5px;color:var(--neo)}
#central input,#central textarea,#central select{background:rgba(0,0,0,.35);border-color:rgba(120,255,140,.18);color:var(--txt);border-radius:10px}
#central input:focus,#central textarea:focus{outline:none;border-color:var(--neo);box-shadow:0 0 0 3px color-mix(in srgb,var(--neo) 15%,transparent)}

/* linhas do tempo e grandes botões já existentes, no tom novo */
#central .tl-p:not(.on) .o{background:#07100b}#central .tl-p:not(.on):not(.tem) .o{border-color:rgba(120,255,140,.2)}
#central .tl::before{background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--neo) 35%,transparent),transparent)}
#central .cl-big button{background:linear-gradient(160deg,color-mix(in srgb,var(--neo) 5%,transparent),rgba(255,255,255,.01) 60%);border:1px solid var(--neo-line);border-left:2px solid var(--c)}
#central .cl-big button span{font-family:var(--display)}
#central .cl-big button small{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
#central .cl-big button.on{border-color:var(--c);box-shadow:0 0 0 1px var(--c),0 0 24px -6px var(--c)}

/* animação de entrada ao abrir uma aba ou uma lista */
#central [id^="c-v-"]:not([hidden]){animation:entra .35s ease-out}
#central .abrindo{animation:entra .35s ease-out}
@keyframes entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
#central .destaca{animation:destaca 1.6s ease-out}
@keyframes destaca{0%{box-shadow:0 0 0 2px var(--neo),0 0 40px color-mix(in srgb,var(--neo) 45%,transparent)}100%{box-shadow:none}}
@media (prefers-reduced-motion:reduce){#central [id^="c-v-"]:not([hidden]),#central .abrindo,#central .destaca,#central .btn.urg{animation:none}}

/* ---------- HUD do escritório 3D (botões do topo) ---------- */
.vistas button.destaque{background:rgba(6,14,10,.78);border:1px solid rgba(120,255,140,.22);color:#dff5e6;border-radius:10px;backdrop-filter:blur(6px);transition:all .15s}
.vistas button.destaque:hover{border-color:var(--neo);color:#fff;box-shadow:0 0 16px color-mix(in srgb,var(--neo) 25%,transparent)}
.vistas button.on{border-color:var(--neo)!important;color:var(--neo)!important}
.hud{border-color:rgba(120,255,140,.18)!important}
