/* ARI Acesso Remoto — estilos do painel */
:root{
  --azul:#0b3d91; --azul2:#0f4fbf; --azul-esc:#082c69; --azul-claro:#e8efff;
  --fundo:#f3f5f9; --cartao:#fff; --borda:#e1e6ef; --texto:#1b2233; --cinza:#5b6474; --cinza2:#8b93a3;
  --verde:#16924a; --verde-claro:#e3f6ea; --vermelho:#cf3434; --vermelho-claro:#fde8e8;
  --laranja:#c97800; --laranja-claro:#fff3dc; --raio:10px;
  --sombra:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.08);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font:14px/1.45 "Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:var(--texto);background:var(--fundo)}
a{color:var(--azul2)}
button,input,select,textarea{font:inherit;color:inherit}
.oculto{display:none!important}

/* botões e campos */
.bt{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--borda);background:#fff;border-radius:8px;
  padding:7px 14px;cursor:pointer;font-weight:600;font-size:13px;white-space:nowrap;transition:.15s}
.bt:hover{background:#f6f8fc;border-color:#cdd5e3}
.bt:disabled{opacity:.5;cursor:default}
.bt.pri{background:var(--azul);border-color:var(--azul);color:#fff}
.bt.pri:hover{background:var(--azul2)}
.bt.verde{background:var(--verde);border-color:var(--verde);color:#fff}
.bt.perigo{color:var(--vermelho);border-color:#f1c4c4}
.bt.perigo:hover{background:var(--vermelho-claro)}
.bt.peq{padding:4px 10px;font-size:12px}
.bt.link{border:0;background:none;color:var(--azul2);padding:4px 6px}
.campo{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.campo label{font-size:12px;font-weight:600;color:var(--cinza)}
.inp{border:1px solid #cfd6e3;border-radius:8px;padding:8px 11px;background:#fff;outline:none;width:100%}
.inp:focus{border-color:var(--azul2);box-shadow:0 0 0 3px rgba(15,79,191,.15)}
.chk{display:flex;align-items:center;gap:8px;margin:6px 0;font-size:13px;cursor:pointer}
.erro-msg{background:var(--vermelho-claro);color:#9b1c1c;border-radius:8px;padding:8px 12px;font-size:13px;margin:8px 0}
.ok-msg{background:var(--verde-claro);color:#0f6b35;border-radius:8px;padding:8px 12px;font-size:13px;margin:8px 0}

/* login */
.login-pagina{min-height:100%;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(1200px 600px at 20% -10%,#1d5bd1 0,transparent 60%),linear-gradient(160deg,#082c69,#0b3d91 60%,#0d47a8)}
.login-cartao{background:#fff;border-radius:14px;padding:34px 34px 26px;width:360px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.marca{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.marca .logo{width:42px;height:42px;border-radius:10px;background:var(--azul);color:#fff;display:flex;align-items:center;
  justify-content:center;font-weight:800;font-size:15px;letter-spacing:.5px}
.marca h1{font-size:18px;margin:0}
.marca small{color:var(--cinza);font-size:12px}
.login-cartao .bt{width:100%;justify-content:center;padding:10px}

/* layout do painel */
.topo{background:var(--azul);color:#fff;display:flex;align-items:center;gap:16px;padding:0 22px;height:58px}
.topo .logo{width:34px;height:34px;border-radius:8px;background:#fff;color:var(--azul);font-weight:800;font-size:12px;
  display:flex;align-items:center;justify-content:center}
.topo h1{font-size:16px;margin:0;font-weight:700}
.topo .rev{font-size:12px;color:#c9d6f2}
.topo .esp{flex:1}
.topo .usuario{display:flex;align-items:center;gap:10px;font-size:13px}
.topo .bt{background:rgba(255,255,255,.12);border-color:transparent;color:#fff}
.topo .bt:hover{background:rgba(255,255,255,.22)}
.abas{display:flex;gap:4px;padding:0 22px;background:#fff;border-bottom:1px solid var(--borda)}
.aba{padding:13px 14px;border:0;background:none;cursor:pointer;font-weight:600;color:var(--cinza);border-bottom:2px solid transparent}
.aba:hover{color:var(--texto)}
.aba.ativa{color:var(--azul);border-bottom-color:var(--azul)}
main{padding:20px 22px 40px;max-width:1400px;margin:0 auto}
.faixa{margin:14px 22px 0;padding:10px 14px;border-radius:8px;font-size:13px;font-weight:600}
.faixa.aviso{background:var(--laranja-claro);color:#8a5200}
.faixa.erro{background:var(--vermelho-claro);color:#9b1c1c}

.cartao{background:var(--cartao);border:1px solid var(--borda);border-radius:var(--raio);box-shadow:var(--sombra)}
.cartao .cab{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--borda)}
.cartao .cab h2{font-size:15px;margin:0;flex:1}
.cartao .corpo{padding:16px}

.conectar{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;padding:16px;margin-bottom:16px}
.conectar .campo{margin:0}
.conectar .titulo{flex-basis:100%;font-weight:700;font-size:15px;margin-bottom:-4px}
.conectar .dica{flex-basis:100%;color:var(--cinza);font-size:12px;margin-top:-6px}
.id-inp{font:600 20px/1 Consolas,"SF Mono",monospace;letter-spacing:2px;width:190px}
.cod-inp{font:600 20px/1 Consolas,"SF Mono",monospace;letter-spacing:1px;width:190px}

.filtros{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.filtros .inp{width:260px}
.contagem{color:var(--cinza);font-size:12px}

table.tab{width:100%;border-collapse:collapse}
.tab th{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--cinza2);text-align:left;font-weight:700;
  padding:10px 12px;border-bottom:1px solid var(--borda);background:#fafbfd;position:sticky;top:0}
.tab td{padding:10px 12px;border-bottom:1px solid #eef1f6;vertical-align:middle}
.tab tr:hover td{background:#fafcff}
.tab .acoes{display:flex;gap:6px;justify-content:flex-end}
.tab .mono{font-family:Consolas,"SF Mono",monospace;font-weight:600}
.tab .sub{color:var(--cinza);font-size:12px}
.vazio{padding:40px;text-align:center;color:var(--cinza)}

.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#c3c9d4;margin-right:6px}
.dot.on{background:#22b35e;box-shadow:0 0 0 3px rgba(34,179,94,.18)}
.dot.sess{background:var(--vermelho);box-shadow:0 0 0 3px rgba(207,52,52,.18)}
.tag{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;background:#eef1f6;color:var(--cinza)}
.tag.verde{background:var(--verde-claro);color:var(--verde)}
.tag.vermelho{background:var(--vermelho-claro);color:var(--vermelho)}
.tag.laranja{background:var(--laranja-claro);color:var(--laranja)}
.tag.azul{background:var(--azul-claro);color:var(--azul)}

/* modal */
.fundo-modal{position:fixed;inset:0;background:rgba(10,20,40,.45);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px}
.modal{background:#fff;border-radius:12px;width:440px;max-width:100%;max-height:92vh;overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.modal .cab{padding:16px 20px;border-bottom:1px solid var(--borda);display:flex;align-items:center}
.modal .cab h3{margin:0;font-size:16px;flex:1}
.modal .corpo{padding:18px 20px}
.modal .pe{padding:12px 20px;border-top:1px solid var(--borda);display:flex;gap:8px;justify-content:flex-end;background:#fafbfd}
.grade2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}

.copiavel{display:flex;gap:8px;align-items:center}
.copiavel .inp{font-family:Consolas,monospace;font-size:13px}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#1b2233;color:#fff;padding:10px 18px;
  border-radius:8px;font-size:13px;z-index:99;box-shadow:0 8px 24px rgba(0,0,0,.25)}

/* página de download */
.baixar{max-width:560px;margin:60px auto;padding:0 20px}
.baixar .cartao{padding:30px}
.baixar ol{padding-left:20px;color:#374151}
.baixar li{margin:6px 0}
.baixar .bt{padding:12px 22px;font-size:15px}