/* ===== CloudEdgeUS Dashboard V2 ===== */

:root {
  --ce-sidebar-width: 238px;
  --ce-sidebar-bg: #070a16;
  --ce-sidebar-border: rgba(148, 163, 184, 0.12);
  --ce-sidebar-text: #aeb8d1;
  --ce-sidebar-muted: #66718e;
  --ce-purple: #8064ff;
  --ce-blue: #2785ff;
}


/* Reserve space for Sidebar */
body {
  padding-left: var(--ce-sidebar-width);
}


/* Sidebar */
.ce-v2-sidebar {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;

  width: var(--ce-sidebar-width);
  height: 100vh;

  display: flex;
  flex-direction: column;

  background: var(--ce-sidebar-bg);
  border-right: 1px solid var(--ce-sidebar-border);

  z-index: 10000;
}


/* Brand */
.ce-v2-brand {
  height: 76px;
  padding: 0 20px;

  display: flex;
  align-items: center;
  gap: 11px;

  border-bottom: 1px solid var(--ce-sidebar-border);

  color: #ffffff;
  font-size: 20px;
  font-weight: 900;
}

.ce-v2-brand img {
  width: 34px;
  height: 34px;
  object-fit: contain;
}

.ce-v2-brand .edge {
  color: var(--ce-blue);
}


/* Menu */
.ce-v2-menu {
  flex: 1;
  padding: 25px 12px;
}

.ce-v2-label {
  margin: 0 10px 10px;

  color: var(--ce-sidebar-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.16em;
}

.ce-v2-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ce-v2-nav a {
  min-height: 44px;
  padding: 0 12px;

  display: flex;
  align-items: center;
  gap: 12px;

  border-radius: 9px;

  color: var(--ce-sidebar-text);
  font-size: 14px;
  font-weight: 700;

  transition: 0.16s ease;
}

.ce-v2-nav a:hover {
  color: #ffffff;
  background: rgba(128, 100, 255, 0.12);
}

.ce-v2-nav a.active {
  color: #ffffff;
  background: rgba(128, 100, 255, 0.22);
  box-shadow: inset 3px 0 0 var(--ce-purple);
}

.ce-v2-icon {
  width: 22px;
  text-align: center;
  color: #9582ff;
  font-size: 16px;
}

.ce-v2-gap {
  height: 24px;
}


/* Bottom Logout */
.ce-v2-footer {
  padding: 14px 12px 20px;
  border-top: 1px solid var(--ce-sidebar-border);
}

.ce-v2-logout {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;

  border: 0;
  border-radius: 9px;

  background: transparent;
  color: #ff626d;

  font-size: 14px;
  font-weight: 800;
  text-align: left;

  cursor: pointer;
}

.ce-v2-logout:hover {
  background: rgba(255, 80, 95, 0.08);
}


/* Existing Dashboard */
.page-shell {
  width: calc(100% - 64px) !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
}


/* Mobile safety */
@media (max-width: 900px) {

  body {
    padding-left: 0;
  }

  .ce-v2-sidebar {
    display: none;
  }

}
/* =========================================================
   CloudEdgeUS Dashboard V2 - Overview
   ========================================================= */


/* Old top navigation is duplicated by the V2 sidebar */
.topbar {
  display: none !important;
}


/* Keep legacy quick links in source,
   but remove them from V2 visual layout */
.quick-grid {
  display: none !important;
}


/* Overview area */
.ce-v2-overview-hero {
  padding: 42px 0 22px !important;
}


/* Header */
.ce-v2-overview-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;
}


.ce-v2-kicker {
  margin-bottom: 8px;

  color: #8170ff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.16em;
}


.ce-v2-overview-head h1 {
  margin: 0 !important;

  font-size: 32px !important;
  line-height: 1.1 !important;
  letter-spacing: -0.5px !important;
}


.ce-v2-overview-head #userInfo {
  margin-top: 8px;

  color: #8490ad;
  font-size: 13px;
}


/* Secure session */
.ce-v2-session {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  min-height: 34px;
  padding: 0 13px;

  border: 1px solid rgba(52, 211, 153, 0.22);
  border-radius: 999px;

  background: rgba(16, 185, 129, 0.08);
  color: #72e6bd;

  font-size: 12px;
  font-weight: 800;
}


.ce-v2-session-dot {
  width: 7px;
  height: 7px;

  border-radius: 999px;

  background: #35d399;

  box-shadow:
    0 0 10px rgba(53, 211, 153, 0.8);
}


/* Four overview cards */
.ce-v2-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}


.ce-v2-summary-card {
  position: relative;

  min-height: 150px;
  padding: 20px;

  display: flex;
  flex-direction: column;

  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 14px;

  background: #15162b;

  overflow: hidden;

  transition:
    transform 0.16s ease,
    border-color 0.16s ease,
    background 0.16s ease;
}


.ce-v2-summary-card::after {
  content: "";

  position: absolute;

  left: 0;
  right: 0;
  bottom: 0;

  height: 2px;

  opacity: 0.9;
}


.ce-v2-summary-card:hover {
  transform: translateY(-2px);

  border-color: rgba(128, 100, 255, 0.38);

  background: #18192f;
}


.ce-v2-summary-top {
  display: flex;
  align-items: center;
  justify-content: space-between;

  margin-bottom: 18px;
}


.ce-v2-summary-top span {
  color: #707b9c;

  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.12em;
}


.ce-v2-summary-icon {
  width: 38px;
  height: 38px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 9px;

  font-size: 18px;
}


.ce-v2-summary-card strong {
  display: block;

  margin-bottom: 7px;

  color: #ffffff;

  font-size: 20px;
  line-height: 1.2;
}


.ce-v2-summary-card small {
  display: block;

  color: #7d89a8;

  font-size: 12px;
  line-height: 1.5;
}


/* Purple */
.ce-v2-summary-card.purple .ce-v2-summary-icon {
  color: #9a7cff;
  background: rgba(124, 92, 255, 0.15);
}

.ce-v2-summary-card.purple::after {
  background: #805cff;
}


/* Blue */
.ce-v2-summary-card.blue .ce-v2-summary-icon {
  color: #57a0ff;
  background: rgba(44, 126, 255, 0.14);
}

.ce-v2-summary-card.blue::after {
  background: #418cff;
}


/* Green */
.ce-v2-summary-card.green .ce-v2-summary-icon {
  color: #39d9ab;
  background: rgba(32, 201, 151, 0.13);
}

.ce-v2-summary-card.green::after {
  background: #31cfa0;
}


/* Orange */
.ce-v2-summary-card.orange .ce-v2-summary-icon {
  color: #ffb83d;
  background: rgba(245, 158, 11, 0.13);
}

.ce-v2-summary-card.orange::after {
  background: #f5a623;
}


/* Make the remaining panels sit closer to template style */
.section,
.orders-section {
  border-color: rgba(148, 163, 184, 0.14) !important;

  background: #111426 !important;

  box-shadow: none !important;
}


.section {
  margin-top: 22px !important;
}


/* Responsive */
@media (max-width: 1180px) {

  .ce-v2-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}


@media (max-width: 700px) {

  .ce-v2-overview-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .ce-v2-summary-grid {
    grid-template-columns: 1fr;
  }

}
/* ===== Overview: sidebar owns service navigation ===== */

.ce-v2-summary-grid {
  display: none !important;
}

.ce-v2-overview-head {
  margin-bottom: 18px !important;
}
/* =========================================================
   CloudEdgeUS Dashboard V2 Pricing
   ========================================================= */

.ce-v2-pricing {
  margin-top: 34px;
  padding: 42px 28px;
}

.ce-v2-pricing-head {
  text-align: center;
  margin-bottom: 44px;
}

.ce-v2-pricing-kicker {
  margin-bottom: 14px;

  color: #8064ff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
}

.ce-v2-pricing-head h2 {
  margin: 0;

  color: #ffffff;
  font-size: 38px;
  line-height: 1.15;
  letter-spacing: -.6px;
}

.ce-v2-pricing-head h2 span {
  background: linear-gradient(
    90deg,
    #845cff,
    #4787ff
  );

  -webkit-background-clip: text;
  background-clip: text;

  color: transparent;
}

.ce-v2-pricing-head p {
  max-width: 560px;
  margin: 14px auto 0;

  color: #9ba6c2;
  font-size: 14px;
  line-height: 1.55;
}

.ce-v2-pricing-grid {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 24px;
}

.ce-v2-price-card {
  position: relative;

  min-height: 485px;
  padding: 28px 28px 26px;

  display: flex;
  flex-direction: column;

  border:
    1px solid rgba(148, 163, 184, .16);

  border-radius: 14px;

  background: #17172d;
}

.ce-v2-price-card.ce-v2-yearly {
  border-color:
    rgba(128, 92, 255, .58);
}

.ce-v2-best-value {
  position: absolute;

  top: -14px;
  right: 28px;

  padding: 7px 17px;

  border-radius: 999px;

  background:
    linear-gradient(
      135deg,
      #805cff,
      #4785ff
    );

  color: #ffffff;

  font-size: 11px;
  font-weight: 900;
}

.ce-v2-plan-name {
  color: #7e87a5;

  font-size: 12px;
  font-weight: 900;

  letter-spacing: .08em;
}

.ce-v2-price {
  margin-top: 7px;

  color: #ffffff;

  font-size: 46px;
  font-weight: 900;

  line-height: 1;
}

.ce-v2-price sup {
  position: relative;
  top: -13px;

  margin-right: 3px;

  font-size: 19px;
}

.ce-v2-price-note {
  margin-top: 10px;

  color: #7f89a8;

  font-size: 12px;
}

.ce-v2-plan-description {
  min-height: 55px;

  margin-top: 20px;

  color: #bac3dd;

  font-size: 14px;
  line-height: 1.55;
}

.ce-v2-plan-divider {
  height: 1px;

  margin: 20px 0;

  background:
    rgba(148, 163, 184, .14);
}

.ce-v2-plan-features {
  display: flex;
  flex-direction: column;

  gap: 12px;

  color: #ffffff;

  font-size: 13px;
}

.ce-v2-plan-features div {
  line-height: 1.35;
}

.ce-v2-plan-features div::first-letter {
  color: #24d6ad;
}

.ce-v2-request-btn {
  width: 100%;
  min-height: 42px;

  margin-top: auto;

  border: 0;
  border-radius: 9px;

  background:
    linear-gradient(
      135deg,
      #805cff,
      #418cff
    );

  color: #ffffff;

  font-size: 14px;
  font-weight: 900;

  cursor: pointer;
}

.ce-v2-request-btn:hover {
  filter: brightness(1.08);
}

@media (max-width: 1100px) {

  .ce-v2-pricing-grid {
    grid-template-columns: 1fr;
  }

  .ce-v2-price-card {
    min-height: auto;
  }

  .ce-v2-request-btn {
    margin-top: 28px;
  }

}
/* ===== CloudEdgeUS Settings V2 ===== */

.ce-settings-page {
  padding: 42px 0;
}

.ce-settings-header {
  margin-bottom: 28px;
}

.ce-settings-header h1 {
  margin: 0 0 7px;
  font-size: 30px;
}

.ce-settings-header p {
  margin: 0;
  color: #7f8aa7;
  font-size: 13px;
}

.ce-settings-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.ce-settings-card {
  padding: 24px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: #16162a;
}

.ce-settings-title {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 22px;

  color: #fff;
  font-size: 16px;
  font-weight: 800;
}

.ce-settings-title span {
  color: #8b5cf6;
}

.ce-settings-profile {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 24px;
}

.ce-settings-avatar {
  width: 56px;
  height: 56px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 16px;

  background: linear-gradient(135deg,#8b5cf6,#3b82f6);

  color: white;
  font-size: 18px;
  font-weight: 900;
}

.ce-settings-profile strong,
.ce-settings-profile small,
.ce-settings-profile span {
  display: block;
}

.ce-settings-profile strong {
  color: #fff;
  margin-bottom: 4px;
}

.ce-settings-profile small {
  color: #747f9d;
}

.ce-settings-plan {
  width: fit-content;
  margin-top: 7px;
  padding: 3px 9px;

  border: 1px solid rgba(52,211,153,.22);
  border-radius: 999px;

  background: rgba(52,211,153,.10);
  color: #34d399;

  font-size: 10px;
  font-weight: 700;
}

.ce-settings-label {
  display: block;
  margin: 14px 0 7px;

  color: #aab4cd;
  font-size: 12px;
  font-weight: 700;
}

.ce-settings-input {
  width: 100%;
  height: 44px;
  padding: 0 13px;

  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;

  background: #111224;
  color: #fff;

  outline: none;
}

.ce-settings-save {
  margin-top: 20px;
  padding: 11px 20px;

  border: 0;
  border-radius: 9px;

  background: linear-gradient(135deg,#805cff,#418cff);

  color: #fff;
  font-weight: 800;
}

.ce-settings-save:disabled {
  opacity: .55;
  cursor: default;
}

.ce-setting-row {
  min-height: 70px;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;

  border-bottom: 1px solid rgba(255,255,255,.07);
}

.ce-setting-row:last-child {
  border-bottom: 0;
}

.ce-setting-row strong,
.ce-setting-row small {
  display: block;
}

.ce-setting-row strong {
  color: #fff;
  font-size: 13px;
}

.ce-setting-row small {
  margin-top: 4px;
  color: #6f7896;
  font-size: 11px;
}

.ce-toggle {
  position: relative;
  width: 44px;
  height: 24px;
  flex: 0 0 auto;
}

.ce-toggle input {
  display: none;
}

.ce-toggle span {
  position: absolute;
  inset: 0;

  border-radius: 999px;

  background: linear-gradient(135deg,#805cff,#418cff);
}

.ce-toggle span::before {
  content: "";

  position: absolute;
  top: 3px;
  right: 3px;

  width: 18px;
  height: 18px;

  border-radius: 50%;
  background: white;
}

@media (max-width: 900px) {
  .ce-settings-grid {
    grid-template-columns: 1fr;
  }
}
/* =========================================================
   CloudEdgeUS V2 - Smooth Navigation V2
   Nexus-style cross-page transition
   ========================================================= */

@view-transition {
  navigation: auto;
}


/* -----------------------------------------
   Stable application shell
   ----------------------------------------- */

.ce-v2-sidebar {
  view-transition-name: ce-sidebar;
}

.page-shell {
  view-transition-name: ce-content;
}


/* -----------------------------------------
   Disable whole-document animation
   Prevent background/sidebar flashing
   ----------------------------------------- */

::view-transition-old(root),
::view-transition-new(root) {
  animation: none !important;
  mix-blend-mode: normal;
}


/* -----------------------------------------
   Sidebar stays visually fixed
   ----------------------------------------- */

::view-transition-group(ce-sidebar),
::view-transition-old(ce-sidebar),
::view-transition-new(ce-sidebar) {
  animation: none !important;
  mix-blend-mode: normal;
}


/* -----------------------------------------
   Main content transition
   ----------------------------------------- */

::view-transition-group(ce-content) {
  animation-duration: 300ms;
  animation-timing-function:
    cubic-bezier(0.22, 1, 0.36, 1);
}


/* Old page softly disappears */

::view-transition-old(ce-content) {
  animation:
    ce-page-out
    190ms
    cubic-bezier(0.4, 0, 1, 1)
    both;

  mix-blend-mode: normal;
}


/* New page softly appears */

::view-transition-new(ce-content) {
  animation:
    ce-page-in
    300ms
    cubic-bezier(0.22, 1, 0.36, 1)
    both;

  mix-blend-mode: normal;
}


@keyframes ce-page-out {

  from {
    opacity: 1;
    transform: translateY(0);
  }

  to {
    opacity: 0;
    transform: translateY(-2px);
  }

}


@keyframes ce-page-in {

  from {
    opacity: 0;
    transform: translateY(3px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }

}


/* GPU compositing hint */

.ce-v2-sidebar,
.page-shell {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

@view-transition {
  navigation: auto;
}

/* Sidebar keeps the same visual position between pages */
.ce-v2-sidebar {
  view-transition-name: ce-sidebar;
}

/* Only the right-side page content changes */
.page-shell {
  view-transition-name: ce-content;
}


/* Sidebar should look stationary */
::view-transition-old(ce-sidebar),
::view-transition-new(ce-sidebar) {
  animation: none;
  mix-blend-mode: normal;
}


/* Old content leaves */
::view-transition-old(ce-content) {
  animation: ce-content-out 120ms ease both;
}

/* New content enters */
::view-transition-new(ce-content) {
  animation: ce-content-in 220ms ease both;
}


@keyframes ce-content-out {
  from {
    opacity: 1;
    transform: translateY(0);
  }

  to {
    opacity: 0;
    transform: translateY(4px);
  }
}


@keyframes ce-content-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* =========================================================
   CloudEdgeUS V2 - Unified Shell
   Keep all dashboard pages visually identical
   ========================================================= */

/* V2 sidebar links must never inherit legacy page underline */
.ce-v2-brand,
.ce-v2-brand:hover,
.ce-v2-brand:focus,
.ce-v2-nav a,
.ce-v2-nav a:hover,
.ce-v2-nav a:focus {
  text-decoration: none !important;
}


/* Unified V2 dashboard background */
body {
  min-height: 100vh;

  background:
    radial-gradient(
      circle at 84% 18%,
      rgba(8, 119, 255, 0.22),
      transparent 30%
    ),
    radial-gradient(
      circle at 12% 2%,
      rgba(37, 99, 235, 0.14),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #020817 0%,
      #031126 48%,
      #020817 100%
    ) !important;

  background-attachment: fixed !important;
}


/* Same subtle grid used by Overview */
body::before {
  content: "";
  position: fixed;
  inset: 0;

  pointer-events: none;

  opacity: 0.72;

  background-image:
    linear-gradient(
      rgba(59, 130, 246, 0.038) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(59, 130, 246, 0.032) 1px,
      transparent 1px
    );

  background-size: 72px 72px;

  z-index: -1;
}

/* =========================================================
   CloudEdgeUS Dashboard V2
   Unified Content Palette
   Account + Orders + Servers
   Match Support / Nexus visual system
   ========================================================= */


/* =========================================================
   Shared page palette
   ========================================================= */

body.ce-account-v2,
body.ce-orders-v2,
body.ce-servers-v2 {
  --ce-content-panel: #16162a;
  --ce-content-panel-2: #111426;
  --ce-content-deep: #101121;
  --ce-content-table: #111224;

  --ce-content-border:
    rgba(148, 163, 184, 0.14);

  --ce-content-border-strong:
    rgba(148, 163, 184, 0.20);

  --ce-content-text: #f4f5ff;
  --ce-content-muted: #8f97b3;

  --ce-content-purple: #805cff;
  --ce-content-blue: #418cff;

  background:
    radial-gradient(
      circle at 84% 18%,
      rgba(8, 119, 255, 0.22),
      transparent 30%
    ),
    radial-gradient(
      circle at 12% 2%,
      rgba(37, 99, 235, 0.14),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #020817 0%,
      #031126 48%,
      #020817 100%
    ) !important;

  color:
    var(--ce-content-text) !important;
}


/* =========================================================
   ACCOUNT STATUS
   ========================================================= */

body.ce-account-v2 .panel {
  background:
    var(--ce-content-panel) !important;

  border-color:
    var(--ce-content-border) !important;

  box-shadow:
    none !important;
}


body.ce-account-v2 .panel-head {
  border-bottom-color:
    var(--ce-content-border) !important;

  background:
    var(--ce-content-panel-2) !important;
}


body.ce-account-v2 .subtitle,
body.ce-account-v2 .panel-head p,
body.ce-account-v2 .hint {
  color:
    var(--ce-content-muted) !important;
}


body.ce-account-v2 .notice {
  background:
    rgba(128, 92, 255, 0.07) !important;

  border-color:
    rgba(128, 92, 255, 0.22) !important;

  color:
    #cdd2e7 !important;
}


body.ce-account-v2 label {
  color:
    #cfd5e8 !important;
}


body.ce-account-v2 input,
body.ce-account-v2 select,
body.ce-account-v2 textarea {
  background:
    var(--ce-content-deep) !important;

  border-color:
    rgba(148, 163, 184, 0.18) !important;

  color:
    var(--ce-content-text) !important;
}


body.ce-account-v2 input:focus,
body.ce-account-v2 select:focus,
body.ce-account-v2 textarea:focus {
  border-color:
    #745cff !important;

  box-shadow:
    0 0 0 3px
    rgba(116, 92, 255, 0.10) !important;
}


body.ce-account-v2 .file-box {
  background:
    #111224 !important;

  border-color:
    rgba(128, 92, 255, 0.22) !important;
}


body.ce-account-v2 .file-box input {
  background:
    var(--ce-content-deep) !important;
}


body.ce-account-v2 .page #submitBtn {
  background:
    linear-gradient(
      135deg,
      #805cff,
      #418cff
    ) !important;

  color:
    #ffffff !important;

  box-shadow:
    none !important;
}


body.ce-account-v2 .link {
  color:
    #9a86ff !important;
}


body.ce-account-v2 .submitted-card {
  background:
    #111224 !important;

  border-color:
    rgba(128, 92, 255, 0.24) !important;

  color:
    #cdd2e7 !important;
}


/* =========================================================
   ORDERS
   ========================================================= */

body.ce-orders-v2 .hero p {
  color:
    var(--ce-content-muted) !important;
}


body.ce-orders-v2 .summary-card {
  background:
    var(--ce-content-panel) !important;

  border-color:
    var(--ce-content-border) !important;

  box-shadow:
    none !important;
}


body.ce-orders-v2 .summary-card small {
  color:
    var(--ce-content-muted) !important;
}


body.ce-orders-v2 .section-card {
  background:
    var(--ce-content-panel) !important;

  border-color:
    var(--ce-content-border) !important;

  box-shadow:
    none !important;
}


body.ce-orders-v2 .section-head {
  background:
    var(--ce-content-panel-2) !important;

  border-bottom-color:
    var(--ce-content-border) !important;
}


body.ce-orders-v2 .section-head p {
  color:
    var(--ce-content-muted) !important;
}


body.ce-orders-v2 .title-icon {
  color:
    #a994ff !important;

  border-color:
    rgba(128, 92, 255, 0.28) !important;

  background:
    rgba(128, 92, 255, 0.12) !important;
}


body.ce-orders-v2 .refresh-btn {
  background:
    linear-gradient(
      135deg,
      #805cff,
      #418cff
    ) !important;

  border-color:
    rgba(128, 92, 255, 0.30) !important;

  color:
    #ffffff !important;
}


body.ce-orders-v2 .order-card {
  background:
    #111224 !important;

  border-color:
    rgba(148, 163, 184, 0.12) !important;

  box-shadow:
    none !important;
}


body.ce-orders-v2 .order-card:hover {
  background:
    #18192e !important;

  border-color:
    rgba(128, 92, 255, 0.30) !important;

  box-shadow:
    none !important;
}


body.ce-orders-v2 .order-name,
body.ce-orders-v2 .value,
body.ce-orders-v2 .price {
  color:
    #f4f5ff !important;
}


body.ce-orders-v2 .order-meta,
body.ce-orders-v2 .label,
body.ce-orders-v2 .empty-state,
body.ce-orders-v2 .loading {
  color:
    var(--ce-content-muted) !important;
}


/* Total Orders */

body.ce-orders-v2
.summary-card.blue strong {
  color:
    #a994ff !important;
}


/* Pending */

body.ce-orders-v2
.summary-card.orange strong {
  color:
    #f2c766 !important;
}


/* Activated */

body.ce-orders-v2
.summary-card.green strong {
  color:
    #72e6bd !important;
}


/* =========================================================
   SERVERS
   ========================================================= */

body.ce-servers-v2 .stat-card,
body.ce-servers-v2 .panel,
body.ce-servers-v2 .notes {
  background:
    var(--ce-content-panel) !important;

  border-color:
    var(--ce-content-border) !important;

  box-shadow:
    none !important;
}


body.ce-servers-v2 .stat-label,
body.ce-servers-v2 .stat-note,
body.ce-servers-v2 .panel-subtitle,
body.ce-servers-v2 .server-subtitle,
body.ce-servers-v2 .note-text,
body.ce-servers-v2 .change-ip-note,
body.ce-servers-v2 .location-carrier {
  color:
    var(--ce-content-muted) !important;
}


/* Server main block */

body.ce-servers-v2 .server-block {
  background:
    var(--ce-content-panel-2) !important;

  border-color:
    var(--ce-content-border) !important;

  box-shadow:
    none !important;
}


body.ce-servers-v2 .server-block-head {
  background:
    #15162b !important;

  border-bottom-color:
    var(--ce-content-border) !important;
}


/* Server table wrapper */

body.ce-servers-v2
.final-server-table-wrap {
  background:
    #111224 !important;
}


/* Actual server table */

body.ce-servers-v2
.final-server-table {
  background:
    #111224 !important;
}


/* Table heading */

body.ce-servers-v2
.final-server-table thead,

body.ce-servers-v2
.final-server-table thead tr {
  background:
    #18192e !important;
}


body.ce-servers-v2
.final-server-table th {
  background:
    #18192e !important;

  color:
    #929bb8 !important;

  border-bottom-color:
    rgba(148, 163, 184, 0.12) !important;

  box-shadow:
    none !important;
}


/* Table rows */

body.ce-servers-v2
.final-server-table td {
  background:
    #111224 !important;

  color:
    #e4e8f5 !important;

  border-bottom-color:
    rgba(148, 163, 184, 0.08) !important;

  box-shadow:
    none !important;
}


/* Remove legacy special blue cells */

body.ce-servers-v2
.final-server-table
th:nth-child(5),

body.ce-servers-v2
.final-server-table
th:nth-child(6) {
  background:
    #18192e !important;
}


body.ce-servers-v2
.final-server-table
td:nth-child(5),

body.ce-servers-v2
.final-server-table
td:nth-child(6) {
  background:
    #111224 !important;
}


/* Host divider */

body.ce-servers-v2
.host-line:first-child {
  border-bottom-color:
    rgba(148, 163, 184, 0.12) !important;
}


body.ce-servers-v2 .host-line,
body.ce-servers-v2 .host-text {
  color:
    #dce1f2 !important;
}


/* Standard small action buttons */

body.ce-servers-v2 .mini-btn,
body.ce-servers-v2 .server-action-link,
body.ce-servers-v2 .server-action-btn,
body.ce-servers-v2 .change-location-btn {
  border-color:
    rgba(128, 92, 255, 0.26) !important;

  background:
    rgba(128, 92, 255, 0.10) !important;

  color:
    #b7a9ff !important;

  box-shadow:
    none !important;
}


body.ce-servers-v2 .mini-btn:hover,
body.ce-servers-v2 .server-action-link:hover,
body.ce-servers-v2 .server-action-btn:hover,
body.ce-servers-v2 .change-location-btn:hover {
  border-color:
    rgba(128, 92, 255, 0.42) !important;

  background:
    rgba(128, 92, 255, 0.18) !important;

  color:
    #ffffff !important;
}


/* Location button */

body.ce-servers-v2 .location-main-btn {
  background:
    linear-gradient(
      135deg,
      rgba(128, 92, 255, 0.28),
      rgba(65, 140, 255, 0.20)
    ) !important;

  border-color:
    rgba(128, 92, 255, 0.34) !important;

  color:
    #ffffff !important;
}


body.ce-servers-v2
.location-main-btn::before {
  border-color:
    #9a86ff !important;
}


body.ce-servers-v2
.location-main-btn::after {
  background:
    #ddd7ff !important;
}


body.ce-servers-v2
.location-change-hint {
  color:
    #9a86ff !important;
}


/* Change IP action */

body.ce-servers-v2 .change-ip-btn {
  background:
    linear-gradient(
      135deg,
      #805cff,
      #418cff
    ) !important;

  border-color:
    rgba(128, 92, 255, 0.30) !important;

  color:
    #ffffff !important;

  box-shadow:
    none !important;
}


body.ce-servers-v2 .change-ip-btn:hover {
  filter:
    brightness(1.07);

  border-color:
    rgba(128, 92, 255, 0.45) !important;
}


/* Connection notes */

body.ce-servers-v2 .note-card {
  background:
    #111224 !important;

  border-color:
    var(--ce-content-border) !important;
}


/* Empty / loading server state */

body.ce-servers-v2 .state {
  background:
    rgba(128, 92, 255, 0.05) !important;

  border-color:
    rgba(128, 92, 255, 0.22) !important;

  color:
    var(--ce-content-muted) !important;
}


/* Change IP modal */

body.ce-servers-v2
.change-ip-modal-mask {
  background:
    rgba(3, 4, 12, 0.84) !important;
}


body.ce-servers-v2
.change-ip-modal {
  background:
    #16162a !important;

  border-color:
    rgba(148, 163, 184, 0.16) !important;

  box-shadow:
    0 28px 90px
    rgba(0, 0, 0, 0.46) !important;
}


body.ce-servers-v2
.change-ip-modal p {
  color:
    var(--ce-content-muted) !important;
}


body.ce-servers-v2
.change-ip-modal-icon {
  color:
    #b7a9ff !important;

  background:
    rgba(128, 92, 255, 0.12) !important;

  border-color:
    rgba(128, 92, 255, 0.26) !important;
}

/* =========================================================
   Dashboard V2 Sidebar - Final Original Style
   Overview / Support / Settings reference
   ========================================================= */


/* Normal buttons:
   completely transparent */

.ce-v2-nav a {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  color: #aeb8d1 !important;
}


/* Hover:
   do not add light-purple background */

.ce-v2-nav a:hover:not(.active) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  color: #ffffff !important;
}


/* Current page:
   original dark-purple selected state */

.ce-v2-nav a.active,
.ce-v2-nav a.active:hover {
  background:
    rgba(128, 100, 255, 0.22) !important;

  border: 0 !important;

  color: #ffffff !important;

  box-shadow:
    inset 3px 0 0 #8064ff !important;
}


/* Icons */

.ce-v2-icon {
  color: #9582ff !important;
}

.ce-v2-nav a.active .ce-v2-icon {
  color: #9582ff !important;
}
/* =========================================================
   CloudEdgeUS Dashboard V2
   Overview Content Layout V1
   RIGHT CONTENT ONLY
   Sidebar is frozen and must not be modified
   ========================================================= */


/* Wider Overview workspace */

body.ce-overview-v2 .page-shell {
  width: calc(100% - 80px) !important;
  max-width: 1560px !important;
  margin: 0 auto !important;
}


/* =========================================================
   Overview top header
   ========================================================= */

body.ce-overview-v2 .ce-v2-overview-hero {
  padding:
    44px 0 18px !important;
}


body.ce-overview-v2 .ce-v2-overview-head {
  margin-bottom:
    8px !important;
}


body.ce-overview-v2 .ce-v2-kicker {
  margin-bottom:
    10px !important;

  font-size:
    11px !important;

  letter-spacing:
    0.17em !important;
}


body.ce-overview-v2
.ce-v2-overview-head h1 {
  font-size:
    40px !important;

  line-height:
    1.08 !important;

  letter-spacing:
    -0.8px !important;
}


body.ce-overview-v2
.ce-v2-overview-head #userInfo {
  margin-top:
    9px !important;

  font-size:
    14px !important;
}


/* Secure Session slightly larger */

body.ce-overview-v2 .ce-v2-session {
  min-height:
    38px !important;

  padding:
    0 15px !important;

  font-size:
    13px !important;
}


/* =========================================================
   Service Plans section
   Reduce empty vertical space
   ========================================================= */

body.ce-overview-v2 .ce-v2-pricing {
  margin-top:
    0 !important;

  padding:
    20px 18px 48px !important;
}


body.ce-overview-v2
.ce-v2-pricing-head {
  margin-bottom:
    42px !important;
}


body.ce-overview-v2
.ce-v2-pricing-kicker {
  margin-bottom:
    12px !important;

  font-size:
    11px !important;

  letter-spacing:
    0.18em !important;
}


body.ce-overview-v2
.ce-v2-pricing-head h2 {
  font-size:
    44px !important;

  line-height:
    1.1 !important;
}


body.ce-overview-v2
.ce-v2-pricing-head p {
  max-width:
    720px !important;

  margin-top:
    16px !important;

  font-size:
    15px !important;

  line-height:
    1.6 !important;
}


/* =========================================================
   Pricing cards
   Wider, fuller desktop composition
   ========================================================= */

body.ce-overview-v2
.ce-v2-pricing-grid {
  width:
    100% !important;

  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;

  gap:
    26px !important;
}


body.ce-overview-v2
.ce-v2-price-card {
  min-height:
    500px !important;

  padding:
    30px 30px 28px !important;
}


/* Plan label */

body.ce-overview-v2
.ce-v2-plan-name {
  font-size:
    13px !important;

  letter-spacing:
    0.09em !important;
}


/* Main price */

body.ce-overview-v2
.ce-v2-price {
  margin-top:
    8px !important;

  font-size:
    54px !important;
}


body.ce-overview-v2
.ce-v2-price sup {
  font-size:
    21px !important;
}


/* Price note */

body.ce-overview-v2
.ce-v2-price-note {
  margin-top:
    11px !important;

  font-size:
    13px !important;
}


/* Description */

body.ce-overview-v2
.ce-v2-plan-description {
  min-height:
    60px !important;

  margin-top:
    22px !important;

  font-size:
    15px !important;

  line-height:
    1.6 !important;
}


/* Feature list */

body.ce-overview-v2
.ce-v2-plan-features {
  gap:
    14px !important;

  font-size:
    14px !important;
}


/* Request Access */

body.ce-overview-v2
.ce-v2-request-btn {
  min-height:
    48px !important;

  font-size:
    15px !important;
}


/* Best Value */

body.ce-overview-v2
.ce-v2-best-value {
  padding:
    8px 18px !important;

  font-size:
    11px !important;
}


/* =========================================================
   Responsive safety
   ========================================================= */

@media (max-width: 1350px) {

  body.ce-overview-v2 .page-shell {
    width:
      calc(100% - 56px) !important;
  }

}


@media (max-width: 1100px) {

  body.ce-overview-v2
  .ce-v2-pricing-grid {
    grid-template-columns:
      1fr !important;
  }

}
/* =========================================================
   Overview - Hide browser scrollbar
   Keep mouse wheel scrolling available
   ========================================================= */

/* =========================================================
   Overview - Disable page scrolling
   Overview only / Sidebar untouched
   ========================================================= */

/* =========================================================
   Overview - Service Plans Typography Final Tuning
   RIGHT CONTENT ONLY
   ========================================================= */


/* SERVICE PLANS */

body.ce-overview-v2
.ce-v2-pricing-kicker {
  font-size: 13px !important;
  letter-spacing: 0.19em !important;
}


/* Choose your access plan */

body.ce-overview-v2
.ce-v2-pricing-head h2 {
  font-size: 50px !important;
  line-height: 1.08 !important;
  letter-spacing: -0.8px !important;
}


/* Activation description */

body.ce-overview-v2
.ce-v2-pricing-head p {
  font-size: 16px !important;
  line-height: 1.6 !important;
}
/* =========================================================
   Overview - Stronger Pricing Heading
   RIGHT CONTENT ONLY
   ========================================================= */

/* SERVICE PLANS */
body.ce-overview-v2
.ce-v2-pricing-kicker {
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: 0.20em !important;
  margin-bottom: 16px !important;
}


/* Choose your access plan */
body.ce-overview-v2
.ce-v2-pricing-head h2 {
  font-size: 60px !important;
  line-height: 1.03 !important;
  letter-spacing: -1.4px !important;
  font-weight: 900 !important;
}
/* ===== Overview Pricing Position Final ===== */
body.ce-overview-v2 .ce-v2-pricing {
  transform: translateY(-42px) !important;
}
/* =========================================================
   Account Status - Flat Desktop Layout V1
   Account page only / Sidebar untouched
   ========================================================= */

body.ce-account-v2 .page {
  width: calc(100% - 72px) !important;
  max-width: 1380px !important;
  margin: 18px auto 28px !important;
  padding: 0 !important;
}

body.ce-account-v2 .page > h1 {
  margin-bottom: 8px !important;
  font-size: 40px !important;
  line-height: 1.05 !important;
}

body.ce-account-v2 .subtitle {
  margin-bottom: 18px !important;
  line-height: 1.45 !important;
}

body.ce-account-v2 .panel-head {
  padding: 20px 26px !important;
  align-items: center !important;
}

body.ce-account-v2 .panel-head h2 {
  margin-bottom: 5px !important;
}

body.ce-account-v2 .panel-head p {
  line-height: 1.4 !important;
}

body.ce-account-v2 .content {
  padding: 20px 26px 22px !important;
}

body.ce-account-v2 .notice {
  margin-bottom: 16px !important;
  padding: 12px 16px !important;
  line-height: 1.4 !important;
}


/* 12-column flat form */
body.ce-account-v2 .grid {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 12px 14px !important;
}


/* First 4 fields = one row */
body.ce-account-v2 .grid > .field:nth-child(1),
body.ce-account-v2 .grid > .field:nth-child(2),
body.ce-account-v2 .grid > .field:nth-child(3),
body.ce-account-v2 .grid > .field:nth-child(4) {
  grid-column: span 3 !important;
}


/* Intended Use + Target Platforms = one row */
body.ce-account-v2 .grid > .field:nth-child(5),
body.ce-account-v2 .grid > .field:nth-child(6) {
  grid-column: span 6 !important;
}


/* Monthly Usage + 3 upload areas = one row */
body.ce-account-v2 .grid > .field:nth-child(7),
body.ce-account-v2 .grid > .field:nth-child(8),
body.ce-account-v2 .grid > .field:nth-child(9),
body.ce-account-v2 .grid > .field:nth-child(10) {
  grid-column: span 3 !important;
}


/* Compact controls */
body.ce-account-v2 label {
  margin-bottom: 6px !important;
  font-size: 12px !important;
}

body.ce-account-v2 input,
body.ce-account-v2 select {
  padding: 10px 12px !important;
  font-size: 13px !important;
}

body.ce-account-v2 textarea {
  min-height: 72px !important;
  height: 72px !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  resize: none !important;
}


/* Upload cards */
body.ce-account-v2 .file-box {
  padding: 10px 12px !important;
}

body.ce-account-v2 .file-box input {
  padding: 8px !important;
}

body.ce-account-v2 .hint {
  margin-top: 5px !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
}


/* Bottom actions */
body.ce-account-v2 .actions {
  margin-top: 16px !important;
}

body.ce-account-v2 .actions button {
  min-width: 210px !important;
  padding: 11px 20px !important;
  font-size: 14px !important;
}
/* =========================================================
   Account Status - Final Width + Scrollbar
   Account page only / Sidebar untouched
   ========================================================= */

/* Use more of the available right-side workspace */
body.ce-account-v2 .page-shell {
  width: calc(100% - 48px) !important;
  max-width: 1560px !important;
  margin: 0 auto !important;
}

/* Let the Account page fill its parent */
body.ce-account-v2 .page {
  width: 100% !important;
  max-width: none !important;
  margin: 18px auto 28px !important;
  padding: 0 !important;
}

/* Hide the browser scrollbar but keep wheel scrolling */
html.ce-account-html,
body.ce-account-v2 {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html.ce-account-html::-webkit-scrollbar,
body.ce-account-v2::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
/* =========================================================
   Account Status - Full Height Layout V3
   Account page only / Sidebar untouched
   ========================================================= */

/* Main workspace */
body.ce-account-v2 .page-shell {
  width: calc(100% - 24px) !important;
  max-width: none !important;
  margin: 0 auto !important;
}

body.ce-account-v2 .page {
  width: 100% !important;
  max-width: none !important;
  margin: 18px auto 20px !important;
  padding: 0 18px !important;
}


/* ===== Center page heading ===== */

body.ce-account-v2 .page > h1 {
  width: 100% !important;
  margin: 0 0 8px !important;

  text-align: center !important;

  font-size: 48px !important;
  line-height: 1.05 !important;
  letter-spacing: 7px !important;
  font-weight: 900 !important;
}

body.ce-account-v2 .page > .subtitle {
  width: 100% !important;
  max-width: 900px !important;

  margin: 0 auto 22px !important;

  text-align: center !important;

  font-size: 16px !important;
  line-height: 1.5 !important;
}


/* ===== Pull main panel downward ===== */

body.ce-account-v2 .panel {
  width: 100% !important;

  min-height: 690px !important;

  display: flex !important;
  flex-direction: column !important;
}


/* Panel heading */
body.ce-account-v2 .panel-head {
  padding: 22px 28px !important;
  align-items: center !important;
}

body.ce-account-v2 .panel-head h2 {
  margin-bottom: 6px !important;
  font-size: 28px !important;
}


/* Main content fills remaining panel height */
body.ce-account-v2 .content {
  flex: 1 !important;

  display: flex !important;
  flex-direction: column !important;

  padding: 20px 28px 26px !important;
}


/* Top notice */
body.ce-account-v2 .notice {
  margin-bottom: 18px !important;
}


/* Form fills remaining area */
body.ce-account-v2 #kycForm {
  flex: 1 !important;

  display: flex !important;
  flex-direction: column !important;
}


/* Spread the three form rows vertically */
body.ce-account-v2 .grid {
  flex: 1 !important;

  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;

  column-gap: 16px !important;
  row-gap: 18px !important;

  align-content: space-between !important;
}


/* First row */
body.ce-account-v2 .grid > .field:nth-child(1),
body.ce-account-v2 .grid > .field:nth-child(2),
body.ce-account-v2 .grid > .field:nth-child(3),
body.ce-account-v2 .grid > .field:nth-child(4) {
  grid-column: span 3 !important;
}


/* Second row */
body.ce-account-v2 .grid > .field:nth-child(5),
body.ce-account-v2 .grid > .field:nth-child(6) {
  grid-column: span 6 !important;
}


/* Third row */
body.ce-account-v2 .grid > .field:nth-child(7),
body.ce-account-v2 .grid > .field:nth-child(8),
body.ce-account-v2 .grid > .field:nth-child(9),
body.ce-account-v2 .grid > .field:nth-child(10) {
  grid-column: span 3 !important;
}


/* Controls */
body.ce-account-v2 input,
body.ce-account-v2 select {
  min-height: 40px !important;
}

body.ce-account-v2 textarea {
  height: 92px !important;
  min-height: 92px !important;
  resize: none !important;
}


/* Upload areas */
body.ce-account-v2 .file-box {
  min-height: 112px !important;
  padding: 12px !important;
}


/* Buttons stay near bottom of expanded panel */
body.ce-account-v2 .actions {
  margin-top: 22px !important;
  padding-top: 4px !important;
}

body.ce-account-v2 .actions button {
  min-width: 230px !important;
  min-height: 44px !important;
}
/* =========================================================
   Orders - Match Account Status Width
   Orders page only / Sidebar untouched
   ========================================================= */

body.ce-orders-v2 .page-shell {
  width: calc(100% - 24px) !important;
  max-width: none !important;

  margin: 0 auto !important;

  padding-left: 18px !important;
  padding-right: 18px !important;
}
/* =========================================================
   Servers - Wide One Screen Layout V1
   Servers page only / Sidebar untouched
   ========================================================= */

body.ce-servers-v2 .shell {
  width: calc(100% - 24px) !important;
  max-width: none !important;

  margin: 0 auto !important;

  padding-left: 18px !important;
  padding-right: 18px !important;
}
/* Move Servers content upward and compact vertical spacing */

body.ce-servers-v2 .shell {
  padding-top: 12px !important;
  padding-bottom: 18px !important;
}

body.ce-servers-v2 .hero {
  margin-top: 10px !important;
}

body.ce-servers-v2 .stats {
  margin-top: 14px !important;
}

body.ce-servers-v2 .panel {
  margin-top: 14px !important;
}

body.ce-servers-v2 .notes {
  margin-top: 14px !important;
}
/* Compact cards so current 1-server view fits one screen */

body.ce-servers-v2 .stat-card {
  min-height: 92px !important;
  padding: 14px 16px !important;
}

body.ce-servers-v2 .stat-value {
  margin-top: 10px !important;
}

body.ce-servers-v2 .panel {
  padding: 16px 18px !important;
}

body.ce-servers-v2 .panel-subtitle {
  margin-bottom: 12px !important;
}

body.ce-servers-v2 .server-block {
  margin-top: 12px !important;
}

body.ce-servers-v2 .server-block-head {
  padding: 14px 16px 12px !important;
}

body.ce-servers-v2 .notes {
  padding: 16px 18px !important;
}

body.ce-servers-v2 .note-grid {
  margin-top: 10px !important;
}

body.ce-servers-v2 .note-card {
  padding: 12px 14px !important;
}

/* =========================================================
   Dark Mode Toggle Interactive Fix
   ========================================================= */

.ce-toggle {
  cursor: pointer !important;
}

.ce-toggle span {
  cursor: pointer !important;
  transition:
    background 0.20s ease,
    border-color 0.20s ease !important;
}

.ce-toggle span::before {
  transition:
    left 0.20s ease,
    right 0.20s ease,
    transform 0.20s ease !important;
}

/* Dark Mode ON */
.ce-toggle input:checked + span {
  background:
    linear-gradient(
      135deg,
      #805cff,
      #418cff
    ) !important;
}

.ce-toggle input:checked + span::before {
  left: auto !important;
  right: 3px !important;
}

/* Dark Mode OFF */
.ce-toggle input:not(:checked) + span {
  background: #d9deec !important;
}

.ce-toggle input:not(:checked) + span::before {
  left: 3px !important;
  right: auto !important;
}