@import "tailwindcss";
@plugin "@tailwindcss/typography";

@import "@fontsource-variable/geist";
@import "@fontsource-variable/source-serif-4";
@import "@fontsource-variable/geist-mono";
@import "@fontsource/damion";

/* devins.page brand colors from figma */

@theme {
	--color-dp-background-light: #ededfb;
	--color-dp-background2-light: #ffffff;
	--color-dp-text-light: #282934;
	--color-dp-palette-red-light: #c77373;
	--color-dp-palette-orange-light: #bc9979;
	--color-dp-palette-yellow-light: #b8b574;
	--color-dp-palette-green-light: #8bb46b;
	--color-dp-palette-blue-light: #6c70c2;
	--color-dp-palette-indigo-light: #9679bc;
	--color-dp-palette-violet-light: #af6fa9;

	--color-dp-background-dark: #282934;
	--color-dp-background2-dark: #333440;
	--color-dp-text-dark: #ededfb;
	--color-dp-palette-red-dark: #bd6161;
	--color-dp-palette-orange-dark: #ad7b4c;
	--color-dp-palette-yellow-dark: #b5b154;
	--color-dp-palette-green-dark: #7fb158;
	--color-dp-palette-blue-dark: #595dc7;
	--color-dp-palette-indigo-dark: #825ac4;
	--color-dp-palette-violet-dark: #9c5194;
}

@theme {
	--font-sans:
		"Geist Variable", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
		"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	--font-serif:
		"Source Serif 4 Variable", ui-serif, Georgia, Cambria, "Times New Roman",
		Times, serif;
	--font-mono:
		"Geist Mono Variable", ui-monospace, SFMono-Regular, Menlo, Monaco,
		Consolas, "Liberation Mono", "Courier New", monospace;
	--font-cursive: "Damion", cursive;
}

a:hover {
	@apply underline;
}

@media (prefers-color-scheme: dark) {
	.astro-code,
	.astro-code span {
		color: var(--shiki-dark) !important;
		background-color: var(--shiki-dark-bg) !important;
	}
}