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

@layer base {
  :root {
    --background: oklch(0.145 0 0);
    --foreground: oklch(0.985 0 0);
    --card: oklch(0.145 0 0);
    --card-foreground: oklch(0.985 0 0);
    --popover: oklch(0.145 0 0);
    --popover-foreground: oklch(0.985 0 0);
    --primary: oklch(0.985 0 0);
    --primary-foreground: oklch(0.145 0 0);
    --secondary: oklch(0.205 0 0);
    --secondary-foreground: oklch(0.632 0 0);
    --muted: oklch(0.237 0 0);
    --muted-foreground: oklch(0.556 0 0);
    --accent: oklch(0.237 0 0);
    --accent-foreground: oklch(0.985 0 0);
    --destructive: oklch(0.396 0.141 25.723);
    --destructive-foreground: oklch(0.985 0 0);
    --danger: oklch(0.22 0.08 26.1);
    --danger-foreground: oklch(0.671 0.214 23.774);
    --danger-border: oklch(0.671 0.214 23.774);
    --warning: oklch(0.24 0.056 52);
    --warning-foreground: oklch(0.738 0.173 80.941);
    --warning-border: oklch(0.738 0.173 80.941);
    --info: oklch(0.24 0.08 268.5);
    --info-foreground: oklch(0.665 0.1895 257.22);
    --info-border: oklch(0.665 0.1895 257.22);
    --success: oklch(0.23 0.055 153);
    --success-foreground: oklch(0.627 0.194 149.214);
    --success-border: oklch(0.627 0.194 149.214);
    --border: oklch(0.32 0 0);
    --input: oklch(0.145 0 0);
    --ring: oklch(0.405 0 0);
    --chart-1: oklch(0.585 0.23 261.348);
    --chart-2: oklch(0.577 0.174 149.642);
    --chart-3: oklch(0.593 0.277 303.111);
    --chart-4: oklch(0.676 0.218 44.36);
    --chart-5: oklch(0.577 0.245 27.325);
  }

  * {
    @apply border-border;
  }

  body {
    @apply bg-background text-foreground min-h-screen antialiased;
  }

  .Root {
    @apply isolate;
  }

  .container {
    @apply px-4 md:px-0 max-w-screen-2xl;
  }

  /* Custom Scrollbar Styles */
  * {
    scrollbar-width: thin;
    scrollbar-color: var(--muted) transparent;
  }
  ::-webkit-scrollbar {
    width: 4px;
  }
  ::-webkit-scrollbar-track {
    background: transparent;
  }
  ::-webkit-scrollbar-thumb {
    background: var(--subtle);
    border-radius: 4px;
  }
}
