/* ============================================================
   APEX / TRADEXXA — Futuristic AI Fintech User Panel Theme
   Dark green / black + neon lime. Roboto. Mobile-first.
   Loaded AFTER app.css so it overrides the legacy gold theme
   for the USER panel + AUTH pages only. Admin untouched.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700;800&family=Roboto:wght@300;400;500;700;900&display=swap');

:root {
  --member-bg: #0A0A0A;
  --member-card: #1A1A1A;
  --member-primary: #FFC107;
  --member-primary-bright: #FFD54F;
  --member-border: #3E2F00;
  --member-text: #FFFFFF;
  --member-muted: #9E9E9E;
  --member-shadow: 0 18px 50px rgba(0,0,0,.45);
  --nx-bg: #0F0F0F;
  --nx-bg2: #121212;
  --nx-card: #1E1E1E;
  --nx-card2: #242424;
  --nx-neon: #FFC107;
  --nx-neon2: #FFD54F;
  --nx-deep: #2A1F00;
  --nx-border: rgba(255,193,7,0.14);
  --nx-border-strong: rgba(255,193,7,0.32);
  --nx-text: #FFFFFF;
  --nx-text2: #B0B0B0;
  --nx-muted: #7A7A7A;
  --nx-success: #FFC107;
  --nx-warning: #FFC107;
  --nx-danger: #FF5252;
  --nx-info: #FFD54F;
  --nx-radius: 18px;
  --nx-radius-sm: 12px;
  --nx-glow: 0 0 24px rgba(255,193,7,0.16);
  --nx-sidebar-w: 264px;
  --nx-sidebar-wc: 84px;
  --nx-header-h: 68px;
}

/* ---------- base ---------- */
body.nx-body {
  --brand: var(--nx-neon);
  --brand-soft: var(--nx-neon);
  --brand-dark: #B38600;
  --ink: var(--nx-text);
  --muted: var(--nx-text2);
  --panel: rgba(26,26,26,.95);
  --panel-strong: var(--nx-card);
  --line: var(--nx-border);
  --orbit-black: var(--nx-bg);
  --orbit-black-2: var(--nx-card2);
  --orbit-gradient: linear-gradient(135deg,var(--nx-neon),var(--nx-neon2));
  font-family: 'Roboto', system-ui, -apple-system, sans-serif !important;
  background:
    radial-gradient(900px 480px at 85% -10%, rgba(255,193,7,0.08), transparent 60%),
    radial-gradient(760px 520px at -10% 20%, rgba(60,45,0,0.35), transparent 60%),
    var(--nx-bg) !important;
  color: var(--nx-text) !important;
  font-weight: 400;
  overflow-x: hidden;
}
body.nx-body a { color: var(--nx-neon); }
body.nx-body a:hover { color: #d4ff6a; }
body.nx-body .text-muted, body.nx-body .text-secondary { color: var(--nx-text2) !important; }
body.nx-body h1, body.nx-body h2, body.nx-body h3,
body.nx-body .nx-stat-val, body.nx-body .nx-package-amt,
body.nx-auth h1, body.nx-auth h2 { font-family:'Orbitron','Roboto',sans-serif; letter-spacing:.015em; }
.nx-skip-link { position:fixed; left:12px; top:-60px; z-index:2000; padding:10px 14px; border-radius:10px; background:var(--nx-neon); color:#071006 !important; font-weight:700; transition:top .15s; }
.nx-skip-link:focus { top:12px; }

/* ---------- app shell ---------- */
.nx-shell { min-height: 100vh; }
.nx-sidebar {
  position: fixed; inset: 0 auto 0 0; width: var(--nx-sidebar-w); z-index: 1040;
  height: 100vh; height: 100dvh; max-height: 100vh; max-height: 100dvh;
  display: flex; flex-direction: column;
  overflow: hidden; overflow-x: hidden;
  background: rgba(9,18,7,0.92);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border-right: 1px solid var(--nx-border);
  transition: transform .28s ease, width .28s ease, margin .28s ease;
}
.nx-brand { display:flex; align-items:center; gap:12px; padding:18px 18px 14px; text-decoration:none; flex-shrink: 0; }
.nx-brand-mark {
  width:40px; height:40px; border-radius:12px; display:grid; place-items:center; flex:0 0 40px;
  background: linear-gradient(135deg, var(--nx-neon), var(--nx-neon2));
  color:#071006; font-weight:900; font-size:1.1rem;
  box-shadow: 0 0 24px rgba(255,193,7,0.35);
  overflow:hidden;
}
.nx-brand-mark img { width:100%; height:100%; object-fit:cover; }
.nx-brand-name { color: var(--nx-text); font-weight:900; letter-spacing:.04em; line-height:1.1; }
.nx-brand-name small { display:block; color:var(--nx-text2); font-weight:500; font-size:.68rem; letter-spacing:.22em; }
.nx-profile {
  margin: 4px 14px 12px; padding:14px; border-radius: var(--nx-radius);
  background: rgba(13,25,8,0.75); border:1px solid var(--nx-border);
  display:flex; gap:12px; align-items:center; flex-shrink: 0;
}
.nx-avatar {
  width:48px; height:48px; border-radius:50%; flex:0 0 48px; display:grid; place-items:center;
  font-weight:900; color:#071006; background: linear-gradient(135deg, var(--nx-neon), var(--nx-neon2));
  box-shadow: var(--nx-glow); overflow:hidden;
}
.nx-avatar img { width:100%; height:100%; object-fit:cover; }
.nx-profile-name { font-weight:700; font-size:.92rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nx-profile-id { color:var(--nx-neon); font-size:.75rem; font-weight:500; }
.nx-profile-status { font-size:.7rem; color:var(--nx-text2); }
.nx-nav {
  flex: 1 1 auto; min-height: 0;
  overflow-y: auto; overflow-x: hidden;
  padding: 4px 8px 16px 12px;
  scrollbar-width: thin; scrollbar-color: rgba(255,193,7,0.22) transparent;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}
.nx-nav::-webkit-scrollbar { width: 4px; height: 4px; }
.nx-nav::-webkit-scrollbar-track { background: transparent; }
.nx-nav::-webkit-scrollbar-thumb { background: rgba(255,193,7,0.20); border-radius: 999px; border: 1px solid transparent; background-clip: padding-box; }
.nx-nav::-webkit-scrollbar-thumb:hover { background: rgba(255,193,7,0.38); border: 1px solid transparent; background-clip: padding-box; }
.nx-nav::-webkit-scrollbar-corner { background: transparent; }
.nx-nav-label { color:var(--nx-muted); font-size:.68rem; font-weight:700; letter-spacing:.18em; padding:12px 10px 6px; }
.nx-link {
  display:flex; align-items:center; gap:12px; padding:11px 12px; margin:3px 0;
  border-radius:12px; color:var(--nx-text2) !important; text-decoration:none !important;
  border:1px solid transparent; font-weight:500; font-size:.9rem; min-height:44px;
  transition: all .18s ease;
}
.nx-link i, .nx-link svg { width:20px; text-align:center; font-size:1rem; flex:0 0 20px; }
.nx-link:hover { color:var(--nx-text) !important; background:rgba(255,193,7,0.06); border-color:var(--nx-border); transform:translateX(2px); }
.nx-link.active {
  color: var(--nx-neon) !important;
  background: rgba(255,193,7,0.10) !important;
  border:1px solid rgba(255,193,7,0.25) !important;
  box-shadow: 0 0 20px rgba(255,193,7,0.10);
  font-weight:700;
}
.nx-sidebar-foot {
  flex-shrink: 0; margin-top: auto;
  padding:12px 14px 16px; border-top:1px solid var(--nx-border);
  background: rgba(9,18,7,0.92);
}
.nx-collapse-btn { width:100%; }

/* main */
.nx-main { margin-left: var(--nx-sidebar-w); min-height:100vh; display:flex; flex-direction:column; transition: margin .28s ease; }
body.nx-collapsed .nx-main { margin-left: var(--nx-sidebar-wc); }
body.nx-collapsed .nx-sidebar { width: var(--nx-sidebar-wc); }
body.nx-collapsed .nx-sidebar .nx-brand-name,
body.nx-collapsed .nx-sidebar .nx-profile-meta,
body.nx-collapsed .nx-sidebar .nx-link span,
body.nx-collapsed .nx-sidebar .nx-nav-label,
body.nx-collapsed .nx-sidebar .nx-sidebar-foot .nx-collapse-btn span { display:none; }
body.nx-collapsed .nx-sidebar .nx-link { justify-content:center; }
body.nx-collapsed .nx-sidebar .nx-profile { justify-content:center; }

/* header */
.nx-header {
  position:sticky; top:0; z-index:1030; min-height:var(--nx-header-h);
  display:flex; align-items:center; gap:12px; padding:10px 22px;
  background: rgba(5,10,4,0.85); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
  border-bottom:1px solid var(--nx-border);
}
.nx-icon-btn {
  width:44px; height:44px; border-radius:12px; display:inline-grid; place-items:center;
  background:var(--nx-card); border:1px solid var(--nx-border); color:var(--nx-text);
  transition: all .18s ease;
}
.nx-icon-btn:hover { border-color:var(--nx-border-strong); box-shadow:var(--nx-glow); color:var(--nx-neon); }
.nx-page-title { margin:0; font-size:1.15rem; font-weight:700; }
.nx-breadcrumb { color:var(--nx-muted); font-size:.78rem; }
.nx-header-spacer { flex:1; }
.nx-mobile-brand { display:none; text-decoration:none; }
.nx-mobile-brand .nx-brand-mark { width:40px; height:40px; flex-basis:40px; }
.nx-wallet-pill {
  display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px;
  background:rgba(255,193,7,0.08); border:1px solid var(--nx-border); color:var(--nx-neon);
  font-weight:700; font-size:.85rem; text-decoration:none !important; white-space:nowrap;
}
.nx-bell { position:relative; }
.nx-dot { position:absolute; top:8px; right:9px; width:9px; height:9px; border-radius:50%; background:var(--nx-danger); border:2px solid var(--nx-bg); }
.nx-user-chip { display:flex; align-items:center; gap:10px; padding:5px 12px 5px 5px; border-radius:999px; background:var(--nx-card); border:1px solid var(--nx-border); }
.nx-user-chip .nx-avatar { width:34px; height:34px; flex-basis:34px; font-size:.8rem; }
.nx-user-chip-name { font-size:.85rem; font-weight:500; max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color: var(--nx-text) !important; }
.nx-user-chip:hover .nx-user-chip-name { color: var(--nx-neon) !important; }
.nx-user-chip[aria-expanded="true"] .nx-user-chip-name { color: var(--nx-neon) !important; }

/* content */
.nx-content { padding:22px; flex:1; width:100%; max-width:1460px; margin:0 auto; }
.nx-welcome h1 { font-size:clamp(1.4rem,2.6vw,2rem); font-weight:900; margin:0; }
.nx-welcome h1 .nx-hi { color:var(--nx-neon); }
.nx-welcome p { color:var(--nx-text2); margin:4px 0 0; }
.nx-ticker {
  margin-top:12px; border:1px solid var(--nx-border); border-radius:12px; overflow:hidden;
  background:rgba(13,25,8,.6); color:var(--nx-text2); font-size:.85rem;
  display:flex; align-items:center;
}
.nx-ticker-track { display:inline-flex; gap:64px; white-space:nowrap; padding:9px 0; animation: nx-scroll 28s linear infinite; }
@keyframes nx-scroll { from { transform:translateX(0);} to { transform:translateX(-50%);} }

/* cards */
.nx-card {
  background: linear-gradient(180deg, rgba(255,193,7,0.04), transparent 40%), var(--nx-card) !important;
  border:1px solid var(--nx-border) !important; border-radius:var(--nx-radius) !important;
  color:var(--nx-text) !important; box-shadow: 0 18px 50px rgba(0,0,0,.35) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.nx-card.elev { background: var(--nx-card2) !important; }
.nx-card.hoverable:hover { transform:translateY(-2px); border-color:var(--nx-border-strong) !important; box-shadow:var(--nx-glow), 0 22px 60px rgba(0,0,0,.4) !important; }
.nx-card-h { padding:16px 18px 0; display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.nx-card-t { font-size:.72rem; font-weight:700; letter-spacing:.16em; color:var(--nx-text2); text-transform:uppercase; }
.nx-card-b { padding:14px 18px 18px; }
.nx-stat-grid { display:grid; gap:14px; grid-template-columns:repeat(4, minmax(0,1fr)); }
.nx-stat { position:relative; overflow:hidden; }
.nx-stat::after { content:""; position:absolute; inset:auto -30% -60% auto; width:180px; height:180px; border-radius:50%; background:radial-gradient(circle, rgba(255,193,7,.12), transparent 70%); pointer-events:none; }
.nx-stat-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.nx-stat-ic { width:42px; height:42px; border-radius:12px; display:grid; place-items:center; background:rgba(255,193,7,.1); border:1px solid var(--nx-border); color:var(--nx-neon); }
.nx-stat-label { font-size:.72rem; letter-spacing:.14em; color:var(--nx-text2); font-weight:700; margin-top:12px; }
.nx-stat-val { font-size:1.35rem; font-weight:900; margin-top:4px; overflow-wrap:anywhere; }
.nx-stat-val.neon { color:var(--nx-neon); text-shadow:0 0 18px rgba(255,193,7,.3); }
.nx-stat-sub { color:var(--nx-muted); font-size:.8rem; margin-top:4px; }
.nx-stat-link { display:inline-flex; align-items:center; gap:6px; margin-top:10px; font-size:.8rem; font-weight:700; }
.nx-progress { height:10px; border-radius:999px; background:rgba(255,255,255,.07); border:1px solid var(--nx-border); overflow:hidden; }
.nx-progress > span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg, var(--nx-neon2), var(--nx-neon)); box-shadow:0 0 16px rgba(255,193,7,.4); }
.nx-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; font-size:.72rem; font-weight:700; letter-spacing:.06em; border:1px solid var(--nx-border); }
.nx-badge.on { color:#071006; background:var(--nx-neon); border-color:var(--nx-neon); box-shadow:var(--nx-glow); }
.nx-badge.off { color:var(--nx-text2); background:rgba(255,255,255,.05); }
.nx-badge.pending { color:#1a1400; background:var(--nx-warning); border-color:var(--nx-warning); }
.nx-badge.danger { color:#fff; background:rgba(255,85,85,.16); border-color:rgba(255,85,85,.5); }
.nx-badge.info { color:#04121a; background:var(--nx-info); border-color:var(--nx-info); }
.nx-package-hero { display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.nx-package-amt { font-size:2rem; font-weight:900; color:var(--nx-neon); text-shadow:0 0 22px rgba(255,193,7,.3); }
.nx-data-row { display:flex; justify-content:space-between; gap:14px; padding:10px 12px; border:1px solid var(--nx-border); border-radius:12px; background:rgba(255,193,7,.04); }
.nx-data-row span { color:var(--nx-text2); }
.nx-data-row strong { text-align:right; overflow-wrap:anywhere; }
.nx-mini-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.nx-mini-grid > div, .nx-income-strip > div { padding:13px; border:1px solid var(--nx-border); border-radius:12px; background:rgba(255,193,7,.035); }
.nx-mini-grid span, .nx-income-strip span { display:block; margin-bottom:5px; color:var(--nx-text2); font-size:.7rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.nx-mini-grid strong, .nx-income-strip strong { color:var(--nx-neon); font-family:'Orbitron','Roboto',sans-serif; font-size:.9rem; overflow-wrap:anywhere; }
.nx-income-strip { display:grid; grid-template-columns:2fr 1fr 1fr; gap:10px; }

/* buttons */
body.nx-body .btn-nx, body.nx-auth .btn-nx {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--nx-neon) !important; color:#071006 !important; border:1px solid var(--nx-neon) !important;
  font-weight:700 !important; border-radius:12px !important; padding:10px 18px !important; min-height:44px;
  box-shadow:var(--nx-glow); transition:all .18s ease; text-decoration:none;
}
body.nx-body .btn-nx:hover, body.nx-auth .btn-nx:hover { filter:brightness(1.06); transform:translateY(-1px); box-shadow:0 0 28px rgba(255,193,7,.28); color:#071006 !important; }
body.nx-body .btn-ghost, body.nx-auth .btn-ghost {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:transparent !important; color:var(--nx-text) !important; border:1px solid var(--nx-border-strong) !important;
  border-radius:12px !important; padding:10px 18px !important; min-height:44px; font-weight:500; text-decoration:none;
}
body.nx-body .btn-ghost:hover, body.nx-auth .btn-ghost:hover { border-color:var(--nx-neon) !important; color:var(--nx-neon) !important; box-shadow:var(--nx-glow); }
body.nx-body .btn-danger-nx { background:transparent !important; border:1px solid rgba(255,85,85,.5) !important; color:#ffb3b3 !important; border-radius:12px !important; min-height:44px; }

/* forms */
body.nx-body .nx-label, body.nx-auth .nx-label { color:var(--nx-text2); font-size:.82rem; font-weight:500; margin-bottom:6px; display:block; }
body.nx-body .form-control, body.nx-body .form-select,
body.nx-auth .form-control, body.nx-auth .form-select {
  background:#0a1207 !important; border:1px solid var(--nx-border) !important; color:var(--nx-text) !important;
  border-radius:12px !important; min-height:44px;
}
body.nx-body .form-control:focus, body.nx-body .form-select:focus,
body.nx-auth .form-control:focus, body.nx-auth .form-select:focus {
  border-color:var(--nx-neon) !important; box-shadow:0 0 15px rgba(255,193,7,0.15) !important; background:#0a1207 !important; color:var(--nx-text) !important;
}
body.nx-body .input-group-text { background:var(--nx-card2) !important; border-color:var(--nx-border) !important; color:var(--nx-text2) !important; }
body.nx-body .invalid-feedback { color:#ff9a9a; }

/* Legacy member views inherit the same design system while their existing
   forms, routes and business workflows remain untouched. */
body.nx-body .card {
  background:linear-gradient(180deg,rgba(255,193,7,.035),transparent 42%),var(--nx-card) !important;
  border:1px solid var(--nx-border) !important;
  border-radius:var(--nx-radius) !important;
  color:var(--nx-text) !important;
  box-shadow:var(--member-shadow) !important;
  overflow:hidden;
}
body.nx-body .card-header, body.nx-body .card-footer {
  background:rgba(255,193,7,.035) !important;
  border-color:var(--nx-border) !important;
  padding:16px 18px;
}
body.nx-body .card-body { padding:18px; }
body.nx-body .card-title { color:var(--nx-text); font-family:'Orbitron','Roboto',sans-serif; font-weight:700; }
body.nx-body .form-label { color:var(--nx-text2); font-size:.82rem; font-weight:500; }
body.nx-body .form-control::placeholder { color:var(--nx-muted); opacity:1; }
body.nx-body .form-control[readonly], body.nx-body .form-control:disabled,
body.nx-body .form-select:disabled { background:#0d170a !important; color:var(--nx-text2) !important; opacity:1; }
body.nx-body .form-check-input { background-color:#0a1207; border-color:var(--nx-border-strong); }
body.nx-body .form-check-input:checked { background-color:var(--nx-neon); border-color:var(--nx-neon); }
body.nx-body .btn-primary {
  background:var(--nx-neon) !important; border-color:var(--nx-neon) !important; color:#071006 !important;
  border-radius:12px; min-height:44px; font-weight:700; box-shadow:var(--nx-glow);
}
body.nx-body .btn-primary:hover { filter:brightness(1.08); box-shadow:0 0 28px rgba(255,193,7,.25); }
body.nx-body .btn-outline-primary, body.nx-body .btn-outline-light {
  background:transparent !important; border-color:var(--nx-border-strong) !important; color:var(--nx-text) !important;
  border-radius:12px; min-height:44px;
}
body.nx-body .btn-outline-primary:hover, body.nx-body .btn-outline-light:hover { border-color:var(--nx-neon) !important; color:var(--nx-neon) !important; box-shadow:var(--nx-glow); }
body.nx-body .btn-sm { min-height:38px; }
body.nx-body .alert { border-radius:12px; border:1px solid var(--nx-border); background:var(--nx-card2); color:var(--nx-text); }
body.nx-body .alert-success { border-color:rgba(183,255,0,.42); background:rgba(183,255,0,.09); }
body.nx-body .alert-info { border-color:rgba(85,217,255,.38); background:rgba(85,217,255,.08); }
body.nx-body .alert-warning { border-color:rgba(255,216,74,.42); background:rgba(255,216,74,.09); }
body.nx-body .alert-danger { border-color:rgba(255,85,85,.45); background:rgba(255,85,85,.09); }
body.nx-body .badge.bg-info, body.nx-body .badge.bg-success, body.nx-body .orbit-chip {
  color:#071006 !important; background:var(--nx-neon) !important; border:1px solid var(--nx-neon) !important;
}
body.nx-body .border, body.nx-body .border-bottom { border-color:var(--nx-border) !important; }
body.nx-body hr { border-color:var(--nx-border); opacity:1; }
body.nx-body dt { color:var(--nx-text2); }
body.nx-body dd { color:var(--nx-text); }
body.nx-body .progress { background:rgba(255,255,255,.08); border:1px solid var(--nx-border); }
body.nx-body .progress-bar { background:linear-gradient(90deg,var(--nx-neon2),var(--nx-neon)); }
body.nx-body .orbit-tab-card { border-color:var(--nx-border-strong); border-radius:12px; background:rgba(255,193,7,.035); box-shadow:none; }
body.nx-body .orbit-tab-card i { color:#071006; background:var(--nx-neon); border-radius:10px; }
body.nx-body .orbit-tab-card:hover, body.nx-body .orbit-tab-card.active { color:#071006 !important; background:var(--nx-neon); box-shadow:var(--nx-glow); }
body.nx-body .orbit-tab-card:hover i, body.nx-body .orbit-tab-card.active i { color:var(--nx-neon); background:#071006; }
body.nx-body .package-status-grid > div, body.nx-body .wallet-transfer-summary > div,
body.nx-body .wallet-transfer-confirm-grid > div { border-color:var(--nx-border); border-radius:12px; background:rgba(255,193,7,.035); }
body.nx-body .package-status-grid span, body.nx-body .wallet-transfer-summary span,
body.nx-body .wallet-transfer-confirm-grid span { color:var(--nx-text2); }
body.nx-body .mlm-tree-shell, body.nx-body .binary-tree-shell { background-color:#070d05; border-color:var(--nx-border); }
body.nx-body .mlm-tree-shell { cursor:grab; overscroll-behavior:contain; touch-action:none; }
body.nx-body .mlm-tree-shell:active { cursor:grabbing; }
body.nx-body .mlm-tree-canvas { transform-origin:top center; transition:transform .16s ease; }
body.nx-body .mlm-tree-kicker, body.nx-body .mlm-tree-member small { color:var(--nx-neon); }
body.nx-body .mlm-tree-avatar { border-color:var(--nx-border-strong); background:linear-gradient(135deg,var(--nx-neon),#B38600); box-shadow:var(--nx-glow); color:#071006; }
body.nx-body .mlm-tree-member { border-color:var(--nx-border); background:rgba(11,29,6,.94); }
body.nx-body .mlm-tree-node.is-root .mlm-tree-member { border-color:var(--nx-border-strong); background:linear-gradient(180deg,rgba(183,255,0,.13),rgba(11,29,6,.96)); }
body.nx-body .mlm-tree-toggle { border-color:var(--nx-border-strong); color:var(--nx-neon); background:#0b1608; }

.dashboard-popup-copy { padding:18px; }
.dashboard-popup-copy h2 { margin:0 40px 8px 0; color:var(--nx-text); font-size:1.15rem; }
.dashboard-popup-copy p { color:var(--nx-text2); margin-bottom:16px; }
.nx-ticket-thread { display:grid; gap:12px; }
.nx-ticket-message { width:min(760px,92%); padding:14px; border:1px solid var(--nx-border); border-radius:14px; background:rgba(255,255,255,.025); }
.nx-ticket-message.mine { margin-left:auto; background:rgba(255,193,7,.06); border-color:var(--nx-border-strong); }
.nx-notification { display:grid; grid-template-columns:auto 1fr; gap:12px; padding:14px 0; border-bottom:1px solid var(--nx-border); }
.nx-notification:last-child { border-bottom:0; }
.nx-notification.unread { color:var(--nx-text); }
.nx-notification.unread::after { content:""; width:7px; height:7px; border-radius:50%; background:var(--nx-neon); box-shadow:var(--nx-glow); align-self:center; }
.nx-download-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; }
.nx-download { display:flex; align-items:center; gap:12px; min-height:76px; padding:14px; border:1px solid var(--nx-border); border-radius:14px; background:rgba(255,193,7,.035); color:var(--nx-text) !important; text-decoration:none !important; }
.nx-download:hover { border-color:var(--nx-neon); transform:translateY(-1px); }
.nx-download small { display:block; color:var(--nx-text2); }
.nx-settings-grid { display:grid; gap:12px; }
.nx-settings-grid > div { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; padding:14px; border:1px solid var(--nx-border); border-radius:14px; background:rgba(255,193,7,.025); }
.nx-settings-grid p { color:var(--nx-text2); font-size:.85rem; }
.nx-package-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; }
.nx-package-option { position:relative; }
.nx-package-option.disabled { opacity:.72; }
.nx-package-facts { display:grid; gap:8px; }
.nx-package-facts > span { display:flex; justify-content:space-between; gap:12px; padding-bottom:8px; border-bottom:1px solid rgba(255,193,7,.08); }
.nx-package-facts small { color:var(--nx-text2); }
.nx-package-facts strong { color:var(--nx-text); text-align:right; }

/* tables */
.nx-table-wrap { border:1px solid var(--nx-border); border-radius:var(--nx-radius); overflow:hidden; background:var(--nx-card); }
body.nx-body .table { color:var(--nx-text); margin:0; }
body.nx-body .table thead th { color:var(--nx-text2); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; border-bottom:1px solid var(--nx-border); background:rgba(255,193,7,.04); padding:12px 14px; white-space:nowrap; }
body.nx-body .table tbody td { padding:12px 14px; border-bottom:1px solid rgba(255,193,7,.08); vertical-align:middle; }
body.nx-body .table tbody tr:hover { background:rgba(255,193,7,.04); }
body.nx-body .pagination .page-link { background:var(--nx-card); border-color:var(--nx-border); color:var(--nx-text); min-width:44px; min-height:44px; display:inline-grid; place-items:center; }
body.nx-body .pagination .page-item.active .page-link { background:var(--nx-neon); border-color:var(--nx-neon); color:#071006; font-weight:700; }

/* empty / skeleton / toast */
.nx-empty { text-align:center; padding:36px 20px; color:var(--nx-text2); }
.nx-empty-ic { width:60px; height:60px; margin:0 auto 12px; border-radius:18px; display:grid; place-items:center; background:rgba(255,193,7,.08); border:1px solid var(--nx-border); color:var(--nx-neon); font-size:1.4rem; }
.nx-skel { border-radius:var(--nx-radius); border:1px solid var(--nx-border); background:linear-gradient(100deg, var(--nx-card) 40%, var(--nx-card2) 50%, var(--nx-card) 60%); background-size:200% 100%; animation:nx-shimmer 1.4s infinite; min-height:120px; }
@keyframes nx-shimmer { to { background-position:-200% 0; } }
body.nx-body .modal-content { background:var(--nx-card2) !important; border:1px solid var(--nx-border-strong) !important; border-radius:18px !important; color:var(--nx-text) !important; }
body.nx-body .modal-header, body.nx-body .modal-footer { border-color:var(--nx-border) !important; }
body.nx-body .dropdown-menu { background:var(--nx-card2) !important; border:1px solid var(--nx-border) !important; border-radius:14px !important; box-shadow:0 20px 60px rgba(0,0,0,.5) !important; }
body.nx-body .dropdown-item { color:var(--nx-text) !important; border-radius:8px; }
body.nx-body .dropdown-item:hover { background:rgba(255,193,7,.1) !important; color:var(--nx-neon) !important; }

/* charts */
.nx-chart-box { position:relative; height:280px; }
.nx-chart-box canvas { max-height:280px; }
.nx-legend { display:flex; gap:14px; flex-wrap:wrap; color:var(--nx-text2); font-size:.8rem; }

/* tree */
.nx-tree-shell { overflow:auto; border:1px solid var(--nx-border); border-radius:var(--nx-radius); background:radial-gradient(circle at top, rgba(255,193,7,.06), transparent 45%), #070d05; min-height:420px; }
.nx-tnode { border:1px solid var(--nx-border); background:var(--nx-card); border-radius:14px; padding:10px 12px; min-width:150px; text-align:center; }
.nx-tnode.root { border-color:var(--nx-border-strong); box-shadow:var(--nx-glow); }
.nx-tnode .t-name { font-weight:700; font-size:.85rem; }
.nx-tnode .t-id { color:var(--nx-neon); font-size:.72rem; }

/* ---------- auth / login ---------- */
body.nx-auth {
  font-family:'Roboto',system-ui,sans-serif !important; color:var(--nx-text);
  background: radial-gradient(1000px 600px at 80% 10%, rgba(255,193,7,.08), transparent 60%), radial-gradient(800px 600px at 10% 90%, rgba(25,50,13,.6), transparent 60%), var(--nx-bg);
  min-height:100vh;
}
.nx-login-wrap { min-height:100vh; display:grid; grid-template-columns:1.1fr .9fr; }
.nx-login-visual { position:relative; overflow:hidden; min-height:100vh; display:flex; align-items:flex-end; }
.nx-login-visual img.nx-robot { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.nx-login-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(5,10,4,.15) 0%, rgba(5,10,4,.55) 70%, var(--nx-bg) 100%), linear-gradient(0deg, rgba(5,10,4,.75), transparent 55%), radial-gradient(600px 400px at 30% 40%, rgba(255,193,7,.14), transparent 65%); }
.nx-visual-copy { position:relative; z-index:2; padding:44px; max-width:560px; }
.nx-visual-copy h2 { font-weight:900; font-size:clamp(1.6rem,3vw,2.4rem); }
.nx-visual-copy h2 span { color:var(--nx-neon); }
.nx-visual-copy p { color:var(--nx-text2); }
.nx-visual-badges { display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
.nx-login-form-side { display:grid; place-items:center; padding:32px 28px; }
.nx-login-card {
  width:min(460px,100%); border-radius:20px; padding:30px 28px;
  background:rgba(13,25,8,0.75); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(255,193,7,0.15); box-shadow:0 30px 90px rgba(0,0,0,.5), var(--nx-glow);
}
.nx-login-card h1 { font-weight:900; font-size:1.6rem; margin:10px 0 4px; }
.nx-login-card .sub { color:var(--nx-text2); margin-bottom:18px; }
.nx-pw-wrap { position:relative; }
.nx-pw-toggle { position:absolute; right:8px; top:50%; transform:translateY(-50%); border:0; background:transparent; color:var(--nx-text2); width:44px; height:44px; }
.nx-pw-toggle:hover { color:var(--nx-neon); }

/* bottom nav */
.nx-bottomnav { display:none; position:fixed; left:0; right:0; bottom:0; z-index:1040; padding:8px 10px calc(8px + env(safe-area-inset-bottom)); background:rgba(5,10,4,.92); backdrop-filter:blur(15px); border-top:1px solid var(--nx-border); }
.nx-bottomnav-in { display:grid; grid-template-columns:repeat(5,1fr); gap:4px; }
.nx-bnav { display:flex; flex-direction:column; align-items:center; gap:3px; padding:8px 4px; border-radius:12px; color:var(--nx-text2) !important; text-decoration:none !important; font-size:.68rem; font-weight:500; min-height:56px; border:1px solid transparent; }
.nx-bnav i { font-size:1.15rem; }
.nx-bnav.active { color:var(--nx-neon) !important; background:rgba(255,193,7,.1); border-color:var(--nx-border); }

/* overlay for mobile drawer */
.nx-overlay { position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:1039; opacity:0; pointer-events:none; transition:opacity .25s; }
body.nx-open .nx-overlay { opacity:1; pointer-events:auto; }

/* referral */
.nx-ref-link { display:flex; gap:8px; }
.nx-ref-link input { flex:1; }

/* responsive */
@media (max-width: 1199.98px) { .nx-stat-grid { grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width: 991.98px) {
  .nx-sidebar { transform:translateX(-105%); }
  body.nx-open .nx-sidebar { transform:none; }
  .nx-main, body.nx-collapsed .nx-main { margin-left:0; }
  .nx-login-wrap { grid-template-columns:1fr; }
  .nx-login-visual { min-height:300px; }
  .nx-stat-grid { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .nx-content { padding:16px 14px 92px; }
  .nx-bottomnav { display:block; }
  .nx-user-chip-name, .nx-wallet-pill span.hide-m { display:none; }
  .nx-mobile-brand { display:inline-flex; }
  body.nx-open { overflow:hidden; }
  body.nx-body .table thead { display:none; }
  body.nx-body .table, body.nx-body .table tbody, body.nx-body .table tr, body.nx-body .table td { display:block; width:100%; }
  body.nx-body .table tr { border:1px solid var(--nx-border); border-radius:14px; margin-bottom:10px; background:var(--nx-card); overflow:hidden; }
  body.nx-body .table td { border:0 !important; border-bottom:1px solid rgba(255,193,7,.08) !important; display:flex; justify-content:space-between; gap:12px; }
  body.nx-body .table td::before { content:attr(data-label); color:var(--nx-muted); font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
  body.nx-body .table td:last-child { border-bottom:0 !important; }
  body.nx-body .table-responsive { overflow:visible; }
  .nx-mini-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 575.98px) {
  .nx-stat-grid { grid-template-columns:1fr; gap:10px; }
  .nx-stat-val { font-size:1.25rem; }
  .nx-header { padding:10px 12px; }
  .nx-header .nx-wallet-pill { display:none; }
  .nx-header .nx-breadcrumb { display:none; }
  .nx-header .nx-page-title { max-width:95px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.82rem; }
  .nx-user-chip { padding-right:5px; }
  .nx-visual-copy { padding:24px; }
  .nx-login-form-side { padding:18px 14px; }
  .nx-login-card { padding:24px 18px; }
  .nx-login-visual { min-height:260px; }
  .nx-login-visual img.nx-robot { object-position:center 18%; }
  .nx-ref-link { flex-wrap:wrap; }
  .nx-ref-link input { flex-basis:100%; }
  .nx-ref-link .btn-nx, .nx-ref-link .btn-ghost { flex:1; }
  .nx-mini-grid, .nx-income-strip { grid-template-columns:1fr; }
  .nx-data-row { align-items:flex-start; flex-direction:column; }
  .nx-data-row strong { text-align:left; }
  body.nx-body .card-header, body.nx-body .card-footer, body.nx-body .card-body { padding:14px; }
  body.nx-body .orbit-tab-grid { grid-template-columns:1fr; }
  .nx-settings-grid > div { grid-template-columns:auto 1fr; }
  .nx-settings-grid > div > :last-child { grid-column:1 / -1; width:100%; justify-content:center; }
  .nx-ticket-message { width:100%; }
}
@media (min-width: 1600px) { .nx-stat-grid.cols-4 { grid-template-columns:repeat(4, minmax(0,1fr)); } }

/* focus visibility */
body.nx-body :focus-visible, body.nx-auth :focus-visible { outline:2px solid var(--nx-neon); outline-offset:2px; }

/* reduce motion */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
/* ---------- focused member dashboard ---------- */
.nx-dashboard-section { margin-top:22px; }
.nx-section-heading { margin:0 0 10px; }
.nx-section-heading > span, .nx-section-heading > div > span { display:block; color:var(--nx-neon); font-size:.66rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.nx-section-heading h2 { margin:3px 0 0; font-size:clamp(1rem,2vw,1.25rem); font-weight:800; }
.nx-section-heading-row { display:flex; align-items:end; justify-content:space-between; gap:14px; }
.nx-member-overview .nx-card-b { display:grid; grid-template-columns:minmax(220px,.8fr) minmax(300px,1.2fr); align-items:center; gap:24px; }
.nx-member-copy h2 { margin:6px 0 10px; font-size:clamp(1.15rem,2.5vw,1.65rem); }
.nx-package-value, .nx-neon-text { color:var(--nx-neon); }
.nx-package-value { font-family:'Orbitron','Roboto',sans-serif; }
.nx-muted-copy { color:var(--nx-text2); font-size:.8rem; }
.nx-referral-box label { display:block; margin-bottom:6px; color:var(--nx-text2); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.nx-card-arrow { color:var(--nx-muted); font-size:.8rem; }
.nx-achievement-card { overflow:hidden; }
.nx-achievement-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr); }
.nx-achievement-current { padding:8px 28px 8px 4px; }
.nx-achievement-next { padding:8px 4px 8px 28px; border-left:1px solid var(--nx-border); }
.nx-rank-line { display:flex; align-items:center; gap:12px; margin:12px 0 4px; }
.nx-rank-line h3, .nx-achievement-next h3 { margin:0; font-size:clamp(1.2rem,2.4vw,1.75rem); color:var(--nx-text); }
.nx-achievement-next h3 { margin:12px 0; }
.nx-rank-star { width:42px; height:42px; display:grid; place-items:center; border-radius:50%; color:#071006; background:var(--nx-neon); box-shadow:var(--nx-glow); }
.nx-achievement-salary { color:var(--nx-text2); }
.nx-achievement-salary strong { color:var(--nx-neon); }
.nx-progress-head { display:flex; justify-content:space-between; gap:12px; margin:22px 0 8px; color:var(--nx-text2); font-size:.8rem; }
.nx-progress-head strong { color:var(--nx-neon); font-family:'Orbitron','Roboto',sans-serif; }
.nx-progress-lg { height:14px; }
.nx-qualification-values { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:14px; }
.nx-qualification-values > div { padding:12px; border:1px solid var(--nx-border); border-radius:12px; background:rgba(255,193,7,.035); }
.nx-qualification-values span, .nx-qualification-values strong { display:block; }
.nx-qualification-values span { color:var(--nx-text2); font-size:.72rem; margin-bottom:4px; }
.nx-qualification-values strong { overflow-wrap:anywhere; }
.nx-achievement-next .nx-data-row { margin-bottom:9px; }
.nx-remaining { display:flex; align-items:center; gap:12px; margin-top:14px; padding:14px; border-radius:12px; color:var(--nx-neon); background:rgba(255,193,7,.08); border:1px solid var(--nx-border); }
.nx-remaining i { font-size:1.2rem; }
.nx-remaining strong, .nx-remaining span { display:block; }
.nx-remaining span { color:var(--nx-text2); font-size:.75rem; }
.nx-highest { min-height:170px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:8px; color:var(--nx-text2); }
.nx-highest i { color:var(--nx-neon); font-size:2rem; }
.nx-highest strong { color:var(--nx-text); }
.nx-business-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.nx-metric-card { display:flex; align-items:center; gap:15px; padding:18px; }
.nx-metric-card > div { min-width:0; }
.nx-metric-card div > span, .nx-metric-card strong, .nx-metric-card small { display:block; }
.nx-metric-card div > span { color:var(--nx-text2); font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.nx-metric-card strong { margin:5px 0; color:var(--nx-neon); font-family:'Orbitron','Roboto',sans-serif; font-size:clamp(1.05rem,2.2vw,1.45rem); overflow-wrap:anywhere; }
.nx-metric-card small, .nx-income-card small { color:var(--nx-muted); }
.nx-income-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.nx-income-card { display:flex; flex-direction:column; gap:6px; padding:16px; }
.nx-income-card > span { margin-top:6px; color:var(--nx-text2); font-size:.68rem; font-weight:700; letter-spacing:.11em; }
.nx-income-card > strong { color:var(--nx-neon); font-family:'Orbitron','Roboto',sans-serif; overflow-wrap:anywhere; }

@media (max-width: 991.98px) {
  .nx-member-overview .nx-card-b, .nx-achievement-grid { grid-template-columns:1fr; }
  .nx-achievement-current { padding:4px 4px 22px; }
  .nx-achievement-next { padding:22px 4px 4px; border-left:0; border-top:1px solid var(--nx-border); }
  .nx-income-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 575.98px) {
  .nx-dashboard-section { margin-top:18px; }
  .nx-member-overview .nx-card-b { gap:18px; }
  .nx-ref-link { flex-wrap:wrap; }
  .nx-ref-link input { flex-basis:100%; }
  .nx-business-grid, .nx-qualification-values { grid-template-columns:1fr; }
  .nx-income-grid { grid-template-columns:1fr; }
  .nx-metric-card { padding:15px; }
  .nx-achievement-current, .nx-achievement-next { padding-left:0; padding-right:0; }
}

/* ===== Premium Charcoal + Gold Consistency (Spec 5) ===== */
body.nx-body { background: #0A0A0A !important; }
.nx-header { background: rgba(18,18,18,0.96) !important; border-bottom:1px solid rgba(212,175,55,0.18) !important; }
.nx-sidebar { background: #121212 !important; border-right:1px solid rgba(212,175,55,0.14) !important; }
.nx-link.active { background: linear-gradient(135deg,#FFC107 0%,#D4AF37 100%) !important; color:#121212 !important; border-color: #FFC107 !important; box-shadow:0 4px 16px rgba(255,193,7,0.25) !important; }
.nx-link.active i { color:#121212 !important; }
.nx-link:hover { background: rgba(255,193,7,0.08) !important; border-color: rgba(255,193,7,0.18) !important; color:#FFC107 !important; }
body.nx-body .btn-primary, body.nx-body .btn-nx { background: linear-gradient(135deg,#FFC107 0%,#D4AF37 100%) !important; color:#121212 !important; border-color:#FFC107 !important; font-weight:800 !important; }
body.nx-body .card, .nx-card, .gz-card--dark { background: #1E1E1E !important; border-color: rgba(255,193,7,0.12) !important; }
.gz-card--gold { background: linear-gradient(135deg,#FFC107 0%,#FFB300 100%) !important; }
body.nx-body .table thead th { background: rgba(212,175,55,0.08) !important; color:#D4AF37 !important; }
body.nx-body .modal-content { background:#1E1E1E !important; border:1px solid rgba(255,193,7,0.18) !important; }
body.nx-body .form-control, body.nx-body .form-select { background:#121212 !important; border-color: rgba(255,193,7,0.16) !important; }
body.nx-body .form-control:focus, body.nx-body .form-select:focus { border-color:#FFC107 !important; box-shadow:0 0 0 3px rgba(255,193,7,0.15) !important; }
body.nx-body .alert-warning { background: rgba(255,193,7,0.1) !important; border-color: rgba(255,193,7,0.22) !important; color:#FFD54F !important; }
.orbit-chip { background: linear-gradient(135deg,#FFC107,#D4AF37) !important; color:#121212 !important; font-weight:800 !important; }

/* Header/Sidebar icons gold */
.nx-stat-ic, .gz-card-icon { border-color: rgba(255,193,7,0.18) !important; }
.nx-bottomnav { background: #121212 !important; border-top:1px solid rgba(255,193,7,0.14) !important; }
.nx-bnav.active { color:#FFC107 !important; background: rgba(255,193,7,0.12) !important; }

/* Mobile 320-430px no horizontal overflow */
html, body.nx-body { overflow-x:hidden; max-width:100vw; }
.nx-content, .nx-main, .nx-shell, .card, .table-responsive, .gz-grid, .nx-stat-grid { max-width:100%; overflow-x:hidden; }
.nx-content { padding-left:14px; padding-right:14px; }
@media (max-width:430px){
  .nx-content { padding:12px 10px 92px; }
  .card-body, .nx-card-b { padding:14px 12px !important; }
  .table-responsive { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .gz-grid { grid-template-columns:1fr 1fr; gap:8px; }
  .nx-welcome h1 { font-size:1.25rem; }
  .modal-dialog { margin:10px; max-width: calc(100% - 20px); }
  .package-status-grid { grid-template-columns:1fr !important; }
  .nx-ref-link { flex-direction:column; }
  .nx-ref-link input { width:100%; }
}
@media (max-width:360px){
  .gz-grid { gap:6px; }
  .gz-quick-actions { gap:6px; }
  .nx-header { padding:8px 10px; gap:8px; }
}
* { word-wrap:break-word; overflow-wrap:anywhere; }
img { max-width:100%; height:auto; }
pre, code { white-space:pre-wrap; word-break:break-all; }
