/* =====================================================================
   ContourHost brand layer for WHMCS (Twenty-X / twenty-one)
   Mirrors contourhost.com: dark navy canvas, Fraunces + Manrope,
   iris→sky gradient, frosted surfaces. Loaded last via a hook, so the
   theme's own files stay untouched. Remove the hook to roll back.
   ===================================================================== */

:root {
    --ch-bg: #070810;
    --ch-bg-2: #0B0D18;
    --ch-panel: #11131F;
    --ch-panel-2: #161929;
    --ch-surface: rgba(255, 255, 255, .035);
    --ch-surface-2: rgba(255, 255, 255, .06);
    --ch-border: rgba(255, 255, 255, .10);
    --ch-border-bright: rgba(255, 255, 255, .20);
    /* text: pure white for all main copy; secondary text kept bright for readability */
    --ch-txt: #FFFFFF;
    --ch-muted: #E4E3EE;
    --ch-faint: #BDBCCD;
    --ch-iris: #8B7CFF;
    --ch-sky: #56A8FF;
    --ch-aqua: #48E6D2;
    --ch-gold: #E9CD93;
    --ch-danger: #FF7A8A;
    --ch-success: #48E6A0;
    --ch-grad: linear-gradient(135deg, #9B8CFF 0%, #56A8FF 100%);
    --ch-grad-soft: linear-gradient(135deg, rgba(155, 140, 255, .18), rgba(86, 168, 255, .18));
    --ch-radius: 16px;
    --ch-radius-sm: 12px;
    --ch-shadow: 0 24px 60px -20px rgba(0, 0, 0, .7);
    --ch-shadow-sm: 0 12px 30px -12px rgba(0, 0, 0, .6);
}

/* ---------- base ---------- */
html body.primary-bg-color,
body.primary-bg-color {
    background: var(--ch-bg) !important;
    color: var(--ch-txt);
    font-family: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
    font-weight: 500;
    -webkit-font-smoothing: antialiased;
}
body.primary-bg-color::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(900px 500px at 85% -10%, rgba(139, 124, 255, .16), transparent 60%),
        radial-gradient(700px 420px at -10% 20%, rgba(86, 168, 255, .10), transparent 60%);
}
body.primary-bg-color section,
body.primary-bg-color #main-body,
body.primary-bg-color .body-background-20i,
body.primary-bg-color .main-content,
body.primary-bg-color .master-breadcrumb {
    background: transparent !important;
}
body.primary-bg-color,
body.primary-bg-color p,
body.primary-bg-color li,
body.primary-bg-color td,
body.primary-bg-color th,
body.primary-bg-color label,
body.primary-bg-color span,
body.primary-bg-color div {
    font-family: inherit;
}
/* keep Font Awesome icons on their icon font (the inherit rule above must not touch them) */
body.primary-bg-color .fas, body.primary-bg-color .fa-solid { font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free" !important; font-weight: 900 !important; }
body.primary-bg-color .far, body.primary-bg-color .fa-regular { font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free" !important; font-weight: 400 !important; }
body.primary-bg-color .fab, body.primary-bg-color .fa-brands { font-family: "Font Awesome 5 Brands", "Font Awesome 6 Brands" !important; font-weight: 400 !important; }
body.primary-bg-color .fal { font-family: "Font Awesome 5 Pro" !important; font-weight: 300 !important; }

/* mobile menu (hamburger) panel */
@media (max-width: 1199px) {
    body.primary-bg-color #mainNavbar,
    body.primary-bg-color .header .navbar-collapse {
        background: var(--ch-bg-2) !important;
        border-top: 1px solid var(--ch-border) !important;
        border-bottom: 1px solid var(--ch-border) !important;
        padding: 14px 16px 18px !important;
    }
    body.primary-bg-color #mainNavbar .nav-link,
    body.primary-bg-color #mainNavbar .navbar-nav > li > a {
        color: var(--ch-txt) !important;
        padding: 12px 6px !important;
        border-bottom: 1px solid var(--ch-border);
        font-size: 1.02rem;
    }
    body.primary-bg-color #mainNavbar .dropdown-menu {
        background: var(--ch-panel) !important;
        box-shadow: none !important;
        margin: 6px 0 10px !important;
    }
    body.primary-bg-color #mainNavbar .input-group,
    body.primary-bg-color #mainNavbar .search {
        background: var(--ch-bg) !important;
        border: 1px solid var(--ch-border) !important;
        border-radius: 12px !important;
        overflow: hidden;
    }
    body.primary-bg-color #mainNavbar .input-group .btn,
    body.primary-bg-color #mainNavbar .input-group-prepend .btn {
        background: transparent !important;
        border: 0 !important;
        color: var(--ch-muted) !important;
        box-shadow: none !important;
    }
    body.primary-bg-color #mainNavbar .input-group .form-control { border: 0 !important; background: transparent !important; }
    body.primary-bg-color #mainNavbar .login-btn-20i,
    body.primary-bg-color #mainNavbar .register-btn-20i { display: inline-flex !important; margin: 14px 8px 0 0 !important; }
    body.primary-bg-color .header .navbar-toggler,
    body.primary-bg-color .header button[data-target="#mainNavbar"] { color: var(--ch-txt) !important; border: 1px solid var(--ch-border) !important; border-radius: 10px !important; }
}

body.primary-bg-color h1, body.primary-bg-color h2, body.primary-bg-color h3,
body.primary-bg-color h4, body.primary-bg-color .h1, body.primary-bg-color .h2,
body.primary-bg-color .h3, body.primary-bg-color .headline, body.primary-bg-color .card-title,
body.primary-bg-color .panel-title, body.primary-bg-color .modal-title,
body.primary-bg-color #order-premium_comparison h2,
body.primary-bg-color .price-table h4 {
    font-family: 'Fraunces', Georgia, serif !important;
    font-weight: 600 !important;
    letter-spacing: -.01em;
    color: var(--ch-txt) !important;
}
body.primary-bg-color h5, body.primary-bg-color h6,
body.primary-bg-color strong, body.primary-bg-color b { color: var(--ch-txt); }
body.primary-bg-color .text-muted, body.primary-bg-color small,
body.primary-bg-color .small, body.primary-bg-color .help-block,
body.primary-bg-color .form-text { color: var(--ch-muted) !important; }
body.primary-bg-color a { color: #A99DFF; }
body.primary-bg-color a:hover { color: #C9C1FF; text-decoration: none; }
body.primary-bg-color hr { border-color: var(--ch-border); }
::selection { background: rgba(139, 124, 255, .35); color: #fff; }

/* ---------- header / navigation ---------- */
body.primary-bg-color .header,
body.primary-bg-color header.header,
body.primary-bg-color .header .navbar,
body.primary-bg-color .header .topbar,
body.primary-bg-color .navbar-light {
    background: rgba(7, 8, 16, .78) !important;
    backdrop-filter: saturate(150%) blur(14px);
    -webkit-backdrop-filter: saturate(150%) blur(14px);
    border-bottom: 1px solid var(--ch-border) !important;
    box-shadow: none !important;
}
body.primary-bg-color .header { position: sticky; top: 0; z-index: 1030; }
body.primary-bg-color .header .logo-img { max-height: 40px; width: auto; }
body.primary-bg-color .header .nav-link,
body.primary-bg-color .header .navbar-nav > li > a,
body.primary-bg-color .header a.dropdown-toggle {
    color: var(--ch-txt) !important;
    font-weight: 600 !important;
    font-size: .95rem;
    transition: color .2s;
}
body.primary-bg-color .header .nav-link:hover,
body.primary-bg-color .header .navbar-nav > li > a:hover,
body.primary-bg-color .header .active > a,
body.primary-bg-color .header a.dropdown-toggle:hover { color: var(--ch-txt) !important; }
body.primary-bg-color .header .fas,
body.primary-bg-color .header .far { color: var(--ch-muted); }
body.primary-bg-color .header .badge,
body.primary-bg-color .badge-info { background: var(--ch-grad) !important; color: #0a0a16 !important; }
body.primary-bg-color .dropdown-menu {
    background: var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: var(--ch-radius-sm) !important;
    box-shadow: var(--ch-shadow-sm) !important;
    padding: 8px;
}
body.primary-bg-color .dropdown-item,
body.primary-bg-color .dropdown-menu a {
    color: var(--ch-muted) !important;
    border-radius: 8px;
    font-weight: 600;
}
body.primary-bg-color .dropdown-item:hover,
body.primary-bg-color .dropdown-item:focus,
body.primary-bg-color .dropdown-menu a:hover {
    background: var(--ch-surface-2) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color .dropdown-divider { border-color: var(--ch-border); }
body.primary-bg-color .navbar-toggler { border-color: var(--ch-border); }
body.primary-bg-color .navbar-toggler-icon { filter: invert(1); }

/* ---------- buttons ---------- */
body.primary-bg-color .btn {
    font-family: 'Manrope', sans-serif !important;
    font-weight: 700 !important;
    border-radius: var(--ch-radius-sm) !important;
    transition: transform .25s cubic-bezier(.16, 1, .3, 1), box-shadow .25s, background .25s;
}
body.primary-bg-color .btn-primary,
body.primary-bg-color .btn-success,
body.primary-bg-color .btn-order-now,
body.primary-bg-color .order-button,
body.primary-bg-color a.order-button,
body.primary-bg-color #btnCompleteOrder,
body.primary-bg-color #checkout,
body.primary-bg-color .btn-checkout,
body.primary-bg-color .domain-checker-container .btn,
body.primary-bg-color #btnCheckAvailability,
body.primary-bg-color .btn-info {
    background: var(--ch-grad) !important;
    border: 1px solid transparent !important;
    color: #0a0a16 !important;
    box-shadow: 0 10px 30px -8px rgba(139, 124, 255, .55) !important;
}
body.primary-bg-color .btn-primary:hover,
body.primary-bg-color .btn-success:hover,
body.primary-bg-color .order-button:hover,
body.primary-bg-color #btnCompleteOrder:hover,
body.primary-bg-color #checkout:hover,
body.primary-bg-color .btn-info:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 40px -10px rgba(139, 124, 255, .7) !important;
    color: #0a0a16 !important;
}
body.primary-bg-color .btn-default,
body.primary-bg-color .btn-secondary,
body.primary-bg-color .btn-light,
body.primary-bg-color .btn-outline-primary,
body.primary-bg-color .btn-outline-secondary,
body.primary-bg-color .btn-link.btn-default {
    background: var(--ch-surface-2) !important;
    border: 1px solid var(--ch-border) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color .btn-default:hover,
body.primary-bg-color .btn-secondary:hover,
body.primary-bg-color .btn-light:hover,
body.primary-bg-color .btn-outline-primary:hover,
body.primary-bg-color .btn-outline-secondary:hover {
    background: rgba(255, 255, 255, .10) !important;
    border-color: var(--ch-border-bright) !important;
}
body.primary-bg-color .btn-danger { background: rgba(255, 122, 138, .15) !important; border: 1px solid rgba(255, 122, 138, .45) !important; color: #FFB3BD !important; }
body.primary-bg-color .btn-warning { background: rgba(233, 205, 147, .15) !important; border: 1px solid rgba(233, 205, 147, .45) !important; color: var(--ch-gold) !important; }
body.primary-bg-color .btn-link { color: #A99DFF !important; }
body.primary-bg-color .header .btn-primary,
body.primary-bg-color .header .btn-default { padding: .45rem 1.1rem; }
/* Twenty-X header buttons: "Sign in" ghost + "Register" gradient, like the website */
body.primary-bg-color .login-btn-20i,
body.primary-bg-color .register-btn-20i {
    border-radius: 12px !important;
    font-weight: 700 !important;
    padding: .55rem 1.2rem !important;
    transition: transform .25s cubic-bezier(.16, 1, .3, 1), box-shadow .25s, background .25s;
}
body.primary-bg-color .login-btn-20i {
    background: transparent !important;
    border: 1px solid var(--ch-border) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color .login-btn-20i:hover { background: var(--ch-surface-2) !important; color: var(--ch-txt) !important; }
body.primary-bg-color .register-btn-20i {
    background: var(--ch-grad) !important;
    border: 1px solid transparent !important;
    color: #0a0a16 !important;
    box-shadow: 0 10px 30px -8px rgba(139, 124, 255, .55) !important;
}
body.primary-bg-color .register-btn-20i:hover { transform: translateY(-2px); color: #0a0a16 !important; }

/* ---------- cards / panels / sidebars ---------- */
body.primary-bg-color .card,
body.primary-bg-color .panel,
body.primary-bg-color .panel-default,
body.primary-bg-color .well,
body.primary-bg-color .tile,
body.primary-bg-color .client-home-cards .card,
body.primary-bg-color .sub-heading,
body.primary-bg-color .view-cart-items,
body.primary-bg-color .order-summary,
body.primary-bg-color .summary-container,
body.primary-bg-color .product-info,
body.primary-bg-color .domain-selection-options .option,
body.primary-bg-color .addon-products .panel-addon,
body.primary-bg-color .sub-heading span {
    background: var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: var(--ch-radius) !important;
    color: var(--ch-txt) !important;
    box-shadow: var(--ch-shadow-sm);
}
body.primary-bg-color .card-header,
body.primary-bg-color .panel-heading,
body.primary-bg-color .card-footer,
body.primary-bg-color .panel-footer {
    background: var(--ch-surface) !important;
    border-color: var(--ch-border) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color .card-header:first-child { border-radius: var(--ch-radius) var(--ch-radius) 0 0 !important; }
body.primary-bg-color .card-body,
body.primary-bg-color .panel-body { background: transparent !important; color: var(--ch-txt); }
body.primary-bg-color .list-group-item,
body.primary-bg-color .list-group-item-action {
    background: transparent !important;
    border-color: var(--ch-border) !important;
    color: var(--ch-muted) !important;
    font-weight: 600;
}
body.primary-bg-color .list-group-item:hover,
body.primary-bg-color .list-group-item-action:hover { background: var(--ch-surface-2) !important; color: var(--ch-txt) !important; }
body.primary-bg-color .list-group-item.active {
    background: var(--ch-grad-soft) !important;
    border-color: rgba(139, 124, 255, .45) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color .card-sidebar .fas,
body.primary-bg-color .panel-sidebar .fas { color: var(--ch-iris); }

/* ---------- forms ---------- */
body.primary-bg-color .form-control,
body.primary-bg-color .custom-select,
body.primary-bg-color select,
body.primary-bg-color textarea,
body.primary-bg-color input[type="text"],
body.primary-bg-color input[type="email"],
body.primary-bg-color input[type="password"],
body.primary-bg-color input[type="tel"],
body.primary-bg-color input[type="number"],
body.primary-bg-color .input-group-text,
body.primary-bg-color .selectize-input {
    background-color: var(--ch-bg-2) !important;
    border: 1px solid var(--ch-border) !important;
    color: var(--ch-txt) !important;
    border-radius: 10px !important;
}
body.primary-bg-color .input-group > .form-control:not(:last-child),
body.primary-bg-color .input-group > .input-group-prepend > .input-group-text { border-radius: 10px !important; }
body.primary-bg-color .form-control::placeholder { color: var(--ch-faint) !important; }
body.primary-bg-color .form-control:focus,
body.primary-bg-color .custom-select:focus,
body.primary-bg-color select:focus,
body.primary-bg-color textarea:focus {
    border-color: rgba(139, 124, 255, .7) !important;
    box-shadow: 0 0 0 3px rgba(139, 124, 255, .22) !important;
}
body.primary-bg-color .input-group-text { color: var(--ch-muted) !important; }
/* the theme hard-codes dark label colours (#474747 / #031B4E) */
body.primary-bg-color label,
body.primary-bg-color .form-control-label,
body.primary-bg-color .col-form-label,
body.primary-bg-color .control-label,
body.primary-bg-color .domain-selection-options .option label,
body.primary-bg-color .radio label,
body.primary-bg-color .checkbox label { color: var(--ch-txt) !important; }
/* page heading strips (e.g. "Choose a Domain...") */
body.primary-bg-color .header-lined,
body.primary-bg-color .header-lined h1,
body.primary-bg-color .header-lined h2 {
    background: transparent !important;
    color: var(--ch-txt) !important;
    border-color: var(--ch-border) !important;
}
body.primary-bg-color select option { background: var(--ch-panel); color: var(--ch-txt); }
body.primary-bg-color .custom-control-label::before,
body.primary-bg-color .iCheck-helper + label::before { background: var(--ch-bg-2); border-color: var(--ch-border-bright); }
body.primary-bg-color .custom-control-input:checked ~ .custom-control-label::before { background: var(--ch-grad); border-color: transparent; }
body.primary-bg-color .icheckbox_square-blue,
body.primary-bg-color .iradio_square-blue { filter: hue-rotate(25deg) saturate(1.2); }
/* Browser autofill / suggestion highlight paints fields pale while typing.
   Keep them dark in every autofill state (filled, hover, focus, preview). */
body.primary-bg-color { color-scheme: dark; }
body.primary-bg-color input:-webkit-autofill,
body.primary-bg-color input:-webkit-autofill:hover,
body.primary-bg-color input:-webkit-autofill:focus,
body.primary-bg-color input:-webkit-autofill:active,
body.primary-bg-color textarea:-webkit-autofill,
body.primary-bg-color select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px var(--ch-bg-2) inset !important;
    box-shadow: 0 0 0 1000px var(--ch-bg-2) inset !important;
    -webkit-text-fill-color: var(--ch-txt) !important;
    caret-color: var(--ch-txt);
    transition: background-color 99999s ease-out 0s;
}
body.primary-bg-color input:autofill {
    box-shadow: 0 0 0 1000px var(--ch-bg-2) inset !important;
    -webkit-text-fill-color: var(--ch-txt) !important;
}
body.primary-bg-color .form-control:focus,
body.primary-bg-color input.form-control:focus { background-color: var(--ch-bg-2) !important; color: var(--ch-txt) !important; }

/* ---------- tables ---------- */
body.primary-bg-color .table,
body.primary-bg-color table.dataTable {
    color: var(--ch-txt) !important;
    background: transparent !important;
}
body.primary-bg-color .table th,
body.primary-bg-color .table td,
body.primary-bg-color table.dataTable th,
body.primary-bg-color table.dataTable td { border-color: var(--ch-border) !important; }
body.primary-bg-color .table thead th,
body.primary-bg-color table.dataTable thead th {
    background: var(--ch-surface) !important;
    color: var(--ch-muted) !important;
    font-weight: 700;
}
body.primary-bg-color .table-striped tbody tr:nth-of-type(odd),
body.primary-bg-color table.dataTable tbody tr.odd { background: rgba(255, 255, 255, .02) !important; }
body.primary-bg-color .table-hover tbody tr:hover,
body.primary-bg-color table.dataTable tbody tr:hover { background: var(--ch-surface-2) !important; }
body.primary-bg-color .dataTables_wrapper .dataTables_info,
body.primary-bg-color .dataTables_wrapper label { color: var(--ch-muted) !important; }
body.primary-bg-color .page-link { background: var(--ch-panel) !important; border-color: var(--ch-border) !important; color: var(--ch-muted) !important; }
body.primary-bg-color .page-item.active .page-link { background: var(--ch-grad) !important; color: #0a0a16 !important; border-color: transparent !important; }

/* ---------- alerts / labels / modals ---------- */
body.primary-bg-color .alert {
    border-radius: var(--ch-radius-sm) !important;
    border: 1px solid var(--ch-border) !important;
    background: var(--ch-surface-2) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color .alert-success { border-color: rgba(72, 230, 160, .45) !important; background: rgba(72, 230, 160, .08) !important; }
body.primary-bg-color .alert-danger { border-color: rgba(255, 122, 138, .45) !important; background: rgba(255, 122, 138, .08) !important; }
body.primary-bg-color .alert-warning { border-color: rgba(233, 205, 147, .45) !important; background: rgba(233, 205, 147, .08) !important; }
body.primary-bg-color .alert-info { border-color: rgba(86, 168, 255, .45) !important; background: rgba(86, 168, 255, .08) !important; }
body.primary-bg-color .label-success, body.primary-bg-color .status-active, body.primary-bg-color .badge-success { background: rgba(72, 230, 160, .18) !important; color: var(--ch-success) !important; }
body.primary-bg-color .label-danger, body.primary-bg-color .status-suspended, body.primary-bg-color .status-terminated, body.primary-bg-color .badge-danger { background: rgba(255, 122, 138, .18) !important; color: var(--ch-danger) !important; }
body.primary-bg-color .label-warning, body.primary-bg-color .status-pending, body.primary-bg-color .badge-warning { background: rgba(233, 205, 147, .18) !important; color: var(--ch-gold) !important; }
body.primary-bg-color .modal-content {
    background: var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: var(--ch-radius) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color .modal-header,
body.primary-bg-color .modal-footer { border-color: var(--ch-border) !important; }
body.primary-bg-color .close { color: var(--ch-txt) !important; text-shadow: none; opacity: .7; }
body.primary-bg-color .breadcrumb { background: transparent !important; }
body.primary-bg-color .breadcrumb-item, body.primary-bg-color .breadcrumb-item a { color: var(--ch-faint) !important; }
body.primary-bg-color .breadcrumb-item.active { color: var(--ch-muted) !important; }
body.primary-bg-color .nav-tabs { border-color: var(--ch-border); }
body.primary-bg-color .nav-tabs .nav-link { color: var(--ch-muted); border-radius: 10px 10px 0 0; }
body.primary-bg-color .nav-tabs .nav-link.active {
    background: var(--ch-panel) !important;
    color: var(--ch-txt) !important;
    border-color: var(--ch-border) var(--ch-border) var(--ch-panel) !important;
}
body.primary-bg-color .progress { background: var(--ch-surface-2); }
body.primary-bg-color .progress-bar { background: var(--ch-grad); }

/* ---------- order form: premium comparison (plans page) ---------- */
body.primary-bg-color #order-premium_comparison .main-container,
body.primary-bg-color #order-premium_comparison .txt-center,
body.primary-bg-color #order-premium_comparison .price-table-container { background: transparent !important; }
body.primary-bg-color #order-premium_comparison .txt-center h3 {
    font-family: 'Fraunces', Georgia, serif !important;
    font-weight: 600 !important;
    font-size: clamp(2rem, 4vw, 3rem) !important;
    letter-spacing: -.02em;
    color: var(--ch-txt) !important;
}
body.primary-bg-color #order-premium_comparison .txt-center h4,
body.primary-bg-color #order-premium_comparison .txt-center h5 { color: var(--ch-muted) !important; font-family: 'Manrope', sans-serif !important; font-weight: 500 !important; }
body.primary-bg-color #order-premium_comparison .price-table {
    background: var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: 22px !important;
    overflow: hidden;
    box-shadow: var(--ch-shadow) !important;
    transition: transform .4s cubic-bezier(.16, 1, .3, 1), border-color .3s;
}
body.primary-bg-color #order-premium_comparison .price-table-container > ul > li,
body.primary-bg-color #order-premium_comparison li { color: var(--ch-txt) !important; }
body.primary-bg-color #order-premium_comparison .price-table:hover { transform: translateY(-4px); border-color: var(--ch-border-bright) !important; }
body.primary-bg-color #order-premium_comparison .price-table .top-head,
body.primary-bg-color #order-premium_comparison .price-table .top-area,
body.primary-bg-color #order-premium_comparison .price-table .price-area {
    background: transparent !important;
    border: 0 !important;
}
body.primary-bg-color #order-premium_comparison .price-table .top-area h4 { font-size: 1.55rem !important; padding-top: 6px; }
body.primary-bg-color #order-premium_comparison .price-table .price {
    color: var(--ch-txt) !important;
    font-family: 'Fraunces', serif !important;
    font-weight: 600 !important;
}
body.primary-bg-color #order-premium_comparison .price-table .price span,
body.primary-bg-color #order-premium_comparison .price-table .price small { color: var(--ch-muted) !important; font-family: 'Manrope', sans-serif !important; }
body.primary-bg-color #order-premium_comparison .price-table ul,
body.primary-bg-color #order-premium_comparison .price-table ul li {
    background: transparent !important;
    color: var(--ch-muted) !important;
    border-color: var(--ch-border) !important;
}
body.primary-bg-color #order-premium_comparison .price-table ul li strong { color: var(--ch-txt) !important; }
body.primary-bg-color #order-premium_comparison .price-table .popular-plan,
body.primary-bg-color #order-premium_comparison .price-table .popular-plan * {
    background: var(--ch-grad) !important;
    color: #0a0a16 !important;
    font-weight: 800;
    letter-spacing: .08em;
}
body.primary-bg-color #order-premium_comparison .price-table.popular,
body.primary-bg-color #order-premium_comparison li.popular .price-table {
    border-color: rgba(139, 124, 255, .55) !important;
    box-shadow: 0 30px 70px -25px rgba(139, 124, 255, .55) !important;
}
body.primary-bg-color #order-premium_comparison .included-features,
body.primary-bg-color #order-premium_comparison .included-features .title,
body.primary-bg-color #order-premium_comparison .included-features li { background: transparent !important; color: var(--ch-muted) !important; border-color: var(--ch-border) !important; }
body.primary-bg-color #order-premium_comparison .included-features .title span { background: var(--ch-bg) !important; color: var(--ch-muted) !important; border-color: var(--ch-border) !important; }
body.primary-bg-color #order-premium_comparison .included-features li i { color: var(--ch-aqua) !important; }

/* ---------- order form: standard cart (configure / cart / checkout) ---------- */
body.primary-bg-color #order-standard_cart .header-lined h1,
body.primary-bg-color #order-standard_cart h1 { color: var(--ch-txt) !important; }
/* section titles ("Personal Information", "Billing Address", "Configure"...):
   plain heading + thin divider, so they read well on any background */
body.primary-bg-color #order-standard_cart .sub-heading {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid var(--ch-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    height: auto !important;
    margin: 6px 0 18px !important;
    padding: 0 0 10px !important;
    text-align: left !important;
}
body.primary-bg-color #order-standard_cart .sub-heading span,
body.primary-bg-color #order-standard_cart .sub-heading .primary-bg-color {
    background: transparent !important;
    color: var(--ch-txt) !important;
    font-family: 'Fraunces', Georgia, serif !important;
    font-weight: 600 !important;
    font-size: 1.12rem !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
}
body.primary-bg-color #order-standard_cart .sub-heading:before,
body.primary-bg-color #order-standard_cart .sub-heading::before,
body.primary-bg-color #order-standard_cart .sub-heading:after,
body.primary-bg-color #order-standard_cart .sub-heading::after { display: none !important; }
/* checkout: the theme paints these sections white */
body.primary-bg-color #order-standard_cart #frmCheckout .row,
body.primary-bg-color #order-standard_cart #frmCheckout p,
body.primary-bg-color #order-standard_cart .marketing-email-optin,
body.primary-bg-color #order-standard_cart .marketing-email-optin * { background-color: transparent !important; }
body.primary-bg-color #order-standard_cart #containerNewUserSignup,
body.primary-bg-color #order-standard_cart #containerExistingUserSignin,
body.primary-bg-color #order-standard_cart #containerNewUserSecurity,
body.primary-bg-color #order-standard_cart #paymentGatewaysContainer,
body.primary-bg-color #order-standard_cart .marketing-email-optin,
body.primary-bg-color #order-standard_cart #applyCreditContainer,
body.primary-bg-color #order-standard_cart #domainRegistrantInputFields,
body.primary-bg-color #order-standard_cart .checkout-security-msg {
    background: var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: var(--ch-radius) !important;
    padding: 22px 24px !important;
    margin-bottom: 18px !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color #order-standard_cart #paymentGatewaysContainer > p,
body.primary-bg-color #order-standard_cart #paymentGatewaysContainer .text-muted,
body.primary-bg-color #order-standard_cart #paymentGatewaysContainer .small-text { color: var(--ch-muted) !important; }
body.primary-bg-color #order-standard_cart #paymentGatewaysContainer label,
body.primary-bg-color #order-standard_cart .marketing-email-optin h4,
body.primary-bg-color #order-standard_cart .marketing-email-optin p { color: var(--ch-txt) !important; }
/* payment methods as selectable cards */
body.primary-bg-color #paymentGatewaysContainer > p.text-muted {
    font-family: 'Fraunces', Georgia, serif !important;
    font-size: 1.15rem !important;
    color: var(--ch-txt) !important;
    margin-bottom: 16px !important;
    text-align: left;
}
body.primary-bg-color #paymentGatewaysContainer > .text-center {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    text-align: left !important;
}
@media (max-width: 991px) {
    body.primary-bg-color #paymentGatewaysContainer > .text-center { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    body.primary-bg-color #paymentGatewaysContainer > .text-center { grid-template-columns: 1fr; }
}
/* descriptions hidden in the tabs; the selected one is shown in #chPayInfo below */
body.primary-bg-color #paymentGatewaysContainer.ch-pay-tabs label.radio-inline > div:not([class*="iradio"]) { display: none !important; }
body.primary-bg-color #paymentGatewaysContainer.ch-pay-tabs label.radio-inline {
    display: flex !important;
    align-items: center;
    min-height: 64px;
    padding: 14px 16px 14px 52px !important;
}
body.primary-bg-color #paymentGatewaysContainer.ch-pay-tabs label.radio-inline .iradio_square-blue { top: 50%; transform: translateY(-50%); }
body.primary-bg-color #paymentGatewaysContainer.ch-pay-tabs label.radio-inline:has(.checked)::after { display: none; }
body.primary-bg-color #paymentGatewaysContainer.ch-pay-tabs label.radio-inline:has(.checked) { padding-right: 16px !important; }
body.primary-bg-color #chPayInfo {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-top: 14px;
    padding: 16px 18px;
    border-radius: 14px;
    background: var(--ch-grad-soft);
    border: 1px solid rgba(139, 124, 255, .35);
    color: var(--ch-muted);
    font-size: .92rem;
    line-height: 1.6;
}
body.primary-bg-color #chPayInfo strong { display: block; color: var(--ch-txt); font-size: 1rem; margin-bottom: 2px; }
body.primary-bg-color #chPayInfo .ch-ico {
    flex: 0 0 34px; height: 34px; border-radius: 10px;
    background: var(--ch-grad); color: #0a0a16;
    display: grid; place-items: center; font-weight: 800;
}
body.primary-bg-color #paymentGatewaysContainer label.radio-inline {
    position: relative;
    display: block !important;
    margin: 0 !important;
    padding: 18px 20px 18px 56px !important;
    background: var(--ch-bg-2) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: 16px !important;
    color: var(--ch-txt) !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 1.02rem !important;
    font-weight: 700 !important;
    line-height: 1.35;
    cursor: pointer;
    transition: border-color .25s, background .25s, box-shadow .25s, transform .25s cubic-bezier(.16, 1, .3, 1);
}
body.primary-bg-color #paymentGatewaysContainer label.radio-inline:hover {
    border-color: var(--ch-border-bright) !important;
    background: var(--ch-panel-2) !important;
    transform: translateY(-2px);
}
body.primary-bg-color #paymentGatewaysContainer label.radio-inline > div:not([class*="iradio"]) {
    margin: 6px 0 0 !important;
    padding: 0 !important;
    color: var(--ch-muted) !important;
    font-size: .86rem !important;
    font-weight: 500 !important;
    line-height: 1.55;
}
body.primary-bg-color #paymentGatewaysContainer label.radio-inline .iradio_square-blue {
    position: absolute !important;
    left: 18px;
    top: 18px;
    margin: 0 !important;
}
/* selected card */
body.primary-bg-color #paymentGatewaysContainer label.radio-inline:has(.checked),
body.primary-bg-color #paymentGatewaysContainer label.radio-inline:has(input:checked) {
    border-color: transparent !important;
    background:
        linear-gradient(var(--ch-panel-2), var(--ch-panel-2)) padding-box,
        var(--ch-grad) border-box !important;
    border: 1.5px solid transparent !important;
    box-shadow: 0 18px 40px -18px rgba(139, 124, 255, .6) !important;
}
body.primary-bg-color #paymentGatewaysContainer label.radio-inline:has(.checked)::after,
body.primary-bg-color #paymentGatewaysContainer label.radio-inline:has(input:checked)::after {
    content: "Selected";
    position: absolute;
    top: 14px;
    right: 14px;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--ch-grad);
    color: #0a0a16;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
body.primary-bg-color #paymentGatewaysContainer label.radio-inline:has(.checked) { padding-right: 96px !important; }
body.primary-bg-color .bootstrap-switch { background: var(--ch-bg-2) !important; border-color: var(--ch-border) !important; }
body.primary-bg-color .bootstrap-switch .bootstrap-switch-handle-off,
body.primary-bg-color .bootstrap-switch .bootstrap-switch-label { background: var(--ch-surface-2) !important; color: var(--ch-muted) !important; }
body.primary-bg-color .bootstrap-switch .bootstrap-switch-handle-on { background: var(--ch-grad) !important; color: #0a0a16 !important; }
body.primary-bg-color .iti__country-list,
body.primary-bg-color .iti-flag + .iti-arrow { background: var(--ch-panel) !important; color: var(--ch-txt) !important; }
body.primary-bg-color .iti__country-list .iti__highlight { background: var(--ch-surface-2) !important; }
body.primary-bg-color .icheckbox_square-blue,
body.primary-bg-color .iradio_square-blue { background-color: transparent; }
/* Order summary (configure product, cart, checkout): one card, gradient title bar.
   The theme wraps it in a white #orderSummary box and styles the inner container
   as a second box, so flatten both and style only .order-summary. */
body.primary-bg-color #order-standard_cart #orderSummary,
body.primary-bg-color #orderSummary {
    background: transparent !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
}
body.primary-bg-color #order-standard_cart .order-summary {
    background: var(--ch-panel) !important;
    border: 1px solid rgba(139, 124, 255, .35) !important;
    border-radius: 20px !important;
    overflow: hidden;
    padding: 0 !important;
    margin-bottom: 16px !important;
    box-shadow: 0 30px 70px -30px rgba(139, 124, 255, .45) !important;
}
body.primary-bg-color #order-standard_cart .order-summary h2 {
    background: var(--ch-grad) !important;
    color: #0a0a16 !important;
    font-family: 'Fraunces', serif !important;
    font-size: 1.45rem !important;
    margin: 0 !important;
    padding: 18px 22px !important;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: left;
}
body.primary-bg-color #order-standard_cart .order-summary .summary-container {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 18px 22px 22px !important;
    margin: 0 !important;
}
body.primary-bg-color #order-standard_cart .order-summary .product-name { color: var(--ch-txt) !important; font-weight: 700; font-size: 1.02rem; }
body.primary-bg-color #order-standard_cart .order-summary .product-group { color: var(--ch-muted) !important; }
body.primary-bg-color #order-standard_cart .order-summary .float-left,
body.primary-bg-color #order-standard_cart .order-summary .pull-left { color: var(--ch-muted) !important; }
body.primary-bg-color #order-standard_cart .order-summary .float-right,
body.primary-bg-color #order-standard_cart .order-summary .pull-right { color: var(--ch-txt) !important; font-weight: 600; }
body.primary-bg-color #order-standard_cart .order-summary .summary-totals,
body.primary-bg-color #order-standard_cart .order-summary .subtotal,
body.primary-bg-color #order-standard_cart .order-summary .bordered-totals,
body.primary-bg-color #order-standard_cart .order-summary hr {
    border-color: var(--ch-border) !important;
    border-top-color: var(--ch-border) !important;
    border-bottom-color: var(--ch-border) !important;
}
body.primary-bg-color #order-standard_cart .order-summary .total-due-today { text-align: left !important; padding-top: 6px; }
body.primary-bg-color #order-standard_cart .order-summary .total-due-today span:not(.amt) {
    color: var(--ch-muted) !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}
body.primary-bg-color #order-standard_cart .order-summary .total-due-today .amt,
body.primary-bg-color #order-standard_cart .order-summary .amt {
    color: var(--ch-txt) !important;
    font-family: 'Fraunces', serif !important;
    font-weight: 600 !important;
}
body.primary-bg-color #order-standard_cart .order-summary .btn-checkout,
body.primary-bg-color #order-standard_cart .order-summary #checkout { width: 100%; margin-top: 14px; }
body.primary-bg-color #order-standard_cart #btnCompleteProductConfig { width: 100%; padding: 14px 18px; font-size: 1.05rem; }
/* cart items: price column + empty-cart button */
body.primary-bg-color #order-standard_cart .view-cart-items .item-price span,
body.primary-bg-color #order-standard_cart .view-cart-items .item-price { color: var(--ch-txt) !important; }
body.primary-bg-color #order-standard_cart .view-cart-items .item-price .cycle,
body.primary-bg-color #order-standard_cart .view-cart-items .renewal { color: var(--ch-muted) !important; }
body.primary-bg-color #order-standard_cart .empty-cart .btn,
body.primary-bg-color #order-standard_cart .btn-link.btn-xs {
    background: var(--ch-surface-2) !important;
    border: 1px solid var(--ch-border) !important;
    color: var(--ch-muted) !important;
}
body.primary-bg-color #order-standard_cart .product-info,
body.primary-bg-color #order-standard_cart .field-container,
body.primary-bg-color #order-standard_cart .view-cart-items-header,
body.primary-bg-color #order-standard_cart .view-cart-items .item,
body.primary-bg-color #order-standard_cart .domain-checker-container,
body.primary-bg-color #order-standard_cart .domain-selection-options .option,
body.primary-bg-color #order-standard_cart .panel-addon,
body.primary-bg-color #order-standard_cart .account,
body.primary-bg-color #order-standard_cart .cc-input-container,
body.primary-bg-color #order-standard_cart .alert-default {
    background: var(--ch-panel) !important;
    border-color: var(--ch-border) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color #order-standard_cart .view-cart-items-header {
    background: var(--ch-grad-soft) !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color #order-standard_cart .domain-selection-options .option-selected {
    background: var(--ch-grad-soft) !important;
    border-color: rgba(139, 124, 255, .55) !important;
}
body.primary-bg-color #order-standard_cart .product-info .product-title,
body.primary-bg-color #order-standard_cart .item-title,
body.primary-bg-color #order-standard_cart .item-price { color: var(--ch-txt) !important; }
body.primary-bg-color #order-standard_cart .item-group,
body.primary-bg-color #order-standard_cart .item-domain,
body.primary-bg-color #order-standard_cart .cycle { color: var(--ch-muted) !important; }
body.primary-bg-color #order-standard_cart .panel-addon-selected { border-color: rgba(139, 124, 255, .6) !important; }
body.primary-bg-color #order-standard_cart .panel-add { background: var(--ch-grad) !important; color: #0a0a16 !important; }
body.primary-bg-color #order-standard_cart .domain-checker-available { color: var(--ch-success) !important; }
body.primary-bg-color #order-standard_cart .domain-checker-unavailable { color: var(--ch-danger) !important; }
body.primary-bg-color #order-standard_cart .domain-price .price { color: var(--ch-txt) !important; }
body.primary-bg-color #order-standard_cart .spotlight-tld,
body.primary-bg-color #order-standard_cart .suggested-domains .panel-heading { background: var(--ch-panel-2) !important; color: var(--ch-txt) !important; border-color: var(--ch-border) !important; }

/* domain search hero + promo code box (theme paints these bright blue) */
body.primary-bg-color .domain-checker-bg,
body.primary-bg-color #order-standard_cart .domain-checker-bg {
    background: radial-gradient(600px 260px at 85% 0%, rgba(139, 124, 255, .28), transparent 70%),
                radial-gradient(520px 240px at 0% 100%, rgba(86, 168, 255, .18), transparent 70%),
                var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: 22px !important;
    box-shadow: var(--ch-shadow) !important;
}
body.primary-bg-color #order-standard_cart .view-cart-tabs {
    background: var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: var(--ch-radius) !important;
}
body.primary-bg-color #order-standard_cart .view-cart-tabs .nav-tabs { border: 0 !important; }
body.primary-bg-color #order-standard_cart .view-cart-tabs .nav-link,
body.primary-bg-color #order-standard_cart .view-cart-tabs .nav-tabs > li > a {
    background: var(--ch-surface-2) !important;
    color: var(--ch-txt) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: 10px !important;
}
body.primary-bg-color #order-standard_cart .view-cart-tabs .tab-content { background: transparent !important; }
body.primary-bg-color #order-standard_cart .view-cart-items-header [class*="col-"] { color: var(--ch-muted) !important; font-weight: 700; }
body.primary-bg-color #order-standard_cart .view-cart-empty { color: var(--ch-muted) !important; }
body.primary-bg-color .badge-secondary { background: var(--ch-surface-2) !important; color: var(--ch-muted) !important; border: 1px solid var(--ch-border); }
body.primary-bg-color .badge-success { background: rgba(72, 230, 160, .14) !important; color: var(--ch-success) !important; }

/* ---------- client area home / tiles ---------- */
body.primary-bg-color .tiles .tile { background: var(--ch-panel) !important; border-color: var(--ch-border) !important; }
body.primary-bg-color .tiles .tile .stat { color: var(--ch-txt) !important; font-family: 'Fraunces', serif !important; }
body.primary-bg-color .tiles .tile .title { color: var(--ch-muted) !important; }
body.primary-bg-color .tiles .tile .highlight { background: var(--ch-grad) !important; }
body.primary-bg-color .tiles .tile i { color: rgba(139, 124, 255, .35) !important; }

/* ---------- login / register ---------- */
body.primary-bg-color .login-form,
body.primary-bg-color .logincontainer,
body.primary-bg-color .card.mw-540 {
    background: var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: 22px !important;
    box-shadow: var(--ch-shadow) !important;
}

/* ---------- footer ---------- */
body.primary-bg-color .footer,
body.primary-bg-color footer.footer {
    background: var(--ch-bg-2) !important;
    border-top: 1px solid var(--ch-border) !important;
    color: var(--ch-muted) !important;
}
body.primary-bg-color .footer a,
body.primary-bg-color .footer .nav-link,
body.primary-bg-color .footer p,
body.primary-bg-color .footer .copyright { color: var(--ch-muted) !important; }
body.primary-bg-color .footer a:hover { color: var(--ch-txt) !important; }
body.primary-bg-color .footer .btn,
body.primary-bg-color .footer .btn-default,
body.primary-bg-color .footer .btn-primary,
body.primary-bg-color .footer .nav-link,
body.primary-bg-color .footer .nav-item > a {
    background: var(--ch-surface-2) !important;
    border: 1px solid var(--ch-border) !important;
    color: var(--ch-txt) !important;
    box-shadow: none !important;
}
body.primary-bg-color .footer hr { border-color: var(--ch-border) !important; }

/* ---------- misc ---------- */
body.primary-bg-color .popover,
body.primary-bg-color .tooltip-inner { background: var(--ch-panel-2) !important; color: var(--ch-txt) !important; }
body.primary-bg-color .bg-white,
body.primary-bg-color .bg-light { background: var(--ch-panel) !important; }
body.primary-bg-color .text-dark { color: var(--ch-txt) !important; }
body.primary-bg-color .border,
body.primary-bg-color .border-top,
body.primary-bg-color .border-bottom { border-color: var(--ch-border) !important; }
body.primary-bg-color ::-webkit-scrollbar { width: 10px; height: 10px; }
body.primary-bg-color ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .12); border-radius: 10px; }
body.primary-bg-color ::-webkit-scrollbar-track { background: transparent; }

/* ---------- registration page (register.php) ----------
   Same sections as checkout but outside #order-standard_cart. */
body.primary-bg-color #registration,
body.primary-bg-color #registration #frmCheckout,
body.primary-bg-color #registration .row,
body.primary-bg-color #registration p,
body.primary-bg-color #registration .text-center { background: transparent !important; }
body.primary-bg-color #registration #containerNewUserSignup,
body.primary-bg-color #registration #containerNewUserSecurity,
body.primary-bg-color #registration .marketing-email-optin {
    background: var(--ch-panel) !important;
    border: 1px solid var(--ch-border) !important;
    border-radius: var(--ch-radius) !important;
    padding: 22px 24px !important;
    margin-bottom: 18px !important;
    color: var(--ch-txt) !important;
}
body.primary-bg-color #registration .marketing-email-optin p,
body.primary-bg-color #registration .text-muted { color: var(--ch-muted) !important; }
body.primary-bg-color #registration label,
body.primary-bg-color #registration .checkbox-inline { color: var(--ch-txt) !important; }
body.primary-bg-color #registration .sub-heading {
    background: transparent !important; border: 0 !important;
    border-bottom: 1px solid var(--ch-border) !important; height: auto !important;
    margin: 6px 0 18px !important; padding: 0 0 10px !important; text-align: left !important;
}
body.primary-bg-color #registration .sub-heading span {
    background: transparent !important; color: var(--ch-txt) !important;
    font-family: 'Fraunces', Georgia, serif !important; font-weight: 600 !important;
    font-size: 1.12rem !important; padding: 0 !important;
}
body.primary-bg-color #registration .sub-heading::before,
body.primary-bg-color #registration .sub-heading::after { display: none !important; }
body.primary-bg-color #registration .card,
body.primary-bg-color #registration .card-body { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
