/* =============================================
   DESIGN TOKENS — Editor On Demand
   Apple-inspired light theme
   ============================================= */

:root {
  /* Backgrounds */
  --color-bg: #f5f5f7;
  --color-bg-secondary: #ffffff;
  --color-bg-elevated: #fafafa;

  /* Surfaces */
  --color-card-bg: #ffffff;

  /* Borders */
  --color-border: #d2d2d7;
  --color-border-light: rgba(0, 0, 0, 0.05);

  /* Text */
  --color-text-primary: #1d1d1f;
  --color-text-secondary: #86868b;

  /* Accent — Apple Blue */
  --color-accent: #0071e3;
  --color-accent-hover: #0077ed;

  /* Status */
  --color-green: #34c759;
  --color-orange: #ff9500;

  /* Code */
  --color-code-bg: #1c1c1e;
  --color-code-text: #e5e5e7;

  /* Fonts */
  --font-body:
    -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;
  --font-mono:
    SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
    monospace;

  /* Spacing */
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-full: 9999px;
}