@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --background: 220 14% 97%;
    --foreground: 220 20% 10%;
    --card: 0 0% 100%;
    --card-foreground: 220 20% 10%;
    --popover: 0 0% 100%;
    --popover-foreground: 220 20% 10%;
    --primary: 24 95% 53%;
    --primary-foreground: 0 0% 100%;
    --secondary: 220 14% 94%;
    --secondary-foreground: 220 20% 25%;
    --muted: 220 14% 94%;
    --muted-foreground: 220 10% 50%;
    --accent: 24 95% 95%;
    --accent-foreground: 24 95% 40%;
    --destructive: 0 84% 60%;
    --destructive-foreground: 0 0% 98%;
    --border: 220 14% 88%;
    --input: 220 14% 88%;
    --ring: 24 95% 53%;
    --radius: 0.5rem;
    --font-body: 'Inter', ui-sans-serif, system-ui, sans-serif;
    --font-heading: 'Inter', ui-sans-serif, system-ui, sans-serif;
    --font-display: 'Inter', ui-sans-serif, system-ui, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    --sidebar-bg: #1a0a2e;
    --sidebar-active: #f97316;
  }
}

@layer base {
  * { @apply border-border; }
  body { @apply bg-background text-foreground font-body antialiased; }
}