/**
 * Phase 2 — Shell skin (Hexa9 / hosting506 light default)
 * Sandwich: full-width topbar | sidebar + content | footer as-is.
 * Logo lives in sidebar; topbar left = search palette (shell demo).
 * Scoped to body:not(.minimal). Auth pages (login / 2FA / pwreset) must use
 * hexa_minimal — if shell CSS still loads, skip geometry below.
 */
body:not(.minimal) {
  --shell-sidebar-w: 236px;
  --shell-mini-w: 78px;
  --shell-topbar-h: 72px;
  --shell-content-max: 1460px;
  --shell-rail-ms: 0.32s;
  --shell-rail-ease: cubic-bezier(0.4, 0, 0.2, 1);
  /* Light sidebar — mockup Sidebar.dc.html / MyXeed left-nav identity */
  --shell-sidebar-bg: #ffffff;
  --shell-sidebar-fg: #41526a;
  --shell-sidebar-fg-muted: #9aa8ba;
  --shell-sidebar-hover: #f4f7fa;
  --shell-sidebar-active: #eef4fb;
  --shell-sidebar-border: #e6ebf1;
  --shell-sidebar-rail: #e6ebf1;
  --shell-topbar-bg: #ffffff;
  --shell-topbar-border: #e6ebf1;
  --shell-accent: #1f5fa8;
  --shell-accent-deep: #143d6d;
  --shell-page-bg: #f4f6f9;
  --shell-ink: #111a24;
  --shell-muted: #8d9aab;
  background-color: var(--shell-page-bg);
}

/* Auth / guest forms: never apply sidebar chrome (defense if minimal missed) */
body.whmcs-login:not(.minimal),
body.whmcs-logintwofa:not(.minimal),
body.whmcs-two-factor-challenge:not(.minimal),
body[class*="whmcs-password-reset"]:not(.minimal) {
  padding-top: 0 !important;
  background-color: transparent;
}
body.whmcs-login:not(.minimal) .site-holder,
body.whmcs-logintwofa:not(.minimal) .site-holder,
body.whmcs-two-factor-challenge:not(.minimal) .site-holder,
body[class*="whmcs-password-reset"]:not(.minimal) .site-holder {
  padding-left: 0 !important;
}
body.whmcs-login:not(.minimal) .left-sidebar,
body.whmcs-logintwofa:not(.minimal) .left-sidebar,
body.whmcs-two-factor-challenge:not(.minimal) .left-sidebar,
body[class*="whmcs-password-reset"]:not(.minimal) .left-sidebar,
body.whmcs-login:not(.minimal) nav.hx-top-header,
body.whmcs-logintwofa:not(.minimal) nav.hx-top-header,
body.whmcs-two-factor-challenge:not(.minimal) nav.hx-top-header,
body[class*="whmcs-password-reset"]:not(.minimal) nav.hx-top-header {
  display: none !important;
}

/* Room for fixed topbar (out of flow) */
@media (min-width: 768px) {
  body:not(.minimal) {
    padding-top: var(--shell-topbar-h) !important;
  }
}

/* ── Fixed chrome: topbar + sidebar (page scroll only moves content) ── */
@media (min-width: 768px) {
  body:not(.minimal) .site-holder {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 0 var(--shell-sidebar-w) !important;
    box-sizing: border-box;
    /* Sync center resize with left/right rail collapse */
    transition:
      padding-left var(--shell-rail-ms) var(--shell-rail-ease),
      padding-right var(--shell-rail-ms) var(--shell-rail-ease);
  }

  body:not(.minimal) .site-holder > .md\:grid,
  body:not(.minimal) .site-holder > div.md\:grid {
    display: block !important;
    grid-template-columns: none !important;
  }

  body:not(.minimal) .left-sidebar {
    position: fixed !important;
    top: var(--shell-topbar-h) !important;
    left: 0 !important;
    bottom: 0 !important;
    z-index: 40;
    width: var(--shell-sidebar-w) !important;
    max-width: var(--shell-sidebar-w) !important;
    min-width: var(--shell-sidebar-w) !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-right: 1px solid var(--shell-sidebar-border) !important;
    background-color: var(--shell-sidebar-bg) !important;
    /* visible so collapse pill can sit on the rail; scroll lives on .sidebar-holder */
    overflow: visible !important;
    transition:
      width var(--shell-rail-ms) var(--shell-rail-ease),
      min-width var(--shell-rail-ms) var(--shell-rail-ease),
      max-width var(--shell-rail-ms) var(--shell-rail-ease);
  }

  body:not(.minimal) .left-sidebar .sidebar-holder {
    height: 100%;
    max-height: 100%;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #b7c6d8 transparent;
  }

  html.dark body:not(.minimal) .left-sidebar .sidebar-holder {
    scrollbar-color: #3a4454 transparent;
  }

  body:not(.minimal) .hexa-content.main-content,
  body:not(.minimal) .hexa-content {
    width: 100% !important;
    max-width: none;
    margin: 0 !important;
    padding: 24px 32px 32px !important;
    box-sizing: border-box;
    background: transparent;
    border-radius: 0;
  }

  body:not(.minimal) .hexa-content > .container,
  body:not(.minimal) .hexa-content .container {
    width: 100% !important;
    max-width: var(--shell-content-max) !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Mini-sidebar */
  body:not(.minimal) .site-holder.mini-sidebar {
    padding-left: var(--shell-mini-w) !important;
  }

  body:not(.minimal) .site-holder.mini-sidebar .left-sidebar {
    width: var(--shell-mini-w) !important;
    max-width: var(--shell-mini-w) !important;
    min-width: var(--shell-mini-w) !important;
  }

  body:not(.minimal) .box-holder .content {
    margin-left: 0 !important;
  }
}

@media (min-width: 768px) and (prefers-reduced-motion: reduce) {
  body:not(.minimal) .site-holder,
  body:not(.minimal) .left-sidebar,
  body:not(.minimal) .sub-footer,
  body.hx-has-rightbar:not(.minimal) .hx-right-rail {
    transition: none !important;
  }
}

@media (max-width: 767px) {
  body:not(.minimal) .hexa-content.main-content,
  body:not(.minimal) .hexa-content {
    margin-left: 0 !important;
    padding: 16px 16px 40px !important;
  }
}

/* ── Topbar FIXED full-width ── */
body:not(.minimal) nav.hx-top-header,
body:not(.minimal) .hx-top-header {
  box-sizing: border-box;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: var(--shell-topbar-h) !important;
  min-height: var(--shell-topbar-h) !important;
  max-height: var(--shell-topbar-h);
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  background-color: var(--shell-topbar-bg) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--shell-topbar-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  z-index: 100;
  display: flex !important;
  align-items: center !important;
}

body:not(.minimal) .hx-top-header > .flex,
body:not(.minimal) .hx-top-header > .max-w-screen-2xl,
body:not(.minimal) .hx-top-header > .shell-topbar-inner,
body:not(.minimal) .hx-top-header > div {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 16px 0 0 !important;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  box-sizing: border-box;
}

/* Logo + search on the left */
body:not(.minimal) .shell-topbar-left {
  display: flex;
  align-items: center;
  gap: 0;
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
}

/* Logo column ≈ sidebar width so it sits “above” the nav rail */
body:not(.minimal) .shell-topbar-logo {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex: 0 0 var(--shell-sidebar-w);
  width: var(--shell-sidebar-w);
  max-width: var(--shell-sidebar-w);
  height: 100%;
  text-decoration: none !important;
  margin: 0 !important;
  padding: 0 16px 0 18px !important;
  box-sizing: border-box;
  border-radius: 8px;
  outline: none;
  overflow: visible;
  /* Kill UA black focus box on click; branded ring only for keyboard */
  -webkit-tap-highlight-color: transparent;
}

body:not(.minimal) .shell-topbar-logo:focus {
  outline: none;
}

body:not(.minimal) .shell-topbar-logo:focus-visible {
  outline: 2px solid var(--shell-accent);
  outline-offset: 2px;
  box-shadow: var(--hx-focus, 0 0 0 3px rgba(33, 58, 84, 0.14));
}

body:not(.minimal) .shell-topbar-logo:hover .hx-logo-svg {
  opacity: 0.9;
}

body:not(.minimal) .shell-topbar-logo .hx-logo-svg {
  display: block;
  height: 48px !important;
  width: auto !important;
  max-width: 200px;
  transition: opacity 150ms ease;
}

/* Dark/light fills live in hx-logo-anim.css tokens — no PNG invert */

/* Search palette trigger — opens command palette (logged-in) */
body:not(.minimal) .shell-top-search {
  display: flex;
  align-items: center;
  gap: 9px;
  flex: 0 1 360px;
  width: 360px;
  max-width: min(360px, 42vw);
  height: 40px;
  background: #f2f4f7;
  border-radius: 8px;
  padding: 0 12px 0 14px;
  margin: 0 0 0 28px !important;
  border: 0;
  color: var(--shell-muted);
  box-sizing: border-box;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

body:not(.minimal) .shell-top-search:hover {
  background: #ebeef2;
}

body:not(.minimal) .shell-top-search:focus-visible {
  outline: 2px solid var(--shell-accent);
  outline-offset: 2px;
}

body:not(.minimal) .shell-top-search svg {
  flex: 0 0 15px;
  color: var(--shell-muted);
  stroke: var(--shell-muted);
}

body:not(.minimal) .shell-top-search-placeholder {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 13.5px;
  color: var(--shell-muted);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body:not(.minimal) .shell-top-search-kbd {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 600;
  color: var(--shell-muted);
  border: 1px solid var(--shell-sidebar-border);
  border-radius: 5px;
  padding: 2px 5px;
  background: #fff;
  line-height: 1.2;
}

/* Dark: search trigger sits on navy topbar — use elevated surface, not flashbang white */
html.dark body:not(.minimal) .shell-top-search {
  background: rgba(255, 255, 255, 0.06);
  color: var(--shell-muted);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

html.dark body:not(.minimal) .shell-top-search:hover {
  background: rgba(255, 255, 255, 0.1);
}

html.dark body:not(.minimal) .shell-top-search:focus-visible {
  outline-color: var(--shell-accent);
  box-shadow:
    inset 0 0 0 1px rgba(77, 154, 224, 0.35),
    0 0 0 3px rgba(77, 154, 224, 0.18);
}

html.dark body:not(.minimal) .shell-top-search-kbd {
  background: rgba(15, 26, 43, 0.55);
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--shell-muted);
}

body:not(.minimal) .hx-top-header .navbar-nav,
body:not(.minimal) .hx-top-header .hx-user-nav,
body:not(.minimal) .hx-top-header .hx-icons-nav {
  display: flex;
  align-items: center;
  margin: 0 !important;
  height: 100%;
  float: none !important;
  gap: 0;
}

/* Empty / mobile-only top nav must not steal space between search and account */
@media (min-width: 768px) {
  body:not(.minimal) .hx-top-header .hx-top-nav > .visible-xs {
    display: none !important;
  }
}

/* Pin account + icons as one right cluster */
body:not(.minimal) .hx-top-header .hx-user-nav {
  margin-left: auto !important;
  margin-right: 0 !important;
  padding-right: 4px !important;
  gap: 0;
}

body:not(.minimal) .hx-top-header .hx-icons-nav {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-right: 4px !important;
  gap: 0;
}

body:not(.minimal) .hx-top-header .navbar-nav > .nav-item > .nav-link,
body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link,
body:not(.minimal) .hx-top-header .hx-user-nav > .nav-item > a.dropdown-toggle,
body:not(.minimal) .hx-top-header .hx-user-nav > li > a.dropdown-toggle {
  line-height: 1;
  height: var(--shell-topbar-h);
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 8px !important;
  color: #68788c !important;
  float: none !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link {
  padding: 0 9px !important;
  position: relative;
}

/* ── Topbar alert badges + soft ── */
body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link .hx-top-badge,
body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link .cart-items {
  position: absolute;
  top: 10px;
  right: 2px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #1f5fa8;
  color: #fff !important;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  box-shadow: 0 0 0 2px #fff;
  pointer-events: none;
}

body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link .hx-top-badge--warn {
  background: #c47a1a;
}

body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link.hx-top-alert {
  color: #3d4f66 !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link.hx-top-alert--mail svg,
body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link.hx-top-alert--cart svg {
  animation: hx-top-glow-pulse-blue 2.2s ease-in-out infinite;
}

body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link.hx-top-alert--notify svg {
  animation: hx-top-glow-pulse-amber 2.2s ease-in-out infinite;
}

@keyframes hx-top-glow-pulse-blue {
  0%,
  100% {
    filter: drop-shadow(0 0 1px rgba(31, 95, 168, 0.25));
    opacity: 1;
  }
  50% {
    filter: drop-shadow(0 0 7px rgba(31, 95, 168, 0.7));
    opacity: 1;
  }
}

@keyframes hx-top-glow-pulse-amber {
  0%,
  100% {
    filter: drop-shadow(0 0 1px rgba(196, 122, 26, 0.3));
    opacity: 1;
  }
  50% {
    filter: drop-shadow(0 0 7px rgba(196, 122, 26, 0.75));
    opacity: 1;
  }
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link .hx-top-badge,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link .cart-items {
  box-shadow: 0 0 0 2px #1c212b;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link.hx-top-alert {
  color: #c5ced8 !important;
}

@media (prefers-reduced-motion: reduce) {
  body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link.hx-top-alert svg {
    animation: none !important;
    filter: none !important;
  }
}

/* Hide legacy Hexa green dot if any leftover markup */
body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item > .nav-link .indicator {
  display: none !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications {
  height: var(--shell-topbar-h);
}

body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item,
body:not(.minimal) .hx-top-header .hx-user-nav > .nav-item,
body:not(.minimal) .hx-top-header .hx-user-nav > li {
  float: none !important;
  display: flex;
  align-items: center;
  height: 100%;
  position: relative;
}

body:not(.minimal) .hx-top-header .gravatar,
body:not(.minimal) .hx-top-header img.rounded-full {
  width: 34px !important;
  height: 34px !important;
}

/* ── Light sidebar nav ── */
body:not(.minimal) .left-sidebar,
body:not(.minimal) .left-sidebar .sidebar-holder,
body:not(.minimal) .sidebar-holder .nav,
body:not(.minimal) .sidebar-holder .nav-list {
  background-color: var(--shell-sidebar-bg) !important;
  background: var(--shell-sidebar-bg) !important;
}

body:not(.minimal) .sidebar-holder {
  padding: 8px 0 40px;
  min-height: 100%;
  border: 0 !important;
}

/* Kill Hexa core.min blue strip on collapse toggle (#0B3B61) — legacy li hidden */
body:not(.minimal) .sidebar-holder .nav li.nav-toggle,
body:not(.minimal) .sidebar-holder .nav > li.nav-toggle,
body:not(.minimal) .left-sidebar .nav li.nav-toggle {
  display: none !important;
}

/* Collapse pill on sidebar rail (mockup Sidebar.dc.html) */
body:not(.minimal) .shell-sidebar-collapse {
  position: absolute;
  top: 22px;
  right: -13px;
  z-index: 50;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--shell-sidebar-bg) !important;
  box-shadow: 0 1px 4px rgba(16, 26, 40, 0.14);
  color: var(--shell-sidebar-fg-muted) !important;
  cursor: pointer;
  outline: none !important;
  transition: color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
body:not(.minimal) .shell-sidebar-collapse:hover,
body:not(.minimal) .shell-sidebar-collapse:focus {
  color: var(--shell-accent) !important;
  box-shadow: 0 2px 8px rgba(16, 26, 40, 0.18);
}
body:not(.minimal) .shell-sidebar-collapse svg {
  display: block;
  width: 13px;
  height: 13px;
  stroke: currentColor;
  transition: transform 0.22s ease;
}
body:not(.minimal) .site-holder.mini-sidebar .shell-sidebar-collapse svg {
  transform: rotate(180deg);
}
html.dark body:not(.minimal) .shell-sidebar-collapse {
  background: var(--shell-sidebar-bg) !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
  color: var(--shell-sidebar-fg-muted) !important;
}
html.dark body:not(.minimal) .shell-sidebar-collapse:hover,
html.dark body:not(.minimal) .shell-sidebar-collapse:focus {
  color: #93c5fd !important;
  box-shadow: 0 0 0 1px rgba(147, 197, 253, 0.35);
}
@media (max-width: 767px) {
  body:not(.minimal) .shell-sidebar-collapse {
    display: none !important;
  }
}

body:not(.minimal) .sidebar-holder .nav-toggle button,
body:not(.minimal) .sidebar-holder .nav-toggle .btn-nav-toggle,
body:not(.minimal) .sidebar-holder .nav li.nav-toggle .btn-nav-toggle,
body:not(.minimal) .sidebar-holder .nav li.nav-toggle button {
  color: var(--shell-sidebar-fg-muted) !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

body:not(.minimal) .sidebar-holder .nav-toggle svg,
body:not(.minimal) .sidebar-holder .nav-toggle .feather-chevron,
body:not(.minimal) .sidebar-holder .nav li.nav-toggle svg {
  color: var(--shell-sidebar-fg-muted) !important;
  stroke: var(--shell-sidebar-fg-muted) !important;
}

body:not(.minimal) .sidebar-holder .nav li.list-subheading,
body:not(.minimal) .sidebar-holder.sidebar-layout-sections .nav li.list-subheading,
body:not(.minimal) .sidebar-holder.sidebar-layout-hybrid .nav li.list-subheading,
body:not(.minimal) .sidebar-holder.sidebar-layout-grouped .nav li.list-subheading {
  color: var(--shell-sidebar-fg-muted) !important;
  border: 0 !important;
  border-bottom: 0 !important;
  padding: 16px 20px 7px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  background: transparent !important;
}

body:not(.minimal) .sidebar-holder .nav li.list-subheading span {
  color: inherit;
}

body:not(.minimal) .sidebar-holder .nav > li:not(.nav-toggle):not(.list-subheading) > a {
  position: relative;
  color: var(--shell-sidebar-fg) !important;
  border-radius: 10px;
  margin: 2px 12px;
  padding: 10px 12px !important;
  font-size: 13.5px;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 11px;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.16s ease, color 0.16s ease;
}

/* Kill ugly black browser/focus ring on click */
body:not(.minimal) .sidebar-holder .nav > li > a:focus,
body:not(.minimal) .sidebar-holder .nav > li > a:active,
body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li > a:focus,
body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li > a:active {
  outline: none !important;
  box-shadow: none !important;
  border-color: transparent !important;
}

body:not(.minimal) .sidebar-holder .nav > li > a:focus-visible,
body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li > a:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--shell-accent) 45%, transparent) !important;
  outline-offset: 1px !important;
}

body:not(.minimal) .sidebar-holder .nav > li:not(.nav-toggle):not(.list-subheading) > a:hover {
  background: var(--shell-sidebar-hover) !important;
  color: var(--shell-ink) !important;
}

/* Active leaf + parent holding current section */
body:not(.minimal) .sidebar-holder .nav > li.active > a,
body:not(.minimal) .sidebar-holder .nav > li.open > a,
body:not(.minimal) .sidebar-holder .nav > li.hx-nav-open > a,
body:not(.minimal) .sidebar-holder .nav > li > a.active-parent,
body:not(.minimal) .sidebar-holder .nav > li > a.font-semibold {
  background: var(--shell-sidebar-active) !important;
  color: var(--shell-accent) !important;
  font-weight: 600 !important;
}

/* Accent bar (mockup left rail) */
body:not(.minimal) .sidebar-holder .nav > li.active > a::before,
body:not(.minimal) .sidebar-holder .nav > li.open > a::before,
body:not(.minimal) .sidebar-holder .nav > li.hx-nav-open > a::before,
body:not(.minimal) .sidebar-holder .nav > li > a.active-parent::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 22px;
  border-radius: 0 3px 3px 0;
  background: var(--shell-accent);
  opacity: 1;
  pointer-events: none;
}

body:not(.minimal) .sidebar-holder .nav > li.active > a i,
body:not(.minimal) .sidebar-holder .nav > li.active > a [class*="fa-"],
body:not(.minimal) .sidebar-holder .nav > li.active > a span.icon,
body:not(.minimal) .sidebar-holder .nav > li.open > a i,
body:not(.minimal) .sidebar-holder .nav > li.hx-nav-open > a i,
body:not(.minimal) .sidebar-holder .nav > li > a.active-parent i,
body:not(.minimal) .sidebar-holder .nav > li > a.active-parent span.icon {
  color: var(--shell-accent) !important;
  opacity: 1 !important;
}

body:not(.minimal) .sidebar-holder .nav > li > a .badge,
body:not(.minimal) .sidebar-holder .nav > li > a .badge-default {
  background: #eef1f5 !important;
  color: #5d6c80 !important;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  padding: 1px 8px;
  margin-left: auto;
}

body:not(.minimal) .sidebar-holder .nav > li.active > a .badge,
body:not(.minimal) .sidebar-holder .nav > li > a.active-parent .badge {
  background: var(--shell-accent) !important;
  color: #fff !important;
}

body:not(.minimal) .sidebar-holder .nav > li > a i,
body:not(.minimal) .sidebar-holder .nav > li > a [class*="fa-"],
body:not(.minimal) .sidebar-holder .nav > li > a span.icon {
  color: #8695a9 !important;
  opacity: 1;
  flex: 0 0 auto;
}

/* Ensure FA glyphs render even if a parent resets font-family */
body:not(.minimal) .sidebar-holder .nav > li > a i.fa,
body:not(.minimal) .sidebar-holder .nav > li > a i.fal,
body:not(.minimal) .sidebar-holder .nav > li > a i.far,
body:not(.minimal) .sidebar-holder .nav > li > a i.fas,
body:not(.minimal) .hx-top-header i.fa,
body:not(.minimal) .hx-top-header i.fal,
body:not(.minimal) .hx-top-header i.far,
body:not(.minimal) .hx-top-header i.fas {
  font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
}
body:not(.minimal) .sidebar-holder .nav > li > a i.fal,
body:not(.minimal) .hx-top-header i.fal {
  font-weight: 300;
}
body:not(.minimal) .sidebar-holder .nav > li > a i.fa,
body:not(.minimal) .sidebar-holder .nav > li > a i.fas,
body:not(.minimal) .hx-top-header i.fa,
body:not(.minimal) .hx-top-header i.fas {
  font-weight: 900;
}

body:not(.minimal) .sidebar-holder .nav > li > a .arrow,
body:not(.minimal) .sidebar-holder .nav > li > a .fa-angle-down {
  color: var(--shell-sidebar-fg-muted) !important;
  margin-left: auto;
  transition: transform 0.26s cubic-bezier(0.4, 0, 0.2, 1), color 0.16s ease;
}

body:not(.minimal) .sidebar-holder .nav > li.open > a .arrow,
body:not(.minimal) .sidebar-holder .nav > li.hx-nav-open > a .arrow,
body:not(.minimal) .sidebar-holder .nav > li.open > a .fa-angle-down,
body:not(.minimal) .sidebar-holder .nav > li.hx-nav-open > a .fa-angle-down {
  color: var(--shell-accent) !important;
  transform: rotate(180deg);
}

/* Submenu — vertical rail like mockup */
body:not(.minimal) .sidebar-holder .nav li.submenu > ul {
  background: transparent !important;
  border-radius: 0;
  margin: 4px 12px 8px 33px;
  padding: 0 0 0 16px;
  border: 0 !important;
  border-left: 1.5px solid var(--shell-sidebar-rail) !important;
  position: relative;
}

/* Keep current section open (override accordion hide) */
body:not(.minimal) .sidebar-holder .nav li.submenu.open > ul,
body:not(.minimal) .sidebar-holder .nav li.submenu.hx-nav-open > ul,
body:not(.minimal) .sidebar-holder .nav li.submenu:has(> ul > li.active) > ul {
  display: block !important;
}

body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav li.submenu.open > ul,
body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav li.submenu.hx-nav-open > ul,
body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav li.submenu:has(> ul > li.active) > ul {
  display: none !important;
}

body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li > a {
  position: relative;
  color: #5d6c80 !important;
  border-radius: 8px;
  margin: 1px 0;
  padding: 8px 12px !important;
  font-size: 13px;
  font-weight: 400;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  transition: background 0.16s ease, color 0.16s ease;
}

body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li > a:hover {
  background: var(--shell-sidebar-hover) !important;
  color: var(--shell-ink) !important;
}

body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li.active > a {
  background: var(--shell-sidebar-active) !important;
  color: var(--shell-accent) !important;
  font-weight: 600 !important;
}

/* Sub-item rail dot */
body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li > a::before {
  content: "";
  position: absolute;
  left: -19px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--shell-sidebar-rail);
  transition: background 0.18s ease, box-shadow 0.18s ease;
}

body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li.active > a::before {
  background: var(--shell-accent);
  box-shadow: 0 0 0 3px rgba(31, 95, 168, 0.12);
}

body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav li.list-subheading {
  display: none;
}

/* hdash coexistence */
body:not(.minimal) .hexa-content:has(.hdash) {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
}

body:not(.minimal) .hexa-content:has(.hdash) > .container {
  max-width: none !important;
}

/* ── Footer (outside site-holder → offset for fixed sidebar) ── */
@media (min-width: 768px) {
  body:not(.minimal) .sub-footer {
    margin-left: var(--shell-sidebar-w) !important;
    width: calc(100% - var(--shell-sidebar-w)) !important;
    max-width: none;
    padding-left: 32px !important;
    padding-right: 32px !important;
    box-sizing: border-box;
    transition:
      margin-left var(--shell-rail-ms) var(--shell-rail-ease),
      width var(--shell-rail-ms) var(--shell-rail-ease),
      padding-right var(--shell-rail-ms) var(--shell-rail-ease);
  }

  body:not(.minimal):has(.site-holder.mini-sidebar) .sub-footer {
    margin-left: var(--shell-mini-w) !important;
    width: calc(100% - var(--shell-mini-w)) !important;
  }

  body:not(.minimal) .sub-footer > .row,
  body:not(.minimal) .sub-footer > .hx-footer__inner {
    max-width: var(--shell-content-max);
    margin-left: auto;
    margin-right: auto;
  }
}

body:not(.minimal) .sub-footer {
  margin-top: 32px !important;
  padding-top: 20px !important;
  padding-bottom: 28px !important;
  border-top: 1px solid #e3e8ee;
  background: transparent !important;
  font-size: 12.5px !important;
  color: var(--shell-muted);
  box-sizing: border-box;
  text-align: center;
}

body:not(.minimal) .sub-footer .row,
body:not(.minimal) .hx-footer__inner {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 0 auto !important;
  width: 100%;
}

body:not(.minimal) .hx-footer__nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 4px 6px;
  float: none !important;
  margin: 0 !important;
}

body:not(.minimal) .hx-footer__nav > a {
  color: var(--shell-muted) !important;
  text-decoration: none !important;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  padding: 8px 10px;
  border-radius: 8px;
  background: transparent !important;
  text-transform: none !important;
}

body:not(.minimal) .hx-footer__nav > a:hover {
  color: var(--shell-ink) !important;
  text-decoration: none !important;
  background: rgba(10, 32, 56, 0.04) !important;
}

body:not(.minimal) .hx-footer__nav > a:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--hx-focus, rgba(33, 58, 84, 0.28));
}

body:not(.minimal) .hx-footer__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0 !important;
  color: var(--shell-muted) !important;
}

body:not(.minimal) .hx-footer__icon i {
  font-size: 15px;
}

body:not(.minimal) .sub-footer .footer506,
body:not(.minimal) p.footer506,
body:not(.minimal) .hx-footer__copy {
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--shell-muted) !important;
  font-size: 12px !important;
  text-align: center;
  flex: 0 1 auto;
  width: 100%;
  letter-spacing: 0.01em;
}

body:not(.minimal) .sub-footer .footer506 strong,
body:not(.minimal) .hx-footer__copy strong {
  color: var(--shell-ink, #5d6c80);
  font-weight: 600;
}

html.dark body:not(.minimal) .sub-footer {
  border-top-color: var(--shell-sidebar-border, #2a3140);
}

html.dark body:not(.minimal) .hx-footer__nav > a:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}

@media (max-width: 767px) {
  body:not(.minimal) .sub-footer .row,
  body:not(.minimal) .hx-footer__inner {
    flex-direction: column;
    align-items: center;
  }
  body:not(.minimal) .hx-footer__nav {
    justify-content: center;
    max-width: 28rem;
  }
  body:not(.minimal) .sub-footer .footer506,
  body:not(.minimal) p.footer506,
  body:not(.minimal) .hx-footer__copy {
    text-align: center;
  }
  body:not(.minimal) .shell-top-search {
    width: auto;
    flex: 1 1 auto;
    max-width: none;
  }
}

/* ── Topbar dropdowns (account / emails / alerts / language) ── */
body:not(.minimal) .hx-top-header .dropdown-menu {
  margin-top: 8px !important;
  padding: 6px 0 !important;
  min-width: 240px;
  border: 1px solid var(--shell-topbar-border) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 16px 40px rgba(17, 26, 36, 0.12) !important;
  overflow: hidden;
  z-index: 1050;
}

body:not(.minimal) .hx-top-header .hx-user-nav > .nav-item.dropdown > .dropdown-menu,
body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu {
  min-width: 280px;
  max-height: min(70vh, 520px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 8px 0 !important;
  scrollbar-width: thin;
}

body:not(.minimal) .hx-top-header .hx-account-greeting {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--shell-ink);
}

body:not(.minimal) .hx-top-header .hx-account-greeting .caret {
  margin-left: 2px;
}

body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a,
body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu .dropdown-item,
body:not(.minimal) .hx-top-header .navbar-nav > .nav-item.dropdown .dropdown-menu > li > a {
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 10px 16px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  color: var(--shell-ink) !important;
  white-space: nowrap;
  transition: background 0.12s ease, color 0.12s ease;
}

body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a > i,
body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu .dropdown-item .icon,
body:not(.minimal) .hx-top-header .navbar-nav > .nav-item.dropdown .dropdown-menu > li > a > i {
  width: 18px;
  text-align: center;
  color: var(--shell-muted) !important;
  font-size: 14px !important;
  flex: 0 0 18px;
  line-height: 1;
}

body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a:hover,
body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a:focus,
body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu .dropdown-item:hover,
body:not(.minimal) .hx-top-header .navbar-nav > .nav-item.dropdown .dropdown-menu > li > a:hover {
  background: #f2f4f7 !important;
  color: var(--shell-accent) !important;
}

body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a:hover > i,
body:not(.minimal) .hx-top-header .navbar-nav > .nav-item.dropdown .dropdown-menu > li > a:hover > i {
  color: var(--shell-accent) !important;
}

body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li.divider,
body:not(.minimal) .hx-top-header .dropdown-menu .divider {
  height: 1px;
  margin: 6px 0 !important;
  background: var(--shell-topbar-border) !important;
  border: 0 !important;
  overflow: hidden;
}

/* Collapse accidental double separators */
body:not(.minimal) .hx-top-header .hx-account-menu > li.divider + li.divider {
  display: none !important;
}

/* Welcome toggle: tighten greeting look */
body:not(.minimal) .hx-top-header .hx-user-nav > .nav-item > a.dropdown-toggle,
body:not(.minimal) .hx-top-header .hx-user-nav > li > a.dropdown-toggle {
  gap: 8px;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--shell-ink) !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

/* Panel dropdowns: emails / notifications / language */
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages > .dropdown-menu,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications > .dropdown-menu,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-settings > .dropdown-menu,
body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown.nav-item > .dropdown-menu {
  width: 360px !important;
  max-width: min(360px, calc(100vw - 24px));
  left: auto !important;
  right: 0 !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  border-radius: 12px !important;
  transform: none !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important; /* scroll lives on .hx-dropdown-scroll only */
}

/* Kill Hexa “center under icon” offset (margin-right: -165px / right: 50%) */
body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item.dropdown > .dropdown-menu {
  left: auto !important;
  right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu .title {
  margin: 0 !important;
  padding: 14px 16px 12px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left !important;
  color: var(--shell-muted) !important;
  border-bottom: 1px solid var(--shell-topbar-border);
  background: #fff !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu > li {
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  display: block !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller,
body:not(.minimal) .hx-top-header .hx-dropdown-scroll,
body:not(.minimal) .hx-top-header .ps-languages,
body:not(.minimal) .hx-top-header .ps-messages {
  display: block !important;
  box-sizing: border-box !important;
  /* --hx-scroll-h set by hexa.js hxFitDropdownScroller on open */
  height: var(--hx-scroll-h, auto) !important;
  min-height: 0 !important;
  max-height: 220px !important;
  overflow-x: hidden !important;
  overflow-y: var(--hx-scroll-overflow, auto) !important;
  position: relative !important;
  scrollbar-width: thin;
  scrollbar-color: #c5ced8 transparent;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller > .content,
body:not(.minimal) .hx-top-header .hx-dropdown-scroll > .content,
body:not(.minimal) .hx-top-header .ps-languages > .content,
body:not(.minimal) .hx-top-header .ps-messages > .content {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller > .content > ul,
body:not(.minimal) .hx-top-header .hx-dropdown-scroll > .content > ul,
body:not(.minimal) .hx-top-header .ps-messages > .content > ul {
  margin: 0 !important;
  padding: 0 !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller > .ps__rail-x,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller > .ps__rail-y,
body:not(.minimal) .hx-top-header .hx-dropdown-scroll > .ps__rail-x,
body:not(.minimal) .hx-top-header .hx-dropdown-scroll > .ps__rail-y,
body:not(.minimal) .hx-top-header .ps-messages > .ps__rail-x,
body:not(.minimal) .hx-top-header .ps-messages > .ps__rail-y,
body:not(.minimal) .hx-top-header .ps-languages > .ps__rail-x,
body:not(.minimal) .hx-top-header .ps-languages > .ps__rail-y {
  display: none !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller::-webkit-scrollbar,
body:not(.minimal) .hx-top-header .hx-dropdown-scroll::-webkit-scrollbar,
body:not(.minimal) .hx-top-header .ps-languages::-webkit-scrollbar,
body:not(.minimal) .hx-top-header .ps-messages::-webkit-scrollbar {
  width: 6px;
}
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller::-webkit-scrollbar-thumb,
body:not(.minimal) .hx-top-header .hx-dropdown-scroll::-webkit-scrollbar-thumb,
body:not(.minimal) .hx-top-header .ps-languages::-webkit-scrollbar-thumb,
body:not(.minimal) .hx-top-header .ps-messages::-webkit-scrollbar-thumb {
  background: #c5ced8;
  border-radius: 999px;
}

/* Notifications: wrap long alert text cleanly */
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a {
  display: flex !important;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px !important;
}
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .icon,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .img {
  float: none !important;
  flex: 0 0 36px;
  margin-top: 0 !important;
}
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .content {
  padding-left: 0 !important;
  flex: 1 1 auto;
  min-width: 0;
}
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .content .desc {
  display: block;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
  color: #5d6c80 !important;
}
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li.none {
  padding: 16px 14px;
  font-size: 13px;
  color: var(--shell-muted);
  text-align: center;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a {
  display: block;
  overflow: hidden;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a {
  padding: 12px 14px !important;
  border-bottom: 1px solid #f2f4f7;
  transition: background 0.12s ease;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li:last-child > a,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li:last-child > a {
  border-bottom: 0;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li:hover,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li:hover,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li:hover > a,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li:hover > a {
  background: #f7f9fb !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .icon,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .icon,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .img,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .img {
  background: #f2f4f7 !important;
  color: var(--shell-accent) !important;
  border: 1px solid var(--shell-topbar-border);
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .content .name {
  display: block;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--shell-ink) !important;
  margin-bottom: 2px !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .content .desc,
body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .content .desc {
  display: block;
  clear: both;
  font-size: 12px !important;
  line-height: 1.4 !important;
  color: #5d6c80 !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .content .date {
  float: right !important;
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  margin: 0 0 4px !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  color: var(--shell-muted) !important;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu .footer {
  border-top: 1px solid var(--shell-topbar-border);
  background: #fafbfc;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu .footer a {
  padding: 12px 16px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--shell-accent) !important;
  text-align: center;
}

body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu .footer a:hover {
  background: #f2f4f7 !important;
  color: #163e70 !important;
}

/* Language list */
body:not(.minimal) .hx-top-header .ps-languages ul,
body:not(.minimal) .hx-top-header .ps-languages > ul {
  list-style: none;
  margin: 0;
  padding: 6px 0;
}

body:not(.minimal) .hx-top-header .ps-languages li > a,
body:not(.minimal) .hx-top-header .dropdown-menu .ps-languages a {
  display: block;
  padding: 9px 16px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--shell-ink) !important;
  text-align: left !important;
  text-decoration: none !important;
}

body:not(.minimal) .hx-top-header .ps-languages li > a:hover,
body:not(.minimal) .hx-top-header .ps-languages li > a.active,
body:not(.minimal) .hx-top-header .dropdown-menu .ps-languages a:hover,
body:not(.minimal) .hx-top-header .dropdown-menu .ps-languages a.active {
  background: #f2f4f7 !important;
  color: var(--shell-accent) !important;
}

/* Kill Hexa caret triangle under open icons */
body:not(.minimal) .hx-top-header .hx-icons-nav > .nav-item.dropdown.open > a:after {
  display: none !important;
}

/* Language rows: Hexa puts dropdown-item on <li> */
body:not(.minimal) .hx-top-header .ps-languages li.dropdown-item {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

/* Dark-mode sidebar (mockup Sidebar.dc.html oscuro) */
html.dark body:not(.minimal) {
  --shell-sidebar-bg: #0f1a2b;
  --shell-sidebar-fg: #a9bacf;
  --shell-sidebar-fg-muted: #8b9cb3;
  --shell-sidebar-hover: rgba(255, 255, 255, 0.055);
  --shell-sidebar-active: rgba(77, 154, 224, 0.14);
  --shell-sidebar-border: rgba(255, 255, 255, 0.07);
  --shell-sidebar-rail: rgba(255, 255, 255, 0.1);
  --shell-topbar-bg: #0f1a2b;
  --shell-topbar-border: rgba(255, 255, 255, 0.07);
  --shell-accent: #4d9ae0;
  --shell-accent-deep: #93c5fd;
  --shell-page-bg: #0b1220;
  --shell-ink: #e8eef6;
  --shell-muted: #8b9cb3;
  color-scheme: dark;
}

html.dark body:not(.minimal) .sidebar-holder .nav li.submenu > ul > li.active > a::before {
  box-shadow: 0 0 0 3px rgba(77, 154, 224, 0.18);
}

/* Dark-mode topbar dropdowns */
html.dark body:not(.minimal) .hx-top-header .dropdown-menu {
  background: #1c212b !important;
  border-color: var(--shell-topbar-border) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45) !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a,
html.dark body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu .dropdown-item,
html.dark body:not(.minimal) .hx-top-header .navbar-nav > .nav-item.dropdown .dropdown-menu > li > a {
  color: var(--shell-ink) !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a:hover,
html.dark body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a:focus,
html.dark body:not(.minimal) .hx-top-header .navbar-nav > .nav-item.dropdown .dropdown-menu > li > a:hover {
  background: #242a35 !important;
  color: #93c5fd !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-user-nav .dropdown-menu > li > a:hover > i,
html.dark body:not(.minimal) .hx-top-header .navbar-nav > .nav-item.dropdown .dropdown-menu > li > a:hover > i {
  color: #93c5fd !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu .title {
  background: #1c212b !important;
  border-bottom-color: var(--shell-topbar-border);
  color: var(--shell-muted) !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a {
  border-bottom-color: #24262f;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li:hover,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li:hover,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li:hover > a,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li:hover > a {
  background: #242a35 !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .icon,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .icon,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .img,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .img {
  background: #242a35 !important;
  border-color: var(--shell-topbar-border);
  color: #93c5fd !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .content .name {
  color: var(--shell-ink) !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-messages .hx-scroller > .content > ul > li > a .content .desc,
html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-notifications .hx-scroller > .content > ul > li > a .content .desc {
  color: #9aa3b2 !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu .footer {
  border-top-color: var(--shell-topbar-border);
  background: #161a22;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu .footer a {
  color: #93c5fd !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .dropdown-menu .footer a:hover {
  background: #242a35 !important;
  color: #bfdbfe !important;
}

html.dark body:not(.minimal) .hx-top-header .ps-languages li > a,
html.dark body:not(.minimal) .hx-top-header .dropdown-menu .ps-languages a {
  color: var(--shell-ink) !important;
}

html.dark body:not(.minimal) .hx-top-header .ps-languages li > a:hover,
html.dark body:not(.minimal) .hx-top-header .ps-languages li > a.active,
html.dark body:not(.minimal) .hx-top-header .dropdown-menu .ps-languages a:hover,
html.dark body:not(.minimal) .hx-top-header .dropdown-menu .ps-languages a.active {
  background: #242a35 !important;
  color: #93c5fd !important;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller,
html.dark body:not(.minimal) .hx-top-header .ps-languages,
html.dark body:not(.minimal) .hx-top-header .ps-messages {
  scrollbar-color: #3a4250 transparent;
}

html.dark body:not(.minimal) .hx-top-header .hx-icons-nav .hx-scroller::-webkit-scrollbar-thumb,
html.dark body:not(.minimal) .hx-top-header .ps-languages::-webkit-scrollbar-thumb,
html.dark body:not(.minimal) .hx-top-header .ps-messages::-webkit-scrollbar-thumb {
  background: #3a4250;
}

/* ── Sidebar scrollbar (light / dark) ── */
body:not(.minimal) .left-sidebar,
body:not(.minimal) .sidebar-holder {
  scrollbar-width: thin;
  scrollbar-color: #b7c6d8 transparent;
}
body:not(.minimal) .left-sidebar::-webkit-scrollbar,
body:not(.minimal) .sidebar-holder::-webkit-scrollbar {
  width: 6px;
}
body:not(.minimal) .left-sidebar::-webkit-scrollbar-track,
body:not(.minimal) .sidebar-holder::-webkit-scrollbar-track {
  background: transparent;
}
body:not(.minimal) .left-sidebar::-webkit-scrollbar-thumb,
body:not(.minimal) .sidebar-holder::-webkit-scrollbar-thumb {
  background: #b7c6d8;
  border-radius: 999px;
}
html.dark body:not(.minimal) .left-sidebar,
html.dark body:not(.minimal) .sidebar-holder {
  scrollbar-color: #3a4454 transparent;
}
html.dark body:not(.minimal) .left-sidebar::-webkit-scrollbar-thumb,
html.dark body:not(.minimal) .sidebar-holder::-webkit-scrollbar-thumb {
  background: #3a4454;
}

/* Page scrollbar — same thin thumb as left nav */
html {
  scrollbar-width: thin;
  scrollbar-color: #b7c6d8 transparent;
}
html::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
html::-webkit-scrollbar-track {
  background: transparent;
}
html::-webkit-scrollbar-thumb {
  background: #b7c6d8;
  border-radius: 999px;
}
html.dark {
  scrollbar-color: #3a4454 transparent;
}
html.dark::-webkit-scrollbar-thumb {
  background: #3a4454;
}
body:not(.minimal) {
  scrollbar-width: thin;
  scrollbar-color: #b7c6d8 transparent;
}
body:not(.minimal)::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
body:not(.minimal)::-webkit-scrollbar-track {
  background: transparent;
}
body:not(.minimal)::-webkit-scrollbar-thumb {
  background: #b7c6d8;
  border-radius: 999px;
}
html.dark body:not(.minimal) {
  scrollbar-color: #3a4454 transparent;
}
html.dark body:not(.minimal)::-webkit-scrollbar-thumb {
  background: #3a4454;
}

/* ── Mini rail: center icons, hide text badges → dot ── */
body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav > li:not(.nav-toggle):not(.list-subheading) > a {
  justify-content: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav > li > a .badge,
body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav > li > a .label {
  position: absolute;
  top: 6px;
  right: 10px;
  width: 7px;
  height: 7px;
  min-width: 7px;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  border-radius: 999px;
  overflow: hidden;
  text-indent: -999px;
}
body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav > li.submenu > .fa.arrow,
body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav > li.submenu > a .fa.arrow,
body:not(.minimal) .site-holder.mini-sidebar .sidebar-holder .nav > li.submenu .rotate {
  display: none !important;
}

/* ── Flyout submenu (collapsed sidebar) ── */
.hx-nav-flyout {
  position: fixed;
  z-index: 1080;
  min-width: 200px;
  max-width: 280px;
  max-height: min(70vh, 420px);
  overflow: auto;
  padding: 8px;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 4px 6px rgba(16, 26, 40, 0.04), 0 16px 40px -12px rgba(16, 26, 40, 0.28);
  border: 1px solid #e6ebf1;
  scrollbar-width: thin;
  scrollbar-color: #b7c6d8 transparent;
}
html.dark .hx-nav-flyout {
  background: #1c212b;
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
  scrollbar-color: #3a4454 transparent;
}
.hx-nav-flyout__title {
  display: block;
  padding: 8px 12px 10px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #8d9aab;
  text-decoration: none !important;
  border-bottom: 1px solid #eef1f5;
  margin-bottom: 6px;
}
html.dark .hx-nav-flyout__title {
  color: #8b9cb3;
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
.hx-nav-flyout__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hx-nav-flyout__list > li > a {
  display: block;
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 13.5px;
  color: #41526a !important;
  text-decoration: none !important;
}
.hx-nav-flyout__list > li > a:hover {
  background: #f4f7fa;
  color: #111a24 !important;
}
.hx-nav-flyout__list > li.active > a {
  background: #eef4fb;
  color: #1f5fa8 !important;
  font-weight: 600;
}
html.dark .hx-nav-flyout__list > li > a {
  color: #a9bacf !important;
}
html.dark .hx-nav-flyout__list > li > a:hover {
  background: rgba(255, 255, 255, 0.055);
  color: #e8eef6 !important;
}
html.dark .hx-nav-flyout__list > li.active > a {
  background: rgba(77, 154, 224, 0.14);
  color: #93c5fd !important;
}

/* Soft dark surfaces for leftover Bootstrap/Hexa content boxes */
html.dark body:not(.minimal) .hexa-content .panel,
html.dark body:not(.minimal) .hexa-content .panel-default,
html.dark body:not(.minimal) .hexa-content .well,
html.dark body:not(.minimal) .hexa-content .card,
html.dark body:not(.minimal) .main-content .panel,
html.dark body:not(.minimal) .main-content .well {
  background-color: #1c212b !important;
  border-color: #2a3140 !important;
  color: #e8eef6;
}
html.dark body:not(.minimal) .hexa-content .panel-heading,
html.dark body:not(.minimal) .hexa-content .panel-footer,
html.dark body:not(.minimal) .main-content .panel-heading,
html.dark body:not(.minimal) .main-content .panel-footer {
  background-color: #161b24 !important;
  border-color: #2a3140 !important;
  color: #a9bacf;
}
html.dark body:not(.minimal) .hexa-content .table > thead > tr > th,
html.dark body:not(.minimal) .main-content .table > thead > tr > th {
  background-color: transparent;
  border-color: #2a3140;
  color: #8b9cb3;
}
html.dark body:not(.minimal) .hexa-content .table > tbody > tr > td,
html.dark body:not(.minimal) .main-content .table > tbody > tr > td {
  border-color: #242a35;
  color: #c5d0de;
}

/* Theme toggle: keep one icon visible */
.hx-theme-toggle [data-hx-theme-icon][hidden] {
  display: none !important;
}

/* Theme toggle: moon in light, sun in dark (before/without JS) */
.hx-theme-toggle [data-hx-theme-icon="sun"] { display: none !important; }
.hx-theme-toggle [data-hx-theme-icon="moon"] { display: inline-block !important; }
html.dark .hx-theme-toggle [data-hx-theme-icon="moon"] { display: none !important; }
html.dark .hx-theme-toggle [data-hx-theme-icon="sun"] { display: inline-block !important; }
.hx-theme-toggle [data-hx-theme-icon][hidden] { display: none !important; }

/* ── Right rail: WHMCS $secondarySidebar (Six / Twenty-One) ── */
body:not(.minimal) {
  --shell-right-w: 280px;
}

body.hx-has-rightbar.hx-rightbar-open:not(.minimal) .site-holder {
  padding-right: var(--shell-right-w) !important;
}

/* Cart categories live in the Hexa right rail — drop the in-page column */
body.hx-has-rightbar #order-mycartpro .cart-sidebar,
body.hx-has-rightbar #order-mycartpro-mail .cart-sidebar,
body.hx-has-rightbar #order-mycartpro .xc-cart-aside,
body.hx-has-rightbar #order-mycartpro-mail .xc-cart-aside {
  display: none !important;
}
body.hx-has-rightbar #order-mycartpro .cart-body,
body.hx-has-rightbar #order-mycartpro-mail .cart-body {
  width: 100% !important;
  flex: 1 1 100% !important;
  max-width: none !important;
}
@media (min-width: 768px) {
  body.hx-has-rightbar #order-mycartpro .sidebar-collapsed,
  body.hx-has-rightbar #order-mycartpro-mail .sidebar-collapsed {
    display: none !important;
  }
}

@media (min-width: 768px) {
  body.hx-has-rightbar.hx-rightbar-open:not(.minimal) .sub-footer {
    width: calc(100% - var(--shell-sidebar-w) - var(--shell-right-w)) !important;
    padding-right: 32px !important;
  }
  body.hx-has-rightbar.hx-rightbar-open:not(.minimal):has(.site-holder.mini-sidebar) .sub-footer {
    width: calc(100% - var(--shell-mini-w) - var(--shell-right-w)) !important;
  }
}

.hx-right-rail {
  display: none;
}
body.hx-has-rightbar:not(.minimal) .hx-right-rail {
  display: flex;
  flex-direction: column;
  position: fixed;
  top: var(--shell-topbar-h);
  right: 0;
  bottom: 0;
  z-index: 44;
  width: var(--shell-right-w);
  max-width: var(--shell-right-w);
  box-sizing: border-box;
  background: var(--shell-sidebar-bg);
  border-left: 1px solid var(--shell-sidebar-border);
  transform: translateX(100%);
  transition: transform var(--shell-rail-ms) var(--shell-rail-ease);
  pointer-events: none;
  overflow: visible;
}
body.hx-has-rightbar.hx-rightbar-open:not(.minimal) .hx-right-rail {
  transform: translateX(0);
  pointer-events: auto;
}

.hx-right-rail__inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

/* Collapse pill on rail edge (same as left .shell-sidebar-collapse) */
.hx-right-rail__collapse {
  position: absolute;
  top: 22px;
  left: -13px;
  z-index: 60;
  display: none;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--shell-sidebar-bg) !important;
  box-shadow: 0 1px 4px rgba(16, 26, 40, 0.14);
  color: var(--shell-sidebar-fg-muted) !important;
  cursor: pointer;
  outline: none !important;
  transition: color 0.15s ease, box-shadow 0.15s ease;
  pointer-events: auto;
}
body.hx-has-rightbar.hx-rightbar-open:not(.minimal) .hx-right-rail__collapse {
  display: inline-flex;
}
.hx-right-rail__collapse:hover,
.hx-right-rail__collapse:focus {
  color: var(--shell-accent) !important;
  box-shadow: 0 2px 8px rgba(16, 26, 40, 0.18);
}
.hx-right-rail__collapse svg {
  display: block;
  width: 13px;
  height: 13px;
  stroke: currentColor;
}
html.dark .hx-right-rail__collapse {
  background: var(--shell-sidebar-bg) !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
  color: var(--shell-sidebar-fg-muted) !important;
}
html.dark .hx-right-rail__collapse:hover,
html.dark .hx-right-rail__collapse:focus {
  color: #93c5fd !important;
  box-shadow: 0 0 0 1px rgba(147, 197, 253, 0.35);
}

.hx-right-rail__scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 14px 12px 24px;
  scrollbar-width: thin;
  scrollbar-color: #b7c6d8 transparent;
}
html.dark .hx-right-rail__scroll {
  scrollbar-color: #3a4454 transparent;
}
.hx-right-rail__scroll::-webkit-scrollbar {
  width: 6px;
}
.hx-right-rail__scroll::-webkit-scrollbar-thumb {
  background: #b7c6d8;
  border-radius: 99px;
}
html.dark .hx-right-rail__scroll::-webkit-scrollbar-thumb {
  background: #3a4454;
}

/* Profile card — home only; platform light style (not mockup navy) */
.hx-rail-profile {
  margin: 0 0 12px;
  padding: 16px 14px 14px;
  border-radius: 12px;
  background: #fff;
  color: #1a2332;
  border: 1px solid #e4e9f0;
  box-shadow: 0 1px 2px rgba(15, 39, 68, 0.04);
}
html.dark .hx-rail-profile {
  background: #151b24;
  border-color: #2a3340;
  color: #e8eef6;
  box-shadow: none;
}
.hx-rail-profile__brand {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.hx-rail-profile__avatar-wrap {
  position: relative;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
}
.hx-rail-profile__avatar {
  width: 48px;
  height: 48px;
  border-radius: 999px;
  object-fit: cover;
  background: #eef2f7;
  display: block;
  border: 1px solid #e4e9f0;
}
html.dark .hx-rail-profile__avatar {
  background: #1e2630;
  border-color: #2a3340;
}
.hx-rail-profile__avatar--fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #1f5fa8;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  position: absolute;
  inset: 0;
  border-radius: 999px;
}
.hx-rail-profile__meta {
  flex: 1 1 auto;
  min-width: 0;
}
.hx-rail-profile__company {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f1b2d;
}
html.dark .hx-rail-profile__company {
  color: #fff;
}
.hx-rail-profile__addr {
  margin-top: 6px;
}
.hx-rail-profile__line {
  font-size: 12.5px;
  line-height: 1.45;
  color: #6b7a90;
}
html.dark .hx-rail-profile__line {
  color: #9eb0c7;
}
.hx-rail-profile__actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.hx-rail-profile__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #d5dee9;
  background: #f7f9fb;
  color: #1a5fb4 !important;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none !important;
  text-align: center;
  line-height: 1.2;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.hx-rail-profile__btn:hover {
  background: #eef5fc;
  border-color: #1a5fb4;
  color: #0f4a96 !important;
  text-decoration: none !important;
}
html.dark .hx-rail-profile__btn {
  background: rgba(255, 255, 255, 0.06);
  border-color: #3a4454;
  color: #8ec5ff !important;
}
html.dark .hx-rail-profile__btn:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: #5a9fd4;
  color: #fff !important;
}
.hx-rail-profile__contact {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #e4e9f0;
}
html.dark .hx-rail-profile__contact {
  border-top-color: #2a3340;
}
.hx-rail-profile__contact-avatar {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #e8f1fb;
  color: #1a5fb4;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
html.dark .hx-rail-profile__contact-avatar {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}
.hx-rail-profile__contact-name {
  font-size: 13px;
  font-weight: 600;
  color: #0f1b2d;
  line-height: 1.25;
}
html.dark .hx-rail-profile__contact-name {
  color: #fff;
}
.hx-rail-profile__contact-role {
  margin-top: 2px;
  font-size: 11.5px;
  color: #6b7a90;
}
html.dark .hx-rail-profile__contact-role {
  color: #9eb0c7;
}

/* Panels inside rail */
.hx-right-rail .hx-rail-panel {
  margin: 0 0 12px;
  border: 1px solid var(--shell-sidebar-border);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(16, 26, 40, 0.04);
  overflow: hidden;
}
html.dark .hx-right-rail .hx-rail-panel {
  background: #1c212b;
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: none;
}
.hx-right-rail .hx-rail-panel__head,
.hx-right-rail .hx-rail-panel > .panel-heading {
  margin: 0;
  padding: 12px 14px;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--shell-sidebar-border) !important;
}
.hx-right-rail .hx-rail-panel .panel-title {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--shell-ink);
  line-height: 1.35;
}
.hx-right-rail .hx-rail-panel .panel-title .fa,
.hx-right-rail .hx-rail-panel .panel-title .fas,
.hx-right-rail .hx-rail-panel .panel-title .far,
.hx-right-rail .hx-rail-panel .panel-title .fal {
  color: var(--shell-accent);
}
.hx-right-rail .hx-rail-panel .panel-minimise {
  color: var(--shell-sidebar-fg-muted);
  font-size: 11px;
  margin-top: 3px;
  cursor: pointer;
}
.hx-right-rail .hx-rail-panel__body,
.hx-right-rail .hx-rail-panel > .panel-body {
  padding: 12px 14px;
  font-size: 13px;
  color: var(--shell-ink);
  background: transparent !important;
}
.hx-right-rail .hx-rail-panel__list,
.hx-right-rail .hx-rail-panel .list-group {
  margin: 0;
  border: 0;
  background: transparent;
}
.hx-right-rail .hx-rail-panel .list-group-item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 10px 14px;
  border: 0;
  border-top: 1px solid var(--shell-sidebar-border);
  background: transparent !important;
  color: var(--shell-sidebar-fg) !important;
  font-size: 13px;
  text-align: left;
  text-decoration: none !important;
}
.hx-right-rail .hx-rail-panel .list-group-item:first-child {
  border-top: 0;
}
.hx-right-rail .hx-rail-panel a.list-group-item:hover {
  background: var(--shell-sidebar-hover) !important;
  color: var(--shell-accent) !important;
}
.hx-right-rail .hx-rail-panel a.list-group-item.active {
  background: var(--shell-sidebar-active) !important;
  color: var(--shell-accent) !important;
  font-weight: 600;
}
.hx-right-rail .hx-rail-panel a.list-group-item.disabled,
.hx-right-rail .hx-rail-panel a.list-group-item[aria-disabled="true"],
.hx-right-rail .hx-rail-panel .list-group-item.disabled {
  opacity: 0.42;
  cursor: not-allowed;
  pointer-events: none;
  color: var(--shell-muted) !important;
  background: transparent !important;
  font-weight: 400;
}
.hx-right-rail .hx-rail-panel a.list-group-item.disabled:hover,
.hx-right-rail .hx-rail-panel a.list-group-item[aria-disabled="true"]:hover {
  background: transparent !important;
  color: var(--shell-muted) !important;
}
.hx-right-rail .hx-rail-panel .list-group-item .badge {
  float: none;
  margin: 0;
  order: -1;
  flex: 0 0 auto;
  min-width: 1.75em;
  text-align: center;
  background: var(--shell-sidebar-hover);
  color: var(--shell-muted);
  font-weight: 500;
}
.hx-right-rail .hx-rail-panel .panel-title .badge {
  margin-left: 6px;
  background: var(--shell-sidebar-hover);
  color: var(--shell-muted);
  font-weight: 500;
}
.hx-right-rail .hx-rail-panel__foot,
.hx-right-rail .hx-rail-panel > .panel-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 14px;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid var(--shell-sidebar-border) !important;
}
.hx-right-rail .hx-rail-panel__foot .col-xs-6,
.hx-right-rail .hx-rail-panel__foot .col-xs-12,
.hx-right-rail .hx-rail-panel__foot [class*="col-xs-"],
.hx-right-rail .hx-rail-panel > .panel-footer .col-xs-6,
.hx-right-rail .hx-rail-panel > .panel-footer .col-xs-12,
.hx-right-rail .hx-rail-panel > .panel-footer [class*="col-xs-"] {
  float: none;
  width: 100%;
  padding: 0;
  margin: 0;
}
.hx-right-rail .hx-rail-panel .btn,
.hx-right-rail .hx-rail-panel .btn-default,
.hx-right-rail .hx-rail-panel .btn-success,
.hx-right-rail .hx-rail-panel .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  margin: 0;
  padding: 9px 12px;
  border-radius: 8px !important;
  border: 0 !important;
  background: var(--shell-accent) !important;
  color: #fff !important;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none !important;
  text-transform: none;
  letter-spacing: normal;
  box-shadow: none !important;
}
.hx-right-rail .hx-rail-panel .btn:hover,
.hx-right-rail .hx-rail-panel .btn:focus,
.hx-right-rail .hx-rail-panel .btn-default:hover,
.hx-right-rail .hx-rail-panel .btn-default:focus,
.hx-right-rail .hx-rail-panel .btn-success:hover,
.hx-right-rail .hx-rail-panel .btn-success:focus,
.hx-right-rail .hx-rail-panel .btn-primary:hover,
.hx-right-rail .hx-rail-panel .btn-primary:focus {
  background: var(--shell-accent-deep) !important;
  color: #fff !important;
  text-decoration: none !important;
}
.hx-right-rail .hx-rail-panel .btn i,
.hx-right-rail .hx-rail-panel .btn .fa,
.hx-right-rail .hx-rail-panel .btn .fas,
.hx-right-rail .hx-rail-panel .btn .far,
.hx-right-rail .hx-rail-panel .btn .fal,
.hx-right-rail .hx-rail-panel .btn .fa-money-bill-alt {
  color: #fff !important;
  opacity: 1;
}

/* Edge pill when collapsed — same circle as left nav */
.hx-rightbar-edge {
  display: none;
}
body.hx-has-rightbar:not(.hx-rightbar-open):not(.minimal) .hx-rightbar-edge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: calc(var(--shell-topbar-h) + 22px);
  right: -13px;
  z-index: 60;
  width: 26px;
  height: 26px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--shell-sidebar-bg);
  box-shadow: 0 1px 4px rgba(16, 26, 40, 0.14);
  color: var(--shell-sidebar-fg-muted);
  cursor: pointer;
  outline: none;
}
body.hx-has-rightbar:not(.hx-rightbar-open):not(.minimal) .hx-rightbar-edge:hover {
  color: var(--shell-accent);
  box-shadow: 0 2px 8px rgba(16, 26, 40, 0.18);
}
body.hx-has-rightbar:not(.hx-rightbar-open):not(.minimal) .hx-rightbar-edge svg {
  width: 13px;
  height: 13px;
}
html.dark body.hx-has-rightbar:not(.hx-rightbar-open):not(.minimal) .hx-rightbar-edge {
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
}
html.dark body.hx-has-rightbar:not(.hx-rightbar-open):not(.minimal) .hx-rightbar-edge:hover {
  color: #93c5fd;
  box-shadow: 0 0 0 1px rgba(147, 197, 253, 0.35);
}

.hx-rightbar-toggle.is-open {
  color: var(--shell-accent) !important;
}

@media (max-width: 991px) {
  body.hx-has-rightbar.hx-rightbar-open:not(.minimal) .site-holder {
    padding-right: 0 !important;
  }
  body.hx-has-rightbar:not(.minimal) .hx-right-rail {
    width: min(var(--shell-right-w), 86vw);
    max-width: 86vw;
    box-shadow: -12px 0 40px rgba(16, 26, 40, 0.18);
  }
  html.dark body.hx-has-rightbar:not(.minimal) .hx-right-rail {
    box-shadow: -12px 0 40px rgba(0, 0, 0, 0.45);
  }
}
@media (max-width: 767px) {
  .hx-right-rail__collapse,
  body.hx-has-rightbar:not(.hx-rightbar-open):not(.minimal) .hx-rightbar-edge {
    display: none !important;
  }
}

/* Dark — livechat conversation list (inline #xn-lc-root styles force white) */
html.dark #xn-lc-root .xn-conv-item,
html.dark .xn-conv-item {
  background: #1c212b !important;
  border-color: #2a3140 !important;
  color: #e8edf4 !important;
}
html.dark #xn-lc-root .xn-conv-item:hover,
html.dark .xn-conv-item:hover {
  background: #252b36 !important;
  border-color: #4d9ae0 !important;
  box-shadow: 0 0 0 3px rgba(77, 154, 224, 0.18) !important;
}
html.dark #xn-lc-root .xn-conv-preview,
html.dark .xn-conv-preview {
  color: #9aa8b8 !important;
}
html.dark #xn-lc-root .xn-conv-item:hover .xn-conv-preview,
html.dark .xn-conv-item:hover .xn-conv-preview {
  color: #e8edf4 !important;
}
html.dark #xn-lc-root .xn-conv-time,
html.dark .xn-conv-time {
  color: #7a8799 !important;
}
html.dark #xn-lc-root .xn-conv-status-closed,
html.dark .xn-conv-status-closed {
  background: #252b36 !important;
  color: #9aa8b8 !important;
}
html.dark #xn-lc-root .xn-conv-status-open,
html.dark .xn-conv-status-open {
  background: rgba(42, 117, 73, 0.22) !important;
  color: #5fce93 !important;
}
html.dark #xn-lc-root .xn-conv-status-pending,
html.dark .xn-conv-status-pending {
  background: rgba(192, 122, 30, 0.2) !important;
  color: #f0b35a !important;
}