/**
 * Szövegkiemelés: a félkövér szövegrész háttere.
 *
 * Miért itt van, és nem Elementor global classként: egy global class CSS-e
 * EGY szelektor-blokkba kerül (.vk-kiemel-pad{...}), beágyazott szelektor
 * nincs benne. A kiemelést viszont a bekezdésen BELÜLI <strong>-ra kell
 * tenni, mert a félkövér a szöveg része, nem külön elem. Ezért a global
 * class csak a NÉV (azt az Elementor a címkéjével rendereli), a megjelenést
 * ez a lap adja.
 *
 * A színek az Elementor global variableökből jönnek (--vk-mauve, --vk-coral),
 * tehát ha a paletta ott változik, ez követi. A hex csak tartalék.
 *
 * @package Vikingo\VikingoHuPlatform
 */

/* Többsoros kiemelésnél minden sor kapja meg a bélést és a lekerekítést.
   Enélkül csak az első sor eleje és az utolsó sor vége kap keretet. */
.vk-kiemel-pad :is(strong, b),
.vk-kiemel-filc :is(strong, b) {
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;

	/* Legfeljebb 500: a hátter már elvégzi a kiemelést, a vastag betű
	   mellette túl hangos lenne, és a Clash Display 700-asa foltosít. */
	font-weight: 500;
}

/* Halvány mauve pad: a csendes alapértelmezés, hosszú bekezdésben is olvasható.
   A tint a mauve és a SZÖVEG színének keveréke, ezért magától alkalmazkodik:
   krém háttéren a sötét betűszínnel keveredve halvány levendula, padlizsán
   szakaszon a világos betűszínnel keveredve világos folt. Így egyetlen
   osztály elég, nem kell külön „sötét" változatot rátenni. */
.vk-kiemel-pad :is(strong, b) {
	background: rgba(122, 104, 127, 0.22); /* tartalék a color-mix elé */
	background: color-mix(
		in srgb,
		color-mix(in srgb, var(--vk-mauve, #7a687f) 60%, currentColor) 22%,
		transparent
	);
	/* A bélés NEM lóg ki: így a pad széle nem ér hozzá az előtte álló szóhoz.
	   A kiemelés utáni vessző és pont azért nem kap rést, mert a szövegben
	   a `<strong>`-on BELÜL van (lásd a kiemelést beállító scriptet), nem
	   azért, mert a keret ráfut. */
	padding: 0.08em 0.3em;
	border-radius: 8px;
}

/* Filctoll-húzás: a háttér csak a sor alsó részét festi, a betűt nem takarja. */
.vk-kiemel-filc :is(strong, b) {
	background-image: linear-gradient(transparent 58%, rgba(255, 84, 77, 0.3) 58%);
	background-image: linear-gradient(
		transparent 58%,
		color-mix(in srgb, var(--vk-coral, #ff544d) 30%, transparent) 58%
	);
	padding: 0 0.12em;
}

/* A tartalék (color-mix nélküli böngésző) a krém háttérre van hangolva.
   Ott a sötét szakaszokon halvány marad, de olvashatóságot nem ront. */