/* ComercialHost 2026 — refinamentos v3, aditivo e reversível.
   Páginas reais auditadas em 26/10/2026. Não substitui CSS do WHMCS. */

:root {--ch3-deep:#10192d;--ch3-navy:#15213a;--ch3-panel:#1a2944;--ch3-line:#2d4260;--ch3-white:#f0f6ff;--ch3-muted:#b7c7e2;--ch3-blue:#2563eb;--ch3-green:#16a34a;--ch3-orange:#f97316}

/* 1. SEGURANÇA VISUAL: todas as respostas antigas dos tickets, inclusive cliente/equipe */
#main-body:has(.ticket-reply) .ticket-reply.markdown-content {
 background:var(--ch3-navy)!important;color:var(--ch3-white)!important;
 border:1px solid var(--ch3-line)!important;border-radius:6px!important;
 box-shadow:none!important;overflow-wrap:anywhere!important;
 margin-bottom:12px!important;
}
#main-body:has(.ticket-reply) .ticket-reply .user {
 background:#203451!important;color:var(--ch3-white)!important;
 border:0!important;border-bottom:1px solid var(--ch3-line)!important;
}
#main-body:has(.ticket-reply) .ticket-reply .user :is(.name,.type,i) {color:#ecf3ff!important}
#main-body:has(.ticket-reply) .ticket-reply .date {color:var(--ch3-muted)!important;font-size:12px!important}
#main-body:has(.ticket-reply) .ticket-reply .message,
#main-body:has(.ticket-reply) .ticket-reply .message :is(p,div,span,li,ul,ol,strong,em,small,blockquote,pre,code) {
 color:var(--ch3-white)!important;background-color:transparent!important;
}
#main-body:has(.ticket-reply) .ticket-reply .message {line-height:1.65!important;font-size:14px!important}
#main-body:has(.ticket-reply) .ticket-reply .message a,
#main-body:has(.ticket-reply) .ticket-reply .message a :is(span,strong) {
 color:#85bbff!important;text-decoration:underline!important;overflow-wrap:anywhere!important;
}
#main-body:has(.ticket-reply) .ticket-reply .message hr {border:0!important;border-top:1px solid var(--ch3-line)!important}
#main-body:has(.ticket-reply) .ticket-reply .message :is(table,td,th) {
 color:var(--ch3-white)!important;background:#192a47!important;border-color:var(--ch3-line)!important
}
#main-body:has(.ticket-reply) .ticket-reply .message .rating,
#main-body:has(.ticket-reply) .ticket-reply .message .rating * {background:transparent!important}
#main-body:has(.ticket-reply) .ticket-reply img{max-width:100%!important;height:auto!important}
#main-body:has(.ticket-reply) .ticket-reply :is(.ticket-attachments,.attachment) {
 background:#1c304e!important;color:var(--ch3-white)!important;
 border-color:var(--ch3-line)!important
}
#main-body:has(.ticket-reply) .ticket-reply .message :is(input,textarea,select){color:#15213a!important}

/* 2. DIVISÓRIAS: some com as linhas brancas, não com bordas de acessibilidade */
nav#nav.navbar-main .navbar-nav>li.dropdown:not(#Primary_Navbar-Account) .dropdown-menu>li.nav-divider {
 display:none!important;height:0!important;overflow:hidden!important;
}
nav#nav.navbar-main .navbar-nav>li.dropdown:not(#Primary_Navbar-Account) .dropdown-menu>li+li,
nav#nav.navbar-main .navbar-nav>li.dropdown:not(#Primary_Navbar-Account) .dropdown-menu>li>a {
 border-top:none!important;border-bottom:none!important;box-shadow:none!important;
}
#main-body .header-lined{border-bottom:0!important;box-shadow:none!important}
#main-body .header-lined>h1,#main-body .header-lined h1 {
 border-bottom:0!important;box-shadow:none!important
}
#main-body .header-lined .breadcrumb {border:1px solid var(--ch3-line)!important;box-shadow:none!important}
#main-body :is(#tableInvoicesList_wrapper,#tableTicketsList_wrapper,#tableDomainsList_wrapper,#tableServicesList_wrapper,#tableQuotesList_wrapper,#tableEmailsList_wrapper) .listtable>.dataTables_info,
#main-body :is(#tableInvoicesList_wrapper,#tableTicketsList_wrapper,#tableDomainsList_wrapper,#tableServicesList_wrapper,#tableQuotesList_wrapper,#tableEmailsList_wrapper) .listtable>.dataTables_filter {
 border:0!important;box-shadow:none!important;outline:0!important
}
#main-body :is(#tableInvoicesList_wrapper,#tableTicketsList_wrapper,#tableDomainsList_wrapper,#tableServicesList_wrapper,#tableQuotesList_wrapper,#tableEmailsList_wrapper) .listtable>table{
 border-top:1px solid var(--ch3-line)!important
}
#main-body .client-home-panels .panel .panel-heading,
#main-body .client-home-panels .panel .panel-footer {
 border:0!important;box-shadow:none!important
}
#main-body .client-home-panels .panel .panel-heading{border-bottom:1px solid #263955!important}
#main-body .client-home-panels .panel .list-group-item {border:0!important;box-shadow:none!important}
#main-body .client-home-panels .panel .panel-footer:empty {display:none!important}

/* 3. DASHBOARD — cards sem cantos brancos, números centrados e ícones discretos */
#main-body:has(.client-home-panels) .tiles>.row>.tile {
 background:#1e4e98!important;border-radius:7px!important;overflow:hidden!important;
 border:1px solid #3265a5!important;box-shadow:none!important;
}
#main-body:has(.client-home-panels) .tiles>.row>.tile::before,
#main-body:has(.client-home-panels) .tiles>.row>.tile::after,
#main-body:has(.client-home-panels) .tiles>.row>.tile>a::before,
#main-body:has(.client-home-panels) .tiles>.row>.tile>a::after {
 display:none!important;content:none!important
}
#main-body:has(.client-home-panels) .tiles>.row>.tile>a {
 background:#1e4e98!important;border:0!important;border-radius:0!important;
 box-shadow:none!important;outline-offset:2px!important;
 min-height:126px!important;padding:17px 12px!important;
 text-align:center!important;display:flex!important;flex-direction:column!important;
 align-items:center!important;justify-content:center!important;gap:4px!important;
}
#main-body:has(.client-home-panels) .tiles>.row>.tile>a:hover {background:#2860af!important}
#main-body:has(.client-home-panels) .tiles>.row>.tile .stat {
 color:white!important;font-size:32px!important;line-height:1!important;font-weight:500!important;
 letter-spacing:-.03em!important;text-align:center!important;
}
#main-body:has(.client-home-panels) .tiles>.row>.tile .title {
 color:#f1f6ff!important;font-size:13px!important;text-align:center!important;
 margin:3px 0 0!important;line-height:1.3!important;font-weight:600!important;
}
#main-body:has(.client-home-panels) .tiles>.row>.tile .icon {
 position:static!important;order:-1!important;
 display:flex!important;align-items:center!important;justify-content:center!important;
 width:28px!important;height:28px!important;margin:0 0 2px!important;
 color:#bcd8ff!important;
}
#main-body:has(.client-home-panels) .tiles>.row>.tile .icon svg {
 width:25px!important;height:25px!important;stroke:#d1e5ff!important;
 fill:none!important;stroke-width:1.8!important;
}
#main-body:has(.client-home-panels) .tiles>.row>.tile .icon>i:has(+svg){display:none!important}
#main-body .client-home-panels .panel[menuitemname="Recent Support Tickets"] .list-group{
 width:100%!important;max-width:100%!important;
 border:0!important;box-shadow:none!important
}
#main-body .client-home-panels .panel[menuitemname="Recent Support Tickets"] .list-group-item{
 width:100%!important;max-width:none!important;border:0!important;
 margin:0!important;padding:11px 13px!important;box-sizing:border-box!important;
}
#main-body .client-home-panels .panel[menuitemname="Recent Support Tickets"] .list-group-item label.label{
 margin-left:8px!important;vertical-align:middle!important;
 white-space:nowrap!important;display:inline-block!important
}
#main-body .client-home-panels .panel[menuitemname="Recent Support Tickets"] .list-group-item:has(label[style*="#779500"]){
 color:#4ade80!important
}
#main-body .client-home-panels .panel[menuitemname="Recent Support Tickets"] .list-group-item small{
 color:#b6c6df!important
}
#main-body .client-home-panels .panel[menuitemname="Active Products/Services"] .list-group {
 border:0!important;
}
#main-body .client-home-panels .panel[menuitemname="Active Products/Services"] .list-group-item {
 border:0!important
}

/* 4. ORÇAMENTOS E E-MAILS — mesmos componentes auditados de tickets e serviços */
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper){
 background:var(--ch3-navy)!important;color:var(--ch3-white)!important;
 border:1px solid var(--ch3-line)!important;border-radius:6px!important;
 overflow:hidden!important;box-shadow:none!important;font-size:14px!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .listtable{
 display:grid!important;grid-template-columns:minmax(0,1fr) minmax(195px,270px)!important;
 grid-template-rows:55px auto!important;padding:0!important;margin:0!important;
 background:var(--ch3-panel)!important;
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .dataTables_info{
 grid-row:1!important;grid-column:1!important;
 float:none!important;position:static!important;
 display:flex!important;align-items:center!important;
 background:var(--ch3-panel)!important;color:#d8e7fb!important;
 padding:13px 15px!important;margin:0!important;width:100%!important;height:100%!important;
 font-size:13.5px!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .dataTables_filter{
 grid-row:1!important;grid-column:2!important;
 float:none!important;position:static!important;
 display:flex!important;align-items:center!important;
 background:var(--ch3-panel)!important;padding:7px 13px 7px 0!important;
 margin:0!important;width:100%!important;height:100%!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .dataTables_filter label{width:100%!important;margin:0!important;max-width:none!important}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .dataTables_filter input[type=search] {
 width:100%!important;min-width:0!important;max-width:none!important;
 height:38px!important;padding:8px 11px!important;
 background:#101a2e!important;border:1px solid #354d70!important;
 border-radius:6px!important;color:#edf4ff!important;
 box-shadow:none!important;font-size:13px!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .dataTables_filter input::placeholder{
 color:#b5c8df!important;opacity:1!important;font-size:12px!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .listtable>table {
 grid-row:2!important;grid-column:1/-1!important;width:100%!important;
 margin:0!important;background:var(--ch3-navy)!important;
 border:0!important;border-top:1px solid var(--ch3-line)!important;
}
#main-body :is(#tableQuotesList,#tableEmailsList) :is(thead,thead tr,thead th){
 background:#101a2e!important;color:#f0f6ff!important;
 border-color:var(--ch3-line)!important;box-shadow:none!important;
 font-size:13.5px!important;font-weight:700!important
}
#main-body :is(#tableQuotesList,#tableEmailsList) tbody tr,
#main-body :is(#tableQuotesList,#tableEmailsList) tbody td {
 background:#15213a!important;color:#edf4ff!important;
 border-color:var(--ch3-line)!important;
 padding:12px 13px!important;font-size:13.5px!important;
 line-height:1.5!important;vertical-align:middle!important
}
#main-body :is(#tableQuotesList,#tableEmailsList) tbody tr:nth-child(even) td {background:#1b2a44!important}
#main-body :is(#tableQuotesList,#tableEmailsList) tbody tr:hover td {background:#263d5c!important}
#main-body :is(#tableQuotesList,#tableEmailsList) tbody td.dataTables_empty {color:#c3d2e8!important;text-align:center!important;padding:25px!important}
#main-body #tableEmailsList th:first-child,#main-body #tableEmailsList td:first-child{width:22%!important;white-space:nowrap!important}
#main-body #tableEmailsList th:nth-child(2),#main-body #tableEmailsList td:nth-child(2) {
 width:auto!important;text-align:left!important;overflow-wrap:anywhere!important
}
#main-body #tableEmailsList th:last-child,#main-body #tableEmailsList td:last-child{
 width:155px!important;text-align:right!important;white-space:nowrap!important
}
#main-body #tableEmailsList td:last-child input.btn {
 background:#2563eb!important;color:white!important;
 border:1px solid #2563eb!important;border-radius:5px!important;
 padding:8px 11px!important;font-size:12px!important;box-shadow:none!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) :is(.dataTables_info,.dataTables_length,.dataTables_paginate) {
 color:#c1d0e7!important;font-size:13px!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .pagination>li>a,
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .pagination>li>span{
 color:#ecf3fe!important;background:#1b2c48!important;
 border:1px solid var(--ch3-line)!important;border-radius:5px!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .pagination>.active>a {
 background:#2563eb!important;color:white!important;border-color:#2563eb!important
}
#main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .dataTables_length select{
 background:#142139!important;color:#edf4ff!important;border-color:var(--ch3-line)!important;
 border-radius:5px!important
}

/* 5. PAGAMENTO EM MASSA — escopo EXCLUSIVO, mantém valores e envio intactos */
#main-body:has(form[action*="masspay"]) .header-lined>h1 {
 display:block!important;line-height:1.16!important;
 white-space:normal!important;overflow-wrap:anywhere!important;
}
#main-body:has(form[action*="masspay"]) .header-lined h1 small {
 display:block!important;font-size:16px!important;font-weight:400!important;
 line-height:1.5!important;margin-top:10px!important;
 color:var(--ch3-muted)!important;max-width:100%!important;
 white-space:normal!important;overflow-wrap:break-word!important;
}
#main-body form[action*="masspay"]>table.table{
 width:100%!important;background:var(--ch3-navy)!important;
 border:1px solid var(--ch3-line)!important;border-radius:6px!important;
 overflow:hidden!important;border-collapse:separate!important;border-spacing:0!important;
 box-shadow:none!important
}
#main-body form[action*="masspay"]>table.table thead th{
 background:#1b2a44!important;color:white!important;
 padding:13px 15px!important;border:0!important;font-size:14px!important
}
#main-body form[action*="masspay"]>table.table tbody tr,
#main-body form[action*="masspay"]>table.table tbody td {
 background:#15213a!important;color:#edf4ff!important;
 border:0!important;border-top:1px solid #263953!important;
 font-size:13.5px!important;line-height:1.5!important;
 padding:10px 14px!important;vertical-align:middle!important
}
#main-body form[action*="masspay"]>table.table tbody tr:nth-child(even) td{background:#1a2942!important}
#main-body form[action*="masspay"]>table.table tbody td.bg-info {
 background:#223858!important;color:#e7f2ff!important;
 font-weight:700!important;padding:13px 15px!important
}
#main-body form[action*="masspay"]>table.table tbody td.bg-info strong{color:white!important}
#main-body form[action*="masspay"]>table.table tbody tr.masspay-total td {
 background:#21385b!important;color:white!important;
 font-weight:700!important;font-size:14px!important
}
#main-body form[action*="masspay"]>table.table th:last-child,
#main-body form[action*="masspay"]>table.table td:last-child:not([colspan]){
 text-align:right!important;white-space:nowrap!important
}
#main-body form[action*="masspay"] .panel {
 background:#15213a!important;color:var(--ch3-white)!important;
 border:1px solid var(--ch3-line)!important;border-radius:6px!important;
 box-shadow:none!important
}
#main-body form[action*="masspay"] .panel-heading{
 background:#1b2a44!important;color:var(--ch3-white)!important;
 border-bottom:0!important
}
#main-body form[action*="masspay"] .panel :is(label,.panel-title){
 color:#edf4ff!important;font-weight:600!important
}
#main-body form[action*="masspay"] select#paymentmethod {
 background:#101a2e!important;border-color:var(--ch3-line)!important;
 border-radius:6px!important;color:var(--ch3-white)!important;box-shadow:none!important
}
#main-body form[action*="masspay"] input[type=submit] {
 background:#2563eb!important;border:1px solid #2563eb!important;
 border-radius:6px!important;color:white!important;min-height:44px!important;
 font-weight:650!important;box-shadow:none!important
}

/* 6. ABRIR TICKET: links limpos, ícone laranja e texto branco;
   o seletor só encontra a tela de seleção de departamentos. */
#main-body:has(a[href*="submitticket.php?step=2"]) .main-content>.row>.col-sm-10 .row>.col-md-6.margin-bottom {
 padding:3px 9px!important
}
#main-body:has(a[href*="submitticket.php?step=2"]) .main-content a[href*="submitticket.php?step=2"]{
 display:flex!important;gap:10px!important;align-items:center!important;
 padding:12px 14px!important;min-height:52px!important;
 background:#17243b!important;color:#eff5ff!important;
 border:1px solid #30415d!important;border-radius:6px!important;
 font-size:14px!important;line-height:1.45!important;font-weight:600!important;
 text-decoration:none!important;transition:background-color .16s ease!important;
}
#main-body:has(a[href*="submitticket.php?step=2"]) .main-content a[href*="submitticket.php?step=2"]:hover,
#main-body:has(a[href*="submitticket.php?step=2"]) .main-content a[href*="submitticket.php?step=2"]:focus{
 background:#203550!important;color:white!important;border-color:#49617e!important
}
#main-body:has(a[href*="submitticket.php?step=2"]) .main-content a[href*="submitticket.php?step=2"] i{
 flex:0 0 auto!important;color:#f97316!important;font-size:16px!important
}

/* 7. Links e divisórias de status recentes: sem barra branca nem rodapé ocioso */
#main-body .client-home-panels .panel[menuitemname="Recent Support Tickets"] .panel-heading,
#main-body .client-home-panels .panel[menuitemname="Active Products/Services"] .panel-heading {
 border-bottom:0!important
}
#main-body .client-home-panels .panel[menuitemname="Recent Support Tickets"] .panel-footer,
#main-body .client-home-panels .panel[menuitemname="Active Products/Services"] .panel-footer{
 display:none!important
}

/* Telas pequenas: controles não ultrapassam largura; tabelas continuam com scroll */
@media(max-width:767px){
 #main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .listtable{
  grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto!important
 }
 #main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .dataTables_info{grid-column:1!important;grid-row:1!important}
 #main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .dataTables_filter{grid-column:1!important;grid-row:2!important;padding:0 12px 12px!important}
 #main-body :is(#tableQuotesList_wrapper,#tableEmailsList_wrapper) .listtable>table{grid-column:1!important;grid-row:3!important}
 #main-body form[action*="masspay"]>table.table tbody td{padding:9px 7px!important;font-size:12px!important}
 #main-body #tableEmailsList th:first-child,#main-body #tableEmailsList td:first-child{white-space:normal!important}
 #main-body:has(.client-home-panels) .tiles>.row>.tile>a{min-height:120px!important}
}