/* ===== Tema "Sketch" (Bootstrap 5 admin) portado para o XUI Control — t44u/t45u =====
   Fonte Poppins (SIL OFL) auto-hospedada. Paleta, sidebar, topbar, cards, tabelas,
   formulários, botões e badges reproduzidos do template sem jQuery/JS do template. */
@font-face{font-family:Poppins;font-weight:300;font-display:swap;src:url(/static/vendor/fonts/poppins-300.woff2) format('woff2')}
@font-face{font-family:Poppins;font-weight:400;font-display:swap;src:url(/static/vendor/fonts/poppins-400.woff2) format('woff2')}
@font-face{font-family:Poppins;font-weight:500;font-display:swap;src:url(/static/vendor/fonts/poppins-500.woff2) format('woff2')}
@font-face{font-family:Poppins;font-weight:600;font-display:swap;src:url(/static/vendor/fonts/poppins-600.woff2) format('woff2')}
@font-face{font-family:Poppins;font-weight:700;font-display:swap;src:url(/static/vendor/fonts/poppins-700.woff2) format('woff2')}
:root,[data-theme=dark]{color-scheme:dark;
 --primary:#556ee6;--primary-h:#485ec4;--success:#34c38f;--info:#50a5f1;--warning:#f1b44c;--danger:#f46a6a;--orange:#f1734f;
 --bg:#222736;--bg2:#2a3042;--card:#2a3042;--card2:#32394e;--line:#32394e;--line2:#3b4359;--tx:#a6b0cf;--hd:#f6f6f6;--mu:#8b93ad;--mu2:#6a7187;
 --side:#2a3042;--side-tx:#a6b0cf;--side-hd:#6a7187;--side-on:#ffffff;--top:#2a3042;--inp:#2e3446;--inpb:#32394e;--th:#32394e;
 --ac:#556ee6;--ac2:#50a5f1;--grad:#556ee6;--ok:#34c38f;--warn:#f1b44c;--hi:#f1734f;--bad:#f46a6a;--r:6px;
 --sh:0 .75rem 1.5rem rgba(18,38,63,.03)}
[data-theme=light]{color-scheme:light;
 --bg:#f8f8fb;--bg2:#ffffff;--card:#ffffff;--card2:#eff2f7;--line:#eff2f7;--line2:#e2e6ee;--tx:#495057;--hd:#343a40;--mu:#74788d;--mu2:#8a8fa3;
 --side:#2a3042;--side-tx:#a6b0cf;--side-hd:#6a7187;--side-on:#ffffff;--top:#ffffff;--inp:#ffffff;--inpb:#ced4da;--th:#eff2f7;
 --ac:#556ee6;--ac2:#3f5bd8;--ok:#1f9d72;--warn:#b77d12;--hi:#c4532f;--bad:#d64545;--info:#2b84d6;--sh:0 .75rem 1.5rem rgba(18,38,63,.05)}
body{font-family:Poppins,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-size:13px;line-height:1.5;background:var(--bg);color:var(--tx);font-feature-settings:'tnum'}
body::before{display:none}
h1,h2,h3,h4,b,strong{color:var(--hd)}
/* ---- sidebar (vertical-menu dark, 250px) ---- */
aside{width:250px;background:var(--side)!important;backdrop-filter:none;-webkit-backdrop-filter:none;border-right:0;box-shadow:var(--sh)}
.brand{height:70px;padding:0 24px;background:var(--side)}.brand b{color:#fff;font-weight:600;font-size:16px}.brand small{color:var(--side-hd)}
.mark{background:var(--primary);border-radius:6px;box-shadow:none}
#nav{padding:6px 0 10px}.nsec{padding:14px 24px 6px;font-size:11px;font-weight:600;letter-spacing:.05em;color:var(--side-hd)!important}
#nav a{border-radius:0;margin:0;padding:10px 24px;font-size:13px;font-weight:400;color:var(--side-tx)!important;gap:12px;transition:color .2s}
#nav a .ic{width:18px;height:18px;color:#7f8ab0;transition:color .2s}
#nav a:hover{background:transparent!important;color:#fff!important}#nav a:hover .ic{color:#fff}
#nav a.on{background:rgba(255,255,255,.04)!important;color:var(--side-on)!important;box-shadow:inset 3px 0 0 var(--primary)}#nav a.on .ic{color:#fff!important}
.sidefoot{border-top:1px solid rgba(255,255,255,.06);color:var(--side-tx)}.sidefoot button.ghost{color:var(--side-tx);border-color:rgba(255,255,255,.12);background:transparent}
/* ---- topbar (page-topbar 70px) ---- */
main{padding:0 24px 60px}
header{height:70px;min-height:70px;padding:0 24px;margin:0 -24px 24px;background:var(--top);box-shadow:var(--sh);border-bottom:1px solid var(--line)}
header h1{font-size:16px;font-weight:600;color:var(--hd);text-transform:uppercase;letter-spacing:.02em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
header .sub{text-transform:none;font-weight:400;color:var(--mu);font-size:12px;letter-spacing:0;overflow:hidden;text-overflow:ellipsis}
/* ---- cards ---- */
.card{background:var(--card);backdrop-filter:none;-webkit-backdrop-filter:none;border:0;border-radius:var(--r);box-shadow:var(--sh);padding:20px;animation:none}
[data-theme=light] .card{border:1px solid #edf0f5}
.card h3{font-size:15px;font-weight:600;color:var(--hd);text-transform:none;letter-spacing:0;margin:0 0 14px}
.card h3 .ic{color:var(--primary)}
.grid{gap:24px;margin-bottom:24px}
.kpi{color:var(--hd);font-weight:600;font-size:22px;letter-spacing:0}
.kcard .kico,.kcard.c1 .kico,.kcard.c2 .kico,.kcard.c3 .kico,.kcard.c4 .kico{width:48px;height:48px;border-radius:50%;background:var(--primary);color:#fff!important}
.kcard.c1 .kico{background:var(--info)}.kcard.c2 .kico{background:var(--success)}.kcard.c3 .kico{background:var(--warning)}.kcard.c4 .kico{background:var(--danger)}
.kcard .kico .ic{width:22px;height:22px}
.card.inner,.xs .mini div,.timeline{background:var(--card2)!important;border:0}
/* ---- botões (btn / btn-primary / btn-light) ---- */
button{background:var(--primary);border:1px solid var(--primary);border-radius:4px;padding:.47rem .9rem;font:500 13px Poppins,system-ui;box-shadow:none;color:#fff}
button:hover{filter:none;background:var(--primary-h);border-color:var(--primary-h)}
button.ghost,.btn{background:var(--card2)!important;border:1px solid var(--line2);color:var(--tx);border-radius:4px}
button.ghost:hover{background:var(--line2)!important;color:var(--hd)}
button.danger{background:var(--danger);border-color:var(--danger);color:#fff!important}
.tabs{background:var(--card);border:0;border-radius:6px;padding:4px;box-shadow:var(--sh)}
.tabs button{border:0;border-radius:4px;color:var(--mu);background:transparent!important}.tabs button.on{background:var(--primary)!important;color:#fff!important;box-shadow:none}
.chip{border-radius:4px}.chip.on{background:var(--primary)!important;color:#fff!important;border-color:var(--primary)!important}
.helpb{background:var(--primary)!important;color:#fff;border-radius:50px;box-shadow:0 4px 14px rgba(85,110,230,.4)}
/* ---- formulários (form-control) ---- */
input,select,textarea{background:var(--inp)!important;border:1px solid var(--inpb);color:var(--tx)!important;border-radius:4px;padding:.47rem .75rem;font:400 13px Poppins,system-ui;line-height:1.5;min-height:38px}
input[type=checkbox],input[type=radio]{min-height:0;padding:0;width:16px;height:16px;accent-color:var(--primary)}
textarea{min-height:76px}
input:focus,select:focus,textarea:focus{border-color:#a0aef0;box-shadow:none}
input::placeholder,textarea::placeholder{color:var(--mu2)}
.form label,.sfld,.efm .sfld>span{color:var(--hd);font-weight:500}
.fld .ic{z-index:1}
/* ---- tabelas (table / table-light) ---- */
table{font-size:13px}th,td{padding:.75rem;border-bottom:1px solid var(--line)}
th{background:var(--th)!important;color:var(--hd);font-weight:600;font-size:13px;text-transform:none;letter-spacing:0}
tbody tr:hover{background:rgba(127,135,160,.06)!important}
.tbl{border-radius:4px}
/* ---- badges (badge-soft-*) ---- */
.tag{border-radius:4px;border:0;padding:.25em .6em;font-size:11px;font-weight:600}.tag::before{display:none}
.s-critico,.s-offline,.s-inactive,.s-failed,.s-fonte_offline{background:rgba(244,106,106,.18);color:var(--danger)}
.s-alto{background:rgba(241,115,79,.18);color:var(--orange)}
.s-medio,.s-iniciando{background:rgba(241,180,76,.18);color:var(--warning)}
.s-baixo,.s-info,.s-sob_demanda{background:rgba(80,165,241,.18);color:var(--info)}
.s-online,.s-active,.s-ok{background:rgba(52,195,143,.18);color:var(--success)}
.s-parado,.s-unknown,.s-direct_stream,.s-direct_source{background:rgba(116,120,141,.18);color:var(--mu)}
[data-theme=light] .s-online,[data-theme=light] .s-active,[data-theme=light] .s-ok{color:#1a8a63}
[data-theme=light] .s-medio,[data-theme=light] .s-iniciando{color:#9a6a0c}
[data-theme=light] .s-critico,[data-theme=light] .s-offline,[data-theme=light] .s-inactive,[data-theme=light] .s-failed,[data-theme=light] .s-fonte_offline{color:#c23b3b}
[data-theme=light] .s-baixo,[data-theme=light] .s-info,[data-theme=light] .s-sob_demanda{color:#1f6fb8}
[data-theme=light] .s-alto{color:#b3461f}
/* ---- alerts/banners (alert-*) ---- */
.alert{border-radius:4px;border:0;border-left:3px solid var(--mu);background:var(--card2)}
.banner{border-radius:4px;background:rgba(244,106,106,.15);border:1px solid rgba(244,106,106,.25);color:var(--tx)}
.banner.info{background:rgba(80,165,241,.13);border-color:rgba(80,165,241,.25);color:var(--tx)}
.banner.ok{background:rgba(52,195,143,.13);border-color:rgba(52,195,143,.25)}
[data-theme=light] .banner,[data-theme=light] .banner.info{color:#3c4450}
.bar{background:var(--card2);height:6px;border-radius:4px}.bar i{background:var(--primary);border-radius:4px}.bar i.w{background:var(--warning)}.bar i.b{background:var(--danger)}
.dot.ok{background:var(--success);box-shadow:none}.dot.bad{background:var(--danger)}.dot.warn{background:var(--warning)}
code,pre.log{background:var(--card2)!important;color:var(--tx)!important;border-color:var(--line)}
.modal .card,.dw{background:var(--card)!important}.modal{background:rgba(0,0,0,.5);backdrop-filter:none}
.toast{border-radius:4px}
.sk{background:linear-gradient(90deg,var(--card) 25%,var(--card2) 37%,var(--card) 63%)!important;background-size:400% 100%!important}
a,.lnk{color:var(--primary)}
.leaflet-container{font-family:Poppins,system-ui}
/* ---- login (auth-login) ---- */
#login{background:var(--bg)}
.loginbox{padding:0!important;overflow:hidden;max-width:440px;background:var(--card)!important;gap:0}
.loginbox::before{content:'Bem-vindo de volta!';display:block;background:rgba(85,110,230,.25);color:var(--primary);font-weight:600;font-size:15px;padding:22px 24px 46px;margin-bottom:-28px}
.loginbox>*{margin-left:24px!important;margin-right:24px!important}
.loginbox .mark{width:64px;height:64px;border-radius:50%;margin:0 auto 10px!important;border:5px solid var(--card);box-sizing:content-box}
.loginbox h2{font-size:20px;font-weight:600}.loginbox p{margin-bottom:16px}
.loginbox .fld{margin-bottom:14px}.loginbox button{margin-top:6px;margin-bottom:6px}.loginbox .lfoot{margin-bottom:22px}
/* ---- mobile ---- */
#bnav{background:var(--top)!important;border:1px solid var(--line);border-radius:6px;box-shadow:0 -4px 20px rgba(0,0,0,.15)}
#bnav a.on{background:var(--primary)!important;color:#fff!important}#bnav a.on .ic{color:#fff!important}
@media(max-width:860px){
 main{padding:0 12px calc(84px + env(safe-area-inset-bottom))}
 header{margin:0 -12px 16px;padding:0 12px;height:60px;min-height:60px}
 .grid{gap:12px;margin-bottom:12px}.card{padding:14px}
 .kcard .kico,.kcard.c1 .kico,.kcard.c2 .kico,.kcard.c3 .kico,.kcard.c4 .kico{width:34px;height:34px}.kcard .kico .ic{width:16px;height:16px}
 aside{box-shadow:10px 0 30px rgba(0,0,0,.35)}
}
/* ---- estabilidade: sem salto de layout ---- */
.chart{contain:size layout}
.kcard{min-height:132px}
html{scrollbar-gutter:stable}
/* ---- marca oficial (logo do Talisson) + paleta derivada do logo ---- */
:root,[data-theme=dark],[data-theme=light]{--primary:#2f6bff;--primary-h:#1f58e6;--ac:#2f6bff;--grad:#2f6bff;--info:#13b9e6;--cyan:#00d4f5}
[data-theme=light]{--ac2:#0a5cff}
.brand{justify-content:flex-start}.blogo{height:40px;width:auto;display:block}
.llogo{display:flex;justify-content:center;margin:0 auto 6px!important;background:var(--card);padding:10px 14px;border-radius:12px;position:relative}
.llogo img{height:53px;width:auto}.lg-l{display:none}[data-theme=light] .lg-d{display:none}[data-theme=light] .lg-l{display:block}
.loginbox::before{background:linear-gradient(135deg,rgba(10,92,255,.28),rgba(0,229,255,.18));color:var(--cyan)}
[data-theme=light] .loginbox::before{color:#0a5cff}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);margin:0!important}
#nav a.on{box-shadow:inset 3px 0 0 var(--cyan)}
.kcard.c1 .kico{background:var(--info)}
.plogo{margin:0 0 18px}.plogo img{height:48px;width:auto}
/* Card Operadoras (dashboard) */
.opc{cursor:pointer;display:flex;flex-direction:column;min-height:440px}
.opc:hover{box-shadow:0 0 0 1px var(--primary) inset}
.opc .oplist{height:340px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;padding-right:4px}
.oprow{display:flex;align-items:center;gap:12px;min-height:52px;padding:6px 0;border-bottom:1px solid var(--bd)}
.oprow:last-child{border-bottom:0}
.oplg{flex:0 0 56px;height:32px;border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:center;padding:4px 6px;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.oplg img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.oplg.ini{background:var(--c);color:#fff;font-weight:700;font-size:13px;letter-spacing:.5px}
.opmid{flex:1;min-width:0}
.opn{display:flex;justify-content:space-between;gap:8px}.opn b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.opbar{height:6px;border-radius:3px;background:var(--card2);margin:4px 0;overflow:hidden}
.opbar i{display:block;height:100%;background:var(--c);border-radius:3px;transition:width .4s}
.oprow .tag,.oprow .badge{flex:0 0 auto}
.opft{margin:auto 0 0;padding-top:8px}
.ispb.img{width:auto;min-width:30px;padding:0 3px}.ispb.img img{height:12px;max-width:40px;width:auto}
.opn span{white-space:nowrap;flex:0 0 auto}.oprow .muted.small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opc h3{flex-wrap:wrap;row-gap:4px}
@media(max-width:600px){.oplg{flex-basis:48px;height:30px}.oprow{gap:10px;min-height:56px}}