/**
 * Twenty-One Child Theme - Custom Styles (REVISED)
 * 3Life Hosting Branding
 * 
 * Primary Color: #CD6141 (Coral/Rust)
 * Secondary Color: #1E1E1E (Dark Gray)
 * Text Color: #EFEFEF (Light Gray)
 * Accent Color: #404040 (Medium Gray)
 * 
 * CHANGES IN THIS VERSION:
 * - Removed CSS variables (using direct color values)
 * - More specific selectors with higher specificity
 * - Reduced !important usage where possible
 * - Better organization and targeting
 */

/* ===================================
   IMPORT FONTS (Optional)
   =================================== */
/* Uncomment if you want custom fonts like the competitor
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600,700');
body { font-family: 'Montserrat', sans-serif; }
*/

/* ===================================
   GLOBAL BASE STYLES
   =================================== */
html,
body {
    background-color: #1E1E1E !important;
    color: #EFEFEF !important;
    height: auto;
}

/* Force all generic backgrounds to dark */
html body,
body#main-body,
.wrapper,
#wrapper,
.container-fluid {
    background-color: #1E1E1E;
}

/* ===================================
   TYPOGRAPHY & LINKS
   =================================== */
body,
body p,
body span:not(.badge):not(.label),
body div:not(.btn),
body td,
body th,
body li,
body label,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
    color: #EFEFEF;
}

body a {
    color: #CD6141;
    text-decoration: none;
}

body a:hover,
body a:focus {
    color: #B55538;
    text-decoration: none;
}

/* ===================================
   HEADER & NAVIGATION
   =================================== */
#header,
header,
.header-lined,
#header .navbar,
header .navbar,
.navbar.navbar-default {
    background-color: #1E1E1E !important;
    background: #404040 !important;
/*     border-bottom: 2px solid #CD6141 !important; */
    border-color: #404040;
    margin: 0;
}

div.header-lined h1 {
  background-color: #1E1E1E;
	text-transform: uppercase;
	border-bottom: 1px solid #CD6141;
}

/* Navigation Links */
.navbar-default .navbar-nav > li > a,
.navbar-nav > li > a {
    color: #EFEFEF !important;
    transition: all 0.2s ease-in-out;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-nav > li > a:hover {
    color: #CD6141 !important;
    background-color: rgba(205, 97, 65, 0.1) !important;
}

.navbar-default .navbar-nav > .active > a,
.navbar-nav > .active > a {
    color: #CD6141 !important;
    background-color: #404040 !important;
}

/* Dropdown Menus */
.navbar-default .dropdown-menu,
.dropdown-menu {
    background-color: #404040;
    border-top: 2px solid #CD6141;
    border-bottom: 2px solid #CD6141;
}

.navbar-default .dropdown-menu li,
.dropdown-menu > li {
    background-color: #404040;
    border-bottom: 1px solid #404040;
}

header.header .navbar a {
  color: #EFEFEF;
}

.navbar-default .dropdown-menu li a,
.dropdown-menu > li > a, header.header .navbar a:hover {
    color: #CD6141;
}

.navbar-default .dropdown-menu li:hover,
.dropdown-menu > li:hover {
    background-color: #1E1E1E;
    color: #CD6141;
}

.dropdown-item:hover {
  background-color: #1E1E1E;
  color: #CD6141;
}

/* Mobile Toggle */
.navbar-toggle {
    border-color: #CD6141;
}

.navbar-toggle:hover,
.navbar-toggle:focus {
    background-color: #CD6141;
}

.navbar-toggle .icon-bar {
    background-color: #EFEFEF;
}

/* ===================================
   BREADCRUMBS - CRITICAL FIX
   =================================== */
/* Very specific breadcrumb targeting */
/* nav.master-breadcrumb, */
/* .master-breadcrumb, */
/* .breadcrumb, */
/* nav[class*="breadcrumb"], */
/* .container .breadcrumb { */
/*     background-color: #404040 !important; */
/*     background: #404040 !important; */
/*     border: 1px solid #404040 !important; */
/*     color: #EFEFEF !important; */
/*     padding: 10px 15px; */
/*     margin-bottom: 20px; */
/* } */

/* nav.master-breadcrumb *, */
/* .master-breadcrumb *, */
/* .breadcrumb *, */
/* .breadcrumb li { */
/*     color: #EFEFEF !important; */
/* } */

/* nav.master-breadcrumb a, */
/* .master-breadcrumb a, */
/* .breadcrumb a { */
/*     color: #CD6141 !important; */
/* } */

/* nav.master-breadcrumb a:hover, */
/* .master-breadcrumb a:hover, */
/* .breadcrumb a:hover { */
/*     color: #B55538 !important; */
/* } */

.breadcrumb {
    display: none !important;
}

/* ===================================
   BUTTONS
   =================================== */
.btn-primary,
.btn-success,
button.btn-primary,
a.btn-primary {
    background-color: #CD6141 !important;
    border-color: #CD6141 !important;
    color: #FFFFFF !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-success:hover,
.btn-success:focus {
    background-color: #B55538 !important;
    border-color: #B55538 !important;
    color: #FFFFFF !important;
}

.btn-default,
.btn-secondary,
.btn-light {
    background-color: #404040 !important;
    border-color: #404040 !important;
    color: #EFEFEF !important;
}

.btn-default:hover,
.btn-secondary:hover,
.btn-light:hover {
    background-color: #505050 !important;
    color: #CD6141 !important;
}

/* ===================================
   PANELS & CARDS - HIGH SPECIFICITY
   =================================== */
.panel,
.card,
.panel-default,
div.panel,
div.card,
.panel.panel-default,
.card.card-default {
    background-color: #404040 !important;
    background: #404040 !important;
    border: 1px solid #CD6141 !important;
}

/* Panel Headers */
.panel-default > .panel-heading,
.panel > .panel-heading,
.panel-heading,
.card > .card-header,
.card-header {
    background-color: #1E1E1E !important;
    background: #CD6141 !important;
    border-bottom: 2px solid #CD6141 !important;
    color: #EFEFEF !important;
}

/* Panel Bodies */
.panel-body,
.panel > .panel-body,
.card-body,
.card > .card-body {
    background-color: #404040 !important;
    background: #1E1E1E !important;
    color: #EFEFEF !important;
}

/* Panel Footers */
.panel-footer,
.card-footer {
    background-color: #1E1E1E !important;
    border-top: 1px solid #404040 !important;
}

/* Client Area Panels */
.client-home-panels .panel > .panel-heading {
    background-color: #CD6141 !important;
    color: #FFFFFF;
}

.client-home-panels .panel > .list-group {
    border-color: #404040;
}

.panel.panel-accent-blue,
.panel {
    border-top-color: #CD6141 !important;
}

/* ===================================
   FORMS & INPUTS
   =================================== */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
textarea,
select,
.input-field {
    background-color: #1E1E1E !important;
    background: #1E1E1E !important;
    border: 1px solid #CD6141 !important;
    color: #EFEFEF !important;
}

.form-control:focus,
input:focus,
textarea:focus,
select:focus {
    background-color: #1E1E1E !important;
    border-color: #CD6141 !important;
    color: #EFEFEF !important;
    box-shadow: 0 0 0 0.2rem rgba(205, 97, 65, 0.25) !important;
    outline: none;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: #999 !important;
}

label,
.control-label,
.form-label {
    color: #EFEFEF !important;
}

.input-group-addon,
.input-group-text {
    background-color: #404040 !important;
    border-color: #404040 !important;
    color: #EFEFEF !important;
}

/* Disabled/Readonly Fields */
.form-control[disabled],
.form-control[readonly],
input[disabled],
input[readonly] {
    background-color: #1E1E1E !important;
    opacity: 0.6;
}

/* ===================================
   TABLES
   =================================== */
.table,
table {
    color: #EFEFEF;
    background-color: #404040;
}

.table > thead > tr > th,
.table thead th,
table thead th {
    background-color: #1E1E1E !important;
    border-bottom: 2px solid #CD6141 !important;
    color: #EFEFEF !important;
}

.table > tbody > tr > td,
.table tbody td,
table tbody td {
    border-top: 1px solid #404040;
    border-color: #404040;
    color: #EFEFEF;
}

.table-striped > tbody > tr:nth-of-type(odd),
.table-striped tbody tr:nth-of-type(odd) {
    background-color: #1E1E1E;
}

.table-hover > tbody > tr:hover,
.table-hover tbody tr:hover {
    background-color: rgba(205, 97, 65, 0.1);
}

.table-bordered > tbody > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > thead > tr > th {
    border-color: #404040;
}

/* Override light table variants */
.table-light,
.table-light > th,
.table-light > td {
    background-color: #404040 !important;
    color: #EFEFEF !important;
}

.table-list>tbody>tr>td {
  background-color:#404040 !important;
}

/* ===================================
   ALERTS
   =================================== */
.alert {
    border-radius: 4px;
    color: #EFEFEF;
    border-width: 1px;
}

.alert-success {
    background-color: rgba(205, 97, 65, 0.2);
    border-color: #CD6141;
}

.alert-info {
    background-color: rgba(64, 64, 64, 0.5);
    border-color: #404040;
}

.alert-warning {
    background-color: rgba(205, 97, 65, 0.3);
    border-color: #CD6141;
}

.alert-danger {
    background-color: rgba(185, 74, 72, 0.2);
    border-color: #B94A48;
}

/* ===================================
   LIST GROUPS & SIDEBARS
   =================================== */
.sidebar,
.sidebar-menu,
aside {
    background-color: #1E1E1E;
}

.list-group-item,
.list-group > .list-group-item {
    background-color: #1E1E1E !important;
    border-bottom: 1px solid #CD6141 !important;
    color: #EFEFEF !important;
}

.list-group-item:hover {
    background-color: #1E1E1E !important;
    color: #CD6141 !important;
}

.list-group-item.active,
.list-group-item.active:hover {
    background-color: #CD6141 !important;
    border-color: #CD6141 !important;
    color: #FFFFFF !important;
}

/* ===================================
   MODALS
   =================================== */
.modal-content {
    background-color: #1E1E1E;
    border: 1px solid #404040;
}

.modal-header {
    background-color: #1E1E1E;
    border-bottom: 2px solid #CD6141;
    color: #EFEFEF;
}

.modal-body {
    background-color: #404040;
    color: #EFEFEF;
}

.modal-footer {
    background-color: #1E1E1E;
    border-top: 1px solid #404040;
}

/* ===================================
   TABS & NAVIGATION
   =================================== */
.nav-tabs {
    border-bottom: 2px solid #CD6141;
}

.nav-tabs > li > a,
.nav-tabs .nav-link {
    color: #EFEFEF;
    background-color: #404040;
    border: 1px solid #404040;
    transition: all 0.2s ease-in-out;
}

.nav-tabs > li > a:hover,
.nav-tabs .nav-link:hover {
    background-color: #1E1E1E;
    color: #CD6141;
    border-color: #404040;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
.nav-tabs .nav-link.active {
    background-color: #1E1E1E !important;
    border-bottom-color: transparent !important;
    color: #CD6141 !important;
    border-color: #404040 #404040 transparent #404040;
}

.tab-content,
.tab-pane {
    background-color: #404040;
    border: 1px solid #404040;
    border-top: none;
    padding: 20px;
    color: #EFEFEF;
}

/* ===================================
   PAGINATION
   =================================== */
.pagination > li > a,
.pagination > li > span,
.page-link {
    background-color: #404040;
    border: 1px solid #404040;
    color: #EFEFEF;
}

.pagination > li > a:hover,
.page-link:hover {
    background-color: #1E1E1E;
    border-color: #CD6141;
    color: #CD6141;
}

.pagination > .active > a,
.pagination > .active > span,
.page-item.active .page-link {
    background-color: #CD6141 !important;
    border-color: #CD6141 !important;
    color: #FFFFFF !important;
}

/* ===================================
   BADGES & LABELS
   =================================== */
.badge,
.label {
    background-color: #CD6141;
    color: #FFFFFF;
}

.badge-primary,
.label-primary {
    background-color: #CD6141;
}

.badge-secondary,
.badge-light,
.label-default {
    background-color: #404040;
    color: #EFEFEF;
}

/* ===================================
   PROGRESS BARS
   =================================== */
.progress {
    background-color: #1E1E1E;
    border: 1px solid #404040;
}

.progress-bar {
    background-color: #CD6141;
}

/* ===================================
   WELLS & JUMBOTRON
   =================================== */
.well,
.jumbotron {
    background-color: #404040;
    border: 1px solid #404040;
    color: #EFEFEF;
}

/* ===================================
   FOOTER
   =================================== */
#footer,
footer,
.footer,
footer#footer {
    background-color: #404040 !important;
/*    border-top: 2px solid #CD6141 !important; */
    color: #EFEFEF !important;
}

#footer a,
footer a,
.footer a {
    color: #CD6141;
}

#footer a:hover,
footer a:hover,
.footer a:hover {
    color: #B55538;
}

/* ===================================
   WHMCS SPECIFIC COMPONENTS
   =================================== */

/* Main Content Area */
#main-body,
.main-body,
section#main-body,
div#main-body,
.content-container,
#content {
    background-color: #1E1E1E !important;
    background: #1E1E1E !important;
}

/* Product Boxes - VERY SPECIFIC */
.product-box,
.product,
div.product,
.card.product,
.products .product,
.products > div.product,
.product-grid .product,
.product-grid > div,
[class*="col"] > .product {
    background-color: #404040 !important;
    background: #404040 !important;
    border: 2px solid #404040 !important;
    transition: all 0.3s ease;
}

.product-box:hover,
.product:hover {
    border-color: #CD6141 !important;
    box-shadow: 0 5px 20px rgba(205, 97, 65, 0.3);
}

/* Product Details */
.product-info,
.product-details,
.product-wrapper,
.product-container,
div.product-details,
div.product-info {
    background-color: #404040 !important;
    background: #404040 !important;
}

/* Product Details Tab Container */
div.product-details-tab-container {
    background: #1E1E1E;
    border: 1px solid #404040;
}

/* Product Icons */
div.product-details div.product-icon span .fa-circle {
    color: #404040;
}

/* Product Status */
.product-status-active {
    background-color: #0d8a0b;
}

/* Pricing Tables */
.pricing-table .panel:hover,
.pricing-table .card:hover {
    border-color: #CD6141 !important;
    box-shadow: 0 10px 30px rgba(205, 97, 65, 0.3);
}

/* Domain Search */
.domain-search-box,
.domain-checker,
.home-kb-search .form-control {
    background-color: #404040;
    border: 2px solid #CD6141;
    color: #EFEFEF;
    padding: 30px;
}

.domain-checker-result-available {
    background-color: rgba(205, 97, 65, 0.2);
    border-left: 4px solid #CD6141;
}

/* Cart & Checkout */
.cart-summary,
.order-summary {
    background-color: #1E1E1E;
    border: 2px solid #CD6141;
    padding: 20px;
}

.total-due,
.total {
    color: #CD6141;
    font-weight: bold;
}

/* Order Form Specific */
/* Fix for product header span text in order cart */
#order-standard_cart .products div.product header {
	border-radius: 0;
}

#order-standard_cart .products .product header span {
    color: #EFEFEF !important;
    text-transform: uppercase;
}

#order-standard_cart div.product-info {
    background-color: #1E1E1E;
    border: 1px solid #404040;
}

#order-standard_cart .summary-container {
    background-color: #404040 !important;
}

#order-standard_cart .order-summary {
    background-color: #CD6141 !important;
    border-bottom:2px solid #CD6141 !important;
}

#order-standard_cart .panel-addon .panel-body label {
    color: #EFEFEF;
}

#order-standard_cart .panel-addon .panel-price {
    background-color: #CD6141;
}

#order-standard_cart .panel-addon .panel-price a {
    color: #FFFFFF;
}

#order-standard_cart .panel-addon .panel-add {
    background-color: #CD6141;
    color: #FFFFFF;
}

#order-standard_cart .panel-addon-selected {
    border-color: #CD6141;
}

#order-standard_cart .categories-collapsed {
    background-color: #1E1E1E;
    border: 1px solid #404040;
}

#order-standard_cart .categories-collapsed select {
    color: #EFEFEF;
}

#order-standard_cart .view-cart-tabs button {
    background-color: #CD6141;
}

#order-standard_cart .view-cart-tabs button:hover {
    background-color: #B55538;
}

#order-standard_cart .field[disabled],
#order-standard_cart .field[readonly] {
    background-color: #1E1E1E;
}

#order-standard_cart .apply-credit-container {
    background-color: #1E1E1E;
    border: 1px solid #CD6141;
}

/* Invoices */
.invoice-header {
    background-color: #1E1E1E;
    border-bottom: 3px solid #CD6141;
}

.invoice-status-paid {
    background-color: #CD6141;
    color: #FFFFFF;
}

.invoice-summary {
    background-color: #1E1E1E;
    border: 4px dashed #CD6141;
}

.invoice-summary-table td.total-row {
    background-color: #1E1E1E;
}

/* Tickets */
.ticket-reply {
    background-color: #1E1E1E;
    border-left: 3px solid #CD6141;
    padding: 15px;
}

.ticketfeedbackstaffcont {
    background-color: #1E1E1E;
    border: 1px solid #404040;
}

/* Dashboard Widgets */
.dashboard-widget {
    background-color: #404040;
    border: 1px solid #404040;
    border-left: 4px solid #CD6141;
    padding: 20px;
}

/* Tiles */
.tiles .row {
    border: 1px solid #404040;
}

.tiles .tile {
    background-color: #1E1E1E;
    border-right: 1px solid #404040;
}

.tiles .tile:hover {
    background-color: #404040;
}

/* ===================================
   KNOWLEDGEBASE
   =================================== */
.knowledgebase-cat .knowledgebase-wrap {
    background-color: #1E1E1E;
    border: 1px solid #404040;
    margin-bottom: 10px;
}

.knowledgebase-cat:hover .knowledgebase-wrap {
    border: 1px solid #CD6141;
}

.knowledgebase-cat .knowledgebase-title {
    background-color: #1E1E1E;
    padding: 10px;
    color: #EFEFEF;
    font-weight: 600;
}

.knowledgebase-cat:hover .knowledgebase-title {
    background-color: #404040;
}

.knowledgebase-cat .knowledgebase-description {
    background-color: #1E1E1E;
    padding: 10px;
}

.knowledgebase-cat:hover .knowledgebase-description {
    background-color: #404040;
}

/* ===================================
   OVERRIDE BOOTSTRAP UTILITY CLASSES
   =================================== */
.bg-light {
    background-color: #404040 !important;
}

.bg-white {
    background-color: #1E1E1E !important;
}

.bg-primary {
    background-color: #CD6141 !important;
}

.text-dark {
    color: #EFEFEF !important;
}

.text-muted {
    color: #999 !important;
}

.text-primary {
    color: #CD6141 !important;
}

.border,
.border-top,
.border-bottom,
.border-left,
.border-right {
    border-color: #404040 !important;
}

.border-primary {
    border-color: #CD6141 !important;
}

/* ===================================
   FORCE OVERRIDE INLINE STYLES
   =================================== */
/* Nuclear option for stubborn white backgrounds */
div[style*="background-color: #fff"],
div[style*="background-color: #ffffff"],
div[style*="background-color: white"],
div[style*="background: #fff"],
div[style*="background: white"],
div[style*="background-color:white"],
div[style*="background:white"] {
    background-color: #404040 !important;
    background: #404040 !important;
}

/* ===================================
   SCROLLBAR STYLING
   =================================== */
::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: #1E1E1E;
}

::-webkit-scrollbar-thumb {
    background: #404040;
    border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
    background: #CD6141;
}

/* ===================================
   RESPONSIVE - MOBILE
   =================================== */
@media (max-width: 768px) {
    .navbar-collapse {
        background-color: #1E1E1E !important;
    }
    
    .navbar-nav > li > a {
        border-bottom: 1px solid #404040;
    }
    
    .navbar-default .navbar-collapse,
    .navbar-default .navbar-form {
        background-color: #1E1E1E;
        border-color: #1E1E1E;
    }
}

/* ===================================
   TRANSITIONS & ANIMATIONS
   =================================== */
.btn,
.panel,
.card,
.product-box,
.product,
.list-group-item,
a,
.nav-tabs > li > a {
    transition: all 0.3s ease;
}

/* ===================================
   REGISTRATION & FORMS
   =================================== */
#registration label {
    color: #EFEFEF;
}

.marketing-email-optin {
    background-color: transparent;
}

/* ===================================
   PRE/CODE BLOCKS
   =================================== */
pre,
code {
    color: #ccc;
    background-color: #1E1E1E;
    border: 1px solid #404040;
    border-radius: 3px;
}

pre.error {
    color: #da2727;
}

pre.warning {
    color: #d8a33f;
}

pre.success {
    color: #16a00f;
}

/* ===================================
   ADDITIONAL FIXES
   =================================== */
hr {
    border-top: 1px solid rgba(64, 64, 64, 0.5);
}

.fa-inverse {
    color: #FFFFFF;
}

/* Highlight utility */
.highlight {
    background-color: rgba(205, 97, 65, 0.2);
    border-left: 4px solid #CD6141;
    padding: 15px;
}

/* ===================================
   END CUSTOM STYLES
   =================================== */