/*
 * Mercedes Repair: base rules and parent-theme colour overrides.
 * Colours come ONLY from var(--mr-*) (css/vars.css). No colour-function or hash-colour literals.
 * Section 1 is design (tokens.json layout). Section 2 replaces colours the Kadence parent and the
 * browser hard-code; selectors are prefixed with :root so they win over Kadence's later-loaded CSS.
 */

/* 1. Design ------------------------------------------------------------- */
:focus-visible {
	outline: 3px solid var(--mr-focus);
	outline-offset: 2px;
}

::selection {
	background: var(--mr-ink);
	color: var(--mr-white);
}

/* Buttons: 52px min height (Kadence has no min-height control); radius, padding, type come from the Customizer. */
.button,
button[type="submit"],
input[type="submit"],
.wp-block-button__link,
.wp-element-button,
.kb-button {
	min-height: var(--mr-button-min-height);
	box-sizing: border-box;
	justify-content: center;
	align-items: center;
	transition: background-color var(--mr-transition), color var(--mr-transition), border-color var(--mr-transition);
}
/* Header CTA keeps its compact 44px size (tokens layout.button.header). */
.site-header .header-button,
.site-header .button {
	min-height: 44px;
}

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

/* 2. Parent / browser colour overrides ------------------------------------ */
:root:root {
	--global-gray-400: var(--mr-muted); /* form-field + table borders: palette5 keeps 3:1 */
	--global-gray-500: var(--mr-muted);
}
:root hr {
	border-bottom-color: var(--mr-line);
}
:root hr.wp-block-separator {
	color: var(--mr-line);
	border-color: currentColor;
}
:root mark {
	background: var(--mr-surface-strong);
	color: var(--mr-ink);
}
:root .content-bg {
	background: var(--mr-white);
}
:root .screen-reader-text:focus {
	background-color: var(--mr-surface);
	color: var(--mr-accent);
	box-shadow: 0 0 0 3px var(--mr-focus);
}

/* Flat surfaces: no grey drop shadows on buttons, inputs or entries (tokens layout.card.shadow = none). */
:root button:hover, :root button:focus, :root button:active,
:root .button:hover, :root .button:focus, :root .button:active,
:root .wp-block-button__link:hover, :root .wp-block-button__link:focus, :root .wp-block-button__link:active,
:root .wp-element-button:hover, :root .wp-element-button:focus, :root .wp-element-button:active,
:root input[type="button"]:hover, :root input[type="reset"]:hover, :root input[type="submit"]:hover,
:root input[type="submit"]:focus, :root input[type="submit"]:active {
	box-shadow: none;
}
:root input[type="text"]:focus, :root input[type="email"]:focus, :root input[type="url"]:focus,
:root input[type="password"]:focus, :root input[type="search"]:focus, :root input[type="number"]:focus,
:root input[type="tel"]:focus, :root input[type="date"]:focus, :root textarea:focus, :root select:focus {
	border-color: var(--mr-accent);
	box-shadow: none;
}
:root select:focus option {
	color: var(--mr-text);
}
:root .entry,
:root .entry.single-entry,
:root .entry.loop-entry {
	box-shadow: none;
}

/* Header dropdown + mobile drawer. */
:root .header-navigation ul ul.sub-menu,
:root .header-navigation ul ul.submenu {
	/* Reference Family B dropdown: light panel, 3px accent top edge, rounded bottom, soft shadow. */
	background: var(--mr-white);
	border: 1px solid var(--mr-line);
	border-top: 3px solid var(--mr-accent);
	border-radius: 0 0 8px 8px;
	padding: 8px;
	box-shadow: 0 16px 34px color-mix(in srgb, var(--mr-ink) 14%, transparent);
}
:root .popup-drawer .drawer-overlay {
	background-color: color-mix(in srgb, var(--mr-ink) 60%, transparent);
}
:root .popup-drawer .drawer-inner {
	background: var(--mr-ink);
	color: var(--mr-white);
	box-shadow: 0 0 2rem 0 color-mix(in srgb, var(--mr-ink) 25%, transparent);
}
:root #search-drawer .drawer-inner input.search-field:focus,
:root #search-drawer .drawer-inner .search-submit[type="submit"]:hover ~ .kadence-search-icon-wrap,
:root #search-drawer .drawer-inner button[type="submit"]:hover ~ .kadence-search-icon-wrap {
	color: var(--mr-white);
}

/* Archive / taxonomy pills and widgets. */
:root .entry-taxonomies .category-style-pill a,
:root .entry-taxonomies .category-style-pill a:hover,
:root .loop-entry.type-post .entry-taxonomies .category-style-pill a {
	color: var(--mr-white);
}
:root .rss-date,
:root .widget_rss cite,
:root .widget_calendar thead {
	color: var(--mr-text);
}
:root .widget_calendar td {
	background: var(--mr-white);
}

:root .has-dark-band a:not(.button):not(.wp-block-button__link):not(.kb-button),
:root .has-theme-palette-3-background-color a:not(.button):not(.wp-block-button__link):not(.kb-button) {
	color: var(--mr-accent-on-dark);
}

/* Semi-transparent ink over hero photography (the Customizer picker only stores a solid slot). */
:root .hero-section-overlay {
	background-color: var(--mr-overlay);
}
