/* Font smooth only on macOS */
/* biome-ignore lint/correctness/noUnknownMediaFeatureName: It's used because this is specific to a certain browser/OS */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
	html {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
}

body {
	--litm-color-bg: hsl(40, 85%, 87%);
	--litm-color: hsl(40, 27%, 24%);
	--litm-color-alt-bg: hsl(34, 34%, 82%);
	--litm-color-dark-bg: hsl(0, 0%, 45%);
	--litm-color-accent-bg: hsl(225.94 10.66% 41.72%);
	--litm-color-accent: hsl(46.61 81.44% 92.99%);
	--litm-color-accent-2: hsl(24deg 20.72% 43.81%);
	--litm-color-accent-3: hsl(17, 84%, 31%);
	--litm-color-primary-bg: color-mix(
		in hsl,
		var(--litm-color-accent) 75%,
		hsl(0 0% 100%)
	);
	--litm-color-primary: color-mix(in hsl, var(--litm-color) 75%, hsl(0 0% 0%));
	--litm-color-row-odd: rgb(0, 0, 0, 0.1);
	--litm-color-weakness: hsl(10 41.04% 26.41%);
	--litm-color-weakness-bg: hsl(6.5 42.05% 41.08% / 20%);
	--litm-color-muted-bg: hsl(0 0% 45.42% / 20%);
	--litm-color-tag-bg: hsl(45 98% 46% / 70%);
	--litm-color-status-bg: hsl(75.88 48.31% 42.3% / 70%);
	--litm-color-limit-bg: hsl(0 67.35% 63.41% / 70%);

	/* Fonts */
	--litm-font-heading: PackardAntique, CaslonAntique, "Palatino Linotype",
		"Book Antiqua", Palatino, serif;
	--litm-font-primary: CaslonAntique, LibreCaslonText, "Palatino Linotype",
		"Book Antiqua", Palatino, serif;
	--litm-font-accent: AlchemyItalic, "Brush Script MT", "Bradley Hand ITC",
		"Lucida Calligraphy", "Lucida Handwriting", "Apple Chancery", cursive;
	--litm-font-text: Fraunces, LibreCaslonText, "Book Antiqua", Palatino, serif;
	--litm-font-sc: PowellAntique, PackardAntique, Palatino, serif;

	/* Vertical spacing */
	--litm-space-1: 0.25rem;
	--litm-space-2: 0.5rem;
	--litm-space-3: 1rem;
	--litm-space-4: 2rem;
	--litm-space-5: 4rem;

	&.game,
	&.game .app {
		/* Foundry Overrides */
		--font-size-26: 1.625rem;
		--font-primary: Fraunces, BespokeSans, Lato, "PackardAntique", "Open Sans",
			sans-serif;
		--color-text-light-1: var(--litm-color-accent);
		--color-shadow-primary: var(--litm-color-primary);
		--color-shadow-highlight: var(--litm-color-accent-bg);
		--color-border-highlight: var(--litm-color-accent-bg);
		--color-border-highlight-alt: var(--litm-color-accent-2);
		--color-text-hyperlink: var(--litm-color-accent-3);
		--color-level-success: rgba(26, 107, 34, 0.8);
		--color-level-error: rgba(105, 0, 8, 0.8);
		--color-level-warning: rgba(214, 150, 0, 0.8);
	}
}

.app.litm,
.application.litm {
	background: url("../assets/media/background.webp") no-repeat left / cover;
	box-shadow: none;
	filter: drop-shadow(rgb(0, 0, 0, 0.6) 2px 4px 8px);

	&:where(:not(.minimized)) {
		padding: 0.625rem;

		& .window-title {
			display: none;
		}
	}

	/* Scrollbar colors */
	& * {
		scrollbar-color: var(--litm-color-accent-2) transparent;
		scrollbar-width: thin;
	}

	& button {
		border: none;
		background: none;

		&:hover,
		&:focus,
		&:active {
			box-shadow: none;
		}
	}

	& img {
		max-width: 100%;
		height: auto;
		vertical-align: middle;
		font-style: italic;
		background-repeat: no-repeat;
		background-size: cover;
		shape-margin: 1rem;
		border: none;
		border-radius: 0;
	}

	& .window-header {
		border-bottom: none;
		font-family: var(--litm-font-primary);
		justify-content: end;
		flex: 0 0 1.5rem;

		& .document-id-link {
			margin-inline: 0 auto;
		}

		& .litm--sheet-scale-button {
			cursor: nwse-resize;

			& > i {
				rotate: 45deg;
			}
		}
	}

	& .window-content {
		padding: 0px;
		background: none;
	}

	& form {
		display: flex;
		flex-direction: column;
	}

	& .editor {
		min-height: 100px;
		height: 100%;

		& .tox.tox-tinymce .tox-edit-area__iframe {
			background-color: #fff;
		}

		blockquote {
			border: none;
			padding: 0px;
			font-family: var(--litm-font-accent);
			color: var(--litm-color-weakness);
			font-size: var(--font-size-14);
			margin: 0.8em 0px;
		}
	}
}

/* Animations */
@keyframes pulse {
	0% {
		filter: drop-shadow(0 0 0 transparent);
	}

	50% {
		filter: drop-shadow(0 0 4px var(--litm-color-alt-bg));
	}

	100% {
		filter: drop-shadow(0 0 0 transparent);
	}
}
