@layer base, starlight, theme, components, utilities;

@import "@astrojs/starlight-tailwind";
@import "tailwindcss/theme.css" layer(theme);
@import "tailwindcss/utilities.css" layer(utilities);
@source not "../tailwind.ts";

@theme {
    /* Your preferred text font. Starlight uses a system font stack by default. */
    --font-sans: "Atkinson Hyperlegible";
    /* Your preferred code font. Starlight uses system monospace fonts by default. */
    --font-mono: "IBM Plex Mono";
    /* Your preferred accent color. Indigo is closest to Starlight’s defaults. */
    --color-accent-50: var(--color-indigo-50);
    --color-accent-100: var(--color-indigo-100);
    --color-accent-200: var(--color-indigo-200);
    --color-accent-300: var(--color-indigo-300);
    --color-accent-400: var(--color-indigo-400);
    --color-accent-500: var(--color-indigo-500);
    --color-accent-600: var(--color-indigo-600);
    --color-accent-700: var(--color-indigo-700);
    --color-accent-800: var(--color-indigo-800);
    --color-accent-900: var(--color-indigo-900);
    --color-accent-950: var(--color-indigo-950);
    /* Your preferred gray scale. Zinc is closest to Starlight’s defaults. */
    --color-gray-50: var(--color-zinc-50);
    --color-gray-100: var(--color-zinc-100);
    --color-gray-200: var(--color-zinc-200);
    --color-gray-300: var(--color-zinc-300);
    --color-gray-400: var(--color-zinc-400);
    --color-gray-500: var(--color-zinc-500);
    --color-gray-600: var(--color-zinc-600);
    --color-gray-700: var(--color-zinc-700);
    --color-gray-800: var(--color-zinc-800);
    --color-gray-900: var(--color-zinc-900);
    --color-gray-950: var(--color-zinc-950);
}
