/* Google Fonts - must be first */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

/* ==========================================================================
   ByteLogic Solutions - WHMCS Dark Theme
   Matches byte-logic.net design system
   ========================================================================== */

/* --------------------------------------------------------------------------
   CSS Variables
   -------------------------------------------------------------------------- */

:root {
    /* ByteLogic Brand Tokens */
    --bl-bg-primary: #0b1e24;
    --bl-bg-secondary: #12353f;
    --bl-bg-card: rgba(44, 219, 135, 0.04);
    --bl-bg-elevated: #163e4a;
    --bl-bg-input: rgba(255, 255, 255, 0.06);
    --bl-accent: #2cdb87;
    --bl-accent-secondary: #24b06d;
    --bl-text-primary: #e8f0f2;
    --bl-text-secondary: #999999;
    --bl-text-muted: rgba(153, 153, 153, 0.6);
    --bl-heading: #ffffff;
    --bl-border: rgba(44, 219, 135, 0.12);
    --bl-border-hover: rgba(44, 219, 135, 0.4);
    --bl-error: #ef4444;
    --bl-warning: #f59e0b;
    --bl-success: #2cdb87;
    --bl-card-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
    --bl-glow: 0 0 60px rgba(44, 219, 135, 0.1);

    /* Override parent Nexus Cart variables */
    --white: #ffffff;
    --primary: #2cdb87;
    --primary-lifted: #24b06d;
    --primary-accented: #1a8f57;
    --primary-50: #0b1e24;
    --primary-100: #12353f;
    --primary-200: #163e4a;
    --primary-300: rgba(44, 219, 135, 0.12);
    --primary-400: rgba(44, 219, 135, 0.4);
    --primary-500: #2cdb87;
    --primary-600: #2cdb87;
    --primary-700: #24b06d;
    --primary-800: #1a8f57;
    --primary-900: #0b1e24;
    --primary-950: #0b1e24;
    --secondary: #999999;
    --secondary-lifted: #b3b3b3;
    --secondary-accented: #666666;
    --success: #2cdb87;
    --success-lifted: #24b06d;
    --success-accented: #1a8f57;
    --info: #2cdb87;
    --info-lifted: #24b06d;
    --info-accented: #1a8f57;
    --error: #ef4444;
    --error-lifted: #dc2626;
    --error-accented: #b91c1c;
    --warning: #f59e0b;
    --warning-lifted: #d97706;
    --warning-accented: #b45309;
    --notice: #2cdb87;
    --notice-lifted: #24b06d;
    --notice-accented: #1a8f57;
    --neutral-50: #0b1e24;
    --neutral-100: #12353f;
    --neutral-200: #163e4a;
    --neutral-300: rgba(44, 219, 135, 0.12);
    --neutral-400: #999999;
    --neutral-500: #b3b3b3;
    --neutral-600: #cccccc;
    --neutral-700: #e0e0e0;
    --neutral-800: #e8f0f2;
    --neutral-900: #ffffff;
    --neutral-950: #ffffff;
    --grayscale: #e8f0f2;
    --grayscale-lifted: #cccccc;
    --grayscale-accented: #999999;
    --text: #e8f0f2;
    --text-inverted: #0b1e24;
    --text-muted: #999999;
    --text-lifted: #b3b3b3;
    --text-accented: #cccccc;
    --border: rgba(44, 219, 135, 0.12);
    --border-muted: rgba(255, 255, 255, 0.06);
    --border-lifted: rgba(44, 219, 135, 0.25);
    --border-accented: rgba(44, 219, 135, 0.4);
    --bg: #0b1e24;
    --bg-muted: #12353f;
    --bg-lifted: #163e4a;
    --bg-accented: rgba(44, 219, 135, 0.08);
    --bg-inverted: #e8f0f2;

    /* Font sizes */
    --text-xs: 0.625rem;
    --text-sm: 0.75rem;
    --text-md: 0.875rem;
    --text-lg: 1rem;

    /* Rounding */
    --rounding-sm: 0.5rem;
    --rounding-md: 0.75rem;
    --rounding-lg: 1rem;

    --letter-spacing: 0em;
    --disabled-opacity: 40%;
}

html {
    font-size: 14px;
}

/* --------------------------------------------------------------------------
   Base / Global
   -------------------------------------------------------------------------- */

body {
    background-color: var(--bl-bg-primary) !important;
    color: var(--bl-text-primary);
    font-family: 'Inter', 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Space Grotesk', 'Raleway', sans-serif;
    color: var(--bl-heading);
    font-weight: 600;
}

a {
    color: var(--bl-accent);
    transition: color 0.2s ease, filter 0.2s ease;
}

a:hover,
a:focus {
    color: var(--bl-accent);
    filter: brightness(1.15);
    text-decoration: none;
}

.primary-bg-color {
    background-color: var(--bl-bg-primary);
}

::selection {
    background: rgba(44, 219, 135, 0.3);
    color: var(--bl-text-primary);
}

::-moz-selection {
    background: rgba(44, 219, 135, 0.3);
    color: var(--bl-text-primary);
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--bl-bg-primary);
}

::-webkit-scrollbar-thumb {
    background: var(--bl-border);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--bl-text-muted);
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

section#header {
    background-color: var(--bl-bg-primary);
    border-bottom: 1px solid var(--bl-border);
    border-radius: 0;
    padding: 12px 0;
}

section#header .logo img {
    max-height: 44px;
}

section#header .logo-text {
    font-family: 'Space Grotesk', 'Raleway', sans-serif;
    color: var(--bl-heading);
}

section#header .top-nav {
    list-style: none;
    margin: 0;
    padding: 0;
}

section#header .top-nav li a {
    color: var(--bl-text-secondary);
    font-size: 13px;
    transition: color 0.2s ease;
}

section#header .top-nav li a:hover {
    color: var(--bl-text-primary);
}

section#header .top-nav .primary-action .btn {
    background-color: var(--bl-accent);
    color: var(--bl-bg-primary);
    border: none;
    border-radius: 12px;
    padding: 8px 20px;
    font-weight: 500;
    font-size: 13px;
    transition: filter 0.2s ease;
}

section#header .top-nav .primary-action .btn:hover {
    filter: brightness(1.1);
    color: var(--bl-bg-primary);
}

section#header .top-nav .btn-logged-in-admin {
    background-color: var(--bl-accent);
    color: var(--bl-bg-primary);
    border-radius: 8px;
}

/* --------------------------------------------------------------------------
   Navbar / Main Menu
   -------------------------------------------------------------------------- */

section#main-menu {
    background-color: var(--bl-bg-secondary);
    border: none;
}

.navbar-main,
.navbar-default.navbar-main {
    background-color: var(--bl-bg-secondary);
    border: none;
    border-bottom: 1px solid var(--bl-border);
    margin-bottom: 0;
    min-height: 44px;
}

.navbar-default .navbar-nav > li > a {
    color: var(--bl-text-secondary);
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 500;
    transition: color 0.2s ease, background-color 0.2s ease;
    padding: 12px 16px;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: var(--bl-text-primary);
    background-color: rgba(44, 219, 135, 0.06);
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: var(--bl-text-primary);
    background-color: rgba(44, 219, 135, 0.08);
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    color: var(--bl-text-primary);
    background-color: rgba(44, 219, 135, 0.08);
}

.navbar-default .navbar-toggle {
    border-color: var(--bl-border);
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: var(--bl-text-secondary);
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: rgba(44, 219, 135, 0.08);
}

.navbar-default .navbar-collapse {
    border-color: var(--bl-border);
}

/* Navbar dropdown menus */
.navbar-default .navbar-nav .dropdown-menu {
    background-color: var(--bl-bg-elevated);
    border: 1px solid var(--bl-border);
    border-radius: 12px;
    box-shadow: var(--bl-card-shadow);
    padding: 4px 0;
}

.navbar-default .navbar-nav .dropdown-menu > li > a {
    color: var(--bl-text-primary);
    padding: 8px 16px;
    transition: background-color 0.15s ease;
}

.navbar-default .navbar-nav .dropdown-menu > li > a:hover {
    background-color: rgba(44, 219, 135, 0.08);
    color: var(--bl-accent);
}

/* Badge in nav */
.navbar-nav .badge {
    background-color: var(--bl-accent);
    color: var(--bl-bg-primary);
}

/* --------------------------------------------------------------------------
   Main Body
   -------------------------------------------------------------------------- */

section#main-body {
    background-color: var(--bl-bg-primary);
    padding: 24px 0;
}

.main-content {
    min-height: 300px;
}

/* --------------------------------------------------------------------------
   Home Banner
   -------------------------------------------------------------------------- */

section#home-banner {
    background-color: var(--bl-bg-secondary);
    padding: 50px 0;
    border-bottom: 1px solid var(--bl-border);
}

section#home-banner h2 {
    color: var(--bl-heading);
    font-family: 'Space Grotesk', sans-serif;
}

section#home-banner .form-control {
    background-color: var(--bl-bg-input);
    border: 1px solid var(--bl-border);
    color: var(--bl-text-primary);
    border-radius: 12px;
    height: 48px;
}

section#home-banner .form-control:focus {
    border-color: var(--bl-accent);
    box-shadow: 0 0 0 2px rgba(44, 219, 135, 0.15);
}

section#home-banner .btn.search,
section#home-banner .btn.transfer {
    background-color: var(--bl-accent);
    color: var(--bl-bg-primary);
    border: none;
    border-radius: 0 12px 12px 0;
    font-weight: 500;
    transition: filter 0.2s ease;
}

section#home-banner .btn.search:hover,
section#home-banner .btn.transfer:hover {
    filter: brightness(1.1);
}

.home-shortcuts {
    background-color: rgba(44, 219, 135, 0.04);
    border-top: 1px solid var(--bl-border);
    border-bottom: 1px solid var(--bl-border);
}

.home-shortcuts .lead {
    color: var(--bl-text-secondary);
}

.home-shortcuts ul li a {
    color: var(--bl-text-secondary);
    transition: color 0.2s ease;
}

.home-shortcuts ul li a:hover {
    color: var(--bl-accent);
}

.home-shortcuts ul li a i {
    color: var(--bl-accent);
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

section#footer {
    background-color: var(--bl-bg-secondary);
    border-top: 1px solid var(--bl-border);
    color: var(--bl-text-secondary);
    padding: 20px 10px;
    border-radius: 0;
}

section#footer p {
    color: var(--bl-text-secondary);
}

section#footer a {
    color: var(--bl-text-secondary);
}

section#footer a:hover {
    color: var(--bl-accent);
}

section#footer .back-to-top {
    background-color: rgba(44, 219, 135, 0.12);
    color: var(--bl-accent);
    border-radius: 8px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease;
}

section#footer .back-to-top:hover {
    background-color: rgba(44, 219, 135, 0.25);
}

.bl-veteran {
    color: var(--bl-accent);
    font-size: 12px;
    margin-top: 4px;
}

.bl-footer-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.bl-footer-left p {
    margin: 0;
}

/* --------------------------------------------------------------------------
   Panels / Cards (Glass Card Style)
   -------------------------------------------------------------------------- */

.panel {
    background-color: var(--bl-bg-card);
    border: 1px solid var(--bl-border);
    border-radius: 16px;
    box-shadow: var(--bl-card-shadow);
    color: var(--bl-text-primary);
}

.panel-default {
    border-color: var(--bl-border);
}

.panel-default > .panel-heading {
    background-color: rgba(255, 255, 255, 0.04);
    color: var(--bl-heading);
    border-bottom: 1px solid var(--bl-border);
    border-radius: 16px 16px 0 0;
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: var(--bl-border);
}

.panel-body {
    color: var(--bl-text-primary);
}

.panel-footer {
    background-color: rgba(255, 255, 255, 0.02);
    border-top: 1px solid var(--bl-border);
    border-radius: 0 0 16px 16px;
}

.panel-primary {
    border-color: var(--bl-border);
}

.panel-primary > .panel-heading {
    background-color: var(--bl-accent);
    color: var(--bl-bg-primary);
    border-color: var(--bl-accent);
    border-radius: 16px 16px 0 0;
}

.panel-success > .panel-heading {
    background-color: rgba(44, 219, 135, 0.15);
    color: var(--bl-accent);
    border-color: var(--bl-border);
}

.panel-info > .panel-heading {
    background-color: rgba(44, 219, 135, 0.08);
    color: var(--bl-text-primary);
    border-color: var(--bl-border);
}

.panel-warning > .panel-heading {
    background-color: rgba(245, 158, 11, 0.15);
    color: var(--bl-warning);
    border-color: rgba(245, 158, 11, 0.2);
}

.panel-danger > .panel-heading {
    background-color: rgba(239, 68, 68, 0.15);
    color: var(--bl-error);
    border-color: rgba(239, 68, 68, 0.2);
}

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */

.form-control {
    background-color: var(--bl-bg-input) !important;
    border: 1px solid var(--bl-border) !important;
    border-radius: 12px;
    color: var(--bl-text-primary) !important;
    padding: 10px 16px;
    height: auto;
    font-size: 14px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-shadow: none !important;
}

.form-control:focus {
    border-color: var(--bl-accent);
    box-shadow: 0 0 0 2px rgba(44, 219, 135, 0.15);
    background-color: var(--bl-bg-input);
    color: var(--bl-text-primary);
}

.form-control::placeholder {
    color: var(--bl-text-muted);
}

.form-control::-webkit-input-placeholder {
    color: var(--bl-text-muted);
}

.form-control::-moz-placeholder {
    color: var(--bl-text-muted);
}

.form-control:-ms-input-placeholder {
    color: var(--bl-text-muted);
}

label {
    color: var(--bl-text-secondary);
    font-weight: 500;
    font-size: 13px;
}

.form-group label {
    margin-bottom: 6px;
}

.checkbox label,
.radio label {
    color: var(--bl-text-secondary);
}

.input-group .form-control {
    border-radius: 12px 0 0 12px;
}

.input-group-btn .btn {
    border-radius: 0 12px 12px 0;
}

.input-group-addon {
    background-color: rgba(255, 255, 255, 0.04);
    border-color: var(--bl-border);
    color: var(--bl-text-secondary);
}

select.form-control {
    background-color: var(--bl-bg-input) !important;
    color: var(--bl-text-primary) !important;
    border-color: var(--bl-border) !important;
}

select.form-control option {
    background-color: var(--bl-bg-elevated) !important;
    color: var(--bl-text-primary) !important;
}

textarea.form-control {
    border-radius: 12px;
}

.help-block {
    color: var(--bl-text-muted);
}

.has-error .form-control {
    border-color: var(--bl-error);
}

.has-error .help-block,
.has-error .control-label {
    color: var(--bl-error);
}

.has-success .form-control {
    border-color: var(--bl-success);
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.btn {
    border-radius: 12px;
    font-weight: 500;
    font-size: 14px;
    padding: 10px 24px;
    transition: all 0.2s ease;
    border: 1px solid transparent;
}

.btn-primary {
    background-color: var(--bl-accent) !important;
    color: var(--bl-bg-primary) !important;
    border-color: var(--bl-accent) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: var(--bl-accent) !important;
    border-color: var(--bl-accent) !important;
    color: var(--bl-bg-primary) !important;
    filter: brightness(1.1);
}

.btn-default {
    background-color: transparent;
    border: 1px solid var(--bl-border);
    color: var(--bl-text-primary);
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active {
    background-color: rgba(44, 219, 135, 0.06);
    border-color: var(--bl-accent);
    color: var(--bl-accent);
}

.btn-success {
    background-color: var(--bl-accent);
    color: var(--bl-bg-primary);
    border-color: var(--bl-accent);
}

.btn-success:hover,
.btn-success:focus {
    background-color: var(--bl-accent);
    filter: brightness(1.1);
    color: var(--bl-bg-primary);
}

.btn-danger {
    background-color: var(--bl-error);
    color: #fff;
    border-color: var(--bl-error);
}

.btn-danger:hover,
.btn-danger:focus {
    background-color: var(--bl-error);
    filter: brightness(1.1);
}

.btn-warning {
    background-color: var(--bl-warning);
    color: var(--bl-bg-primary);
    border-color: var(--bl-warning);
}

.btn-warning:hover,
.btn-warning:focus {
    filter: brightness(1.1);
}

.btn-info {
    background-color: rgba(44, 219, 135, 0.12);
    color: var(--bl-accent);
    border-color: var(--bl-border);
}

.btn-info:hover,
.btn-info:focus {
    background-color: rgba(44, 219, 135, 0.2);
    color: var(--bl-accent);
    border-color: var(--bl-accent);
}

.btn-link {
    color: var(--bl-accent);
}

.btn-link:hover {
    color: var(--bl-accent);
    filter: brightness(1.15);
}

.btn[disabled],
.btn.disabled {
    opacity: 0.4;
}

/* --------------------------------------------------------------------------
   Tables
   -------------------------------------------------------------------------- */

.table {
    color: var(--bl-text-primary);
}

.table > thead > tr > th {
    background-color: rgba(255, 255, 255, 0.04);
    color: var(--bl-text-secondary);
    border-bottom: 2px solid var(--bl-border);
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 12px 8px;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    color: var(--bl-text-primary);
    padding: 12px 8px;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(44, 219, 135, 0.02);
}

.table-hover > tbody > tr:hover {
    background-color: rgba(44, 219, 135, 0.06);
}

.table-bordered {
    border-color: var(--bl-border);
}

.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > tfoot > tr > td {
    border-color: rgba(255, 255, 255, 0.06);
}

/* --------------------------------------------------------------------------
   Alerts
   -------------------------------------------------------------------------- */

.alert {
    border-radius: 12px;
    border-width: 1px;
}

.alert-success {
    background-color: rgba(44, 219, 135, 0.1);
    border-color: rgba(44, 219, 135, 0.2);
    color: var(--bl-accent);
}

.alert-danger {
    background-color: rgba(239, 68, 68, 0.1);
    border-color: rgba(239, 68, 68, 0.2);
    color: var(--bl-error);
}

.alert-warning {
    background-color: rgba(245, 158, 11, 0.1);
    border-color: rgba(245, 158, 11, 0.2);
    color: var(--bl-warning);
}

.alert-info {
    background-color: rgba(44, 219, 135, 0.06);
    border-color: var(--bl-border);
    color: var(--bl-text-primary);
}

.alert a {
    font-weight: 600;
}

.alert-success a { color: var(--bl-accent); }
.alert-danger a { color: var(--bl-error); }
.alert-warning a { color: var(--bl-warning); }

/* --------------------------------------------------------------------------
   Modals
   -------------------------------------------------------------------------- */

.modal-content {
    background-color: var(--bl-bg-elevated);
    border: 1px solid var(--bl-border);
    border-radius: 16px;
    box-shadow: var(--bl-card-shadow);
    color: var(--bl-text-primary);
}

.modal-header {
    border-bottom: 1px solid var(--bl-border);
    background-color: rgba(255, 255, 255, 0.04);
    border-radius: 16px 16px 0 0;
}

.modal-title {
    color: var(--bl-heading);
    font-family: 'Space Grotesk', sans-serif;
}

.modal-body {
    color: var(--bl-text-primary);
}

.modal-footer {
    border-top: 1px solid var(--bl-border);
    background-color: rgba(255, 255, 255, 0.02);
    border-radius: 0 0 16px 16px;
}

.modal-backdrop.in {
    opacity: 0.7;
}

.close {
    color: var(--bl-text-secondary);
    text-shadow: none;
    opacity: 0.7;
}

.close:hover {
    color: var(--bl-text-primary);
    opacity: 1;
}

/* --------------------------------------------------------------------------
   Sidebar
   -------------------------------------------------------------------------- */

.sidebar .list-group {
    border-radius: 16px;
    overflow: hidden;
}

.sidebar .list-group-item,
.list-group-item {
    background-color: transparent;
    border-color: rgba(44, 219, 135, 0.08);
    color: var(--bl-text-secondary);
    transition: all 0.15s ease;
}

.sidebar .list-group-item:hover,
.list-group-item:hover {
    background-color: rgba(44, 219, 135, 0.04);
    color: var(--bl-accent);
}

.sidebar .list-group-item.active,
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    background-color: rgba(44, 219, 135, 0.08);
    border-color: rgba(44, 219, 135, 0.08);
    color: var(--bl-accent);
    border-left: 3px solid var(--bl-accent);
}

.sidebar .panel {
    border-radius: 16px;
}

.sidebar .panel-heading {
    font-family: 'Space Grotesk', sans-serif;
}

/* --------------------------------------------------------------------------
   Dashboard Tiles
   -------------------------------------------------------------------------- */

.tiles .tile {
    background-color: var(--bl-bg-card);
    border: 1px solid var(--bl-border);
    border-radius: 16px;
    box-shadow: var(--bl-card-shadow);
    transition: all 0.3s ease;
}

.tiles .tile:hover {
    box-shadow: var(--bl-glow);
    transform: translateY(-2px);
    border-color: var(--bl-border-hover);
}

.tiles .tile .icon {
    color: var(--bl-accent);
}

.tiles .tile .stat {
    color: var(--bl-heading);
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 700;
}

.tiles .tile .title {
    color: var(--bl-text-secondary);
}

/* --------------------------------------------------------------------------
   Breadcrumbs
   -------------------------------------------------------------------------- */

.breadcrumb {
    background-color: transparent;
    color: var(--bl-text-secondary);
    padding: 8px 0;
    border-radius: 0;
}

.breadcrumb > li {
    color: var(--bl-text-muted);
}

.breadcrumb > li a {
    color: var(--bl-text-secondary);
}

.breadcrumb > li a:hover {
    color: var(--bl-accent);
}

.breadcrumb > .active {
    color: var(--bl-text-primary);
}

.breadcrumb > li + li:before {
    color: var(--bl-text-muted);
}

/* --------------------------------------------------------------------------
   Pagination
   -------------------------------------------------------------------------- */

.pagination > li > a,
.pagination > li > span {
    background-color: transparent;
    border: 1px solid var(--bl-border);
    color: var(--bl-text-secondary);
    transition: all 0.15s ease;
}

.pagination > li > a:hover {
    background-color: rgba(44, 219, 135, 0.06);
    border-color: var(--bl-accent);
    color: var(--bl-accent);
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
    background-color: var(--bl-accent);
    border-color: var(--bl-accent);
    color: var(--bl-bg-primary);
}

.pagination > .disabled > a,
.pagination > .disabled > span {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.06);
    color: var(--bl-text-muted);
}

/* --------------------------------------------------------------------------
   Dropdowns (generic)
   -------------------------------------------------------------------------- */

.dropdown-menu {
    background-color: var(--bl-bg-elevated);
    border: 1px solid var(--bl-border);
    border-radius: 12px;
    box-shadow: var(--bl-card-shadow);
    padding: 4px 0;
}

.dropdown-menu > li > a {
    color: var(--bl-text-primary);
    padding: 8px 16px;
    transition: background-color 0.15s ease;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: rgba(44, 219, 135, 0.08);
    color: var(--bl-accent);
}

.dropdown-menu .divider {
    background-color: var(--bl-border);
}

.dropdown-header {
    color: var(--bl-text-muted);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* --------------------------------------------------------------------------
   Popovers & Tooltips
   -------------------------------------------------------------------------- */

.popover {
    background-color: var(--bl-bg-elevated);
    border: 1px solid var(--bl-border);
    border-radius: 12px;
    box-shadow: var(--bl-card-shadow);
    color: var(--bl-text-primary);
}

.popover-title {
    background-color: rgba(255, 255, 255, 0.04);
    border-bottom-color: var(--bl-border);
    color: var(--bl-heading);
    border-radius: 12px 12px 0 0;
}

.popover.bottom > .arrow::after {
    border-bottom-color: var(--bl-bg-elevated);
}
.popover.top > .arrow::after {
    border-top-color: var(--bl-bg-elevated);
}
.popover.left > .arrow::after {
    border-left-color: var(--bl-bg-elevated);
}
.popover.right > .arrow::after {
    border-right-color: var(--bl-bg-elevated);
}

.tooltip-inner {
    background-color: var(--bl-bg-elevated);
    color: var(--bl-text-primary);
    border-radius: 8px;
}

.tooltip.bottom .tooltip-arrow { border-bottom-color: var(--bl-bg-elevated); }
.tooltip.top .tooltip-arrow { border-top-color: var(--bl-bg-elevated); }
.tooltip.left .tooltip-arrow { border-left-color: var(--bl-bg-elevated); }
.tooltip.right .tooltip-arrow { border-right-color: var(--bl-bg-elevated); }

/* --------------------------------------------------------------------------
   Wells
   -------------------------------------------------------------------------- */

.well {
    background-color: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--bl-border);
    border-radius: 12px;
    box-shadow: none;
    color: var(--bl-text-primary);
}

/* --------------------------------------------------------------------------
   Page Header
   -------------------------------------------------------------------------- */

div.header-lined h1 {
    color: var(--bl-heading);
    border-bottom: 1px solid var(--bl-border);
    padding-bottom: 12px;
    font-family: 'Space Grotesk', sans-serif;
}

div.header-lined h1 small {
    color: var(--bl-text-secondary);
}

/* --------------------------------------------------------------------------
   Labels & Badges
   -------------------------------------------------------------------------- */

.label-default { background-color: rgba(255, 255, 255, 0.1); color: var(--bl-text-primary); }
.label-primary { background-color: var(--bl-accent); color: var(--bl-bg-primary); }
.label-success { background-color: var(--bl-accent); color: var(--bl-bg-primary); }
.label-info { background-color: rgba(44, 219, 135, 0.15); color: var(--bl-accent); }
.label-warning { background-color: var(--bl-warning); color: var(--bl-bg-primary); }
.label-danger { background-color: var(--bl-error); color: #fff; }
.badge { background-color: var(--bl-accent); color: var(--bl-bg-primary); }

/* --------------------------------------------------------------------------
   Progress Bars
   -------------------------------------------------------------------------- */

.progress {
    background-color: rgba(255, 255, 255, 0.06);
    border-radius: 8px;
    box-shadow: none;
}

.progress-bar { background-color: var(--bl-accent); }
.progress-bar-success { background-color: var(--bl-accent); }
.progress-bar-danger { background-color: var(--bl-error); }
.progress-bar-warning { background-color: var(--bl-warning); }

/* --------------------------------------------------------------------------
   Client Area Specific
   -------------------------------------------------------------------------- */

.client-alerts li a {
    color: var(--bl-text-primary);
    transition: background-color 0.15s ease;
}

.client-alerts li a:hover {
    background-color: rgba(44, 219, 135, 0.06);
}

.client-alerts li.none {
    color: var(--bl-text-muted);
}

.client-home-panels .panel {
    border-radius: 16px;
}

.label-status-active,
.text-success { color: var(--bl-accent) !important; }
.text-danger { color: var(--bl-error) !important; }
.text-warning { color: var(--bl-warning) !important; }
.text-info { color: var(--bl-accent) !important; }
.text-muted { color: var(--bl-text-muted) !important; }

/* --------------------------------------------------------------------------
   Language Chooser
   -------------------------------------------------------------------------- */

#languageChooserContent ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

#languageChooserContent ul li a {
    display: block;
    padding: 6px 12px;
    color: var(--bl-text-primary);
    transition: background-color 0.15s ease;
}

#languageChooserContent ul li a:hover {
    background-color: rgba(44, 219, 135, 0.08);
    color: var(--bl-accent);
}

/* --------------------------------------------------------------------------
   Domain Search
   -------------------------------------------------------------------------- */

.domain-checker-result-headline-available { color: var(--bl-accent); }
.domain-checker-result-headline-unavailable { color: var(--bl-error); }

/* --------------------------------------------------------------------------
   Fullpage Overlay
   -------------------------------------------------------------------------- */

#fullpage-overlay {
    background-color: rgba(11, 30, 36, 0.9);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

#fullpage-overlay .msg {
    color: var(--bl-text-primary);
}

/* --------------------------------------------------------------------------
   Tabs
   -------------------------------------------------------------------------- */

.nav-tabs {
    border-bottom-color: var(--bl-border);
}

.nav-tabs > li > a {
    color: var(--bl-text-secondary);
    border-radius: 12px 12px 0 0;
    transition: color 0.2s ease;
}

.nav-tabs > li > a:hover {
    border-color: transparent;
    background-color: rgba(44, 219, 135, 0.04);
    color: var(--bl-text-primary);
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background-color: var(--bl-bg-primary);
    border-color: var(--bl-border);
    border-bottom-color: var(--bl-bg-primary);
    color: var(--bl-accent);
}

.tab-content {
    color: var(--bl-text-primary);
}

/* --------------------------------------------------------------------------
   Nav Pills
   -------------------------------------------------------------------------- */

.nav-pills > li > a {
    color: var(--bl-text-secondary);
    border-radius: 12px;
    transition: all 0.2s ease;
}

.nav-pills > li > a:hover {
    background-color: rgba(44, 219, 135, 0.06);
    color: var(--bl-text-primary);
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
    background-color: var(--bl-accent);
    color: var(--bl-bg-primary);
}

/* --------------------------------------------------------------------------
   Jumbotron & Thumbnails
   -------------------------------------------------------------------------- */

.jumbotron {
    background-color: var(--bl-bg-secondary);
    color: var(--bl-text-primary);
    border-radius: 16px;
}

.thumbnail {
    background-color: var(--bl-bg-card);
    border: 1px solid var(--bl-border);
    border-radius: 12px;
}

.thumbnail .caption {
    color: var(--bl-text-primary);
}

/* --------------------------------------------------------------------------
   Login Page (Glass Card)
   -------------------------------------------------------------------------- */

.logincontainer {
    max-width: 100%;
}

.bl-login-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 200px);
    padding: 40px 16px;
}

.bl-login-card {
    max-width: 440px;
    width: 100%;
    padding: 32px;
    background-color: var(--bl-bg-card);
    -webkit-backdrop-filter: blur(24px);
    backdrop-filter: blur(24px);
    border: 1px solid var(--bl-border);
    border-radius: 16px;
    box-shadow: var(--bl-card-shadow);
}

.bl-login-header {
    text-align: center;
    margin-bottom: 32px;
}

.bl-login-header h1 {
    font-size: 30px;
    font-weight: 700;
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.bl-gradient-text {
    background: linear-gradient(to right, #2cdb87, #24b06d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.bl-login-header p {
    color: var(--bl-text-secondary);
    font-size: 14px;
    margin: 0;
}

.bl-form-group {
    margin-bottom: 20px;
}

.bl-form-group label {
    display: block;
    color: var(--bl-text-secondary);
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 8px;
}

.bl-form-group .form-control {
    width: 100%;
    padding: 12px 16px;
    background-color: var(--bl-bg-input);
    border: 1px solid var(--bl-border);
    border-radius: 12px;
    color: var(--bl-text-primary);
    font-size: 14px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bl-form-group .form-control:focus {
    border-color: var(--bl-accent);
    box-shadow: 0 0 0 2px rgba(44, 219, 135, 0.15);
    outline: none;
}

.bl-remember-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.bl-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--bl-text-secondary);
    font-size: 13px;
    margin: 0;
    cursor: pointer;
}

.bl-checkbox input[type="checkbox"] {
    accent-color: var(--bl-accent);
    width: 16px;
    height: 16px;
}

.bl-forgot-link {
    color: var(--bl-accent);
    font-size: 13px;
    transition: filter 0.2s ease;
}

.bl-forgot-link:hover {
    filter: brightness(1.15);
}

.bl-login-card .btn-block {
    display: block;
    width: 100%;
    padding: 12px 24px;
    font-size: 15px;
    font-weight: 600;
}

.bl-captcha-row {
    margin-bottom: 20px;
}

.bl-social-divider {
    display: flex;
    align-items: center;
    margin: 24px 0;
    color: var(--bl-text-muted);
    font-size: 13px;
}

.bl-social-divider::before,
.bl-social-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background-color: var(--bl-border);
}

.bl-social-divider span {
    padding: 0 12px;
    white-space: nowrap;
}

.bl-social-buttons {
    margin-bottom: 16px;
}

.bl-register-link {
    text-align: center;
    color: var(--bl-text-muted);
    font-size: 14px;
    margin-top: 24px;
    margin-bottom: 0;
}

.bl-register-link a {
    color: var(--bl-accent);
    font-weight: 500;
}

.bl-register-link a:hover {
    text-decoration: underline;
}

.bl-recaptcha-notice {
    text-align: center;
    color: var(--bl-text-muted);
    font-size: 11px;
    margin-top: 16px;
    margin-bottom: 0;
    line-height: 1.5;
}

.bl-recaptcha-notice a {
    color: var(--bl-text-secondary);
}

.bl-recaptcha-notice a:hover {
    color: var(--bl-accent);
}

/* --------------------------------------------------------------------------
   Dashboard Tiles (override all.css .tiles .tile bg #f8f8f8)
   -------------------------------------------------------------------------- */

.tiles .tile {
    background-color: var(--bl-bg-card) !important;
    border-color: var(--bl-border) !important;
}

.tiles .tile:hover,
.tiles .tile:focus,
.tiles .tile:active {
    background-color: rgba(44, 219, 135, 0.06) !important;
    background: rgba(44, 219, 135, 0.06) !important;
}

.tiles .tile a {
    color: inherit !important;
}

.tiles .tile .stat {
    color: var(--bl-heading) !important;
}

.tiles .tile .title {
    color: var(--bl-text-secondary) !important;
}

.tiles .tile .icon {
    color: var(--bl-accent) !important;
}

@media (max-width: 767px) {
    .tiles .tile:nth-child(1),
    .tiles .tile:nth-child(2) {
        border-bottom-color: var(--bl-border) !important;
    }
}

/* --------------------------------------------------------------------------
   Panel Accent Colors (override all.css border-top)
   All accent variants used in WHMCS dashboard panels
   -------------------------------------------------------------------------- */

.panel[class*="panel-accent-"] {
    background-color: var(--bl-bg-card) !important;
    border: 1px solid var(--bl-border) !important;
    border-radius: 16px !important;
}

.panel.panel-accent-blue { border-top: 3px solid #5bc0de !important; }
.panel.panel-accent-green { border-top: 3px solid var(--bl-accent) !important; }
.panel.panel-accent-red { border-top: 3px solid var(--bl-error) !important; }
.panel.panel-accent-gold { border-top: 3px solid var(--bl-warning) !important; }
.panel.panel-accent-orange { border-top: 3px solid #f39c12 !important; }
.panel.panel-accent-midnight-blue { border-top: 3px solid #5bc0de !important; }
.panel.panel-accent-emerald { border-top: 3px solid var(--bl-accent) !important; }
.panel.panel-accent-turquoise { border-top: 3px solid var(--bl-accent) !important; }
.panel.panel-accent-purple { border-top: 3px solid #7b4f9d !important; }
.panel.panel-accent-amethyst { border-top: 3px solid #9b59b6 !important; }
.panel.panel-accent-wet-asphalt { border-top: 3px solid #5bc0de !important; }
.panel.panel-accent-silver { border-top: 3px solid var(--bl-text-secondary) !important; }
.panel.panel-accent-asbestos { border-top: 3px solid var(--bl-text-secondary) !important; }

/* --------------------------------------------------------------------------
   bg-color-* button overrides (panel heading action buttons)
   -------------------------------------------------------------------------- */

.btn[class*="bg-color-"] {
    background-color: rgba(44, 219, 135, 0.12) !important;
    color: var(--bl-text-primary) !important;
    border: none !important;
}

.btn[class*="bg-color-"]:hover {
    background-color: rgba(44, 219, 135, 0.2) !important;
    color: var(--bl-accent) !important;
}

/* --------------------------------------------------------------------------
   Sidebar Panels (override all.css .panel-sidebar bg #f5f5f5)
   -------------------------------------------------------------------------- */

.panel-sidebar {
    background-color: var(--bl-bg-card) !important;
    border-color: var(--bl-border) !important;
    border-radius: 16px !important;
}

section#main-body .panel-sidebar > .panel-heading,
.sidebar .panel-sidebar > .panel-heading,
.panel.panel-sidebar > .panel-heading {
    background-color: rgba(255, 255, 255, 0.04) !important;
    background: rgba(255, 255, 255, 0.04) !important;
    color: var(--bl-heading) !important;
    border-bottom: 1px solid var(--bl-border) !important;
    border-radius: 16px 16px 0 0 !important;
}

.panel-sidebar .panel-title {
    color: var(--bl-heading) !important;
    font-family: 'Space Grotesk', sans-serif !important;
}

.panel-sidebar .panel-minimise {
    color: var(--bl-text-muted) !important;
}

.panel-sidebar > .panel-body {
    color: var(--bl-text-primary) !important;
}

.panel-sidebar > .panel-footer {
    background-color: rgba(255, 255, 255, 0.02) !important;
    border-top-color: var(--bl-border) !important;
    border-radius: 0 0 16px 16px !important;
}

.panel-sidebar .list-group-item {
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.06) !important;
    color: var(--bl-text-secondary) !important;
}

.panel-sidebar a.list-group-item:hover {
    background-color: rgba(44, 219, 135, 0.04) !important;
    color: var(--bl-accent) !important;
}

.panel-sidebar a.list-group-item.active,
.panel-sidebar a.list-group-item.active:hover,
.panel-sidebar a.list-group-item.active:focus {
    background-color: rgba(44, 219, 135, 0.08) !important;
    color: var(--bl-accent) !important;
    border-left: 3px solid var(--bl-accent) !important;
}

/* --------------------------------------------------------------------------
   Dashboard Panel Headings & Bodies
   -------------------------------------------------------------------------- */

.panel-default {
    background-color: var(--bl-bg-card) !important;
    border-color: var(--bl-border) !important;
}

.panel-default > .panel-heading {
    background-color: rgba(255, 255, 255, 0.04) !important;
    color: var(--bl-heading) !important;
    border-bottom-color: var(--bl-border) !important;
}

.client-home-panels .panel {
    background-color: var(--bl-bg-card) !important;
    border-color: var(--bl-border) !important;
}

.client-home-panels .panel-heading {
    background-color: rgba(255, 255, 255, 0.04) !important;
    color: var(--bl-heading) !important;
    border-bottom-color: var(--bl-border) !important;
    overflow: hidden !important;
}

/* Panel heading title — clearfix for floated button */
.client-home-panels .panel-heading .panel-title {
    overflow: hidden !important;
}

.client-home-panels .panel-heading .panel-title .pull-right {
    margin-top: -4px;
}

/* "My Services" etc. action buttons in panel headings */
.client-home-panels .panel > .panel-heading .panel-title .btn {
    border: 1px solid var(--bl-border) !important;
    background-color: rgba(44, 219, 135, 0.08) !important;
    color: var(--bl-accent) !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    padding: 4px 12px !important;
}

.client-home-panels .panel > .panel-heading .panel-title .btn:hover {
    background-color: rgba(44, 219, 135, 0.15) !important;
    border-color: var(--bl-accent) !important;
    color: var(--bl-accent) !important;
}

.client-home-panels .panel-heading .panel-title {
    color: var(--bl-heading) !important;
}

.client-home-panels .panel-body {
    background-color: transparent !important;
    color: var(--bl-text-primary) !important;
}

.client-home-panels .panel-footer {
    background-color: rgba(255, 255, 255, 0.02) !important;
    border-top-color: var(--bl-border) !important;
}

.client-home-panels .panel-footer a {
    color: var(--bl-accent) !important;
}

/* --------------------------------------------------------------------------
   Dashboard List Group Items (service rows)
   -------------------------------------------------------------------------- */

.list-group-item {
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.06) !important;
    color: var(--bl-text-primary) !important;
}

a.list-group-item,
button.list-group-item {
    color: var(--bl-text-primary) !important;
}

a.list-group-item:hover,
a.list-group-item:focus,
.list-group-item:hover {
    background-color: rgba(44, 219, 135, 0.04) !important;
    color: var(--bl-accent) !important;
}

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    background-color: rgba(44, 219, 135, 0.08) !important;
    border-color: var(--bl-border) !important;
    color: var(--bl-accent) !important;
}

/* Override inline border-bottom style on last list items */
.list-group-item[style*="border-bottom"] {
    border-bottom-color: var(--bl-border) !important;
}

/* --------------------------------------------------------------------------
   Service Item Layout (div-service-*)
   -------------------------------------------------------------------------- */

.div-service-item {
    color: var(--bl-text-primary) !important;
}

.div-service-name .font-weight-bold {
    color: var(--bl-text-primary) !important;
}

.div-service-name .text-domain {
    color: var(--bl-accent) !important;
    font-size: 0.9em;
}

.div-service-item .dropdown-menu li {
    color: var(--bl-text-primary) !important;
}

.div-service-item .dropdown-menu > li:hover,
.div-service-item .dropdown-menu > li:focus {
    background-color: rgba(44, 219, 135, 0.08) !important;
    color: var(--bl-accent) !important;
}

.div-service-item .dropdown-menu > li:active {
    background-color: var(--bl-accent) !important;
    color: var(--bl-bg-primary) !important;
}

/* View Details and action buttons */
.div-service-buttons .btn-default,
.div-service-buttons .btn-sm {
    background-color: transparent !important;
    border-color: var(--bl-border) !important;
    color: var(--bl-text-primary) !important;
}

.div-service-buttons .btn-default:hover,
.div-service-buttons .btn-sm:hover {
    background-color: rgba(44, 219, 135, 0.06) !important;
    border-color: var(--bl-accent) !important;
    color: var(--bl-accent) !important;
}

/* --------------------------------------------------------------------------
   Home KB Search (override all.css)
   -------------------------------------------------------------------------- */

.home-kb-search .form-control {
    background-color: var(--bl-bg-input) !important;
    border-color: var(--bl-border) !important;
    color: var(--bl-text-primary) !important;
}

.home-kb-search .form-control:focus {
    border-color: var(--bl-accent) !important;
    box-shadow: 0 0 0 2px rgba(44, 219, 135, 0.15) !important;
}

.home-kb-search i {
    color: var(--bl-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Promo Banner (MarketConnect addon_html)
   Overrides all.css .promo-banner { background-color: #fff }
   -------------------------------------------------------------------------- */

.promo-banner {
    background-color: var(--bl-bg-secondary) !important;
    border: none !important;
    border-radius: 16px !important;
    color: var(--bl-text-primary) !important;
}

.promo-banner h3 {
    color: var(--bl-heading) !important;
}

.promo-banner h3 small {
    color: var(--bl-text-secondary) !important;
}

.promo-banner h4 {
    color: var(--bl-text-secondary) !important;
}

.promo-banner p {
    color: var(--bl-text-secondary) !important;
}

.promo-banner ul li {
    color: var(--bl-text-secondary) !important;
}

.promo-banner .far,
.promo-banner .fas,
.promo-banner .fa:not(.fa-spinner) {
    color: var(--bl-accent) !important;
}

.promo-banner a {
    color: var(--bl-accent) !important;
}

.promo-banner .btn {
    background-color: var(--bl-accent) !important;
    color: var(--bl-bg-primary) !important;
    border: none !important;
    border-radius: 12px !important;
}

.promo-banner .btn:hover {
    filter: brightness(1.1);
}

/* Carousel wrapper for promo */
.carousel-item {
    background-color: transparent !important;
}

/* --------------------------------------------------------------------------
   Domain Search Panel on Dashboard
   -------------------------------------------------------------------------- */

.domain-pricing-table,
.domain-pricing-table th,
.domain-pricing-table td {
    background-color: var(--bl-bg-card) !important;
    color: var(--bl-text-primary) !important;
    border-color: var(--bl-border) !important;
}

.domainchecker-tld-pricing .panel,
.domain-checker-container {
    background-color: var(--bl-bg-card) !important;
    border-color: var(--bl-border) !important;
}

/* --------------------------------------------------------------------------
   Nuclear Override - Catch ALL remaining white backgrounds
   -------------------------------------------------------------------------- */

section#main-body .panel,
section#main-body .panel-body,
section#main-body .panel-heading,
section#main-body .panel-footer,
section#main-body .well,
section#main-body .thumbnail {
    background-color: var(--bl-bg-card) !important;
    color: var(--bl-text-primary);
    border-color: var(--bl-border) !important;
}

section#main-body .panel .panel-body,
section#main-body .panel .list-group,
section#main-body .panel .list-group-item {
    background-color: transparent !important;
}

/* Panel heading titles */
section#main-body .panel-heading .panel-title,
section#main-body .panel-heading h3,
section#main-body .panel-heading h4 {
    color: inherit !important;
}

/* Re-apply colored panel headings */
section#main-body .panel-primary > .panel-heading {
    background-color: var(--bl-accent) !important;
    color: var(--bl-bg-primary) !important;
}

/* Table rows inside panels */
section#main-body .panel .table > tbody > tr > td {
    background-color: transparent !important;
    color: var(--bl-text-primary);
}

section#main-body .panel .table-striped > tbody > tr:nth-of-type(odd) > td {
    background-color: rgba(44, 219, 135, 0.02) !important;
}

/* --------------------------------------------------------------------------
   Misc Overrides
   -------------------------------------------------------------------------- */

hr { border-top-color: var(--bl-border); }

blockquote {
    border-left-color: var(--bl-accent);
    color: var(--bl-text-secondary);
}

code {
    background-color: rgba(255, 255, 255, 0.06);
    color: var(--bl-accent);
    border-radius: 4px;
}

pre {
    background-color: rgba(255, 255, 255, 0.04);
    border-color: var(--bl-border);
    color: var(--bl-text-primary);
    border-radius: 12px;
}

mark {
    background-color: rgba(44, 219, 135, 0.2);
    color: var(--bl-text-primary);
}

/* --------------------------------------------------------------------------
   DataTables & table-list (Services, Domains, Invoices pages)
   -------------------------------------------------------------------------- */

/* Table-list rows — override all.css #fff and #f8fcfd */
.table-list > tbody > tr > td,
table.table-list tbody td {
    background-color: var(--bl-bg-card) !important;
    color: var(--bl-text-primary) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
}

.table-list > tbody > tr:nth-child(even) > td {
    background-color: rgba(44, 219, 135, 0.02) !important;
}

.table-list > tbody > tr:hover > td {
    background-color: rgba(44, 219, 135, 0.06) !important;
}

/* Table-list header — override all.css #fff bg, #333 text */
table.table-list thead th {
    background-color: var(--bl-bg-secondary) !important;
    color: var(--bl-text-secondary) !important;
    border-bottom: 2px solid var(--bl-accent) !important;
}

.table-list > tbody > tr > td a.border-left {
    border-left-color: var(--bl-border) !important;
}

/* Sorting header active — override #f6f6f6 */
.dataTables_wrapper table.table-list thead th.sorting_asc,
.dataTables_wrapper table.table-list thead th.sorting_desc {
    background-color: rgba(255, 255, 255, 0.06) !important;
}

/* Column header bottom accent — replace green with turquoise */
.dataTables_wrapper table.table-list thead th {
    border-bottom-color: var(--bl-accent) !important;
}

.dataTables_wrapper table.table-list thead th:nth-child(even) {
    border-bottom-color: var(--bl-accent-secondary) !important;
}

/* DataTables info bar */
.dataTables_wrapper .dataTables_info,
div.dataTables_wrapper div.dataTables_info {
    background-color: var(--bl-bg-secondary) !important;
    color: var(--bl-text-primary) !important;
    border-bottom: 1px solid var(--bl-border) !important;
}

/* DataTables length/show entries footer */
.dataTables_wrapper .dataTables_length {
    background-color: var(--bl-bg-secondary) !important;
    color: var(--bl-text-secondary) !important;
}

.dataTables_wrapper .dataTables_length label .form-control {
    background-color: var(--bl-bg-input) !important;
    color: var(--bl-text-primary) !important;
    border: 1px solid var(--bl-border) !important;
}

/* DataTables search/filter input */
.dataTables_wrapper .dataTables_filter label .form-control {
    background-color: var(--bl-bg-input) !important;
    background-image: none !important;
    color: var(--bl-text-primary) !important;
    border: 1px solid var(--bl-border) !important;
    border-radius: 8px !important;
    padding-left: 12px !important;
}

.dataTables_wrapper .dataTables_filter label .form-control:focus {
    border-color: var(--bl-accent) !important;
    box-shadow: 0 0 0 2px rgba(44, 219, 135, 0.15) !important;
}

/* DataTables pagination */
.dataTables_wrapper .dataTables_paginate .pagination > li > a,
.dataTables_wrapper .dataTables_paginate .pagination > li > span {
    background-color: transparent !important;
    border-color: var(--bl-border) !important;
    color: var(--bl-text-secondary) !important;
}

.dataTables_wrapper .dataTables_paginate .pagination > li > a:hover {
    background-color: rgba(44, 219, 135, 0.08) !important;
    color: var(--bl-accent) !important;
}

.dataTables_wrapper .dataTables_paginate .pagination > .active > a,
.dataTables_wrapper .dataTables_paginate .pagination > .active > span {
    background-color: var(--bl-accent) !important;
    border-color: var(--bl-accent) !important;
    color: var(--bl-bg-primary) !important;
}

/* DataTables empty message */
table.dataTable td.dataTables_empty,
table.dataTable th.dataTables_empty {
    background-color: var(--bl-bg-card) !important;
    color: var(--bl-text-secondary) !important;
}

/* --------------------------------------------------------------------------
   Domain Pricing / Renewal Page
   -------------------------------------------------------------------------- */

/* Featured TLD cards */
.featured-tld {
    background-color: var(--bl-bg-card) !important;
    border: 1px solid var(--bl-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--bl-card-shadow) !important;
}

.featured-tld .img-container {
    background-color: transparent !important;
}

.featured-tld .price {
    background-color: var(--bl-bg-secondary) !important;
    color: var(--bl-text-primary) !important;
    border-radius: 0 0 12px 12px !important;
}

/* TLD category filter labels */
.tld-filters a.label-default {
    background-color: rgba(255, 255, 255, 0.06) !important;
    color: var(--bl-text-secondary) !important;
    border: 1px solid var(--bl-border) !important;
}

.tld-filters a.label-default:hover {
    background-color: rgba(44, 219, 135, 0.08) !important;
    color: var(--bl-accent) !important;
}

.tld-filters a.label-success {
    background-color: var(--bl-accent) !important;
    color: var(--bl-bg-primary) !important;
}

/* Domain pricing rows */
.domain-pricing .tld-row {
    border-bottom-color: var(--bl-border) !important;
    color: var(--bl-text-primary) !important;
}

.domain-pricing .tld-row.highlighted {
    background-color: rgba(44, 219, 135, 0.04) !important;
}

/* Domain pricing header */
.tld-pricing-header {
    background-color: var(--bl-bg-secondary) !important;
    color: var(--bl-text-secondary) !important;
    border-bottom: 2px solid var(--bl-accent) !important;
}

.tld-pricing-header .tld-column,
.tld-pricing-header .col-xs-4,
.tld-pricing-header .col-4,
.tld-pricing-header .col-md-4,
.tld-pricing-header .col-md-8,
.tld-pricing-header div {
    color: var(--bl-text-secondary) !important;
    background-color: transparent !important;
}

/* Currency selector */
.domain-pricing .currency-selector {
    background-color: var(--bl-bg-input) !important;
    color: var(--bl-text-primary) !important;
    border-color: var(--bl-border) !important;
}

/* Table inside domain pricing — extra specificity for DataTables */
.domain-pricing .table-list > tbody > tr > td,
.domain-pricing table.table-list tbody td,
#tableDomainPricing > tbody > tr > td {
    background-color: var(--bl-bg-card) !important;
    color: var(--bl-text-primary) !important;
}

.domain-pricing .table-list > tbody > tr:nth-child(even) > td,
#tableDomainPricing > tbody > tr:nth-child(even) > td {
    background-color: rgba(44, 219, 135, 0.02) !important;
}

.domain-pricing .table-list > tbody > tr:hover > td,
#tableDomainPricing > tbody > tr:hover > td {
    background-color: rgba(44, 219, 135, 0.06) !important;
}

#tableDomainPricing > thead > tr > th,
.domain-pricing table.table-list thead th {
    background-color: var(--bl-bg-secondary) !important;
    color: var(--bl-text-secondary) !important;
    border-bottom: 2px solid var(--bl-accent) !important;
}

/* Domain pricing small text */
.domain-pricing td small,
#tableDomainPricing td small {
    color: var(--bl-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Status Badges (override all.css .status #fff bg, #333 text)
   -------------------------------------------------------------------------- */

.status {
    background-color: transparent !important;
    border-color: var(--bl-border) !important;
    color: var(--bl-text-primary) !important;
}

.status-active,
.status-open,
.status-completed {
    color: var(--bl-accent) !important;
    border-color: rgba(44, 219, 135, 0.3) !important;
}

.status-pending {
    color: var(--bl-error) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
}

.status-suspended {
    color: var(--bl-warning) !important;
    border-color: rgba(245, 158, 11, 0.3) !important;
}

.status-cancelled {
    color: var(--bl-text-muted) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.status-fraud,
.status-answered {
    color: var(--bl-text-secondary) !important;
}

.status-customer-reply {
    color: #ff6600 !important;
    border-color: rgba(255, 102, 0, 0.3) !important;
}

.status-pending-transfer,
.status-pending-registration,
.status-redemption,
.status-grace {
    color: var(--bl-warning) !important;
    border-color: rgba(245, 158, 11, 0.3) !important;
}

.status-expired,
.status-transferred-away {
    color: var(--bl-text-muted) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.status-custom {
    background-color: transparent !important;
    color: var(--bl-text-primary) !important;
    border-color: var(--bl-border) !important;
}

/* --------------------------------------------------------------------------
   Store / Cart / Order Form Pages
   -------------------------------------------------------------------------- */

/* Store order container */
.store-order-container {
    background-color: var(--bl-bg-card) !important;
    color: var(--bl-text-primary) !important;
    border-color: var(--bl-border) !important;
}

/* Store order container tabs */
.store-order-container .store-domain-tabs li a {
    background-color: var(--bl-bg-input) !important;
    color: var(--bl-text-secondary) !important;
    border-color: var(--bl-border) !important;
}

.store-order-container .store-domain-tabs li.active a {
    background-color: var(--bl-bg-card) !important;
    color: var(--bl-text-primary) !important;
    border-bottom-color: transparent !important;
}

.store-order-container .store-domain-tab-content {
    background-color: var(--bl-bg-card) !important;
    border-color: var(--bl-border) !important;
    color: var(--bl-text-primary) !important;
}

/* Invoice summary total row */
.invoice-summary-table td.total-row {
    background-color: rgba(255, 255, 255, 0.04) !important;
    color: var(--bl-heading) !important;
}

/* --------------------------------------------------------------------------
   Order Summary (cart/order form — classes from standard_cart template)
   -------------------------------------------------------------------------- */

.order-summary {
    background-color: var(--bl-bg-card) !important;
    color: var(--bl-text-primary) !important;
    border-color: var(--bl-border) !important;
    border-radius: 16px !important;
}

.order-summary h2 {
    color: var(--bl-heading) !important;
}

.order-summary .summary-container,
.order-summary #producttotal {
    background-color: transparent !important;
    color: var(--bl-text-primary) !important;
}

.order-summary .summary-totals {
    background-color: transparent !important;
    color: var(--bl-text-secondary) !important;
    border-color: var(--bl-border) !important;
}

.order-summary .summary-totals span {
    color: var(--bl-text-secondary) !important;
}

.order-summary .total-due-today {
    background-color: transparent !important;
    color: var(--bl-heading) !important;
}

.order-summary .total-due-today .amt {
    color: var(--bl-accent) !important;
}

.order-summary .total-due-today span {
    color: var(--bl-text-secondary) !important;
}

.order-summary .total-due-today .amt {
    color: var(--bl-accent) !important;
}

/* --------------------------------------------------------------------------
   Domain Promo Boxes (Add Hosting / Transfer Domain)
   -------------------------------------------------------------------------- */

.domain-promo-box {
    background-color: var(--bl-bg-card) !important;
    border: 1px solid var(--bl-border) !important;
    border-radius: 16px !important;
    color: var(--bl-text-primary) !important;
}

.domain-promo-box h3 {
    color: var(--bl-heading) !important;
}

.domain-promo-box p {
    color: var(--bl-text-secondary) !important;
}

.domain-promo-box .text-warning {
    color: var(--bl-warning) !important;
}

.domain-promo-box .text-primary {
    color: var(--bl-accent) !important;
}

.domain-promo-box i.fas {
    color: var(--bl-accent) !important;
}

.domain-promo-box .btn-warning {
    background-color: var(--bl-warning) !important;
    border-color: var(--bl-warning) !important;
    color: var(--bl-bg-primary) !important;
    border-radius: 12px !important;
}

.domain-promo-box .btn-warning:hover {
    filter: brightness(1.1);
}

.domain-promo-box .btn-primary {
    background-color: var(--bl-accent) !important;
    border-color: var(--bl-accent) !important;
    color: var(--bl-bg-primary) !important;
    border-radius: 12px !important;
}

.domain-promo-box .btn-primary:hover {
    filter: brightness(1.1);
}

.domain-promo-box .small {
    color: var(--bl-text-muted) !important;
}

/* --------------------------------------------------------------------------
   Domain Renewal Cards (cart.php?a=add&domain=renew)
   -------------------------------------------------------------------------- */

#domainRenewals,
.domain-renewals {
    background-color: transparent !important;
}

.domain-renewal {
    background-color: var(--bl-bg-card) !important;
    border: 1px solid var(--bl-border) !important;
    border-radius: 16px !important;
    color: var(--bl-text-primary) !important;
    padding: 20px !important;
    margin-bottom: 16px !important;
}

.domain-renewal h3 {
    color: var(--bl-heading) !important;
}

.domain-renewal p {
    color: var(--bl-text-secondary) !important;
}

.domain-renewal .label-warning {
    background-color: rgba(245, 158, 11, 0.15) !important;
    color: var(--bl-warning) !important;
}

.domain-renewal .label-success {
    background-color: rgba(44, 219, 135, 0.15) !important;
    color: var(--bl-accent) !important;
}

.domain-renewal .label-info {
    background-color: rgba(91, 192, 222, 0.15) !important;
    color: #5bc0de !important;
}

.domain-renewal .control-label {
    color: var(--bl-text-secondary) !important;
}

.domain-renewal .btn-add-renewal-to-cart,
.domain-renewal .btn-default {
    background-color: rgba(44, 219, 135, 0.08) !important;
    border: 1px solid var(--bl-border) !important;
    color: var(--bl-text-primary) !important;
    border-radius: 12px !important;
}

.domain-renewal .btn-add-renewal-to-cart:hover,
.domain-renewal .btn-default:hover {
    background-color: rgba(44, 219, 135, 0.15) !important;
    border-color: var(--bl-accent) !important;
    color: var(--bl-accent) !important;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
    .bl-login-card {
        padding: 24px;
        margin: 16px;
    }

    .bl-remember-row {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start;
    }

    section#header .top-nav {
        text-align: center;
    }

    .navbar-default .navbar-collapse {
        background-color: var(--bl-bg-secondary);
        border-color: var(--bl-border);
    }

    .bl-footer-content {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }
}

/* --------------------------------------------------------------------------
   Print
   -------------------------------------------------------------------------- */

@media print {
    body {
        background-color: #fff !important;
        color: #333 !important;
    }

    .panel {
        background-color: #fff !important;
        border-color: #ddd !important;
        box-shadow: none !important;
    }

    .table > thead > tr > th {
        background-color: #f5f5f5 !important;
        color: #333 !important;
    }

    a { color: #058 !important; }

    section#header,
    section#main-menu,
    section#footer,
    .back-to-top {
        display: none !important;
    }
}
