/*
 * Mercedes Repair: design aliases.
 * The ONLY place --mr-* is defined. Every value is a reference to the Kadence global palette
 * (Customizer > Colors > Palette, option kadence_global_palette). No colour literals in this file.
 * Components use --mr-*, never --global-paletteN directly. See brand/palette-system.md.
 */
:root {
	--mr-accent:          var(--global-palette1);
	--mr-accent-on-dark:  var(--global-palette2);
	--mr-ink:             var(--global-palette3);
	--mr-text:            var(--global-palette4);
	--mr-muted:           var(--global-palette5);
	--mr-line:            var(--global-palette6);
	--mr-surface:         var(--global-palette7);
	--mr-surface-strong:  var(--global-palette8);
	--mr-white:           var(--global-palette9);
	--mr-text-on-dark:    var(--global-palette10);
	--mr-success:         var(--global-palette11);
	--mr-info:            var(--global-palette12);
	--mr-alert:           var(--global-palette13);
	--mr-warning:         var(--global-palette14);
	--mr-rating:          var(--global-palette15);

	/* derived by reference, no new colour typed */
	--mr-line-on-dark:        color-mix(in srgb, var(--mr-white) 22%, transparent);
	--mr-button-line-on-dark: color-mix(in srgb, var(--mr-white) 45%, transparent);
	--mr-overlay:             color-mix(in srgb, var(--mr-ink) 78%, transparent);
	--mr-focus:               var(--mr-accent);

	/* type (families are declared with @font-face in fonts.css) */
	--mr-font-heading: 'Overpass', Arial, sans-serif;
	--mr-font-body:    'Atkinson Hyperlegible', Arial, sans-serif;

	/* layout tokens (tokens.json layout.*) */
	--mr-container:         1240px;
	--mr-radius-button:     8px;
	--mr-radius-card:       8px;
	--mr-button-min-height: 52px;
	--mr-header-height:     95px;
	--mr-transition:        180ms;
}

.has-dark-band,
.mr-dark {
	--mr-focus: var(--mr-accent-on-dark);
}

/*
 * Kadence Blocks design tokens (v3.8 ships orange/indigo/grey defaults that do not follow the palette).
 * Re-point every colour primitive at the --mr-* aliases so KB blocks, forms and notices obey the palette.
 * :root:root (0,2,0) beats KB inline :root (0,1,0) regardless of source order.
 */
:root:root {
	--kb-token--primitive--color--brand--primary:      var(--mr-accent);
	--kb-token--primitive--color--brand--secondary:    var(--mr-accent-on-dark);
	--kb-token--primitive--color--brand--accent:       var(--mr-accent);
	--kb-token--primitive--color--brand--button:       var(--mr-accent);
	--kb-token--primitive--color--brand--button-hover: var(--mr-ink);
	--kb-token--primitive--color--neutral--0:          var(--mr-white);
	--kb-token--primitive--color--neutral--50:         var(--mr-surface-strong);
	--kb-token--primitive--color--neutral--100:        var(--mr-surface);
	--kb-token--primitive--color--neutral--200:        var(--mr-line);
	--kb-token--primitive--color--neutral--300:        var(--mr-line);
	--kb-token--primitive--color--neutral--500:        var(--mr-muted);
	--kb-token--primitive--color--neutral--600:        var(--mr-muted);
	--kb-token--primitive--color--neutral--700:        var(--mr-text);
	--kb-token--primitive--color--neutral--900:        var(--mr-ink);
	--kb-token--primitive--color--notice--success:     var(--mr-success);
	--kb-token--primitive--color--notice--warning:     var(--mr-warning);
	--kb-token--primitive--color--notice--error:       var(--mr-alert);
	--kb-token--primitive--color--notice--info:        var(--mr-info);
	--kb-token--primitive--shadow--xs: 0 1px 2px 0 color-mix(in srgb, var(--mr-ink) 12%, transparent);
	--kb-token--primitive--shadow--sm: 0 2px 4px 0 color-mix(in srgb, var(--mr-ink) 12%, transparent);
	--kb-token--primitive--shadow--md: 0 2px 8px 0 color-mix(in srgb, var(--mr-ink) 12%, transparent);
}
