/*********************************************
 * Yogi's VPS x SitesByYogi – WHMCS Theme
 *********************************************/

/* ---------- Brand Tokens ---------- */
body.primary-bg-color {
  --sby-bg: #050814;
  --sby-bg-alt: #0b1020;
  --sby-bg-soft: #111827;
  --sby-card: #0b1020;
  --sby-card-alt: #111827;
  --sby-border: rgba(148, 163, 184, 0.25);
  --sby-text: #e5e7eb;
  --sby-text-muted: #9ca3af;
  --sby-heading: #f9fafb;
  --sby-accent: #6ec1e4;      /* SitesByYogi / WPNfinite teal */
  --sby-accent-strong: #3ba7d5;
  --sby-gold: #ffb71b;        /* Accent gold */
  --sby-danger: #f97373;
  --sby-radius-lg: 18px;
  --sby-radius-md: 12px;
  --sby-radius-pill: 999px;
  --sby-shadow-soft: 0 22px 55px rgba(15, 23, 42, 0.95);
  --sby-shadow-subtle: 0 14px 35px rgba(15, 23, 42, 0.75);
  --sby-input-bg: #020617;
  --sby-input-border: rgba(148, 163, 184, 0.5);
  --sby-nav-height: 78px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* ---------- Global Background + Base ---------- */
body.primary-bg-color {
  background: radial-gradient(circle at top left, #101827 0%, #050814 55%, #020308 100%);
  color: var(--sby-text);
}

body.primary-bg-color #wrapper,
body.primary-bg-color #main-body {
  background: transparent;
}

body.primary-bg-color a {
  color: var(--sby-accent);
  text-decoration: none;
  transition: color 0.18s ease, opacity 0.18s ease;
}
body.primary-bg-color a:hover,
body.primary-bg-color a:focus {
  color: var(--sby-accent-strong);
  text-decoration: underline;
}

/* ---------- Header + Navbar (match SitesByYogi/Yogi’s VPS) ---------- */

body.primary-bg-color .header,
body.primary-bg-color header.header {
  background: radial-gradient(circle at top left, #111827 0%, #020617 65%, #020308 100%);
  border-bottom: 1px solid rgba(15, 23, 42, 0.95);
  box-shadow: var(--sby-shadow-subtle);
}

/* Nav bar inside header */
body.primary-bg-color .header .navbar {
  background: transparent;
  min-height: var(--sby-nav-height);
  padding: 10px 0;
}

body.primary-bg-color .header .navbar .navbar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--sby-heading) !important;
  font-size: 0.95rem;
}

body.primary-bg-color .header .navbar .navbar-brand img {
  max-height: 38px;
  width: auto;
}

/* Main nav links */
body.primary-bg-color .header .navbar .nav > li > a,
body.primary-bg-color .header .navbar .navbar-nav > li > a {
  color: var(--sby-text-muted);
  font-weight: 500;
  padding: 18px 14px;
  text-transform: none;
  font-size: 0.95rem;
}

body.primary-bg-color .header .navbar .nav > li > a:hover,
body.primary-bg-color .header .navbar .nav > li.active > a,
body.primary-bg-color .header .navbar .navbar-nav > li > a:hover,
body.primary-bg-color .header .navbar .navbar-nav > li.active > a {
  color: var(--sby-heading);
  background: linear-gradient(90deg, rgba(110, 193, 228, 0.16), transparent);
}

/* Mobile toggle */
body.primary-bg-color .navbar-toggle,
body.primary-bg-color .navbar-toggler {
  border-color: rgba(148, 163, 184, 0.5);
}
body.primary-bg-color .navbar-toggle .icon-bar {
  background-color: var(--sby-accent);
}

/* ---------- Header Hero Bar (under nav) ---------- */

body.primary-bg-color .yvps-hero-bar {
  border-top: 1px solid rgba(15, 23, 42, 0.9);
  border-bottom: 1px solid rgba(15, 23, 42, 0.9);
  background:
    radial-gradient(circle at top left, rgba(110, 193, 228, 0.18), transparent 55%),
    linear-gradient(135deg, #050814 0%, #0b1020 55%, #020617 100%);
  padding: 22px 0 20px;
}

body.primary-bg-color .yvps-hero-bar .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: 1200px;
}

body.primary-bg-color .yvps-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--sby-radius-pill);
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.45);
  color: var(--sby-text-muted);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

body.primary-bg-color .yvps-hero-title {
  margin: 10px 0 4px;
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--sby-heading);
}

body.primary-bg-color .yvps-hero-text {
  margin: 0;
  color: var(--sby-text-muted);
  font-size: 0.92rem;
}

body.primary-bg-color .yvps-hero-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  text-align: right;
}

body.primary-bg-color .btn-hero-primary {
  border-radius: var(--sby-radius-pill);
  padding: 8px 20px;
  font-size: 0.9rem;
  font-weight: 600;
  background: linear-gradient(135deg, var(--sby-accent), var(--sby-accent-strong));
  border: 1px solid var(--sby-accent-strong);
  color: #020617 !important;
  box-shadow: 0 16px 40px rgba(110, 193, 228, 0.45);
}
body.primary-bg-color .btn-hero-primary:hover {
  background: linear-gradient(135deg, var(--sby-accent-strong), var(--sby-accent));
  transform: translateY(-1px);
}

body.primary-bg-color .yvps-hero-link {
  font-size: 0.84rem;
  color: var(--sby-text-muted);
  text-decoration: none;
}
body.primary-bg-color .yvps-hero-link:hover {
  color: var(--sby-accent);
}

/* Mobile hero layout */
@media (max-width: 767px) {
  body.primary-bg-color .yvps-hero-bar .container {
    flex-direction: column;
    align-items: flex-start;
  }
  body.primary-bg-color .yvps-hero-actions {
    align-items: flex-start;
    text-align: left;
  }
}

/* ---------- Panels & Cards (client home, invoices, services) ---------- */

body.primary-bg-color .panel,
body.primary-bg-color .panel.panel-default,
body.primary-bg-color .home-shortcuts .panel,
body.primary-bg-color .card {
  background: var(--sby-card);
  border-radius: var(--sby-radius-lg);
  border: 1px solid var(--sby-border);
  box-shadow: var(--sby-shadow-subtle);
  color: var(--sby-text);
}

body.primary-bg-color .panel-heading,
body.primary-bg-color .card-header {
  background: linear-gradient(90deg, rgba(110, 193, 228, 0.2), transparent);
  border-bottom: 1px solid var(--sby-border);
  border-radius: var(--sby-radius-lg) var(--sby-radius-lg) 0 0;
  color: var(--sby-heading);
  font-weight: 600;
}

/* Dashboard tiles */
body.primary-bg-color .home-shortcuts .panel-body a {
  display: block;
  background: radial-gradient(circle at top left, #111827 0%, #020617 80%);
  border-radius: var(--sby-radius-md);
  border: 1px solid var(--sby-border);
  color: var(--sby-text);
  padding: 14px 14px;
  box-shadow: var(--sby-shadow-soft);
}
body.primary-bg-color .home-shortcuts .panel-body a:hover {
  border-color: var(--sby-accent);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.98);
  transform: translateY(-2px);
}

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

body.primary-bg-color .btn,
body.primary-bg-color .btn-sm {
  border-radius: var(--sby-radius-pill);
  font-weight: 600;
  padding: 8px 18px;
  border-width: 1px;
}

/* Primary */
body.primary-bg-color .btn-primary,
body.primary-bg-color .btn-success {
  background: linear-gradient(135deg, var(--sby-accent), var(--sby-accent-strong));
  border-color: var(--sby-accent-strong);
  color: #020617;
}
body.primary-bg-color .btn-primary:hover,
body.primary-bg-color .btn-success:hover {
  background: linear-gradient(135deg, var(--sby-accent-strong), var(--sby-accent));
  box-shadow: 0 16px 40px rgba(110, 193, 228, 0.45);
}

/* Outline / default */
body.primary-bg-color .btn-default,
body.primary-bg-color .btn-secondary,
body.primary-bg-color .btn-link {
  background: transparent;
  border-color: var(--sby-input-border);
  color: var(--sby-text);
}
body.primary-bg-color .btn-default:hover,
body.primary-bg-color .btn-secondary:hover,
body.primary-bg-color .btn-link:hover {
  border-color: var(--sby-accent);
  color: var(--sby-accent);
}

/* ---------- Forms & Inputs ---------- */

body.primary-bg-color input[type="text"],
body.primary-bg-color input[type="email"],
body.primary-bg-color input[type="password"],
body.primary-bg-color input[type="tel"],
body.primary-bg-color input[type="number"],
body.primary-bg-color select,
body.primary-bg-color textarea {
  background: var(--sby-input-bg);
  border-radius: 10px;
  border: 1px solid var(--sby-input-border);
  color: var(--sby-text);
  padding: 9px 12px;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.7);
}
body.primary-bg-color input::placeholder,
body.primary-bg-color textarea::placeholder {
  color: var(--sby-text-muted);
}
body.primary-bg-color input:focus,
body.primary-bg-color textarea:focus,
body.primary-bg-color select:focus {
  outline: none;
  border-color: var(--sby-accent);
  box-shadow: 0 0 0 1px rgba(110, 193, 228, 0.5);
}

/* ---------- Tables (services, invoices, domains) ---------- */

body.primary-bg-color table.table > thead > tr > th {
  background: rgba(15, 23, 42, 0.96);
  border-bottom: 1px solid var(--sby-border);
  color: var(--sby-text-muted);
  font-weight: 600;
}

body.primary-bg-color table.table > tbody > tr > td {
  border-top: 1px solid rgba(31, 41, 55, 0.9);
  background: rgba(15, 23, 42, 0.7);
}
body.primary-bg-color table.table > tbody > tr:hover > td {
  background: rgba(15, 23, 42, 0.98);
}

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

body.primary-bg-color .footer,
body.primary-bg-color #footer,
body.primary-bg-color .clientareafooter {
  background: #020617;
  border-top: 1px solid rgba(15, 23, 42, 0.95);
  color: var(--sby-text-muted);
  padding: 26px 0 30px;
  font-size: 0.86rem;
}
body.primary-bg-color .footer a,
body.primary-bg-color #footer a {
  color: var(--sby-accent);
}

/***************************************************
 * Yogi's VPS – Cart / Order Form Styling Cleanup
 * Target: standard_cart + header/footer/modals
 ***************************************************/

/* ---------- HEADER / NAVBAR / SEARCH ---------- */

body.primary-bg-color header.header {
  background: radial-gradient(circle at top left, #111827 0%, #020617 65%, #020308 100%);
  border-bottom: 1px solid rgba(15, 23, 42, 0.95);
}

/* Top navbar (logo + search + cart) */
body.primary-bg-color .header .navbar.navbar-light {
  background: transparent;
  color: #e5e7eb;
}

body.primary-bg-color .header .navbar.navbar-light .navbar-brand {
  color: #f9fafb;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Top search bar (desktop) */
body.primary-bg-color .header .input-group.search .form-control {
  background: #020617;
  border-color: rgba(148, 163, 184, 0.5);
  color: #e5e7eb;
}
body.primary-bg-color .header .input-group.search .form-control::placeholder {
  color: #9ca3af;
}
body.primary-bg-color .header .input-group.search .btn.btn-default {
  background: #020617;
  border-color: rgba(148, 163, 184, 0.5);
  color: #9ca3af;
}
body.primary-bg-color .header .input-group.search .btn.btn-default:hover {
  border-color: #6ec1e4;
  color: #6ec1e4;
}

/* Cart button in toolbar */
body.primary-bg-color .toolbar .cart-btn {
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.5);
  color: #e5e7eb;
}
body.primary-bg-color .toolbar .cart-btn .badge-info {
  background: #6ec1e4;
  color: #020617;
}

/* Main nav bar (Home / Pricing / Articles, etc.) */
body.primary-bg-color .main-navbar-wrapper {
  background: transparent;
  border-top: 1px solid rgba(15, 23, 42, 0.9);
}
body.primary-bg-color .main-navbar-wrapper .navbar-nav > li > a {
  color: #9ca3af;
  font-weight: 500;
  padding-top: 18px;
  padding-bottom: 18px;
}
body.primary-bg-color .main-navbar-wrapper .navbar-nav > li > a:hover,
body.primary-bg-color .main-navbar-wrapper .navbar-nav > li.active > a {
  color: #f9fafb;
  background: linear-gradient(90deg, rgba(110, 193, 228, 0.16), transparent);
}

/* Account dropdown */
body.primary-bg-color .main-navbar-wrapper .dropdown-menu {
  background: #020617;
  border: 1px solid rgba(15, 23, 42, 0.95);
}
body.primary-bg-color .main-navbar-wrapper .dropdown-item {
  color: #e5e7eb;
}
body.primary-bg-color .main-navbar-wrapper .dropdown-item:hover {
  background: #111827;
  color: #f9fafb;
}

/* ---------- BREADCRUMB BAR ---------- */

body.primary-bg-color .master-breadcrumb {
  background: #020617;
  border-top: 1px solid rgba(15, 23, 42, 0.95);
  border-bottom: 1px solid rgba(15, 23, 42, 0.95);
}
body.primary-bg-color .master-breadcrumb .breadcrumb {
  background: transparent;
  margin-bottom: 0;
}
body.primary-bg-color .master-breadcrumb .breadcrumb-item,
body.primary-bg-color .master-breadcrumb .breadcrumb-item a {
  color: #9ca3af;
}
body.primary-bg-color .master-breadcrumb .breadcrumb-item.active {
  color: #e5e7eb;
}

/* ---------- SIDEBAR (Categories / Actions) ---------- */

body.primary-bg-color .cart-sidebar .card-sidebar,
body.primary-bg-color .cart-sidebar .panel-sidebar {
  background: #0b1020;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.9);
}

body.primary-bg-color .cart-sidebar .panel-heading.card-header {
  background: linear-gradient(90deg, rgba(110, 193, 228, 0.2), transparent);
  border-bottom: 1px solid rgba(148, 163, 184, 0.25);
  color: #f9fafb;
}
body.primary-bg-color .cart-sidebar .panel-title {
  font-size: 0.9rem;
  font-weight: 600;
}

/* Sidebar list items */
body.primary-bg-color .cart-sidebar .list-group-item {
  background: #020617;
  border-color: rgba(31, 41, 55, 0.9);
  color: #e5e7eb;
}
body.primary-bg-color .cart-sidebar .list-group-item:hover {
  background: #111827;
  color: #f9fafb;
}
body.primary-bg-color .cart-sidebar .list-group-item.active,
body.primary-bg-color .cart-sidebar .list-group-item.active:focus,
body.primary-bg-color .cart-sidebar .list-group-item.active:hover {
  background: linear-gradient(135deg, #6ec1e4, #3ba7d5);
  border-color: #3ba7d5;
  color: #020617;
}

/* Collapsed sidebar selects (mobile) */
body.primary-bg-color .sidebar-collapsed .panel {
  background: #0b1020;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.25);
}
body.primary-bg-color .sidebar-collapsed .card-header {
  background: #111827;
  color: #f9fafb;
}
body.primary-bg-color .sidebar-collapsed .custom-select {
  background: #020617;
  border-color: rgba(148, 163, 184, 0.5);
  color: #e5e7eb;
}

/* ---------- CART BODY / PAGE TITLE ---------- */

body.primary-bg-color #main-body {
  padding-top: 30px;
  padding-bottom: 40px;
}
body.primary-bg-color .primary-content {
  color: #e5e7eb;
}

body.primary-bg-color .header-lined h1 {
  color: #f9fafb;
}
body.primary-bg-color .header-lined p {
  color: #9ca3af;
}

/* ---------- PRODUCT CARDS ---------- */

body.primary-bg-color #order-standard_cart .products .product {
  background: #020617;
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.95);
  overflow: hidden;
}

body.primary-bg-color #order-standard_cart .products .product header {
  background: linear-gradient(135deg, #6ec1e4, #3ba7d5);
  padding: 14px 16px;
}
body.primary-bg-color #order-standard_cart .products .product header span {
  color: #020617 !important;
  font-weight: 700;
  font-size: 1rem;
}

/* Description section */
body.primary-bg-color #order-standard_cart .products .product .product-desc {
  background: #020617;
  color: #e5e7eb;
}
body.primary-bg-color #order-standard_cart .products .product .product-desc p {
  color: #e5e7eb;
  font-size: 0.92rem;
}
body.primary-bg-color #order-standard_cart .products .product .product-desc ul {
  color: #9ca3af;
}

/* Footer pricing + button */
body.primary-bg-color #order-standard_cart .products .product footer {
  background: #050814;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
}
body.primary-bg-color #order-standard_cart .product-pricing .price {
  color: #ffb71b;
  font-weight: 800;
}
body.primary-bg-color #order-standard_cart .product-pricing {
  color: #9ca3af;
}

/* Order Now button */
body.primary-bg-color #order-standard_cart .btn-order-now {
  border-radius: 999px;
  padding: 7px 16px;
  background: linear-gradient(135deg, #6ec1e4, #3ba7d5);
  border-color: #3ba7d5;
  color: #020617 !important;
  font-weight: 600;
}
body.primary-bg-color #order-standard_cart .btn-order-now:hover {
  background: linear-gradient(135deg, #3ba7d5, #6ec1e4);
  box-shadow: 0 16px 40px rgba(110, 193, 228, 0.45);
}

/* ---------- GENERIC BUTTON / LINK FIXES ---------- */

body.primary-bg-color .btn-default,
body.primary-bg-color .btn-secondary {
  background: #020617;
  border-color: rgba(148, 163, 184, 0.6);
  color: #e5e7eb;
}
body.primary-bg-color .btn-default:hover,
body.primary-bg-color .btn-secondary:hover {
  border-color: #6ec1e4;
  color: #6ec1e4;
}

/* Ensure .btn-primary always readable on dark BG */
body.primary-bg-color .btn-primary {
  background: linear-gradient(135deg, #6ec1e4, #3ba7d5);
  border-color: #3ba7d5;
  color: #020617;
}
body.primary-bg-color .btn-primary:hover {
  background: linear-gradient(135deg, #3ba7d5, #6ec1e4);
}

/* Dropdown items (language modal, account menu, etc.) */
body.primary-bg-color .dropdown-menu .dropdown-item {
  color: #e5e7eb;
}
body.primary-bg-color .dropdown-menu .dropdown-item:hover {
  background: #111827;
  color: #f9fafb;
}

/* ---------- MODALS ---------- */

/* Generic modal container */
body.primary-bg-color .modal-content {
  background: #020617;
  color: #e5e7eb;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.4);
}
body.primary-bg-color .modal-header {
  border-bottom-color: rgba(31, 41, 55, 0.9);
}
body.primary-bg-color .modal-footer {
  border-top-color: rgba(31, 41, 55, 0.9);
}

/* "Added to Cart" recommendations modal */
body.primary-bg-color #recommendationsModal .modal-header h4 {
  color: #f9fafb;
}
body.primary-bg-color #recommendationsModal p {
  color: #e5e7eb;
}

/* Language selection modal */
body.primary-bg-color .modal-localisation .modal-content {
  background: #020617;
}
body.primary-bg-color .modal-localisation h5 {
  color: #f9fafb;
}
body.primary-bg-color .modal-localisation .item-selector .item {
  display: inline-block;
  padding: 6px 10px;
  margin-bottom: 6px;
  border-radius: 999px;
  color: #e5e7eb;
  text-decoration: none;
}
body.primary-bg-color .modal-localisation .item-selector .item:hover {
  background: #111827;
}
body.primary-bg-color .modal-localisation .item-selector .item.active {
  background: linear-gradient(135deg, #6ec1e4, #3ba7d5);
  color: #020617;
}

/* Password generator modal (bg-primary override) */
body.primary-bg-color .modal-header.bg-primary {
  background: #111827 !important;
  color: #f9fafb !important;
}
body.primary-bg-color .modal-header.bg-primary .close span {
  color: #f9fafb;
}

/* System modal */
body.primary-bg-color .system-modal .modal-content {
  background: #020617;
}

/* ---------- FOOTER ---------- */

body.primary-bg-color .footer {
  background: #020617;
  border-top: 1px solid rgba(15, 23, 42, 0.95);
  color: #9ca3af;
}
body.primary-bg-color .footer a.nav-link {
  color: #e5e7eb;
}
body.primary-bg-color .footer a.nav-link:hover {
  color: #6ec1e4;
}

/* Language / currency button in footer */
body.primary-bg-color .footer .btn {
  background: #050814;
  border-color: rgba(148, 163, 184, 0.6);
  color: #e5e7eb;
  border-radius: 999px;
}
body.primary-bg-color .footer .btn:hover {
  border-color: #6ec1e4;
  color: #6ec1e4;
}

/* "Return to admin" floating button */
body.primary-bg-color .btn-return-to-admin {
  background: #111827;
  border-color: rgba(148, 163, 184, 0.7);
  color: #e5e7eb;
}
body.primary-bg-color .btn-return-to-admin:hover {
  background: #020617;
  border-color: #6ec1e4;
  color: #6ec1e4;
}

/***************************************************
 * Yogi's VPS – Portal Home Styling
 ***************************************************/

/* ---------- GLOBAL TWEAKS FOR THIS PAGE ---------- */

body.primary-bg-color {
  background: radial-gradient(circle at top left, #101827 0%, #050814 55%, #020308 100%);
  color: #e5e7eb;
}

/* Make all headings readable on dark */
body.primary-bg-color h1,
body.primary-bg-color h2,
body.primary-bg-color h3,
body.primary-bg-color h4,
body.primary-bg-color h5 {
  color: #f9fafb;
}

/* Override Bootstrap "bg-white" on dark theme */
body.primary-bg-color .bg-white {
  background: #020617 !important;
}

/* Buttons / links that used to assume light background */
body.primary-bg-color .btn-outline-primary {
  background: transparent;
  border-color: #6ec1e4;
  color: #6ec1e4;
}
body.primary-bg-color .btn-outline-primary:hover {
  background: rgba(110, 193, 228, 0.12);
  border-color: #3ba7d5;
  color: #f9fafb;
}

body.primary-bg-color .btn-link {
  color: #6ec1e4;
}
body.primary-bg-color .btn-link:hover {
  color: #3ba7d5;
  text-decoration: underline;
}

/* ---------- HEADER (same as cart page; just making sure) ---------- */

body.primary-bg-color header.header {
  background: radial-gradient(circle at top left, #111827 0%, #020617 65%, #020308 100%);
  border-bottom: 1px solid rgba(15, 23, 42, 0.95);
}

body.primary-bg-color .header .navbar.navbar-light {
  background: transparent;
  color: #e5e7eb;
}

body.primary-bg-color .header .navbar.navbar-light .navbar-brand {
  color: #f9fafb;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Search in header */
body.primary-bg-color .header .input-group.search .form-control {
  background: #020617;
  border-color: rgba(148, 163, 184, 0.5);
  color: #e5e7eb;
}
body.primary-bg-color .header .input-group.search .form-control::placeholder {
  color: #9ca3af;
}
body.primary-bg-color .header .input-group.search .btn.btn-default {
  background: #020617;
  border-color: rgba(148, 163, 184, 0.5);
  color: #9ca3af;
}
body.primary-bg-color .header .input-group.search .btn.btn-default:hover {
  border-color: #6ec1e4;
  color: #6ec1e4;
}

/* Main nav items */
body.primary-bg-color .main-navbar-wrapper {
  background: transparent;
  border-top: 1px solid rgba(15, 23, 42, 0.9);
}
body.primary-bg-color .main-navbar-wrapper .navbar-nav > li > a {
  color: #9ca3af;
  font-weight: 500;
  padding-top: 18px;
  padding-bottom: 18px;
}
body.primary-bg-color .main-navbar-wrapper .navbar-nav > li > a:hover,
body.primary-bg-color .main-navbar-wrapper .navbar-nav > li.active > a {
  color: #f9fafb;
  background: linear-gradient(90deg, rgba(110, 193, 228, 0.16), transparent);
}

/* ---------- BREADCRUMB ---------- */

body.primary-bg-color .master-breadcrumb {
  background: #020617;
  border-top: 1px solid rgba(15, 23, 42, 0.95);
  border-bottom: 1px solid rgba(15, 23, 42, 0.95);
}
body.primary-bg-color .master-breadcrumb .breadcrumb {
  background: transparent;
  margin-bottom: 0;
}
body.primary-bg-color .master-breadcrumb .breadcrumb-item,
body.primary-bg-color .master-breadcrumb .breadcrumb-item a {
  color: #9ca3af;
}
body.primary-bg-color .master-breadcrumb .breadcrumb-item.active {
  color: #e5e7eb;
}

/* ---------- DOMAIN SEARCH STRIP ---------- */

body.primary-bg-color .home-domain-search {
  /* Used to be white – now dark hero-style strip */
  background:
    radial-gradient(circle at top left, rgba(110, 193, 228, 0.16), transparent 55%),
    linear-gradient(135deg, #050814 0%, #0b1020 55%, #020617 100%);
  border-bottom: 1px solid rgba(15, 23, 42, 0.9);
}

body.primary-bg-color .home-domain-search h2 {
  color: #f9fafb;
  font-weight: 800;
  margin-bottom: 18px;
}

body.primary-bg-color .home-domain-search .input-group .form-control {
  background: #020617;
  border-color: rgba(148, 163, 184, 0.6);
  color: #e5e7eb;
}
body.primary-bg-color .home-domain-search .input-group .form-control::placeholder {
  color: #9ca3af;
}

/* Search / Transfer buttons (desktop + mobile) */
body.primary-bg-color .home-domain-search .btn-primary,
body.primary-bg-color .home-domain-search #btnDomainSearch,
body.primary-bg-color .home-domain-search #btnDomainSearch2 {
  background: linear-gradient(135deg, #6ec1e4, #3ba7d5);
  border-color: #3ba7d5;
  color: #020617;
  font-weight: 600;
}
body.primary-bg-color .home-domain-search .btn-primary:hover,
body.primary-bg-color .home-domain-search #btnDomainSearch:hover,
body.primary-bg-color .home-domain-search #btnDomainSearch2:hover {
  background: linear-gradient(135deg, #3ba7d5, #6ec1e4);
}

body.primary-bg-color .home-domain-search .btn-success,
body.primary-bg-color .home-domain-search #btnTransfer,
body.primary-bg-color .home-domain-search #btnTransfer2 {
  background: linear-gradient(135deg, #22c55e, #16a34a);
  border-color: #16a34a;
  color: #020617;
  font-weight: 600;
}
body.primary-bg-color .home-domain-search .btn-success:hover,
body.primary-bg-color .home-domain-search #btnTransfer:hover,
body.primary-bg-color .home-domain-search #btnTransfer2:hover {
  background: linear-gradient(135deg, #16a34a, #22c55e);
}

/* "View all pricing" link */
body.primary-bg-color .home-domain-search .btn-link {
  color: #9ca3af;
}
body.primary-bg-color .home-domain-search .btn-link:hover {
  color: #6ec1e4;
}

/* ---------- "BROWSE OUR PRODUCTS / SERVICES" CARDS ---------- */

body.primary-bg-color .card-columns.home .card {
  background: #020617;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.9);
}

body.primary-bg-color .card-columns.home .card-title {
  color: #f9fafb;
  font-weight: 700;
}

body.primary-bg-color .card-columns.home .card p {
  color: #9ca3af;
}

/* Buttons inside those cards */
body.primary-bg-color .card-columns.home .btn-outline-primary {
  background: transparent;
  border-color: #6ec1e4;
  color: #6ec1e4;
  border-radius: 999px;
  font-weight: 600;
}
body.primary-bg-color .card-columns.home .btn-outline-primary:hover {
  background: rgba(110, 193, 228, 0.12);
  border-color: #3ba7d5;
  color: #f9fafb;
}

/* ---------- "HOW CAN WE HELP TODAY" & "YOUR ACCOUNT" ICON TILES ---------- */

body.primary-bg-color .action-icon-btns {
  margin-bottom: 2rem;
}

/* Base tile */
body.primary-bg-color .action-icon-btns a {
  display: block;
  text-align: center;
  padding: 18px 12px 14px;
  border-radius: 18px;
  background: #020617;
  border: 1px solid rgba(148, 163, 184, 0.28);
  color: #e5e7eb;
  font-weight: 500;
  text-decoration: none;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.95);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

body.primary-bg-color .action-icon-btns a:hover {
  transform: translateY(-2px);
  border-color: #6ec1e4;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.98);
}

/* Icon circle */
body.primary-bg-color .action-icon-btns .ico-container {
  width: 52px;
  height: 52px;
  border-radius: 999px;
  margin: 0 auto 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0b1020;
}

/* Icon itself */
body.primary-bg-color .action-icon-btns i {
  font-size: 22px;
}

/* Accent variants – keep text readable but add subtle color cues */
body.primary-bg-color .card-accent-teal .ico-container {
  background: rgba(110, 193, 228, 0.18);
}
body.primary-bg-color .card-accent-teal i {
  color: #6ec1e4;
}

body.primary-bg-color .card-accent-pomegranate .ico-container {
  background: rgba(248, 113, 113, 0.18);
}
body.primary-bg-color .card-accent-pomegranate i {
  color: #f97373;
}

body.primary-bg-color .card-accent-sun-flower .ico-container {
  background: rgba(250, 204, 21, 0.18);
}
body.primary-bg-color .card-accent-sun-flower i {
  color: #facc15;
}

body.primary-bg-color .card-accent-asbestos .ico-container {
  background: rgba(148, 163, 184, 0.25);
}
body.primary-bg-color .card-accent-asbestos i {
  color: #e5e7eb;
}

body.primary-bg-color .card-accent-green .ico-container {
  background: rgba(34, 197, 94, 0.16);
}
body.primary-bg-color .card-accent-green i {
  color: #22c55e;
}

body.primary-bg-color .card-accent-midnight-blue .ico-container {
  background: rgba(59, 130, 246, 0.16);
}
body.primary-bg-color .card-accent-midnight-blue i {
  color: #60a5fa;
}

/* ---------- FOOTER ---------- */

body.primary-bg-color .footer {
  background: #020617;
  border-top: 1px solid rgba(15, 23, 42, 0.95);
  color: #9ca3af;
}
body.primary-bg-color .footer a.nav-link {
  color: #e5e7eb;
}
body.primary-bg-color .footer a.nav-link:hover {
  color: #6ec1e4;
}

body.primary-bg-color .footer .btn {
  background: #050814;
  border-color: rgba(148, 163, 184, 0.6);
  color: #e5e7eb;
  border-radius: 999px;
}
body.primary-bg-color .footer .btn:hover {
  border-color: #6ec1e4;
  color: #6ec1e4;
}

/* "Return to admin" floating button */
body.primary-bg-color .btn-return-to-admin {
  background: #111827;
  border-color: rgba(148, 163, 184, 0.7);
  color: #e5e7eb;
}
body.primary-bg-color .btn-return-to-admin:hover {
  background: #020617;
  border-color: #6ec1e4;
  color: #6ec1e4;
}

/***************************************************
 * Domain search input – light field on dark hero
 ***************************************************/

body.primary-bg-color .home-domain-search input.form-control {
  background: #ffffff !important;
  color: #111827 !important;
  border-color: #d1d5db !important; /* light gray border */
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.06);
}

body.primary-bg-color .home-domain-search input.form-control::placeholder {
  color: #6b7280 !important; /* medium gray placeholder */
}

/***************************************************
 * Yogi's VPS – Domain Pricing Page
 * URL: /support/index.php?rp=/domain/pricing
 ***************************************************/

/* Wrapper + headings */
body.primary-bg-color .domain-pricing {
  background: transparent;
  color: #e5e7eb;
}

body.primary-bg-color .domain-pricing h4 {
  color: #f9fafb;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

/* ---------- TLD FILTER BADGES ---------- */

body.primary-bg-color .domain-pricing .tld-filters {
  margin-bottom: 1rem;
}

body.primary-bg-color .domain-pricing .tld-filters .badge {
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  font-weight: 500;
}

/* Default "secondary" badge on dark background */
body.primary-bg-color .domain-pricing .tld-filters .badge-secondary {
  background: #020617;
  border: 1px solid rgba(148, 163, 184, 0.6);
  color: #e5e7eb;
}

/* Active filter state (badge-success is used as "selected") */
body.primary-bg-color .domain-pricing .tld-filters .badge-success {
  background: linear-gradient(135deg, #6ec1e4, #3ba7d5);
  border-color: #3ba7d5;
  color: #020617;
}

/* Hover feedback */
body.primary-bg-color .domain-pricing .tld-filters .badge:hover {
  text-decoration: none;
  border-color: #6ec1e4;
}

/* ---------- DOMAIN PRICING TABLE ---------- */

body.primary-bg-color .domain-pricing .table-container {
  background: #020617;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.9);
  padding: 0.75rem;
}

/* DataTables base table */
body.primary-bg-color .domain-pricing table.table-list {
  background: transparent;
  color: #e5e7eb;
  margin-bottom: 0;
}

/* Table header */
body.primary-bg-color .domain-pricing table.table-list thead tr {
  background: #0b1020;
}

body.primary-bg-color .domain-pricing table.table-list thead th {
  border-bottom-color: rgba(55, 65, 81, 0.9);
  color: #9ca3af;
  font-weight: 600;
}

/* Table body rows */
body.primary-bg-color .domain-pricing table.table-list tbody tr {
  background: transparent;
}

body.primary-bg-color .domain-pricing table.table-list tbody td {
  border-top-color: rgba(31, 41, 55, 0.9);
  color: #e5e7eb;
  vertical-align: middle;
}

/* Subtext (1 Year, grace period, etc.) */
body.primary-bg-color .domain-pricing table.table-list tbody td small {
  color: #9ca3af;
}

/* Hover state */
body.primary-bg-color .domain-pricing table.table-list tbody tr:hover {
  background: rgba(15, 23, 42, 0.85);
}

/* ---------- DATATABLES: SEARCH + PAGINATION ---------- */

/* Search input (top-right) */
body.primary-bg-color #tableDomainPricing_wrapper .dataTables_filter label {
  color: #9ca3af;
}

body.primary-bg-color #tableDomainPricing_wrapper .dataTables_filter input[type="search"] {
  background: #020617;
  border: 1px solid rgba(148, 163, 184, 0.6);
  color: #e5e7eb;
  border-radius: 999px;
  padding: 0.25rem 0.75rem;
  margin-left: 0.4rem;
}

body.primary-bg-color #tableDomainPricing_wrapper .dataTables_filter input[type="search"]::placeholder {
  color: #6b7280;
}

/* "Show X entries" control */
body.primary-bg-color #tableDomainPricing_wrapper .dataTables_length label,
body.primary-bg-color #tableDomainPricing_wrapper .dataTables_info {
  color: #9ca3af;
}

body.primary-bg-color #tableDomainPricing_wrapper select {
  background: #020617;
  border-color: rgba(148, 163, 184, 0.6);
  color: #e5e7eb;
}

/* Pagination links */
body.primary-bg-color #tableDomainPricing_wrapper .dataTables_paginate .page-link {
  background: #020617;
  border-color: rgba(55, 65, 81, 0.9);
  color: #e5e7eb;
}

body.primary-bg-color #tableDomainPricing_wrapper .dataTables_paginate .page-link:hover {
  background: #111827;
  color: #f9fafb;
}

body.primary-bg-color #tableDomainPricing_wrapper .dataTables_paginate .page-item.active .page-link {
  background: linear-gradient(135deg, #6ec1e4, #3ba7d5);
  border-color: #3ba7d5;
  color: #020617;
}

/* "Loading..." text */
body.primary-bg-color #tableLoading p {
  color: #9ca3af;
}

/***************************************************
 * Yogi's VPS – Cart & Domain Inputs
 * Make form fields white on dark background
 ***************************************************/

/* All main cart/order inputs */
body.primary-bg-color #order-standard_cart .form-control,
body.primary-bg-color #order-standard_cart .field.form-control {
  background-color: #ffffff !important;
  color: #111827 !important;
  border: 1px solid rgba(148, 163, 184, 0.75);
}

/* Focus state */
body.primary-bg-color #order-standard_cart .form-control:focus,
body.primary-bg-color #order-standard_cart .field.form-control:focus {
  background-color: #ffffff !important;
  color: #020617 !important;
  border-color: #6ec1e4;
  box-shadow: 0 0 0 1px rgba(110, 193, 228, 0.7);
  outline: none;
}

/* Placeholders inside cart inputs */
body.primary-bg-color #order-standard_cart .form-control::placeholder,
body.primary-bg-color #order-standard_cart .field.form-control::placeholder {
  color: #6b7280;
}

/* Mobile “Categories/Actions” dropdowns in collapsed sidebar */
body.primary-bg-color #order-standard_cart select.form-control.custom-select {
  background-color: #ffffff !important;
  color: #111827 !important;
}

/* Promo code specifically (just to be extra safe) */
body.primary-bg-color #inputPromotionCode {
  background-color: #ffffff !important;
  color: #111827 !important;
}

/* State + Country fields in tax calculator */
body.primary-bg-color #inputState,
body.primary-bg-color #inputCountry {
  background-color: #ffffff !important;
  color: #111827 !important;
}

/* Hero domain search + header search inputs */
body.primary-bg-color .home-domain-search input.form-control,
body.primary-bg-color .navbar .input-group.search input.form-control {
  background-color: #ffffff !important;
  color: #111827 !important;
}

/***************************************************
 * Yogi's VPS – Cart Layout Cleanup
 ***************************************************/

/* Cart header strip */
body.primary-bg-color #order-standard_cart .view-cart-items-header {
  margin: 0 0 10px 0;
  padding: 10px 16px;
  background-color: #0b1120; /* deep navy */
  color: #f9fafb;
  font-size: 0.9em;
  border-radius: 8px 8px 0 0;
}

/* Order summary card */
body.primary-bg-color #order-standard_cart .order-summary {
  margin: 0 0 20px 0;
  padding: 16px 18px;
  background-color: #020617; /* nearly black */
  border: 1px solid #1f2937;
  border-bottom-width: 3px;
  border-bottom-color: #058; /* keep your accent */
  border-radius: 8px;
}

/* Order summary headings + text */
body.primary-bg-color #order-standard_cart .order-summary h2,
body.primary-bg-color #order-standard_cart .order-summary .subtotal span,
body.primary-bg-color #order-standard_cart .order-summary .recurring-totals span,
body.primary-bg-color #order-standard_cart .order-summary .total-due-today span {
  color: #e5e7eb;
}

body.primary-bg-color #order-standard_cart .order-summary .total-due-today .amt {
  font-weight: 700;
  font-size: 1.25rem;
  color: #ffffff;
}

/* Tabs below cart (Apply Promo Code, Calculate Taxes, etc.) */
body.primary-bg-color #order-standard_cart .view-cart-tabs .tab-content {
  background: transparent;
  border: none;
  padding: 15px 0 0;
}

/* Inner panel look for each tab pane */
body.primary-bg-color #order-standard_cart .view-cart-tabs .tab-pane {
  background-color: #020617;
  border: 1px solid #1f2937;
  border-radius: 8px;
  padding: 16px 18px;
}

/***************************************************
 * Yogi's VPS – Cart Input Styling
 ***************************************************/

/* All main cart/order inputs */
body.primary-bg-color #order-standard_cart .form-control,
body.primary-bg-color #order-standard_cart .field.form-control {
  background-color: #ffffff !important;
  color: #111827 !important;
  border: 1px solid rgba(148, 163, 184, 0.75);
}

/* Focus state */
body.primary-bg-color #order-standard_cart .form-control:focus,
body.primary-bg-color #order-standard_cart .field.form-control:focus {
  background-color: #ffffff !important;
  color: #020617 !important;
  border-color: #6ec1e4;
  box-shadow: 0 0 0 1px rgba(110, 193, 228, 0.7);
  outline: none;
}

/* Placeholders */
body.primary-bg-color #order-standard_cart .form-control::placeholder,
body.primary-bg-color #order-standard_cart .field.form-control::placeholder {
  color: #6b7280;
}

/* Promo code specifically */
body.primary-bg-color #inputPromotionCode {
  background-color: #ffffff !important;
  color: #111827 !important;
}

/* Tax fields */
body.primary-bg-color #inputState,
body.primary-bg-color #inputCountry {
  background-color: #ffffff !important;
  color: #111827 !important;
}

/* Hero domain search + header knowledgebase search */
body.primary-bg-color .home-domain-search input.form-control,
body.primary-bg-color .navbar .input-group.search input.form-control {
  background-color: #ffffff !important;
  color: #111827 !important;
}

/***************************************************
 * Force dark text on white inputs in cart
 ***************************************************/
body.primary-bg-color #order-standard_cart input[type="text"],
body.primary-bg-color #order-standard_cart input[type="email"],
body.primary-bg-color #order-standard_cart input[type="number"],
body.primary-bg-color #order-standard_cart input[type="tel"],
body.primary-bg-color #order-standard_cart input[type="password"],
body.primary-bg-color #order-standard_cart textarea,
body.primary-bg-color #order-standard_cart select {
  background-color: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important; /* fixes Chrome autofill white text */
}

/* Make sure placeholder is visible too */
body.primary-bg-color #order-standard_cart input::placeholder,
body.primary-bg-color #order-standard_cart textarea::placeholder {
  color: #6b7280 !important;
}

/***************************************************
 * FIX: White text on white background in WHMCS cart
 * Scope: Only inside .primary-content on #order-standard_cart
 ***************************************************/
body.primary-bg-color #order-standard_cart .primary-content,
body.primary-bg-color #order-standard_cart .primary-content * {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important; /* Chrome fix */
}

/* Inputs / selects / textareas */
body.primary-bg-color #order-standard_cart .primary-content input,
body.primary-bg-color #order-standard_cart .primary-content select,
body.primary-bg-color #order-standard_cart .primary-content textarea {
    background-color: #ffffff !important;
    color: #111827 !important;
}

/* Fix placeholder text */
body.primary-bg-color #order-standard_cart .primary-content ::placeholder {
    color: #6b7280 !important;
}

/* Title amount (Total Due Today) */
body.primary-bg-color #order-standard_cart .order-summary .total-due-today .amt {
    color: #111827 !important;
}

/* All summary values */
body.primary-bg-color #order-standard_cart .summary-container span,
body.primary-bg-color #order-standard_cart .summary-container div {
    color: #111827 !important;
}

/* Cart line items – force dark text */
body.primary-bg-color #order-standard_cart .view-cart-items .item span:not(.caret):not(.renewal-price),
body.primary-bg-color #order-standard_cart .view-cart-items .item-group {
    color: #111827 !important;
}

/* (Optional) Make sure item rows sit on a light background */
body.primary-bg-color #order-standard_cart .view-cart-items .item-group {
    background-color: #ffffff !important;
}

/* Domain search input – force light theme */
body.primary-bg-color #order-standard_cart .domain-checker-container .input-group-box .form-control {
    background-color: #ffffff !important;
    color: #111827 !important; /* near-black text */
    border-color: #d1d5db !important;
}

/* Placeholder color for the domain search field */
body.primary-bg-color #order-standard_cart .domain-checker-container .input-group-box .form-control::placeholder {
    color: #6b7280 !important; /* medium gray */
    opacity: 1;
}

/* On focus, keep it clean */
body.primary-bg-color #order-standard_cart .domain-checker-container .input-group-box .form-control:focus {
    background-color: #ffffff !important;
    color: #111827 !important;
    border-color: #2563eb !important; /* optional: blue focus border */
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.3);
}

/* Global form controls in the portal */
body.primary-bg-color .primary-content .form-control,
body.primary-bg-color .primary-content select.form-control,
body.primary-bg-color .primary-content .custom-select {
    background-color: #ffffff !important;
    color: #111827 !important;
}

/* ================================
   DOMAIN PRICING – DARK THEME
   ================================ */

/* Base text color for the pricing block */
body.primary-bg-color .domain-pricing {
    background: transparent;
    color: #e5e7eb;
}

/* Header row across the top ("Domain / New / Transfer / Renewal") */
body.primary-bg-color .domain-pricing .tld-pricing-header {
    background: #020617;
    border-bottom: 1px solid #111827;
}

/* Kill the light gray striping on header cells */
body.primary-bg-color .domain-pricing .tld-pricing-header div:nth-child(odd) {
    background-color: #020617 !important;
    border-color: #111827 !important;
}

/* Left "Domain" header cell */
body.primary-bg-color .domain-pricing .tld-pricing-header .tld-column {
    padding-top: 6px;
    padding-bottom: 6px;
    border-radius: 6px 0 0 0;
}

/* Each TLD row background + striping */
body.primary-bg-color .domain-pricing .tld-row {
    background: rgba(15, 23, 42, 0.95);
    border-bottom: 1px solid rgba(15, 23, 42, 0.85);
    color: #e5e7eb;
}

body.primary-bg-color .domain-pricing .tld-row:nth-child(even) {
    background: rgba(15, 23, 42, 0.8);
}

/* Left column with .com / .net etc. */
body.primary-bg-color .domain-pricing .two-row-center {
    line-height: 28px;
    margin-top: 6px;
    margin-bottom: 6px;
    border-right: 1px solid #1f2937 !important;
}

/* Make the prices readable */
body.primary-bg-color .domain-pricing .tld-row .text-center,
body.primary-bg-color .domain-pricing .tld-row small {
    color: #d1d5db;
}

/* ================================
   DOMAIN PROMO BOXES – DARK CARDS
   (Add Web Hosting / Transfer your domain)
   ================================ */

body.primary-bg-color .domain-promo-box {
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 20px;
    background-color: rgba(15, 23, 42, 0.97) !important;
    border: 1px solid #111827 !important;
    color: #e5e7eb !important;
    border-radius: 8px;
}

/* Headings inside promo boxes */
body.primary-bg-color .domain-promo-box h3 {
    margin: 0;
    font-weight: 500;
    color: #f9fafb !important;
}

/* Body copy inside promo boxes */
body.primary-bg-color .domain-promo-box p {
    margin: 0 0 10px 0;
    font-size: 0.9em;
    color: #d1d5db;
}

/* Keep the yellow accent but tune it for dark bg */
body.primary-bg-color .domain-promo-box .text-warning {
    color: #fbbf24 !important;
}

.btn-warning:not(:disabled):not(.disabled):active {
 color: #ffffff !important;   
}

.btn-warning {
    color: #212529 !important;
    background-color: #ffc107;
    border-color: #ffc107;
}

table.table-list tbody td {
    padding: 10px 8px;
    vertical-align: middle;
    font-size: .9em;
    color: #fff;
}

body.primary-bg-color table.table > tbody > tr > td
 {
    border-top: 1px solid rgba(31, 41, 55, 0.9);
    background: rgba(15, 23, 42, 0.7);
    color: #fff;
}

body.primary-bg-color table.table > tbody > tr:hover > td
 {
    background: rgba(15, 23, 42, 0.98);
    color: #fff !important;
}

div.product-details div.product-icon
 {
    margin: 0;
    background-color: #0a101d;
    border-radius: 10px;
    padding: 30px;
    line-height: 1em;
    font-size: 60px;
}

.fa-inverse
 {
    color: #0a101d;
}

.dataTables_wrapper table.table-list thead th.sorting_asc, .dataTables_wrapper table.table-list thead th.sorting_desc
 {
    background-color: #f6f6f6;
    color: #000;
}

/* ==========================================
   GLOBAL HEADER – DARK LAYOUT (WHMCS PAGES)
   Applies anywhere body has .primary-bg-color
   ========================================== */

/* Overall header wrapper */
body.primary-bg-color .header {
    background: radial-gradient(circle at top left, #020617 0%, #020617 55%, #020617 100%);
    border-bottom: 1px solid #111827;
}

/* Top navbar (logo + search + cart) */
body.primary-bg-color .navbar.navbar-light {
    background: transparent !important;
    border-bottom: 1px solid #111827;
}

/* Brand */
body.primary-bg-color .navbar-light .navbar-brand {
    color: #f9fafb !important;
    font-weight: 700;
    letter-spacing: 0.02em;
}

body.primary-bg-color .navbar-light .navbar-brand:hover,
body.primary-bg-color .navbar-light .navbar-brand:focus {
    color: #e5e7eb !important;
    text-decoration: none;
}

/* Main nav (second bar with menus) */
body.primary-bg-color .main-navbar-wrapper {
    background: #020617 !important;
    border-top: 1px solid #0b1120;
    border-bottom: 1px solid #0b1120;
}

/* Nav links */
body.primary-bg-color .main-navbar-wrapper .navbar-nav .nav-link,
body.primary-bg-color .navbar-light .navbar-nav .nav-link {
    color: #e5e7eb !important;
    font-weight: 500;
}

body.primary-bg-color .main-navbar-wrapper .navbar-nav .nav-link:hover,
body.primary-bg-color .main-navbar-wrapper .navbar-nav .nav-link:focus,
body.primary-bg-color .main-navbar-wrapper .navbar-nav .nav-link.active {
    color: #facc15 !important;
}

/* Dropdown menus */
body.primary-bg-color .main-navbar-wrapper .dropdown-menu {
    background: #020617;
    border: 1px solid #111827;
}

body.primary-bg-color .main-navbar-wrapper .dropdown-menu .dropdown-item {
    color: #e5e7eb;
}

body.primary-bg-color .main-navbar-wrapper .dropdown-menu .dropdown-item:hover,
body.primary-bg-color .main-navbar-wrapper .dropdown-menu .dropdown-item:focus,
body.primary-bg-color .main-navbar-wrapper .dropdown-menu .dropdown-item.active {
    background: #1d4ed8;
    color: #f9fafb;
}

/* Toolbar icons (cart, hamburger, account) */
body.primary-bg-color .toolbar .btn.nav-link,
body.primary-bg-color .toolbar .btn.nav-link i {
    color: #e5e7eb !important;
}

body.primary-bg-color .toolbar .btn.nav-link:hover,
body.primary-bg-color .toolbar .btn.nav-link:focus {
    background: #0b1120;
}

/* Cart badge */
body.primary-bg-color #cartItemCount.badge-info {
    background: #1d4ed8;
    color: #f9fafb;
}

/* Search input in header */
body.primary-bg-color .header .input-group.search .form-control {
    background: #020617;
    border-color: #1f2937;
    color: #e5e7eb;
}

body.primary-bg-color .header .input-group.search .form-control::placeholder {
    color: #6b7280;
}

body.primary-bg-color .header .input-group.search .btn.btn-default {
    background: #020617;
    border-color: #1f2937;
    color: #9ca3af;
}

body.primary-bg-color .header .input-group.search .btn.btn-default:hover {
    background: #0b1120;
    color: #f9fafb;
}

/* Mobile toggle (hamburger) */
body.primary-bg-color .navbar-nav .nav-item .btn.nav-link span.fas.fa-bars {
    color: #e5e7eb;
}

/* Account dropdown in top nav (“Hello, …”) */
body.primary-bg-color .navbar .account > a.dropdown-toggle {
    color: #e5e7eb !important;
    font-weight: 500;
}

body.primary-bg-color .navbar .account .dropdown-menu {
    background: #020617;
    border: 1px solid #111827;
}

body.primary-bg-color .navbar .account .dropdown-menu .dropdown-item {
    color: #e5e7eb;
}

body.primary-bg-color .navbar .account .dropdown-menu .dropdown-item:hover,
body.primary-bg-color .navbar .account .dropdown-menu .dropdown-item:focus {
    background: #1d4ed8;
    color: #f9fafb;
}


/* ==========================================
   MOBILE NAV FIXES — BETTER SPACING & TAPPABLE AREA
   WHMCS – Yogi Theme
   ========================================== */

@media (max-width: 1199px) {

  /* Increase font size for links */
  #mainNavbar .navbar-nav .nav-link {
      font-size: 18px !important;
      line-height: 1.4;
      padding-top: 14px !important;
      padding-bottom: 14px !important;
  }

  /* Increase spacing between list items */
  #mainNavbar .navbar-nav .nav-item {
      margin-bottom: 4px;
  }

  /* Improve dropdown hit area */
  #mainNavbar .dropdown-menu .dropdown-item {
      font-size: 17px !important;
      padding: 14px 18px !important;
  }

  /* Make the entire dropdown area easier to tap */
  #mainNavbar .dropdown-toggle {
      padding-top: 14px !important;
      padding-bottom: 14px !important;
  }

  /* Widen the tap area for the hamburger icon */
  .navbar-nav .nav-item button.nav-link {
      padding: 14px !important;
  }
}

/* Improve general touch target size */
@media (max-width: 767px) {
  .navbar-nav .nav-item {
      padding-left: 4px;
      padding-right: 4px;
  }
}

/* ============================
   Yogi's VPS – WHMCS Header Skin
   ============================ */

body.primary-bg-color {
  background: #020308;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* Full header wrapper */
header.header {
  background: radial-gradient(circle at top left, #101827 0%, #050814 55%, #020308 100%);
  color: #e5e7eb;
  border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

/* Remove stock light backgrounds on navbars */
header.header .navbar,
header.header .main-navbar-wrapper,
header.header .navbar-light {
  background: transparent !important;
  box-shadow: none;
}

/* Topbar strip */
header.header .topbar {
  background: rgba(2, 6, 23, 0.95);
  border-bottom: 1px solid rgba(30, 64, 175, 0.6);
  color: #e5e7eb;
  font-size: 12px;
}

header.header .topbar .btn {
  background: transparent;
  border: 1px solid rgba(148, 163, 184, 0.5);
  color: #e5e7eb;
  border-radius: 999px;
  padding: 4px 10px;
}

header.header .topbar .btn:hover {
  border-color: #38bdf8;
  color: #bfdbfe;
}

/* Logo */
header.header .navbar-brand .logo-img {
  max-height: 32px;
  width: auto;
}

header.header .navbar-brand {
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #f9fafb !important;
}

/* Primary nav links */
header.header #nav .nav-link {
  color: #e5e7eb !important;
  font-size: 14px;
  font-weight: 500;
  padding: 8px 14px;
  border-radius: 999px;
  transition: color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

header.header #nav .nav-link:hover,
header.header #nav .nav-item.active > .nav-link {
  color: #0f172a !important;
  background: linear-gradient(135deg, #38bdf8, #0ea5e9);
  transform: translateY(-1px);
}

/* Cart button */
header.header .toolbar .cart-btn {
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.65);
  background: rgba(15, 23, 42, 0.95);
  color: #e5e7eb !important;
  padding: 6px 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

header.header .toolbar .cart-btn:hover {
  border-color: #38bdf8;
  color: #bfdbfe !important;
}

/* Mobile menu button */
header.header .toolbar .nav-link.btn {
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.65);
  background: rgba(15, 23, 42, 0.95);
  color: #e5e7eb !important;
  padding: 6px 10px;
}

header.header .toolbar .nav-link.btn:hover {
  border-color: #38bdf8;
}

/* Desktop search bar in header */
header.header .input-group.search .form-control {
  background: rgba(15, 23, 42, 0.95);
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.8);
  color: #e5e7eb;
  font-size: 13px;
  padding: 6px 14px;
}

header.header .input-group.search .form-control::placeholder {
  color: #64748b;
}

header.header .input-group.search .btn.btn-default {
  border-radius: 999px 0 0 999px;
  background: linear-gradient(135deg, #38bdf8, #0ea5e9);
  border: 1px solid transparent;
  color: #020617;
  font-size: 13px;
}

header.header .input-group.search .btn.btn-default:hover {
  filter: brightness(1.05);
}

/* Breadcrumb bar */
.master-breadcrumb {
  background: #020617;
  border-bottom: 1px solid rgba(30, 64, 175, 0.6);
}

/* Main body container */
#main-body {
  background: radial-gradient(circle at top left, #020617 0%, #020308 55%, #000 100%);
  color: #e5e7eb;
}

/* Bigger, easier-to-tap mobile menu items */
@media (max-width: 991.98px) {
  /* Target items inside the collapsed main navbar */
  header.header .main-navbar-wrapper .navbar-nav .nav-link {
    font-size: 16px;              /* larger text */
    padding: 12px 18px;           /* bigger tap area */
    line-height: 1.4;
    border-radius: 10px;          /* softer corners instead of pills */
    margin-bottom: 4px;           /* space between items */
  }

  /* Make them span the width nicely */
  header.header .main-navbar-wrapper .navbar-nav .nav-item {
    width: 100%;
  }

  /* Highlight hover/active */
  header.header .main-navbar-wrapper .navbar-nav .nav-link:hover,
  header.header .main-navbar-wrapper .navbar-nav .nav-item.active > .nav-link {
    background: rgba(15, 23, 42, 0.95);
    color: #e5e7eb !important;
  }
}

/* ==========================================================
   WHMCS 8.13 Compatibility Fix
   Fix white text inside white cards/panels
   ========================================================== */

/* White cards */
body.primary-bg-color .card,
body.primary-bg-color .panel,
body.primary-bg-color .list-group-item,
body.primary-bg-color .modal-content,
body.primary-bg-color .dropdown-menu,
body.primary-bg-color .table,
body.primary-bg-color .table-responsive {
    color: #374151 !important;
}

/* Everything inside white cards */
body.primary-bg-color .card *,
body.primary-bg-color .panel *,
body.primary-bg-color .list-group-item *,
body.primary-bg-color .modal-content *,
body.primary-bg-color .table *,
body.primary-bg-color .table td,
body.primary-bg-color .table th {
    color: inherit;
}

/* Card headings */
body.primary-bg-color .card-header,
body.primary-bg-color .panel-heading {
    background: #f8fafc;
    color: #111827 !important;
    border-color: #dbe3ec;
}

body.primary-bg-color .card-header *,
body.primary-bg-color .panel-heading * {
    color: #111827 !important;
}

/* Card bodies */
body.primary-bg-color .card-body,
body.primary-bg-color .panel-body {
    color: #374151 !important;
}

/* Paragraphs */
body.primary-bg-color .card-body p,
body.primary-bg-color .panel-body p,
body.primary-bg-color .card-body span,
body.primary-bg-color .panel-body span,
body.primary-bg-color .card-body div,
body.primary-bg-color .panel-body div,
body.primary-bg-color .card-body li,
body.primary-bg-color .panel-body li {
    color: #374151 !important;
}

/* Dashboard stat tiles */
body.primary-bg-color .tile,
body.primary-bg-color .client-home-panels .card {
    color: #374151;
}

body.primary-bg-color .tile .stat,
body.primary-bg-color .tile .title,
body.primary-bg-color .tile i {
    color: #374151 !important;
}

/* Sidebar panels */
body.primary-bg-color .sidebar .card,
body.primary-bg-color .sidebar .panel {
    color: #374151;
}

body.primary-bg-color .sidebar .card-header,
body.primary-bg-color .sidebar .panel-heading {
    color: #111827 !important;
}

body.primary-bg-color .sidebar .card-body,
body.primary-bg-color .sidebar .panel-body {
    color: #374151 !important;
}

/* Tables */
body.primary-bg-color table.table thead th {
    color: #111827 !important;
}

body.primary-bg-color table.table tbody td {
    color: #374151 !important;
}

/* Forms */
body.primary-bg-color input,
body.primary-bg-color select,
body.primary-bg-color textarea,
body.primary-bg-color .form-control {
    color: #111827 !important;
    background: #fff;
}

body.primary-bg-color input::placeholder,
body.primary-bg-color textarea::placeholder {
    color: #9ca3af;
}

/* Labels */
body.primary-bg-color label,
body.primary-bg-color .control-label,
body.primary-bg-color .form-group label {
    color: #374151 !important;
}

/* Links inside white cards */
body.primary-bg-color .card a,
body.primary-bg-color .panel a {
    color: #2563eb;
}

body.primary-bg-color .card a:hover,
body.primary-bg-color .panel a:hover {
    color: #1d4ed8;
}

/* Keep buttons white */
body.primary-bg-color .btn-primary,
body.primary-bg-color .btn-success,
body.primary-bg-color .btn-danger,
body.primary-bg-color .btn-warning,
body.primary-bg-color .btn-info {
    color: #fff !important;
}

/* Dropdowns */
body.primary-bg-color .dropdown-menu a,
body.primary-bg-color .dropdown-item {
    color: #374151 !important;
}

body.primary-bg-color .dropdown-menu a:hover,
body.primary-bg-color .dropdown-item:hover {
    color: #111827 !important;
    background: #f3f4f6;
}

/* ==========================================================
   Readability corrections for dark WHMCS theme
   ========================================================== */

/* Header navigation */
body.primary-bg-color .header,
body.primary-bg-color header.header,
body.primary-bg-color .header .navbar,
body.primary-bg-color .main-navbar-wrapper {
    color: #e5e7eb;
}

body.primary-bg-color .header a,
body.primary-bg-color .header .navbar a,
body.primary-bg-color .main-navbar-wrapper a,
body.primary-bg-color .main-navbar-wrapper .nav-link,
body.primary-bg-color .header .navbar .nav-link {
    color: #e5e7eb !important;
}

body.primary-bg-color .header a:hover,
body.primary-bg-color .header .navbar a:hover,
body.primary-bg-color .main-navbar-wrapper a:hover,
body.primary-bg-color .main-navbar-wrapper .nav-link:hover {
    color: #6ec1e4 !important;
}

/* Greeting / account menu */
body.primary-bg-color .header .dropdown-toggle,
body.primary-bg-color .header .account,
body.primary-bg-color .header .login,
body.primary-bg-color .header .client-name {
    color: #f9fafb !important;
}

/* Dark dropdown menus in top nav */
body.primary-bg-color .header .dropdown-menu,
body.primary-bg-color .main-navbar-wrapper .dropdown-menu {
    background: #080d1d;
    border-color: #1f2937;
}

body.primary-bg-color .header .dropdown-item,
body.primary-bg-color .main-navbar-wrapper .dropdown-item {
    color: #d1d5db !important;
}

body.primary-bg-color .header .dropdown-item:hover,
body.primary-bg-color .main-navbar-wrapper .dropdown-item:hover {
    background: #111827;
    color: #ffffff !important;
}

/* Breadcrumbs */
body.primary-bg-color .master-breadcrumb,
body.primary-bg-color .breadcrumb,
body.primary-bg-color .breadcrumb-item,
body.primary-bg-color .breadcrumb-item a {
    color: #cbd5e1 !important;
}

/* Dark panel/card headings */
body.primary-bg-color .card-header,
body.primary-bg-color .panel-heading,
body.primary-bg-color .client-home-cards .card-header,
body.primary-bg-color .sidebar .card-header,
body.primary-bg-color .sidebar .panel-heading {
    color: #e5e7eb !important;
}

body.primary-bg-color .card-header *,
body.primary-bg-color .panel-heading *,
body.primary-bg-color .client-home-cards .card-header *,
body.primary-bg-color .sidebar .card-header *,
body.primary-bg-color .sidebar .panel-heading * {
    color: #e5e7eb !important;
}

/* Dark card bodies */
body.primary-bg-color .card-body,
body.primary-bg-color .panel-body {
    color: #cbd5e1;
}

body.primary-bg-color .card-body p,
body.primary-bg-color .panel-body p,
body.primary-bg-color .card-body span:not(.badge):not(.label),
body.primary-bg-color .panel-body span:not(.badge):not(.label),
body.primary-bg-color .card-body li,
body.primary-bg-color .panel-body li {
    color: #cbd5e1;
}

/* Client information block */
body.primary-bg-color .client-home-cards .card-body,
body.primary-bg-color .client-home-cards .panel-body,
body.primary-bg-color .client-home-cards address {
    color: #cbd5e1 !important;
}

/* Overdue invoice text and other dark dashboard cards */
body.primary-bg-color .client-home-cards .card-body,
body.primary-bg-color .client-home-cards .card-body p,
body.primary-bg-color .client-home-cards .card-body div {
    color: #cbd5e1;
}

/* Keep white list rows readable */
body.primary-bg-color .list-group-item,
body.primary-bg-color .card-body .list-group-item,
body.primary-bg-color .panel-body .list-group-item {
    color: #374151 !important;
}

/* White product/service rows */
body.primary-bg-color .client-home-cards .list-group-item,
body.primary-bg-color .client-home-cards table td,
body.primary-bg-color .client-home-cards table th {
    color: #374151 !important;
}

/* Service/product names */
body.primary-bg-color .client-home-cards .list-group-item strong,
body.primary-bg-color .client-home-cards .list-group-item a:not(.btn) {
    color: #374151 !important;
}

/* Sidebar white shortcut rows */
body.primary-bg-color .sidebar .list-group-item,
body.primary-bg-color .sidebar .list-group-item a {
    color: #374151 !important;
}

/* Dashboard card action buttons */
body.primary-bg-color .card-header .btn,
body.primary-bg-color .panel-heading .btn {
    color: #ffffff !important;
}

/* Muted text on dark backgrounds */
body.primary-bg-color .text-muted,
body.primary-bg-color small,
body.primary-bg-color .small {
    color: #94a3b8 !important;
}

/* Keep muted text dark inside white rows/cards */
body.primary-bg-color .list-group-item .text-muted,
body.primary-bg-color .bg-white .text-muted,
body.primary-bg-color .table .text-muted {
    color: #6b7280 !important;
}

/* Icons in dark headings */
body.primary-bg-color .card-header i,
body.primary-bg-color .panel-heading i {
    color: #9ccfe6 !important;
}

/* ==========================================================
   Final dark dashboard card text correction
   Must remain at the bottom of custom.css
   ========================================================== */

/* Overdue invoices dark body */
body.primary-bg-color #overdueInvoicesPanel .card-body,
body.primary-bg-color #overdueInvoicesPanel .card-body p,
body.primary-bg-color #overdueInvoicesPanel .card-body div,
body.primary-bg-color #overdueInvoicesPanel .card-body span {
    color: #cbd5e1 !important;
}

/* Register-domain dark panel */
body.primary-bg-color #registerDomainPanel .card-body,
body.primary-bg-color #registerDomainPanel .card-body p,
body.primary-bg-color #registerDomainPanel .card-body div,
body.primary-bg-color #registerDomainPanel .card-body label {
    color: #cbd5e1 !important;
}

/* Client information and other dark sidebar bodies */
body.primary-bg-color .sidebar .card:not(.card-sidebar) .card-body,
body.primary-bg-color .sidebar .card:not(.card-sidebar) .card-body p,
body.primary-bg-color .sidebar .card:not(.card-sidebar) .card-body div,
body.primary-bg-color .sidebar .card:not(.card-sidebar) .card-body address {
    color: #cbd5e1 !important;
}

/* Client-area panels that use a dark card body */
body.primary-bg-color .client-home-cards .card-body.bg-dark,
body.primary-bg-color .client-home-cards .card-body.bg-dark p,
body.primary-bg-color .client-home-cards .card-body.bg-dark div {
    color: #cbd5e1 !important;
}

/* Keep white content rows dark */
body.primary-bg-color .client-home-cards .list-group-item,
body.primary-bg-color .client-home-cards .list-group-item *,
body.primary-bg-color .client-home-cards table td,
body.primary-bg-color .client-home-cards table td * {
    color: #374151 !important;
}

/* Preserve button text */
body.primary-bg-color #overdueInvoicesPanel .btn,
body.primary-bg-color #registerDomainPanel .btn,
body.primary-bg-color .card-header .btn {
    color: #ffffff !important;
}

body.primary-bg-color .cart-sidebar .list-group-item
 {
    color: #e5e7eb !important;
}