/**
 * CapitalNivesh × BrokerHub design tokens
 * Themes: [data-theme="light"] | [data-theme="dark"]
 * Legacy --ox-* aliases preserve existing component CSS.
 *
 * Palette derived from official CapitalNivesh logo:
 *   Primary blue ≈ #0B57D0 / #0A5CD6
 *   Deep navy   ≈ #0F2D66 / #0A254F
 */

:root {
  /* Shared non-color tokens */
  --brand-primary: #0B57D0;
  --brand-primary-hover: #0847AD;
  --brand-primary-active: #063A91;
  --brand-secondary: #123E8A;
  --brand-accent: #2F80ED;
  --brand-soft: #EAF2FF;
  --brand-ink: #0F2D66;
  --brand-logo-dark: #0A254F;
  --brand-logo-light: #FFFFFF;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --ox-radius-sm: var(--radius-sm);
  --ox-radius-md: var(--radius-md);
  --ox-radius-lg: var(--radius-lg);

  --ox-sidebar-width: 220px;
  --ox-sidebar-collapsed-width: 72px;
  --ox-topbar-height: 64px;
  --ox-font-sans: "Inter", system-ui, -apple-system, sans-serif;
  --ox-font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Trading semantics — stable across themes (tuned slightly per theme below) */
  --buy: #0F9D58;
  --buy-hover: #0B7A44;
  --sell: #D93025;
  --sell-hover: #B3261E;
  --profit: #0F9D58;
  --loss: #D93025;
  --warning: #E6A700;
  --info: #2F80ED;
  --success: #0F9D58;
  --danger: #D93025;

  --market-live: #0F9D58;
  --market-delayed: #E6A700;
  --market-closed: #6B7280;
  --provider-primary: #0B57D0;
  --provider-fallback: #E6A700;
  --provider-unavailable: #D93025;
}

/* ---------- LIGHT (default document fallback when attribute missing is set by boot) ---------- */
:root,
[data-theme="light"] {
  color-scheme: light;

  --bg-app: #F5F8FC;
  --bg-sidebar: #FFFFFF;
  --bg-header: #FFFFFF;
  --bg-card: #FFFFFF;
  --bg-card-elevated: #FFFFFF;
  --bg-input: #FFFFFF;
  --bg-hover: #EEF3FB;
  --bg-selected: #EAF2FF;
  --bg-overlay: rgba(15, 45, 102, 0.45);

  --text-primary: #0F2D66;
  --text-secondary: #3D4F6F;
  --text-muted: #6B7A94;
  --text-disabled: #9AA6BC;
  --text-inverse: #FFFFFF;
  --text-link: #0B57D0;

  --border-subtle: #E6ECF5;
  --border-default: #D5DEEC;
  --border-strong: #B7C4DA;
  --border-focus: #0B57D0;

  --buy: #0B8A4A;
  --buy-hover: #097540;
  --sell: #C62828;
  --sell-hover: #A31F1F;
  --profit: #0B8A4A;
  --loss: #C62828;
  --warning: #C98700;
  --info: #0B57D0;
  --success: #0B8A4A;
  --danger: #C62828;

  --button-primary-bg: var(--brand-primary);
  --button-primary-text: #FFFFFF;
  --button-secondary-bg: #EEF3FB;
  --button-secondary-text: var(--brand-ink);
  --input-bg: var(--bg-input);
  --input-border: var(--border-default);
  --table-header-bg: #F0F4FA;
  --table-row-hover: #F5F8FC;
  --modal-bg: #FFFFFF;
  --tooltip-bg: #0F2D66;
  --toast-bg: #FFFFFF;

  --shadow-sm: 0 1px 2px rgba(15, 45, 102, 0.06);
  --shadow-md: 0 8px 24px rgba(15, 45, 102, 0.08);
  --shadow-lg: 0 18px 48px rgba(15, 45, 102, 0.12);

  /* Legacy --ox-* bridge */
  --ox-bg: var(--bg-app);
  --ox-bg-elevated: var(--bg-header);
  --ox-sidebar: var(--bg-sidebar);
  --ox-card: var(--bg-card);
  --ox-card-hover: var(--bg-hover);
  --ox-border: var(--border-default);
  --ox-border-subtle: var(--border-subtle);
  --ox-text: var(--text-primary);
  --ox-text-secondary: var(--text-secondary);
  --ox-text-muted: var(--text-muted);
  --ox-muted: var(--text-secondary);
  --ox-accent: var(--brand-primary);
  --ox-accent-dim: rgba(11, 87, 208, 0.12);
  --ox-success: var(--success);
  --ox-success-dim: rgba(11, 138, 74, 0.12);
  --ox-warning: var(--warning);
  --ox-warning-dim: rgba(201, 135, 0, 0.14);
  --ox-danger: var(--danger);
  --ox-danger-dim: rgba(198, 40, 40, 0.12);
  --ox-input-bg: #FFFFFF;
  --ox-input-bg-hover: #F5F8FC;
  --ox-input-bg-focus: #FFFFFF;
  --ox-input-border: var(--border-default);
  --ox-input-border-hover: var(--border-strong);
  --ox-input-text: var(--text-primary);
  --ox-input-label: var(--text-secondary);
  --ox-elevated: var(--bg-card-elevated);
  --bg-body: var(--bg-app);
}

/* ---------- DARK (current BrokerHub density, CapitalNivesh accents) ---------- */
[data-theme="dark"] {
  color-scheme: dark;

  --bg-app: #0B1220;
  --bg-sidebar: #0E1726;
  --bg-header: #101A2B;
  --bg-card: #152238;
  --bg-card-elevated: #1A2A42;
  --bg-input: #152238;
  --bg-hover: #1C2E4A;
  --bg-selected: rgba(11, 87, 208, 0.22);
  --bg-overlay: rgba(4, 10, 20, 0.72);

  --text-primary: #F3F6FB;
  --text-secondary: #B6C2D6;
  --text-muted: #8490A7;
  --text-disabled: #5C6B84;
  --text-inverse: #0B1220;
  --text-link: #5B9BFF;

  --border-subtle: #1C2A40;
  --border-default: #2A3B55;
  --border-strong: #3E5273;
  --border-focus: #2F80ED;

  --buy: #34D399;
  --buy-hover: #22C58B;
  --sell: #FB7185;
  --sell-hover: #F43F5E;
  --profit: #34D399;
  --loss: #FB7185;
  --warning: #FBBF24;
  --info: #60A5FA;
  --success: #34D399;
  --danger: #FB7185;

  --button-primary-bg: var(--brand-primary);
  --button-primary-text: #FFFFFF;
  --button-secondary-bg: #1C2E4A;
  --button-secondary-text: #E8EEF8;
  --input-bg: var(--bg-input);
  --input-border: var(--border-default);
  --table-header-bg: #121C2F;
  --table-row-hover: #1A2A42;
  --modal-bg: #152238;
  --tooltip-bg: #0E1726;
  --toast-bg: #152238;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 10px 28px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 22px 56px rgba(0, 0, 0, 0.55);

  --ox-bg: var(--bg-app);
  --ox-bg-elevated: var(--bg-header);
  --ox-sidebar: var(--bg-sidebar);
  --ox-card: var(--bg-card);
  --ox-card-hover: var(--bg-hover);
  --ox-border: var(--border-default);
  --ox-border-subtle: var(--border-subtle);
  --ox-text: var(--text-primary);
  --ox-text-secondary: var(--text-secondary);
  --ox-text-muted: var(--text-muted);
  --ox-muted: var(--text-secondary);
  --ox-accent: var(--brand-accent);
  --ox-accent-dim: rgba(47, 128, 237, 0.16);
  --ox-success: var(--success);
  --ox-success-dim: rgba(52, 211, 153, 0.12);
  --ox-warning: var(--warning);
  --ox-warning-dim: rgba(251, 191, 36, 0.12);
  --ox-danger: var(--danger);
  --ox-danger-dim: rgba(251, 113, 133, 0.12);
  --ox-input-bg: #1C2333;
  --ox-input-bg-hover: #222B3D;
  --ox-input-bg-focus: #1A2230;
  --ox-input-border: #3D4F66;
  --ox-input-border-hover: #4D6280;
  --ox-input-text: #F9FAFB;
  --ox-input-label: #B0BAC9;
  --ox-elevated: var(--bg-card-elevated);
  --bg-body: var(--bg-app);
}

.tabular-nums {
  font-variant-numeric: tabular-nums;
  font-family: var(--ox-font-mono);
}

/* Prefer tokenized brand focus ring */
:focus-visible {
  outline: 2px solid var(--border-focus);
  outline-offset: 2px;
}