/* --- BRABO HOST - ULTIMATE INTEGRATION STYLE (TOTAL DARK FIX) --- */

/* 1. FUNDO GLOBAL E TEXTOS */
body,
.app-main,
.main-content,
.header-lined,
.bg-white,
.bg-light,
.primary-content {
    background-color: #0B0E13 !important;
    font-family: 'Inter', sans-serif !important;
    color: #ffffff !important;
}

h1,
h2,
h3,
h4,
h5,
.title,
.product-name,
#order-standard_cart label {
    color: #ffffff !important;
}

/* 2. CARDS E CONTEINERES (FIX DASHBOARD) */
#order-standard_cart .products .product,
#order-standard_cart .view-cart-items .item,
#order-standard_cart .order-summary,
#order-standard_cart .summary-container,
#order-standard_cart .view-cart-tabs,
#order-standard_cart .product-info,
.tiles .tile,
.card,
.product-item,
.product-details,
.panel,
.panel-default,
.white-box {
    background-color: #11141b !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 20px !important;
    color: #ffffff !important;
    padding: 20px !important;
    margin-bottom: 15px !important;
}

#order-standard_cart .products .product header span {
    margin: 0;
    color: #fff !important;
    font-size: 1.2em;
}

#order-standard_cart .order-summary {
    margin-top: 1rem !important;
}

.panel-heading,
.client-home-cards .card-header {
    background-color: rgba(255, 255, 255, 0.03) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
    font-weight: 700;
}

div.product-details div.product-icon {
    margin: 0;
    background: #0B0E13 !important;
    border-radius: 10px;
    padding: 30px;
    line-height: 1em;
    font-size: 60px;
}

.product-status {
    padding: 0;
    border-radius: 12px !important;
}

.fa-inverse {
    color: #ec5c0e;
}

/* 3. BOTÕES BRABO (GRADIENTE E TICKET) */
.btn-success,
.btn-primary,
#btnCompleteOrder,
.btn-checkout,
.btn-register,
.btn-sm.btn-default-white,
.validate-button,
.btn-update,
#btnGoToPanel {
    background: linear-gradient(90deg, #f97316 0%, #ea580c 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    padding: 12px 25px !important;
    color: #fff !important;
    transition: transform 0.2s ease;
}

.btn-danger {
    background: #ef4444 !important;
    border: none !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    color: #fff !important;
}

.btn:hover {
    transform: scale(1.02);
}

/* Container Principal da Sidebar */
.list-group {
    background: #11141b !important;
    border-radius: 15px !important;
    padding: 8px !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    margin-top: 1rem !important;
}

/* Estilo Base dos Itens */
.list-group-item {
    background: transparent !important;
    border: none !important;
    color: #94a3b8 !important;
    /* padding: 12px 18px !important; */
    /* Mais respiro interno */
    margin-bottom: 4px !important;
    /* Espaçamento entre os botões */
    border-radius: 10px !important;
    transition: all 0.2s ease-in-out !important;
    font-size: 0.9em !important;
    font-weight: 500 !important;
}

/* HOVER: Efeito de destaque suave ao passar o mouse */
.list-group-item:hover {
    background-color: rgba(255, 255, 255, 0.03) !important;
    color: #ffffff !important;
    padding-left: 22px !important;
    /* Efeito de leve deslocamento */
}

/* ACTIVE: O item que está selecionado (laranja Brabo) */
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    background: rgba(255, 102, 0, 0.1) !important;
    color: #ff6600 !important;
    font-weight: 700 !important;
    border-left: 4px solid #ff6600 !important;
}

/* Ajuste de ícones dentro da sidebar */
.list-group-item i {
    margin-right: 10px !important;
    width: 20px;
    text-align: center;
}

/* Títulos dos Painéis Laterais */
.panel-title {
    color: #ff6600 !important;
    text-transform: uppercase;
    font-size: 0.75em !important;
    letter-spacing: 1px;
    font-weight: 800 !important;
    margin-bottom: 10px !important;
}

/* 5. INPUTS E FORMULÁRIOS */
input,
select,
.promo-input {
    background-color: #0B0E13 !important;
    border: 1px solid #1f2937 !important;
    border-radius: 12px !important;
    color: #fff !important;
}

.input-group>.form-control {
    background-color: #0B0E13 !important;
    border: 0.1rem solid #1f2937 !important;
    border-radius: 0px !important;
    color: #fff !important;
}

.input-group {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center !important;
    width: 100%;
    border: 0.1rem solid transparent !important;
    border-radius: 2px !important;
}

select.form-control option {
    background-color: #0B0E13 !important;
    color: #ffffff !important;
}

/* 6. TABELAS */
.table-list>tbody>tr>td,
.table>tbody>tr>td,
.table>thead>tr>th,
.table-striped>tbody>tr:nth-of-type(odd)>td,
.table-striped>tbody>tr:nth-of-type(even)>td {
    background-color: #11141b !important;
    color: #cbd5e1 !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

.table thead th,
.table-list thead th {
    background-color: #1c212b !important;
    color: #ff6600 !important;
    border-bottom: 2px solid #ff6600 !important;
    text-transform: uppercase;
    font-size: 0.85em;
    padding: 15px !important;
}

/* 7. CABEÇALHOS DE PRODUTOS */
.product-header,
.product-item header,
.plan-header,
#order-standard_cart .products .product header,
.product-info .header,
.product-info header {
    background-color: #1c212b !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
    border-radius: 18px 18px 0 0 !important;
    margin: -20px -20px 15px -20px !important;
    padding: 15px !important;
}

#order-standard_cart .view-cart-tabs {
    margin: 0 0 20px 0;
    margin-top: 1rem !important;
}

#order-standard_cart .secondary-cart-body {
    float: left;
    width: 65%;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    margin-top: 1rem !important;
}

/* 8. MODAIS E CUPOM */
.bootbox.modal .modal-content,
.promo-input-container {
    background-color: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 5px;
    color: #ffffff !important;
}

.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #ffffff !important;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}

.input-group-text {
    display: flex;
    align-items: center;
    padding: .375rem .75rem;
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #eb5a0d;
    text-align: center;
    white-space: nowrap;
    background-color: transparent !important;
    border: 1px #1f2937 !important;
    border-radius: .25rem;
}

.dataTables_wrapper table.table-list {
    margin: 10px 0 !important;
    width: 100% !important;
    border-radius: 4px;
    border: 1px solid transparent !important;
}

.tiles {
    margin-bottom: 0px !important;
}

/* 8. MODAIS E CUPOM */
.modal-content {
    background-color: #11141b !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}

#order-standard_cart .view-cart-tabs .nav-tabs a[aria-expanded=true],
#order-standard_cart .view-cart-tabs .nav-tabs a[aria-selected=true] {
    border-color: #dee2e6 #dee2e6 #f8f8f8;
    background-color: transparent !important;
}

#order-standard_cart .view-cart-tabs .tab-content {
    background-color: #11141b !important;
    padding: 15px;
}

/* ir pro painek */
.product-details-tab-container {
    background-color: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    border-top-color: rgba(255, 255, 255, 0.05) !important;
    color: #fff;
    background-color: #0B0E13;
    border-bottom-color: rgba(255, 255, 255, 0.00) !important;
    border-right-color: rgba(255, 255, 255, 0.05) !important;
    border-left-color: rgba(255, 255, 255, 0.05) !important;
}

.nav-tabs {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* 9. BADGES DE STATUS */
.label-success,
.status-active {
    background-color: rgba(34, 197, 94, 0.1) !important;
    color: #22c55e !important;
}

.label-danger,
.status-unpaid {
    background-color: rgba(239, 68, 68, 0.1) !important;
    color: #ef4444 !important;
}

/* 10. ALERTAS E RODAPÉ */
.alert-warning,
.alert-info,
.alert-success {
    background-color: rgba(255, 102, 0, 0.1) !important;
    border: 1px solid #ff6600 !important;
    color: #ffb88c !important;
}

.footer,
#footer {
    background-color: #0B0E13 !important;
    border-top: 1px solid #1f2937 !important;
}

.copyright {
    background-color: transparent !important;
    border-top: 1px solid transparent !important;
}

/* 11. FIX: BOTÕES DE TICKET LADO A LADO */
.row .col-button-left,
.row .col-button-right {
    padding: 5px !important;
}

.btn-block {
    display: block;
    width: 100% !important;
    padding: 10px 2px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
    overflow: hidden;
}

.btn-block i {
    display: block;
    margin-bottom: 4px;
    font-size: 14px;
}

#order-standard_cart .order-summary .btn-continue-shopping {
    color: #fff !important;
    font-size: .9em;
}

.table {
    width: 100%;
    margin-bottom: 1rem;
    color: #fff !important;
}

.client-home-cards .list-group {
    max-height: 170px;
    overflow: auto;
    border-radius: 0;
    border-top: 1px solid transparent !important;
    border-bottom: 1px solid transparent !important;
}

/* 12. ORGANIZAÇÃO ESTRUTURAL (GRID SYSTEM) */
.main-content .row {
    display: grid !important;
    grid-template-columns: 280px 1fr !important;
    gap: 30px !important;
    align-items: start !important;
}

.col-md-3,
.col-md-9,
.col-sm-4,
.col-sm-8 {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
}

.primary-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

@media (max-width: 991px) {
    .main-content .row {
        grid-template-columns: 1fr !important;
    }
}

/* 14. FIX: FIM DAS ETIQUETAS BRANCAS (image_17852c, image_177a6e) */

#order-standard_cart .checkout-container .field-section-title,
.sub-heading,
#order-standard_cart .field-section-title {
    background-color: transparent !important;
    color: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 4px !important;
    padding: 5px 15px !important;
    text-transform: uppercase;
    font-size: 0.75em !important;
    font-weight: 800 !important;
    /* letter-spacing: 1px; */
}

/* Remove a linha branca que às vezes atravessa essas etiquetas */
#order-standard_cart .checkout-container .field-divider {
    border-color: rgba(255, 255, 255, 0.05) !important;
}

#order-standard_cart .sub-heading span,
#order-standard_cart .sub-heading-borderless span {
    display: inline-block;
    position: relative;
    padding: 0 17px;
    top: -11px;
    font-size: 16px;
    background-color: #11141b !important;
    color: #ea580c !important;
}

/* Aplica o Dark nas caixinhas de seleção de conta */
#order-standard_cart .account-select-container {
    background: #11141b !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 12px !important;
    overflow: hidden;
}

#order-standard_cart .account-select-container div.account {
    background: #1c212b !important;
    border: none !important;
    color: #fff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
}

#order-standard_cart .account-select-container div.account.selected {
    background: rgba(255, 102, 0, 0.1) !important;
    box-shadow: inset 4px 0 0 #ea580c !important;
}

#order-standard_cart .view-cart-items .item {
    margin: 0;
    padding: 10px;
    background-color: #fff;
    border-left: 0;
    border-right: 0;
    font-size: .8em;
    margin-top: 1rem !important;
}

/* 13. NAVBAR & HEADER MODERNIZATION - FIX TOTAL (image_1788ce) */

/* Remove o fundo laranja sólido e aplica o Dark da Brabo */
.navbar-main,
.header-lined,
#header,
.menu-container {
    background: #0B0E13 !important;
    /* Fundo escuro real */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding: 10px 0 !important;
    min-height: 70px !important;
}

/* Centraliza e aproveita o espaço (image_0bb34d) */
.navbar-main .container,
.header-lined .container {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 95% !important;
    max-width: 1400px !important;
}

/* Estiliza o LOGO para não ficar espremido */
.navbar-brand img {
    max-height: 45px !important;
    transition: transform 0.3s ease;
}

/* LINKS DO MENU - Estilo Moderno (image_17e3a1) */
.navbar-main .nav>li>a {
    color: #cbd5e1 !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 15px 20px !important;
    background: transparent !important;
    transition: all 0.2s ease;
}

/* Efeito Hover com linha embaixo */
.navbar-main .nav>li>a:hover {
    color: #ff6600 !important;
    box-shadow: inset 0 -2px 0 #ff6600 !important;
}

/* Dropdowns Corrigidos - Anti-Fundo Branco (image_17ee6b, image_17e3a1) */
.dropdown-menu {
    background-color: #11141b !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 5px !important;
    padding: 10px !important;
    margin-top: 10px !important;
    /* box-shadow: 0 15px 50px rgba(0, 0, 0, 0.8) !important; */
    overflow: hidden;
}

/* Força a cor do texto e remove o fundo branco original do WHMCS */
.dropdown-menu>li>a,
.dropdown-item {
    color: #ffffff !important;
    background: transparent !important;
    padding: 10px 15px !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}

/* Hover definitivo: Texto Laranja e Fundo levemente destacado */
.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus,
.dropdown-item:hover,
.dropdown-item:focus {
    color: #ff6600 !important;
    /* Laranja Brabo */
    background-color: rgba(255, 102, 0, 0.1) !important;
    /* Fundo laranja quase invisível */
    text-decoration: none !important;
}

/* Remove qualquer divisor claro entre itens */
.dropdown-divider {
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}

header.header .toolbar .nav-link {
    padding: .5rem 1rem;
    border-radius: .25rem;
    border: 1px solid #212529 !important;
    color: #e5e5e5;
    position: relative;
    font-size: .9em;
}

/* Barra superior (onde diz "Logged in as") - Deixar discreta */
#top-nav {
    background: #07090c !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    font-size: 11px !important;
}