@import 'tailwindcss';
@import 'tw-animate-css';
@import '@gib/tailwind-config/theme';

@source '../../../../packages/ui/src/*.{ts,tsx}';

@custom-variant dark (&:where(.dark, .dark *));
@custom-variant light (&:where(.light, .light *));
@custom-variant auto (&:where(.auto, .auto *));

@utility container {
  margin-inline: auto;
  padding-inline: 2rem;
  @media (width >= --theme(--breakpoint-sm)) {
    max-width: none;
  }
  @media (width >= 1400px) {
    max-width: 1400px;
  }
}

@layer base {
  * {
    @apply border-border;
  }
  body {
    letter-spacing: var(--tracking-normal);
  }
}
