@import "tailwindcss";

:root {
  color-scheme: light;
  --background: #fafafa;
  --foreground: #18181b;
  --card: #ffffff;
  --card-foreground: #18181b;
  --border: #e4e4e7; /* zinc-200 */
  --input: #e4e4e7;
  --primary: #4f46e5; /* indigo-600 */
  --primary-foreground: #ffffff;
  --muted: #f4f4f5; /* zinc-100 */
  --muted-foreground: #71717a; /* zinc-500 */
}

.dark {
  color-scheme: dark;
  --background: #09090b; /* zinc-950 */
  --foreground: #fafafa; /* zinc-50 */
  --card: #18181b; /* zinc-900 */
  --card-foreground: #fafafa;
  --border: #27272a; /* zinc-800 */
  --input: #27272a;
  --primary: #6366f1; /* indigo-500 */
  --primary-foreground: #ffffff;
  --muted: #27272a; /* zinc-800 */
  --muted-foreground: #a1a1aa; /* zinc-400 */
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --font-sans: var(--font-geist-sans);
  --font-mono: var(--font-geist-mono);
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-geist-sans), system-ui, -apple-system, sans-serif;
}

option {
  background-color: var(--background);
  color: var(--foreground);
}