/* Mega Dedicados — área do cliente: camada FINA sobre o KIT DO SITE (site/site.css = style.css do WordPress; sincroniza_site.sh).
   Decisão do Diego (21/10/2026): a área do cliente usa o MESMO sistema visual do site — escada de superfícies (página bg1, cartão bg2,
   destaque bg3, topo bg0 translúcido), ciano só em ação, branco só onde precisa (QR, impressão). Aqui ficam só apelidos de tokens e o que o WHMCS precisa. */
.mega-area{--ink2:var(--ink-2);--line2:var(--line-2);--sinal2:var(--sinal-2);--warn:#FFB547;--bad:#FF6B6B;--display:var(--font-display);--body:var(--font-ui);--mono:var(--font-mono)}
html.mega-area{background:var(--bg1)}
.mega-area body{display:flex;flex-direction:column;min-height:100vh;font-size:16px;background:var(--bg1)}
.mega-area #main-body,.mega-area .mg-fatura{flex:1 0 auto}
.mega-area #main-body{padding:28px 0 64px}
.mega-area #main-body>.container,.mega-area .master-breadcrumb>.container{max-width:var(--max);padding-inline:var(--gap)}
.mega-area .site-footer{margin-top:auto}
.mega-area .mg-mono{font-family:var(--mono);font-size:.92em}
.mega-area .site-header{z-index:1030}
/* menu do WHMCS dentro do painel .mega do site */
.mg-mega-grade{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2px 18px}
.mega-item>span{display:block}
.mg-conta{list-style:none;margin:0;padding:0;display:flex;align-items:center}
.mg-conta .top-link{display:inline-flex;align-items:center;gap:4px;padding:9px 11px;border-radius:8px;color:var(--ink);font-family:var(--font-ui);font-weight:600;font-size:15px;white-space:nowrap;background:transparent;border:0;cursor:pointer;text-decoration:none}
.mg-conta .top-link:hover,.mg-conta .top.is-open>.top-link{background:rgba(255,255,255,.07)}
.mg-conta .chev{font-size:12px;opacity:.7}
.mg-conta .top.is-open>.mega{display:block}
.mg-conta .mega-inner{max-width:var(--max);display:flex;justify-content:flex-end}
.mg-conta .mega-list{min-width:260px}
.mg-rodape-grade{grid-template-columns:1.4fr 1fr 1fr}
@media (max-width:1100px){.mg-conta .top-link{padding:8px 6px;font-size:14px}.mg-conta .mega-inner{justify-content:flex-start}}
@media (max-width:700px){.mg-rodape-grade{grid-template-columns:1fr}}

/* trilha + corpo */
.mg-trilha{background:transparent!important;padding:18px 0 0!important}
.mega-area .breadcrumb{background:none;padding:0;margin:0;font-size:14px}
.mega-area .breadcrumb-item,.mega-area .breadcrumb-item a{color:var(--mute)}.mega-area .breadcrumb-item.active{color:var(--ink2)}
.mega-area .breadcrumb-item+.breadcrumb-item::before{color:var(--line2)}
.mega-area #main-body{background:transparent!important;padding:24px 0 56px}
.mega-area #main-body>.container{max-width:1240px}

/* componentes do Twenty-One no escuro (vale pras telas que ainda não foram refeitas) */
.mega-area .card,.mega-area .panel,.mega-area .list-group-item,.mega-area .modal-content,.mega-area .popover{background:var(--bg2);color:var(--ink);border-color:var(--line2)}
.mega-area .card{border-radius:14px}
.mega-area .card-header,.mega-area .card-footer{background:rgba(255,255,255,.02);border-color:var(--line)}
.mega-area .text-muted,.mega-area .small,.mega-area small{color:var(--mute)!important}
.mega-area .table{color:var(--ink)}.mega-area .table td,.mega-area .table th{border-color:var(--line)}
.mega-area .table thead th,.mega-area .table thead td{color:var(--mute);font-weight:600;border-bottom-color:var(--line2)}
.mega-area .table-striped tbody tr:nth-of-type(odd){background:rgba(255,255,255,.02)}
.mega-area .table-hover tbody tr:hover{background:var(--bg3);color:#fff}
.mega-area .form-control,.mega-area .custom-select,.mega-area select.form-control{background:var(--bg0);color:#fff;border:1px solid var(--line2);border-radius:10px}
.mega-area .form-control:focus,.mega-area .custom-select:focus{border-color:var(--sinal);box-shadow:0 0 0 3px var(--sinal-dim);background:var(--bg0);color:#fff}
.mega-area .form-control::placeholder{color:var(--mute)}
.mega-area .input-group-text{background:var(--bg3);color:var(--ink2);border-color:var(--line2)}
.mega-area .btn-primary,.mega-area .btn-success{background:var(--sinal);border-color:var(--sinal);color:var(--sinal-ink);font-weight:700;border-radius:10px}
.mega-area .btn-primary:hover,.mega-area .btn-success:hover{background:var(--sinal2);border-color:var(--sinal2);color:var(--sinal-ink)}
.mega-area .btn-default,.mega-area .btn-secondary,.mega-area .btn-light,.mega-area .btn-outline-primary{background:var(--bg3);border:1px solid var(--line2);color:var(--ink);border-radius:10px}
.mega-area .btn-default:hover,.mega-area .btn-secondary:hover,.mega-area .btn-light:hover{background:var(--bg3);color:#fff}
.mega-area .btn-danger{background:transparent;border:1px solid var(--bad);color:var(--bad);border-radius:10px}
.mega-area .alert{border-radius:12px;color:var(--ink);background:var(--bg2);border:1px solid var(--line2)}
.mega-area .alert-success{border-color:var(--ok);background:rgba(54,211,153,.1)}
.mega-area .alert-warning{border-color:var(--warn);background:rgba(255,181,71,.1)}
.mega-area .alert-danger{border-color:var(--bad);background:rgba(255,107,107,.1)}
.mega-area .alert-info{border-color:var(--sinal);background:var(--sinal-dim)}
.mega-area .sidebar .card-title,.mega-area .sidebar .card-header{color:#fff}
.mega-area .sidebar .list-group-item{background:transparent;color:var(--ink2);border-color:var(--line)}
.mega-area .sidebar .list-group-item.active,.mega-area .sidebar .list-group-item:hover{background:var(--bg3);color:#fff;border-color:var(--line)}
.mega-area .page-item .page-link{background:var(--bg2);border-color:var(--line2);color:var(--ink2)}
.mega-area .page-item.active .page-link{background:var(--sinal);border-color:var(--sinal);color:var(--sinal-ink)}
.mega-area .modal-header,.mega-area .modal-footer{border-color:var(--line)}
.mega-area .close{color:var(--ink2);text-shadow:none;opacity:1}
.mega-area .modal-backdrop.show{background:#01192B;opacity:.75}
.mega-area .dropdown-menu{background:var(--bg2);border-color:var(--line2)}.mega-area .dropdown-item{color:var(--ink2)}.mega-area .dropdown-item:hover{background:var(--bg3);color:#fff}
.mega-area hr{border-color:var(--line)}

/* botões próprios */
.mg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:12px;font:700 15px var(--body);border:0;background:var(--sinal);color:var(--sinal-ink)!important;text-decoration:none!important;cursor:pointer}
.mg-btn:hover{background:var(--sinal2)}
.mg-btn-sec{background:var(--bg3);color:var(--ink)!important;border:1px solid var(--line2)}
.mg-btn-sec:hover{background:var(--bg3);color:#fff!important}

/* ── tela-ponte do pagamento (forwardpage) ── */
.mg-ponte{max-width:720px;margin:0 auto;padding:8px 0 24px}
.mg-passos{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:14px;color:var(--mute);margin-bottom:22px}
.mg-passos span{display:inline-flex;align-items:center;gap:8px}
.mg-passos span+span::before{content:"";width:28px;height:1px;background:var(--line2);margin:0 10px}
.mg-passos i{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--line2);display:inline-grid;place-items:center;font:700 12px var(--display);font-style:normal}
.mg-passos .ok i{background:var(--sinal);border-color:var(--sinal);color:var(--sinal-ink)}
.mg-passos .on{color:#fff}.mg-passos .on i{background:var(--sinal);border-color:var(--sinal);color:var(--sinal-ink);box-shadow:0 0 0 4px var(--sinal-dim)}
.mg-ponte-card{background:var(--bg2);border:1px solid var(--line2);border-radius:18px;padding:28px;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.mg-ponte-card h1{font-size:clamp(26px,3.4vw,34px);font-weight:700;margin:18px 0 6px}
.mg-ponte-msg{color:var(--ink2);margin:0 auto 18px;max-width:52ch}
.mg-ponte-barra{height:4px;border-radius:999px;background:var(--bg3);overflow:hidden;max-width:220px;margin:0 auto}
.mg-ponte-barra span{display:block;height:100%;width:40%;background:var(--sinal);border-radius:999px;animation:mgVai 1.4s ease-in-out infinite}
@keyframes mgVai{0%{transform:translateX(-100%)}100%{transform:translateX(260%)}}
.mg-ponte-gw{color:var(--ink2)}
.mg-ponte-gw img{background:#fff;padding:12px;border-radius:14px;max-width:240px;height:auto}
.mg-ponte-gw a{color:var(--sinal2)}
.mg-ponte-gw input[type=text],.mg-ponte-gw textarea{width:100%;background:var(--bg0);color:#fff;border:1px solid var(--line2);border-radius:10px;padding:10px 12px;font:13px var(--mono)}
.mg-ponte-gw .btn,.mg-ponte-gw button,.mg-ponte-gw input[type=submit]{background:var(--sinal);color:var(--sinal-ink);border:0;border-radius:10px;padding:10px 18px;font-weight:700}

/* ── fatura: faixa escura (page-head do site) + documento em PAPEL + painel Pagar = cartão em destaque do site ── */
.mg-fatura{width:100%;padding:0 0 64px}
.mg-fat-head{padding-block:28px 34px;border-bottom:1px solid var(--line)}
.mg-fat-head h1{font-size:clamp(34px,4.2vw,50px);margin:0;font-family:var(--font-mono);font-weight:500;letter-spacing:-.01em}
.mg-fat-head .eyebrow{margin-bottom:6px}
.mg-fat-head-linha{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.mg-voltar{display:inline-block;margin-bottom:18px;font-size:14.5px;color:var(--ink-2)!important}
.mg-voltar:hover{color:#fff!important}
.mg-datas{display:flex;flex-wrap:wrap;gap:4px 22px;margin:10px 0 0;color:var(--mute);font-size:15px}
.mg-datas b{color:var(--ink);font-weight:600}
.mg-fatura-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:28px;align-items:start;margin-top:32px}
@media (max-width:991px){.mg-fatura-grid{grid-template-columns:1fr}.mg-pagar{order:-1}}
.mg-status{display:inline-flex;align-items:center;gap:8px;padding:7px 15px;border-radius:999px;font:600 14.5px var(--font-ui);border:1px solid}
.mg-status::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.mg-status-aberta{color:var(--warn);border-color:rgba(255,181,71,.45);background:rgba(255,181,71,.1)}
.mg-status-paga{color:var(--ok);border-color:rgba(54,211,153,.45);background:rgba(54,211,153,.1)}
.mg-status-cobranca{color:var(--bad);border-color:rgba(255,107,107,.45);background:rgba(255,107,107,.1)}
.mg-status-neutra{color:var(--mute);border-color:var(--line-2)}
/* o documento em papel (mesmas cores das seções claras do site) */
.mg-papel{background:var(--paper);color:var(--paper-ink);border:1px solid var(--paper-line);border-radius:var(--radius);padding:clamp(20px,3vw,32px);box-shadow:var(--shadow)}
.mg-papel h2,.mg-papel .mg-sec-t{font:600 14.5px var(--font-ui);color:var(--paper-mute);margin:0 0 8px}
.mg-papel .mg-sec-t{margin-top:26px}
.mg-aviso{margin:0 0 18px;padding:12px 16px;border-radius:10px;border:1px solid var(--sinal-dk);background:rgba(0,181,234,.08);color:var(--paper-ink)}
.mg-aviso.ok{border-color:#1F9E6E;background:rgba(54,211,153,.12)}.mg-aviso.erro{border-color:#D9534F;background:rgba(255,107,107,.12)}
.mg-partes{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding-bottom:22px;border-bottom:1px solid var(--paper-line)}
@media (max-width:575px){.mg-partes{grid-template-columns:1fr}}
.mg-partes address{margin:0;color:var(--paper-ink);font-size:15.5px;line-height:1.6}
.mg-itens{list-style:none;margin:0;padding:0;border-top:1px solid var(--paper-line)}
.mg-itens li{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--paper-line)}
.mg-item-desc{color:var(--paper-mute);font-size:14.5px;line-height:1.65}
.mg-item-desc::first-line{color:var(--paper-ink);font-weight:600;font-size:15.5px}
.mg-item-val{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600;color:var(--paper-ink)}
.mg-totais{margin:0;padding:12px 0 0;display:grid;gap:6px;justify-content:end}
.mg-totais div{display:grid;grid-template-columns:auto 170px;gap:24px;align-items:baseline}
.mg-totais dt{font-weight:400;color:var(--paper-mute);text-align:right}
.mg-totais dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;color:var(--paper-ink)}
.mg-totais .mg-total{margin-top:6px;padding-top:10px;border-top:1px solid var(--paper-line)}
.mg-totais .mg-total dt{color:var(--paper-ink);font-weight:600}
.mg-totais .mg-total dd{font:700 24px var(--font-display);color:var(--paper-ink)}
.mg-nota{color:var(--paper-mute);font-size:14px;margin:10px 0 0}
.mg-credito{margin-top:20px;padding:16px;border:1px solid #1F9E6E;border-radius:10px;background:rgba(54,211,153,.1)}
.mg-credito .mg-linha{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.mg-credito .form-control{max-width:160px;background:#fff;color:var(--paper-ink);border-color:var(--paper-line)}
.mg-trans{border-top:1px solid var(--paper-line)}
.mg-tr{display:grid;grid-template-columns:1fr 1fr 1.4fr auto;gap:12px;padding:10px 0;border-bottom:1px solid var(--paper-line);font-size:14.5px;color:var(--paper-mute);font-variant-numeric:tabular-nums}
.mg-tr b{color:var(--paper-ink);text-align:right}
.mg-saldo{grid-template-columns:1fr auto}
@media (max-width:575px){.mg-tr{grid-template-columns:1fr auto}.mg-tr span:nth-child(2),.mg-tr span:nth-child(3){display:none}}
.mg-acoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.mg-papel .btn-ghost,.mg-papel .mg-btn-sec{background:#fff;color:var(--paper-ink)!important;border:1px solid var(--paper-line)}
.mg-papel .btn-ghost:hover,.mg-papel .mg-btn-sec:hover{border-color:var(--sinal-dk);color:var(--sinal-dk)!important;background:#fff}

/* painel Pagar = .plan.is-featured do site (cartão com borda ciano) */
.mg-pagar{position:sticky;top:96px;padding:24px 22px!important;gap:6px!important}
.mg-pagar-rot{margin:0;color:var(--ink-2);font-size:15px}
.mg-pagar-valor{margin:0;font:700 clamp(36px,4vw,46px)/1.05 var(--font-display);color:#fff;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.mg-pagar-venc{margin:0 0 14px;color:var(--mute);font-size:14.5px}
.mg-pagar-ok{margin:10px 0;font-weight:700}
.mg-gw-form label,.mg-pagar-gw{display:block;color:var(--ink-2);font-size:14px;margin:0 0 6px}
.mg-pagar-gw b{color:#fff}
.mg-gw-form .custom-select{height:48px;font-weight:600;background-color:var(--bg1)!important;border-color:var(--line-2)!important}
.mg-pagar-gw-html{margin-top:14px;color:var(--ink-2);font-size:14.5px;text-align:center}
.mg-pagar-gw-html img{display:block;margin:12px auto;background:#fff;padding:12px;border-radius:14px;max-width:100%;width:236px;height:auto}
.mg-pagar-gw-html input[type=text],.mg-pagar-gw-html textarea{width:100%;background:var(--bg1);color:#fff;border:1px solid var(--line-2);border-radius:10px;padding:10px 12px;font:12.5px var(--font-mono)}
.mg-pagar-gw-html .btn,.mg-pagar-gw-html button,.mg-pagar-gw-html input[type=submit],.mg-pagar-gw-html input[type=button]{width:100%;margin-top:8px;background:var(--sinal);color:var(--sinal-ink);border:0;border-radius:10px;padding:13px 18px;font:600 16px var(--font-ui);cursor:pointer}
.mg-pagar-gw-html .btn:hover,.mg-pagar-gw-html button:hover{background:var(--sinal-2);box-shadow:0 8px 28px var(--sinal-glow)}
.mg-pagar-gw-html a{color:var(--sinal)}
.mg-ajuda{display:block;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:14.5px;text-align:center;color:var(--ok)!important}
.mg-vazio{max-width:520px;margin:40px auto;text-align:center}

/* impressão: documento claro, sem painel nem topo */
@media print{
  html.mega-area,.mega-area body{background:#fff!important;color:#111!important}
  .site-header,.site-footer,.mg-pagar,.mg-voltar,.mg-acoes{display:none!important}
  .mg-fatura-grid{display:block;margin:0}.mg-doc{border:0;padding:0;background:#fff;box-shadow:none}.mg-fat-head{background:#fff!important;color:#111!important;padding:0 0 12px}.mg-fat-head *{color:#111!important}
  .mg-doc *{color:#111!important}.mg-doc-topo,.mg-partes,.mg-itens,.mg-itens li,.mg-trans,.mg-tr{border-color:#ccc!important}
}

/* ── gateways dentro do painel Pagar ── */
/* Pix (iugu): código copia-e-cola na largura toda */
.mg-pagar-gw-html input,.mg-pagar-gw-html textarea{width:100%!important;max-width:100%!important;box-sizing:border-box}
.mg-pagar-gw-html [class*=pix] , .mg-pagar-gw-html code{word-break:break-all}
/* Cripto (módulo usdtmega): ele traz estilo claro preso ao id do bloco → aqui precisa de !important */
.mg-pagar-gw-html [id] .u-tabs .u-sub{color:var(--mute)!important;opacity:1!important;font-size:13px!important;margin-bottom:6px!important}
.mg-pagar-gw-html [id] .u-tab{background:var(--bg0)!important;color:var(--ink2)!important;border:1px solid var(--line2)!important;border-radius:10px!important;padding:9px 12px!important;font-size:13.5px!important}
.mg-pagar-gw-html [id] .u-tab:hover{border-color:var(--sinal)!important;color:#fff!important}
.mg-pagar-gw-html [id] .u-tab.on{background:var(--sinal-dim)!important;border-color:var(--sinal)!important;color:#fff!important}
.mg-pagar-gw-html [id]{color:var(--ink2)!important;font-size:14px!important;text-align:left}
.mg-pagar-gw-html [id] .u-card{background:var(--bg0)!important;color:var(--ink)!important;border:1px solid var(--line2)!important;box-shadow:none!important;border-radius:14px!important;padding:16px!important}
.mg-pagar-gw-html [id] .u-num{background:var(--sinal)!important;color:var(--sinal-ink)!important}
.mg-pagar-gw-html [id] .u-tit{color:#fff!important;font-size:14px!important}
.mg-pagar-gw-html [id] .u-mono{color:#fff!important;font-family:var(--mono)!important}
.mg-pagar-gw-html [id] .u-amt{font-size:26px!important}
.mg-pagar-gw-html [id] .u-amt + *,.mg-pagar-gw-html [id] .u-mono.u-amt span{color:var(--mute)!important}
.mg-pagar-gw-html [id] .u-sub{color:var(--mute)!important}
.mg-pagar-gw-html [id] hr{border-top-color:var(--line)!important}
.mg-pagar-gw-html [id] .u-btn{width:100%!important;margin-top:6px!important;background:var(--bg3)!important;color:var(--ink)!important;border:1px solid var(--line2)!important;border-radius:10px!important;padding:8px 12px!important;font-size:13px!important;font-weight:600!important}
.mg-pagar-gw-html [id] .u-btn:hover{background:var(--bg3)!important}
.mg-pagar-gw-html [id] .u-qr{background:#fff!important;border-radius:14px!important;padding:12px!important;margin:12px auto 0!important;width:fit-content}
.mg-pagar-gw-html [id] .u-qr img,.mg-pagar-gw-html [id] .u-qr canvas{background:#fff;padding:0;margin:0;width:200px!important;height:auto}
.mg-pagar-gw-html [id] .u-warn{background:rgba(255,181,71,.1)!important;border:1px solid rgba(255,181,71,.45)!important;border-left-width:3px!important;color:var(--ink)!important;border-radius:10px!important;font-size:13px!important}
.mg-pagar-gw-html [id] .u-warn b,.mg-pagar-gw-html [id] .u-warn strong{color:var(--warn)!important}
.mg-pagar-gw-html [id] .u-link{color:var(--sinal2)!important}
.mg-pagar-gw-html [id] .u-hash input,.mg-pagar-gw-html [id] .u-hash textarea{background:var(--bg2)!important;color:#fff!important;border:1px solid var(--line2)!important;border-radius:10px!important}
.mg-pagar-gw-html [id] .u-hash .u-btn[style]{background:var(--sinal)!important;color:var(--sinal-ink)!important;border:0!important}
.mg-pagar-gw-html [id] .u-foot{color:var(--mute)!important}

/* ── peças do Twenty-One que vinham brancas (telas do passo 3, enquanto não são refeitas) ── */
.mega-area .tiles{background:var(--line2);border:1px solid var(--line2);border-radius:14px;overflow:hidden;margin-bottom:24px}
.mega-area .tiles .row{margin:0}
.mega-area .tiles .tile{background:var(--bg2)!important;border:0!important;padding:16px 20px!important}
.mega-area .tiles .tile:hover{background:var(--bg3)!important}
.mega-area .tiles .tile .stat{color:#fff!important;font:700 38px/1 var(--display)!important}
.mega-area .tiles .tile .title{color:var(--mute)!important;text-transform:none!important;font-size:14px!important;font-weight:600!important;margin-top:4px}
.mega-area .tiles .tile i{color:rgba(255,255,255,.08)!important}
.mega-area .tiles .tile:hover i{color:rgba(0,181,234,.25)!important}
.mega-area .dataTables_wrapper table.table-list{border:1px solid var(--line2)!important;border-radius:14px!important;overflow:hidden;background:var(--bg2)}
.mega-area .table-list>thead>tr>th,.mega-area .dataTables_wrapper table.table-list thead th{background:var(--bg3)!important;color:var(--ink2)!important;border-bottom:1px solid var(--line2)!important;font-weight:600!important}
.mega-area .dataTables_wrapper table.table-list thead th.sorting_asc,.mega-area .dataTables_wrapper table.table-list thead th.sorting_desc{background:var(--bg3)!important;color:#fff!important}
.mega-area .table-list>tbody>tr>td{background:var(--bg2)!important;color:var(--ink)!important;border-color:var(--line)!important}
.mega-area .table-list>tbody>tr:hover>td{background:var(--bg3)!important;color:#fff!important;cursor:pointer}
.mega-area .table-list>tbody>tr>td.dataTables_empty{color:var(--mute)!important}
.mega-area .dataTables_wrapper .dataTables_filter label .form-control{background:var(--bg0) url(../../../assets/img/search.png) no-repeat 10px center!important;background-size:18px!important;color:#fff!important;border:1px solid var(--line2)!important;border-radius:10px!important;padding-left:38px!important}
.mega-area .dataTables_wrapper .dataTables_info,.mega-area .dataTables_wrapper .dataTables_length{color:var(--ink2)!important}
.mega-area .dataTables_wrapper .dataTables_length select{background:var(--bg0)!important;color:#fff!important;border:1px solid var(--line2)!important;border-radius:8px!important}
.mega-area .dataTables_wrapper .paginate_button .page-link,.mega-area .dataTables_paginate .page-link{background:var(--bg2)!important;color:var(--ink2)!important;border-color:var(--line2)!important}
.mega-area .dataTables_paginate .active .page-link{background:var(--sinal)!important;color:var(--sinal-ink)!important;border-color:var(--sinal)!important}
.mega-area .label,.mega-area .status{border-radius:999px!important;padding:3px 10px!important;font-weight:700!important;font-size:12.5px!important}
.mega-area .status-paid,.mega-area .status-active,.mega-area .status-completed,.mega-area .status-open{background:rgba(54,211,153,.15)!important;color:var(--ok)!important}
.mega-area .status-unpaid,.mega-area .status-pending,.mega-area .status-overdue,.mega-area .status-collections{background:rgba(255,107,107,.15)!important;color:var(--bad)!important}
.mega-area .status-suspended,.mega-area .status-refunded,.mega-area .status-pending-transfer,.mega-area .status-customer-reply,.mega-area .status-answered{background:rgba(255,181,71,.15)!important;color:var(--warn)!important}
.mega-area .status-cancelled,.mega-area .status-terminated,.mega-area .status-closed,.mega-area .status-fraud,.mega-area .status-draft{background:rgba(255,255,255,.08)!important;color:var(--mute)!important}
.mega-area .sidebar .badge,.mega-area .list-group-item .badge{background:var(--bg3)!important;color:#fff!important}
.mega-area .sidebar .list-group-item input[type=radio]{accent-color:var(--sinal)}
/* página inicial (visitante): atalhos "Como podemos ajudar" / "Sua conta" */
.mega-area .action-icon-btns a{background:var(--bg2)!important;border:1px solid var(--line2)!important;border-top-width:3px!important;border-radius:14px!important;color:var(--ink2)!important;font-weight:600}
.mega-area .action-icon-btns a:hover{background:var(--bg3)!important;color:#fff!important}
.mega-area .action-icon-btns a .ico-container i{color:var(--sinal2)!important;opacity:.85}
.mega-area .action-icon-btns a:hover .ico-container{font-size:2.6em!important}
.mega-area .card-accent-teal,.mega-area .card-accent-pomegranate,.mega-area .card-accent-sun-flower,.mega-area .card-accent-midnight-blue,.mega-area .card-accent-asbestos,.mega-area .card-accent-emerald{border-top-color:var(--sinal)!important}
.mega-area .btn-outline-primary{color:var(--ink)!important}
.mega-area .btn-outline-primary:hover{background:var(--sinal)!important;border-color:var(--sinal)!important;color:var(--sinal-ink)!important}

/* ajustes do kit do site no WHMCS */
.mega-area address,.mega-area .mg-partes address{font-style:normal}
.mega-area .mg-fatura{padding-top:0}
.mega-area body>.mg-fatura{margin-top:0}
html.mega-area,.mega-area body{overflow-x:hidden}
.mega-area .site-header .wrap{gap:14px}
.mega-area .site-nav .top-link{padding:9px 9px}
.mega-area main#main-body.mg-fatura{padding-top:0!important}
/* nomes que o site e o Twenty-One usam com sentidos diferentes */
.mega-area .tiles .tile .stat{margin-top:20px}
.mega-area .primary-content h1,.mega-area .primary-content h2{font-size:clamp(24px,2.4vw,30px)}
.mega-area .primary-content h3,.mega-area .card-title{font-size:18px}
.mega-area .tiles .stat{background:none!important;border:0!important;padding:0!important;box-shadow:none!important;min-height:0!important}

/* ── login e segunda etapa (mesmo layout: texto + terminal | cartão do formulário, como o hero do site) ── */
.mg-acesso{padding-block:clamp(40px,7vw,88px)!important;min-height:calc(100vh - 77px)}
.mg-acesso-login{margin:-28px 0 -64px}
.mg-acesso-grade{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(24px,5vw,64px);align-items:center}
@media (max-width:900px){.mg-acesso-grade{grid-template-columns:1fr}.mg-acesso-texto .term{display:none}}
.mg-acesso-texto h1{font-size:clamp(34px,4.4vw,54px);margin-bottom:14px}
.mg-acesso-texto .lead{margin-bottom:26px}
.mg-acesso-texto .term-body{min-height:0}
.mg-acesso-card{max-width:460px;width:100%;justify-self:end}
@media (max-width:900px){.mg-acesso-card{justify-self:stretch;max-width:none}}
.mg-acesso-card h2{font-size:28px;margin-bottom:14px}
.mg-acesso-card .cf-row input{background:var(--bg0)}
.mg-linha-rot{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.mg-linha-rot a{font-size:13.5px}
.mg-senha{position:relative}
.mg-senha input{padding-right:48px!important}
.mg-ver-senha{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:transparent;border:0;color:var(--mute);padding:8px 10px;cursor:pointer}
.mg-ver-senha:hover{color:#fff}
.mg-lembrar{display:flex;gap:8px;align-items:center;font-size:15px;color:var(--ink-2);margin:2px 0 18px;cursor:pointer}
.mg-lembrar input{accent-color:var(--sinal);width:16px;height:16px}
.mg-acesso-btn{width:100%;padding:14px 24px;font-size:16.5px}
.mg-acesso-ajuda{margin:16px 0 0;font-size:14.5px;color:var(--mute)}
.mg-acesso-dest{color:var(--ink-2);margin-bottom:16px}
.mg-acesso-dest b{color:#fff;font-family:var(--font-mono);font-weight:500}
.mg-acesso-msg{padding:10px 14px;border-radius:9px;margin-bottom:14px;font-size:15px;border:1px solid var(--line-2);background:rgba(255,255,255,.04)}
.mg-acesso-msg.erro{border-color:rgba(255,107,107,.55);background:rgba(255,107,107,.1)}
.mg-acesso-msg.aviso{border-color:rgba(255,181,71,.55);background:rgba(255,181,71,.1)}
.mg-acesso-msg.ok{border-color:rgba(54,211,153,.55);background:rgba(54,211,153,.1)}
.mg-codigo{font-family:var(--font-mono)!important;font-size:30px!important;letter-spacing:.45em;text-align:center;padding:14px 10px!important}
.mg-codigo::placeholder{color:rgba(255,255,255,.18)}
.mg-acesso-outros{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.mg-acesso-outros form{margin:0}
.mega-area .login-form .alert{margin-bottom:14px}
body.tpl-login .mg-trilha{display:none}
body.tpl-login #main-body>.container{max-width:none;padding:0}
body.tpl-login #main-body>.container>.row{margin:0}
body.tpl-login .primary-content{padding:0}
.mega-area .mg-acesso .mg-acesso-texto h1{font-size:clamp(34px,4.4vw,54px)}
.mega-area .term-body{font-size:13.5px;font-family:var(--font-mono);background:transparent;border:0;margin:0}

/* ── afiliados: bloco "Pagamento de Comissões" (hook afiliados_hook.php traz estilo claro próprio) ── */
.mega-area .mda-card{background:var(--bg2)!important;border:1px solid var(--line-2)!important;border-radius:var(--radius)!important;box-shadow:none!important;color:var(--ink)!important}
.mega-area .mda-title{color:#fff!important;font-family:var(--font-display)!important;font-weight:700!important;font-size:20px!important}
.mega-area .mda-title .fa{color:var(--sinal)!important}
.mega-area .mda-label{color:var(--ink-2)!important;font-weight:600!important}
.mega-area .mda-label .fa{color:var(--mute)!important}
.mega-area .mda-select,.mega-area .mda-input{background:var(--bg0)!important;color:#fff!important;border:1px solid var(--line-2)!important;border-radius:9px!important}
.mega-area .mda-select:focus,.mega-area .mda-input:focus{border-color:var(--sinal)!important;box-shadow:0 0 0 3px var(--sinal-dim)!important}
.mega-area .mda-hint{color:var(--mute)!important}
.mega-area .mda-save{background:var(--sinal)!important;color:var(--sinal-ink)!important;border:0!important;border-radius:10px!important;font-weight:600!important}
.mega-area .mda-save:hover{background:var(--sinal-2)!important;filter:none!important}

/* ── abrir chamado: editor de texto (bootstrap-markdown) e anexos ── */
.mega-area .md-editor{border:1px solid var(--line-2)!important;border-radius:10px;overflow:hidden;background:var(--bg0)!important}
.mega-area .md-editor>.md-header{background:var(--bg2)!important;border-bottom:1px solid var(--line)!important;padding:6px!important}
.mega-area .md-editor .btn-group .btn,.mega-area .md-editor .md-header .btn{background:var(--bg3)!important;color:var(--ink-2)!important;border:1px solid var(--line-2)!important;box-shadow:none!important}
.mega-area .md-editor .md-header .btn:hover,.mega-area .md-editor .md-header .btn.active{background:var(--bg4)!important;color:#fff!important}
.mega-area .md-editor>textarea,.mega-area .md-editor .md-input,.mega-area textarea.markdown-editor{background:var(--bg0)!important;color:#fff!important;border:0!important}
.mega-area .md-editor .md-preview{background:var(--bg1)!important;color:var(--ink)!important}
.mega-area .md-editor>.md-footer,.mega-area .markdown-editor-status,.mega-area .md-editor .md-footer{background:var(--bg2)!important;color:var(--mute)!important;border-top:1px solid var(--line)!important}
.mega-area .md-editor .md-control-fullscreen,.mega-area .md-fullscreen-controls a{color:var(--mute)!important}
.mega-area .custom-file-label{background:var(--bg0)!important;color:var(--ink-2)!important;border:1px solid var(--line-2)!important;border-radius:10px!important}
.mega-area .custom-file-label::after{background:var(--bg3)!important;color:#fff!important;border-left:1px solid var(--line-2)!important;content:"Escolher"!important}
html[lang="en"].mega-area .custom-file-label::after{content:"Browse"!important}
.mega-area .custom-file-input:focus~.custom-file-label{border-color:var(--sinal)!important;box-shadow:0 0 0 3px var(--sinal-dim)!important}
.mega-area .announcement-single blockquote,.mega-area blockquote{background:var(--bg1)!important;color:var(--ink-2)!important;border-left:3px solid var(--sinal)!important}

/* ── afiliado ativo: números, link e retirada (twenty-one affiliates.tpl) ── */
.mega-area .affiliate-stat{background:var(--bg2)!important;border:1px solid var(--line-2)!important;border-radius:var(--radius)!important;color:var(--mute)!important;padding:20px 22px!important;display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:16px;align-items:center;text-align:left!important;font:600 15px var(--font-ui)!important;min-height:0!important;height:auto!important}
.mega-area .affiliate-stat i{grid-row:1 / span 2;font-size:22px!important;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--sinal-dim);color:var(--sinal)!important;margin:0!important;position:static!important;opacity:1!important}
.mega-area .affiliate-stat span{display:block!important;font:700 34px/1.05 var(--font-display)!important;color:#fff!important;margin:0!important}
.mega-area .tpl-affiliates .card .h3,.mega-area body.tpl-affiliates .card .h3{font:700 20px var(--font-display);color:#fff}
.mega-area body.tpl-affiliates .table-rounded{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line-2)}
.mega-area body.tpl-affiliates .table td{background:var(--bg2);color:var(--ink-2);border-color:var(--line)!important}
.mega-area body.tpl-affiliates .table td strong{color:#fff;font-variant-numeric:tabular-nums}
.mega-area body.tpl-affiliates .btn-danger{background:var(--sinal)!important;border-color:var(--sinal)!important;color:var(--sinal-ink)!important;font-weight:600;border-radius:10px}
.mega-area body.tpl-affiliates .btn-danger:hover{background:var(--sinal-2)!important;box-shadow:0 8px 28px var(--sinal-glow)}
.mega-area body.tpl-affiliates .btn-danger.disabled,.mega-area body.tpl-affiliates .btn-danger:disabled{background:var(--bg3)!important;border-color:var(--line-2)!important;color:var(--mute)!important;box-shadow:none}

/* ── afiliados (affiliates.tpl próprio) ── */
body.tpl-affiliates .mg-trilha{display:none}
.mg-afil{display:grid;gap:22px}
.mg-afil-topo{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,4vw,48px);align-items:end;padding:clamp(22px,3vw,34px);border-radius:var(--radius);background:var(--bg0);border:1px solid var(--line);position:relative;overflow:hidden}
.mg-afil-topo::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(700px 300px at 0% 0%,rgba(0,181,234,.14),transparent 60%)}
.mg-afil-topo>*{position:relative}
.mg-afil-topo h1{font-size:clamp(30px,3.6vw,44px);margin:0 0 8px}
.mg-afil-topo .lead{margin:0;font-size:17px}
@media (max-width:900px){.mg-afil-topo{grid-template-columns:1fr}}
.mg-afil-link label{display:block;font:600 14px var(--font-ui);color:var(--ink-2);margin-bottom:8px}
.mg-afil-copia{display:flex;gap:8px}
.mg-afil-copia input{flex:1;min-width:0;padding:12px 14px;border-radius:10px;border:1px solid var(--line-2);background:var(--bg1);color:#fff;font:500 14px var(--font-mono)}
.mg-afil-copia .btn{flex:none}
.mg-afil-num{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media (max-width:900px){.mg-afil-num{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mg-num-card{background:var(--bg2);border:1px solid var(--line-2);border-radius:var(--radius);padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.mg-num-card span{font:600 14px var(--font-ui);color:var(--mute)}
.mg-num-card b{font:700 clamp(26px,2.6vw,34px)/1.05 var(--font-display);color:#fff;font-variant-numeric:tabular-nums}
.mg-num-card.is-destaque{border-color:var(--sinal);box-shadow:0 0 0 1px var(--sinal),0 18px 50px rgba(0,181,234,.12)}
.mg-num-card.is-destaque b{color:var(--sinal-2)}
.mg-afil-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:900px){.mg-afil-duo{grid-template-columns:1fr}}
.mg-afil-saldo{background:var(--bg2);border:1px solid var(--line-2);border-radius:var(--radius);padding:22px}
.mg-afil-saldo h2,.mg-afil-h2{font-size:22px!important;margin:0 0 12px}
.mg-afil-h2{margin-top:10px!important}
.mg-afil-saldo dl{margin:0 0 18px;display:grid}
.mg-afil-saldo dl div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.mg-afil-saldo dt{font-weight:400;color:var(--ink-2)}
.mg-afil-saldo dd{margin:0;color:#fff;font-weight:600;font-variant-numeric:tabular-nums}
.mg-afil-saldo dd.is-forte{color:var(--sinal-2);font:700 20px var(--font-display)}
.mg-afil-retirar{width:100%}
.mg-afil-retirar:disabled{background:var(--bg3)!important;color:var(--mute)!important;box-shadow:none!important;cursor:not-allowed}
.mg-afil-nota{margin:10px 0 0;color:var(--mute);font-size:14px}
.mg-afil-receber:not(.tem){display:none}
.mg-afil-receber .mda-card{margin:0!important;max-width:none!important;width:100%!important}
.mg-aviso-escuro{padding:12px 16px;border-radius:10px;border:1px solid var(--line-2);background:rgba(255,255,255,.04)}
.mg-aviso-escuro.ok{border-color:rgba(54,211,153,.5);background:rgba(54,211,153,.1)}
.mg-afil .table-list td{text-align:left}
.mg-afil-banners{background:var(--bg2);border:1px solid var(--line-2);border-radius:var(--radius);padding:18px;text-align:center}

/* busca das tabelas: a lupa do WHMCS é uma imagem pra fundo branco → lupa desenhada na cor do tema */
.mega-area .dataTables_wrapper .dataTables_filter label .form-control{background:var(--bg0) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%238FA3B8' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") no-repeat 12px center!important;background-size:18px!important;padding-left:40px!important}

/* celular: a conta (secundário) vai pra dentro do Menu; topo cabe em 390px; tabelas rolam dentro delas */
.mega-area .site-nav .topnav>.mg-so-celular,.mega-area .site-nav .topnav>li[id^="Secondary_Navbar"]{display:none}
@media (max-width:1100px){
  .mega-area .site-nav .topnav>.mg-so-celular,.mega-area .site-nav .topnav>li[id^="Secondary_Navbar"]{display:block}
  .mega-area .header-actions .mg-conta{display:none}
}
@media (max-width:600px){.mega-area .site-header .wrap{gap:10px}.mega-area .site-logo img{height:36px}.mega-area .lang-switch a{padding:4px 7px}}
.mega-area .table-container,.mega-area .dataTables_wrapper{max-width:100%;overflow-x:auto}
.mega-area .mg-afil-copia input{font-size:13px}
@media (max-width:600px){.mg-afil-copia{flex-direction:column}.mg-afil-copia .btn{width:100%}}
.mg-afil-saldo dd{white-space:nowrap}
/* lista de indicados: o hook afiliados_comissao_produto.php acrescenta Servidor/IP → cada coluna na largura do conteúdo, sem espremer o Produto */
#tableAffiliatesList{width:100%!important;table-layout:auto!important}
#tableAffiliatesList th,#tableAffiliatesList td{white-space:nowrap!important;width:auto!important;max-width:none!important;text-overflow:clip!important;overflow:visible!important;padding:12px 16px!important;vertical-align:middle}
#tableAffiliatesList td:nth-child(3){font-family:var(--font-mono);font-size:13.5px}
#tableAffiliatesList td:nth-child(4){font-family:var(--font-mono);font-size:13.5px;color:var(--ink-2)!important}
#tableAffiliatesList th{text-align:left!important}
.mg-afil-lista-topo{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px}
.mg-afil-lista-topo .mg-afil-h2{margin:0!important}
#mgAfilFiltro small{font:600 12px var(--font-ui);opacity:.75}
#mgAfilFiltro button[aria-pressed="true"] small{opacity:1}
#mgAfilFiltro button:focus-visible{outline:2px solid var(--sinal);outline-offset:2px}

/* ── menu: painel compacto sob o item (no padrão do mega-menu do site: ícone em quadrado ciano + nome + descrição) ── */
@media (min-width:1101px){
  .mega-area .site-header .top.has-mega{position:relative}
  .mega-area .site-header .top.has-mega>.mg-drop{left:0;right:auto;top:calc(100% + 10px);margin:0;width:max-content;min-width:320px;max-width:min(640px,92vw);padding:8px;background:#01192B;border:1px solid var(--line-2);border-radius:14px;box-shadow:0 24px 60px rgba(0,10,25,.6)}
  .mega-area .site-header .mg-conta .top.has-mega>.mg-drop{left:auto;right:0}
  .mega-area .mg-drop .mega-inner{max-width:none;display:block}
}
.mega-area .mg-drop-lista{display:grid;grid-template-columns:1fr;gap:2px}
.mega-area .mg-drop-lista.mg-2col{grid-template-columns:repeat(2,minmax(260px,1fr))}
@media (max-width:1100px){.mega-area .mg-drop-lista.mg-2col{grid-template-columns:1fr}}
.mega-area .mg-drop .mega-item{align-items:center;padding:10px 12px}
.mega-area .mg-drop .mega-item small{max-width:34ch}
.mega-area .mg-drop .mega-item:hover .mega-ic{background:var(--sinal);color:var(--sinal-ink)}
.mega-area .mg-drop .mega-ic{transition:background .15s,color .15s}
.mega-area .mg-conta .mega-list{min-width:0}

/* ── pagamento em massa (fora do menu; a tela continua acessível pelo link direto) ── */
.mega-area body.tpl-masspay .card,.mega-area body.tpl-masspay .bg-default{background:var(--bg2)!important;border-color:var(--line-2)!important}
.mega-area body.tpl-masspay .table td,.mega-area body.tpl-masspay .table th{background:transparent!important;border-color:var(--line)!important;color:var(--ink-2)}
.mega-area body.tpl-masspay .table thead td,.mega-area body.tpl-masspay .table thead th{color:var(--mute)!important;font-weight:600}
.mega-area body.tpl-masspay .masspay-invoice-detail td{font-size:14.5px;line-height:1.6}
.mega-area body.tpl-masspay .table tr:not(.masspay-invoice-detail):not(.masspay-total) td strong,.mega-area body.tpl-masspay .table td b{color:#fff}
.mega-area body.tpl-masspay .masspay-total td{background:var(--bg3)!important;color:#fff!important;font-variant-numeric:tabular-nums;border-color:var(--line-2)!important}
.mega-area body.tpl-masspay .masspay-total:last-child td{font:700 20px var(--font-display);color:var(--sinal-2)!important}
.mega-area body.tpl-masspay .masspay-total td.text-right{color:var(--ink-2)!important;font:600 15px var(--font-ui)}

/* ── botões dentro de tabelas (ex.: Nota Fácil — PDF/XML/e-mail): quadradinhos só com ícone; o nome aparece no tooltip ── */
.mega-area .table td .btn{width:36px;height:36px;padding:0!important;display:inline-grid!important;place-items:center;border-radius:9px!important;font-size:15px!important;margin:2px!important;background:var(--bg3)!important;border:1px solid var(--line-2)!important;box-shadow:none!important;vertical-align:middle}
.mega-area .table td .btn:hover{background:var(--bg4)!important;border-color:var(--sinal)!important}
.mega-area .table td .btn-success,.mega-area .table td .btn-primary{color:var(--sinal-2)!important}
.mega-area .table td .btn-warning{color:var(--warn)!important}
.mega-area .table td .btn-info{color:var(--ok)!important}
.mega-area .table td .btn-danger{color:var(--bad)!important}
.mega-area .table td .btn i{margin:0!important;font-size:15px!important}
.mega-area .tooltip-inner{background:var(--bg0);color:#fff;border:1px solid var(--line-2);font:600 13px var(--font-ui)}

/* pagamento em massa no formato da fatura (a tela tem a lateral do WHMCS, então o painel desce antes em telas médias) */
.mg-massa-grid{margin-top:0}
.mg-massa-t{font:700 24px var(--font-display)!important;color:var(--paper-ink)!important;margin:0 0 6px!important}
.mg-massa-desc{margin:0 0 8px}
@media (max-width:1300px){.mg-massa-grid{grid-template-columns:1fr}.mg-massa-grid .mg-pagar{order:-1;position:static}}
.mg-massa .mg-gw-form{margin-bottom:14px}
/* pagamento em massa: painel mais estreito e documento escuro (Diego: "a cor que estava antes tava ok") */
.mg-massa-grid{grid-template-columns:minmax(0,1fr) 300px}
@media (max-width:1300px){.mg-massa-grid{grid-template-columns:1fr}}
.mg-doc-escuro{background:var(--bg2);border:1px solid var(--line-2);border-radius:var(--radius);padding:clamp(20px,3vw,28px)}
.mg-doc-escuro .mg-massa-t{color:#fff!important}
.mg-doc-escuro .mg-sec-t{font:600 15px var(--font-ui);color:var(--ink-2);margin:22px 0 8px}
.mg-doc-escuro .mg-nota{color:var(--mute)}
.mg-doc-escuro .mg-itens,.mg-doc-escuro .mg-itens li{border-color:var(--line)}
.mg-doc-escuro .mg-item-desc{color:var(--mute)}
.mg-doc-escuro .mg-item-desc::first-line{color:#fff}
.mg-doc-escuro .mg-item-val{color:#fff}
.mg-doc-escuro .mg-totais dt{color:var(--ink-2)}
.mg-doc-escuro .mg-totais dd{color:#fff}
.mg-doc-escuro .mg-totais .mg-total{border-top-color:var(--line-2)}
.mg-doc-escuro .mg-totais .mg-total dt{color:#fff}
.mg-doc-escuro .mg-totais .mg-total dd{color:var(--sinal-2)}
.mg-massa .mg-pagar{padding:20px 18px!important}
.mg-massa .mg-pagar-valor{font-size:clamp(30px,3vw,36px)}

/* lateral: botões do rodapé dos blocos (ex.: Pagar Todas + Adicionar Fundos) lado a lado, mesma altura */
.mega-area .sidebar .card-footer{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.mega-area .sidebar .card-footer>*{float:none!important;margin:0!important}
.mega-area .sidebar .card-footer .btn{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 12px!important;font-size:14px!important;white-space:nowrap}
.mega-area .sidebar .card-footer .float-right,.mega-area .sidebar .card-footer .float-left{float:none!important}
.mega-area .sidebar .card-footer form,.mega-area .sidebar .card-footer>div:not(.btn){display:contents}
.mega-area .sidebar .card-footer .btn{float:none!important;width:auto!important;margin:0!important}

/* fatura: documento ESCURO e painel de 300px (Diego: "a fatura branco não curti", "card muito largo") */
.mg-fatura-grid{grid-template-columns:minmax(0,1fr) 320px}
@media (max-width:991px){.mg-fatura-grid{grid-template-columns:1fr}}
.mg-doc-escuro h2,.mg-doc-escuro .mg-sec-t{font:600 14.5px var(--font-ui);color:var(--mute)}
.mg-doc-escuro .mg-partes{border-bottom-color:var(--line)}
.mg-doc-escuro .mg-partes address{color:var(--ink-2)}
.mg-doc-escuro .mg-partes address b{color:#fff}
.mg-doc-escuro .mg-aviso{color:var(--ink);background:var(--sinal-dim);border-color:rgba(0,181,234,.45)}
.mg-doc-escuro .mg-aviso.ok{background:rgba(54,211,153,.1);border-color:rgba(54,211,153,.45)}
.mg-doc-escuro .mg-aviso.erro{background:rgba(255,107,107,.1);border-color:rgba(255,107,107,.45)}
.mg-doc-escuro .mg-trans,.mg-doc-escuro .mg-tr{border-color:var(--line)}
.mg-doc-escuro .mg-tr{color:var(--ink-2)}
.mg-doc-escuro .mg-tr b{color:#fff}
.mg-doc-escuro .mg-credito{background:rgba(54,211,153,.08);border-color:rgba(54,211,153,.45);color:var(--ink-2)}
.mg-doc-escuro .mg-credito b{color:#fff}
.mg-doc-escuro .mg-credito .form-control{background:var(--bg0);color:#fff;border-color:var(--line-2)}
.mg-doc-escuro .mg-credito .mg-btn-sec,.mg-doc-escuro .mg-credito button{background:var(--bg3);color:#fff!important;border:1px solid var(--line-2);border-radius:10px;padding:10px 16px;font-weight:600}
.mg-doc-escuro .btn-ghost{background:rgba(255,255,255,.04);color:#fff!important;border-color:var(--line-2)}
.mg-doc-escuro .btn-ghost:hover{border-color:var(--sinal);color:var(--sinal)!important}
.mg-fatura .mg-pagar{padding:20px 18px!important}
.mg-fatura .mg-pagar-valor{font-size:clamp(30px,3vw,38px)}
/* Pix: o módulo põe largura fixa no código copia-e-cola → ocupa o painel todo e quebra a linha */
.mg-pagar-gw-html [style*="width"],.mg-pagar-gw-html input,.mg-pagar-gw-html textarea,.mg-pagar-gw-html code,.mg-pagar-gw-html pre{width:100%!important;max-width:100%!important;box-sizing:border-box}
.mg-pagar-gw-html [style*="width"]:not(img):not(svg):not(canvas){word-break:break-all;white-space:normal}
.mg-pagar-gw-html img{width:220px!important;max-width:100%!important}
/* cabeçalho da fatura = cartão do topo dos afiliados (Diego: "faz igual fez no afiliado") */
.mg-fat-cab-wrap{padding-top:24px}
.mg-fat-cab{grid-template-columns:minmax(0,1fr) auto!important;align-items:end}
.mg-fat-cab h1{font:700 clamp(32px,3.8vw,46px)/1.05 var(--font-display);letter-spacing:-.02em;margin:0 0 4px}
.mg-fat-cab-st{display:flex;justify-content:flex-end}
@media (max-width:900px){.mg-fat-cab{grid-template-columns:1fr!important}.mg-fat-cab-st{justify-content:flex-start}}
.mg-fat-cab-wrap+.mg-fatura-grid{margin-top:22px}
@media print{.mg-fat-cab{background:#fff!important;border:0!important;padding:0!important}.mg-fat-cab::before{display:none}.mg-fat-cab *{color:#111!important}}

/* ── início da área do cliente (clientareahome.tpl próprio) ── */
.mg-inicio{display:grid;gap:22px}
.mg-ini-topo{grid-template-columns:minmax(0,1fr) auto!important;align-items:end}
.mg-ini-topo h1{font-size:clamp(30px,3.6vw,44px);margin:0 0 6px}
.mg-ini-topo .lead{margin:0;font-size:17px}
.mg-ini-acoes{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:900px){.mg-ini-topo{grid-template-columns:1fr!important}.mg-ini-acoes{justify-content:flex-start}}
.mega-area .mg-inicio h2{font:700 20px var(--font-display);color:#fff;margin:0}
/* precisa de atenção */
.mg-ini-atencao{background:var(--bg2);border:1px solid rgba(255,181,71,.35);border-radius:var(--radius);padding:18px 20px}
.mg-ini-atencao h2{margin-bottom:10px!important}
.mg-ini-atencao ul{list-style:none;margin:0;padding:0;display:grid}
.mg-ini-atencao li{display:grid;grid-template-columns:10px minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.mg-ini-atencao li:first-child{border-top:0}
.mg-ini-marca{width:10px;height:10px;border-radius:50%;background:var(--warn);box-shadow:0 0 10px rgba(255,181,71,.6)}
.mg-ini-atencao li.is-vencida .mg-ini-marca{background:var(--bad);box-shadow:0 0 10px rgba(255,107,107,.6)}
.mg-ini-atencao li.is-chamado .mg-ini-marca{background:var(--sinal);box-shadow:0 0 10px var(--sinal-glow)}
.mg-ini-atencao b{display:block;color:#fff;font:600 15.5px var(--font-ui)}
.mg-ini-atencao small{display:block;color:var(--mute);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mg-ini-atencao li.is-vencida small{color:var(--bad)}
.mg-ini-valor{font:700 18px var(--font-display);color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
@media (max-width:600px){.mg-ini-atencao li{grid-template-columns:10px minmax(0,1fr) auto}.mg-ini-atencao li .btn{grid-column:2 / -1;justify-self:start}}
.mg-ini-emdia{display:flex;align-items:center;gap:10px;margin:0;padding:14px 18px;border-radius:var(--radius);border:1px solid rgba(54,211,153,.35);background:rgba(54,211,153,.07);color:var(--ink-2)}
.mg-ini-emdia span{width:10px;height:10px;border-radius:50%;background:var(--ok);box-shadow:0 0 10px rgba(54,211,153,.6);flex:none}
/* grade principal */
.mg-ini-grade{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:start}
@media (max-width:1100px){.mg-ini-grade{grid-template-columns:1fr}}
.mg-ini-cab{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}
.mg-ini-cab a{font:600 14px var(--font-ui)}
.mg-ini-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.mg-svc{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:var(--radius);background:var(--bg2);border:1px solid var(--line-2);color:var(--ink)!important;text-decoration:none!important;transition:border-color .15s,background .15s}
.mg-svc:hover{border-color:var(--sinal);background:var(--bg3)}
.mg-svc-st{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;font:600 12.5px var(--font-ui);padding:3px 10px;border-radius:999px;color:var(--ok);background:rgba(54,211,153,.12)}
.mg-svc-st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.mg-svc-suspended .mg-svc-st{color:var(--bad);background:rgba(255,107,107,.12)}
.mg-svc-pending .mg-svc-st{color:var(--warn);background:rgba(255,181,71,.12)}
.mg-svc-suspended{border-color:rgba(255,107,107,.4)}
.mg-svc-nome{font:700 18px/1.2 var(--font-display);color:#fff;margin-top:4px}
.mg-svc-host{font:500 13.5px var(--font-mono);color:var(--sinal-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mg-svc dl{margin:6px 0 0;display:grid;gap:4px}
.mg-svc dl div{display:flex;justify-content:space-between;gap:10px;font-size:14px}
.mg-svc dt{font-weight:400;color:var(--mute)}
.mg-svc dd{margin:0;color:var(--ink-2);font-variant-numeric:tabular-nums;text-align:right}
.mg-svc-ir{margin-top:8px;font:600 14px var(--font-ui);color:var(--sinal)}
.mg-ini-vazio{padding:24px;border-radius:var(--radius);background:var(--bg2);border:1px dashed var(--line-2);text-align:center;color:var(--ink-2)}
/* lateral própria */
.mg-ini-lado{display:grid;gap:16px}
.mg-ini-bloco{background:var(--bg2);border:1px solid var(--line-2);border-radius:var(--radius);padding:18px}
.mg-ini-tk{list-style:none;margin:0;padding:0}
.mg-ini-tk li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.mg-ini-tk li:first-child{border-top:0;padding-top:0}
.mg-ini-tk a{min-width:0;color:var(--ink)!important;text-decoration:none!important}
.mg-ini-tk a:hover b{color:var(--sinal-2)}
.mg-ini-tk b{display:block;font:600 14.5px var(--font-ui);color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mg-ini-tk small{display:block;color:var(--mute);font-size:13px}
.mg-tk-st{flex:none;font:600 12px var(--font-ui);padding:3px 9px;border-radius:999px;background:rgba(255,255,255,.06);color:var(--mute)}
.mg-tk-open{color:var(--warn);background:rgba(255,181,71,.12)}
.mg-tk-answered,.mg-tk-respondidas{color:var(--sinal-2);background:var(--sinal-dim)}
.mg-ini-nada{margin:0;color:var(--mute);font-size:14.5px}
.mg-ini-afil-saldo{margin:0 0 4px}
.mg-ini-afil-saldo small{display:block;color:var(--mute);font-size:14px}
.mg-ini-afil-saldo b{font:700 30px/1.1 var(--font-display);color:var(--sinal-2);font-variant-numeric:tabular-nums}
.mg-ini-convite{border-color:var(--sinal);box-shadow:0 0 0 1px var(--sinal),0 18px 50px rgba(0,181,234,.12);background:linear-gradient(180deg,var(--bg3),var(--bg2))}
.mg-ini-convite h2{font-size:24px!important;margin:2px 0 8px!important}
.mg-ini-convite p{color:var(--ink-2);margin:0 0 14px;font-size:15.5px}
.mg-ini-convite .btn{width:100%}
/* início: a coluna da direita não pode crescer com títulos longos de chamado */
.mg-ini-grade{grid-template-columns:minmax(0,1fr) minmax(0,360px)}
@media (max-width:1100px){.mg-ini-grade{grid-template-columns:minmax(0,1fr)}}
.mg-ini-lado,.mg-ini-servicos,.mg-ini-bloco{min-width:0}
.mg-ini-tk a{flex:1 1 auto;min-width:0}
.mg-ini-tk b{display:block;max-width:100%}

/* páginas próprias trazidas do Lagom (2ª via, prorrogar, me liga): usam a classe "hidden" do Bootstrap 3 */
.mega-area .hidden{display:none!important}
.mega-area body.tpl-segundavia .primary-content h2,.mega-area body.tpl-segundavia .primary-content h3{font:700 22px var(--font-display);color:#fff;margin:18px 0 12px}
.mega-area body.tpl-segundavia .input-group-lg .form-control{height:50px}

/* ── detalhe do serviço / painel da VPS (Twenty-One productdetails + módulo ModulesGarden Proxmox, classes .lu-*) ── */
.mega-area .product-details .product-icon,.mega-area .product-details .product-status{border-radius:var(--radius) var(--radius) 0 0}
.mega-area .product-details .product-icon{background:var(--bg3)!important;border:1px solid var(--line-2)!important}
.mega-area .product-details .product-icon .fa-stack .fa-circle,.mega-area .product-details .product-icon i.fa-circle{color:var(--bg2)!important}
.mega-area .product-details .product-icon h3{color:#fff!important}
.mega-area .product-details .product-icon h4{color:var(--ink-2)!important}
.mega-area .product-details .product-status{border-radius:0 0 var(--radius) var(--radius)}
.mega-area .product-details h4{font:600 15px var(--font-ui);color:var(--mute)!important;margin:10px 0 2px}
.mega-area .nav-tabs{border-bottom-color:var(--line-2)}
.mega-area .nav-tabs .nav-link{color:var(--ink-2)!important;border:1px solid transparent;border-radius:10px 10px 0 0}
.mega-area .nav-tabs .nav-link:hover{color:#fff!important;border-color:var(--line)}
.mega-area .nav-tabs .nav-link.active{background:var(--bg2)!important;color:#fff!important;border-color:var(--line-2) var(--line-2) var(--bg2)!important}
.mega-area .tab-content.bg-white,.mega-area .product-details-tab-container{background:var(--bg2)!important;color:var(--ink)!important;border:1px solid var(--line-2);border-top:0;border-radius:0 0 var(--radius) var(--radius)}
.mega-area .product-details-tab-container .row>div,.mega-area .product-details-tab-container strong,.mega-area .product-details-tab-container label{color:var(--ink)}
.mega-area .product-details-tab-container .text-right,.mega-area .product-details-tab-container .text-muted{color:var(--mute)!important}
.mega-area .lu-widget,.mega-area .lu-widget__body,.mega-area .lu-widget__header,.mega-area .lu-tile,.mega-area .lu-block{background:var(--bg2)!important;border-color:var(--line-2)!important;color:var(--ink)!important;box-shadow:none!important}
.mega-area .lu-widget__header{border-bottom:1px solid var(--line)!important}
.mega-area .lu-widget__title,.mega-area .lu-widget .lu-h3,.mega-area .lu-widget h3,.mega-area .lu-widget h4{color:#fff!important}
.mega-area .lu-widget .lu-text-faded,.mega-area .lu-widget .lu-text-muted,.mega-area .lu-widget .lu-text-secondary{color:var(--mute)!important}
.mega-area .lu-widget .lu-tile,.mega-area .lu-widget a.lu-tile{background:var(--bg3)!important;border:1px solid var(--line-2)!important;border-radius:12px!important;color:var(--ink-2)!important}
.mega-area .lu-widget a.lu-tile:hover{border-color:var(--sinal)!important;color:#fff!important}
.mega-area .lu-table,.mega-area .lu-table td,.mega-area .lu-table th{background:transparent!important;color:var(--ink)!important;border-color:var(--line)!important}
.mega-area .lu-form-control,.mega-area .lu-form-select{background:var(--bg0)!important;color:#fff!important;border-color:var(--line-2)!important}

/* afiliados — convite (quem ainda não ativou) */
body.tpl-affiliatessignup .mg-trilha,body.tpl-affiliatessignup .mda-card{display:none!important}
.mg-afil-convite{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)!important;align-items:center!important}
@media (max-width:900px){.mg-afil-convite{grid-template-columns:1fr!important}}
.mg-afil-ativar{display:grid;gap:8px;justify-items:stretch}
.mg-afil-ativar .btn{padding:15px 24px;font-size:16.5px}
.mg-afil-ativar small{color:var(--mute);font-size:14px;text-align:center}
.mg-afil-passos{list-style:none;counter-reset:passo;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:900px){.mg-afil-passos{grid-template-columns:1fr}}
.mg-afil-passos li{counter-increment:passo;background:var(--bg2);border:1px solid var(--line-2);border-radius:var(--radius);padding:20px}
.mg-afil-passos li::before{content:counter(passo);display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--sinal-dim);color:var(--sinal);font:700 15px var(--font-display);margin-bottom:12px}
.mg-afil-passos b{display:block;font:700 18px var(--font-display);color:#fff;margin-bottom:6px}
.mg-afil-passos p{margin:0;color:var(--ink-2);font-size:15.5px;line-height:1.55}
/* VPS: títulos do módulo com pouco contraste */
.mega-area .product-details-tab-container h1,.mega-area .product-details-tab-container h2,.mega-area .product-details-tab-container h3,.mega-area .product-details-tab-container .lu-h2,.mega-area .product-details-tab-container .lu-h3,.mega-area .product-details-tab-container [class*="title"]{color:#fff!important}

/* 21/10 — o site.css usa ".mega" no menu suspenso (display:none; position:absolute).
   O order form também usa class="mega" no #order-standard_cart → carrinho/configurar ficavam em branco. */
#order-standard_cart.mega{display:block;position:static;left:auto;right:auto;top:auto;margin-top:0;background:transparent;border:0;box-shadow:none;z-index:auto;backdrop-filter:none}
/* aviso de fatura em aberto na página do serviço: botão alinhado com o texto */
#alertUnpaidInvoice,#alertOverdueInvoice{display:flex;flex-direction:row-reverse;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px}
#alertUnpaidInvoice>.float-right,#alertOverdueInvoice>.float-right{float:none!important;flex:0 0 auto}
#alertUnpaidInvoice .btn,#alertOverdueInvoice .btn{background:var(--sinal);border-color:var(--sinal);color:#01192B;font-weight:600;border-radius:999px;padding:6px 16px;margin:0}

/* ── listas próprias: serviços e faturas (21/10) ── */
.mg-lst{display:grid;gap:18px}
.mg-lst-topo{grid-template-columns:minmax(0,1fr) auto}
.mg-lst-devido{display:grid;gap:4px;justify-items:end;text-align:right}
.mg-lst-devido span{color:var(--ink-2);font-size:14px}
.mg-lst-devido b{font-family:var(--font-display);font-size:clamp(28px,3vw,38px);line-height:1;color:var(--ink)}
.mg-lst-devido .btn{margin-top:10px}
.mg-lst-barra{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.mg-lst-barra .pills small{font-size:12px;opacity:.75}
.mg-lst-busca input{background:var(--bg2);border:1px solid var(--line-2);border-radius:999px;color:var(--ink);padding:9px 16px;min-width:min(300px,100%);font-size:14.5px}
.mg-lst-busca input:focus{outline:2px solid var(--sinal);outline-offset:1px;border-color:var(--sinal)}
.mg-lst-cab,.mg-lst-l>a{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.1fr) minmax(0,1.1fr) minmax(0,1.2fr) minmax(0,1fr) 120px;gap:14px;align-items:center}
.mg-lst-fat .mg-lst-cab,.mg-lst-fat .mg-lst-l>a{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1.2fr) minmax(0,1fr) 130px 90px}
.mg-lst-cab{padding:0 20px;color:var(--ink-3,var(--ink-2));font-size:12.5px;font-weight:600}
.mg-lst-linhas{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mg-lst-l>a{padding:14px 20px;background:var(--bg2);border:1px solid var(--line);border-radius:12px;color:var(--ink);text-decoration:none!important;transition:border-color .15s,background .15s}
.mg-lst-l>a:hover{border-color:var(--sinal);background:var(--bg3)}
.mg-lst-l>a:focus-visible{outline:2px solid var(--sinal);outline-offset:2px}
.mg-lst-l .n{display:grid;gap:2px;min-width:0}
.mg-lst-l .n b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mg-lst-l .h{font-family:var(--font-mono,'JetBrains Mono',monospace);font-size:12.5px;color:var(--sinal);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mg-lst-l .c{font-size:14px;color:var(--ink-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mg-lst-l .c.mono{font-family:var(--font-mono,'JetBrains Mono',monospace);font-size:13px}
.mg-lst-l .c small{color:var(--ink-3,var(--ink-2));font-size:12px}
.mg-lst-l .c.v{color:var(--ink);font-weight:600}
.mg-lst-l .s,.mg-lst-l .a{justify-self:end}
.mg-lst-l .mg-svc-st{color:var(--ink-2);background:rgba(255,255,255,.06)}
.mg-lst-l.mg-svc-active .mg-svc-st{color:var(--ok);background:rgba(54,211,153,.12)}
.mg-lst-l.mg-svc-suspended .mg-svc-st{color:var(--bad);background:rgba(255,107,107,.12)}
.mg-lst-l.mg-svc-pending .mg-svc-st{color:var(--warn);background:rgba(255,181,71,.12)}
.mg-lst-l[data-g="fim"]>a{opacity:.72}
.mg-fat-st{display:inline-flex;align-items:center;gap:6px;font:600 12.5px var(--font-ui);padding:3px 10px;border-radius:999px;color:var(--ink-2);background:rgba(255,255,255,.06)}
.mg-fat-st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.mg-fat-paid .mg-fat-st{color:var(--ok);background:rgba(54,211,153,.12)}
.mg-fat-unpaid .mg-fat-st,.mg-fat-payment-pending .mg-fat-st{color:var(--warn);background:rgba(255,181,71,.12)}
.mg-fat-collections .mg-fat-st{color:var(--bad);background:rgba(255,107,107,.12)}
.mg-fat-unpaid>a{border-color:rgba(255,181,71,.35)}
.mg-lst-ver{color:var(--sinal);font-weight:600;font-size:14px}
.mg-lst-l .btn-sm{padding:6px 16px}
.mg-lst-vazio{color:var(--ink-2);padding:24px;text-align:center;border:1px dashed var(--line-2);border-radius:12px;margin:0}
.mg-lst-nada{padding:32px;border:1px dashed var(--line-2);border-radius:var(--radius);text-align:center;display:grid;gap:10px;justify-items:center}
.mg-lst-nada h2{margin:0;font-size:22px}.mg-lst-nada p{margin:0;color:var(--ink-2)}
@media (max-width:900px){
  .mg-lst-topo{grid-template-columns:1fr}.mg-lst-devido{justify-items:start;text-align:left}
  .mg-lst-cab{display:none}
  .mg-lst-l>a,.mg-lst-fat .mg-lst-l>a{grid-template-columns:1fr 1fr;gap:8px 14px}
  .mg-lst-l .n{grid-column:1/-1}
  .mg-lst-l .c{white-space:normal}
  .mg-lst-l .c::before{content:attr(data-r);display:block;font-size:11.5px;color:var(--ink-3,var(--ink-2));opacity:.8}
  .mg-lst-l .s,.mg-lst-l .a{justify-self:start}
  .mg-lst-busca,.mg-lst-busca input{width:100%}
}
/* chamados */
.mg-lst-tk .mg-lst-cab,.mg-lst-tk .mg-lst-l>a{grid-template-columns:minmax(0,2.6fr) minmax(0,1.2fr) minmax(0,1.4fr) 170px}
.mg-tk-answered .mg-fat-st{color:var(--warn);background:rgba(255,181,71,.12)}
.mg-tk-answered>a{border-color:rgba(255,181,71,.35)}
.mg-tk-open .mg-fat-st,.mg-tk-customer-reply .mg-fat-st,.mg-tk-in-progress .mg-fat-st{color:var(--sinal);background:rgba(0,181,234,.12)}
.mg-tk-closed>a{opacity:.72}
.mg-lst-l.is-nova .n b::after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--sinal);margin-left:8px;vertical-align:middle}
@media (max-width:900px){.mg-lst-tk .mg-lst-l>a{grid-template-columns:1fr 1fr}}
/* abrir chamado: assuntos em cartões */
.mg-deptos{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.mg-depto{display:grid;gap:6px;align-content:start;padding:20px 22px;background:var(--bg2);border:1px solid var(--line);border-radius:14px;color:var(--ink);text-decoration:none!important;transition:border-color .15s,background .15s}
.mg-depto:hover{border-color:var(--sinal);background:var(--bg3)}
.mg-depto:focus-visible{outline:2px solid var(--sinal);outline-offset:2px}
.mg-depto b{font-family:var(--font-display);font-size:19px;font-weight:700;color:#fff}
.mg-depto b::after{content:" →";color:var(--sinal);font-weight:600}
.mg-depto span{color:var(--ink-2);font-size:14.5px;line-height:1.45}
/* ver chamado: mensagens */
.tpl-viewticket .ticket-reply{border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--bg2);margin-bottom:12px}
.tpl-viewticket .ticket-reply .posted-by{background:var(--bg1)!important;color:var(--ink-2)!important;border-bottom:1px solid var(--line);padding:10px 18px}
.tpl-viewticket .ticket-reply .posted-by .posted-by-name{color:var(--ink);font-weight:600}
.tpl-viewticket .ticket-reply.staff{border-color:rgba(0,181,234,.35)}
.tpl-viewticket .ticket-reply.staff .posted-by{background:rgba(0,181,234,.10)!important}
.tpl-viewticket .requestor-badge{background:rgba(255,255,255,.08)!important;color:var(--ink-2)!important;border-radius:999px;padding:2px 10px}
.tpl-viewticket .ticket-reply.staff .requestor-badge{background:var(--sinal)!important;color:var(--sinal-ink,#01192B)!important}
.tpl-viewticket .ticket-reply .message{padding:16px 18px}
/* conta: usuários (botões lado a lado) e barra de força da senha */
.mega-area .btn-manage-permissions,.mega-area .btn-remove-user{white-space:nowrap;display:inline-flex;margin:2px 4px 2px 0}
.mega-area .table td:has(.btn-manage-permissions){white-space:nowrap;width:1%}
.mega-area .btn-remove-user{background:transparent!important;border:1px solid rgba(255,107,107,.5)!important;color:var(--bad)!important}
.mega-area .progress{background:var(--bg1)!important;border:1px solid var(--line);height:8px;border-radius:999px;overflow:hidden}
.mega-area .progress-bar{background:var(--sinal)}
.mega-area .progress-bar.bg-danger{background:var(--bad)}.mega-area .progress-bar.bg-warning{background:var(--warn)}.mega-area .progress-bar.bg-success{background:var(--ok)}
.mega-area .btn-manage-permissions,.mega-area .btn-remove-user{width:auto!important;min-width:max-content;overflow:visible;padding:6px 12px!important}
.mega-area .btn-manage-permissions.disabled,.mega-area .btn-remove-user.disabled{display:none!important}
/* botões no rodapé dos cartões da lateral (ex.: Responder / Fechar chamado) lado a lado */
.mega-area .sidebar .card-footer{padding:12px 16px}
.mega-area .sidebar .card-footer .row{display:flex;flex-wrap:nowrap;gap:8px;margin:0}
.mega-area .sidebar .card-footer .row>[class*="col-"]{flex:1 1 0;max-width:none;width:auto;padding:0}
.mega-area .sidebar .card-footer .btn-block{width:100%;display:inline-flex;justify-content:center;align-items:center;gap:6px;margin:0;white-space:nowrap}
/* adicionar crédito */
.mg-fundos-grade{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:start}
.mg-fundos-form{display:grid;gap:22px;padding:clamp(20px,3vw,30px);background:var(--bg2);border:1px solid var(--line);border-radius:var(--radius)}
.mg-fundos-bloco{display:grid;gap:10px}
.mg-fundos-rot{font-family:var(--font-display);font-size:19px;font-weight:700;color:#fff}
.mg-fundos-valor{font-family:var(--font-display);font-size:28px!important;font-weight:700;max-width:260px;padding:12px 16px!important}
.mg-fundos-atalhos{display:flex;gap:8px;flex-wrap:wrap}
.mg-fundos-atalhos button{border:1px solid var(--line-2);background:var(--bg1);color:var(--ink);border-radius:999px;padding:6px 16px;font-weight:600;cursor:pointer}
.mg-fundos-atalhos button:hover{border-color:var(--sinal);color:var(--sinal)}
.mg-fundos-gw{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.mg-fundos-gw .mg-tile{position:relative;display:flex;padding:14px 40px 14px 16px;border:1.5px solid var(--line-2);border-radius:12px;background:var(--bg1);cursor:pointer;margin:0;font-weight:600;color:var(--ink)}
.mg-fundos-gw .mg-tile input{position:absolute;opacity:0;width:1px;height:1px}
.mg-fundos-gw .mg-tile::after{content:"";position:absolute;right:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;border-radius:50%;border:1.5px solid var(--line-2)}
.mg-fundos-gw .mg-tile:has(input:checked){border-color:var(--sinal);background:rgba(0,181,234,.10)}
.mg-fundos-gw .mg-tile:has(input:checked)::after{border-color:var(--sinal);background:var(--sinal);box-shadow:inset 0 0 0 3px var(--bg1)}
.mg-fundos-gw .mg-tile:has(input:focus-visible){outline:2px solid var(--sinal);outline-offset:2px}
.mg-fundos-ok{justify-self:start;padding:13px 32px}
.mg-fundos-nota{margin:0;color:var(--ink-2);font-size:14px}
.mg-fundos-info{padding:22px;background:var(--bg1);border:1px solid var(--line);border-radius:var(--radius)}
.mg-fundos-info h2{font-size:18px;margin:0 0 12px}
.mg-fundos-info dl{margin:0;display:grid;gap:10px}
.mg-fundos-info dl div{display:flex;justify-content:space-between;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.mg-fundos-info dt{font-weight:400;color:var(--ink-2)}.mg-fundos-info dd{margin:0;color:var(--ink);font-weight:600}
.mg-fundos-info p{margin:12px 0 0;color:var(--ink-2);font-size:13px}
@media (max-width:900px){.mg-fundos-grade{grid-template-columns:1fr}}
/* selo "+7% taxa" que o hook de taxa injeta com estilo inline claro */
.mg-fundos-gw .mg-tile span[style]{background:rgba(255,181,71,.14)!important;color:var(--warn)!important;font:600 11.5px var(--font-ui)!important;border-radius:999px!important;padding:2px 8px!important;margin:4px 0 0!important;display:inline-block!important;align-self:flex-start}
.mg-fundos-gw .mg-tile{flex-direction:column;gap:2px}

/* ── DatacenterHub (dedicado / colocation): o módulo injeta CSS claro inline; aqui a pele escura da Mega (22/10) ── */
.mega-area .dch-card{background:var(--bg2)!important;border:1px solid var(--line)!important;border-radius:14px!important;box-shadow:none!important}
.mega-area .dch-card-header{background:var(--bg1)!important;border-bottom:1px solid var(--line);padding:14px 20px!important}
.mega-area .dch-card-header h4{color:#fff!important;font-family:var(--font-display);font-size:16px!important;font-weight:700!important;letter-spacing:0!important}
.mega-area .dch-card-header i{color:var(--sinal)!important}
.mega-area .dch-card-body{padding:16px 20px!important}
.mega-area .dch-billing-item,.mega-area .dch-row{border-color:var(--line)!important}
.mega-area .dch-billing-label,.mega-area .dch-hw-label,.mega-area .dch-label,.mega-area .dch-modal-hint,.mega-area .dch-rdns-hint{color:var(--ink-2)!important;text-transform:none!important;letter-spacing:0!important;font-size:13px!important}
.mega-area .dch-billing-value,.mega-area .dch-hw-value,.mega-area .dch-value,.mega-area .dch-rdns-label{color:var(--ink)!important;font-size:14px!important}
.mega-area .dch-value,.mega-area .dch-ip,.mega-area .dch-modal-pass,.mega-area .dch-ptr-val,.mega-area .dch-rdns-input{font-family:var(--font-mono)!important}
.mega-area .dch-ip{background:rgba(0,181,234,.12)!important;color:var(--sinal)!important;border:0!important}
.mega-area .dch-ptr-val{color:var(--sinal)!important}
.mega-area .dch-hw-item{background:var(--bg1)!important;border:1px solid var(--line)!important;border-radius:10px!important}
.mega-area .dch-btn,.mega-area .dch-btn-rdns,.mega-area .dch-modal-cancel-btn{background:transparent!important;border:1px solid var(--line-2)!important;color:var(--sinal)!important;border-radius:999px!important;padding:5px 12px!important;font-size:12.5px!important;font-weight:600}
.mega-area .dch-btn:hover,.mega-area .dch-btn-rdns:hover,.mega-area .dch-modal-cancel-btn:hover{background:var(--bg3)!important;color:#fff!important;border-color:var(--sinal)!important}
.mega-area .dch-btn-danger{color:var(--bad)!important;border-color:rgba(255,107,107,.5)!important}
.mega-area .dch-btn-danger:hover{background:rgba(255,107,107,.15)!important;color:var(--bad)!important}
.mega-area .dch-ilo-btn,.mega-area .dch-modal-copy-btn,.mega-area .dch-rdns-save-btn{background:var(--sinal)!important;color:#01192B!important;border:0!important;border-radius:999px!important;font-weight:600!important;padding:7px 16px!important}
.mega-area .dch-ilo-btn:hover,.mega-area .dch-modal-copy-btn:hover,.mega-area .dch-rdns-save-btn:hover{opacity:.9}
.mega-area .dch-pass-expired{background:rgba(255,107,107,.12)!important;border-color:rgba(255,107,107,.4)!important;color:var(--bad)!important;border-radius:10px!important}
.mega-area .dch-pass-expired a{color:#fff!important;font-weight:600}
.mega-area .dch-alert-warn{background:rgba(255,181,71,.12)!important;border-color:rgba(255,181,71,.4)!important;color:var(--warn)!important}
.mega-area .dch-alert-info{background:rgba(0,181,234,.10)!important;border-color:rgba(0,181,234,.35)!important;color:var(--ink)!important}
.mega-area .dch-modal-box{background:var(--bg2)!important;border:1px solid var(--line-2);box-shadow:0 20px 60px rgba(0,0,0,.6)!important}
.mega-area .dch-modal-header{background:var(--bg1)!important;border-bottom:1px solid var(--line)}
.mega-area .dch-modal-header h5{color:#fff!important}
.mega-area .dch-modal-close{color:var(--ink-2)!important}
.mega-area .dch-modal-pass{background:var(--bg1)!important;border-color:var(--line)!important;color:#fff!important}
.mega-area .dch-modal-footer{border-top-color:var(--line)!important}
.mega-area .dch-rdns-input{background:var(--bg1)!important;border:1px solid var(--line-2)!important;color:var(--ink)!important}
.mega-area .dch-rdns-input:focus{border-color:var(--sinal)!important;box-shadow:0 0 0 3px rgba(0,181,234,.15)!important}
.mega-area .dch-rdns-current{background:rgba(0,181,234,.10)!important;border-color:rgba(0,181,234,.35)!important;color:var(--ink)!important}
.mega-area .dch-card .status.status-active{background:rgba(54,211,153,.14);color:var(--ok)}
/* DatacenterHub: caixas com estilo inline (aviso de VPN azul-claro e "Status do servidor" verde-claro) — só dá pra pegar pelo atributo */
.mega-area .dch-card-body div[style*="background:#eff6ff"]{background:rgba(0,181,234,.10)!important;color:var(--ink)!important;border:1px solid rgba(0,181,234,.35);border-radius:10px!important}
.mega-area .dch-card-body div[style*="background:#f0fdf4"]{background:var(--bg1)!important;border:1px solid var(--line)!important;border-radius:12px!important}
.mega-area .dch-card-body div[style*="background:#f0fdf4"] span[style*="color:#166534"]{color:var(--ink-2)!important;text-transform:none!important;letter-spacing:0!important;font-size:13px!important}
.mega-area .dch-card-body div[style*="background:#f0fdf4"] #dch-power-status{color:var(--ink)!important}
.mega-area .dch-card-body span[style*="color:#94a3b8"]{color:var(--ink-2)!important}

/* DCH — tabela "IPs Adicionais" (estilos inline claros do módulo) */
.mega-area .dch-card-body table thead tr[style*="background:#f8fafc"]{background:var(--bg1)!important;border-bottom:1px solid var(--line)!important}
.mega-area .dch-card-body table th[style*="color:#64748b"]{color:var(--ink-2)!important}
.mega-area .dch-card-body table tbody tr[style*="border-bottom:1px solid #f1f5f9"]{border-bottom-color:var(--line)!important}
.mega-area .dch-card-body table td span[style*="color:#1d4ed8"]{color:var(--sinal)!important}
.mega-area .dch-card-body table td[style*="color:#475569"]{color:var(--ink-2)!important}