/* Jetfins Design System - Custom Variables */
:root {
  /* Fonts */
  --font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 600;

  /* Dimensions */
  --sidebar-width: 260px;
  --header-height: 70px;
  --bottom-nav-height: 65px;
  --max-content-width: 1400px;

  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.25s ease;
  --transition-slow: 0.4s ease;

  /* Border Radii */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-full: 9999px;

  /* Default Theme: Dark Mode (Matches Reference Image) */
  --bg-primary: #080c09;          /* Deep dark forest black-green */
  --bg-secondary: #101411;        /* Exact mockup card background */
  --bg-tertiary: #181d19;         /* Mockup input/interactive states */
  
  --accent: #9ef01a;              /* Neon lime green */
  --accent-hover: #b5f543;
  --accent-rgb: 158, 240, 26;
  
  --text-primary: #ffffff;        /* White text for titles */
  --text-secondary: #8a928c;      /* Muted sage grey text */
  --text-muted: #565e58;          /* Darker muted text */
  
  --border-color: rgba(158, 240, 26, 0.08);     /* Subtle green border */
  --border-color-muted: rgba(255, 255, 255, 0.03); /* Super soft border lines */
  
  --color-positive: #39ff14;      /* Bright neon green for gainers */
  --color-positive-bg: rgba(57, 255, 20, 0.08);
  --color-negative: #ff3b30;      /* Neon red for losers */
  --color-negative-bg: rgba(255, 59, 48, 0.08);
  
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.7);
  
  --mesh-opacity: 0.25;
}

/* Light Mode Overrides */
:root[data-theme="light"] {
  --bg-primary: #f2f5f3;          /* Soft light sage grey */
  --bg-secondary: #ffffff;        /* Pure white cards */
  --bg-tertiary: #e4e9e5;         /* Light grey-green for inputs/hovers */
  
  --accent: #5e9c00;              /* Deeper green for contrast in light mode */
  --accent-hover: #74bf00;
  --accent-rgb: 94, 156, 0;
  
  --text-primary: #0d120e;        /* Dark forest green text */
  --text-secondary: #525a54;      /* Muted green-grey text */
  --text-muted: #88928a;          /* Soft grey text */
  
  --border-color: rgba(94, 156, 0, 0.15);
  --border-color-muted: rgba(0, 0, 0, 0.06);
  
  --color-positive: #10b981;      /* Rich emerald green */
  --color-positive-bg: rgba(16, 185, 129, 0.1);
  --color-negative: #ef4444;      /* Solid dark red */
  --color-negative-bg: rgba(239, 68, 68, 0.1);
  
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.1);
  
  --mesh-opacity: 0.04;
}