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

@layer base {
	@font-face {
		font-family: "Rancho";
		font-style: normal;
		font-weight: 500;
		font-display: swap;
		src: url(/publi/public/fonts/Rancho-Regular.ttf) format("truetype");
	}

	@font-face {
		font-family: "Merriweather";
		font-style: normal;
		font-weight: 500;
		font-display: swap;
		src: url(/public/fonts/Merriweather-Regular.ttf) format("truetype");
	}

	@font-face {
		font-family: "Merriweather";
		font-style: italic;
		font-weight: 500;
		font-display: swap;
		src: url(/public/fonts/Merriweather-Italic.ttf) format("truetype");
	}

	@font-face {
		font-family: "Merriweather";
		font-style: normal;
		font-weight: bold;
		font-display: swap;
		src: url(/public/fonts/Merriweather-Bold.ttf) format("truetype");
	}

	@font-face {
		font-family: "Merriweather";
		font-style: italic;
		font-weight: bold;
		font-display: swap;
		src: url(/public/fonts/SourceSans3-BoldItalic.ttf) format("truetype");
	}

	@font-face {
		font-family: "Source Sans 3";
		font-style: normal;
		font-weight: 500;
		font-display: swap;
		src: url(/public/fonts/SourceSans3-Medium.ttf) format("truetype");
	}

	@font-face {
		font-family: "Source Sans 3";
		font-style: italic;
		font-weight: 500;
		font-display: swap;
		src: url(/public/fonts/SourceSans3-MediumItalic.ttf) format("truetype");
	}

	@font-face {
		font-family: "Source Sans 3";
		font-style: normal;
		font-weight: bold;
		font-display: swap;
		src: url(/public/fonts/SourceSans3-Bold.ttf) format("truetype");
	}

	@font-face {
		font-family: "Source Sans 3";
		font-style: italic;
		font-weight: bold;
		font-display: swap;
		src: url(/public/fonts/SourceSans3-BoldItalic.ttf) format("truetype");
	}
}

@layer components {
	html {
		font-size: 15.5px;
	}

	body {
		@apply bg-slate-50;
	}

	h1,
	h2,
	h3,
	h4 {
		@apply font-serif;
	}

	a {
		@apply hyphens-none underline decoration-dotted hover:decoration-solid text-slate-700 hover:text-slate-900;
	}

	ul {
		@apply my-2;
	}

	li {
		@apply ml-14 list-disc;
	}

	a[aria-current="page"] {
		@apply !text-red-500;
	}
}