/* ------------------------------------------------------------------ *
 * TEMPORARY palette preview (see inc/palette-preview.php)            *
 * ------------------------------------------------------------------ *
 * Named, complete color schemes derived from the Promanu magazine
 * redesign. Each scheme overrides the theme.json presets at the body
 * level (`body[data-…]` outranks the plain `body` selector Gutenberg
 * uses to emit them), so every component — buttons, links, hovers,
 * chips, section bands, status badges — retints at once. What
 * reviewers see is exactly what flipping the values in theme.json
 * would ship.
 *
 * Promanu reference values (sampled from the 1/26 + 2/25 PDFs):
 *   Navy #283583 · Diagrammblau #9ab8da · Cyan hell #def0f8
 *   Mint #d7ead9 / #e6f1e7 · Creme #f8f0d8 / #f5e8d3
 *
 * Every scheme passes WCAG 2.1 AA (4.5:1) for: primary on white,
 * white on primary/hover/active (solid CTAs), primary on its own
 * soft tint (chips), primary on every band color, ink on every band,
 * and status text on status backgrounds. Ratios were computed during
 * development; the weakest pairing is Salbei chip text at 4.99:1.
 *
 * The hero gradient is never overridden: it is sampled from the
 * client's banner artwork and stays as-is in every scheme.
 *
 * The certification trust mark ("Zertifiziert" badge, "Nur
 * zertifizierte" filter card) re-points to the scheme's success
 * family in all four schemes: amber/creme belongs to the current
 * warm-grey palette; in the cool schemes it reads as an unthemed
 * leftover and in the creme-banded schemes it disappears entirely.
 * Success green also matches the "verified" semantics better.        */

/* ------------------------------------------------------------------ *
 * LAGUNE — the gentle option.
 * Keeps the current steel-blue identity untouched; only the tint
 * layer (cards, chips, section bands) adopts the magazine's cyan and
 * mint. Smallest visual shift, zero risk next to the existing logo.  */
body[data-sghr-palette="lagune"] {
	--wp--preset--color--primary-soft: #def0f8;
	--wp--preset--color--info-bg: #def0f8;
	--wp--preset--color--surface-warm: #e6f1e7;
	--wp--preset--color--success: #256a44;
	--wp--preset--color--success-bg: #d7ead9;
	--sghr-cert-bg: var(--wp--preset--color--success-bg);
	--sghr-cert-fg: var(--wp--preset--color--success);
}

/* ------------------------------------------------------------------ *
 * TINTE — the committed option.
 * Adopts the magazine's actual navy (#283583) as the primary family:
 * every button, link, eyebrow and icon shifts to ink-blue. Tints use
 * a navy-tinted soft for chips plus the magazine cyan/mint as bands,
 * so the whole page reads "Promanu".                                 */
body[data-sghr-palette="tinte"] {
	--wp--preset--color--primary: #283583;
	--wp--preset--color--primary-hover: #1f2a68;
	--wp--preset--color--primary-active: #171f4e;
	--wp--preset--color--primary-soft: #e3e7f8;
	--wp--preset--color--info-bg: #def0f8;
	--wp--preset--color--surface-warm: #e6f1e7;
	--wp--preset--color--success: #256a44;
	--wp--preset--color--success-bg: #d7ead9;
	--sghr-cert-bg: var(--wp--preset--color--success-bg);
	--sghr-cert-fg: var(--wp--preset--color--success);
}

/* ------------------------------------------------------------------ *
 * SALBEI — the green option.
 * Leads with a deep sage green (darkened from the magazine's green
 * accents until it clears 4.5:1 on white) over mint chips and warm
 * creme bands — the "print & paper" feel of the physical magazine.   */
body[data-sghr-palette="salbei"] {
	--wp--preset--color--primary: #2f6b50;
	--wp--preset--color--primary-hover: #265640;
	--wp--preset--color--primary-active: #1d4231;
	--wp--preset--color--primary-soft: #d7ead9;
	--wp--preset--color--info-bg: #e6f1e7;
	--wp--preset--color--surface-warm: #f8f0d8;
	--wp--preset--color--success: #256a44;
	--wp--preset--color--success-bg: #d7ead9;
	--sghr-cert-bg: var(--wp--preset--color--success-bg);
	--sghr-cert-fg: var(--wp--preset--color--success);
}

/* ------------------------------------------------------------------ *
 * SAND — the warm option.
 * Promanu navy for all interactive elements over the magazine's
 * table-yellow/creme bands. `primary-soft` is deliberately NOT creme:
 * the forum + membership bands paint with primary-soft while the
 * news/finder/footer bands paint with surface-warm, so identical
 * values would fuse adjacent sections into one endless beige block.
 * A pale periwinkle (navy tint) keeps the warm/cool band rhythm and
 * ties chips to the navy primary.                                    */
body[data-sghr-palette="sand"] {
	--wp--preset--color--primary: #283583;
	--wp--preset--color--primary-hover: #1f2a68;
	--wp--preset--color--primary-active: #171f4e;
	--wp--preset--color--primary-soft: #e3e7f8;
	--wp--preset--color--info-bg: #f8f0d8;
	--wp--preset--color--surface-warm: #f5e8d3;
	--wp--preset--color--success: #256a44;
	--wp--preset--color--success-bg: #d7ead9;
	--sghr-cert-bg: var(--wp--preset--color--success-bg);
	--sghr-cert-fg: var(--wp--preset--color--success);
}

/* --- Switcher widget ------------------------------------------------ */

.sghr-palette-preview {
	position: fixed;
	left: 1rem;
	bottom: 1rem;
	z-index: 9999;
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.5rem 0.75rem;
	background: #1a1f26;
	color: #fff;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(26, 31, 38, 0.35);
	font-size: 12px;
	line-height: 1;
}
.sghr-palette-preview__label {
	font-weight: 600;
	letter-spacing: 0.02em;
	opacity: 0.7;
}
.sghr-palette-preview__options {
	display: flex;
	gap: 0.25rem;
}
.sghr-palette-preview__options button {
	appearance: none;
	border: 0;
	cursor: pointer;
	font: inherit;
	color: #fff;
	background: transparent;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.4rem 0.7rem;
	border-radius: 999px;
	opacity: 0.75;
	transition: background-color 120ms ease, opacity 120ms ease;
}
.sghr-palette-preview__options button:hover {
	opacity: 1;
	background: rgba(255, 255, 255, 0.12);
}
.sghr-palette-preview__options button[aria-pressed="true"] {
	opacity: 1;
	background: rgba(255, 255, 255, 0.22);
	font-weight: 600;
}
.sghr-palette-preview__options button:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

/* Tiny scheme swatch inside each button: primary over band color. */
.sghr-palette-preview__dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	flex: 0 0 auto;
	border: 1px solid rgba(255, 255, 255, 0.4);
}

@media (max-width: 40rem) {
	.sghr-palette-preview {
		left: 0.5rem;
		right: 0.5rem;
		bottom: 0.5rem;
		justify-content: center;
		flex-wrap: wrap;
		border-radius: 16px;
	}
}

@media print {
	.sghr-palette-preview { display: none; }
}