/* ═══════════════════════════════════════════════════════════════════════
   CLEAN SLATE v2 — TRADEBRAHMA POLISH (V14.1.1)
   Loaded LAST in the cascade. Adds the TradeBrahma signature touches on
   top of the MERIDIAN structure — same skeleton, calmer skin:
   • Active rail item = quiet #262626 chip + sky-blue label (no border)
   • Primary CTAs = blue gradient #3B82F6 → #64C8FF, white text
   • LIVE pills = solid red with soft glow
   • Checkbox accent blue; scrollbars thin quiet
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1. Active rail item — TradeBrahma quiet chip ───────────────────── */
.mdn-rail-item.active {
  background: #262626;
  color: var(--accent);
  border-color: transparent;
}
.mdn-rail-item.active .mdn-ico { color: var(--accent); }
[data-theme="light"] .mdn-rail-item.active {
  background: #EFF6FF;
  color: var(--accent);
}

/* ── 2. Primary buttons — TradeBrahma blue gradient ─────────────────── */
.mdn-btn.primary {
  background: linear-gradient(135deg, #3B82F6 0%, #64C8FF 100%);
  border-color: transparent;
  color: #FFFFFF;
  box-shadow: 0 2px 10px rgba(59, 130, 246, 0.22);
}
.mdn-btn.primary:hover {
  background: linear-gradient(135deg, #2F6FE0 0%, #58BCFA 100%);
  border-color: transparent;
  box-shadow: 0 4px 14px rgba(59, 130, 246, 0.32);
}
.fx-btn.primary, .pm-btn.primary, .btn-primary, .btn.primary {
  background: linear-gradient(135deg, #3B82F6 0%, #64C8FF 100%) !important;
  color: #FFFFFF !important;
  border: none !important;
  box-shadow: 0 2px 10px rgba(59, 130, 246, 0.22);
}
.fx-btn.primary:hover, .pm-btn.primary:hover, .btn-primary:hover, .btn.primary:hover {
  background: linear-gradient(135deg, #2F6FE0 0%, #58BCFA 100%) !important;
  box-shadow: 0 4px 16px rgba(59, 130, 246, 0.32) !important;
}

/* ── 3. LIVE-style pills — solid red, soft glow ─────────────────────── */
.mdn-badge.live, .fx-pill.live, .pm-pill.live, .badge-live,
.live-badge, .pill-live, .mdn-chip.live {
  background: #EF4444;
  color: #FFFFFF;
  border-color: transparent;
  box-shadow: 0 0 12px rgba(239, 68, 68, 0.30);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

/* ── 4. Market chips / tabs — accent follows sky blue via tokens ────── */
.mdn-mkt-chip.active { border-color: rgba(100, 200, 255, 0.45); }
.mdn-tab.active { color: var(--accent); border-bottom-color: var(--accent); }

/* ── 5. Checkbox + scrollbar polish ─────────────────────────────────── */
input[type="checkbox"], input[type="radio"] { accent-color: #3B82F6; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #0A0A0A; }
::-webkit-scrollbar-thumb { background: #262626; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #3F3F3F; }
* { scrollbar-width: thin; scrollbar-color: #262626 #0A0A0A; }
[data-theme="light"] ::-webkit-scrollbar-track { background: #F9FAFB; }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: #D1D5DB; }

/* ── 6. Focus rings — sky blue ──────────────────────────────────────── */
.mdn-input:focus, .mdn-select:focus, .mdn-textarea:focus,
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(100, 200, 255, 0.10);
}

/* ── 7. Canvas hardening — pure neutral everywhere ──────────────────── */
html, body { background: #0A0A0A; }
[data-theme="light"] html, [data-theme="light"] body { background: #F9FAFB; }

/* ── 8. V14.1.2 expanded sidebar — TradeBrahma quiet polish ────────── */
/* Sub-items (market / super-admin accordions) share the quiet chip */
.mdn-rail-item.sub.active { background: #262626; color: var(--accent); }
[data-theme="light"] .mdn-rail-item.sub.active { background: #EFF6FF; }
/* Accordion summary rows behave like every other item */
.mdn-rail-grp > summary.mdn-rail-item:hover { background: var(--mdn-surface-2); }
/* Sidebar scroll: thin quiet scrollbar (expanded lists are long) */
.mdn-rail-scroll { scrollbar-width: thin; scrollbar-color: #262626 transparent; }
.mdn-rail-scroll::-webkit-scrollbar { display: block; width: 6px; }
.mdn-rail-scroll::-webkit-scrollbar-track { background: transparent; }
.mdn-rail-scroll::-webkit-scrollbar-thumb { background: #262626; border-radius: 3px; }
[data-theme="light"] .mdn-rail-scroll::-webkit-scrollbar-thumb { background: #D1D5DB; }
/* Mobile drawer scrim uses the TradeBrahma deep black */
.mdn-side-scrim { background: rgba(0, 0, 0, 0.58); }

/* ── 9. V14.1.3 public/auth pages — no rail: true full-width topbar ── */
/* Landing / signup / install / partner-login suppress the sidebar via the
   body.no-sidebar hook (see overrides.css §public pages). The V14.1 MERIDIAN
   app shell (.mdn-app) still reserved its rail column, leaving a ~248px dead
   area on the left of those pages. Collapse it to a single column — same
   geometry the cookie-based .mdn-app.no-rail mode already uses. */
body.no-sidebar .mdn-app {
  grid-template-columns: 1fr;
  grid-template-areas: "topbar" "main";
}
@media (max-width: 900px) {
  body.no-sidebar .mdn-app { grid-template-areas: "topbar" "main"; }
}
/* With no rail there is nothing to toggle — hide the burger and surface the
   brand mark + wordmark in its place so the topbar reads like a site header. */
body.no-sidebar .mdn-topbar #railToggleTop { display: none; }
.mdn-topbar-brand {
  display: none;
  align-items: center; gap: 9px;
  text-decoration: none; white-space: nowrap;
  margin-right: 2px;
}
body.no-sidebar .mdn-topbar-brand { display: flex; }
.mdn-topbar-brand .mdn-rail-mark { width: 27px; height: 27px; flex: 0 0 27px; font-size: 14px; }
.mdn-topbar-brand .nm {
  font-size: 13px; font-weight: 700; letter-spacing: 0.4px;
  text-transform: uppercase; color: var(--mdn-ink);
}
.mdn-topbar-brand:hover .nm { color: var(--accent); }
.mdn-topbar-brand .mdn-rail-mark { transition: transform var(--dur-fast) ease; }
.mdn-topbar-brand:hover .mdn-rail-mark { transform: translateY(-1px); }
/* Guest (signed-out) header state on public pages */
.mdn-topbar .mdn-userchip.signin { color: var(--mdn-ink-2); }
.mdn-topbar .mdn-userchip.signin:hover { color: var(--mdn-ink); }
.mdn-topbar .mdn-userchip.signin .avatar { background: var(--mdn-accent); }
