/*
 * Noga: učinek razkritja.
 *
 * Noga je za glavno vsebino (main) prilepljena na spodnji rob zaslona, glavna vsebina
 * pa se ob pomikanju dvigne in jo postopoma odkrije (kot na radenska.si).
 *
 * Učinek vklopi js/footer.js z razredom "footerReveal" na <html> (in nastavi --footer__height),
 * zato je brez JS-a in pri zmanjšanem gibanju noga navadna noga na koncu strani.
 *
 * - Noga ima z-index: -1, zato jo main prekrije z lastnim ozadjem, hkrati pa main ne postane
 *   svoj stacking context (modali, meniji ... znotraj main ostanejo nad glavo strani).
 * - body je izoliran (isolation: isolate), sicer bi noga z negativnim z-indexom ležala pod poljem
 *   elementa body in njene povezave ne bi bile klikljive. Vrstni red ostalih elementov se ne spremeni.
 * - position: sticky + bottom: 0 drži nogo na dnu zaslona, dokler se ne pomakne na svoje
 *   naravno mesto. Če je noga višja od zaslona, jo negativen bottom pripne na vrh zaslona,
 *   tako da se vsebina noge nikoli ne odreže.
 * - Zgornji odmik noge je prestavljen na main (spodnji odmik). Na velikih zaslonih ga ni: razmik do
 *   zelene noge je spodnji odmik zadnjega bloka, razen če je zadnji blok zelen (da se ne stika z nogo).
 */

html.footerReveal body > .footer {
	padding-block-end: 0;
}

@media screen and (prefers-reduced-motion: no-preference) {
	html.footerReveal body {
		isolation: isolate;
	}

	html.footerReveal body > .footer {
		position: sticky;
		bottom: 0;
		bottom: min(0px, calc(100vh - var(--footer__height, 0px)));
		bottom: min(0px, calc(100dvh - var(--footer__height, 0px)));
		z-index: -1;

		padding-top: 0;
	}

	html.footerReveal body > main {
		/* padding-bottom: var(--theme__padBlockStart); */
		background-color: var(--color__white);
	}
}


@media screen and (prefers-reduced-motion: no-preference) and (min-width: 65em) {
	html.footerReveal body > main:not(:has(> .theme--green:last-child)) {
		padding-bottom: 0;
	}
}