/* ==========================================================================
   DomainWorld.com — WHMCS Theme
   Unified brand identity across domainworld.com, .ai, domains.domainworld.com

   Brand Palette (from domainworld.com :root):
     --primary:        #1a1a2e   (dark navy — headings, header, footer, dark cards)
     --secondary:      #c9a66b   (gold — ONLY on dark backgrounds, hover accent)
     --accent:         #f4f4f2   (page background)
     --text:           #2d2d2d   (body text on light bg — but domainworld uses #555 for most body)
     --text-light:     #6b6b6b   (muted/secondary text)
     --border:         #e0e0e0   (card/input borders)
     --success:        #2d5016   (green)
     --gradient-start: #1a1a2e
     --gradient-end:   #2d3561

   Fonts (2 only):
     Headings: 'Cormorant Garamond', serif
     Body:     'Work Sans', sans-serif

   Rules:
     Gold (#c9a66b) text ONLY on dark backgrounds (#1a1a2e, gradients)
     Light backgrounds use #555 body, #1a1a2e headings, #6b6b6b muted
     Links on light: #1a1a2e, hover → #c9a66b
     Buttons: gold bg with white text (primary), or transparent with navy border
     Cards: white, 1px solid #e0e0e0, border-radius: 10px, shadow: 0 2px 10px rgba(0,0,0,0.05)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;600;700&family=Work+Sans:wght@300;400;500;600&display=swap');

:root {
    --primary: #1a1a2e !important;
    --secondary: #c9a66b !important;
    --success: #2d5016 !important;
    --info: #2d3561 !important;
    --dark: #1a1a2e !important;
    --light: #f4f4f2 !important;
    --font-family-sans-serif: 'Work Sans', sans-serif !important;
}


/* ==========================================================================
   BASE
   ========================================================================== */

body, body.primary-bg-color {
    font-family: 'Work Sans', sans-serif !important;
    color: #555 !important;
    background: #f4f4f2 !important;
    line-height: 1.6 !important;
}

h1, h2, h3, h4, h5, h6, .card-title {
    font-family: 'Cormorant Garamond', serif !important;
    color: #1a1a2e !important;
    font-weight: 700 !important;
}

a {
    color: #1a1a2e !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

a:hover {
    color: #c9a66b !important;
}

p, li, td, th, span, label, div {
    font-family: 'Work Sans', sans-serif;
}


/* ==========================================================================
   HEADER — dark navy (#1a1a2e)
   All text white, gold on hover
   ========================================================================== */

#header .header,
#header .navbar.navbar-light {
    background: #1a1a2e !important;
    border-bottom: none !important;
    padding: 1rem 0 !important;
}

.navbar-brand {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
    color: #fff !important;
}

.navbar-brand .logo-img {
    max-height: 45px !important;
    width: auto !important;
}

#header a,
#header .navbar a,
#header .navbar .nav-link,
#header .navbar .toolbar .nav-link,
#header .navbar .toolbar .btn.nav-link,
#header .navbar .main-menu-item > a,
#header .navbar-nav > li > a,
.navbar-nav .nav-link,
.navbar-nav .nav-item .nav-link {
    color: #fff !important;
    font-family: 'Work Sans', sans-serif !important;
    font-size: 0.88rem !important;
    font-weight: 500 !important;
    transition: color 0.3s ease !important;
}

#header a:hover,
#header .navbar a:hover,
.navbar-nav .nav-link:hover,
.navbar-nav .nav-item .nav-link:hover {
    color: #c9a66b !important;
}

.navbar-nav .nav-item.active .nav-link {
    color: #c9a66b !important;
}

/* Header search */
.navbar .search .form-control {
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    color: #fff !important;
    border-radius: 4px !important;
    font-family: 'Work Sans', sans-serif !important;
}

.navbar .search .form-control::placeholder {
    color: rgba(255,255,255,0.4) !important;
}

.navbar .search .btn {
    background: #c9a66b !important;
    border-color: #c9a66b !important;
    color: #fff !important;
}

.navbar .cart-btn .badge {
    background: #c9a66b !important;
    color: #fff !important;
}

/* Mobile menu */
.navbar-toggler { border-color: rgba(255,255,255,0.2) !important; }
.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,0.7%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}


/* ==========================================================================
   TOPBAR — logged-in user bar (darker than header)
   ========================================================================== */

.header .topbar {
    background: #0f0f1a !important;
    border-bottom: 1px solid rgba(201,166,107,0.15) !important;
}

.header .topbar,
.header .topbar .btn,
.header .topbar .input-group-text,
.header .topbar a,
.header .topbar span {
    color: rgba(255,255,255,0.7) !important;
}

.header .topbar .btn-active-client {
    color: #c9a66b !important;
    font-weight: 600 !important;
}


/* ==========================================================================
   MAIN NAV BAR — same dark navy as header
   ========================================================================== */

.main-navbar-wrapper,
.navbar.navbar-expand-xl.main-navbar-wrapper,
#header .main-navbar-wrapper {
    background: #1a1a2e !important;
    border-top: 1px solid rgba(201,166,107,0.15) !important;
}

/* Header dropdown menus */
.main-menu .dropdown-menu,
.navbar .dropdown-menu {
    background: #1a1a2e !important;
    border: 1px solid rgba(201,166,107,0.15) !important;
    border-radius: 10px !important;
}

.main-menu .dropdown-item,
.navbar .dropdown-item {
    color: rgba(255,255,255,0.7) !important;
}

.main-menu .dropdown-item:hover,
.navbar .dropdown-item:hover,
.dropdown-item.active,
.dropdown-item:active {
    background: rgba(201,166,107,0.08) !important;
    color: #c9a66b !important;
}


/* ==========================================================================
   BREADCRUMB — hidden
   ========================================================================== */

nav.master-breadcrumb {
    display: none !important;
}


/* ==========================================================================
   DOMAIN SEARCH HERO — gradient background (#1a1a2e → #2d3561)
   Gold and white text OK here
   ========================================================================== */

.home-domain-search,
.home-domain-search.bg-white {
    background: linear-gradient(135deg, #1a1a2e 0%, #2d3561 100%) !important;
    color: #fff !important;
    border: none !important;
}

.home-domain-search h2 {
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 2rem !important;
    font-weight: 700 !important;
    color: #fff !important;
}

.home-domain-search h3,
.home-domain-search p,
.home-domain-search label,
.home-domain-search .lead,
.home-domain-search a {
    color: rgba(255,255,255,0.9) !important;
}

.home-domain-search .form-control,
.home-domain-search textarea,
.home-domain-search input[type="text"],
.home-domain-search select {
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    color: #555 !important;
    border-radius: 4px !important;
    font-family: 'Work Sans', sans-serif !important;
}

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

.home-domain-search .btn-primary {
    background: #c9a66b !important;
    border-color: #c9a66b !important;
    color: #fff !important;
    font-weight: 600 !important;
}

.home-domain-search .btn-primary:hover {
    background: transparent !important;
    color: #c9a66b !important;
    border-color: #c9a66b !important;
}

.home-domain-search .custom-control-label,
.home-domain-search label {
    color: rgba(255,255,255,0.7) !important;
    font-size: 0.85rem !important;
}

/* Search dropdowns — dark text on white bg */
.home-domain-search .multiselect-native-select .btn,
.home-domain-search .multiselect,
.home-domain-search .multiselect-selected-text,
.home-domain-search .dropdown-toggle,
.home-domain-search .btn-group .btn,
.home-domain-search .btn-default {
    color: #555 !important;
}


/* ==========================================================================
   MAIN CONTENT — light background (#f4f4f2)
   Text: #555, headings: #1a1a2e, links: #1a1a2e → hover #c9a66b
   ========================================================================== */

#main-body {
    background: #f4f4f2 !important;
}

#main-body,
#main-body p,
#main-body li,
#main-body span,
#main-body label,
#main-body td,
#main-body .card-body,
section,
section p,
.content-area,
.primary-content,
.primary-content p,
.primary-content span,
.primary-content li,
.primary-content td,
.primary-content label,
.panel-body,
.tab-pane,
.main-content {
    color: #555 !important;
}

#main-body a,
section a,
.content-area a,
.primary-content a,
.panel a,
.panel-body a,
.tab-content a,
.table a,
.table td a,
.list-group-item a,
a.list-group-item,
.sidebar a,
.breadcrumb-item a,
.client-area a,
.clientarea a,
.card-body a {
    color: #1a1a2e !important;
}

#main-body a:hover,
section a:hover,
.content-area a:hover,
.primary-content a:hover,
.panel a:hover,
.tab-content a:hover,
.table a:hover,
.card-body a:hover,
.list-group-item a:hover,
a.list-group-item:hover,
.sidebar a:hover,
.breadcrumb-item a:hover {
    color: #c9a66b !important;
}

/* Section headings */
#main-body h1,
#main-body h2,
#main-body h3,
#main-body h4 {
    color: #1a1a2e !important;
}

/* Muted/secondary text */
.text-muted,
small,
.small {
    color: #6b6b6b !important;
}


/* ==========================================================================
   BUTTONS — matching domainworld.com
   Primary: gold bg, white text → hover: transparent, gold text/border
   Default: transparent, navy border → hover: navy bg, white text
   ========================================================================== */

.btn-primary,
a.btn-primary,
button.btn-primary,
input[type="submit"].btn-primary {
    background: #c9a66b !important;
    border: 2px solid #c9a66b !important;
    color: #fff !important;
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.88rem !important;
    border-radius: 4px !important;
    padding: 0.375rem 0.75rem !important;
    transition: all 0.3s ease !important;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover {
    background: transparent !important;
    color: #c9a66b !important;
    border-color: #c9a66b !important;
}

.btn-primary:focus,
.btn-primary:active {
    background: #b8955a !important;
    border-color: #b8955a !important;
    color: #fff !important;
    box-shadow: none !important;
}

.btn-default,
.btn-secondary,
a.btn-default {
    padding: 0.375rem 0.75rem !important;
    border: 2px solid #1a1a2e !important;
    background: transparent !important;
    color: #1a1a2e !important;
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.88rem !important;
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
}

.btn-default:hover,
.btn-secondary:hover,
a.btn-default:hover {
    background: #1a1a2e !important;
    color: #fff !important;
}

.btn-success {
    background: #2d5016 !important;
    border-color: #2d5016 !important;
    color: #fff !important;
}

.btn-danger {
    background: #8b0000 !important;
    border-color: #8b0000 !important;
    color: #fff !important;
}


/* ==========================================================================
   CARDS — white, matching domainworld.com
   ========================================================================== */

.card {
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
}

.card .card-title {
    font-family: 'Cormorant Garamond', serif !important;
    color: #1a1a2e !important;
    font-weight: 700 !important;
}

.card .card-body {
    color: #555 !important;
    font-family: 'Work Sans', sans-serif !important;
}

.card .card-body a {
    color: #1a1a2e !important;
}

.card .card-body a:hover {
    color: #c9a66b !important;
}


/* ==========================================================================
   HOMEPAGE DARK BOXES — Browse Products, Help, Your Account
   Dark navy bg — gold text IS correct here
   ========================================================================== */

.card-columns.home .card {
    background: #1a1a2e !important;
    border: 1px solid rgba(201,166,107,0.15) !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
}

.card-columns.home .card .card-title,
.card-columns.home .card h3,
.card-columns.home .card a,
.card-columns.home .card p,
.card-columns.home .card .card-body {
    color: rgba(255,255,255,0.9) !important;
}

.card-columns.home .card:hover {
    border-color: #c9a66b !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1) !important;
}

.card-columns.home .card:hover * {
    color: #fff !important;
}

/* Action icon buttons (Help, Account) */
.action-icon-btns a,
.action-icon-btns [class*='card-accent'] {
    background: #1a1a2e !important;
    color: rgba(255,255,255,0.9) !important;
    border: 1px solid rgba(201,166,107,0.15) !important;
    border-radius: 10px !important;
    transition: all 0.3s ease !important;
}

.action-icon-btns a:hover,
.action-icon-btns [class*='card-accent']:hover {
    border-color: #c9a66b !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1) !important;
    color: #fff !important;
}

.action-icon-btns .ico-container {
    background: rgba(201,166,107,0.1) !important;
}

.action-icon-btns .ico-container i,
.action-icon-btns i {
    color: #c9a66b !important;
}


/* ==========================================================================
   TABLES
   ========================================================================== */

.table thead th,
.table-striped thead th {
    background: #1a1a2e !important;
    color: rgba(255,255,255,0.9) !important;
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.82rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border: none !important;
}

.table td, .table th {
    color: #555 !important;
    font-size: 0.85rem !important;
    border-color: #e0e0e0 !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #f9f7f4 !important;
}

.table a {
    color: #1a1a2e !important;
}

.table a:hover {
    color: #c9a66b !important;
}


/* ==========================================================================
   SIDEBAR
   ========================================================================== */

.sidebar .list-group-item,
.list-group-item {
    color: #555 !important;
    font-family: 'Work Sans', sans-serif !important;
    font-size: 0.88rem !important;
    border-color: #e0e0e0 !important;
}

.sidebar .list-group-item.active,
.list-group-item.active {
    background-color: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #c9a66b !important;
}

.sidebar .list-group-item.active a {
    color: #c9a66b !important;
}

.sidebar .list-group-item:hover {
    color: #c9a66b !important;
}


/* ==========================================================================
   TABS
   ========================================================================== */

.nav-tabs .nav-link {
    color: #555 !important;
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 500 !important;
}

.nav-tabs .nav-link.active {
    color: #1a1a2e !important;
    border-bottom: 2px solid #c9a66b !important;
}

.nav-tabs .nav-link:hover {
    color: #c9a66b !important;
}


/* ==========================================================================
   FOOTER — dark navy (#1a1a2e)
   Gold links, light grey text
   ========================================================================== */

footer,
.footer,
footer.container-fluid {
    background: #1a1a2e !important;
    color: rgba(255,255,255,0.7) !important;
    border-top: none !important;
}

footer a,
.footer a {
    color: #c9a66b !important;
}

footer a:hover,
.footer a:hover {
    color: #fff !important;
}

footer .text-muted,
.footer .text-muted {
    color: rgba(255,255,255,0.5) !important;
}


/* ==========================================================================
   FORMS
   ========================================================================== */

.form-control {
    border: 1px solid #e0e0e0 !important;
    border-radius: 4px !important;
    font-family: 'Work Sans', sans-serif !important;
    color: #555 !important;
    font-size: 0.88rem !important;
    transition: border-color 0.3s ease !important;
}

.form-control:focus {
    border-color: #c9a66b !important;
    box-shadow: none !important;
}

/* Locked email field */
input[name='email'] {
    pointer-events: none !important;
    background: #f4f4f2 !important;
    opacity: 0.7 !important;
}


/* ==========================================================================
   PAGINATION
   ========================================================================== */

.page-item.active .page-link {
    background-color: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #fff !important;
}

.page-link {
    color: #1a1a2e !important;
}

.page-link:hover {
    color: #c9a66b !important;
}


/* ==========================================================================
   BADGES
   ========================================================================== */

.badge-primary, .badge-info {
    background-color: #1a1a2e !important;
    color: #fff !important;
}

.badge-success { background-color: #2d5016 !important; color: #fff !important; }
.badge-warning { background-color: #fff8dc !important; color: #92400e !important; }
.badge-danger { background-color: #ffe0e0 !important; color: #8b0000 !important; }


/* ==========================================================================
   ALERTS
   ========================================================================== */

.alert-info {
    background: #e0f2fe !important;
    border: 1px solid rgba(3,105,161,0.2) !important;
    color: #0369a1 !important;
    border-radius: 10px !important;
}

.alert-success {
    background: #d1fae5 !important;
    border: 1px solid rgba(6,95,70,0.2) !important;
    color: #065f46 !important;
    border-radius: 10px !important;
}

.alert-warning {
    background: #fef3c7 !important;
    border: 1px solid rgba(146,64,14,0.2) !important;
    color: #92400e !important;
    border-radius: 10px !important;
}

.alert-danger {
    background: #ffe0e0 !important;
    border: 1px solid rgba(139,0,0,0.2) !important;
    color: #8b0000 !important;
    border-radius: 10px !important;
}

.alert-secondary {
    background: #f9f7f4 !important;
    border: 1px solid rgba(201,166,107,0.3) !important;
    color: #555 !important;
    border-radius: 10px !important;
}


/* ==========================================================================
   BREADCRUMBS (inner pages)
   ========================================================================== */

.breadcrumb { background: transparent !important; }
.breadcrumb-item a { color: #1a1a2e !important; }
.breadcrumb-item.active { color: #6b6b6b !important; }
.breadcrumb-item a:hover { color: #c9a66b !important; }


/* ==========================================================================
   KNOWLEDGEBASE
   ========================================================================== */

.kb-cat-list .card:hover,
.knowledgebase .card:hover {
    border-color: #c9a66b !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1) !important;
}

.kb-cat-list .card:hover *,
.knowledgebase .card:hover * {
    color: #c9a66b !important;
}



/* KB article/category links — gold text */
.kb-category a.card-body,
.kb-category a.card-body .h5,
.kb-category a.card-body i,
.kb-article-item,
.kb-article-item i,
.list-group-item.kb-article-item small {
    color: #1a1a2e !important;
}

/* ==========================================================================
   STATUS TEXT
   ========================================================================== */

.status-active, .text-success { color: #2d5016 !important; }
.status-pending, .text-warning { color: #92400e !important; }
.status-cancelled, .text-danger { color: #8b0000 !important; }


/* ==========================================================================
   UTILITIES
   ========================================================================== */

.bg-primary { background-color: #1a1a2e !important; }
.text-primary { color: #1a1a2e !important; }
.border-primary { border-color: #1a1a2e !important; }
.spinner-border { color: #c9a66b !important; }


/* ==========================================================================
   LOGIN PAGE
   ========================================================================== */

.login-container, #login {
    background: linear-gradient(135deg, #1a1a2e 0%, #2d3561 100%) !important;
    min-height: 100vh;
}

.login-container .card,
#login .logincontainer {
    border-radius: 10px !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1) !important;
}


/* ==========================================================================
   CLIENT AREA HOME — Tiles & Cards
   Match domainworld.com clean look
   ========================================================================== */

/* Stat tiles */
.tiles .tile {
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    color: #555 !important;
    transition: all 0.3s ease !important;
}

.tiles .tile:hover {
    border-color: #c9a66b !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
    color: #1a1a2e !important;
}

.tiles .tile i {
    color: #1a1a2e !important;
}

.tiles .tile .stat {
    color: #1a1a2e !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 700 !important;
}

.tiles .tile .title {
    color: #555 !important;
    font-family: 'Work Sans', sans-serif !important;
}

/* Override all highlight bar colors to gold */
.tiles .tile .highlight,
.highlight.bg-color-blue,
.highlight.bg-color-green,
.highlight.bg-color-red,
.highlight.bg-color-gold {
    background: #c9a66b !important;
}

/* Client home cards */
.client-home-cards .card {
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

/* Override all card-accent colors */
.card-accent-blue,
.card-accent-green,
.card-accent-red,
.card-accent-gold,
.card-accent-orange,
[class*='card-accent-'] {
    border-top: 3px solid #c9a66b !important;
    border-left: none !important;
}

/* Card headers */
.client-home-cards .card-header,
.card .card-header {
    background: #fff !important;
    border-bottom: 1px solid #e0e0e0 !important;
    padding: 1rem 1.25rem !important;
}

.client-home-cards .card-header h3,
.card .card-header h3,
.card .card-header .card-title {
    color: #1a1a2e !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
}

.card .card-header i {
    color: #1a1a2e !important;
}

/* Override bg-color buttons in card headers */
.btn.bg-color-blue,
.btn.bg-color-green,
.btn.bg-color-red,
.btn.bg-color-gold,
.btn.bg-color-orange,
.btn[class*='bg-color-'] {
    background: #c9a66b !important;
    border-color: #c9a66b !important;
    color: #fff !important;
}

.btn[class*='bg-color-']:hover {
    background: transparent !important;
    color: #c9a66b !important;
    border-color: #c9a66b !important;
}

/* Card footer */
.card .card-footer {
    background: #f9f7f4 !important;
    border-top: 1px solid #e0e0e0 !important;
}

/* List group items inside cards */
.client-home-cards .list-group-item {
    border-color: #e0e0e0 !important;
    color: #555 !important;
    font-size: 0.88rem !important;
}

.client-home-cards .list-group-item a,
.client-home-cards a.list-group-item {
    color: #1a1a2e !important;
}

.client-home-cards .list-group-item:hover,
.client-home-cards a.list-group-item:hover {
    background: #f9f7f4 !important;
    color: #c9a66b !important;
}

.client-home-cards .list-group-item i {
    color: #6b6b6b !important;
}

/* Badge inside cards */
.client-home-cards .badge {
    background: #1a1a2e !important;
    color: #fff !important;
    font-size: 0.72rem !important;
    border-radius: 4px !important;
}

/* Thank you for choosing DomainWorld text */
.primary-content h2,
.primary-content h3 {
    color: #1a1a2e !important;
}

.primary-content p,
.primary-content span,
.primary-content li,
.primary-content td,
.primary-content label,
.primary-content div {
    color: #555 !important;
}

.primary-content a {
    color: #1a1a2e !important;
}

.primary-content a:hover {
    color: #c9a66b !important;
}

/* ===== OVERRIDE ALL GREEN BACKGROUNDS ===== */
.bg-color-green,
.bg-success,
.btn-info {
    background: #c9a66b !important;
    border-color: #c9a66b !important;
    color: #fff !important;
}

.bg-color-green:hover,
.bg-success:hover,
.btn-info:hover {
    background: transparent !important;
    color: #c9a66b !important;
    border-color: #c9a66b !important;
}

/* ==========================================================================
   OVERRIDE ALL WHMCS bg-color-* CLASSES
   Unified: gold bg, white text. Hover: navy bg, white text.
   ========================================================================== */

.bg-color-gold,
.bg-color-green,
.bg-color-red,
.bg-color-blue,
.bg-color-orange,
.bg-color-pink,
.bg-color-purple,
.bg-color-lime,
.bg-color-magenta,
.bg-color-teal,
.bg-color-turquoise,
.bg-color-emerald,
.bg-color-amethyst,
.bg-color-wet-asphalt,
.bg-color-midnight-blue,
.bg-color-sun-flower,
.bg-color-pomegranate,
.bg-color-silver,
.bg-color-asbestos,
[class*='bg-color-'] {
    background-color: #c9a66b !important;
    color: #fff !important;
}

/* Buttons with bg-color — gold bg, white text */
.btn[class*='bg-color-'],
a.btn[class*='bg-color-'] {
    background-color: #c9a66b !important;
    border: 2px solid #c9a66b !important;
    color: #1a1a2e !important;
    font-weight: 600 !important;
}

/* Hover: navy bg, white text — same as My Services button experience */
.btn[class*='bg-color-']:hover,
a.btn[class*='bg-color-']:hover {
    background-color: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #fff !important;
}

/* Active/selected state — navy bg */
.btn[class*='bg-color-']:active,
.btn[class*='bg-color-'].active,
.btn[class*='bg-color-']:focus {
    background-color: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #fff !important;
}

/* Highlight bars on tiles — keep gold */
.tile .highlight,
.tile .highlight[class*='bg-color-'] {
    background-color: #c9a66b !important;
}

/* Register/Transfer toggle buttons — only in content area */
#main-body .btn-group .btn,
.primary-content .btn-group .btn,
.client-home-cards .btn-group .btn {
    background: #c9a66b !important;
    border-color: #c9a66b !important;
    color: #1a1a2e !important;
}

#main-body .btn-group .btn.active,
#main-body .btn-group .btn:active,
.primary-content .btn-group .btn.active,
.client-home-cards .btn-group .btn.active {
    background: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #fff !important;
}

#main-body .btn-group .btn:hover,
.primary-content .btn-group .btn:hover,
.client-home-cards .btn-group .btn:hover {
    background: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #fff !important;
}

/* ==========================================================================
   FORCE btn-success — gold with dark text (matching brand)
   These are the Register/Update buttons on clientarea
   ========================================================================== */

.btn-success,
a.btn-success,
button.btn-success,
.btn-success:focus,
.btn-success.focus,
.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
    background-color: #c9a66b !important;
    border-color: #c9a66b !important;
    color: #1a1a2e !important;
    box-shadow: none !important;
}

.btn-success:hover {
    background-color: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #fff !important;
}

.btn-success.disabled,
.btn-success:disabled {
    background-color: #c9a66b !important;
    border-color: #c9a66b !important;
    color: #1a1a2e !important;
    opacity: 0.5 !important;
}

/* ==========================================================================
   CART SIDEBAR & PANEL SIDEBAR
   ========================================================================== */

.cart-sidebar .list-group-item,
.panel-sidebar .list-group-item,
.card-sidebar .list-group-item,
a.list-group-item.list-group-item-action {
    color: #555 !important;
    background: #fff !important;
    border-color: #e0e0e0 !important;
}

.cart-sidebar .list-group-item:hover,
.panel-sidebar .list-group-item:hover,
.card-sidebar .list-group-item:hover,
a.list-group-item.list-group-item-action:hover {
    background: #f9f7f4 !important;
    color: #c9a66b !important;
}

.cart-sidebar .list-group-item.active,
.panel-sidebar .list-group-item.active,
.card-sidebar .list-group-item.active,
a.list-group-item.list-group-item-action.active {
    background: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #c9a66b !important;
}

.cart-sidebar .list-group-item.active i,
.panel-sidebar .list-group-item.active i,
a.list-group-item.list-group-item-action.active i {
    color: #c9a66b !important;
}

.cart-sidebar .list-group-item i,
.panel-sidebar .list-group-item i {
    color: #6b6b6b !important;
}

.cart-sidebar .list-group-item:hover i,
.panel-sidebar .list-group-item:hover i {
    color: #c9a66b !important;
}

/* Sidebar panel header */
.cart-sidebar .panel-heading,
.cart-sidebar .card-header,
.panel-sidebar .panel-heading,
.panel-sidebar .card-header {
    background: #1a1a2e !important;
    color: #fff !important;
    border-radius: 10px 10px 0 0 !important;
}

.cart-sidebar .panel-heading h3,
.cart-sidebar .card-header h3,
.panel-sidebar .panel-heading h3,
.panel-sidebar .card-header h3 {
    color: #fff !important;
}

.cart-sidebar .panel-heading i,
.cart-sidebar .card-header i {
    color: #c9a66b !important;
}

/* KB Articles badge — gold text on dark background */
#main-body .kb-category .card-body span.badge.badge-info {
    color: #c9a66b !important;
    background-color: #1a1a2e !important;
}


/* Fix homepage action icon buttons — white text on dark background */
.action-icon-btns a,
.action-icon-btns [class*='card-accent'] {
    color: #fff !important;
    background: #1a1a2e !important;
}
.action-icon-btns a figure + *,
.action-icon-btns a *:not(figure):not(i) {
    color: #fff !important;
}

/* Fix top cards button visibility */
.card-columns.home .card .btn-outline-primary {
    color: #c9a66b !important;
    border-color: #c9a66b !important;
    background: transparent !important;
}
.card-columns.home .card .btn-outline-primary:hover {
    background: #c9a66b !important;
    color: #fff !important;
}


/* Cart domain search area — dark blue with finder robot */
#order-standard_cart .domain-checker-container,
#order-standard_cart .domain-checker-bg,
.domain-checker-container,
.domain-checker-bg {
    background: linear-gradient(135deg, #1a1a2e 0%, #2d3561 60%, rgba(45,53,97,0.7) 100%) !important;
    color: #fff !important;
    position: relative;
    overflow: visible;
}
#order-standard_cart .domain-checker-bg::before,
.domain-checker-bg::before {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 40%;
    background: url('/assets/img/MrDomainfinder.jpg') right center / contain no-repeat;
    opacity: 0.8;
    pointer-events: none;
}
#order-standard_cart .domain-checker-container h2,
#order-standard_cart .domain-checker-container h3,
#order-standard_cart .domain-checker-container p,
#order-standard_cart .domain-checker-container label,
.domain-checker-container h2,
.domain-checker-container h3,
.domain-checker-container p,
.domain-checker-container label {
    color: #fff !important;
}
#order-standard_cart .domain-checker-container a,
.domain-checker-container a {
    color: #c9a66b !important;
}
#order-standard_cart .spotlight-tlds,
.spotlight-tlds {
    background: rgba(255,255,255,0.05) !important;
    border: none !important;
}
#order-standard_cart .spotlight-tld,
.spotlight-tld {
    background: #1a1a2e !important;
    border: 1px solid rgba(201,166,107,0.3) !important;
    color: #fff !important;
    font-family: 'Work Sans', sans-serif !important;
    border-radius: 8px !important;
}
#order-standard_cart .spotlight-tld .tld,
.spotlight-tld .tld {
    color: #c9a66b !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 1.3rem !important;
    font-weight: 700 !important;
}
#order-standard_cart .spotlight-tld .price,
.spotlight-tld .price,
#order-standard_cart .spotlight-tld span,
.spotlight-tld span {
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
}
#order-standard_cart .spotlight-tld .domain-lookup-price,
.spotlight-tld .domain-lookup-price {
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
}
/* Remove colored bottom borders from spotlight boxes */
#order-standard_cart .spotlight-tld-container [class*='bg-'],
.spotlight-tld [class*='bg-'],
.spotlight-tld .highlight,
.spotlight-tld-footer {
    background: transparent !important;
    border: none !important;
}
#order-standard_cart .spotlight-tld-hot,
.spotlight-tld-hot {
    background: #c9a66b !important;
    color: #1a1a2e !important;
}
@media (max-width: 768px) {
    #order-standard_cart .domain-checker-bg::before,
    .domain-checker-bg::before {
        display: none;
    }
}

/* Shift domain search form to the left to reveal robot */
#order-standard_cart .domain-checker-bg .row,
.domain-checker-bg .row {
    margin-right: 20% !important;
    margin-left: 2% !important;
    justify-content: flex-start !important;
}
@media (max-width: 768px) {
    #order-standard_cart .domain-checker-bg .row,
    .domain-checker-bg .row {
        margin-right: 0 !important;
    }
}


/* GLOBAL FIX — active sidebar item gold text */
.sidebar a.list-group-item.list-group-item-action.active,
.card-sidebar a.list-group-item.list-group-item-action.active,
a.list-group-item.list-group-item-action.active,
.list-group a.active,
a.list-group-item.active {
    background-color: #1a1a2e !important;
    border-color: #1a1a2e !important;
    color: #c9a66b !important;
}


/* Fix multiselect dropdown text inside domain checker */
.domain-checker-container .multiselect-container,
.domain-checker-bg .multiselect-container,
.domain-checker-container .dropdown-menu,
.domain-checker-bg .dropdown-menu {
    background: #fff !important;
    color: #333 !important;
}
.domain-checker-container .multiselect-container li a,
.domain-checker-container .multiselect-container li label,
.domain-checker-container .dropdown-menu li a,
.domain-checker-container .dropdown-menu a,
.domain-checker-bg .multiselect-container li a,
.domain-checker-bg .multiselect-container li label,
.domain-checker-bg .dropdown-menu li a,
.domain-checker-bg .dropdown-menu a {
    color: #333 !important;
}
.domain-checker-container .multiselect-container li a:hover,
.domain-checker-container .multiselect-container li label:hover,
.domain-checker-bg .multiselect-container li a:hover,
.domain-checker-bg .multiselect-container li label:hover {
    background: #f5f5f5 !important;
    color: #1a1a2e !important;
}
/* Thought bubble above MrDomainfinder — "I'll tell you a secret" */
.thought-bubble-wrap {
    position: absolute;
    right: 10%;
    top: -28px;
    z-index: 30;
}
.thought-bubble {
    position: relative;
    background: #fff;
    color: #1a1a2e;
    font-family: 'Work Sans', sans-serif;
    font-size: 1.05rem;
    font-weight: 700;
    padding: 0.7rem 1.4rem;
    border-radius: 22px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s, color 0.2s;
}
.thought-bubble:hover {
    background: #c9a66b;
    color: #1a1a2e;
}
/* Trailing thought circles */
.thought-dot {
    position: absolute;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
.thought-dot-1 {
    width: 14px; height: 14px;
    bottom: -18px; right: 30px;
}
.thought-dot-2 {
    width: 9px; height: 9px;
    bottom: -30px; right: 20px;
}
.thought-dot-3 {
    width: 5px; height: 5px;
    bottom: -38px; right: 14px;
}
/* Secret popup */
.thought-secret {
    display: none;
    position: absolute;
    bottom: auto;
    top: calc(100% + 18px);
    right: -40px;
    left: -600px;
    width: auto;
    background: #000 !important;
    color: #ffffff !important;
    font-family: 'Work Sans', sans-serif;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.7;
    padding: 1.4rem 1.8rem;
    border-radius: 14px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.4);
    white-space: normal;
    z-index: 40;
}
.thought-secret::after {
    content: '';
    position: absolute;
    top: -10px;
    right: 80px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #000;
}
.thought-secret a {
    color: #c9a66b !important;
    font-weight: 700;
    text-decoration: none;
}
.thought-secret a:hover {
    text-decoration: underline;
    color: #fff !important;
}
.thought-bubble-wrap:hover .thought-secret {
    color: #ffffff !important;
    display: block;
}
@media (max-width: 768px) {
    .thought-bubble-wrap { display: none; }
}