/* ===== ContentKit Design System 2026 v2 - Fixed Light Mode ===== */
:root {
  /* Brand — unchanged */
  --primary: #6C5CE7;
  --primary-light: #A29BFE;
  --primary-dark: #5A4BD1;
  --accent: #00CEC9;
  --accent-light: #81ECEC;
  --danger: #FF6B6B;
  --warning: #FDCB6E;
  --success: #00B894;

  /* Surfaces — improved contrast for light mode */
  --bg-body: #F0F2F5;
  --bg-card: #FFFFFF;
  --bg-elevated: #FFFFFF;
  --bg-sidebar: #FAFBFC;
  --bg-navbar: rgba(255,255,255,0.92);
  --bg-toolbar: #F8F9FA;

  /* Text — darker for readability */
  --text-primary: #1A1A2E;
  --text-secondary: #4A5568;
  --text-muted: #88909A;
  --text-inverse: #FFFFFF;

  /* Borders — more visible in light */
  --border: #D1D5DB;
  --border-light: #E5E7EB;

  /* Shadows — more depth */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.1);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.12);
  --shadow-xl: 0 16px 48px rgba(108,92,231,0.15);

  /* Focus ring */
  --focus-ring: rgba(108,92,231,0.15);

  /* Skeleton */
  --skeleton-base: #E5E7EB;
  --skeleton-shine: #F3F4F6;

  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Font */
  --font: 'Tajawal', system-ui, -apple-system, sans-serif;
}

/* Dark Mode Variables */
[data-theme="dark"] {
  --bg-body: #0A0A1A;
  --bg-card: #13132B;
  --bg-elevated: #1A1A3E;
  --bg-sidebar: #0F0F23;
  --bg-navbar: rgba(10,10,26,0.92);
  --bg-toolbar: #161630;

  --text-primary: #EEEEF8;
  --text-secondary: #A0A0B8;
  --text-muted: #6B6B80;
  --text-inverse: #0A0A1A;

  --border: #1E1E3A;
  --border-light: #161630;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.25);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.35);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.45);

  --focus-ring: rgba(108,92,231,0.25);

  --skeleton-base: #1E1E3A;
  --skeleton-shine: #2A2A4A;
}