// Shared mixins. Import with `@use "../../shared/scss/mixins" as *;`.
@forward "breakpoints";

// Hide visually, keep for screen readers.
@mixin noah-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

// Transitions only for users who don't ask for reduced motion (≤ 200 ms).
@mixin noah-transition($properties...) {

	@media (prefers-reduced-motion: no-preference) {
		transition-property: $properties;
		transition-duration: 0.15s;
		transition-timing-function: ease-out;
	}
}

// Grid whose column count comes from --noah-cols.
@mixin noah-grid($default-cols: 4) {
	display: grid;
	grid-template-columns: repeat(var(--noah-cols, #{$default-cols}), minmax(0, 1fr));
	gap: var(--noah-gap, var(--wp--style--block-gap, 1.5rem));
}