/* You can add global styles to this file, and also import other style files */

@import 'tailwindcss';

@font-face {
	font-family: 'PN Sans';
	src: url('/fonts/pn-sans-regular.woff2') format('woff2');
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: 'PN Sans';
	src: url('/fonts/pn-sans-medium.woff2') format('woff2');
	font-style: normal;
	font-weight: 500;
	font-display: swap;
}

@font-face {
	font-family: 'PN Sans';
	src: url('/fonts/pn-sans-bold.woff2') format('woff2');
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@theme {
	/* Colors */
	--color-pn-blue-900: #0d234b;
	--color-pn-blue-700: #005d92;
	--color-pn-blue-400: #00a0d6;
	--color-pn-blue-200: #8eddf9;
	--color-pn-blue-50: #e0f8ff;
	--color-pn-blue-25: #effbff;
	--color-pn-coral-900: #500715;
	--color-pn-coral-700: #9b1c2e;
	--color-pn-coral-400: #f06365;
	--color-pn-coral-200: #fbc2c1;
	--color-pn-coral-50: #fdefee;
	--color-pn-coral-25: #fef7f6;
	--color-pn-gray-900: #2d2013;
	--color-pn-gray-700: #5e554a;
	--color-pn-gray-400: #969087;
	--color-pn-gray-200: #d3cecb;
	--color-pn-gray-100: #e9e6e5;
	--color-pn-gray-50: #f3f2f2;
	--color-pn-gray-25: #f9f8f8;
	--color-pn-green-900: #002f24;
	--color-pn-green-700: #005e41;
	--color-pn-green-500: #0aa85c;
	--color-pn-green-400: #5ec584;
	--color-pn-green-200: #abe3bb;
	--color-pn-green-50: #dcf6e7;
	--color-pn-green-25: #edfbf3;
	--color-pn-orange-900: #4f1600;
	--color-pn-orange-700: #99290a;
	--color-pn-orange-500: #ed7123;
	--color-pn-orange-400: #f89142;
	--color-pn-orange-200: #ffc8a3;
	--color-pn-orange-50: #fff1e3;
	--color-pn-orange-25: #fff8f1;
	--color-pn-warning: #a70707;

	/* Fonts */
	--font-sans: 'PN Sans', ui-sans-serif, system-ui, sans-serif;
}

@layer base {
	html {
		font-family: var(--font-sans);
	}
}