/* Painel Ads Manager — tema escuro */
:root { --bg:#0f1117; --card:#181b25; --borda:#262a38; --txt:#e8eaf0; --mut:#8b90a0; --azul:#4d8dff; --verde:#2ecc71; --verm:#ff5d5d; --amar:#f5b942; }
* { box-sizing:border-box; margin:0; }
body { background:var(--bg); color:var(--txt); font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif; padding:0 0 60px; }
a { color:var(--azul); text-decoration:none; }
nav { display:flex; gap:4px; align-items:center; padding:14px 22px; border-bottom:1px solid var(--borda); flex-wrap:wrap; }
nav .logo { font-weight:700; margin-right:18px; font-size:17px; }
nav a { padding:7px 14px; border-radius:8px; color:var(--mut); }
nav a.ativo, nav a:hover { background:var(--card); color:var(--txt); }
nav select { margin-left:auto; }
main { max-width:1180px; margin:24px auto; padding:0 22px; }
h1 { font-size:22px; margin:8px 0 18px; } h2 { font-size:16px; margin:26px 0 12px; color:var(--mut); text-transform:uppercase; letter-spacing:.5px; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; }
.card { background:var(--card); border:1px solid var(--borda); border-radius:12px; padding:16px; }
.card .rotulo { color:var(--mut); font-size:12px; text-transform:uppercase; letter-spacing:.5px; }
.card .valor { font-size:24px; font-weight:700; margin-top:4px; }
.card .sub { color:var(--mut); font-size:12px; margin-top:2px; }
.bom { color:var(--verde); } .ruim { color:var(--verm); } .neutro { color:var(--amar); }
table { width:100%; border-collapse:collapse; background:var(--card); border-radius:12px; overflow:hidden; font-size:13.5px; }
th, td { padding:9px 12px; text-align:right; border-bottom:1px solid var(--borda); white-space:nowrap; }
th { color:var(--mut); font-weight:600; cursor:pointer; user-select:none; position:sticky; top:0; background:var(--card); }
th:first-child, td:first-child { text-align:left; }
td.nome { max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left; }
tr:hover td { background:#1d2130; }
input, select, textarea, button { font:inherit; color:var(--txt); background:#12141d; border:1px solid var(--borda); border-radius:8px; padding:8px 12px; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--azul); }
button { cursor:pointer; background:var(--azul); border:none; font-weight:600; }
button:hover { filter:brightness(1.1); }
button.sec { background:var(--card); border:1px solid var(--borda); }
button.perigo { background:var(--verm); }
.linha { display:flex; gap:10px; flex-wrap:wrap; align-items:end; margin:10px 0; }
.campo { display:flex; flex-direction:column; gap:4px; }
.campo label { font-size:12px; color:var(--mut); }
.grafico { background:var(--card); border:1px solid var(--borda); border-radius:12px; padding:16px; margin:12px 0; }
.pill { display:inline-block; padding:2px 9px; border-radius:20px; font-size:11.5px; }
.pill.on { background:#153f2b; color:var(--verde); } .pill.off { background:#3f1c1c; color:var(--verm); } .pill.outro { background:#3d3418; color:var(--amar); }
.aviso { background:#25202f; border:1px solid var(--borda); border-radius:10px; padding:12px 16px; margin:12px 0; color:var(--mut); }
.tabela-scroll { overflow:auto; max-height:540px; border-radius:12px; }
@media (max-width:700px){ nav{padding:10px 12px} main{padding:0 12px} }