/* ============================================================
   CyberVision Media — cvmpanel UI layer v1.0.0
   Loads after cvm-theme.css. Dark shell that matches cybervisionmedia.com;
   HostBill's own screens sit inside a light panel so none of them need restyling.
   Every rule is scoped to body.cvm-ui so it outranks the older !important theme.
   ============================================================ */
:root {
  --x-cyan: #00f0ff;
  --x-cyan2: #00c8e0;
  --x-ink: #0094b8;
  --x-dark: #05080f;
  --x-dark2: #080d18;
  --x-dark3: #0b1220;
  --x-mid: #162035;
  --x-txt: #ccdcf0;
  --x-muted: #8aaac8;
  --x-line: rgba(0, 240, 255, .12);
  --x-panel: #ffffff;
  --x-panel-txt: #14213a;
  --x-panel-muted: #5b6b84;
  --x-radius: 18px;
  --x-head: 'Syne', 'Montserrat', sans-serif;
  --x-body: 'DM Sans', system-ui, sans-serif;
}

/* ── Base ─────────────────────────────────────────────────── */
html:has(body.cvm-ui) { background: var(--x-dark) !important; }
html body.cvm-ui {
  background: var(--x-dark) !important;
  color: var(--x-txt) !important;
  font-family: var(--x-body) !important;
}
body.cvm-ui::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(60% 40% at 80% -5%, rgba(0, 240, 255, .10), transparent 70%),
    radial-gradient(50% 35% at 0% 10%, rgba(224, 64, 251, .07), transparent 70%),
    linear-gradient(rgba(0, 240, 255, .025) 1px, transparent 1px) 0 0 / 56px 56px,
    linear-gradient(90deg, rgba(0, 240, 255, .025) 1px, transparent 1px) 0 0 / 56px 56px;
}
body.cvm-ui .sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
body.cvm-ui .cvm-btn,
body.cvm-ui a.cvm-btn,
body.cvm-ui button.cvm-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)) !important;
  color: #04121a !important; border: 0 !important; border-radius: 999px !important;
  font: 700 13px/1 var(--x-body) !important; letter-spacing: .08em !important; text-transform: uppercase !important;
  padding: 15px 26px !important; cursor: pointer !important; text-shadow: none !important;
  box-shadow: 0 8px 28px rgba(0, 240, 255, .25) !important;
  transition: transform .2s, box-shadow .2s !important;
}
body.cvm-ui .cvm-btn:hover { transform: translateY(-1px) !important; box-shadow: 0 12px 36px rgba(0, 240, 255, .38) !important; color: #04121a !important; }

/* ── Header ───────────────────────────────────────────────── */
body.cvm-ui header.cvh {
  position: sticky !important; top: 0 !important; z-index: 1060 !important;
  background: rgba(5, 8, 15, .82) !important;
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--x-line) !important;
  box-shadow: none !important; padding: 0 !important;
}
body.cvm-ui.cvm-scrolled header.cvh { background: rgba(5, 8, 15, .95) !important; box-shadow: 0 10px 40px rgba(0, 0, 0, .45) !important; }
body.cvm-ui .cvh-in {
  max-width: 1280px; margin: 0 auto; padding: 0 24px; height: 84px;
  display: flex; align-items: center; gap: 28px;
}
body.cvm-ui header.cvh .cvh-logo { flex-shrink: 0 !important; display: flex !important; }
body.cvm-ui header.cvh .cvh-logo img {
  height: 54px !important; width: auto !important; display: block !important;
  filter: drop-shadow(0 0 8px rgba(0, 240, 255, .15));
}
body.cvm-ui .cvh-site { display: flex; gap: 4px; margin-left: auto; }
body.cvm-ui .cvh-site a {
  color: #fff !important; font: 500 12.5px/1 var(--x-body) !important;
  letter-spacing: .1em !important; text-transform: uppercase !important;
  padding: 10px 14px !important; border-radius: 8px !important;
}
body.cvm-ui .cvh-site a:hover, body.cvm-ui .cvh-site a.on { color: var(--x-cyan) !important; }
body.cvm-ui .cvh-actions { display: flex !important; align-items: center !important; gap: 10px !important; margin: 0 !important; }
body.cvm-ui .cvh-actions .lang-box, body.cvm-ui .cvh-actions .account-box { float: none !important; margin: 0 !important; display: block !important; }
body.cvm-ui .cvh-actions .header-separator { display: none !important; }
body.cvm-ui .cvh-actions .btn,
body.cvm-ui .cvh-actions .btn.dropdown-toggle {
  background: transparent !important; background-image: none !important;
  color: #fff !important; text-shadow: none !important; box-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, .18) !important; border-radius: 999px !important;
  font: 600 13px/1 var(--x-body) !important; padding: 11px 16px !important; height: auto !important;
  display: inline-flex !important; align-items: center !important; gap: 7px !important;
}
body.cvm-ui .cvh-actions .btn:hover { border-color: var(--x-cyan) !important; color: var(--x-cyan) !important; }
body.cvm-ui .cvh-actions .cart-popover,
body.cvm-ui .cvh-actions .lang-box.pull-right .btn {
  border-color: var(--x-cyan) !important; color: var(--x-cyan) !important;
}
body.cvm-ui .cvh-actions .caret { border-top-color: currentColor !important; margin: 0 !important; }
body.cvm-ui .cvh-actions .dropdown-menu {
  right: 0 !important; left: auto !important; min-width: 210px !important; margin-top: 10px !important;
  background: var(--x-dark2) !important; border: 1px solid var(--x-line) !important;
  border-radius: 12px !important; box-shadow: 0 20px 50px rgba(0, 0, 0, .5) !important; padding: 6px !important;
}
body.cvm-ui .cvh-actions .dropdown-menu li a {
  color: var(--x-txt) !important; background: none !important; border-radius: 8px !important;
  padding: 10px 14px !important; font: 500 14px/1.2 var(--x-body) !important; display: block !important;
}
body.cvm-ui .cvh-actions .dropdown-menu li a:hover { background: rgba(0, 240, 255, .08) !important; color: var(--x-cyan) !important; }
body.cvm-ui .cvh-actions .dropdown-menu .divider { background: var(--x-line) !important; border: 0 !important; }

body.cvm-ui .cvh-burger {
  display: none !important; width: 44px; height: 44px; border-radius: 12px !important;
  background: transparent !important; border: 1px solid rgba(255, 255, 255, .18) !important;
  flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 0 !important; cursor: pointer;
}
body.cvm-ui .cvh-burger { position: relative !important; }
body.cvm-ui .cvh-burger span {
  position: absolute; left: 50%; top: 50%; width: 18px; height: 2px; margin: -1px 0 0 -9px; background: #fff; border-radius: 2px;
  transition: transform .25s, opacity .25s;
}
body.cvm-ui .cvh-burger span:nth-child(1) { transform: translateY(-6px); }
body.cvm-ui .cvh-burger span:nth-child(3) { transform: translateY(6px); }
body.cvm-ui.cvm-menu-open .cvh-burger span:nth-child(1) { transform: rotate(45deg); }
body.cvm-ui.cvm-menu-open .cvh-burger span:nth-child(2) { opacity: 0; }
body.cvm-ui.cvm-menu-open .cvh-burger span:nth-child(3) { transform: rotate(-45deg); }

/* ── Portal bar ───────────────────────────────────────────── */
body.cvm-ui .wrapper-menu.cvh-portal {
  background: rgba(8, 13, 24, .9) !important; border-bottom: 1px solid var(--x-line) !important; box-shadow: none !important;
}
body.cvm-ui .cvh-portal-in {
  max-width: 1280px !important; margin: 0 auto !important; padding: 0 24px !important;
  display: flex !important; align-items: center !important; gap: 18px !important;
}
body.cvm-ui .cvh-portal-label {
  font: 700 11px/1 var(--x-body); letter-spacing: .18em; text-transform: uppercase; color: var(--x-muted);
  padding-right: 18px; border-right: 1px solid var(--x-line); white-space: nowrap;
}
body.cvm-ui .cvh-portal-mobile-site { display: none; }
body.cvm-ui .wrapper-menu .menu-bg nav > ul > li > a,
body.cvm-ui .wrapper-menu .menu-bg nav > ul > li > a.dropdown-toggle {
  color: var(--x-txt) !important; font: 600 12px/1 var(--x-body) !important; letter-spacing: .1em !important;
  padding: 17px 14px !important; border-bottom: 2px solid transparent !important; background: none !important;
}
body.cvm-ui .wrapper-menu .menu-bg nav > ul > li > a:hover,
body.cvm-ui .wrapper-menu .menu-bg nav > ul > li.active > a,
body.cvm-ui .wrapper-menu .menu-bg nav > ul > li.open > a,
body.cvm-ui .wrapper-menu .menu-bg nav > ul > li > a.active {
  color: #fff !important; background: none !important; border-bottom-color: var(--x-cyan) !important;
}
body.cvm-ui .wrapper-menu .menu-bg nav > ul > li > a [class^="icon-"] { display: none !important; }
body.cvm-ui .wrapper-menu .dropdown-menu { border-radius: 0 0 14px 14px !important; }

/* ── Portal dropdowns (Order / Client Area / Account / Support) ──
   The old theme pinned them at top:76px, leaving a 28px dead zone that closed the menu mid-move.
   Now: attached to the tab, an invisible bridge over the spacing, and cvm-ui.js delays closing. */
@media (min-width: 961px) {
  body.cvm-ui .wrapper-menu .drop-submenu { position: relative !important; }
  body.cvm-ui .wrapper-menu .drop-submenu > .dropdown-menu.submenu {
    top: 100% !important; left: -12px !important; margin: 10px 0 0 !important;
    width: auto !important; min-width: 260px !important; max-width: min(640px, calc(100vw - 48px)) !important;
    padding: 0 !important; border: 1px solid rgba(0, 240, 255, .16) !important; border-top: 0 !important;
    border-radius: 16px !important; background: rgba(8, 13, 24, .97) !important;
    -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
    box-shadow: 0 30px 70px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(0, 240, 255, .35) !important;
    overflow: visible !important;
  }
  /* the panel shrink-wraps, so give it room for as many columns as it has */
  body.cvm-ui .wrapper-menu .drop-submenu > .dropdown-menu.submenu:has(.nav-stacked + .nav-stacked) { min-width: 430px !important; }
  body.cvm-ui .wrapper-menu .drop-submenu > .dropdown-menu.submenu:has(.nav-stacked + .nav-stacked + .nav-stacked) { min-width: 610px !important; }
  /* hover bridge: part of the menu, so crossing the spacing never counts as leaving the tab */
  body.cvm-ui .wrapper-menu .drop-submenu > .dropdown-menu.submenu::before {
    content: '' !important; position: absolute !important; left: 0; right: 0; top: -14px; height: 14px;
    background: transparent !important; border: 0 !important; display: block !important;
  }
  body.cvm-ui .wrapper-menu .drop-submenu > .dropdown-menu.submenu::after { display: none !important; }
  /* heading row on top, link columns side by side, CTA row at the bottom */
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .wrapper {
    display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important;
    gap: 4px 18px !important; padding: 18px !important; background: none !important; width: auto !important; margin: 0 !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .wrapper > h3 {
    flex: 0 0 100% !important; margin: 0 0 6px !important; padding: 0 12px 10px !important; background: none !important; float: none !important;
    border: 0 !important; border-bottom: 1px solid rgba(0, 240, 255, .1) !important;
    color: var(--x-cyan) !important; font: 700 10.5px/1.2 var(--x-body) !important; letter-spacing: .18em !important; text-transform: uppercase !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .wrapper > p { flex: 0 0 100% !important; color: var(--x-muted) !important; padding: 0 12px !important; margin: 0 !important; }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked {
    flex: 1 1 170px !important; display: flex !important; flex-direction: column !important; gap: 2px !important; margin: 0 !important; padding: 0 !important;
    width: auto !important; min-width: 170px !important; float: none !important; border: 0 !important; background: none !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .cart-pos {
    flex: 0 0 100% !important; position: static !important; float: none !important; width: auto !important; height: auto !important;
    margin: 8px 0 0 !important; padding: 14px 12px 0 !important; border-top: 1px solid rgba(0, 240, 255, .1) !important; background: none !important;
    text-align: left !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .cart-pos a.btn {
    position: static !important; float: none !important; display: inline-flex !important; align-items: center !important; gap: 8px !important;
    width: auto !important; height: auto !important; margin: 0 !important;
    background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)) !important; color: #04121a !important; border: 0 !important;
    border-radius: 999px !important; padding: 10px 18px !important; box-shadow: none !important; text-shadow: none !important;
    font: 700 12px/1 var(--x-body) !important; letter-spacing: .08em !important; text-transform: uppercase !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .cart-pos a.btn i { filter: brightness(0); margin: 0 !important; }
  /* service counts (Client Area menu) as small badges; the empty decorative spans stay hidden */
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a > span.pull-right {
    display: inline-block !important; float: none !important; order: 2; margin-left: 12px !important; padding: 3px 8px !important;
    border-radius: 999px !important; background: rgba(0, 240, 255, .12) !important; color: var(--x-cyan) !important; font: 700 11px/1 var(--x-body) !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a:has(> span.pull-right)::after { display: none !important; }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li { float: none !important; width: auto !important; margin: 0 !important; border: 0 !important; background: none !important; }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li.nav-header {
    padding: 4px 12px 8px !important; margin: 0 0 2px !important; border-bottom: 1px solid rgba(0, 240, 255, .1) !important;
    color: var(--x-cyan) !important; font: 700 10.5px/1.2 var(--x-body) !important; letter-spacing: .18em !important; text-transform: uppercase !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li.empty-row { display: none !important; }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a {
    position: relative !important; display: flex !important; align-items: center !important; justify-content: space-between !important;
    padding: 10px 12px !important; margin: 0 !important; border-radius: 10px !important; border: 0 !important;
    background: none !important; color: var(--x-txt) !important; white-space: nowrap !important;
    font: 500 14px/1.2 var(--x-body) !important; letter-spacing: 0 !important; text-transform: none !important;
    transition: background .15s, color .15s, padding .15s !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a > span:not(.pull-right) { display: none !important; }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a::after {
    content: '\2192'; color: var(--x-cyan); opacity: 0; transform: translateX(-6px); transition: opacity .15s, transform .15s; margin-left: 12px;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a:hover,
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a:focus-visible {
    background: rgba(0, 240, 255, .08) !important; color: #fff !important; outline: 0 !important;
  }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a:hover::after,
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .nav-stacked > li > a:focus-visible::after { opacity: 1; transform: none; }
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu [class*="-bg"],
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu img { display: none !important; }
  /* "Proceed to cart" style CTA inside the Order menu */
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .wrapper > a.btn,
  body.cvm-ui .wrapper-menu .dropdown-menu.submenu .wrapper > div > a.btn {
    grid-column: 1 / -1 !important; justify-self: start !important; margin: 8px 12px 0 !important;
    background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)) !important; color: #04121a !important; border: 0 !important;
    border-radius: 999px !important; padding: 10px 18px !important; font: 700 12px/1 var(--x-body) !important; letter-spacing: .08em !important; text-transform: uppercase !important;
  }
}

/* ── Title band ───────────────────────────────────────────── */
body.cvm-ui .cvh-band { padding: 46px 0 70px; }
body.cvm-ui .cvh-band-in { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
body.cvm-ui .cvh-band h1.cvh-title {
  font: 800 clamp(30px, 4.4vw, 50px)/1.05 var(--x-head) !important; letter-spacing: -.02em !important;
  color: #fff !important; margin: 0 0 12px !important; text-shadow: none !important;
}
body.cvm-ui .cvh-band .breadcrumbs-box { background: none !important; border: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; }
body.cvm-ui .cvh-band .breadcrumb { padding: 0 !important; font-size: 13px !important; }
body.cvm-ui .cvh-band .breadcrumb li,
body.cvm-ui .cvh-band .breadcrumb li a { color: var(--x-muted) !important; text-shadow: none !important; }
body.cvm-ui .cvh-band .breadcrumb li.active { color: var(--x-cyan) !important; }
body.cvm-ui .cvh-band .breadcrumb > li:first-child { display: none !important; } /* "You are here" */
body.cvm-ui .cvh-band .breadcrumb .divider { background: none !important; }
body.cvm-ui .cvh-band .breadcrumb .divider::before { content: '/'; color: rgba(138, 170, 200, .5); padding: 0 6px; }
body.cvm-ui .cvh-band .breadcrumb > li:last-child .divider { display: none !important; }
body.cvm-ui .cvh-band .breadcrumb li { font-weight: 600 !important; letter-spacing: .08em !important; text-transform: uppercase !important; font-size: 12px !important; }

/* ── Main panel: HostBill screens on a light card ─────────── */
body.cvm-ui .row.center-area.main-container {
  max-width: 1232px !important; width: calc(100% - 48px) !important;
  margin: -40px auto 72px !important; padding: 36px !important;
  background: var(--x-panel) !important; color: var(--x-panel-txt) !important;
  border-radius: var(--x-radius) !important; min-height: 0 !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .45), 0 0 0 1px rgba(0, 240, 255, .08) !important;
  position: relative; float: none !important;
}
body.cvm-ui .main-container h1, body.cvm-ui .main-container h2,
body.cvm-ui .main-container h3, body.cvm-ui .main-container h4 { color: var(--x-panel-txt) !important; }
body.cvm-ui .main-container p { color: var(--x-panel-muted) !important; }
body.cvm-ui .main-container a:not(.btn):not(.cvm-btn):not([class*="button"]) { color: var(--x-ink) !important; }
body.cvm-ui .main-container a.products-box-button {
  background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)) !important; color: #04121a !important;
  border: 0 !important; border-radius: 999px !important; font-weight: 700 !important; text-shadow: none !important;
}
body.cvm-ui .main-container .btn-primary,
body.cvm-ui .main-container .btn.btn-info,
body.cvm-ui .main-container button[type=submit].btn,
body.cvm-ui .main-container input[type=submit].btn,
body.cvm-ui .main-container .c-green-btn {
  background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)) !important; background-image: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)) !important;
  color: #04121a !important; border: 0 !important; border-radius: 999px !important; text-shadow: none !important;
  font-weight: 700 !important; padding: 11px 22px !important; box-shadow: 0 6px 18px rgba(0, 200, 224, .25) !important;
}
body.cvm-ui .main-container input[type=text], body.cvm-ui .main-container input[type=email],
body.cvm-ui .main-container input[type=password], body.cvm-ui .main-container input[type=tel],
body.cvm-ui .main-container select, body.cvm-ui .main-container textarea {
  border-radius: 10px !important; border: 1px solid #d5deea !important; box-shadow: none !important;
}
body.cvm-ui .main-container input:focus, body.cvm-ui .main-container select:focus, body.cvm-ui .main-container textarea:focus {
  border-color: var(--x-cyan2) !important; box-shadow: 0 0 0 3px rgba(0, 200, 224, .18) !important; outline: 0 !important;
}

/* ── Portal home (root): no panel, dark hero ──────────────── */
body.cvm-ui.cvm-cmd-root .row.center-area.main-container {
  background: none !important; box-shadow: none !important; margin: 0 auto 40px !important; padding: 0 !important; color: var(--x-txt) !important;
}
body.cvm-ui .cvr-hero { position: relative; text-align: center; padding: 88px 0 56px; isolation: isolate; }
body.cvm-ui .main-container .cvr-glow { max-width: 100%; }
body.cvm-ui .cvr-glow {
  position: absolute; left: 50%; top: 40px; width: 620px; height: 320px; transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(0, 240, 255, .16), transparent); filter: blur(10px); z-index: -1;
}
body.cvm-ui .main-container h1.cvr-title {
  font: 800 clamp(34px, 5vw, 62px)/1.04 var(--x-head) !important; letter-spacing: -.03em !important;
  color: #fff !important; margin: 0 0 18px !important;
}
body.cvm-ui h1.cvr-title span {
  background: linear-gradient(90deg, var(--x-cyan), #e040fb); -webkit-background-clip: text; background-clip: text; color: transparent;
}
body.cvm-ui .main-container p.cvr-lead { color: var(--x-muted) !important; font-size: 18px !important; max-width: 560px; margin: 0 auto 34px !important; }
body.cvm-ui .cvr-search {
  display: flex; align-items: center; gap: 10px; max-width: 640px; margin: 0 auto 14px; padding: 8px 8px 8px 22px;
  background: rgba(11, 18, 32, .85); border: 1px solid rgba(0, 240, 255, .25); border-radius: 999px;
  box-shadow: 0 0 0 6px rgba(0, 240, 255, .05), 0 20px 50px rgba(0, 0, 0, .4);
}
body.cvm-ui .cvr-search svg { color: var(--x-cyan); flex-shrink: 0; }
body.cvm-ui .main-container .cvr-search input[type=text] {
  flex: 1; min-width: 0; height: 48px !important; background: none !important; border: 0 !important; box-shadow: none !important;
  color: #fff !important; font: 500 18px/1 var(--x-body) !important; padding: 0 6px !important; margin: 0 !important;
}
body.cvm-ui .cvr-search input::placeholder { color: rgba(138, 170, 200, .6); }
body.cvm-ui .main-container p.cvr-tlds { color: var(--x-muted) !important; font-size: 14px !important; }
body.cvm-ui p.cvr-tlds b { color: #fff; }
body.cvm-ui .cvr-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 30px 0 22px; }
body.cvm-ui .main-container a.cvr-card {
  position: relative; display: block; padding: 28px; border-radius: var(--x-radius);
  background: linear-gradient(180deg, rgba(22, 32, 53, .7), rgba(11, 18, 32, .7)) !important;
  border: 1px solid rgba(0, 240, 255, .12); color: var(--x-txt) !important; overflow: hidden; text-align: left !important;
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
body.cvm-ui a.cvr-card::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(400px circle at var(--mx, 50%) var(--my, 0%), rgba(0, 240, 255, .10), transparent 45%);
}
body.cvm-ui a.cvr-card:hover { transform: translateY(-4px); border-color: rgba(0, 240, 255, .4); box-shadow: 0 24px 50px rgba(0, 0, 0, .4); }
body.cvm-ui .cvr-ico {
  display: inline-flex; width: 46px; height: 46px; border-radius: 12px; align-items: center; justify-content: center;
  color: var(--x-cyan); background: rgba(0, 240, 255, .08); border: 1px solid rgba(0, 240, 255, .2); margin-bottom: 18px;
}
body.cvm-ui .main-container .cvr-card h3 { text-align: left !important; color: #fff !important; font: 700 20px/1.2 var(--x-head) !important; margin: 0 0 8px !important; }
body.cvm-ui .main-container .cvr-card p { color: var(--x-muted) !important; font-size: 15px !important; margin: 0 0 18px !important; }
body.cvm-ui .cvr-go { color: var(--x-cyan); font: 700 12px/1 var(--x-body); letter-spacing: .12em; text-transform: uppercase; }
body.cvm-ui .cvr-trust {
  display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--x-line); border-radius: var(--x-radius);
  background: rgba(8, 13, 24, .6);
}
body.cvm-ui .cvr-trust div { padding: 20px 22px; border-right: 1px solid var(--x-line); }
body.cvm-ui .cvr-trust div:last-child { border-right: 0; }
body.cvm-ui .cvr-trust b { display: block; color: #fff; font: 700 16px/1.2 var(--x-head); }
body.cvm-ui .cvr-trust span { color: var(--x-muted); font-size: 13.5px; }
body.cvm-ui .main-container h3.cvr-h { color: #fff !important; margin-top: 40px !important; }
body.cvm-ui.cvm-cmd-root .news-container { background: rgba(11, 18, 32, .7) !important; border: 1px solid var(--x-line) !important; border-radius: 14px !important; }
body.cvm-ui.cvm-cmd-root .news-body p { color: var(--x-muted) !important; }

/* ── Plans (cart category) ────────────────────────────────── */
body.cvm-ui .orderpage.cvm-has-plans > h3 { display: none !important; }
body.cvm-ui .orderpage .categories { margin: 0 0 26px !important; text-align: left !important; }
body.cvm-ui .orderpage .category-list { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; font-size: 0 !important; color: transparent !important; } /* hides the "|" text between pills */
body.cvm-ui .orderpage .category-list .category { float: none !important; margin: 0 !important; padding: 0 !important; }
body.cvm-ui .orderpage .category-list .category strong,
body.cvm-ui .orderpage .category-list .category a {
  display: inline-block !important; padding: 9px 16px !important; border-radius: 999px !important;
  border: 1px solid #d5deea !important; font: 600 13px/1 var(--x-body) !important; color: var(--x-panel-txt) !important;
}
body.cvm-ui .orderpage .category-list .category strong { background: var(--x-panel-txt) !important; color: #fff !important; border-color: var(--x-panel-txt) !important; }
body.cvm-ui .cvm-plans { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; align-items: stretch; }
body.cvm-ui form.cvm-plan-form { margin: 0 !important; display: flex; }
body.cvm-ui .cvm-plan {
  position: relative; display: flex; flex-direction: column; width: 100%;
  padding: 26px 22px 22px; border-radius: 16px; background: #fff;
  border: 1px solid #e1e8f2; box-shadow: 0 2px 0 rgba(20, 33, 58, .03);
  transition: transform .25s, box-shadow .25s, border-color .25s;
}
body.cvm-ui .cvm-plan:hover { transform: translateY(-4px); border-color: rgba(0, 200, 224, .5); box-shadow: 0 20px 44px rgba(20, 33, 58, .12); }
body.cvm-ui .cvm-plan[data-popular] {
  background: linear-gradient(180deg, #0b1220, #05080f); border-color: rgba(0, 240, 255, .45);
  box-shadow: 0 20px 50px rgba(0, 150, 190, .25);
}
body.cvm-ui .cvm-plan-flag {
  position: absolute; top: -12px; left: 22px; padding: 6px 12px; border-radius: 999px;
  background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)); color: #04121a;
  font: 700 11px/1 var(--x-body); letter-spacing: .1em; text-transform: uppercase;
}
body.cvm-ui .main-container h3.cvm-plan-name { font: 800 22px/1.1 var(--x-head) !important; margin: 0 0 4px !important; letter-spacing: -.01em; }
body.cvm-ui .main-container p.cvm-plan-tag { font-size: 14px !important; margin: 0 0 18px !important; min-height: 20px; }
body.cvm-ui .cvm-plan-price b { font: 800 38px/1 var(--x-head); color: var(--x-panel-txt); letter-spacing: -.03em; }
body.cvm-ui .cvm-plan-price span { font-size: 15px; color: var(--x-panel-muted); margin-left: 2px; }
body.cvm-ui .cvm-plan-price em { display: block; font-style: normal; font-size: 12.5px; color: var(--x-panel-muted); margin-top: 8px; min-height: 18px; }
body.cvm-ui .cvm-plan-cycles { display: flex; gap: 4px; padding: 4px; margin: 16px 0 18px; border-radius: 999px; background: #eef3f9; }
body.cvm-ui .cvm-plan-cycles button {
  flex: 1; border: 0 !important; background: none !important; border-radius: 999px !important; padding: 8px 4px !important;
  font: 600 12px/1 var(--x-body) !important; color: var(--x-panel-muted) !important; cursor: pointer; box-shadow: none !important; text-shadow: none !important;
}
body.cvm-ui .cvm-plan-cycles button.on { background: #fff !important; color: var(--x-panel-txt) !important; box-shadow: 0 2px 8px rgba(20, 33, 58, .12) !important; }
body.cvm-ui .cvm-plan-feats { order: 0 !important; width: auto !important; flex: 1; display: block !important; padding: 0 !important; margin-bottom: 20px; font-size: 14px; color: var(--x-panel-muted); }
body.cvm-ui .cvm-plan-feats ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
body.cvm-ui .cvm-plan-feats li {
  position: relative; padding: 6px 0 6px 26px !important; border-bottom: 1px dashed #e6ecf4; list-style: none !important; background: none !important;
}
body.cvm-ui .cvm-plan-feats li:last-child { border-bottom: 0; }
body.cvm-ui .cvm-plan-feats li::before {
  content: ''; position: absolute; left: 2px; top: 11px; width: 12px; height: 7px;
  border-left: 2px solid var(--x-cyan2); border-bottom: 2px solid var(--x-cyan2); transform: rotate(-45deg);
}
body.cvm-ui .main-container button.cvm-plan-go { width: 100%; }
body.cvm-ui .cvm-plan[data-popular] h3.cvm-plan-name,
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-price b { color: #fff !important; }
body.cvm-ui .cvm-plan[data-popular] p.cvm-plan-tag,
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-price span,
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-price em,
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-feats,
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-feats p { color: var(--x-muted) !important; }
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-feats li { border-bottom-color: rgba(0, 240, 255, .1); color: var(--x-txt); }
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-cycles { background: rgba(255, 255, 255, .06); }
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-cycles button { color: var(--x-muted) !important; }
body.cvm-ui .cvm-plan[data-popular] .cvm-plan-cycles button.on { background: rgba(0, 240, 255, .14) !important; color: #fff !important; }

/* ── Checkout steps ───────────────────────────────────────── */
body.cvm-ui #cart #progress {
  display: flex !important; gap: 6px !important; margin: 0 0 30px !important; padding: 0 !important;
  list-style: none !important; counter-reset: cvstep; background: none !important; height: auto !important; width: auto !important;
}
body.cvm-ui #cart #progress li {
  flex: 1 !important; float: none !important; width: auto !important; height: auto !important; counter-increment: cvstep;
  position: relative !important; padding: 16px 0 0 !important; margin: 0 !important; background: none !important;
  border: 0 !important; border-top: 3px solid #e1e8f2 !important;
  font: 600 12.5px/1.3 var(--x-body) !important; color: var(--x-panel-muted) !important; text-align: left !important;
}
body.cvm-ui #cart #progress li::before { content: counter(cvstep, decimal-leading-zero) '  '; color: #aab7c9; font-weight: 700; }
body.cvm-ui #cart #progress li.cvm-done { color: var(--x-panel-muted) !important; border-top-color: rgba(0, 200, 224, .45) !important; }
body.cvm-ui #cart #progress li.cvm-now { color: var(--x-panel-txt) !important; border-top-color: var(--x-cyan2) !important; }
body.cvm-ui #cart #progress li.cvm-now::before { color: var(--x-cyan2); }
body.cvm-ui #cart #progress li a { color: inherit !important; }
body.cvm-ui #cart .default-cart > form > p.cvm-choice {
  position: relative; margin: 0 0 10px !important; padding: 16px 18px 16px 50px !important; cursor: pointer;
  border: 1px solid #e1e8f2; border-radius: 14px; transition: border-color .2s, background .2s;
}
body.cvm-ui #cart p.cvm-choice input[type=radio] { position: absolute; left: 18px; top: 50%; margin: -8px 0 0 !important; width: 17px; height: 17px; accent-color: var(--x-cyan2); }
body.cvm-ui #cart p.cvm-choice label { margin: 0 !important; cursor: pointer; font: 600 15px/1.35 var(--x-body) !important; color: var(--x-panel-txt) !important; text-transform: none !important; }
body.cvm-ui #cart p.cvm-choice.on { border-color: var(--x-cyan2); background: rgba(0, 200, 224, .05); }
body.cvm-ui #cart #sld_register, body.cvm-ui #cart #sld_transfer {
  width: 100% !important; height: 54px !important; min-height: 0 !important; resize: none !important; overflow: hidden !important;
  font: 500 18px/30px var(--x-body) !important; padding: 11px 16px !important;
}
body.cvm-ui #cart .domain-inputbox { display: block !important; width: auto !important; }
body.cvm-ui #cart .domain-inputbox > * { float: none !important; clear: both !important; width: 100% !important; margin-left: 0 !important; }
body.cvm-ui #cart .domain-inputbox > .domain-tld-multiselect { display: none !important; }
body.cvm-ui #cart .domain-input-bulk { float: none !important; width: 100% !important; height: auto !important; margin: 0 0 14px !important; background: none !important; }
body.cvm-ui #cart p.cvm-choice label, body.cvm-ui #cart label.cvm-chip { letter-spacing: 0 !important; text-transform: none !important; }
body.cvm-ui #cart .domain-tld-checkbox table, body.cvm-ui #cart .domain-tld-checkbox tbody,
body.cvm-ui #cart .domain-tld-checkbox tr { display: contents !important; }
body.cvm-ui #cart .domain-tld-checkbox { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; width: auto !important; max-width: 100% !important; margin: 0 !important; float: none !important; }
body.cvm-ui #cart .domain-tld-checkbox td { display: block !important; width: auto !important; padding: 0 !important; border: 0 !important; }
body.cvm-ui #cart label.cvm-chip {
  display: inline-flex !important; align-items: center; gap: 6px; margin: 0 !important; cursor: pointer;
  padding: 9px 14px; border-radius: 999px; border: 1px solid #d5deea; font: 600 14px/1 var(--x-body); color: var(--x-panel-txt);
}
body.cvm-ui #cart label.cvm-chip input { margin: 0 !important; accent-color: var(--x-cyan2); }
body.cvm-ui #cart label.cvm-chip:has(input:checked) { border-color: var(--x-cyan2); background: rgba(0, 200, 224, .08); }
body.cvm-ui #cart .default-cart { max-width: none !important; }
body.cvm-ui #cont { width: auto !important; }
body.cvm-ui small.cvm-cad { font-size: .45em; letter-spacing: .08em; color: var(--x-panel-muted); }

/* cart sidebar summary */
body.cvm-ui #cart #updater table { width: 100% !important; margin: 18px 0 !important; border-collapse: collapse !important; }
body.cvm-ui #cart #updater th, body.cvm-ui #cart #updater td { padding: 10px 8px !important; text-align: left !important; border-bottom: 1px solid #e6ecf4 !important; vertical-align: middle !important; }
body.cvm-ui #cart #updater td strong, body.cvm-ui #cart #updater td b { white-space: nowrap; word-break: normal !important; }
body.cvm-ui.cvm-cmd-cart aside#submenu { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
/* only the box itself: the wrapper is ~11px tall and holds an absolutely positioned floater, so never clip it */
body.cvm-ui.cvm-cmd-cart aside#submenu .wbox {
  border-radius: 16px !important; border: 1px solid #e1e8f2 !important; box-shadow: 0 10px 30px rgba(20, 33, 58, .08) !important; overflow: hidden;
}

/* ── Domain search page (orderpages/domains) ──────────────── */
body.cvm-ui .domain-single h1.title06 { font: 800 26px/1.2 var(--x-head) !important; letter-spacing: -.01em !important; }
body.cvm-ui .domain-in .name-select { display: flex !important; align-items: stretch !important; gap: 8px !important; flex-wrap: wrap; }
body.cvm-ui .domain-in .name-select > div { float: none !important; margin: 0 !important; }
body.cvm-ui .domain-in .domain-in-01 {
  background: #eef3f9 !important; color: var(--x-panel-muted) !important; border-radius: 10px !important;
  font: 600 15px/44px var(--x-body) !important; padding: 0 14px !important; height: 44px !important;
}
body.cvm-ui .domain-in .domain-in-02 { flex: 1 1 220px !important; }
body.cvm-ui .domain-in .domain-in-02 input { width: 100% !important; height: 44px !important; }
body.cvm-ui .domain-in .domain-in-03, body.cvm-ui .domain-in .domain-in-03 select { background: none !important; height: 44px !important; }
body.cvm-ui .domain-single [class^="button0"], body.cvm-ui .domain-single [class*=" button0"] {
  background: none !important; padding: 0 !important; height: auto !important; width: auto !important; border: 0 !important; box-shadow: none !important; outline: 0 !important;
}
body.cvm-ui .domain-in .domain-in-03 select { background: #fff !important; border: 1px solid #d5deea !important; border-radius: 10px !important; color: var(--x-panel-txt) !important; }
body.cvm-ui .domain-single [class^="button0"] input[type=submit],
body.cvm-ui .domain-single [class*=" button0"] input[type=submit] {
  background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)) !important; color: #04121a !important; border: 0 !important;
  border-radius: 999px !important; height: 44px !important; padding: 0 26px !important; width: auto !important;
  font: 700 13px/1 var(--x-body) !important; letter-spacing: .08em !important; text-transform: uppercase !important; text-shadow: none !important; cursor: pointer;
  box-shadow: 0 6px 18px rgba(0, 200, 224, .25) !important;
}
body.cvm-ui .domain-single .cost01 { color: var(--x-panel-txt) !important; font-family: var(--x-head) !important; }
body.cvm-ui .domain-single .cost01 span { color: var(--x-panel-muted) !important; }
body.cvm-ui .domain-single .list-domain li { background: none !important; padding-left: 22px !important; position: relative; }
body.cvm-ui .domain-single .list-domain li::before {
  content: ''; position: absolute; left: 3px; top: 6px; width: 10px; height: 6px;
  border-left: 2px solid var(--x-cyan2); border-bottom: 2px solid var(--x-cyan2); transform: rotate(-45deg);
}

/* ── Logged-in client area ────────────────────────────────── */
/* empty message slots are flex items too and each adds a 22px gap; HostBill's <article> is content-box + 48px padding */
body.cvm-ui .main-container.fullside > #errors:not([style*="block"]),
body.cvm-ui .main-container.fullside > #infos:not([style*="block"]) { display: none !important; }
body.cvm-ui .main-container.fullside > #errors, body.cvm-ui .main-container.fullside > #infos { flex-basis: 100% !important; }
body.cvm-ui .main-container.fullside { flex-wrap: wrap !important; }
body.cvm-ui .main-container.fullside::before, body.cvm-ui .main-container.fullside::after { display: none !important; content: none !important; } /* bootstrap .row clearfix would be two more gapped flex items */
body.cvm-ui .main-container > section > article { box-sizing: border-box !important; max-width: 100% !important; width: 100% !important; }

/* cvm-theme makes .p15 a 3-col card grid; inside tab panes (history, emails) that squeezes tables into one column */
body.cvm-ui .main-container .tab-content .p15 { display: block !important; }

/* filter tabs (All / Unpaid / Add Funds …) as pills */
body.cvm-ui .main-container .nav-tabs.table-nav {
  display: flex !important; flex-wrap: wrap !important; gap: 6px !important; border: 0 !important; margin: 0 0 16px !important; padding: 0 !important; background: none !important;
}
body.cvm-ui .main-container .nav-tabs.table-nav > li { float: none !important; margin: 0 !important; border: 0 !important; background: none !important; }
body.cvm-ui .main-container .nav-tabs.table-nav > li > a {
  display: inline-flex !important; align-items: center !important; gap: 6px !important; margin: 0 !important; height: auto !important;
  padding: 9px 16px !important; border-radius: 999px !important; border: 1px solid #d5deea !important; background: #fff !important;
  font: 600 13px/1 var(--x-body) !important; color: var(--x-panel-txt) !important; box-shadow: none !important;
}
body.cvm-ui .main-container .nav-tabs.table-nav > li.active > a { background: var(--x-panel-txt) !important; border-color: var(--x-panel-txt) !important; color: #fff !important; }
body.cvm-ui .main-container .nav-tabs.table-nav > li.custom-tab > a { border-color: rgba(0, 200, 224, .5) !important; color: var(--x-ink) !important; }
body.cvm-ui .main-container .nav-tabs.table-nav .tab-left,
body.cvm-ui .main-container .nav-tabs.table-nav .tab-right { display: none !important; }

/* ── Services / domains lists ─────────────────────────────── */
/* cvm-theme turns .invoices-box into a scroll box, which clipped the row menus and added scrollbars */
body.cvm-ui .main-container .invoices-box { overflow: visible !important; height: auto !important; max-height: none !important; }
body.cvm-ui .main-container .styled-table.fixed-table { table-layout: auto !important; }
/* headers may wrap to two lines rather than truncate or push the table under the sidebar */
body.cvm-ui .main-container .styled-table th { width: auto !important; white-space: normal !important; text-overflow: clip !important; overflow: visible !important; line-height: 1.3 !important; vertical-align: bottom !important; }
body.cvm-ui .main-container .styled-table th, body.cvm-ui .main-container .styled-table td { padding-left: 10px !important; padding-right: 10px !important; }
body.cvm-ui .main-container .styled-table td[data-label] { white-space: nowrap; }
body.cvm-ui .main-container table.styled-table:has(td[data-label]) { width: 100% !important; max-width: 100% !important; }
body.cvm-ui .main-container .styled-table th.w0, body.cvm-ui .main-container .styled-table td.w0 { width: 6px !important; padding: 0 !important; }
body.cvm-ui .main-container .styled-table td { vertical-align: middle !important; }
body.cvm-ui .main-container .styled-table .cvm-td-name { white-space: normal !important; }
body.cvm-ui .main-container .styled-table .cvm-td-name .shared-hosting-title { display: block !important; font-weight: 700 !important; }
body.cvm-ui .main-container .styled-table .cvm-td-name .shared-link { display: block !important; line-height: 1.4 !important; color: var(--x-panel-muted) !important; font-size: 13px !important; }
body.cvm-ui .main-container .styled-table .cvm-td-actions .right-row-side { display: none !important; }
/* "44 days to expire!" sits under the domain instead of overlapping the next column */
body.cvm-ui .main-container .styled-table .cvm-td-name > a { display: block !important; }
body.cvm-ui .main-container .styled-table .cvm-td-name .label-warning {
  display: inline-block !important; margin-top: 5px !important; padding: 3px 8px !important; border-radius: 999px !important;
  background: #fff4dc !important; color: #a46a00 !important; text-shadow: none !important; font: 700 11px/1.2 var(--x-body) !important; white-space: nowrap !important;
}
body.cvm-ui .main-container .styled-table .cvm-td-actions { width: 1% !important; white-space: nowrap !important; text-align: right !important; overflow: visible !important; }

/* status pills */
body.cvm-ui .cvm-pill {
  display: inline-block; padding: 4px 10px; border-radius: 999px; font: 700 11.5px/1.2 var(--x-body); letter-spacing: .02em;
  background: #eef2f7; color: #5b6b84;
}
body.cvm-ui .Active-label .cvm-pill { background: #e3f8ee; color: #128a52; }
body.cvm-ui .Pending-label .cvm-pill, body.cvm-ui .Pending_Transfer-label .cvm-pill { background: #fff4dc; color: #a46a00; }
body.cvm-ui .Expired-label .cvm-pill, body.cvm-ui .Suspended-label .cvm-pill, body.cvm-ui .Fraud-label .cvm-pill { background: #fde8eb; color: #c22a40; }
body.cvm-ui .Cancelled-label .cvm-pill, body.cvm-ui .Terminated-label .cvm-pill { background: #eef2f7; color: #6b7a90; }

/* row actions: Manage + ⋯ menu */
body.cvm-ui .main-container .cvm-actions { position: relative !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; float: none !important; }
body.cvm-ui .main-container .cvm-actions > .btn {
  float: none !important; height: auto !important; margin: 0 !important; box-shadow: none !important; text-shadow: none !important; background-image: none !important;
  border-radius: 999px !important; font: 700 12.5px/1 var(--x-body) !important; letter-spacing: .02em !important; text-transform: none !important;
}
body.cvm-ui .main-container .cvm-actions > .cvm-manage { display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 9px 16px !important; background: var(--x-panel-txt) !important; color: #fff !important; border: 0 !important; }
body.cvm-ui .main-container .cvm-actions > .cvm-manage:hover { background: #0b1220 !important; color: var(--x-cyan) !important; }
body.cvm-ui .main-container .cvm-actions > .cvm-more {
  width: 34px !important; padding: 8px 0 !important; text-align: center !important; font-size: 16px !important; line-height: 1 !important;
  background: #fff !important; color: var(--x-panel-txt) !important; border: 1px solid #d5deea !important;
}
body.cvm-ui .main-container .cvm-actions.open > .cvm-more, body.cvm-ui .main-container .cvm-actions > .cvm-more:hover { border-color: var(--x-cyan2) !important; color: var(--x-ink) !important; }
body.cvm-ui .main-container .cvm-actions > .dropdown-menu {
  top: calc(100% + 8px) !important; right: 0 !important; left: auto !important; margin: 0 !important; min-width: 220px !important; z-index: 1040 !important;
  padding: 6px !important; background: #fff !important; border: 1px solid #e1e8f2 !important; border-radius: 14px !important;
  box-shadow: 0 20px 50px rgba(20, 33, 58, .18) !important; text-align: left !important;
}
body.cvm-ui .main-container .cvm-actions > .dropdown-menu::before, body.cvm-ui .main-container .cvm-actions > .dropdown-menu::after { display: none !important; }
body.cvm-ui .main-container .cvm-actions .dropdown-padding { padding: 0 !important; background: none !important; }
body.cvm-ui .main-container .cvm-actions .dropdown-menu li { list-style: none !important; float: none !important; margin: 0 !important; }
body.cvm-ui .main-container .cvm-actions .dropdown-menu li > a {
  display: block !important; padding: 10px 12px !important; border-radius: 9px !important; background: none !important;
  color: var(--x-panel-txt) !important; font: 500 14px/1.2 var(--x-body) !important; white-space: nowrap !important;
}
body.cvm-ui .main-container .cvm-actions .dropdown-menu li > a:hover { background: #f1f5fa !important; color: var(--x-ink) !important; }
body.cvm-ui .main-container .cvm-actions .dropdown-menu li.cvm-danger > a { color: #c22a40 !important; }
body.cvm-ui .main-container .cvm-actions .dropdown-menu li.cvm-danger > a:hover { background: #fde8eb !important; }
body.cvm-ui .main-container .cvm-actions .dropdown-menu li.disabled > a { color: #8f9bb0 !important; }

/* phones: each row becomes a labelled card */
@media (max-width: 767px) {
  body.cvm-ui .main-container table.styled-table:has(td[data-label]),
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) > tbody { display: block !important; width: 100% !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr:has(> th),
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.empty-row { display: none !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row {
    display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px 16px; position: relative;
    margin: 0 0 12px !important; padding: 16px 16px 16px 20px !important; background: #fff !important;
    border: 1px solid #e1e8f2 !important; border-radius: 14px !important; box-shadow: 0 2px 0 rgba(20, 33, 58, .03) !important;
  }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > td {
    display: block !important; width: auto !important; padding: 0 !important; border: 0 !important; background: none !important;
    text-align: left !important; white-space: normal !important; overflow: visible !important; font-size: 14px !important;
  }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > td[data-label]::before {
    content: attr(data-label); display: block; margin-bottom: 3px;
    color: var(--x-panel-muted); font: 700 10.5px/1.2 var(--x-body); letter-spacing: .12em; text-transform: uppercase;
  }
  /* coloured status strip on the card's left edge; the checkbox cell is not needed on a card */
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > td:first-child {
    position: absolute !important; left: 0; top: 14px; bottom: 14px; width: 4px !important;
  }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > td:first-child input { display: none !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > td:first-child .left-row-side { height: 100% !important; border-radius: 4px; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > .cvm-td-name { grid-column: 1 / -1; font-size: 16px !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > .cvm-td-name::before { display: none !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > .cvm-td-actions { grid-column: 1 / -1; padding-top: 4px !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > .cvm-td-actions .cvm-actions { display: flex !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > .cvm-td-actions .cvm-manage { flex: 1; text-align: center !important; padding: 12px 16px !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > .cvm-td-actions .cvm-more { width: 44px !important; padding: 11px 0 !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) .td-rel .right-row-side { display: none !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row > td { box-shadow: none !important; }
  /* article + list wrapper each add ~20px a side; on a phone the card is the only box needed */
  body.cvm-ui .main-container > section > article:has(td[data-label]) { padding: 4px 0 0 !important; border: 0 !important; box-shadow: none !important; background: none !important; }
  body.cvm-ui .main-container article:has(td[data-label]) .affiliates-box { padding: 0 !important; }
  body.cvm-ui .main-container table.styled-table:has(td[data-label]) tr.styled-row { padding: 16px 16px 16px 18px !important; }
  /* the domains "with selected" bulk bar needs the checkboxes we just hid */
  body.cvm-ui .main-container .tab-pane > .tab-header:has(+ .affiliates-box table.styled-table td[data-label]) { display: none !important; }
}

/* ── /products/ landing cards ─────────────────────────────── */
body.cvm-cmd-products .cvm-prod-head { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 22px; font-family: 'Montserrat', var(--x-body); }
body.cvm-cmd-products .cvm-prod-head b { font: 700 22px/1.25 'Montserrat', sans-serif; color: var(--x-panel-txt); letter-spacing: -.01em; }
body.cvm-cmd-products .cvm-prod-head span { font: 500 14.5px/1.5 'Montserrat', sans-serif; color: var(--x-panel-muted); }
body.cvm-cmd-products .products-list.cvm-prod { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0 !important; padding: 0 !important; }
body.cvm-cmd-products a.cvm-prod-card {
  position: relative; display: flex; flex-direction: column; gap: 10px; padding: 24px 22px 20px; border-radius: 16px; background: #fff;
  border: 1px solid #e3e9f1; text-decoration: none !important; color: var(--x-panel-txt) !important; font-family: 'Montserrat', var(--x-body);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
body.cvm-cmd-products a.cvm-prod-card:hover { border-color: var(--x-cyan2); box-shadow: 0 14px 34px rgba(20, 33, 58, .1); transform: translateY(-2px); }
body.cvm-cmd-products a.cvm-prod-card.cvm-pop { border-color: #9fe3ee; box-shadow: 0 0 0 1px #9fe3ee; }
body.cvm-cmd-products .cvm-prod-card .cvm-plan-flag { top: -11px; left: 18px; font-family: 'Montserrat', sans-serif; }
body.cvm-cmd-products .cvm-prod-ico { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 12px; background: #eafafd; color: #0aa7bd; }
body.cvm-cmd-products .cvm-prod-name { font: 700 18px/1.3 'Montserrat', sans-serif; color: var(--x-panel-txt); }
body.cvm-cmd-products .cvm-prod-desc { flex: 1; font: 500 13.5px/1.6 'Montserrat', sans-serif; color: #4a5a72; }
body.cvm-cmd-products .cvm-prod-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; padding-top: 14px; border-top: 1px solid #eef2f7; }
body.cvm-cmd-products .cvm-prod-price { font: 500 13px/1.3 'Montserrat', sans-serif; color: var(--x-panel-muted); }
body.cvm-cmd-products .cvm-prod-price b { display: block; font: 700 17px/1.3 'Montserrat', sans-serif; color: var(--x-panel-txt); }
body.cvm-cmd-products .cvm-prod-go { flex-shrink: 0; padding: 10px 16px; border-radius: 999px; font: 700 12px/1 'Montserrat', sans-serif; letter-spacing: .06em; text-transform: uppercase; color: #04121a; background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)); }
@media (max-width: 991px) { body.cvm-cmd-products .products-list.cvm-prod { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { body.cvm-cmd-products .products-list.cvm-prod { grid-template-columns: 1fr; } }

/* ── Order page: "Need a new website?" card ───────────────── */
body.cvm-ui .cvm-site-cta {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px;
  margin: 26px 0 6px; padding: 22px 26px; border-radius: 16px; border: 1px solid #e1e8f2; background: #fff;
}
body.cvm-ui .cvm-site-cta > div { display: flex; flex-direction: column; gap: 4px; flex: 1 1 320px; }
body.cvm-ui .cvm-site-cta b { font: 800 19px/1.2 var(--x-head); color: var(--x-panel-txt); }
body.cvm-ui .cvm-site-cta span { font-size: 14px; line-height: 1.55; color: var(--x-panel-muted); }
@media (max-width: 767px) { body.cvm-ui .cvm-site-cta .cvm-btn { width: 100%; } }

/* ── Checkout add-ons (Care Plans + extras) ───────────────── */
body.cvm-ui #cart .cvm-addons-intro { display: none !important; }
body.cvm-ui #cart .cvm-addons { display: flex; flex-direction: column; gap: 14px; margin: 4px 0 8px; font-family: 'Montserrat', var(--x-body); }
body.cvm-ui #cart .cvm-addons-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-top: 10px; }
body.cvm-ui #cart .cvm-addons-head b { font: 700 18px/1.25 'Montserrat', sans-serif; color: var(--x-panel-txt); letter-spacing: -.01em; }
body.cvm-ui #cart .cvm-addons-head span { font: 500 13.5px/1.4 'Montserrat', sans-serif; color: var(--x-panel-muted); }
body.cvm-ui #cart .cvm-care-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: stretch; }
body.cvm-ui #cart .cvm-extra-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body.cvm-ui #cart .cvm-addons .cart-addon {
  position: relative; display: flex !important; flex-direction: column; gap: 10px; margin: 0 !important; padding: 18px !important;
  border: 1px solid #e3e9f1 !important; border-radius: 14px !important; background: #fff !important; cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
body.cvm-ui #cart .cvm-addons .cart-addon:hover { border-color: #b9e9f1 !important; box-shadow: 0 6px 18px rgba(20, 33, 58, .06); }
body.cvm-ui #cart .cvm-addons .cart-addon.on { border-color: var(--x-cyan2) !important; background: #f3fcfe !important; box-shadow: 0 0 0 1px var(--x-cyan2); }
body.cvm-ui #cart .cvm-addons .cart-addon .checkbox { display: flex !important; align-items: center; gap: 10px; margin: 0 !important; padding: 0 !important; min-height: 0 !important; }
body.cvm-ui #cart .cvm-addons .cart-addon .checkbox input { position: static !important; margin: 0 !important; width: 18px; height: 18px; accent-color: var(--x-cyan2); flex-shrink: 0; cursor: pointer; }
body.cvm-ui #cart .cvm-addons .cart-addon .checkbox label {
  margin: 0 !important; padding: 0 !important; cursor: pointer; text-transform: none !important; letter-spacing: -.005em !important;
  font: 700 16px/1.3 'Montserrat', sans-serif !important; color: var(--x-panel-txt) !important;
}
body.cvm-ui #cart .cvm-addons .cart-item-description { flex: 1; font: 500 13.5px/1.6 'Montserrat', sans-serif !important; color: #4a5a72 !important; margin: 0 !important; }
body.cvm-ui #cart .cvm-addons .cvm-ad-list { list-style: none; margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 5px; }
body.cvm-ui #cart .cvm-addons .cvm-ad-list li { position: relative; padding-left: 18px; }
body.cvm-ui #cart .cvm-addons .cvm-ad-list li::before { content: ""; position: absolute; left: 2px; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--x-cyan2); }
body.cvm-ui #cart .cvm-addons .cart-item-price { margin: 4px 0 0 !important; padding-top: 12px; border-top: 1px solid #eef2f7; font: 700 15px/1.3 'Montserrat', sans-serif !important; color: var(--x-panel-txt) !important; }
body.cvm-ui #cart .cvm-addons .cart-item-price select {
  width: 100% !important; min-height: 42px !important; padding: 0 12px !important; border-radius: 10px !important; border: 1px solid #dbe3ee !important;
  font: 600 14px/1.2 'Montserrat', sans-serif !important; color: var(--x-panel-txt) !important; background-color: #f8fafc !important;
}
body.cvm-ui #cart .cvm-addons .cvm-care-card.cvm-pop { border-color: #9fe3ee !important; }
body.cvm-ui #cart .cvm-addons .cvm-care-card .cvm-plan-flag { top: -11px; left: 16px; font-family: 'Montserrat', sans-serif; }
@media (max-width: 991px) { body.cvm-ui #cart .cvm-care-grid { grid-template-columns: 1fr; } }
@media (max-width: 767px) { body.cvm-ui #cart .cvm-extra-grid { grid-template-columns: 1fr; } }

/* ── Header cart dropdown ─────────────────────────────────── */
body.cvm-ui .popover.cvm-cartpop { width: 340px !important; max-width: calc(100vw - 24px) !important; padding: 0 !important; border-radius: 14px !important; }
body.cvm-ui .popover.cvm-cartpop .wrapper { padding: 14px !important; display: flex !important; flex-direction: column; gap: 6px; }
body.cvm-ui .popover.cvm-cartpop .wrapper > h3 { margin: 0 0 4px !important; padding: 0 4px !important; font: 700 11px/1.2 'Montserrat', sans-serif !important; letter-spacing: .14em !important; text-transform: uppercase; color: var(--x-cyan2) !important; background: none !important; border: 0 !important; }
body.cvm-ui .popover.cvm-cartpop .nav-stacked { margin: 0 !important; display: flex; flex-direction: column; gap: 2px; }
body.cvm-ui .popover.cvm-cartpop .nav-stacked > li { margin: 0 !important; border: 0 !important; background: none !important; }
body.cvm-ui .popover.cvm-cartpop a.cvm-ci {
  display: flex !important; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 10px !important; margin: 0 !important;
  border-radius: 10px !important; background: transparent !important; border: 0 !important; text-decoration: none !important;
}
body.cvm-ui .popover.cvm-cartpop a.cvm-ci:hover { background: rgba(255, 255, 255, .06) !important; }
body.cvm-ui .popover.cvm-cartpop a.cvm-ci::after { display: none !important; }
body.cvm-ui .popover.cvm-cartpop .cvm-ci-name { display: flex !important; flex-direction: column; gap: 2px; min-width: 0; font: 600 14px/1.3 'Montserrat', sans-serif; color: #fff; }
body.cvm-ui .popover.cvm-cartpop .cvm-ci-name small { font: 500 12px/1.3 'Montserrat', sans-serif; color: #8aaac8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.cvm-ui .popover.cvm-cartpop .cvm-ci-price { display: inline !important; flex-shrink: 0; font: 700 14px/1.2 'Montserrat', sans-serif; color: #fff; background: none !important; padding: 0 !important; width: auto !important; }
body.cvm-ui .popover.cvm-cartpop .cvm-ci-go { margin-top: 8px !important; width: 100%; }
body.cvm-ui .popover.cvm-cartpop .submenu-services-bg, body.cvm-ui .popover.cvm-cartpop .arrow { display: none !important; }
/* the old theme boxes spans inside menu links and uses content-box widths: undo both here */
body.cvm-ui .popover.cvm-cartpop .wrapper, body.cvm-ui .popover.cvm-cartpop .wrapper * { box-sizing: border-box !important; }
body.cvm-ui .popover.cvm-cartpop .wrapper { width: 100% !important; }
body.cvm-ui .popover.cvm-cartpop .nav-stacked { width: 100% !important; padding: 0 !important; }
body.cvm-ui .popover.cvm-cartpop .nav-stacked > li { display: block !important; width: 100% !important; float: none !important; }
body.cvm-ui .popover.cvm-cartpop a.cvm-ci { width: 100% !important; }
body.cvm-ui .popover.cvm-cartpop .cvm-ci-name, body.cvm-ui .popover.cvm-cartpop .cvm-ci-name small, body.cvm-ui .popover.cvm-cartpop .cvm-ci-price {
  background: none !important; padding: 0 !important; border: 0 !important; text-decoration: none !important; box-shadow: none !important;
}

/* ── Single service page (Manage) ─────────────────────────── */
/* the band already shows the plan name, so the article's own h2 would repeat it */
body.cvm-ui .main-container article:has(> .shared-wrapper) > h2 { display: none !important; }
body.cvm-ui .main-container article:has(> .shared-wrapper) { position: relative !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: none !important; }
body.cvm-ui .main-container > section:has(.shared-wrapper) { border: 0 !important; box-shadow: none !important; background: none !important; padding: 0 !important; }
body.cvm-ui .main-container article:has(> .shared-wrapper) > p.no-icon {
  margin: 0 0 22px !important; padding: 0 120px 0 0 !important; color: var(--x-panel-txt) !important; font: 700 18px/1.3 var(--x-body) !important;
}
body.cvm-ui .main-container article:has(> .shared-wrapper) > .pull-right { position: absolute !important; right: 0; top: 0; float: none !important; }
body.cvm-ui .main-container article:has(> .shared-wrapper) > .pull-right .btn {
  display: inline-flex !important; align-items: center !important; gap: 6px !important; height: auto !important; margin: 0 !important;
  padding: 9px 16px !important; border-radius: 999px !important; border: 1px solid #d5deea !important; background: #fff !important; box-shadow: none !important;
  color: var(--x-panel-txt) !important; font: 600 13px/1 var(--x-body) !important; text-shadow: none !important;
}
body.cvm-ui .main-container article:has(> .shared-wrapper) > .pull-right .btn i { display: none !important; }
body.cvm-ui .main-container article:has(> .shared-wrapper) > .pull-right .btn::before { content: '\2190'; }
body.cvm-ui .main-container .shared-wrapper {
  display: flex !important; flex-direction: column !important; gap: 22px !important;
  border: 0 !important; background: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important;
}
body.cvm-ui .main-container .shared-wrapper > * { float: none !important; width: auto !important; margin: 0 !important; }

/* action tiles */
body.cvm-ui .main-container .shared-hosting-menu { background: none !important; border: 0 !important; padding: 0 !important; min-height: 0 !important; }
body.cvm-ui .main-container .shared-hosting-menu > .header,
body.cvm-ui .main-container .shosting-container > .header { display: none !important; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav {
  display: grid !important; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)) !important; gap: 10px !important;
  margin: 0 !important; padding: 0 !important; background: none !important;
}
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li { float: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; width: auto !important; height: auto !important; }
body.cvm-ui .main-container .shared-hosting-menu, body.cvm-ui .main-container .shared-hosting-menu ul.nav { height: auto !important; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li > a p,
body.cvm-ui .main-container .shared-hosting-menu .cvm-tdesc { height: auto !important; overflow: visible !important; text-overflow: clip !important; white-space: normal !important; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li > .c-border,
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li > .bg-fix,
body.cvm-ui .main-container .shared-hosting-menu .cvm-old-ico { display: none !important; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li > a {
  display: grid !important; grid-template-columns: 44px 1fr !important; grid-template-rows: auto auto !important; column-gap: 12px !important; align-items: center !important;
  height: 100% !important; min-height: 76px !important; box-sizing: border-box !important; padding: 14px 16px !important; margin: 0 !important;
  border: 1px solid #e1e8f2 !important; border-radius: 14px !important; background: #fff !important; box-shadow: none !important;
  color: var(--x-panel-txt) !important; text-decoration: none !important; transition: border-color .15s, box-shadow .15s, transform .15s !important;
}
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li > a:hover {
  border-color: rgba(0, 200, 224, .55) !important; box-shadow: 0 10px 26px rgba(20, 33, 58, .1) !important; transform: translateY(-2px);
}
body.cvm-ui .main-container .shared-hosting-menu .cvm-ti {
  grid-row: 1 / span 2; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px;
  background: #eef7fb; color: var(--x-ink);
}
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li > a p {
  margin: 0 !important; padding: 0 !important; align-self: end !important; color: var(--x-panel-txt) !important;
  font: 700 14.5px/1.25 var(--x-body) !important; text-transform: none !important; letter-spacing: 0 !important; white-space: normal !important;
}
body.cvm-ui .main-container .shared-hosting-menu .cvm-tdesc { align-self: start; color: var(--x-panel-muted); font: 500 12.5px/1.35 var(--x-body); margin-top: 2px; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li.active > a { background: var(--x-panel-txt) !important; border-color: var(--x-panel-txt) !important; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li.active > a p { color: #fff !important; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li.active .cvm-tdesc { color: var(--x-muted) !important; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li.active .cvm-ti { background: rgba(0, 240, 255, .14); color: var(--x-cyan); }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li.cvm-tile-danger .cvm-ti { background: #fde8eb; color: #c22a40; }
body.cvm-ui .main-container .shared-hosting-menu ul.nav > li.cvm-tile-danger > a:hover { border-color: rgba(194, 42, 64, .45) !important; }

/* details: the striped table becomes a grid of fact cards */
body.cvm-ui .main-container .shosting-container { border: 0 !important; background: none !important; box-shadow: none !important; padding: 0 !important; min-height: 0 !important; }
body.cvm-ui .main-container .shosting-container > .padding { padding: 0 !important; }
body.cvm-ui .main-container .shosting-container h2 { font: 800 20px/1.2 var(--x-head) !important; margin: 0 0 6px !important; }
body.cvm-ui .main-container .shosting-container h2 + p a.lmore {
  display: inline-flex !important; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px;
  background: #eef7fb; color: var(--x-ink) !important; font: 700 12.5px/1 var(--x-body) !important; text-decoration: none !important;
}
body.cvm-ui .main-container .shosting-container h2 + p a.lmore::before { content: '\2191'; }
body.cvm-ui .main-container .shosting-container table.table-aff-center,
body.cvm-ui .main-container .shosting-container table.table-aff-center > tbody { display: block !important; width: 100% !important; margin: 14px 0 0 !important; border: 0 !important; background: none !important; }
body.cvm-ui .main-container .shosting-container table.table-aff-center > tbody {
  display: grid !important; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important; gap: 10px !important; margin: 0 !important;
}
body.cvm-ui .main-container .shosting-container table.table-aff-center tr {
  display: flex !important; flex-direction: column !important; justify-content: flex-start !important; gap: 6px !important;
  padding: 16px 18px !important; border: 1px solid #e1e8f2 !important; border-radius: 14px !important; background: #fff !important;
}
body.cvm-ui .main-container .shosting-container table.table-aff-center td {
  display: block !important; width: auto !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; text-align: left !important;
}
/* label (first cell) above the value, small caps */
body.cvm-ui .main-container .shosting-container table.table-aff-center td:first-child {
  color: var(--x-panel-muted) !important; font: 700 10.5px/1.2 var(--x-body) !important; letter-spacing: .12em !important; text-transform: uppercase !important;
}
body.cvm-ui .main-container .shosting-container table.table-aff-center td:last-child { color: var(--x-panel-txt) !important; font: 700 17px/1.3 var(--x-body) !important; word-break: break-word; }
body.cvm-ui .main-container .shosting-container table.table-aff-center td:last-child a { color: var(--x-ink) !important; }
body.cvm-ui .main-container .shosting-container table.table-aff-center .label {
  display: inline-block !important; padding: 4px 10px !important; border-radius: 999px !important; text-shadow: none !important;
  font: 700 12px/1.2 var(--x-body) !important; background: #eef2f7 !important; color: #5b6b84 !important;
}
body.cvm-ui .main-container .shosting-container table.table-aff-center .label.Active-label { background: #e3f8ee !important; color: #128a52 !important; }
body.cvm-ui .main-container .shosting-container table.table-aff-center .label.Suspended-label,
body.cvm-ui .main-container .shosting-container table.table-aff-center .label.Terminated-label { background: #fde8eb !important; color: #c22a40 !important; }

@media (max-width: 767px) {
  body.cvm-ui .main-container .shared-hosting-menu ul.nav { grid-template-columns: 1fr 1fr !important; }
  body.cvm-ui .main-container .shared-hosting-menu ul.nav > li > a { grid-template-columns: 1fr !important; grid-template-rows: auto auto auto !important; row-gap: 8px !important; padding: 14px !important; }
  body.cvm-ui .main-container .shared-hosting-menu .cvm-ti { grid-row: auto; width: 40px; height: 40px; }
  body.cvm-ui .main-container .shared-hosting-menu .cvm-tdesc { display: none; }
  body.cvm-ui .main-container .shosting-container table.table-aff-center > tbody { grid-template-columns: 1fr 1fr !important; }
  body.cvm-ui .main-container .shosting-container table.table-aff-center tr:first-child { grid-column: 1 / -1; }
  body.cvm-ui .main-container .shared-wrapper > .shared-hosting-menu { order: -1 !important; }
  body.cvm-ui .main-container article:has(> .shared-wrapper) > p.no-icon { padding-right: 90px !important; font-size: 16px !important; }
}

/* sidebar quick links */
body.cvm-ui aside#submenu .link-list li > a { border-radius: 10px !important; }
body.cvm-ui aside#submenu .link-list li > a,
body.cvm-ui aside#submenu .link-list li > a p { color: var(--x-panel-txt) !important; background: none !important; }
body.cvm-ui aside#submenu .link-list li > a:hover { background: #f1f5fa !important; }
body.cvm-ui aside#submenu .link-list li.active > a { background: var(--x-panel-txt) !important; }
body.cvm-ui aside#submenu .link-list li.active > a,
body.cvm-ui aside#submenu .link-list li.active > a p,
body.cvm-ui aside#submenu .link-list li.active > a i { color: #fff !important; }

/* balance boxes */
body.cvm-ui aside#submenu .account-info .header,
body.cvm-ui aside#submenu .invoices-balance {
  background: var(--x-panel-txt) !important; background-image: none !important; border-radius: 14px !important; border: 0 !important;
  padding: 18px 20px !important; margin: 0 0 12px !important; height: auto !important;
  width: auto !important; max-width: 100% !important; box-sizing: border-box !important; position: static !important;
}
body.cvm-ui aside#submenu .account-info .header.due-alert { background: linear-gradient(135deg, #3b0d14, #14213a) !important; box-shadow: inset 0 0 0 1px rgba(255, 90, 110, .45) !important; }
body.cvm-ui aside#submenu .account-info .header p,
body.cvm-ui aside#submenu .invoices-balance .p15 > span {
  display: block !important; color: var(--x-muted) !important; font: 700 11px/1.3 var(--x-body) !important;
  letter-spacing: .14em !important; text-transform: uppercase !important; margin: 0 0 6px !important;
}
body.cvm-ui aside#submenu .account-info .header > span,
body.cvm-ui aside#submenu .invoices-balance .p15 > p {
  display: block !important; color: #fff !important; font: 700 28px/1.15 'Montserrat', var(--x-body) !important; letter-spacing: -.01em !important; margin: 0 !important; white-space: nowrap !important;
}
body.cvm-ui aside#submenu .account-info .header small,
body.cvm-ui aside#submenu .invoices-balance .p15 > p span { font-size: .6em !important; vertical-align: .35em; color: #fff !important; }
body.cvm-ui aside#submenu .invoices-balance .p15 { padding: 0 !important; display: block !important; }
body.cvm-ui aside#submenu .invoices-balance .btn {
  position: static !important; float: none !important; width: auto !important; height: auto !important; margin: 14px 0 0 !important;
  background: rgba(0, 240, 255, .14) !important; color: var(--x-cyan) !important; border: 1px solid rgba(0, 240, 255, .4) !important;
  border-radius: 999px !important; padding: 9px 16px !important; font: 700 12px/1 var(--x-body) !important; text-shadow: none !important; box-shadow: none !important;
}

/* "Add new service" dropdown + filter Go */
body.cvm-ui aside#submenu .add-new-service .btn,
body.cvm-ui aside#submenu .add-new-service .input-append,
body.cvm-ui aside#submenu .add-new-service .input-append > div,
body.cvm-ui aside#submenu .add-new-service .add-on {
  background: none !important; background-image: none !important; border: 0 !important; box-shadow: none !important; text-shadow: none !important;
}
body.cvm-ui aside#submenu .add-new-service > a.btn,
body.cvm-ui aside#submenu .add-new-service > .btn-group > .btn {
  display: block !important; width: 100% !important; padding: 13px 18px !important; border-radius: 999px !important; text-align: left !important;
  background: linear-gradient(135deg, var(--x-cyan), var(--x-cyan2)) !important; color: #04121a !important;
}
body.cvm-ui aside#submenu .add-new-service, body.cvm-ui aside#submenu .add-new-service * { box-sizing: border-box !important; }
body.cvm-ui aside#submenu .add-new-service > .btn-group { display: block !important; width: 100% !important; }
body.cvm-ui aside#submenu .add-new-service > a.btn,
body.cvm-ui aside#submenu .add-new-service > .btn-group > .btn {
  display: flex !important; align-items: center !important; gap: 10px !important; height: auto !important; min-height: 46px !important;
  line-height: 1.2 !important; padding: 12px 18px !important; margin: 0 !important; overflow: visible !important;
}
body.cvm-ui aside#submenu .add-new-service > .btn-group > .btn .input-append { flex: 1 !important; }
body.cvm-ui aside#submenu .add-new-service > .btn-group > .btn .input-append { display: flex !important; align-items: center !important; justify-content: space-between !important; height: auto !important; margin: 0 !important; }
body.cvm-ui aside#submenu .add-new-service > .btn-group > .btn .input-append > div,
body.cvm-ui aside#submenu .add-new-service > .btn-group > .btn .add-on { height: auto !important; padding: 0 !important; width: auto !important; line-height: 1 !important; }
body.cvm-ui aside#submenu .add-new-service > a.btn { color: #04121a !important; font: 700 13px/1.2 var(--x-body) !important; letter-spacing: .06em !important; text-transform: uppercase !important; }
body.cvm-ui aside#submenu .add-new-service > a.btn i { filter: brightness(0); }
/* sidebar search: one pill with the Go button inside */
body.cvm-ui aside#submenu .content-search {
  display: flex !important; flex-direction: row-reverse !important; align-items: center !important; gap: 6px !important;
  border: 1px solid #d5deea !important; border-radius: 999px !important; padding: 4px 4px 4px 14px !important; background: #fff !important; height: auto !important;
}
body.cvm-ui aside#submenu .content-search > * { float: none !important; margin: 0 !important; }
body.cvm-ui aside#submenu .content-search .overflow-hidden { flex: 1 !important; }
body.cvm-ui aside#submenu .content-search .icon-search { display: none !important; }
body.cvm-ui aside#submenu .content-search input.search-field, body.cvm-ui aside#submenu .content-search input[type=text] {
  border: 0 !important; box-shadow: none !important; min-height: 34px !important; padding: 0 !important; width: 100% !important; background: none !important;
}
body.cvm-ui aside#submenu .content-search .btn { padding: 8px 16px !important; min-height: 0 !important; box-shadow: none !important; }
body.cvm-ui aside#submenu .add-new-service span { color: #04121a !important; font: 700 13px/1 var(--x-body) !important; letter-spacing: .06em; text-transform: uppercase; }
body.cvm-ui aside#submenu .add-new-service .icon-add-service-caret { filter: brightness(0); }

/* pagination */
body.cvm-ui .main-container .c-pagination ul { box-shadow: none !important; }
body.cvm-ui .main-container .c-pagination li > a, body.cvm-ui .main-container .c-pagination li > span {
  border: 0 !important; background: none !important; font: 600 12px/1 var(--x-body) !important; letter-spacing: .06em; text-transform: uppercase;
}
body.cvm-ui .main-container .c-pagination li.active > a, body.cvm-ui .main-container .c-pagination li.active > span {
  background: var(--x-panel-txt) !important; color: #fff !important; border-radius: 8px !important;
}

/* ── Login / signup ───────────────────────────────────────── */
/* login: HostBill already draws its own box, so drop our panel and let that box be the card */
body.cvm-ui.cvm-cmd-clientarea:not(.cvm-logged) .row.center-area.main-container {
  max-width: 520px !important; background: none !important; box-shadow: none !important; padding: 0 !important;
}
body.cvm-ui.cvm-cmd-clientarea:not(.cvm-logged) #clientarea > * { width: 100% !important; max-width: none !important; margin: 0 !important; }
body.cvm-ui.cvm-cmd-clientarea:not(.cvm-logged) .wbox, body.cvm-ui.cvm-cmd-clientarea:not(.cvm-logged) #clientarea .well,
body.cvm-ui.cvm-cmd-clientarea:not(.cvm-logged) #clientarea form > div:first-child {
  border-radius: var(--x-radius) !important; overflow: hidden; box-shadow: 0 30px 80px rgba(0, 0, 0, .45) !important;
}
body.cvm-ui .main-container input[type=text], body.cvm-ui .main-container input[type=email],
body.cvm-ui .main-container input[type=password], body.cvm-ui .main-container input[type=tel],
body.cvm-ui .main-container select { min-height: 44px !important; padding: 8px 14px !important; font-size: 15px !important; box-sizing: border-box !important; }
body.cvm-ui .main-container textarea { padding: 10px 14px !important; font-size: 15px !important; }
body.cvm-ui.cvm-cmd-signup .row.center-area.main-container { max-width: 860px !important; }

/* ── Footer ───────────────────────────────────────────────── */
body.cvm-ui footer.cvf {
  background: rgba(5, 8, 15, .9) !important; border-top: 1px solid var(--x-line) !important;
  margin: 0 !important; padding: 0 !important; color: var(--x-muted) !important; font-size: 14px !important;
}
body.cvm-ui .cvf-in {
  max-width: 1280px; margin: 0 auto; padding: 56px 24px 36px;
  display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 32px;
}
body.cvm-ui .cvf-brand img { height: 46px !important; width: auto !important; margin-bottom: 14px; }
body.cvm-ui footer.cvf p { color: var(--x-muted) !important; max-width: 320px; }
body.cvm-ui footer.cvf a.cvf-tel { color: #fff !important; font: 700 18px/1 var(--x-head); }
body.cvm-ui footer.cvf h4 {
  color: #fff !important; font: 700 12px/1 var(--x-body) !important; letter-spacing: .16em !important;
  text-transform: uppercase !important; margin: 6px 0 16px !important;
}
body.cvm-ui .cvf-col a { display: block; color: var(--x-muted) !important; padding: 5px 0; }
body.cvm-ui footer.cvf a:hover { color: var(--x-cyan) !important; }
body.cvm-ui .cvf-base {
  max-width: 1280px; margin: 0 auto; padding: 18px 24px 26px; border-top: 1px solid var(--x-line);
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13px;
}
body.cvm-ui .cvf-secure { display: inline-flex; align-items: center; gap: 6px; }

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 1100px) {
  body.cvm-ui .cvm-plans { grid-template-columns: repeat(2, 1fr); }
  body.cvm-ui .cvh-site a { padding: 10px 9px !important; }
}
/* below ~1100px a 300px sidebar leaves list tables too little room: stack it under the content */
@media (max-width: 1100px) {
  body.cvm-ui .main-container.fullside { flex-direction: column !important; }
  body.cvm-ui .main-container.fullside > aside#submenu { width: 100% !important; }
  body.cvm-ui .main-container.fullside > aside#submenu #floater { position: static !important; width: 100% !important; }
}
@media (max-width: 960px) {
  body.cvm-ui .cvh-site { display: none; }
  body.cvm-ui .cvh-actions { margin-left: auto !important; }
  body.cvm-ui .cvh-burger { display: inline-flex !important; }
  body.cvm-ui .wrapper-menu.cvh-portal { display: none !important; }
  body.cvm-ui.cvm-menu-open .wrapper-menu.cvh-portal {
    display: block !important; position: fixed !important; top: 84px !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    height: auto !important; max-height: none !important; z-index: 1055 !important; overflow-y: auto !important;
    background: #05080f !important; margin: 0 !important;
  }
  body.cvm-ui.cvm-menu-open { overflow: hidden !important; }
  body.cvm-ui.cvm-menu-open .wrapper-menu .menu-bg, body.cvm-ui.cvm-menu-open .wrapper-menu nav { padding-top: 0 !important; margin: 0 !important; height: auto !important; }
  body.cvm-ui.cvm-menu-open .cvh-portal-in { flex-direction: column !important; align-items: stretch !important; padding: 18px 24px 40px !important; gap: 0 !important; }
  body.cvm-ui.cvm-menu-open .cvh-portal-label { border: 0; padding: 8px 0 6px; }
  body.cvm-ui.cvm-menu-open .wrapper-menu .nav.nav-pills { flex-direction: column !important; }
  body.cvm-ui.cvm-menu-open .wrapper-menu .menu-bg nav > ul > li > a { padding: 15px 0 !important; font-size: 15px !important; border-bottom: 1px solid var(--x-line) !important; }
  body.cvm-ui.cvm-menu-open .cvh-portal-mobile-site { display: flex; flex-direction: column; margin-top: 22px; }
  body.cvm-ui .cvh-portal-mobile-site a { color: #fff !important; font: 700 22px/1 var(--x-head); padding: 12px 0; }
  body.cvm-ui .cvr-cards { grid-template-columns: 1fr; }
  body.cvm-ui .cvr-trust { grid-template-columns: repeat(2, 1fr); }
  body.cvm-ui .cvr-trust div:nth-child(2) { border-right: 0; }
  body.cvm-ui .cvr-trust div:nth-child(-n+2) { border-bottom: 1px solid var(--x-line); }
  body.cvm-ui .cvf-in { grid-template-columns: 1fr 1fr; }
  body.cvm-ui .cvf-brand { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  body.cvm-ui .cvh-in { height: 70px; padding: 0 16px; gap: 12px; }
  body.cvm-ui header.cvh .cvh-logo img { height: 40px !important; }
  body.cvm-ui.cvm-menu-open .wrapper-menu.cvh-portal { top: 70px; }
  body.cvm-ui .cvh-actions .account-box .btn { padding: 10px 12px !important; }
  body.cvm-ui .cvh-actions .lang-box:not(.pull-right) { display: none !important; }
  body.cvm-ui .cvh-band { padding: 30px 0 56px; }
  body.cvm-ui .cvh-band-in { padding: 0 16px; }
  body.cvm-ui .row.center-area.main-container { width: calc(100% - 24px) !important; padding: 22px 16px !important; border-radius: 14px !important; }
  body.cvm-ui .cvm-plans { grid-template-columns: 1fr; gap: 22px; }
  body.cvm-ui .cvr-hero { padding: 56px 4px 40px; }
  body.cvm-ui .cvr-search { flex-wrap: wrap; border-radius: 22px; padding: 10px; }
  body.cvm-ui .cvr-search svg { display: none; }
  body.cvm-ui .main-container .cvr-search input[type=text] { flex-basis: 100%; padding: 0 10px !important; }
  body.cvm-ui .cvr-search .cvm-btn { width: 100%; }
  body.cvm-ui #cart #progress li { font-size: 0 !important; }
  body.cvm-ui #cart #progress li::before { font-size: 12px; }
  body.cvm-ui .cvf-in { grid-template-columns: 1fr; padding-top: 40px; }
}
@media (max-width: 480px) {
  body.cvm-ui .cvh-in { gap: 8px; padding: 0 12px; }
  body.cvm-ui header.cvh .cvh-logo img { height: 34px !important; }
  body.cvm-ui .cvh-actions { gap: 6px !important; }
  body.cvm-ui .cvh-acct-txt, body.cvm-ui .cvh-actions .account-box .caret { display: none !important; }
  body.cvm-ui .cvh-actions .btn, body.cvm-ui .cvh-actions .btn.dropdown-toggle { padding: 10px 12px !important; }
  body.cvm-ui .cvh-burger { width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  body.cvm-ui * { transition: none !important; }
}
