/* =====================================================================
   NEXUSBIZPRO UNIFIED DESIGN SYSTEM V5
   Final additive layer. It standardises appearance and navigation while
   preserving every existing API call, DOM id, form field and data flow.
   ===================================================================== */

:root {
  --nx5-bg: #070b12;
  --nx5-bg-soft: #0a111c;
  --nx5-sidebar: #080e17;
  --nx5-panel: #0e1622;
  --nx5-panel-2: #121c2a;
  --nx5-panel-3: #172233;
  --nx5-line: rgba(148, 163, 184, .14);
  --nx5-line-strong: rgba(148, 163, 184, .24);
  --nx5-text: #f5f7fb;
  --nx5-muted: #96a2b5;
  --nx5-subtle: #657389;
  --nx5-purple: #8b5cf6;
  --nx5-purple-2: #6d28d9;
  --nx5-blue: #3b82f6;
  --nx5-cyan: #06b6d4;
  --nx5-green: #22c98b;
  --nx5-amber: #f5b942;
  --nx5-red: #fb7185;
  --nx5-radius-sm: 10px;
  --nx5-radius: 14px;
  --nx5-radius-lg: 20px;
  --nx5-shadow: 0 24px 70px rgba(0, 0, 0, .34);
  --nx5-shadow-soft: 0 12px 34px rgba(0, 0, 0, .22);
  --nx5-sidebar-width: 272px;
  --nx5-font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-nexus-theme="unified-v5"],
html[data-nexus-theme="unified-v5"] body {
  color-scheme: dark;
  background: var(--nx5-bg) !important;
}

body.nexus-unified-v5 {
  min-height: 100vh;
  color: var(--nx5-text) !important;
  background:
    radial-gradient(circle at 78% -12%, rgba(99, 102, 241, .15), transparent 29%),
    radial-gradient(circle at 15% 18%, rgba(6, 182, 212, .07), transparent 24%),
    linear-gradient(180deg, #070b12 0%, #08111c 52%, #070b12 100%) !important;
  font-family: var(--nx5-font) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.nexus-unified-v5 *,
body.nexus-unified-v5 *::before,
body.nexus-unified-v5 *::after { box-sizing: border-box; }

body.nexus-unified-v5 button,
body.nexus-unified-v5 input,
body.nexus-unified-v5 select,
body.nexus-unified-v5 textarea { font-family: var(--nx5-font) !important; }

body.nexus-unified-v5 a { text-underline-offset: 3px; }
body.nexus-unified-v5 :focus-visible {
  outline: 2px solid rgba(139, 92, 246, .82) !important;
  outline-offset: 2px;
}
body.nexus-unified-v5 * { scrollbar-width: thin; scrollbar-color: rgba(148,163,184,.25) transparent; }
body.nexus-unified-v5 *::-webkit-scrollbar { width: 8px; height: 8px; }
body.nexus-unified-v5 *::-webkit-scrollbar-thumb { background: rgba(148,163,184,.24); border-radius: 999px; }

/* ---------------------------------------------------------------------
   GLOBAL APP SHELLS
   --------------------------------------------------------------------- */
body[data-module] .nx-app,
body[data-module="products"] .app-shell,
body[data-module="orders"] .nbp-shell,
body[data-module="customers"] .nb-shell,
body[data-module="affiliate-partner"] .nbp-shell {
  min-height: 100vh !important;
  display: grid !important;
  grid-template-columns: var(--nx5-sidebar-width) minmax(0, 1fr) !important;
  background: transparent !important;
}

body[data-module] .nx-sidebar,
body[data-module="products"] .sidebar,
body[data-module="orders"] .nbp-sidebar,
body[data-module="customers"] .nb-sidebar,
body[data-module="affiliate-partner"] .nbp-sidebar {
  width: var(--nx5-sidebar-width) !important;
  height: 100vh !important;
  position: sticky !important;
  inset: 0 auto auto 0 !important;
  z-index: 80 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 14px 11px 12px !important;
  overflow-y: auto !important;
  color: var(--nx5-text) !important;
  background:
    radial-gradient(circle at 15% 0%, rgba(139, 92, 246, .12), transparent 24%),
    linear-gradient(180deg, rgba(8, 14, 23, .99), rgba(7, 12, 20, .995)) !important;
  border-right: 1px solid var(--nx5-line) !important;
  box-shadow: none !important;
}

body[data-module] .nx-main,
body[data-module="products"] .main-content,
body[data-module="orders"] .nbp-main,
body[data-module="customers"] .nb-main,
body[data-module="affiliate-partner"] .nbp-main {
  min-width: 0 !important;
  min-height: 100vh !important;
  color: var(--nx5-text) !important;
  background: transparent !important;
}

/* Brand */
body[data-module] .nx-brand,
body[data-module="products"] .sidebar-brand,
body[data-module="orders"] .nbp-sidebar-brand,
body[data-module="customers"] .nb-brand,
body[data-module="affiliate-partner"] .nbp-brand {
  min-height: 58px !important;
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  padding: 7px 8px 14px !important;
  border: 0 !important;
  background: transparent !important;
}

body[data-module] .nx-brand-logo,
body[data-module="products"] .brand-mark,
body[data-module="orders"] .nbp-sidebar-brand-mark,
body[data-module="customers"] .nb-brand-mark,
body[data-module="affiliate-partner"] .nbp-brand-mark {
  width: 38px !important;
  height: 38px !important;
  flex: 0 0 38px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: linear-gradient(145deg, #9b6cff 0%, #4f46e5 52%, #0891b2 100%) !important;
  box-shadow: 0 12px 30px rgba(76, 29, 149, .34), inset 0 1px 0 rgba(255,255,255,.28) !important;
}

body[data-module] .nx-brand-copy strong,
body[data-module="products"] .brand-copy strong,
body[data-module="orders"] .nbp-sidebar-brand-name,
body[data-module="customers"] .nb-brand-copy strong,
body[data-module="affiliate-partner"] .nbp-brand strong {
  display: block !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.15 !important;
  font-weight: 760 !important;
  letter-spacing: -.025em !important;
}

body[data-module] .nx-brand-copy span,
body[data-module="products"] .brand-copy span,
body[data-module="orders"] .nbp-sidebar-brand-sub,
body[data-module="customers"] .nb-brand-copy span,
body[data-module="affiliate-partner"] .nbp-brand span {
  display: block !important;
  margin-top: 3px !important;
  color: var(--nx5-muted) !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
}
body[data-module] .nx-pro { display: none !important; }
body[data-module] .nx-collapse { display: none !important; }

/* Tenant/user cards */
body[data-module="products"] .tenant-card,
body[data-module="orders"] .nbp-tenant-card {
  margin: 0 0 8px !important;
  padding: 10px !important;
  border: 1px solid var(--nx5-line) !important;
  border-radius: 12px !important;
  background: rgba(18, 28, 42, .7) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02) !important;
}

body[data-module] .nx-user-card,
body[data-module="orders"] .nbp-sidebar-footer,
body[data-module="customers"] .nb-sidebar-footer,
body[data-module="affiliate-partner"] .nbp-sidebar-foot {
  margin-top: auto !important;
  padding: 10px !important;
  border: 1px solid var(--nx5-line) !important;
  border-radius: 13px !important;
  color: var(--nx5-text) !important;
  background: rgba(18, 28, 42, .76) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}

/* ---------------------------------------------------------------------
   SINGLE MENU LANGUAGE
   --------------------------------------------------------------------- */
.nxu-nav-group,
.nx-nav-group { display: grid !important; gap: 2px !important; }

.nxu-nav-label,
.nx-nav-label {
  margin: 15px 9px 5px !important;
  color: #667894 !important;
  font-size: 9px !important;
  font-weight: 820 !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
}

.nxu-nav-link,
.nx-nav-link {
  position: relative !important;
  min-height: 41px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 10px !important;
  color: #a4b0c2 !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  font-weight: 570 !important;
  text-decoration: none !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: transparent !important;
  transition: color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease !important;
}
.nxu-nav-link:hover,
.nx-nav-link:hover {
  color: #fff !important;
  background: rgba(148, 163, 184, .07) !important;
  transform: translateX(1px);
}
.nxu-nav-link.active,
.nx-nav-link.active {
  color: #fff !important;
  border-color: rgba(139, 92, 246, .25) !important;
  background: linear-gradient(90deg, rgba(124, 58, 237, .27), rgba(79, 70, 229, .09)) !important;
  box-shadow: inset 3px 0 0 #9b6cff !important;
}
.nxu-nav-icon,
.nx-nav-icon {
  width: 20px !important;
  flex: 0 0 20px !important;
  display: grid !important;
  place-items: center !important;
  color: #8fa1bc !important;
  font-size: 15px !important;
}
.nxu-nav-link.active .nxu-nav-icon,
.nx-nav-link.active .nx-nav-icon { color: #b49aff !important; }
.nxu-nav-text { min-width: 0; flex: 1; }
.nxu-nav-arrow,
.nx-nav-arrow { margin-left: auto !important; color: #596a82 !important; font-size: 15px !important; }

/* ---------------------------------------------------------------------
   TOP BARS AND PAGE HEADINGS
   --------------------------------------------------------------------- */
body[data-module] .nx-topbar,
body[data-module="products"] .topbar,
body[data-module="customers"] .nb-topbar,
body[data-module="affiliate-partner"] .nbp-topbar {
  min-height: 70px !important;
  color: var(--nx5-text) !important;
  background: rgba(7, 11, 18, .84) !important;
  border-bottom: 1px solid var(--nx5-line) !important;
  backdrop-filter: blur(20px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(125%) !important;
  box-shadow: none !important;
}
body[data-module] .nx-topbar,
body[data-module="products"] .topbar,
body[data-module="customers"] .nb-topbar { position: sticky !important; top: 0 !important; z-index: 60 !important; }
body[data-module="affiliate-partner"] .nbp-topbar { margin: 0 !important; padding: 18px 22px !important; }

body[data-module] .nx-content { padding: 24px 26px 60px !important; }
body[data-module="products"] .page-content { padding: 22px 24px 60px !important; }
body[data-module="customers"] .nb-main { padding-bottom: 50px !important; }
body[data-module="affiliate-partner"] .nbp-main { padding: 0 22px 50px !important; }

body[data-module] h1,
body[data-module] h2,
body[data-module] h3 { color: var(--nx5-text) !important; }

body[data-module] .nx-page-title small,
body[data-module] .nx-eyebrow,
body[data-module="affiliate-partner"] .eyebrow {
  color: #a78bfa !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
}

body[data-module] .nx-page-title h1,
body[data-module="products"] .page-header h1,
body[data-module="orders"] .orders-hero-copy h1,
body[data-module="customers"] .nb-page-heading h1,
body[data-module="affiliate-partner"] .nbp-heading h1 {
  margin-top: 5px !important;
  color: #f8fafc !important;
  font-size: clamp(26px, 3vw, 36px) !important;
  line-height: 1.08 !important;
  font-weight: 720 !important;
  letter-spacing: -.045em !important;
}

body[data-module] .nx-page-title p,
body[data-module="products"] .page-header p,
body[data-module="orders"] .orders-hero-copy p,
body[data-module="customers"] .nb-page-heading p,
body[data-module="affiliate-partner"] .nbp-heading p {
  color: var(--nx5-muted) !important;
  font-size: 12px !important;
  line-height: 1.65 !important;
}

/* ---------------------------------------------------------------------
   BUTTONS, INPUTS AND INTERACTION
   --------------------------------------------------------------------- */
body[data-module] :is(.nx-btn,.btn,.nbp-btn,.nb-button,.orders-button,button.primary,.pc22-button,.gm-button,.pv23-button) {
  min-height: 38px;
  border-radius: 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, opacity .16s ease !important;
}
body[data-module] :is(.nx-btn,.btn,.nbp-btn,.nb-button,.orders-button,button.primary,.pc22-button,.gm-button,.pv23-button):hover:not(:disabled) {
  transform: translateY(-1px);
}

body[data-module] :is(.nx-btn.primary,.btn-primary,.nbp-btn.primary,.nbp-btn-primary,.nb-primary-button,button.primary,.pc22-button-primary,.gm-button-primary,.pv23-button-primary) {
  color: #fff !important;
  border-color: rgba(139, 92, 246, .34) !important;
  background: linear-gradient(135deg, #8b5cf6, #6d28d9) !important;
  box-shadow: 0 10px 26px rgba(91, 33, 182, .25) !important;
}
body[data-module] :is(.nx-btn.ghost,.btn-secondary,.nbp-btn.ghost,.nbp-btn-secondary,.nb-secondary-button,.pc22-button-ghost,.gm-button-secondary,.pv23-button-secondary) {
  color: #dce4ef !important;
  border: 1px solid var(--nx5-line) !important;
  background: rgba(18, 28, 42, .78) !important;
  box-shadow: none !important;
}

body[data-module] input,
body[data-module] select,
body[data-module] textarea {
  color: #e7edf6 !important;
  background: #09111c !important;
  border-color: var(--nx5-line) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
body[data-module] input::placeholder,
body[data-module] textarea::placeholder { color: #657389 !important; }
body[data-module] input:focus,
body[data-module] select:focus,
body[data-module] textarea:focus {
  border-color: rgba(139, 92, 246, .58) !important;
  box-shadow: 0 0 0 3px rgba(139, 92, 246, .10) !important;
}

/* ---------------------------------------------------------------------
   CARDS, KPI, PANELS AND TABLES
   --------------------------------------------------------------------- */
body[data-module] :is(
  .nx-panel,.nx-kpi,.nx-module-card,.nx-summary-card,.nx-system-strip,
  .summary-card,.product-card,.orders-kpi-card,.orders-panel,.orders-table-card,
  .nb-kpi-card,.nb-content-card,.nb-customer-modal,
  .nbp-kpi,.nbp-panel,.nbp-card
) {
  color: var(--nx5-text) !important;
  border-color: var(--nx5-line) !important;
  background: linear-gradient(180deg, rgba(15, 24, 37, .96), rgba(12, 20, 31, .96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025), var(--nx5-shadow-soft) !important;
}

body[data-module] :is(.nx-panel,.orders-panel,.orders-table-card,.nb-content-card,.nbp-panel,.nbp-card) {
  border-radius: var(--nx5-radius-lg) !important;
}
body[data-module] :is(.nx-kpi,.orders-kpi-card,.nb-kpi-card,.nbp-kpi,.nx-summary-card) {
  border-radius: var(--nx5-radius) !important;
}

body[data-module] :is(.nx-kpi-label,.orders-kpi-label,.nb-kpi-label,.nbp-kpi span) {
  color: var(--nx5-muted) !important;
  font-size: 10px !important;
  font-weight: 650 !important;
}
body[data-module] :is(.nx-kpi-value,.orders-kpi-value,.nb-kpi-value,.nbp-kpi strong) {
  color: #fff !important;
  font-size: clamp(20px, 2vw, 27px) !important;
  font-weight: 750 !important;
  letter-spacing: -.035em !important;
}

body[data-module] table {
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
body[data-module] table thead th {
  color: #8290a6 !important;
  background: rgba(8, 14, 23, .72) !important;
  border-color: var(--nx5-line) !important;
  font-size: 10px !important;
  font-weight: 750 !important;
  letter-spacing: .035em !important;
  text-transform: uppercase !important;
}
body[data-module] table tbody td {
  color: #dce4ef !important;
  border-color: var(--nx5-line) !important;
  font-size: 11.5px !important;
  line-height: 1.5 !important;
}
body[data-module] table tbody tr { transition: background .15s ease !important; }
body[data-module] table tbody tr:hover { background: rgba(139, 92, 246, .045) !important; }

body[data-module] :is(.nx-badge,.badge,.nb-badge,.nbp-badge,.orders-badge) {
  border-radius: 999px !important;
  font-size: 9px !important;
  font-weight: 760 !important;
}

/* Hero refinement */
body[data-module] .nx-hero,
body[data-module="orders"] .orders-hero,
body[data-module="customers"] .nb-customer-hero {
  border-color: var(--nx5-line) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 80% 15%, rgba(139, 92, 246, .17), transparent 29%),
    linear-gradient(145deg, rgba(15,24,37,.96), rgba(9,15,24,.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03), var(--nx5-shadow-soft) !important;
}
body[data-module] .nx-hero h1 { font-size: clamp(34px, 5vw, 56px) !important; letter-spacing: -.06em !important; }

/* Modal / toast */
body[data-module] :is(.nx-modal,.modal-content,.nb-customer-modal,.nbp-modal) {
  border-color: var(--nx5-line-strong) !important;
  background: #0d1622 !important;
  box-shadow: var(--nx5-shadow) !important;
}
body[data-module] :is(.nx-toast,.toast,.nb-toast,.nbp-toast) {
  color: #eef2f8 !important;
  border-color: var(--nx5-line) !important;
  background: #111b29 !important;
  box-shadow: var(--nx5-shadow-soft) !important;
}

/* ---------------------------------------------------------------------
   CONTEXT HEADER + MASTER MENU DRAWER FOR SPECIALISED WORKSPACES
   --------------------------------------------------------------------- */
body.nx5-context-page { padding-top: 64px !important; }

.nx5-contextbar {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1000;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 20px;
  color: var(--nx5-text);
  border-bottom: 1px solid var(--nx5-line);
  background: rgba(7, 11, 18, .94);
  backdrop-filter: blur(22px) saturate(130%);
  -webkit-backdrop-filter: blur(22px) saturate(130%);
  box-shadow: 0 10px 30px rgba(0,0,0,.14);
}
.nx5-context-left,
.nx5-context-actions,
.nx5-context-brand { display: flex; align-items: center; }
.nx5-context-left { min-width: 0; gap: 14px; }
.nx5-context-actions { gap: 9px; }
.nx5-context-brand { gap: 10px; color: inherit; text-decoration: none; }
.nx5-context-mark {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 17px;
  font-weight: 900;
  border-radius: 10px;
  background: linear-gradient(145deg, #9b6cff, #4f46e5 55%, #0891b2);
  box-shadow: 0 10px 25px rgba(76, 29, 149, .32);
}
.nx5-context-brand strong { display: block; color: #fff; font-size: 13px; line-height: 1.1; }
.nx5-context-brand small { display: block; margin-top: 3px; color: var(--nx5-muted); font-size: 9px; line-height: 1.1; }
.nx5-context-divider { width: 1px; height: 30px; background: var(--nx5-line); }
.nx5-context-title { min-width: 0; }
.nx5-context-title small { display: block; color: #a78bfa; font-size: 8px; font-weight: 820; letter-spacing: .14em; }
.nx5-context-title strong { display: block; max-width: 360px; margin-top: 3px; overflow: hidden; color: #eaf0f8; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.nx5-context-back,
.nx5-context-menu {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 13px;
  color: #dce4ef;
  font-size: 10px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid var(--nx5-line);
  border-radius: 10px;
  background: rgba(18, 28, 42, .76);
}
.nx5-context-menu { color: #fff; border-color: rgba(139,92,246,.3); background: linear-gradient(135deg, rgba(139,92,246,.9), rgba(109,40,217,.9)); cursor: pointer; }

.nx5-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1100;
  visibility: hidden;
  opacity: 0;
  background: rgba(2, 6, 12, .68);
  backdrop-filter: blur(4px);
  transition: .2s ease;
}
.nx5-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1110;
  width: min(380px, 92vw);
  display: flex;
  flex-direction: column;
  padding: 14px;
  overflow-y: auto;
  color: var(--nx5-text);
  border-left: 1px solid var(--nx5-line-strong);
  background: linear-gradient(180deg, #0a111c, #080d16);
  box-shadow: -30px 0 80px rgba(0,0,0,.42);
  transform: translateX(105%);
  transition: transform .22s ease;
}
body.nx5-drawer-open { overflow: hidden !important; }
body.nx5-drawer-open .nx5-drawer-backdrop { visibility: visible; opacity: 1; }
body.nx5-drawer-open .nx5-drawer { transform: translateX(0); }
.nx5-drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 5px 5px 14px; border-bottom: 1px solid var(--nx5-line); }
.nx5-drawer-close { width: 36px; height: 36px; display: grid; place-items: center; color: #cbd5e1; font-size: 24px; line-height: 1; border: 1px solid var(--nx5-line); border-radius: 10px; background: rgba(18,28,42,.72); cursor: pointer; }
.nx5-drawer-nav { display: grid; gap: 1px; padding: 4px 0 18px; }
.nx5-nav-group { display: grid; gap: 2px; }
.nx5-nav-label { margin: 16px 10px 5px; color: #667894; font-size: 9px; font-weight: 820; letter-spacing: .15em; }
.nx5-nav-link { min-height: 42px; display: flex; align-items: center; gap: 10px; padding: 0 11px; color: #aab6c8; font-size: 12px; text-decoration: none; border: 1px solid transparent; border-radius: 10px; }
.nx5-nav-link:hover { color: #fff; background: rgba(148,163,184,.07); }
.nx5-nav-link.active { color: #fff; border-color: rgba(139,92,246,.24); background: linear-gradient(90deg,rgba(124,58,237,.26),rgba(79,70,229,.08)); box-shadow: inset 3px 0 0 #9b6cff; }
.nx5-nav-icon { width: 20px; display: grid; place-items: center; color: #91a2bd; font-size: 15px; }
.nx5-nav-text { flex: 1; }
.nx5-nav-arrow { color: #5d6d84; }
.nx5-drawer-foot { margin-top: auto; display: flex; align-items: center; gap: 9px; padding: 12px; color: var(--nx5-muted); font-size: 10px; border: 1px solid var(--nx5-line); border-radius: 12px; background: rgba(18,28,42,.68); }
.nx5-online-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--nx5-green); box-shadow: 0 0 0 4px rgba(34,201,139,.09); }

/* Specialised workspace positioning */
body[data-module="product-category-management"] .pc22-shell,
body[data-module="product-gallery-manager"] .gm-shell,
body[data-module="product-variant-manager"] .pv23-shell { min-height: calc(100vh - 64px) !important; }
body[data-module="product-category-management"] .pc22-sidebar,
body[data-module="product-gallery-manager"] .gm-sidebar,
body[data-module="product-variant-manager"] .pv23-sidebar {
  top: 64px !important;
  height: calc(100vh - 64px) !important;
  border-color: var(--nx5-line) !important;
  background: linear-gradient(180deg, #09111b, #080d15) !important;
}
body[data-module="product-category-management"] .pc22-topbar,
body[data-module="product-gallery-manager"] .gm-topbar,
body[data-module="product-variant-manager"] .pv23-topbar {
  top: 64px !important;
  min-height: 72px !important;
  border-color: var(--nx5-line) !important;
  background: rgba(8, 13, 21, .88) !important;
  backdrop-filter: blur(18px) !important;
}

body[data-module="product-category-management"] :is(.pc22-panel,.pc22-product-card,.pc22-stats article,.pc22-principles article),
body[data-module="product-gallery-manager"] :is(.gm-panel,.gm-card,.gm-stat,.gm-product-card,.gm-gallery-card),
body[data-module="product-variant-manager"] :is(.pv23-panel,.pv23-card,.pv23-stat,.pv23-variant-card) {
  border-color: var(--nx5-line) !important;
  background: linear-gradient(180deg, rgba(15,24,37,.96), rgba(12,20,31,.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}

body[data-module="product-category-management"] :is(.pc22-topbar h1,.pc22-panel h3,.pc22-section-head h2),
body[data-module="product-gallery-manager"] :is(.gm-topbar h1,.gm-panel h2,.gm-section-head h2),
body[data-module="product-variant-manager"] :is(.pv23-topbar h1,.pv23-panel h2,.pv23-section-head h2) {
  color: var(--nx5-text) !important;
  letter-spacing: -.035em !important;
}

body[data-module="product-category-management"] :is(.pc22-topbar h1,.pc22-panel h3) { font-size: 18px !important; }
body[data-module="product-gallery-manager"] :is(.gm-topbar h1,.gm-panel h2) { font-size: 18px !important; }
body[data-module="product-variant-manager"] :is(.pv23-topbar h1,.pv23-panel h2) { font-size: 18px !important; }

/* Staff page */
body[data-module="staff-management"] .wrap {
  width: min(1180px, calc(100% - 40px)) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 34px 0 70px !important;
}
body[data-module="staff-management"] .top-bar { display: none !important; }
body[data-module="staff-management"] h1 { font-size: 32px !important; letter-spacing: -.045em !important; }
body[data-module="staff-management"] .subtitle { color: var(--nx5-muted) !important; font-size: 12px !important; }
body[data-module="staff-management"] .card {
  padding: 22px !important;
  border: 1px solid var(--nx5-line) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(15,24,37,.96), rgba(12,20,31,.96)) !important;
  box-shadow: var(--nx5-shadow-soft) !important;
}
body[data-module="staff-management"] .card h2 { color: #fff !important; font-size: 15px !important; }
body[data-module="staff-management"] .form-grid { gap: 15px !important; }
body[data-module="staff-management"] .form-grid label { color: var(--nx5-muted) !important; font-size: 10px !important; font-weight: 700 !important; }
body[data-module="staff-management"] table { overflow: hidden; border: 1px solid var(--nx5-line); border-radius: 12px; }

/* ---------------------------------------------------------------------
   LOGIN — same visual identity, no admin menu
   --------------------------------------------------------------------- */
body[data-module="login"] {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 20%, rgba(139,92,246,.22), transparent 28%),
    radial-gradient(circle at 84% 75%, rgba(6,182,212,.10), transparent 28%),
    linear-gradient(145deg, #060a11, #09111c) !important;
}
body[data-module="login"]::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .23;
  background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 34px 34px;
}
body[data-module="login"] .login-card {
  position: relative;
  max-width: 430px !important;
  padding: 40px !important;
  border: 1px solid var(--nx5-line-strong) !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, rgba(15,24,37,.94), rgba(10,17,28,.94)) !important;
  box-shadow: 0 34px 100px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.04) !important;
  backdrop-filter: blur(22px);
}
body[data-module="login"] .login-logo-mark { background: linear-gradient(145deg, #9b6cff, #4f46e5 55%, #0891b2) !important; box-shadow: 0 12px 28px rgba(76,29,149,.34); }
body[data-module="login"] h1 { font-size: 25px !important; letter-spacing: -.04em; }
body[data-module="login"] .login-subtitle { color: var(--nx5-muted) !important; line-height: 1.6; }
body[data-module="login"] label { color: #a9b4c5 !important; font-size: 11px !important; font-weight: 680; }
body[data-module="login"] input { min-height: 46px; background: rgba(7,13,22,.88) !important; }
body[data-module="login"] button[type="submit"] { min-height: 47px; border-radius: 11px !important; background: linear-gradient(135deg,#8b5cf6,#6d28d9) !important; box-shadow: 0 12px 30px rgba(91,33,182,.26); }

/* ---------------------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------------------- */
@media (max-width: 1080px) {
  :root { --nx5-sidebar-width: 246px; }
  body[data-module] .nx-content,
  body[data-module="products"] .page-content { padding-right: 18px !important; padding-left: 18px !important; }
}

@media (max-width: 860px) {
  body[data-module] .nx-app,
  body[data-module="products"] .app-shell,
  body[data-module="orders"] .nbp-shell,
  body[data-module="customers"] .nb-shell,
  body[data-module="affiliate-partner"] .nbp-shell { display: block !important; }

  body[data-module] .nx-sidebar,
  body[data-module="products"] .sidebar,
  body[data-module="orders"] .nbp-sidebar,
  body[data-module="customers"] .nb-sidebar,
  body[data-module="affiliate-partner"] .nbp-sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: min(286px, 88vw) !important;
    height: 100vh !important;
    transform: translateX(-105%);
    transition: transform .22s ease !important;
    box-shadow: 25px 0 70px rgba(0,0,0,.42) !important;
  }
  body[data-module] .nx-sidebar.open,
  body[data-module="products"].sidebar-open .sidebar,
  body[data-module="products"] .sidebar.open,
  body[data-module="orders"] .nbp-sidebar.is-open,
  body[data-module="orders"] .nbp-sidebar.open,
  body[data-module="customers"] .nb-sidebar.is-open,
  body[data-module="customers"] .nb-sidebar.open,
  body[data-module="affiliate-partner"] .nbp-sidebar.open { transform: translateX(0) !important; }

  body[data-module] .nx-content { padding: 18px 14px 50px !important; }
  body[data-module="products"] .page-content { padding: 16px 14px 50px !important; }
  body[data-module="affiliate-partner"] .nbp-main { padding-right: 14px !important; padding-left: 14px !important; }

  .nx5-context-title { display: none; }
  .nx5-context-divider { display: none; }
  .nx5-context-back { display: none; }

  body[data-module="product-category-management"] .pc22-shell,
  body[data-module="product-gallery-manager"] .gm-shell,
  body[data-module="product-variant-manager"] .pv23-shell { display: block !important; }

  body[data-module="product-category-management"] .pc22-sidebar,
  body[data-module="product-gallery-manager"] .gm-sidebar,
  body[data-module="product-variant-manager"] .pv23-sidebar {
    position: relative !important;
    top: 0 !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
  }

  body[data-module="product-category-management"] .pc22-topbar,
  body[data-module="product-gallery-manager"] .gm-topbar,
  body[data-module="product-variant-manager"] .pv23-topbar { top: 64px !important; }
}

@media (max-width: 620px) {
  .nx5-contextbar { padding: 0 12px; }
  .nx5-context-brand small { display: none; }
  .nx5-context-menu { padding: 0 11px; }
  .nx5-context-menu span { display: inline; }
  body[data-module="staff-management"] .wrap { width: min(100% - 24px, 1180px) !important; padding-top: 24px !important; }
  body[data-module="staff-management"] .form-grid { grid-template-columns: 1fr !important; }
  body[data-module="login"] .login-card { margin: 16px; padding: 30px 24px !important; }
  body[data-module] .nx-page-title h1,
  body[data-module="products"] .page-header h1,
  body[data-module="orders"] .orders-hero-copy h1,
  body[data-module="customers"] .nb-page-heading h1,
  body[data-module="affiliate-partner"] .nbp-heading h1 { font-size: 26px !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.nexus-unified-v5 *,
  body.nexus-unified-v5 *::before,
  body.nexus-unified-v5 *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

/* =====================================================================
   V5.1 — UNIFIED SIDEBAR ADMIN PROFILE
   One profile component for every primary menu and the context drawer.
   ===================================================================== */
body.nexus-profile-unified-v5-1[data-module] .nx-sidebar,
body.nexus-profile-unified-v5-1[data-module="products"] .sidebar,
body.nexus-profile-unified-v5-1[data-module="orders"] .nbp-sidebar,
body.nexus-profile-unified-v5-1[data-module="customers"] .nb-sidebar,
body.nexus-profile-unified-v5-1[data-module="affiliate-partner"] .nbp-sidebar {
  overflow: hidden !important;
}

body.nexus-profile-unified-v5-1[data-module] .nx-sidebar > .nx-nav,
body.nexus-profile-unified-v5-1[data-module="products"] .sidebar > .sidebar-nav,
body.nexus-profile-unified-v5-1[data-module="orders"] .nbp-sidebar > .nbp-nav,
body.nexus-profile-unified-v5-1[data-module="customers"] .nb-sidebar > .nb-nav,
body.nexus-profile-unified-v5-1[data-module="affiliate-partner"] .nbp-sidebar > .nbp-nav {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  padding-right: 2px !important;
  padding-bottom: 8px !important;
}

.nx5-sidebar-profile {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 66px !important;
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 8px 0 0 !important;
  padding: 11px 12px !important;
  overflow: hidden !important;
  color: #f8fafc !important;
  text-align: left !important;
  border: 1px solid rgba(148, 163, 184, .14) !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg, rgba(18, 28, 42, .96), rgba(15, 24, 37, .96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 8px 24px rgba(0, 0, 0, .12) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
  transition: border-color .16s ease, background .16s ease, transform .16s ease !important;
}

.nx5-sidebar-profile:hover {
  border-color: rgba(139, 92, 246, .34) !important;
  background: linear-gradient(180deg, rgba(22, 33, 49, .98), rgba(17, 27, 41, .98)) !important;
  transform: translateY(-1px);
}

.nx5-sidebar-profile:active { transform: translateY(0); }

.nx5-profile-status {
  position: relative !important;
  width: 9px !important;
  height: 9px !important;
  flex: 0 0 9px !important;
  align-self: flex-start !important;
  margin-top: 9px !important;
  border: 2px solid rgba(6, 182, 212, .18) !important;
  border-radius: 999px !important;
  background: #10d995 !important;
  box-shadow: 0 0 0 3px rgba(16, 217, 149, .10), 0 0 14px rgba(16, 217, 149, .42) !important;
}

.nx5-profile-copy {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  display: grid !important;
  gap: 5px !important;
  text-align: left !important;
}

.nx5-profile-copy strong,
.nx5-profile-copy small {
  display: block !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  font-family: var(--nx5-font) !important;
  font-style: normal !important;
  line-height: 1.2 !important;
}

.nx5-profile-copy strong {
  color: #f8fafc !important;
  font-size: 14px !important;
  font-weight: 730 !important;
  letter-spacing: -.018em !important;
}

.nx5-profile-copy small {
  color: #76859b !important;
  font-size: 12px !important;
  font-weight: 520 !important;
}

.nx5-drawer {
  overflow: hidden !important;
}

.nx5-drawer-nav {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding-right: 2px !important;
}

.nx5-drawer-profile {
  margin-top: 10px !important;
}

@media (max-width: 860px) {
  .nx5-sidebar-profile {
    min-height: 64px !important;
    margin-top: 7px !important;
  }
}
