/* ============================================================
   HOSTLAX — Tema customizado WHMCS (six-hostlax)
   Identidade visual alinhada ao site principal hostlax.com.br
   ============================================================ */

/* ===== CORREÇÃO DE ESCALA REM =====
   O Bootstrap deste tema define html{font-size:10px} (all.css linha ~1080),
   fazendo TODO valor em rem deste arquivo (que foi escrito assumindo 1rem=16px)
   renderizar a ~62% do tamanho pretendido — essa é a causa das letras pequenas.
   Corrigindo a raiz para 16px, todo o restante do arquivo passa a exibir
   os tamanhos "padrão" com que foi originalmente projetado. */
html{ font-size:16px !important; }
/* Único CSS nativo do WHMCS que dependia do root em 10px — compensado aqui */
.product-actions-wrapper > div:not(:last-child){ margin-bottom:5px !important; }
.div-service-status .label:not(.label-placeholder){ width:30px !important; }

/* ===== VARIABLES ===== */
:root{
    --hlx-navy:#101828;
    --hlx-navy-2:#182338;
    --hlx-teal:#2ec9d3;
    --hlx-teal-dark:#1fa7b0;
    --hlx-bg:#ffffff;
    --hlx-bg-alt:#F9FAFB;
    --hlx-bg-card:#ffffff;
    --hlx-text:#1D2939;
    --hlx-text-secondary:#475467;
    --hlx-text-muted:#98A2B3;
    --hlx-border:rgba(16,24,40,0.08);
    --hlx-radius:12px;
    --hlx-radius-lg:20px;
    --hlx-transition:0.25s cubic-bezier(0.4,0,0.2,1);
    --hlx-font:'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --hlx-shadow:0 4px 20px rgba(16,24,40,0.06);
    --hlx-shadow-lg:0 16px 48px rgba(16,24,40,0.14);
    --hlx-gold:#d4af7a;
}

/* ===== GLOBAL RESET ===== */
body.hlx-theme{
    font-family:var(--hlx-font) !important;
    background:var(--hlx-bg-alt) !important;
    color:var(--hlx-text-secondary) !important;
    -webkit-font-smoothing:antialiased;
    font-size:16px !important;
    line-height:1.65 !important;
}
body.hlx-theme p, body.hlx-theme li, body.hlx-theme label,
body.hlx-theme td, body.hlx-theme th, body.hlx-theme span{
    font-size:1rem;
}
body.hlx-theme h1{ font-size:1.75rem !important; }
body.hlx-theme h2{ font-size:1.375rem !important; }
body.hlx-theme h3{ font-size:1.125rem !important; }
body.hlx-theme h4{ font-size:1rem !important; }
body.hlx-theme h1, body.hlx-theme h2, body.hlx-theme h3,
body.hlx-theme h4, body.hlx-theme h5, body.hlx-theme h6{
    font-family:var(--hlx-font) !important;
    color:var(--hlx-text) !important;
    font-weight:700 !important;
}
body.hlx-theme a{ color:var(--hlx-navy); }
body.hlx-theme a:hover{ color:var(--hlx-teal-dark); }

/* ===== HIDE ORIGINAL HEADER / HOME BANNER / FOOTER ===== */
body.hlx-theme > section#header,
body.hlx-theme > section#main-menu,
body.hlx-theme > section#home-banner,
body.hlx-theme > div.home-shortcuts,
body.hlx-theme > section#footer{
    display:none !important;
}

/* ===== TOPBAR (like hostlax.com.br) ===== */
.hlx-topbar{
    background:var(--hlx-navy);
    color:#c9d2e0;
    padding:9px 0;
    font-size:0.78rem;
    font-weight:500;
    letter-spacing:.2px;
}
.hlx-topbar-inner{ display:flex; align-items:center; justify-content:space-between; flex-wrap:nowrap; gap:8px; }
.hlx-topbar-left{ white-space:nowrap; }
.hlx-topbar-left i{ color:var(--hlx-teal); margin-right:6px; }
.hlx-topbar-right{ display:flex; gap:26px; white-space:nowrap; }
.hlx-topbar-right a{ color:#c9d2e0 !important; text-decoration:none !important; transition:var(--hlx-transition); }
.hlx-topbar-right a:hover{ color:var(--hlx-teal) !important; }
.hlx-topbar-right i{ color:var(--hlx-teal); margin-right:5px; }

/* ===== NAVBAR (light, premium — like hostlax.com.br) ===== */
.hlx-navbar{
    position:sticky;
    top:0;
    z-index:1000;
    padding:16px 0;
    background:rgba(255,255,255,0.98);
    backdrop-filter:blur(16px);
    border-bottom:1px solid var(--hlx-border);
    box-shadow:0 2px 20px rgba(16,24,40,0.06);
    transition:var(--hlx-transition);
}
.hlx-navbar-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    flex-wrap:nowrap;
}
.hlx-logo{ display:flex; align-items:center; text-decoration:none !important; flex-shrink:0; }
.hlx-navbar .hlx-logo-img{ height:40px; width:auto; }
.hlx-logo-text{ color:var(--hlx-text) !important; font-weight:800; font-size:1.2rem; }
.hlx-phone{
    display:flex; align-items:center; gap:8px; flex-shrink:0;
    color:var(--hlx-navy) !important; font-weight:700; font-size:0.85rem;
    text-decoration:none !important; white-space:nowrap;
    padding:8px 16px; border-radius:50px; background:var(--hlx-bg-alt);
    transition:var(--hlx-transition);
}
.hlx-phone i{ color:#25D366; font-size:1.05rem; }
.hlx-phone:hover{ color:var(--hlx-teal-dark) !important; background:rgba(46,201,211,0.1); }
.hlx-nav{ display:flex; align-items:center; gap:6px; flex:1; justify-content:flex-end; min-width:0; }
.hlx-nav-menu, .hlx-nav-secondary{
    list-style:none; display:flex; align-items:center; gap:2px; margin:0; padding:0; flex-wrap:nowrap;
}
.hlx-nav-divider{ width:1px; height:20px; background:var(--hlx-border); margin:0 4px; flex-shrink:0; }
.hlx-nav-item{ position:relative; }
.hlx-nav-link{
    display:flex; align-items:center; gap:6px;
    color:var(--hlx-text) !important;
    font-size:0.85rem; font-weight:600; letter-spacing:.1px;
    padding:8px 14px; border-radius:8px;
    text-decoration:none !important;
    white-space:nowrap;
    transition:var(--hlx-transition);
    cursor:pointer;
}
.hlx-nav-link:hover{ color:var(--hlx-teal-dark) !important; background:rgba(46,201,211,0.1); }
.hlx-dd-arrow{ font-size:0.65rem; margin-left:1px; }
.hlx-dropdown-menu.dropdown-menu{
    background:#fff; border:1px solid var(--hlx-border); border-radius:var(--hlx-radius);
    box-shadow:var(--hlx-shadow-lg); padding:10px; margin-top:12px; min-width:250px; border-top:3px solid var(--hlx-teal);
}
.hlx-dd-item.dropdown-item{
    display:flex; align-items:center; gap:10px;
    color:var(--hlx-text) !important; font-size:0.85rem; font-weight:500;
    padding:10px 14px; border-radius:8px; text-decoration:none !important;
    white-space:normal;
    transition:var(--hlx-transition);
}
.hlx-dd-item.dropdown-item:hover{ background:rgba(46,201,211,0.1); color:var(--hlx-teal-dark) !important; padding-left:16px; }
.hlx-badge{
    background:var(--hlx-teal); color:#fff; font-size:0.75rem; font-weight:700;
    padding:3px 8px; border-radius:50px;
}
.hlx-notif-badge{
    display:inline-block; width:8px; height:8px; border-radius:50%;
    background:#e74c3c; margin-left:2px; vertical-align:top;
}
.hlx-cart-btn{
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
    width:40px; height:40px; border-radius:10px;
    background:var(--hlx-bg-alt); color:var(--hlx-navy) !important;
    text-decoration:none !important; transition:var(--hlx-transition);
}
.hlx-cart-btn:hover{ background:var(--hlx-teal); color:#fff !important; }
.hlx-mobile-toggle{
    display:none; flex-direction:column; justify-content:center; gap:5px;
    width:34px; height:34px; background:transparent; border:none; cursor:pointer; flex-shrink:0;
}
.hlx-mobile-toggle span{ display:block; height:2px; width:100%; background:var(--hlx-navy); border-radius:2px; }

/* Buttons (premium gradient CTA) */
.hlx-btn{
    display:inline-flex; align-items:center; gap:8px;
    background:linear-gradient(135deg, var(--hlx-teal), var(--hlx-teal-dark));
    color:#fff !important; font-weight:600;
    padding:12px 26px; border-radius:50px; font-size:0.92rem; white-space:nowrap;
    text-decoration:none !important; border:none; cursor:pointer;
    box-shadow:0 8px 22px rgba(46,201,211,.32);
    transition:var(--hlx-transition);
}
.hlx-btn:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(46,201,211,.42); color:#fff !important; }
.hlx-btn-outline{
    background:transparent; color:var(--hlx-navy) !important; border:1.5px solid var(--hlx-border); box-shadow:none;
}
.hlx-btn-outline:hover{ border-color:var(--hlx-teal); background:rgba(46,201,211,0.08); }
.hlx-btn-sm{ padding:9px 18px; font-size:0.85rem; }

/* ===== HERO + FEATURE GRID (Homepage) ===== */
.hlx-homepage{ padding:40px 0 0; }
.hlx-hero-section{
    background:linear-gradient(135deg, var(--hlx-navy) 0%, var(--hlx-navy-2) 60%, #1c3a44 100%);
    border-radius:var(--hlx-radius-lg);
    padding:44px 40px;
    text-align:center;
    margin-bottom:32px;
    color:#fff;
}
.hlx-hero-badge{
    display:inline-flex; align-items:center; gap:8px;
    padding:6px 16px; border-radius:50px;
    background:rgba(46,201,211,0.15); border:1px solid rgba(46,201,211,0.4);
    font-size:0.82rem; color:var(--hlx-teal); font-weight:600; margin-bottom:16px;
}
.hlx-pulse{
    width:8px; height:8px; border-radius:50%; background:var(--hlx-teal);
    animation:hlxPulse 2s infinite;
}
@keyframes hlxPulse{
    0%,100%{ opacity:1; box-shadow:0 0 0 0 rgba(46,201,211,0.4); }
    50%{ opacity:0.7; box-shadow:0 0 0 8px transparent; }
}
body.hlx-theme .hlx-hero-section h1{
    font-size:1.8rem !important; font-weight:800 !important; color:#fff !important;
    letter-spacing:-1px; margin-bottom:12px;
}
body.hlx-theme .hlx-hero-section .hlx-hero-badge,
body.hlx-theme .hlx-hero-section .hlx-hero-sub{ color:inherit; }
body.hlx-theme .hlx-hero-section .hlx-btn-outline{
    color:#fff !important;
    border-color:rgba(255,255,255,0.45) !important;
}
body.hlx-theme .hlx-hero-section .hlx-btn-outline:hover{
    border-color:var(--hlx-teal) !important;
    background:rgba(46,201,211,0.14) !important;
    color:#fff !important;
}
.hlx-gradient-text{
    background:linear-gradient(135deg, var(--hlx-teal), #7be0e6);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.hlx-hero-sub{ color:#c9d2e0; font-size:0.92rem; max-width:600px; margin:0 auto 24px; line-height:1.6; }
.hlx-hero-actions{ display:flex; justify-content:center; gap:16px; flex-wrap:wrap; }

.hlx-features-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-bottom:40px; }
.hlx-feature-card{
    background:var(--hlx-bg-card); border:1px solid var(--hlx-border); border-radius:var(--hlx-radius);
    padding:24px 20px; text-align:center; text-decoration:none !important;
    transition:var(--hlx-transition); position:relative; overflow:hidden;
}
.hlx-feature-card::before{
    content:''; position:absolute; top:0; left:0; right:0; height:3px;
    background:linear-gradient(90deg, var(--hlx-teal), var(--hlx-navy));
    transform:scaleX(0); transition:var(--hlx-transition); transform-origin:left;
}
.hlx-feature-card:hover{ transform:translateY(-4px); box-shadow:var(--hlx-shadow-lg); border-color:rgba(46,201,211,0.25); }
.hlx-feature-card:hover::before{ transform:scaleX(1); }
.hlx-feature-icon{ font-size:1.7rem; color:var(--hlx-teal-dark); margin-bottom:14px; }
.hlx-feature-card h3{ font-size:1rem !important; font-weight:700 !important; color:var(--hlx-text) !important; margin-bottom:6px; }
.hlx-feature-card p{ font-size:0.88rem; color:var(--hlx-text-secondary); margin:0; }

/* ===== BUTTONS (general WHMCS bootstrap) ===== */
body.hlx-theme .btn{
    border-radius:9px; font-weight:600; font-family:var(--hlx-font); transition:var(--hlx-transition);
    font-size:0.86rem; padding:8px 18px; box-shadow:none;
}
body.hlx-theme .btn-primary,
body.hlx-theme input[type="submit"].btn{
    background:var(--hlx-teal) !important; border-color:var(--hlx-teal) !important; color:#fff !important;
}
body.hlx-theme .btn-primary:hover{ background:var(--hlx-teal-dark) !important; border-color:var(--hlx-teal-dark) !important; }
body.hlx-theme .btn-default{
    background:#fff !important; border-color:var(--hlx-border) !important; color:var(--hlx-text) !important;
}
body.hlx-theme .btn-default:hover{ border-color:var(--hlx-teal) !important; color:var(--hlx-teal-dark) !important; }

/* Botões compactos dentro de listagens (ex.: "Visualizar" em Emails Enviados) —
   pílula pequena e discreta em vez do botão retangular grande padrão do WHMCS */
body.hlx-theme .btn.btn-sm,
body.hlx-theme input.btn-sm{
    padding:5px 14px !important; font-size:0.72rem !important; font-weight:700 !important;
    border-radius:50px !important; letter-spacing:.3px; text-transform:uppercase;
}
body.hlx-theme .table-list .btn,
body.hlx-theme .table-list input.btn{
    padding:5px 14px !important; font-size:0.72rem !important; font-weight:700 !important;
    border-radius:50px !important; letter-spacing:.3px; text-transform:uppercase; white-space:nowrap;
}

/* ===== PANELS / CARDS ===== */
body.hlx-theme .panel{
    border:1px solid var(--hlx-border); border-radius:var(--hlx-radius); box-shadow:var(--hlx-shadow);
}
body.hlx-theme .panel-heading{
    background:#fff !important; border-bottom:1px solid var(--hlx-border);
    border-radius:var(--hlx-radius) var(--hlx-radius) 0 0 !important;
    font-weight:700; color:var(--hlx-text);
}
body.hlx-theme .panel-primary > .panel-heading{
    background:var(--hlx-navy) !important; color:#fff !important; border-color:var(--hlx-navy) !important;
}

/* ===== TABLES ===== */
body.hlx-theme .table{ font-size:0.9rem; }
body.hlx-theme .table > thead > tr > th{
    background:var(--hlx-bg-alt); border-bottom:2px solid var(--hlx-border); color:var(--hlx-text);
    font-weight:700; font-size:0.8rem; text-transform:uppercase; letter-spacing:.4px;
}
body.hlx-theme .table > tbody > tr:hover{ background:rgba(46,201,211,0.04); }

/* ===== TAMANHO PADRÃO DE TEXTO (escala compacta, estilo painel empresarial) ===== */
body.hlx-theme table td,
body.hlx-theme table th,
body.hlx-theme table.table-list tbody td{ font-size:0.9rem !important; }
body.hlx-theme .name{ font-size:0.92rem !important; font-weight:600 !important; }
body.hlx-theme .date{ font-size:0.82rem !important; }
body.hlx-theme .message{ font-size:0.94rem !important; line-height:1.65 !important; }
body.hlx-theme .ticket-subject{ font-size:0.92rem !important; }
body.hlx-theme .ticket-number{ font-size:0.85rem !important; }
body.hlx-theme .panel-title{ font-size:1rem !important; font-weight:700 !important; }
body.hlx-theme .label,
body.hlx-theme .badge{ font-size:0.76rem !important; padding:.35em .8em !important; }
body.hlx-theme .form-control{ font-size:0.92rem !important; }
body.hlx-theme .list-group-item{ font-size:0.92rem !important; }
body.hlx-theme p, body.hlx-theme li, body.hlx-theme label,
body.hlx-theme td, body.hlx-theme th, body.hlx-theme span,
body.hlx-theme .help-block, body.hlx-theme small{ font-size:0.92rem; }
body.hlx-theme .text-muted{ font-size:0.85rem; }

/* ===== STATUS (tickets, faturas, domínios, serviços) — badges premium ===== */
body.hlx-theme .status{
    display:inline-flex !important; align-items:center; gap:5px;
    border:none !important; border-radius:50px !important; background:transparent !important;
    font-size:0.76rem !important; font-weight:700 !important; letter-spacing:.3px;
    line-height:1.6 !important; padding:.32em 1em !important; text-transform:uppercase;
}
body.hlx-theme .status::before{ content:''; width:6px; height:6px; border-radius:50%; background:currentColor; flex-shrink:0; }
body.hlx-theme .status-custom{ border:1.5px solid currentColor !important; background:transparent !important; padding:.28em .9em !important; }
body.hlx-theme .status-active, body.hlx-theme .status-open, body.hlx-theme .status-completed,
body.hlx-theme .status-paid, body.hlx-theme .status-accepted, body.hlx-theme .status-delivered{
    background:rgba(53,189,109,0.12) !important; color:#289a56 !important;
}
body.hlx-theme .status-pending, body.hlx-theme .status-unpaid, body.hlx-theme .status-inprogress,
body.hlx-theme .status-collections, body.hlx-theme .status-lost, body.hlx-theme .status-dead{
    background:rgba(224,91,91,0.12) !important; color:#c0392b !important;
}
body.hlx-theme .status-suspended, body.hlx-theme .status-customer-reply,
body.hlx-theme .status-pending-registration, body.hlx-theme .status-redemption, body.hlx-theme .status-grace,
body.hlx-theme .status-pending-transfer{
    background:rgba(255,186,30,0.16) !important; color:#b9770e !important;
}
body.hlx-theme .status-answered, body.hlx-theme .status-onhold, body.hlx-theme .status-expired,
body.hlx-theme .status-transferred-away, body.hlx-theme .status-refunded{
    background:rgba(46,201,211,0.12) !important; color:var(--hlx-teal-dark) !important;
}
body.hlx-theme .status-cancelled, body.hlx-theme .status-terminated, body.hlx-theme .status-closed,
body.hlx-theme .status-fraud{
    background:rgba(16,24,40,0.07) !important; color:var(--hlx-text-muted) !important;
}

/* ===== TICKETS / FATURAS — listagem premium ===== */
body.hlx-theme .ticket-number{
    display:inline-block; background:var(--hlx-bg-alt); color:var(--hlx-navy);
    padding:2px 9px; border-radius:6px; margin-right:8px; font-weight:700 !important;
}
body.hlx-theme .ticket-subject{ font-weight:600 !important; color:var(--hlx-text) !important; }
body.hlx-theme .ticket-subject.unread{ color:var(--hlx-teal-dark) !important; }
body.hlx-theme table.table-list tbody tr{ cursor:pointer; transition:var(--hlx-transition); }
body.hlx-theme table.table-list tbody tr:hover{ background:rgba(46,201,211,0.05) !important; }
body.hlx-theme .table-container{ background:#fff; border:1px solid var(--hlx-border); border-radius:var(--hlx-radius); overflow:hidden; }
body.hlx-theme div.dataTables_wrapper .dataTables_filter input{
    border-radius:8px; border:1px solid var(--hlx-border); padding:7px 12px; font-size:0.9rem;
}
body.hlx-theme div.dataTables_wrapper .dataTables_length select{
    border-radius:8px; border:1px solid var(--hlx-border); font-size:0.88rem;
}
body.hlx-theme div.dataTables_wrapper .dataTables_info,
body.hlx-theme div.dataTables_wrapper .dataTables_length{ font-size:0.85rem; color:var(--hlx-text-muted); }

/* ===== TICKETS — barra de ação (contagem + abrir chamado) ===== */
.hlx-tickets-toolbar{
    display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
    background:#fff; border:1px solid var(--hlx-border); border-radius:var(--hlx-radius);
    padding:14px 20px; margin-bottom:16px; box-shadow:var(--hlx-shadow);
}
.hlx-tickets-toolbar-info{ display:flex; align-items:baseline; gap:8px; font-size:0.85rem; color:var(--hlx-text-muted); }
body.hlx-theme .hlx-tickets-count{ font-size:1.3rem !important; font-weight:800 !important; color:var(--hlx-text) !important; }
body.hlx-theme .hlx-ticket-dept{
    display:inline-block; background:var(--hlx-bg-alt); color:var(--hlx-text-secondary) !important;
    padding:3px 10px; border-radius:6px; font-size:0.76rem !important; font-weight:600 !important;
}

/* ===== EMAILS ENVIADOS (clientareaemails.php) ===== */
body.hlx-theme #tableEmailsList tbody td:nth-child(2){ font-weight:600 !important; color:var(--hlx-text) !important; }
body.hlx-theme #tableEmailsList .fa-paperclip{ color:var(--hlx-teal-dark); margin-left:6px; font-size:0.85rem; }
body.hlx-theme #tableEmailsList tbody td:first-child{ color:var(--hlx-text-muted) !important; font-size:0.82rem !important; white-space:nowrap; }

/* ===== CONVERSA DO TICKET (viewticket.php) — estilo chat premium =====
   Nota: .date e .user são irmãos dentro de .ticket-reply (não .date dentro de .user) —
   por isso o position:relative fica em .ticket-reply, e .user usa fluxo normal
   (ícone em posição absoluta + texto em bloco), nunca display:flex, para não
   jogar nome/cargo lado a lado numa só linha. */
body.hlx-theme .ticket-reply{
    position:relative;
    border:1px solid var(--hlx-border) !important; border-left:3px solid var(--hlx-border) !important;
    border-radius:var(--hlx-radius); background:#fff; margin:0 0 16px; overflow:hidden;
}
body.hlx-theme .ticket-reply.staff{ border-left:3px solid var(--hlx-teal) !important; background:rgba(46,201,211,0.03); }
body.hlx-theme .ticket-reply .user{
    position:relative; background:var(--hlx-bg-alt) !important;
    padding:12px 90px 12px 62px; min-height:34px; box-sizing:border-box;
}
body.hlx-theme .ticket-reply.staff .user{ background:rgba(46,201,211,0.06) !important; }
body.hlx-theme .ticket-reply .user i{
    position:absolute; left:16px; top:50%; transform:translateY(-50%);
    float:none; font-size:0.85rem; width:34px; height:34px; border-radius:50%;
    background:var(--hlx-navy); color:#fff; display:flex; align-items:center; justify-content:center;
}
body.hlx-theme .ticket-reply.staff .user i{ background:var(--hlx-teal); }
body.hlx-theme .ticket-reply .user .name{
    display:block; font-size:0.88rem !important; font-weight:700 !important; color:var(--hlx-text) !important;
    overflow-wrap:break-word; word-break:break-word;
}
body.hlx-theme .ticket-reply .user .type{
    display:block; font-size:0.76rem !important; font-weight:500 !important; color:var(--hlx-text-muted) !important;
    overflow-wrap:break-word; word-break:break-word;
}
body.hlx-theme .ticket-reply .date{
    float:none; position:absolute; right:16px; top:16px;
    font-size:0.74rem !important; color:var(--hlx-text-muted); padding:0; white-space:nowrap; z-index:1;
}
body.hlx-theme .ticket-reply .message{
    padding:16px; font-size:0.9rem !important; line-height:1.65 !important; color:var(--hlx-text);
    overflow-wrap:break-word; word-break:break-word;
}
body.hlx-theme .label.requestor-type-operator{ background:var(--hlx-teal) !important; color:#fff !important; }
body.hlx-theme .label.requestor-type-owner,
body.hlx-theme .label.requestor-type-registereduser,
body.hlx-theme .label.requestor-type-authorizeduser{ background:var(--hlx-navy) !important; color:#fff !important; }
body.hlx-theme .label.requestor-type-guest{ background:var(--hlx-text-muted) !important; color:#fff !important; }
body.hlx-theme .ticket-reply .attachments{ padding:0 16px 16px; font-size:0.85rem !important; }
body.hlx-theme .ticket-reply .attachments ul{ list-style:none; padding:0; margin:8px 0 0; display:flex; flex-direction:column; gap:6px; }
body.hlx-theme .ticket-reply .attachments a{ color:var(--hlx-teal-dark) !important; text-decoration:none !important; }
body.hlx-theme .ticket-reply .attachments a:hover{ text-decoration:underline !important; }
@media (max-width:600px){
    body.hlx-theme .ticket-reply .date{ position:static; display:block; margin:6px 16px 0; text-align:right; }
    body.hlx-theme .ticket-reply .user{ padding-right:16px; }
}

/* ===== FORMS ===== */
body.hlx-theme .form-control{
    border-radius:8px; border:1px solid var(--hlx-border); box-shadow:none;
    font-family:var(--hlx-font); padding:8px 14px;
}
body.hlx-theme .form-control:focus{
    border-color:var(--hlx-teal); box-shadow:0 0 0 3px rgba(46,201,211,0.15);
}

/* ===== ALERTS ===== */
body.hlx-theme .alert{ border-radius:var(--hlx-radius); border:none; font-size:1rem; }
body.hlx-theme .alert-info{ background:rgba(46,201,211,0.1); color:var(--hlx-teal-dark); }
body.hlx-theme .alert-success{ background:rgba(0,184,148,0.1); color:#0a8c74; }
body.hlx-theme .alert-danger{ background:rgba(231,76,60,0.1); color:#c0392b; }
body.hlx-theme .alert-warning{ background:rgba(243,156,18,0.12); color:#b9770e; }

/* ===== BADGES / LABELS ===== */
body.hlx-theme .label{ border-radius:50px; font-weight:600; padding:.4em .9em; font-size:0.85rem; }
body.hlx-theme .label-primary, body.hlx-theme .label-success{ background:var(--hlx-teal) !important; }
body.hlx-theme .label-default{ background:var(--hlx-text-muted) !important; }

/* ===== PAGINATION ===== */
body.hlx-theme .pagination > li > a{ color:var(--hlx-navy); border-color:var(--hlx-border); }
body.hlx-theme .pagination > li > a:hover{ color:var(--hlx-teal-dark); }
body.hlx-theme .pagination > .active > a{ background:var(--hlx-teal) !important; border-color:var(--hlx-teal) !important; color:#fff !important; }

/* ===== CONTRASTE — botões/links secundários pouco visíveis ===== */
body.hlx-theme .btn-info{ background:var(--hlx-navy) !important; border-color:var(--hlx-navy) !important; color:#fff !important; }
/* Botões de ação nos painéis (ex: "Atualizar" sobre fundo verde) — texto preto para contraste, inclusive no hover */
body.hlx-theme .btn.bg-color-green,
body.hlx-theme a.bg-color-green,
body.hlx-theme .bg-color-green,
body.hlx-theme .btn.bg-color-green:hover,
body.hlx-theme a.bg-color-green:hover,
body.hlx-theme .bg-color-green:hover{ color:#000000 !important; }
body.hlx-theme .btn.bg-color-blue,
body.hlx-theme a.bg-color-blue,
body.hlx-theme .btn.bg-color-blue:hover,
body.hlx-theme a.bg-color-blue:hover{ color:#000000 !important; }
body.hlx-theme .btn.bg-color-gold,
body.hlx-theme a.bg-color-gold,
body.hlx-theme .btn.bg-color-gold:hover,
body.hlx-theme a.bg-color-gold:hover{ color:#000000 !important; }
body.hlx-theme .btn-info:hover{ background:var(--hlx-teal-dark) !important; border-color:var(--hlx-teal-dark) !important; }
body.hlx-theme .btn-link{ color:var(--hlx-navy) !important; font-weight:600; text-decoration:none !important; }
body.hlx-theme .btn-link:hover{ color:var(--hlx-teal-dark) !important; text-decoration:underline !important; }
body.hlx-theme .text-info{ color:var(--hlx-navy) !important; }
body.hlx-theme .label-info{ background:var(--hlx-navy) !important; color:#fff !important; }
body.hlx-theme table a:not(.btn){ color:var(--hlx-navy); font-weight:500; }
body.hlx-theme table a:not(.btn):hover{ color:var(--hlx-teal-dark); }

/* ===== CABEÇALHO DE PÁGINA (title + breadcrumb — presente em quase toda página interna) ===== */
div.header-lined{
    background:#fff; border:1px solid var(--hlx-border); border-radius:var(--hlx-radius);
    padding:18px 22px; margin-bottom:22px; box-shadow:var(--hlx-shadow);
}
body.hlx-theme div.header-lined h1{
    margin:0; padding:0; border-bottom:none; font-weight:800 !important;
    color:var(--hlx-text) !important; font-family:var(--hlx-font) !important; font-size:1.3rem !important;
    display:flex; align-items:center; gap:10px;
}
div.header-lined small{ color:var(--hlx-text-muted); font-weight:400 !important; font-size:0.82rem !important; margin-left:2px; }
div.header-lined .breadcrumb{
    margin:8px 0 0; padding:0; background:transparent; font-size:0.78rem;
}
div.header-lined .breadcrumb li{ color:var(--hlx-text-muted); }
div.header-lined .breadcrumb li a{ color:var(--hlx-teal-dark); text-decoration:none !important; font-weight:600; }
div.header-lined .breadcrumb li a:hover{ text-decoration:underline !important; }
div.header-lined .breadcrumb > .active{ color:var(--hlx-text); font-weight:600; }

/* ===== SIDEBAR =====
   Nota: .list-group-item aqui é usado tanto para links de menu simples (ícone + texto
   em uma linha) quanto para blocos de informação com vários campos empilhados
   (ex.: painel "Informações do Ticket" com Solicitante/Departamento, gerado pelo
   próprio WHMCS). Por isso NUNCA forçar display:flex/align-items aqui — isso
   espreme conteúdo de várias linhas em uma só. O ícone de menu fica só inline-block. */
body.hlx-theme .sidebar .panel{ background:#fff; box-shadow:var(--hlx-shadow); border-radius:var(--hlx-radius); overflow:visible; }
body.hlx-theme .sidebar .panel-heading{
    background:var(--hlx-bg-alt) !important; border-bottom:1px solid var(--hlx-border);
    border-radius:var(--hlx-radius) var(--hlx-radius) 0 0;
}
body.hlx-theme .sidebar .panel-title{
    font-size:0.78rem !important; font-weight:700 !important; text-transform:uppercase; letter-spacing:.6px;
    color:var(--hlx-text-muted) !important;
}
body.hlx-theme .sidebar .panel-title i:first-child{ color:var(--hlx-teal-dark); margin-right:6px; }
body.hlx-theme .sidebar .panel-body{ font-size:0.88rem; color:var(--hlx-text); line-height:1.6; overflow-wrap:break-word; word-break:break-word; }
body.hlx-theme .sidebar .panel-body strong,
body.hlx-theme .sidebar .panel-body b{
    display:block; font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.4px;
    color:var(--hlx-text-muted); margin:14px 0 3px;
}
body.hlx-theme .sidebar .panel-body strong:first-child,
body.hlx-theme .sidebar .panel-body b:first-child{ margin-top:0; }
body.hlx-theme .sidebar .list-group-item{
    border:none; border-bottom:1px solid var(--hlx-border); font-size:0.88rem !important;
    transition:var(--hlx-transition); overflow-wrap:break-word; word-break:break-word;
}
body.hlx-theme .sidebar .list-group-item i.sidebar-menu-item-icon,
body.hlx-theme .sidebar .list-group-item > i:first-child{
    color:var(--hlx-teal-dark); width:16px; display:inline-block; text-align:center; margin-right:6px;
}
body.hlx-theme .sidebar .list-group-item:hover{ background:rgba(46,201,211,0.05); padding-left:20px; }
body.hlx-theme .sidebar .list-group-item.active{ background:rgba(46,201,211,0.1) !important; color:var(--hlx-teal-dark) !important; border-color:transparent; font-weight:600; }
body.hlx-theme .sidebar .list-group-item.active i{ color:var(--hlx-teal-dark) !important; }

/* Item movido para a topbar (Status da Rede) — ocultar duplicidade no menu principal */
#Primary_Navbar-Network_Status{ display:none !important; }

/* Item "Domínios" removido do menu principal (nome interno WHMCS: Domains) */
li[menuItemName="Domains"]{ display:none !important; }

/* ===== NOTIFICAÇÕES (popover do sino no menu) ===== */
body.hlx-theme .popover{
    border:1px solid var(--hlx-border); border-radius:var(--hlx-radius); box-shadow:var(--hlx-shadow-lg);
    font-family:var(--hlx-font); max-width:320px;
}
body.hlx-theme .popover-title{
    background:var(--hlx-bg-alt); border-bottom:1px solid var(--hlx-border); font-weight:700; color:var(--hlx-text);
    border-radius:var(--hlx-radius) var(--hlx-radius) 0 0; font-size:0.85rem;
}
body.hlx-theme .client-alerts{ margin:0; padding:0; max-height:320px; overflow-y:auto; }
body.hlx-theme .client-alerts li{ list-style:none; border-bottom:1px solid var(--hlx-border); }
body.hlx-theme .client-alerts li:last-child{ border-bottom:none; }
body.hlx-theme .client-alerts a{
    display:flex; align-items:flex-start; gap:10px; padding:10px 14px; color:var(--hlx-text) !important;
    text-decoration:none !important; font-size:0.85rem; transition:var(--hlx-transition);
}
body.hlx-theme .client-alerts a:hover{ background:rgba(46,201,211,0.05); }
body.hlx-theme .client-alerts li.none{ padding:14px; color:var(--hlx-text-muted); font-size:0.85rem; text-align:center; }

/* ===== MODAIS ===== */
body.hlx-theme .modal-content{ border:none; border-radius:var(--hlx-radius-lg); box-shadow:var(--hlx-shadow-lg); overflow:hidden; }
body.hlx-theme .modal-header{ background:var(--hlx-bg-alt); border-bottom:1px solid var(--hlx-border); padding:18px 24px; }
body.hlx-theme .modal-title{ font-weight:700; color:var(--hlx-text); font-size:1.05rem; }
body.hlx-theme .modal-body{ padding:24px; font-size:0.92rem; }
body.hlx-theme .modal-footer{ border-top:1px solid var(--hlx-border); padding:16px 24px; }

/* ===== ABAS (nav-tabs — configurações, segurança etc.) ===== */
body.hlx-theme .nav-tabs{ border-bottom:1px solid var(--hlx-border); }
body.hlx-theme .nav-tabs > li > a{
    border:none !important; background:transparent !important; color:var(--hlx-text-muted) !important;
    font-weight:600; font-size:0.9rem; padding:11px 18px; border-radius:0 !important;
}
body.hlx-theme .nav-tabs > li.active > a{
    color:var(--hlx-teal-dark) !important; box-shadow:inset 0 -2px 0 var(--hlx-teal) !important;
}
body.hlx-theme .nav-tabs > li > a:hover{ color:var(--hlx-navy) !important; background:transparent !important; }

/* ===== WELL / CAIXAS DE DESTAQUE ===== */
body.hlx-theme .well{ background:var(--hlx-bg-alt); border:1px solid var(--hlx-border); border-radius:var(--hlx-radius); box-shadow:none; }

/* ===== CHECKBOX / RADIO ===== */
body.hlx-theme input[type="checkbox"]{ accent-color:var(--hlx-teal); width:15px; height:15px; }
body.hlx-theme input[type="radio"]{ accent-color:var(--hlx-teal); width:15px; height:15px; }

/* ===== MAIN BODY SPACING ===== */
body.hlx-theme #main-body{ padding-top:20px; }

/* ===== FOOTER ===== */
.hlx-footer{ background:var(--hlx-navy); color:#9aa5b8; padding:56px 0 0; margin-top:60px; }
.hlx-footer-inner{ display:grid; grid-template-columns:1.3fr 0.9fr 0.9fr 1.1fr; gap:36px; padding-bottom:40px; }
.hlx-footer-brand .hlx-logo-img{ height:34px; margin-bottom:14px; filter:brightness(0) invert(1); }
.hlx-footer-brand p{ font-size:0.95rem; color:#8792a5; max-width:280px; line-height:1.7; margin:0 0 18px; }
.hlx-footer-badge{
    display:inline-flex; align-items:center; gap:7px;
    background:rgba(46,201,211,0.12); border:1px solid rgba(46,201,211,0.3);
    color:var(--hlx-teal); font-size:0.82rem; font-weight:600;
    padding:6px 14px; border-radius:50px;
}
.hlx-footer-col-title{
    color:#ffffff; font-size:0.82rem; font-weight:700; letter-spacing:1.2px;
    text-transform:uppercase; margin:0 0 18px;
}
.hlx-footer-links{ display:flex; flex-direction:column; gap:12px; }
.hlx-footer-links a{ color:#c9d2e0 !important; font-size:0.96rem; text-decoration:none !important; transition:var(--hlx-transition); }
.hlx-footer-links a:hover{ color:var(--hlx-teal) !important; padding-left:3px; }
.hlx-footer-info p{ display:flex; align-items:flex-start; gap:10px; font-size:0.92rem; margin:0 0 14px; color:#8792a5; line-height:1.6; }
.hlx-footer-info i{ color:var(--hlx-teal); width:14px; margin-top:3px; flex-shrink:0; }
.hlx-footer-bottom{
    border-top:1px solid rgba(255,255,255,0.08);
    padding:20px 0;
    display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.hlx-footer-bottom p{ margin:0; font-size:0.85rem; color:#6b7686; }
.hlx-footer-legal{ display:flex; gap:20px; }
.hlx-footer-legal a{ color:#8792a5 !important; font-size:0.85rem; text-decoration:none !important; }
.hlx-footer-legal a:hover{ color:var(--hlx-teal) !important; }

/* ===== WHATSAPP FLOAT ===== */
.hlx-whatsapp{
    position:fixed; bottom:22px; right:22px; z-index:999;
    width:58px; height:58px; border-radius:50%;
    background:#25D366; color:#fff !important; display:flex; align-items:center; justify-content:center;
    font-size:26px; box-shadow:0 8px 20px rgba(0,0,0,.25); text-decoration:none !important;
    transition:var(--hlx-transition);
}
.hlx-whatsapp:hover{ transform:scale(1.08); color:#fff !important; }

/* ===== RESPONSIVE ===== */
@media (max-width:1850px){
    .hlx-nav{ position:fixed; top:0; right:-320px; width:300px; height:100vh; background:var(--hlx-navy);
        flex-direction:column; align-items:flex-start; padding:80px 24px 24px; transition:right .3s ease; overflow-y:auto; z-index:1001; }
    .hlx-nav.active{ right:0; box-shadow:-10px 0 40px rgba(0,0,0,0.3); }
    .hlx-nav-menu, .hlx-nav-secondary{ flex-direction:column; align-items:flex-start; width:100%; gap:2px; }
    .hlx-nav-divider{ display:none; }
    .hlx-nav .hlx-nav-link{ color:#fff !important; width:100%; white-space:normal; }
    .hlx-nav .hlx-nav-link:hover{ background:rgba(46,201,211,0.15); }
    .hlx-nav .hlx-cart-btn{ background:rgba(255,255,255,0.08); color:#fff !important; }
    .hlx-nav .hlx-btn-outline{ color:#fff !important; border-color:rgba(255,255,255,0.3); width:100%; justify-content:center; margin-top:10px; }
    .hlx-nav .hlx-btn-outline:hover{ border-color:var(--hlx-teal); background:rgba(46,201,211,0.12); }
    .hlx-dropdown-menu.dropdown-menu{ position:static !important; box-shadow:none; border:none; background:rgba(255,255,255,0.04); width:100%; }
    .hlx-nav .hlx-dd-item.dropdown-item{ color:#e3e8f0 !important; }
    .hlx-nav .hlx-dd-item.dropdown-item:hover{ color:var(--hlx-teal) !important; padding-left:12px; }
    .hlx-mobile-toggle{ display:flex; }
    .hlx-phone{ display:none; }
}
@media (max-width:991px){
    .hlx-features-grid{ grid-template-columns:repeat(2,1fr); }
    .hlx-footer-inner{ grid-template-columns:1fr 1fr; gap:32px 24px; }
    .hlx-footer-bottom{ justify-content:center; text-align:center; }
    .hlx-topbar-right{ gap:14px; font-size:0.85rem; }
}
@media (max-width:640px){
    .hlx-footer-inner{ grid-template-columns:1fr; gap:28px; text-align:center; }
    .hlx-footer-links{ align-items:center; }
    .hlx-footer-info p{ justify-content:center; }
}
@media (max-width:640px){
    .hlx-topbar .hlx-topbar-left{ display:none; }
}
@media (max-width:576px){
    .hlx-features-grid{ grid-template-columns:1fr; }
    .hlx-hero-section{ padding:44px 24px; }
    .hlx-hero-section h1{ font-size:1.7rem !important; }
}

/* ============================================================
   LOGIN — Tela dividida (split screen), inspirada em referência,
   com a identidade visual do hostlax.com.br
   ============================================================ */
.hlx-login-split{
    display:flex;
    min-height:560px;
    margin:20px 0 40px;
    overflow:hidden;
    border-radius:var(--hlx-radius-lg);
    box-shadow:0 24px 70px rgba(16,24,40,0.16);
    border:1px solid var(--hlx-border);
}

/* ===== ESQUERDA — MARCA ===== */
.hlx-login-brand{
    width:45%;
    background:linear-gradient(135deg, var(--hlx-navy) 0%, var(--hlx-navy-2) 60%, #1c3a44 100%);
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:48px;
    overflow:hidden;
}
.hlx-login-brand-bg{ position:absolute; inset:0; pointer-events:none; }
.hlx-login-glow{ position:absolute; border-radius:50%; filter:blur(80px); }
.hlx-glow-1{ width:320px; height:320px; background:rgba(46,201,211,0.22); top:8%; right:-10%; }
.hlx-glow-2{ width:260px; height:260px; background:rgba(46,201,211,0.1); bottom:8%; left:-6%; }
.hlx-login-grid-pattern{
    position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(46,201,211,0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(46,201,211,0.06) 1px, transparent 1px);
    background-size:40px 40px;
    mask-image:radial-gradient(ellipse at center, black 30%, transparent 70%);
    -webkit-mask-image:radial-gradient(ellipse at center, black 30%, transparent 70%);
}
.hlx-login-brand-content{ position:relative; z-index:1; }
.hlx-login-brand-logo-img{ max-width:180px; height:auto; filter:brightness(0) invert(1); margin-bottom:28px; }
.hlx-login-badge{
    display:inline-flex; align-items:center; gap:8px;
    background:rgba(46,201,211,0.14); border:1px solid rgba(46,201,211,0.4);
    color:var(--hlx-teal); font-size:0.78rem; font-weight:600; letter-spacing:1px; text-transform:uppercase;
    padding:7px 16px; border-radius:50px; margin-bottom:22px;
}
.hlx-login-brand-divider{ width:50px; height:3px; background:linear-gradient(90deg, var(--hlx-teal), var(--hlx-teal-dark)); border-radius:3px; margin-bottom:24px; }
body.hlx-theme .hlx-login-brand-content h2{
    font-size:1.6rem !important; font-weight:800 !important; color:#ffffff !important;
    letter-spacing:-0.6px !important; line-height:1.2 !important; margin-bottom:14px !important;
}
.hlx-login-brand-content p{ font-size:0.9rem; color:rgba(255,255,255,0.6); line-height:1.65; max-width:360px; margin-bottom:40px; }

.hlx-login-features{ display:flex; flex-direction:column; gap:16px; }
.hlx-login-feature{ display:flex; align-items:center; gap:14px; }
.hlx-lf-icon{
    width:36px; height:36px; border-radius:10px; background:rgba(46,201,211,0.15);
    display:flex; align-items:center; justify-content:center; color:var(--hlx-teal); font-size:0.85rem; flex-shrink:0;
}
.hlx-lf-text{ font-size:0.88rem; color:rgba(255,255,255,0.6); font-weight:500; }
.hlx-login-brand-footer{ position:absolute; bottom:40px; left:60px; z-index:1; }
.hlx-login-brand-footer a{
    color:rgba(255,255,255,0.4) !important; font-size:0.85rem; text-decoration:none !important;
    transition:var(--hlx-transition); display:inline-flex; align-items:center; gap:6px;
}
.hlx-login-brand-footer a:hover{ color:#fff !important; }

/* ===== DIREITA — FORMULÁRIO ===== */
.hlx-login-form-side{
    flex:1; display:flex; align-items:center; justify-content:center;
    padding:48px 40px; background:#fff;
}
.hlx-login-form-wrapper{ width:100%; max-width:420px; }
.hlx-login-mobile-logo{ display:none; max-width:150px; height:auto; margin:0 auto 24px; }
.hlx-login-form-header{ margin-bottom:36px; }
body.hlx-theme .hlx-login-form-header h1{ font-size:1.8rem !important; font-weight:800 !important; color:var(--hlx-text) !important; margin:0 0 6px !important; letter-spacing:-0.5px; }
.hlx-login-form-header p{ font-size:0.9rem; color:var(--hlx-text-muted); margin:0; }

.hlx-lf-group{ margin-bottom:22px; }
.hlx-lf-group label{
    display:flex !important; align-items:center !important; gap:6px !important;
    font-size:0.78rem !important; font-weight:600 !important; color:var(--hlx-text-secondary) !important;
    text-transform:uppercase !important; letter-spacing:0.5px !important; margin-bottom:8px !important;
}
.hlx-lf-group label i{ color:var(--hlx-teal-dark); font-size:0.72rem; }
.hlx-lf-label-row{ display:flex; justify-content:space-between; align-items:center; }
.hlx-lf-forgot{ font-size:0.78rem !important; color:var(--hlx-teal-dark) !important; text-decoration:none !important; font-weight:600 !important; text-transform:none !important; letter-spacing:0 !important; }
.hlx-lf-forgot:hover{ text-decoration:underline !important; }

.hlx-lf-input-wrap{ position:relative; display:flex; align-items:center; }
.hlx-lf-input-icon{ position:absolute; left:16px; color:var(--hlx-teal-dark); font-size:0.85rem; z-index:2; pointer-events:none; }
.hlx-lf-input-wrap .form-control{
    padding:14px 16px 14px 46px !important; border-radius:12px !important;
    border:1.5px solid rgba(0,0,0,0.1) !important; background:var(--hlx-bg-alt) !important;
    font-size:0.95rem !important; font-family:var(--hlx-font) !important; color:var(--hlx-text) !important;
    transition:var(--hlx-transition) !important; height:auto !important; width:100% !important; box-shadow:none !important;
}
.hlx-lf-input-wrap .form-control:focus{ border-color:var(--hlx-teal) !important; box-shadow:0 0 0 4px rgba(46,201,211,0.12) !important; background:#fff !important; }
.hlx-lf-input-wrap .form-control::placeholder{ color:#bbb !important; }
.hlx-lf-pw-wrap .form-control{ padding-right:50px !important; }
.hlx-lf-reveal{
    position:absolute !important; right:4px !important; top:50% !important; transform:translateY(-50%) !important;
    background:transparent !important; border:none !important; color:var(--hlx-text-muted) !important;
    padding:8px 12px !important; cursor:pointer !important; z-index:2; border-radius:8px !important;
}
.hlx-lf-reveal:hover{ color:var(--hlx-teal-dark) !important; }

.hlx-lf-submit{
    width:100%; padding:15px 24px; border:none; border-radius:12px;
    background:linear-gradient(135deg, var(--hlx-teal), var(--hlx-teal-dark));
    color:#fff; font-size:1rem; font-weight:700; font-family:var(--hlx-font);
    cursor:pointer; transition:var(--hlx-transition); display:flex; align-items:center; justify-content:center; gap:10px;
    box-shadow:0 4px 15px rgba(46,201,211,0.3); margin-top:8px;
}
.hlx-lf-submit:hover{ transform:translateY(-2px); box-shadow:0 8px 30px rgba(46,201,211,0.4); color:#fff; }
.hlx-lf-submit i{ transition:transform 0.3s ease; font-size:0.85rem; }
.hlx-lf-submit:hover i{ transform:translateX(4px); }

.hlx-lf-remember{ margin-top:16px; text-align:center; }
.hlx-lf-check{
    display:inline-flex !important; align-items:center !important; gap:8px !important;
    font-size:0.84rem !important; color:var(--hlx-text-muted) !important; cursor:pointer !important;
    font-weight:400 !important; text-transform:none !important; letter-spacing:0 !important;
}
.hlx-lf-check input[type="checkbox"]{ accent-color:var(--hlx-teal); width:16px; height:16px; }

.hlx-lf-divider{ display:flex; align-items:center; gap:16px; margin:28px 0; }
.hlx-lf-divider::before, .hlx-lf-divider::after{ content:''; flex:1; height:1px; background:var(--hlx-border); }
.hlx-lf-divider span{ font-size:0.78rem; color:var(--hlx-text-muted); font-weight:500; text-transform:uppercase; letter-spacing:1px; }

.hlx-lf-register{ text-align:center; }
.hlx-lf-register p{ font-size:0.87rem; color:var(--hlx-text-muted); margin-bottom:12px; }
.hlx-lf-register-btn{
    display:inline-flex; align-items:center; gap:8px; padding:12px 28px;
    border:1.5px solid var(--hlx-border); border-radius:12px; color:var(--hlx-text) !important;
    font-size:0.9rem; font-weight:600; text-decoration:none !important; transition:var(--hlx-transition); font-family:var(--hlx-font);
}
.hlx-lf-register-btn:hover{ border-color:var(--hlx-teal); color:var(--hlx-teal-dark) !important; background:rgba(46,201,211,0.06); transform:translateY(-1px); }
.hlx-lf-register-btn i{ color:var(--hlx-teal-dark); font-size:0.82rem; }

.hlx-lf-captcha{ margin-bottom:16px; }
.hlx-lf-social{ margin-top:24px; text-align:center; }
.hlx-lf-trust{
    display:flex; align-items:center; justify-content:center; gap:8px;
    margin-top:32px; font-size:0.78rem; color:var(--hlx-text-muted); letter-spacing:.2px;
}
.hlx-lf-trust i{ color:var(--hlx-teal-dark); }

@media (max-width:991px){
    .hlx-login-split{ flex-direction:column; min-height:auto; margin:12px 0 24px; border-radius:var(--hlx-radius-lg); box-shadow:var(--hlx-shadow-lg); }
    .hlx-login-brand{ width:100%; padding:40px 30px; min-height:auto; }
    .hlx-login-brand-logo-img{ max-width:140px; }
    body.hlx-theme .hlx-login-brand-content h2{ font-size:1.5rem !important; }
    .hlx-login-features{ display:none; }
    .hlx-login-brand-footer{ display:none; }
    .hlx-login-form-side{ padding:40px 24px; }
}
@media (max-width:576px){
    .hlx-login-brand{ padding:32px 24px; }
    .hlx-login-brand-content p{ display:none; }
    .hlx-login-brand-divider{ display:none; }
    body.hlx-theme .hlx-login-brand-content h2{ margin-bottom:0 !important; }
    body.hlx-theme .hlx-login-form-header h1{ font-size:1.5rem !important; }
    .hlx-login-mobile-logo{ display:block; }
}

/* ============================================================
   PAINEL DO CLIENTE — clientarea.php (dashboard)
   ============================================================ */
.hlx-dash-hero{
    position:relative;
    background:linear-gradient(135deg, var(--hlx-navy) 0%, var(--hlx-navy-2) 60%, #1c3a44 100%);
    border-radius:var(--hlx-radius-lg);
    padding:32px 36px;
    margin-bottom:20px;
    overflow:hidden;
}
.hlx-dash-hero-glow{
    position:absolute; top:-40%; right:-8%; width:360px; height:360px; border-radius:50%;
    background:rgba(46,201,211,0.18); filter:blur(90px); pointer-events:none;
}
.hlx-dash-dotgrid{
    position:absolute; inset:0; pointer-events:none;
    background-image:
        linear-gradient(rgba(46,201,211,0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(46,201,211,0.07) 1px, transparent 1px);
    background-size:34px 34px;
    mask-image:radial-gradient(ellipse 70% 100% at 30% 50%, black 20%, transparent 75%);
    -webkit-mask-image:radial-gradient(ellipse 70% 100% at 30% 50%, black 20%, transparent 75%);
}
.hlx-dash-hero-grid{
    position:relative; z-index:1; display:grid; grid-template-columns:1.3fr 1fr; gap:36px; align-items:center;
}
body.hlx-theme .hlx-dash-hero h1{
    font-size:1.6rem !important; font-weight:800 !important; color:#ffffff !important;
    letter-spacing:-0.6px !important; margin:0 0 10px !important;
}
.hlx-dash-hero p{ color:rgba(255,255,255,0.6); font-size:0.92rem; margin:0; max-width:480px; }

/* ===== WIDGET DECORATIVO DO HERO (status da central) ===== */
.hlx-dash-widget{
    background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:var(--hlx-radius);
    padding:18px 20px; backdrop-filter:blur(6px);
}
.hlx-dash-widget-head{
    display:flex; align-items:center; justify-content:space-between;
    padding-bottom:12px; margin-bottom:12px; border-bottom:1px solid rgba(255,255,255,0.1);
    font-size:0.8rem; font-weight:700; color:#fff; letter-spacing:.2px;
}
.hlx-dash-widget-head i{ color:var(--hlx-teal); margin-right:6px; }
.hlx-dash-widget-live{ display:inline-flex; align-items:center; gap:5px; font-size:0.72rem; font-weight:600; color:rgba(255,255,255,0.5); text-transform:uppercase; letter-spacing:.5px; }
.hlx-dash-widget-dot{ width:6px; height:6px; border-radius:50%; background:var(--hlx-teal); box-shadow:0 0 0 0 rgba(46,201,211,0.5); animation:hlxPulse 2s infinite; }
.hlx-dash-widget-row{ display:flex; align-items:center; justify-content:space-between; padding:7px 0; font-size:0.85rem; color:rgba(255,255,255,0.55); }
.hlx-dash-widget-row + .hlx-dash-widget-row{ border-top:1px dashed rgba(255,255,255,0.08); }
.hlx-dash-widget-row strong{ color:#fff; font-weight:700; }
.hlx-widget-accent{ color:var(--hlx-teal) !important; }

@media (max-width:991px){
    .hlx-dash-hero-grid{ grid-template-columns:1fr; }
    .hlx-dash-widget{ display:none; }
}

/* ===== AÇÕES RÁPIDAS ===== */
.hlx-quick-actions{
    display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:20px;
}
.hlx-qa-item{
    display:flex; align-items:center; gap:10px;
    background:#fff; border:1px solid var(--hlx-border); border-radius:var(--hlx-radius);
    padding:13px 16px; font-size:0.85rem; font-weight:600; color:var(--hlx-text) !important;
    text-decoration:none !important; transition:var(--hlx-transition);
}
.hlx-qa-item i{ color:var(--hlx-teal-dark); font-size:1rem; width:18px; text-align:center; flex-shrink:0; }
.hlx-qa-item:hover{ border-color:var(--hlx-teal); background:rgba(46,201,211,0.05); transform:translateY(-2px); box-shadow:var(--hlx-shadow); }
.hlx-qa-item.hlx-qa-whatsapp{ background:rgba(37,211,102,0.08); border-color:rgba(37,211,102,0.25); }
.hlx-qa-item.hlx-qa-whatsapp i{ color:#25D366; }
.hlx-qa-item.hlx-qa-whatsapp:hover{ border-color:#25D366; background:rgba(37,211,102,0.14); }
@media (max-width:768px){ .hlx-quick-actions{ grid-template-columns:repeat(2,1fr); } }

.hlx-stat-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-bottom:28px;
}
.hlx-stat-card{
    display:flex; align-items:center; gap:14px;
    background:#fff; border:1px solid var(--hlx-border); border-radius:var(--hlx-radius);
    padding:16px 18px; text-decoration:none !important; transition:var(--hlx-transition);
    position:relative; overflow:hidden;
}
.hlx-stat-card:hover{ transform:translateY(-3px); box-shadow:var(--hlx-shadow-lg); border-color:transparent; }
.hlx-stat-icon{
    width:42px; height:42px; border-radius:12px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center; font-size:1.05rem;
}
.hlx-stat-teal .hlx-stat-icon{ background:rgba(46,201,211,0.14); color:var(--hlx-teal-dark); }
.hlx-stat-green .hlx-stat-icon{ background:rgba(53,189,109,0.14); color:#289a56; }
.hlx-stat-amber .hlx-stat-icon{ background:rgba(255,186,30,0.16); color:#b9770e; }
.hlx-stat-navy .hlx-stat-icon{ background:rgba(16,24,40,0.08); color:var(--hlx-navy); }
.hlx-stat-info{ min-width:0; }
body.hlx-theme .hlx-stat-num{ font-size:1.3rem !important; font-weight:800 !important; color:var(--hlx-text) !important; line-height:1.1; }
.hlx-stat-label{ font-size:0.78rem; color:var(--hlx-text-muted); font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hlx-stat-arrow{ position:absolute; right:18px; top:50%; transform:translateY(-50%); color:var(--hlx-border); font-size:0.8rem; transition:var(--hlx-transition); }
.hlx-stat-card:hover .hlx-stat-arrow{ color:var(--hlx-teal); right:14px; }

.hlx-kb-search-form{ margin-bottom:28px; }
.hlx-kb-search{
    position:relative; display:flex; align-items:center;
    background:#fff; border:1.5px solid var(--hlx-border); border-radius:50px;
    padding:6px 6px 6px 24px; box-shadow:var(--hlx-shadow); transition:var(--hlx-transition);
}
.hlx-kb-search:focus-within{ border-color:var(--hlx-teal); box-shadow:0 0 0 4px rgba(46,201,211,0.12); }
.hlx-kb-search > i.fa-search{ color:var(--hlx-text-muted); font-size:0.95rem; margin-right:14px; }
.hlx-kb-search .form-control{
    border:none !important; box-shadow:none !important; background:transparent !important;
    font-family:var(--hlx-font) !important; font-size:0.98rem !important; padding:12px 0 !important; height:auto !important;
}
.hlx-kb-search-btn{
    flex-shrink:0; width:42px; height:42px; border-radius:50%; border:none; cursor:pointer;
    background:linear-gradient(135deg, var(--hlx-teal), var(--hlx-teal-dark)); color:#fff;
    display:flex; align-items:center; justify-content:center; transition:var(--hlx-transition);
}
.hlx-kb-search-btn:hover{ transform:scale(1.06); }

/* Painéis dinâmicos (addons/hooks) */
.hlx-panels .panel{ margin-bottom:20px; border-top:none !important; box-shadow:var(--hlx-shadow); }
.hlx-panels .panel-accent-blue::before,
.hlx-panels .panel-accent-green::before,
.hlx-panels .panel-accent-red::before,
.hlx-panels .panel-accent-gold::before,
.hlx-panels .panel-accent-aqua::before{ content:''; display:block; height:3px; }
.hlx-panels .panel-accent-blue{ border-top:3px solid var(--hlx-teal); }
.hlx-panels .panel-accent-green{ border-top:3px solid #35bd6d; }
.hlx-panels .panel-accent-red{ border-top:3px solid #e05b5b; }
.hlx-panels .panel-accent-gold{ border-top:3px solid var(--hlx-gold); }
.hlx-panels .panel-accent-aqua{ border-top:3px solid var(--hlx-teal); }
.hlx-panels .panel-title{ font-size:0.95rem; display:flex; align-items:center; gap:10px; }
.hlx-panels .panel-title > i:first-child{
    width:30px; height:30px; border-radius:9px; flex-shrink:0;
    display:inline-flex; align-items:center; justify-content:center;
    background:rgba(46,201,211,0.12); color:var(--hlx-teal-dark); font-size:0.85rem;
}
.hlx-panels .panel-accent-green .panel-title > i:first-child{ background:rgba(53,189,109,0.12); color:#289a56; }
.hlx-panels .panel-accent-red .panel-title > i:first-child{ background:rgba(224,91,91,0.12); color:#c0392b; }
.hlx-panels .panel-accent-gold .panel-title > i:first-child{ background:rgba(212,175,122,0.16); color:#a4793f; }
.hlx-panels .list-group-item{
    font-size:0.85rem; padding:11px 16px; border-color:var(--hlx-border) !important;
    overflow-wrap:break-word; word-break:break-word;
}
.hlx-panels .list-group-item > i:first-child{ color:var(--hlx-teal-dark); width:16px; display:inline-block; text-align:center; margin-right:6px; }
.hlx-panels .list-group-item:hover{ background:rgba(46,201,211,0.04); }
.hlx-panels .list-group-item.active{ background:rgba(46,201,211,0.1) !important; color:var(--hlx-teal-dark) !important; border-color:transparent !important; }

@media (max-width:991px){
    .hlx-stat-grid{ grid-template-columns:repeat(2,1fr); }
    .hlx-quick-actions{ grid-template-columns:repeat(2,1fr); }
    .hlx-dash-hero{ padding:28px 24px; }
    body.hlx-theme .hlx-dash-hero h1{ font-size:1.4rem !important; }
}
@media (max-width:576px){
    .hlx-stat-grid{ grid-template-columns:1fr; }
    .hlx-stat-card{ padding:18px; }
    .hlx-quick-actions{ grid-template-columns:1fr; }
}

/* ============================================================
   FATURA (viewinvoice.php) — página standalone, não usa header/footer
   do site, mas agora carrega custom.css + fica com body.hlx-theme.
   ============================================================ */
body.hlx-theme{ background:var(--hlx-bg-alt); }
body.hlx-theme .invoice-container{
    position:relative; overflow:hidden;
    background:#fff; border:none; border-radius:var(--hlx-radius-lg);
    box-shadow:var(--hlx-shadow-lg); padding:52px 56px 40px;
}
body.hlx-theme .invoice-container::before{
    content:''; position:absolute; top:0; left:0; right:0; height:6px; z-index:2;
    background:linear-gradient(90deg, var(--hlx-navy) 0%, var(--hlx-teal) 55%, var(--hlx-teal-dark) 100%);
}
/* Marca d'água sutil da logomarca, centralizada atrás de todo o conteúdo —
   fica visível nos espaços entre os cartões/tabelas (como um papel timbrado). */
body.hlx-theme .invoice-container::after{
    content:''; position:absolute; z-index:-1; pointer-events:none;
    top:50%; left:50%; width:640px; height:640px; transform:translate(-50%,-50%) rotate(-10deg);
    background-image:url('https://hostlax.com.br/assets/logo-hostlax.png');
    background-repeat:no-repeat; background-position:center; background-size:contain;
    opacity:.07;
}
@media (max-width:767px){
    body.hlx-theme .invoice-container{ padding:36px 28px 28px; }
    body.hlx-theme .invoice-container::after{ width:260px; height:260px; }
}

body.hlx-theme .invoice-header{ position:relative; z-index:1; padding-bottom:26px; margin-bottom:12px; border-bottom:2px solid var(--hlx-bg-alt); }
body.hlx-theme .invoice-header img{ max-height:60px; width:auto; max-width:230px; object-fit:contain; }
body.hlx-theme .invoice-header h2{ font-size:1.4rem !important; font-weight:800 !important; color:var(--hlx-text) !important; margin:0; }
body.hlx-theme .invoice-header h3{
    font-size:0.8rem !important; font-weight:700 !important; color:var(--hlx-teal-dark) !important;
    margin:14px 0 0; text-transform:uppercase; letter-spacing:.6px;
}

/* Ícones nos rótulos (Pagar para, Faturado para, Forma de Pagamento, Data de Criação, etc.) */
body.hlx-theme .invoice-container strong i,
body.hlx-theme .invoice-container .panel-title i,
body.hlx-theme .transactions-title i{
    color:var(--hlx-teal-dark); margin-right:6px; font-size:0.85em;
}
body.hlx-theme .transactions-title{
    font-size:0.95rem !important; font-weight:700 !important; color:var(--hlx-text) !important;
    margin:0 0 12px; position:relative; z-index:1;
}

/* Selo de status — pílula colorida em vez de texto simples */
body.hlx-theme .invoice-status{
    margin:0; font-size:0.82rem !important; font-weight:700 !important; text-transform:uppercase; letter-spacing:.5px;
}
body.hlx-theme .invoice-status span{
    display:inline-flex; align-items:center; gap:6px; padding:.5em 1.2em; border-radius:50px;
    box-shadow:0 1px 2px rgba(16,24,40,0.06);
}
body.hlx-theme .invoice-status span::before{ content:''; width:7px; height:7px; border-radius:50%; background:currentColor; }
body.hlx-theme .invoice-status .paid{ background:rgba(53,189,109,0.12); color:#289a56 !important; }
body.hlx-theme .invoice-status .unpaid{ background:rgba(224,91,91,0.12); color:#c0392b !important; }
body.hlx-theme .invoice-status .draft,
body.hlx-theme .invoice-status .cancelled{ background:rgba(16,24,40,0.07); color:var(--hlx-text-muted) !important; }
body.hlx-theme .invoice-status .refunded{ background:rgba(46,201,211,0.12); color:var(--hlx-teal-dark) !important; }
body.hlx-theme .invoice-status .collections{ background:rgba(255,186,30,0.16); color:#b9770e !important; }
body.hlx-theme .invoice-container .small-text{ color:var(--hlx-text-muted); font-size:0.85rem !important; }
body.hlx-theme .invoice-container address{ font-style:normal; line-height:1.7; }
body.hlx-theme .invoice-container strong{ color:var(--hlx-text); font-weight:700; }
body.hlx-theme .invoice-container hr{ border-color:var(--hlx-border); margin:8px 0 24px; }

/* Blocos de "Pagar para" / "Faturado para" / forma de pagamento — cartões, não texto solto */
body.hlx-theme .invoice-container .row:not(.invoice-header){ margin:0 0 18px; }
body.hlx-theme .invoice-container .row:not(.invoice-header) .invoice-col{
    background:var(--hlx-bg-alt); border-radius:var(--hlx-radius); padding:16px 20px; margin-bottom:0;
}
body.hlx-theme .invoice-container .row:not(.invoice-header) .invoice-col.right{ margin-right:0; }
@media (min-width:500px){
    body.hlx-theme .invoice-container .row:not(.invoice-header) .invoice-col{ width:calc(50% - 8px); }
    body.hlx-theme .invoice-container .row:not(.invoice-header) .invoice-col.right{ margin-left:16px; }
}
body.hlx-theme .invoice-container .row:not(.invoice-header) strong{
    display:block; font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.5px;
    color:var(--hlx-teal-dark); margin-bottom:8px;
}

body.hlx-theme .invoice-container .payment-btn-container{ margin-top:14px; }

/* Painel "Itens da Fatura" */
body.hlx-theme .invoice-container .panel{ border:1px solid var(--hlx-border); }
body.hlx-theme .invoice-container .panel-title{ display:block !important; }

/* Tabela de itens / transações — com listras (zebra) para leitura mais fácil */
body.hlx-theme .invoice-container .table{ font-size:0.9rem; }
body.hlx-theme .invoice-container .table > thead > tr > td{
    background:var(--hlx-navy); color:#fff; border-bottom:none !important; padding:11px 14px;
    font-size:0.76rem; text-transform:uppercase; letter-spacing:.4px;
}
body.hlx-theme .invoice-container .table > thead > tr > td strong{ color:#fff; }
body.hlx-theme .invoice-container .table > tbody > tr:not(.total-row):nth-child(odd) > td{ background:var(--hlx-bg-alt); }
body.hlx-theme .invoice-container td.total-row{ background:#fff !important; font-size:0.9rem; border-top:1px solid var(--hlx-border); }
body.hlx-theme .invoice-container tbody tr:last-child td.total-row{
    background:var(--hlx-navy) !important; color:#fff !important; font-size:1.05rem !important; padding-top:14px; padding-bottom:14px;
}
body.hlx-theme .invoice-container tbody tr:last-child td.total-row strong{ color:#fff !important; font-size:0.85rem; text-transform:uppercase; letter-spacing:.4px; }

body.hlx-theme .transactions-container{ margin-top:28px; }
body.hlx-theme .transactions-container .table > thead > tr > td{
    background:var(--hlx-bg-alt) !important; color:var(--hlx-text-muted) !important; border-bottom:2px solid var(--hlx-border) !important;
}
body.hlx-theme .transactions-container .table > thead > tr > td strong{ color:var(--hlx-text-muted); }

/* Rodapé de agradecimento */
body.hlx-theme .invoice-footer-note{
    clear:both; margin-top:48px; padding-top:20px; border-top:1px solid var(--hlx-border); text-align:center;
}
body.hlx-theme .invoice-footer-note p{ margin:0 0 4px; }
body.hlx-theme .invoice-footer-note strong{ color:var(--hlx-text); font-size:0.95rem; }

@media print{
    body.hlx-theme{ background:#fff; }
    body.hlx-theme .invoice-container{ box-shadow:none; padding:24px 0 0; }
    body.hlx-theme .invoice-container::before{ display:none; }
    body.hlx-theme .invoice-container .row:not(.invoice-header) .invoice-col{ background:transparent !important; }
    body.hlx-theme .invoice-container .table > thead > tr > td{ background:#eee !important; color:#000 !important; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
    body.hlx-theme .invoice-container tbody tr:last-child td.total-row{ background:#111 !important; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}