@import 'tailwindcss';

@import './commerce.css' layer(utilities);
@import './login.css' layer(utilities);
@import './redeem-dialog.css' layer(utilities);
@import './team.css' layer(utilities);
@import './subscribe-form.css' layer(utilities);

@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=526')
layer(utilities); /* FS Brabo Pro Bold */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=527')
layer(utilities); /* FS Brabo Pro Bold Italic */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=516')
layer(utilities); /* FS Brabo Pro ExtraLight */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=517')
layer(utilities); /* FS Brabo Pro ExtraLight Italic */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=521')
layer(utilities); /* FS Brabo Pro Italic */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=518')
layer(utilities); /* FS Brabo Pro Light */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=519')
layer(utilities); /* FS Brabo Pro Light Italic */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=522')
layer(utilities); /* FS Brabo Pro Medium */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=523')
layer(utilities); /* FS Brabo Pro Medium Italic */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=520')
layer(utilities); /* FS Brabo Pro Regular */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=524')
layer(utilities); /* FS Brabo Pro SemiBold */
@import url('https://fast.fonts.net/lt/1.css?apiType=fspg&c=22b01e89-ec94-4a8d-b318-504014f1ce19&fontids=525')
layer(utilities);

@config '../../tailwind.config.ts'; /* FS Brabo Pro SemiBold Italic */

/*
  The default border color has changed to `currentcolor` in Tailwind CSS v4,
  so we've added these compatibility styles to make sure everything still
  looks the same as it did with Tailwind CSS v3.

  If we ever want to remove these styles, we need to add an explicit border
  color utility to any element that depends on these defaults.
*/
@layer base {
	*,
	::after,
	::before,
	::backdrop,
	::file-selector-button {
		border-color: var(--color-gray-200, currentcolor);
	}
}

@utility fluid-prose {
	:where(h1) {
		@apply fluid-5xl mb-0;
	}
	:where(h2) {
		@apply fluid-4xl mb-0;
	}
	:where(h3) {
		@apply fluid-3xl mb-0;
	}
	:where(h4) {
		@apply fluid-2xl mb-0;
	}
	:where(h5) {
		@apply fluid-xl mb-0;
	}
	:where(h6) {
		@apply fluid-lg mb-0;
	}
}

@layer base {
	:root {
		--nav-height: 3.5rem;
		--command-bar-height: 2.25rem;
		--pane-layout-height: calc(
			100vh - var(--nav-height) - var(--command-bar-height)
		);
		--code-editor-layout-height: calc(
			100vh - var(--nav-height) - var(--command-bar-height) - 30px
		);

		--background: 0 0% 100%;
		--foreground: 0 0% 0%;
		--card: 0 0% 100%;
		--card-foreground: 0 0% 0%;
		--popover: 0 0% 100%;
		--popover-foreground: 0 0% 0%;
		--primary: 152 100% 29%;
		--primary-foreground: 0 0% 100%;
		--secondary: 0 0% 96.1%;
		--secondary-foreground: 0 0% 9%;
		--muted: 0 0% 96.1%;
		--muted-foreground: 0 0% 45.1%;
		--accent: 0 0% 96.1%;
		--accent-foreground: 0 0% 9%;
		--destructive: 0 84.2% 60.2%;
		--destructive-foreground: 0 0% 98%;
		--border: 0 0% 0%;
		--input: 0 0% 89.8%;
		--ring: 0 0% 0%;
		--radius: 0.3rem;
	}

	.dark {
		--background: 0 0% 3.9%;
		--foreground: 0 0% 98%;
		--card: 0 0% 3.9%;
		--card-foreground: 0 0% 98%;
		--popover: 0 0% 3.9%;
		--popover-foreground: 0 0% 98%;
		--primary: 0 0% 98%;
		--primary-foreground: 0 0% 9%;
		--secondary: 0 0% 14.9%;
		--secondary-foreground: 0 0% 98%;
		--muted: 0 0% 14.9%;
		--muted-foreground: 0 0% 63.9%;
		--accent: 0 0% 14.9%;
		--accent-foreground: 0 0% 98%;
		--destructive: 0 62.8% 30.6%;
		--destructive-foreground: 0 0% 98%;
		--border: 0 0% 14.9%;
		--input: 0 0% 14.9%;
		--ring: 0 0% 83.1%;
	}
}

@layer base {
	* {
		@apply border-border;
	}

	h1 {
		@apply font-heading text-balance font-bold;
	}

	h2,
	h3,
	h4 {
		@apply font-rounded text-balance font-semibold;
	}

	[data-sr-button] {
		@apply font-rounded font-medium;
	}

	body {
		@apply text-foreground antialiased;
	}

	.not-prose {
		@apply font-sans;
	}
}

@layer utilities {
	mux-player {
		aspect-ratio: 16 / 9;
		width: 100%;
		height: auto;
		--seek-backward-button: none;
		--seek-forward-button: none;
		@apply overflow-hidden;
	}
}
