/*
 * Eri kuvasuhde mobiilille — teeman oma merkkiluokka has-theme-mobile-ratio,
 * jonka froggy_image_ratio_style() (inc/image-ratio.php) asettaa kuvaan, kun
 * lohkossa on "Eri kuvasuhde mobiilille" päällä.
 *
 * Inline-tyylissä ei voi olla mediakyselyä, joten kuvan inline-tyyli antaa
 * molemmat arvot muuttujina ja käyttää voimassa olevaa:
 *   aspect-ratio: var(--froggy-img-ratio-active);
 *   object-fit:   var(--froggy-img-fit-active);
 * Tämä tiedosto valitsee voimassa olevan arvon. Puuttuva tavallinen suhde
 * ("Alkuperäinen" tai "Täytä korkeus") on auto.
 *
 * Vain julkisivulla: editori valitsee voimassa olevan suhteen itse
 * (useIsMobileView, block-components/aspect-ratio-control.jsx).
 */
.has-theme-mobile-ratio {
	--froggy-img-ratio-active: var(--froggy-img-ratio-mobile);
	--froggy-img-fit-active: var(--froggy-img-fit-mobile);
}

/* Sama 782 px raja kuin editorin MOBILE_MIN_WIDTH (ks.
   assets/css/breakpoints.css). */
@media (min-width: 782px) {
	.has-theme-mobile-ratio {
		--froggy-img-ratio-active: var(--froggy-img-ratio, auto);
		--froggy-img-fit-active: var(--froggy-img-fit);
	}
}