/*
 * HexaVoice client area: dark theme on top of Twenty-One (Bootstrap 4.5).
 * Design tokens mirror hexavoice.org (app/globals.css in the hexa-org-web repo).
 * viewinvoice.tpl does not load this file, so invoices stay light for print/PDF.
 */

@font-face { font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/geist-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/geist-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/geist-mono-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/geist-mono-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
    color-scheme: dark;
    --hv-bg: #0a0e14;
    --hv-fg: #e6edf3;
    --hv-surface: #111722;
    --hv-elevated: #161e2b;
    --hv-border: #1f2a3a;
    --hv-muted: #8b98a9;
    --hv-primary: #2dd4bf;
    --hv-primary-fg: #04201c;
    --hv-primary-hover: #5eead4;
    --hv-primary-soft: rgba(45, 212, 191, 0.10);
    --hv-danger: #f87171;
    --hv-warning: #f59e0b;
    --hv-success: #34d399;
    --hv-info: #60a5fa;
    --hv-radius: 0.75rem;
    --hv-radius-sm: 0.45rem;
    --hv-font: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    --hv-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* ---------- Base ---------- */
html, body, body.primary-bg-color { background: var(--hv-bg) !important; color: var(--hv-fg); }
body { font-family: var(--hv-font); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: var(--hv-fg); font-family: var(--hv-font); font-weight: 600; letter-spacing: -0.01em; }
a { color: var(--hv-primary); }
a:hover, a:focus { color: var(--hv-primary-hover); }
hr { border-color: var(--hv-border); }
.text-muted, small.text-muted, .help-block, .form-text { color: var(--hv-muted) !important; }
.text-dark, .text-body { color: var(--hv-fg) !important; }
.text-primary { color: var(--hv-primary) !important; }
.text-success { color: var(--hv-success) !important; }
.text-danger { color: var(--hv-danger) !important; }
.text-warning { color: var(--hv-warning) !important; }
.text-info { color: var(--hv-info) !important; }
.bg-white, .bg-light { background: var(--hv-surface) !important; }
.border, .border-top, .border-bottom, .border-left, .border-right { border-color: var(--hv-border) !important; }
code, kbd, pre, samp { font-family: var(--hv-mono); }
code { color: var(--hv-primary); }
pre { background: var(--hv-elevated); color: var(--hv-fg); border: 1px solid var(--hv-border); border-radius: var(--hv-radius-sm); }
::selection { background: rgba(45, 212, 191, 0.3); color: var(--hv-fg); }
:focus-visible { outline: 2px solid var(--hv-primary); outline-offset: 2px; }

/* ---------- Header ---------- */
.header { background: var(--hv-bg); border-bottom: 1px solid var(--hv-border); }
.header .topbar { background: var(--hv-surface); border-bottom: 1px solid var(--hv-border); color: var(--hv-muted); }
.header .topbar .btn, .header .topbar .input-group-text { color: var(--hv-muted); background: transparent; border: 0; }
.header .topbar .btn:hover { color: var(--hv-fg); }
.header .topbar .btn-active-client span { color: var(--hv-fg); border-bottom-color: var(--hv-border); }
.header .topbar .btn-return-to-admin { background: var(--hv-warning); color: #1a1205; }

.hv-brandbar { background: var(--hv-bg); padding-top: 0.6rem; padding-bottom: 0.6rem; }
.hv-logo { display: inline-flex; align-items: center; gap: 0.6rem; color: var(--hv-fg) !important; text-decoration: none !important; }
.hv-logo img { height: 32px; width: auto; }
.hv-wordmark { display: flex; flex-direction: column; font-size: 13px; line-height: 1.05; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--hv-fg); }
.hv-descriptor { margin-left: 0.15rem; padding-left: 0.6rem; border-left: 1px solid var(--hv-border); font-size: 15px; font-weight: 500; letter-spacing: -0.01em; color: var(--hv-muted); }
.hv-sitenav { list-style: none; margin: 0 auto; padding: 0; gap: 0.25rem; }
.hv-sitenav a { display: block; padding: 0.4rem 0.7rem; border-radius: var(--hv-radius-sm); color: var(--hv-muted); font-size: 0.875rem; font-weight: 500; text-decoration: none; }
.hv-sitenav a:hover { color: var(--hv-fg); background: var(--hv-elevated); }
.header .toolbar .nav-link, .header .toolbar .btn.nav-link { color: var(--hv-muted); background: transparent; border: 1px solid var(--hv-border); border-radius: var(--hv-radius-sm); padding: 0.35rem 0.6rem; }
.header .toolbar .nav-link:hover { color: var(--hv-fg); background: var(--hv-elevated); }
.header .toolbar .cart-btn .badge { background: var(--hv-primary); color: var(--hv-primary-fg); }
.hv-btn-ghost { color: var(--hv-muted) !important; background: transparent; border: 0; font-weight: 500; }
.hv-btn-ghost:hover { color: var(--hv-fg) !important; background: var(--hv-elevated); }
.hv-btn-order { font-weight: 600; }

/* WHMCS navigation row */
.header .main-navbar-wrapper { background: var(--hv-surface); border-top: 1px solid var(--hv-border); padding: 0; }
.header .main-navbar-wrapper .navbar-nav .nav-link { color: var(--hv-muted); font-size: 0.875rem; font-weight: 500; padding: 0.8rem 0.9rem; }
.header .main-navbar-wrapper .navbar-nav .nav-link:hover,
.header .main-navbar-wrapper .navbar-nav .show > .nav-link,
.header .main-navbar-wrapper .navbar-nav .active > .nav-link { color: var(--hv-fg); background: transparent; }
.header .main-navbar-wrapper .navbar-nav .active > .nav-link { box-shadow: inset 0 -2px 0 var(--hv-primary); }
.hv-sitenav-mobile { border-bottom: 1px solid var(--hv-border); margin-bottom: 0.5rem; padding-bottom: 0.5rem; }
@media (max-width: 1199.98px) {
    .header .main-navbar-wrapper .navbar-collapse { padding: 0.5rem 0; }
    .header .main-navbar-wrapper .navbar-nav .nav-link { padding: 0.6rem 0.25rem; }
}

/* Breadcrumb */
.master-breadcrumb { background: var(--hv-bg); border-bottom: 1px solid var(--hv-border); }
.master-breadcrumb .breadcrumb { background: transparent; font-size: 0.8125rem; }
.master-breadcrumb .breadcrumb-item, .master-breadcrumb .breadcrumb-item a { color: var(--hv-muted); }
.master-breadcrumb .breadcrumb-item a:hover { color: var(--hv-fg); }
.master-breadcrumb .breadcrumb-item.active { color: var(--hv-fg); }
.breadcrumb-item + .breadcrumb-item::before { color: var(--hv-border); }

#main-body { background: var(--hv-bg); padding-top: 2rem; padding-bottom: 3rem; }

/* ---------- Cards, panels, sidebar ---------- */
.card, .panel, .sidebar .card, .client-home-cards .card, .tiles, .mc-promo, .card-sidebar {
    background: var(--hv-surface); border: 1px solid var(--hv-border); border-radius: var(--hv-radius); color: var(--hv-fg); box-shadow: none;
}
.card-header, .panel-heading { background: transparent; border-bottom: 1px solid var(--hv-border); color: var(--hv-fg); }
.card-footer, .panel-footer { background: transparent; border-top: 1px solid var(--hv-border); color: var(--hv-muted); }
.card-title, .card-header h3, .card-header .card-title { color: var(--hv-fg); font-size: 1rem; font-weight: 600; }
.card-body { color: var(--hv-fg); }
.sidebar .card-header .card-title, .card-sidebar .card-title { font-size: 0.875rem; }
.sidebar .card .card-minimise { color: var(--hv-muted); }
.list-group-item { background: transparent; border-color: var(--hv-border); color: var(--hv-muted); }
.list-group-item-action:hover, .list-group-item-action:focus { background: var(--hv-elevated); color: var(--hv-fg); }
.list-group-item.active, .sidebar .list-group-item.active, .card-sidebar .list-group-item.active {
    background: var(--hv-primary-soft); border-color: var(--hv-border); color: var(--hv-primary); box-shadow: inset 2px 0 0 var(--hv-primary);
}
.list-group-item .badge { background: var(--hv-elevated); color: var(--hv-fg); }
.list-group-item.active .badge { background: var(--hv-primary); color: var(--hv-primary-fg); }

/* Client dashboard tiles */
.tiles .tile { background: var(--hv-surface); border-color: var(--hv-border) !important; color: var(--hv-fg); }
.tiles .tile:hover { background: var(--hv-elevated); }
.tiles .tile i { color: var(--hv-muted); }
.tiles .tile .stat { color: var(--hv-fg); font-family: var(--hv-mono); }
.tiles .tile .title { color: var(--hv-muted); }
.tiles .tile .highlight { height: 2px; }
.tiles .tile .highlight.bg-color-blue, .tiles .tile .highlight.bg-color-green,
.tiles .tile .highlight.bg-color-red, .tiles .tile .highlight.bg-color-gold { background: var(--hv-primary) !important; }
.client-home-cards .card .card-header .btn { border-color: var(--hv-border); }
.client-home-cards .card-header { background: transparent; border-bottom: 1px solid var(--hv-border); }
.client-home-cards .card-header .card-title, .client-home-cards .card-header .card-title i { color: var(--hv-fg); }
.client-home-cards .card-header .btn { background: var(--hv-elevated); color: var(--hv-fg); border: 1px solid var(--hv-border); }
.client-home-cards .card-header .btn:hover { background: var(--hv-primary-soft); color: var(--hv-primary); }
.card[class*="card-accent-"] { border-top: 1px solid var(--hv-border); }

/* ---------- Buttons ---------- */
.btn { border-radius: var(--hv-radius-sm); font-weight: 500; }
.btn-primary, .btn-success, .btn-info, .btn-checkout, #btnCompleteOrder, .btn-order-now {
    background: var(--hv-primary) !important; border-color: var(--hv-primary) !important; color: var(--hv-primary-fg) !important; font-weight: 600;
}
.btn-primary:hover, .btn-success:hover, .btn-info:hover, .btn-checkout:hover, #btnCompleteOrder:hover, .btn-order-now:hover,
.btn-primary:focus, .btn-success:focus, .btn-info:focus {
    background: var(--hv-primary-hover) !important; border-color: var(--hv-primary-hover) !important; color: var(--hv-primary-fg) !important;
    box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.25);
}
.btn-default, .btn-secondary, .btn-light, .btn-outline-secondary, .btn-outline-primary, .btn-outline-info, .btn-outline-success {
    background: var(--hv-bg); border: 1px solid var(--hv-border); color: var(--hv-fg);
}
.btn-default:hover, .btn-secondary:hover, .btn-light:hover, .btn-outline-secondary:hover,
.btn-outline-primary:hover, .btn-outline-info:hover, .btn-outline-success:hover {
    background: var(--hv-elevated); border-color: var(--hv-border); color: var(--hv-fg);
}
.btn-danger, .btn-outline-danger:hover { background: var(--hv-danger); border-color: var(--hv-danger); color: #2a0707; }
.btn-outline-danger { color: var(--hv-danger); border-color: rgba(248, 113, 113, 0.5); background: transparent; }
.btn-warning { background: var(--hv-warning); border-color: var(--hv-warning); color: #1a1205; }
.btn-link { color: var(--hv-primary); }
.btn.disabled, .btn:disabled { opacity: 0.5; }

/* ---------- Forms ---------- */
.form-control, .custom-select, select.form-control, .field, textarea.form-control,
.input-group .form-control, .bootstrap-select > .dropdown-toggle, .select2-container--default .select2-selection--single {
    background-color: var(--hv-bg) !important; border: 1px solid var(--hv-border) !important; color: var(--hv-fg) !important; border-radius: var(--hv-radius-sm);
}
.form-control::placeholder { color: #5b6878; }
.form-control:focus, .custom-select:focus, .field:focus {
    border-color: var(--hv-primary) !important; box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.2) !important; background-color: var(--hv-bg) !important;
}
.form-control:disabled, .form-control[readonly] { background-color: var(--hv-surface) !important; color: var(--hv-muted) !important; }
select option { background: var(--hv-surface); color: var(--hv-fg); }
.input-group-text, .input-group-addon { background: var(--hv-elevated); border: 1px solid var(--hv-border); color: var(--hv-muted); }
label, .control-label, .col-form-label { color: var(--hv-fg); font-weight: 500; }
.custom-control-label::before { background: var(--hv-bg); border-color: var(--hv-border); }
.custom-control-input:checked ~ .custom-control-label::before { background: var(--hv-primary); border-color: var(--hv-primary); }
.form-check-input, input[type=checkbox], input[type=radio] { accent-color: var(--hv-primary); }
.prepend-icon .field-icon, .field-icon { color: var(--hv-muted); }
.iti__country-list { background: var(--hv-surface); border-color: var(--hv-border); color: var(--hv-fg); }
.iti__country.iti__highlight { background: var(--hv-elevated); }
.password-strength-meter .progress, .progress { background: var(--hv-elevated); }
.progress-bar { background: var(--hv-primary); }
.progress-bar.bg-danger { background: var(--hv-danger) !important; }
.progress-bar.bg-warning { background: var(--hv-warning) !important; }

/* ---------- Tables ---------- */
.table, .table-list, table.dataTable { color: var(--hv-fg); background: transparent; }
.table th, .table td, .table thead th, .table-list > thead > tr > th, .table-list > tbody > tr > td, table.dataTable thead th, table.dataTable tbody td {
    border-color: var(--hv-border) !important;
}
.table thead th, .table-list > thead > tr > th, table.dataTable thead th {
    background: var(--hv-elevated) !important; color: var(--hv-muted) !important; font-size: 0.75rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.04em;
}
.table-list > tbody > tr > td, table.dataTable tbody tr { background: var(--hv-surface) !important; }
.table-striped tbody tr:nth-of-type(odd) { background: rgba(255, 255, 255, 0.02); }
.table-hover tbody tr:hover, .table-list > tbody > tr:hover > td { background: var(--hv-elevated) !important; color: var(--hv-fg); }
.table-container, .dataTables_wrapper { background: transparent; }
.dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter { color: var(--hv-muted); }
.dataTables_wrapper .dataTables_filter input, .dataTables_wrapper .dataTables_length select { background: var(--hv-bg); color: var(--hv-fg); border: 1px solid var(--hv-border); }
.dataTables_wrapper .dataTables_filter label .form-control {
    background: var(--hv-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%238b98a9' stroke-width='2' stroke-linecap='round' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 14px center;
    padding-left: 40px !important;
}
.table-list > thead > tr > th.sorting_asc, .table-list > thead > tr > th.sorting_desc { color: var(--hv-fg) !important; }

/* Status labels */
.label, .badge { border-radius: 999px; font-weight: 500; }
.label.status, span.status { font-family: var(--hv-font); }
.status-active, .status-paid, .status-completed, .status-open, .label-success, .badge-success {
    background: rgba(52, 211, 153, 0.12) !important; color: var(--hv-success) !important; border: 1px solid rgba(52, 211, 153, 0.3);
}
.status-pending, .status-unpaid, .status-customer-reply, .status-answered, .label-warning, .badge-warning, .status-draft {
    background: rgba(245, 158, 11, 0.12) !important; color: var(--hv-warning) !important; border: 1px solid rgba(245, 158, 11, 0.3);
}
.status-suspended, .status-terminated, .status-cancelled, .status-overdue, .status-fraud, .status-expired, .label-danger, .badge-danger, .status-collections {
    background: rgba(248, 113, 113, 0.12) !important; color: var(--hv-danger) !important; border: 1px solid rgba(248, 113, 113, 0.3);
}
.status-closed, .status-refunded, .status-inactive, .label-default, .badge-secondary, .badge-default, .status-transferred-away, .status-grace, .status-redemption {
    background: var(--hv-elevated) !important; color: var(--hv-muted) !important; border: 1px solid var(--hv-border);
}
.badge-info, .label-info, .badge-primary { background: var(--hv-primary-soft); color: var(--hv-primary); }

/* ---------- Alerts ---------- */
.alert { border-radius: var(--hv-radius-sm); border: 1px solid var(--hv-border); background: var(--hv-surface); color: var(--hv-fg); }
.alert-success { background: rgba(52, 211, 153, 0.08); border-color: rgba(52, 211, 153, 0.3); color: #a7f3d0; }
.alert-info { background: rgba(45, 212, 191, 0.07); border-color: rgba(45, 212, 191, 0.3); color: #c6f6ee; }
.alert-warning { background: rgba(245, 158, 11, 0.08); border-color: rgba(245, 158, 11, 0.3); color: #fde68a; }
.alert-danger, .alert-error { background: rgba(248, 113, 113, 0.08); border-color: rgba(248, 113, 113, 0.3); color: #fecaca; }
.alert a, .alert .alert-link { color: inherit; text-decoration: underline; }
.alert .close, .close { color: var(--hv-fg); text-shadow: none; opacity: 0.6; }

/* ---------- Dropdowns, modals, popovers, tabs, pagination ---------- */
.dropdown-menu { background: var(--hv-elevated); border: 1px solid var(--hv-border); border-radius: var(--hv-radius-sm); box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4); }
.dropdown-item, .dropdown-menu > li > a { color: var(--hv-muted); }
.dropdown-item:hover, .dropdown-item:focus, .dropdown-menu > li > a:hover { background: var(--hv-surface); color: var(--hv-fg); }
.dropdown-divider { border-color: var(--hv-border); }
.modal-content { background: var(--hv-surface); border: 1px solid var(--hv-border); border-radius: var(--hv-radius); color: var(--hv-fg); }
.modal-header, .modal-footer { border-color: var(--hv-border); }
.modal-backdrop.show { opacity: 0.7; }
.popover { background: var(--hv-elevated); border-color: var(--hv-border); }
.popover-body, .popover .client-alerts a { color: var(--hv-fg); }
.popover .client-alerts li { border-color: var(--hv-border); }
.bs-popover-bottom > .arrow::after { border-bottom-color: var(--hv-elevated); }
.bs-popover-bottom > .arrow::before { border-bottom-color: var(--hv-border); }
.tooltip-inner { background: var(--hv-elevated); color: var(--hv-fg); border: 1px solid var(--hv-border); }
.nav-tabs { border-bottom-color: var(--hv-border); }
.nav-tabs .nav-link { color: var(--hv-muted); border: 0; }
.nav-tabs .nav-link:hover { color: var(--hv-fg); border: 0; }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { background: transparent; color: var(--hv-fg); border: 0; box-shadow: inset 0 -2px 0 var(--hv-primary); }
.nav-pills .nav-link.active { background: var(--hv-primary); color: var(--hv-primary-fg); }
.tab-content { color: var(--hv-fg); }
.page-link { background: var(--hv-surface); border-color: var(--hv-border); color: var(--hv-muted); }
.page-link:hover { background: var(--hv-elevated); color: var(--hv-fg); border-color: var(--hv-border); }
.page-item.active .page-link { background: var(--hv-primary); border-color: var(--hv-primary); color: var(--hv-primary-fg); }
.page-item.disabled .page-link { background: var(--hv-surface); border-color: var(--hv-border); color: #4b5666; }

/* ---------- Login / register / password reset ---------- */
.login-form, .login-form .card { background: var(--hv-surface); }
.login-form .card-body h6, .login-form h6 { color: var(--hv-fg); }
.login-form .card-footer { background: var(--hv-elevated); }
.sub-heading { border-color: var(--hv-border) !important; }
.sub-heading span, .sub-heading-borderless span { background: var(--hv-surface) !important; color: var(--hv-muted) !important; }
.social-signin-btns .btn { background: var(--hv-bg); border-color: var(--hv-border); color: var(--hv-fg); }
.providerLinkingFeedback { color: var(--hv-muted); }
#registration .card, #frmCheckout .card { background: var(--hv-surface); }

/* ---------- Tickets, KB, announcements ---------- */
.ticket-reply { background: var(--hv-surface); border: 1px solid var(--hv-border); border-radius: var(--hv-radius); }
.ticket-reply .posted-by, .ticket-reply .user { background: var(--hv-elevated); color: var(--hv-muted); border-color: var(--hv-border); }
.ticket-reply.staff { border-left: 3px solid var(--hv-primary); }
.ticket-reply .message { color: var(--hv-fg); }
.kb-search, .kb-category, .kb-article-item { color: var(--hv-fg); }
.announcement-single, .announcements .announcement { border-color: var(--hv-border); }
.markdown-editor, .editor-toolbar, .CodeMirror, .editor-preview, .editor-statusbar { background: var(--hv-bg) !important; color: var(--hv-fg) !important; border-color: var(--hv-border) !important; }
.editor-toolbar a, .editor-toolbar button { color: var(--hv-muted) !important; }
.editor-toolbar a:hover, .editor-toolbar a.active, .editor-toolbar button:hover { background: var(--hv-elevated) !important; border-color: var(--hv-border) !important; }
.CodeMirror-cursor { border-left-color: var(--hv-fg) !important; }

/* Product details page */
.product-details .product-icon, .product-status { background: var(--hv-elevated); color: var(--hv-fg); border-radius: var(--hv-radius); }
.product-details .product-icon .fa-stack .fas, .product-icon i { color: var(--hv-primary); }
.product-status-active, .product-status-pending, .product-status-suspended, .product-status-terminated, .product-status-cancelled { background: var(--hv-elevated) !important; color: var(--hv-fg) !important; }
.product-status .product-status-text { color: var(--hv-fg); }

/* Domain search on portal pages */
.home-domain-search, .domain-search-banner, .domain-checker-container, .domain-checker-bg {
    background: var(--hv-surface) !important; border: 1px solid var(--hv-border); border-radius: var(--hv-radius); color: var(--hv-fg);
}
.home-domain-search .input-group-wrapper, .domain-checker-container .input-group-box { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.domain-checker-container .input-group-box .btn { margin-left: 0.5rem; }
.tld-logos li, .home-domain-search .tld-logos li { color: var(--hv-muted); }

/* ---------- Order form (standard_cart) ---------- */
#order-standard_cart, #order-standard_cart .cart-body { color: var(--hv-fg); }
#order-standard_cart .header-lined h1, #order-standard_cart .header-lined h2, #order-standard_cart .font-size-36 { color: var(--hv-fg); }
#order-standard_cart .header-lined p, #order-standard_cart .header-lined .lead { color: var(--hv-muted); }
#order-standard_cart .sub-heading { border-color: var(--hv-border); }
#order-standard_cart .sub-heading span { background: var(--hv-bg) !important; color: var(--hv-muted) !important; }
#order-standard_cart .products .product, #order-standard_cart .product-info, #order-standard_cart .field-container,
#order-standard_cart .domain-selection-options .option, #order-standard_cart .addon-products .panel-addon,
#order-standard_cart .panel-addon, #order-standard_cart .domain-checker-container, #order-standard_cart .spotlight-tlds .spotlight-tld,
#order-standard_cart .suggested-domains, #order-standard_cart .domain-pricing .tld-row, #order-standard_cart .account-select-container .account,
#order-standard_cart .cc-input-container, #order-standard_cart .apply-credit-container {
    background: var(--hv-surface) !important; border: 1px solid var(--hv-border) !important; color: var(--hv-fg); border-radius: var(--hv-radius);
}
#order-standard_cart .products .product header { background: transparent; border-bottom: 1px solid var(--hv-border); color: var(--hv-fg); }
#order-standard_cart .products .product header span { color: var(--hv-fg); }
#order-standard_cart .products .product div.product-desc { color: var(--hv-muted); }
#order-standard_cart .products .product footer, #order-standard_cart .products .product div.product-pricing { color: var(--hv-fg); }
#order-standard_cart .products .product div.product-pricing span.price { color: var(--hv-fg); font-family: var(--hv-mono); }
#order-standard_cart .product-info .product-title { color: var(--hv-fg); }
#order-standard_cart .panel-addon.panel-addon-selected { border-color: var(--hv-primary) !important; }
#order-standard_cart .panel-addon .panel-add { background: var(--hv-elevated); color: var(--hv-fg); }
#order-standard_cart .panel-addon-selected .panel-add { background: var(--hv-primary); color: var(--hv-primary-fg); }

#order-standard_cart .view-cart-items-header { background: var(--hv-elevated) !important; color: var(--hv-muted) !important; border-radius: var(--hv-radius) var(--hv-radius) 0 0; }
#order-standard_cart .view-cart-items { border-color: var(--hv-border) !important; }
#order-standard_cart .view-cart-items .item { background: var(--hv-surface) !important; border-color: var(--hv-border) !important; }
#order-standard_cart .view-cart-items .item-title, #order-standard_cart .view-cart-items .item-domain, #order-standard_cart .view-cart-items .item-price span { color: var(--hv-fg); }
#order-standard_cart .view-cart-items .item-group, #order-standard_cart .view-cart-items .item-price .cycle { color: var(--hv-muted); }
#order-standard_cart .view-cart-empty { color: var(--hv-muted); }
#order-standard_cart .view-cart-tabs .nav-tabs a { color: var(--hv-muted); }
#order-standard_cart .view-cart-tabs .tab-content { background: var(--hv-surface); border: 1px solid var(--hv-border); border-top: 0; }

#order-standard_cart .order-summary, .order-summary {
    background: var(--hv-surface) !important; border: 1px solid var(--hv-border) !important; border-radius: var(--hv-radius); overflow: hidden;
}
#order-standard_cart .order-summary h2, .order-summary h2 { background: var(--hv-elevated) !important; color: var(--hv-fg) !important; font-size: 1rem; }
#order-standard_cart .summary-container, .summary-container { background: transparent !important; color: var(--hv-fg); }
#order-standard_cart .order-summary .product-name, #order-standard_cart .order-summary .subtotal, #order-standard_cart .order-summary .bordered-totals { border-color: var(--hv-border) !important; color: var(--hv-fg); }
#order-standard_cart .order-summary .total-due-today .amt, #order-standard_cart .total-due-today .amt { color: var(--hv-primary) !important; font-family: var(--hv-mono); }
#order-standard_cart .order-summary .total-due-today span:not(.amt) { color: var(--hv-muted); }
#order-standard_cart .summary-totals { border-color: var(--hv-border) !important; }

#order-standard_cart .domain-checker-result-headline .domain-available, #order-standard_cart .domain-available { color: var(--hv-success); }
#order-standard_cart .domain-checker-result-headline .domain-unavailable, #order-standard_cart .domain-unavailable { color: var(--hv-danger); }
#order-standard_cart .domain-suggestion, #order-standard_cart .domain-lookup-result { color: var(--hv-fg); }
#order-standard_cart .suggested-domains .panel-heading { background: var(--hv-elevated); color: var(--hv-fg); }
#order-standard_cart .suggested-domains .list-group-item { background: transparent; color: var(--hv-fg); }
#order-standard_cart .domain-pricing .tld-pricing-header { background: var(--hv-elevated) !important; color: var(--hv-muted) !important; }
#order-standard_cart .domain-pricing .tld-pricing-header div, #order-standard_cart .domain-pricing .tld-row div { border-color: var(--hv-border) !important; }
#order-standard_cart .domain-pricing .tld-filters a { background: var(--hv-elevated) !important; color: var(--hv-muted) !important; border: 1px solid var(--hv-border); }
#order-standard_cart .domain-pricing .tld-filters a.badge-success, #order-standard_cart .domain-pricing .tld-filters a.active { background: var(--hv-primary) !important; color: var(--hv-primary-fg) !important; }
#order-standard_cart .domain-pricing .tld-row.highlighted, #order-standard_cart .domain-pricing .tld-row:nth-child(even) { background: rgba(255, 255, 255, 0.02) !important; }
#order-standard_cart .secure-warning, #order-standard_cart .checkout-security-msg { background: var(--hv-surface); border-color: var(--hv-border); color: var(--hv-muted); }
#order-standard_cart .payment-methods label, #order-standard_cart .radio-inline { color: var(--hv-fg); }
#order-standard_cart .prepend-icon .field { padding-left: 2.4rem; }
#order-standard_cart .already-registered { background: var(--hv-surface); border: 1px solid var(--hv-border); border-radius: var(--hv-radius); }
#order-standard_cart .categories-collapsed, .sidebar-collapsed { background: var(--hv-surface); }
.loader, .text-loading { color: var(--hv-muted); }
#fullpage-overlay { background: rgba(10, 14, 20, 0.85); }
#fullpage-overlay .msg { color: var(--hv-fg); }

/* Mono for figures */
.amt, .price, .tiles .tile .stat, td.text-center[data-order], .invoice-total, .item-price span:first-child { font-family: var(--hv-mono); }

/* ---------- Footer ---------- */
.footer.hv-footer { background: var(--hv-surface); border-top: 1px solid var(--hv-border); color: var(--hv-muted); padding: 3.5rem 0 2rem; margin-top: 0; }
.hv-footer-blurb { margin-top: 1rem; max-width: 20rem; font-size: 0.875rem; line-height: 1.6; color: var(--hv-muted); }
.hv-footer h2 { font-size: 0.875rem; font-weight: 500; color: var(--hv-fg); margin-bottom: 0.75rem; }
.hv-footer ul { list-style: none; padding: 0; margin: 0; }
.hv-footer nav li { margin-bottom: 0.5rem; }
.hv-footer nav a { color: var(--hv-muted); font-size: 0.875rem; }
.hv-footer nav a:hover { color: var(--hv-fg); text-decoration: none; }
.hv-footer-bottom { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--hv-border); }
.hv-pay-badges { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.hv-pay-badges li { display: inline-flex; align-items: center; gap: 0.4rem; height: 1.75rem; padding: 0 0.55rem; border: 1px solid var(--hv-border); border-radius: 0.45rem; background: var(--hv-bg); font-family: var(--hv-mono); font-size: 0.75rem; color: var(--hv-fg); }
.hv-pay-badges .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--hv-primary); }
.hv-pay-badges i { color: var(--hv-primary); }
.hv-footer-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 0.25rem; font-size: 0.75rem; }
.hv-footer-meta p { margin: 0; }
.hv-footer-meta a { color: var(--hv-fg); font-family: var(--hv-mono); }
.hv-footer-meta a:hover { color: var(--hv-primary); }
.hv-locale-btn { color: var(--hv-muted); background: var(--hv-bg); border: 1px solid var(--hv-border); font-size: 0.75rem; padding: 0.25rem 0.6rem; margin-bottom: 0.4rem; }
.hv-locale-btn:hover { color: var(--hv-fg); }
@media (max-width: 767.98px) { .hv-footer-meta { align-items: flex-start; } }

/* Language / currency chooser modal */
#modalChooseLanguage .modal-content { background: var(--hv-surface); }
#modalChooseLanguage .item { color: var(--hv-muted); border-radius: var(--hv-radius-sm); }
#modalChooseLanguage .item:hover, #modalChooseLanguage .item.active { background: var(--hv-elevated); color: var(--hv-fg); }
#modalChooseLanguage h5 { color: var(--hv-muted); }

/* Turnstile widget spacing */
.cf-turnstile { margin: 0.75rem 0; }

/* List separators (twenty-one hardcodes #ddd / white borders) */
.sidebar .list-group-item, .card-sidebar .list-group-item, .client-home-cards .list-group .list-group-item { border-color: var(--hv-border) !important; }
.client-home-cards .card .list-group { border-color: var(--hv-border) !important; }

/* MarketConnect promo (dashboard "Recommended for you"). Logo sits on a white tile so the official artwork is untouched. */
.promo-container { background: var(--hv-surface) !important; border: 1px solid var(--hv-border) !important; border-radius: var(--hv-radius); overflow: hidden; }
.promo-container .header { background: transparent !important; border-bottom: 1px solid var(--hv-border) !important; color: var(--hv-fg); }
.promo-container .header h3 { color: var(--hv-fg); font-size: 1rem; font-weight: 600; }
.promo-container .promo-banner { background: transparent !important; border: 0 !important; }
.promo-banner { background: var(--hv-surface) !important; border: 1px solid var(--hv-border) !important; border-radius: var(--hv-radius); color: var(--hv-fg); }
.promo-banner .card-body { background: transparent !important; color: var(--hv-fg); }
.promo-banner .icon-left { background: #fff; border-radius: var(--hv-radius-sm); padding: 1rem; }
.promo-banner .content h3 { color: var(--hv-fg) !important; font-weight: 600; }
.promo-banner .content h4 { color: var(--hv-muted) !important; }
.promo-banner .content li { color: var(--hv-muted) !important; }
.promo-banner .content li i, .promo-banner .content li .fa, .promo-banner .content li .fas { color: var(--hv-primary) !important; }
.promo-banner .content small a { color: var(--hv-primary) !important; text-decoration: none; }

/* ---------- Contrast fixes (twenty-one / standard_cart hardcode dark-on-light colours) ---------- */
:root { --hv-nav: #c3cdd9; }
/* twenty-one sets "header.header .navbar a { color: #444 }", which outranks the nav rules above */
header.header .navbar a, header.header .navbar .nav-link, header.header .navbar .navbar-nav > li > a, header.header .hv-sitenav a { color: var(--hv-nav); }
header.header .navbar a:hover, header.header .navbar a:focus, header.header .navbar .show > a, header.header .navbar .active > a { color: #fff; }
header.header .navbar .navbar-brand, header.header .navbar .btn { color: inherit; }
header.header .navbar .btn-primary, header.header .navbar .btn-order-now { color: var(--hv-primary-fg) !important; }
header.header .navbar .dropdown-menu a, header.header .navbar .dropdown-item { color: var(--hv-nav); }
header.header .navbar .dropdown-menu a:hover, header.header .navbar .dropdown-item:hover { color: #fff; background: var(--hv-elevated); }
.dropdown-menu { background: var(--hv-elevated); border-color: var(--hv-border); }
.dropdown-item, .dropdown-menu a { color: var(--hv-nav); }
.dropdown-item:hover, .dropdown-item:focus, .dropdown-menu a:hover { background: var(--hv-surface); color: #fff; }
.dropdown-divider { border-color: var(--hv-border); }

/* Light boxes from twenty-one / standard_cart */
.announcements .announcement article { background: transparent !important; color: var(--hv-fg); }
#order-standard_cart .domain-promo-box, .domain-promo-box { background: var(--hv-surface) !important; border: 1px solid var(--hv-border) !important; color: var(--hv-fg); }
.domain-promo-box h3, .domain-promo-box .font-size-22, .domain-promo-box .font-size-24 { color: var(--hv-fg) !important; }
.domain-promo-box p, .domain-promo-box .small { color: var(--hv-muted) !important; }
.domain-promo-box .text-primary { color: var(--hv-primary) !important; }
.domain-promo-box .text-warning { color: var(--hv-warning) !important; }
#order-standard_cart .domain-pricing .bg-white, #order-standard_cart .domain-pricing .tld-pricing-header,
#order-standard_cart .domain-pricing .tld-pricing-header div, #order-standard_cart .tld-pricing-header .col-4,
.domain-pricing .tld-row, #order-standard_cart .tld-row { background: var(--hv-surface) !important; color: var(--hv-fg) !important; border-color: var(--hv-border) !important; }
#order-standard_cart .domain-pricing .tld-pricing-header, #order-standard_cart .tld-pricing-header div { background: var(--hv-elevated) !important; color: var(--hv-muted) !important; }
#order-standard_cart .order-summary .btn-continue-shopping, #continueShopping { color: var(--hv-muted) !important; }
#order-standard_cart .order-summary .btn-continue-shopping:hover, #continueShopping:hover { color: var(--hv-fg) !important; }
#order-standard_cart .view-cart-tabs .nav-tabs, #order-standard_cart .view-cart-tabs .nav-tabs .nav-link, .view-cart-tabs .tab-content { background: transparent !important; border-color: var(--hv-border) !important; color: var(--hv-muted); }
#order-standard_cart .view-cart-tabs .nav-tabs .nav-link.active, #order-standard_cart .view-cart-tabs .nav-tabs .active > a { background: var(--hv-elevated) !important; color: var(--hv-fg) !important; }
.md-editor .md-footer, .markdown-editor-status, .md-editor .btn-toolbar, .md-editor > .md-header { background: var(--hv-elevated) !important; color: var(--hv-muted) !important; border-color: var(--hv-border) !important; }
.md-editor .md-footer .small-font, .markdown-editor-status .small-font { color: var(--hv-muted) !important; }
.page-item.disabled .page-link { color: var(--hv-muted) !important; background: transparent !important; }
.btn-view-more, .card-footer .btn-view-more { color: var(--hv-muted) !important; }
.btn-view-more:hover { color: var(--hv-primary) !important; }
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success { background: var(--hv-primary) !important; color: var(--hv-primary-fg) !important; }

/* MarketConnect landing pages (e.g. /store/nordvpn) keep the vendor's own light design: official artwork + copy are untouched. */
.landing-page.bg-white { background: #fff !important; border-radius: var(--hv-radius); overflow: hidden; }
.landing-page.bg-white h1, .landing-page.bg-white h2, .landing-page.bg-white h3, .landing-page.bg-white h4, .landing-page.bg-white h5 { color: inherit; }
.landing-page.bg-white p a, .landing-page.bg-white .faq a { color: #4580ff; }
/* Hide third-party brands on the NordVPN landing page: competitor VPN comparison table and press logos (DMCA caution). */
.landing-page.nordvpn .feature.comparison, .landing-page.nordvpn .feature.comparison + .line-break, .landing-page.nordvpn .feature.logo { display: none !important; }