/**
 * The EU harmonised guarantee graphics: the notice on the legal guarantee of conformity, and the label
 * for a commercial guarantee of durability (the "GARAN" label).
 *
 * Neither may be modified - no recolouring, no filters or effects, no cropping and no stretching
 * (Implementing Regulation (EU) 2025/1960, see includes/eu-guarantees/README.md). Scaling is allowed as
 * long as the proportions hold and the graphic stays legible at default display size. This file
 * therefore does no more than size the graphics and defend their colours.
 *
 * Loaded on every front-end page, separately from the general stylesheet, which dealers can switch off.
 */

/* The graphics keep their own colours, whatever a theme does to the images around them. */
.obs-eu-guarantee-notice__image,
.obs-eu-guarantee-label__image,
.obs-eu-guarantee-label-hint__image {
	display: block;
	width: 100%;
	height: auto;
	filter: none;
	mix-blend-mode: normal;
	background-color: transparent;
	border: 0;
}

/* Pixels, not rem: the gap to the description text above should not shrink with a small root font size. */
.obs-eu-guarantee-notice {
	margin-top: 24px;
}

/* A4 portrait at 96 dpi, scaled down only by a narrower container - below that the small print blurs. */
.obs-eu-guarantee-notice__image {
	max-width: 794px;
}

.obs-eu-guarantee-notice__link,
.obs-eu-guarantee-label__link {
	margin-top: 0.5rem;
}

/* The full label in its description tab, 95 x 100 mm per Annex II. */
.obs-eu-guarantee-label__image {
	max-width: 420px;
}

/*
 * The compact label in the guarantee row of the features table, 130 x 20 mm per Annex II. No margin of
 * its own - the table cell brings the same padding as every other feature. The width follows the
 * viewport below roughly 600px: a fixed one holds the cell open and leaves the feature titles next to it
 * breaking after every second syllable. Below 140px the burnt-in type stops being readable.
 */
.obs-eu-guarantee-label-hint {
	display: block;
	width: clamp(140px, 40vw, 240px);
	text-decoration: none;
}

/* Without a compact label from the ERP the row falls back to a text link, which should look like one. */
.obs-eu-guarantee-label-hint--text {
	width: auto;
	text-decoration: underline;
}
