/*
Theme Name: Imp Garage
Theme URI: https://theinnerimp.com
Author: Tim St. Hilaire
Description: A warm, practical, garage-workshop block theme for a car-shopping blog. Source of truth is the project repository.
Requires at least: 6.7
Requires PHP: 7.4
Version: 0.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: imp-garage
*/

:root {
	color-scheme: light dark;
}

/* Dark mode: swap the palette tokens. Doubled :root outranks WordPress's own token rule. */
@media (prefers-color-scheme: dark) {
	:root:root {
		--wp--preset--color--paper: #1A1D20;
		--wp--preset--color--surface: #23272B;
		--wp--preset--color--ink: #E6E9E3;
		--wp--preset--color--muted: #A5ADB4;
		--wp--preset--color--line: #3A4046;
		--wp--preset--color--accent: #E8864F;
		--wp--preset--color--accent-ink: #17191B;
	}
}

/* Header: shop-sign bar on top, hard rule below. Square corners everywhere. */
.imp-header {
	border-top: 6px solid var(--wp--preset--color--accent);
	border-bottom: var(--wp--custom--rule) solid var(--wp--preset--color--ink);
	padding-top: var(--wp--preset--spacing--40);
	padding-bottom: var(--wp--preset--spacing--40);
}

.imp-main {
	padding-top: var(--wp--preset--spacing--70);
	padding-bottom: var(--wp--preset--spacing--70);
}

.imp-footer {
	border-top: var(--wp--custom--rule) solid var(--wp--preset--color--ink);
	padding-top: var(--wp--preset--spacing--50);
	padding-bottom: var(--wp--preset--spacing--50);
}

/* Parts-tag style metadata: small monospace, quiet. */
.imp-meta {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

.imp-entry {
	padding-top: var(--wp--preset--spacing--50);
	padding-bottom: var(--wp--preset--spacing--50);
}

/* Form fields: palette colors, square corners, readable in both modes. */
.wp-block-search .wp-block-search__input {
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	border: var(--wp--custom--rule) solid var(--wp--preset--color--ink);
	border-radius: 0;
	padding: 0.7rem 0.8rem;
	font: inherit;
}

:where(a, button, input, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

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

@media (prefers-reduced-motion: no-preference) {
	a,
	.wp-element-button {
		transition: color 0.15s ease, background-color 0.15s ease;
	}
}