/**
 * KeliPress — base styles.
 *
 * Only what theme.json cannot express. Every value comes from a design token.
 */

/* Keyboard focus: a dark ring with a light halo stays visible on any background. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: var(--wp--custom--focus--width) solid
		var(--wp--preset--color--foreground);
	outline-offset: var(--wp--custom--focus--offset);
	box-shadow: 0 0 0
		calc(
			var(--wp--custom--focus--width) * 2 +
				var(--wp--custom--focus--offset)
		)
		var(--wp--preset--color--background);
}

/* Site chrome separators. */
.kp-site-header {
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.kp-site-footer {
	border-top: 1px solid var(--wp--preset--color--border);
}

/* Form controls: theme.json has no input element yet. */
:where(
	.wp-block-search__input,
	.wp-block-post-comments-form input:not([type="submit"], [type="checkbox"]),
	.wp-block-post-comments-form textarea
) {
	padding: var(--wp--custom--control--padding-block)
		var(--wp--custom--control--padding-inline);
	border: var(--wp--custom--control--border-width) solid
		var(--wp--preset--color--muted-foreground);
	border-radius: var(--wp--custom--radius--md);
	background-color: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
	font: inherit;
}