/* =============================================================================
   foreto — okruszki: dodatki motywu ponad komponent kitu

   Sam komponent (.foreto-crumbs, lista, separator, stopień bieżący) siedzi
   w kit.css jako przeniesiony wycinek. Tutaj zostaje tylko to, czego kit nie
   rozstrzyga, bo w projekcie ścieżka występowała wyłącznie w jednym miejscu —
   wyśrodkowana pod tytułem podstrony.
   ========================================================================== */

/* Pozycja trzyma etykietę i separator w jednym wierszu. Kit robi to stylem
   wpisanym w znacznik partiala; tutaj jest regułą, bo blok generuje znacznik
   sam i nie ma powodu powielać deklaracji przy każdej pozycji. */
.foreto-crumbs__item {
	display: inline-flex;
	align-items: center;
	gap: var(--foreto-space-3);
	/* Pozycja siatki flex domyślnie nie schodzi poniżej szerokości treści —
	   bez tego długi tytuł rozpycha wiersz zamiast się złamać. */
	min-width: 0;
}

/* Ścieżka nie skraca się do wielokropka i nie przewija w bok: na telefonie
   łamie się na drugi wiersz, bo tytuł realizacji bywa dłuższy niż ekran,
   a ucięty stopień przestaje odpowiadać na pytanie „gdzie jestem”. Kit tego
   nie przewiduje, bo w projekcie ścieżka miała najwyżej trzy krótkie stopnie. */
.foreto-crumbs__list {
	flex-wrap: wrap;
	row-gap: var(--foreto-space-1);
	margin: 0;
	padding: 0;
	list-style: none;
}

.foreto-crumbs [aria-current="page"] {
	overflow-wrap: anywhere;
}

/* Wariant przy lewej krawędzi. Kit środkuje, bo znał tylko jedno użycie —
   nagłówek podstrony. Pod tytułem wpisu ścieżka stoi w kolumnie treści i
   wyśrodkowana rozjeżdżałaby się z nagłówkiem nad nią. */
.foreto-crumbs--start .foreto-crumbs__list {
	justify-content: flex-start;
}