/**
 * IT Ultimate Design System Foundation.
 *
 * Keep component-specific rules out of this file. This layer only covers
 * browser-level defaults and interaction states that are not adequately
 * expressed through theme.json.
 */

::selection {
	background: var(--wp--preset--color--brand-red);
	color: var(--wp--preset--color--text-primary);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-red);
	outline-offset: 3px;
}

:where(button, input, select, textarea) {
	font: inherit;
}

:where(input, select, textarea) {
	min-height: var(--wp--custom--control--min-height);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--surface-input);
	color: var(--wp--preset--color--text-primary);
}

:where(input, select, textarea)::placeholder {
	color: var(--wp--preset--color--text-muted);
}

:where(.wp-element-button, .wp-block-button__link, button) {
	transition:
		background-color var(--wp--custom--motion--normal) var(--wp--custom--motion--ease),
		border-color var(--wp--custom--motion--normal) var(--wp--custom--motion--ease),
		color var(--wp--custom--motion--normal) var(--wp--custom--motion--ease),
		transform var(--wp--custom--motion--fast) var(--wp--custom--motion--ease),
		box-shadow var(--wp--custom--motion--normal) var(--wp--custom--motion--ease);
}

:where(.wp-element-button, .wp-block-button__link, button):active {
	transform: translateY(1px);
}

:where(.wp-site-blocks) {
	min-height: 100vh;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}