/*
 * Ikona košíku v hlavičce (`Front\CartBadge`). Načítá se na celém webu (ADR 0070
 * bod 1), zbytek veřejné části (`public.css`) jen na stránkách vstupenek
 * a koncertu s nákupem; tam se tenhle soubor načte až po něm, pořadí
 * pravidel zůstává jako dřív, kdy tu byl oddíl 7 souboru `public.css`.
 *
 * Barvy ikony (`--doubravan-header-accent`, `--doubravan-accent`) dosazuje
 * `Front\Assets::palette_css()` hned za tenhle soubor. Ostatní tokeny
 * z `public.css` tu nemusí být, proto mají záložní hodnotu.
 */

/* Košík v hlavičce (ADR 0049): akcent hlavičky, bez pozadí (ADR 0045
   bod 7). Od 1000 px poslední položka hlavního menu, pod 1000 px přepínač
   vlevo od „Menu“ Twenty Twenty; hranice je stejná jako u menu šablony. */
.doubravan-header-cart {
	color: var(--doubravan-header-accent, var(--doubravan-accent));
	text-decoration: none;
}

.doubravan-header-cart svg {
	display: block;
	flex: 0 0 auto;
	width: 2.4rem;
	height: 2.4rem;
}

.doubravan-header-cart:hover .doubravan-header-cart__label,
.doubravan-header-cart:focus .doubravan-header-cart__label {
	text-decoration: underline;
}

/* Položka menu: písmo a barvu dědí z `.primary-menu a`, ikona a počet
   v řádku s popiskem. `display` přebíjí `display: block` šablony. */
.primary-menu .doubravan-header-cart--menu {
	display: flex;
	align-items: center;
	gap: 0.6rem;
}

.doubravan-header-cart--menu svg {
	width: 2.2rem;
	height: 2.2rem;
}

.doubravan-header-cart--menu .doubravan-header-cart__badge {
	margin-left: 0.2rem;
}

/* Přepínač: stejná stavba jako `.toggle` šablony – vnitřek 2,3rem
   na středu výšky hlavičky, popisek 0,5rem pod ním. Ikona tak leží
   na ose tří teček „Menu“, popisek na řádku s „Menu“ a „Hledat“.
   Vpravo ho odsouvá šířka `.nav-toggle` (6,6rem, od 700 px navíc
   jeho odstup 2rem). */
.doubravan-header-cart--toggle {
	display: flex;
	align-items: center;
	padding: 0 1rem;
}

.doubravan-header-cart--toggle.is-in-header {
	position: absolute;
	top: 0;
	right: 6.6rem;
	bottom: 0;
}

.doubravan-header-cart__inner {
	position: relative;
	display: flex;
	justify-content: center;
	height: 2.3rem;
}

.doubravan-header-cart--toggle .doubravan-header-cart__label {
	position: absolute;
	top: calc(100% + 0.5rem);
	color: #6d6d6d;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.25;
	white-space: nowrap;
}

.doubravan-header-cart--toggle .doubravan-header-cart__badge {
	position: absolute;
	top: -1rem;
	left: calc(50% + 0.4rem);
}

@media (min-width: 700px) {
	.doubravan-header-cart--toggle.is-in-header {
		right: 8.6rem;
	}

	.doubravan-header-cart--toggle .doubravan-header-cart__label {
		font-size: 1.2rem;
	}
}

@media (min-width: 1000px) {
	.doubravan-header-cart--toggle {
		display: none;
	}
}

/* Počet jen s něčím v košíku. Pilulka (zjištění z testování 9. 10.: nad
   9 položek se dvouciferné číslo do kruhu nevešlo) – `min-width` drží na
   jednu číslici kruh, `white-space` a `flex-shrink` nedovolí číslu zalomit
   se nebo zúžit pod přirozenou šířku, i kdyby okolní flex kontejner (menu
   v hlavičce) byl stísněný. */
.doubravan-header-cart__badge {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	min-width: 2rem;
	height: 2rem;
	padding: 0 0.5rem;
	border-radius: 999px;
	background: var(--doubravan-header-accent, var(--doubravan-accent));
	color: #fff;
	/* Záloha je stejné písmo jako token v `public.css`. */
	font-family: var(--doubravan-font-sans, "Inter var", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif);
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: normal;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.doubravan-header-cart__badge[hidden] {
	display: none;
}

/* Po přidání štítek jednou naskočí (ADR 0045 bod 5). */
@media (prefers-reduced-motion: no-preference) {
	.doubravan-header-cart__badge.is-bumped {
		animation: doubravan-badge-bump 0.45s ease-out;
	}
}

@keyframes doubravan-badge-bump {
	0% {
		transform: scale(1);
	}

	35% {
		transform: scale(1.45);
	}

	100% {
		transform: scale(1);
	}
}