/* ============================================================
   Adnazo — Centralized Global Color System
   Phase 16.2A Light + Phase 16.2 Dark Mode Tokens
   ============================================================ */

:root {
  /* ---- Stripe light palette ---- */
  --primary: #635BFF;
  --primary-hover: #5148E5;
  --primary-light: #F4F3FF;
  --primary-dark: #5148E5;

  --secondary: #00D4AA;
  --secondary-light: #E6FBF5;
  --secondary-dark: #00B894;

  --accent: #00D4AA;
  --accent-light: #E6FBF5;
  --accent-dark: #00B894;

  --accent-primary: #635BFF;
  --accent-hover: #5148E5;

  /* ---- Semantic ---- */
  --success: #16A34A;
  --success-light: #DCFCE7;
  --warning: #F59E0B;
  --warning-light: #FEF3C7;
  --danger: #DC2626;
  --danger-light: #FEE2E2;
  --info: #635BFF;

  /* ---- Backgrounds (light) ---- */
  --bg-primary: #FFFFFF;
  --bg-secondary: #F8FAFC;
  --bg-tertiary: #F4F3FF;
  --bg-main: #F8FAFC;
  --bg-section: #FFFFFF;
  --bg-card: #FFFFFF;

  /* ---- Text (light) ---- */
  --text-primary: #0A2540;
  --text-secondary: #425466;
  --text-muted: #425466;
  --text-inverse: #FFFFFF;

  /* ---- Borders ---- */
  --border-color: #E5E7EB;
  --border-strong: #E5E7EB;
  --border-hover: #635BFF;

  /* ---- Surfaces (aliases for components) ---- */
  --surface: var(--bg-primary);
  --surface-elevated: var(--bg-primary);
  --input-bg: var(--bg-primary);
  --modal-bg: var(--bg-primary);
  --dropdown-bg: var(--bg-primary);
  --table-bg: var(--bg-primary);
  --chat-panel-bg: var(--bg-secondary);
  --chat-bubble-received: var(--bg-primary);
  --chat-bubble-sent: var(--primary-light);

  /* ---- Gradients ---- */
  --gradient-primary: linear-gradient(135deg, #635BFF, #00D4AA);
  --gradient-secondary: linear-gradient(135deg, #00D4AA, #635BFF);
  --gradient-premium: linear-gradient(135deg, #F59E0B, #DC2626);
  --gradient-verified: linear-gradient(135deg, #16A34A, #00D4AA);
  --gradient-featured: linear-gradient(135deg, #635BFF, #00D4AA);

  /* ---- Focus ---- */
  --focus-border: #635BFF;
  --focus-glow: rgba(99, 91, 255, 0.16);

  /* ---- Shadows ---- */
  --shadow-soft: 0 8px 24px rgba(15, 23, 42, 0.06);
  --shadow-card: 0 8px 24px rgba(15, 23, 42, 0.06);
  --shadow-3d: 0 8px 24px rgba(15, 23, 42, 0.06);
  --shadow-3d-hover: 0 16px 40px rgba(15, 23, 42, 0.1);

  /* ---- Header ---- */
  --header-bg: rgba(255, 255, 255, 0.92);
  --header-border: #E5E7EB;
  --header-text: #0A2540;
  --header-active: #635BFF;

  /* ---- Icons ---- */
  --icon-color: #425466;
  --icon-color-active: #635BFF;
}

/* ============================================================
   Dark mode — Stripe-inspired (Phase 16.2)
   Supports body.dark-mode (app) and body.dark (public pages)
   ============================================================ */
body.dark-mode,
body.dark {
  color-scheme: dark;

  --primary: #635BFF;
  --primary-hover: #7A73FF;
  --primary-light: #1A2236;
  --primary-dark: #5148E5;

  --secondary: #00D4AA;
  --secondary-light: #0F3D35;
  --accent: #00D4AA;
  --accent-light: #0F3D35;

  --accent-primary: #635BFF;
  --accent-hover: #7A73FF;

  --success: #22C55E;
  --warning: #FBBF24;
  --danger: #F87171;
  --danger-light: #3B1F1F;
  --warning-light: #3B2F0F;
  --success-light: #0F2A1A;

  --bg-primary: #0A0F1C;
  --bg-secondary: #131A2A;
  --bg-tertiary: #1A2236;
  --bg-main: #0A0F1C;
  --bg-section: #131A2A;
  --bg-card: #131A2A;

  --text-primary: #FFFFFF;
  --text-secondary: #B8C0D4;
  --text-muted: #B8C0D4;
  --text-inverse: #0A0F1C;

  --border-color: #2A3553;
  --border-strong: #2A3553;
  --border-hover: #635BFF;

  --surface: #131A2A;
  --surface-elevated: #1A2236;
  --input-bg: #1A2236;
  --modal-bg: #131A2A;
  --dropdown-bg: #131A2A;
  --table-bg: #131A2A;
  --chat-panel-bg: #0A0F1C;
  --chat-bubble-received: #1A2236;
  --chat-bubble-sent: #2A2650;

  --header-bg: rgba(10, 15, 28, 0.92);
  --header-border: #2A3553;
  --header-text: #FFFFFF;
  --header-active: #635BFF;

  --icon-color: #B8C0D4;
  --icon-color-active: #7A73FF;

  --shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-card: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-3d: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-3d-hover: 0 16px 40px rgba(0, 0, 0, 0.55);

  --focus-glow: rgba(99, 91, 255, 0.35);

  --gradient-primary: linear-gradient(135deg, #635BFF, #00D4AA);
  --gradient-featured: linear-gradient(135deg, #635BFF 0%, #1A2236 100%);
}