/*
 * Vzhľad hlavného menu, kým ho neprevezme JavaScript.
 *
 * PREČO
 * -----
 * Menu skladá knižnica priority-plus z bundle.js — z <ul class="js-priority-nav-header">
 * si vyrobí vlastnú štruktúru .p-plus__primary-wrapper > .p-plus__primary-nav-item.
 * VŠETKY pravidlá pre navigáciu v bundle.css sú viazané na tie .p-plus triedy;
 * na surový <ul> neexistuje ani jedno. Kým sa teda nestiahne a nespustí
 * bundle.js (165 kB na konci <body>), menu sa vykreslí ako holý zoznam
 * modrých podčiarknutých odkazov cez celú šírku hlavičky.
 *
 * Nie je to pomalé CSS — šesť stylesheetov je stiahnutých do ~0,2 s. Je to
 * čakanie na JavaScript.
 *
 * ČO S TÝM
 * --------
 * Hodnoty nižšie sú opísané z .p-plus__primary a .p-plus__primary-nav-item > a
 * v bundle.css, takže prechod na hotové menu nie je vidieť.
 *
 * Geometria musí sedieť na pixel, nielen farby a písmo:
 *   - položky sa NEROZŤAHUJÚ. .p-plus__primary má síce `flex: 1 0 auto`, ale
 *     jeho obal .p-plus__primary-wrapper nerastie, takže hotové menu je
 *     natlačené doľava. S rastúcimi položkami mal surový zoznam väčšie medzery
 *     a po spustení JS sa zmrštil.
 *   - hotové menu je posunuté o -15px (.p-plus-container), surový zoznam musí tiež.
 *
 * Zámerne sa menu NESKRÝVA. Skryť ho a odkryť až triedou, ktorú pridá JS, by
 * znamenalo, že pri chybe v JS zmizne navigácia úplne — to je horšia porucha
 * než krátky preblik.
 *
 * SAMO SA VYPNE
 * -------------
 * Dve poistky naraz: `> ul` prestane platiť, keď priority-plus zoznam zabalí
 * hlbšie, a `:not(.p-plus__primary)`, keby mu len pridal triedu na mieste.
 * Po inicializácii teda tieto pravidlá nemajú čo prebiť.
 *
 * Toto je náplasť v tomto repe. Správne miesto je bundle.css v repe
 * hotelpark-frontend; keď sa tam bude robiť ďalší zásah, patrí to tam.
 */

.c-header .navigation > ul.js-priority-nav-header:not(.p-plus__primary) {
	display: flex;
	flex: 0 0 auto;
	list-style: none;
	padding: 0;
	margin: 0;
}

.c-header .navigation > ul.js-priority-nav-header:not(.p-plus__primary) > li {
	flex: 1 0 auto;
}

.c-header .navigation > ul.js-priority-nav-header:not(.p-plus__primary) > li > a {
	display: inline-flex;
	align-items: center;
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .3px;
	font-size: 14px;
	padding: 18px 12px;
	text-decoration: none;
}

/* Nemčina má dlhšie názvy položiek, preto užšie odsadenie — rovnako ako bundle.css. */
body[data-language="de"] .c-header .navigation > ul.js-priority-nav-header:not(.p-plus__primary) > li > a {
	padding: 18px 6px;
}

@media (min-width: 992px) {
	.c-header .navigation > ul.js-priority-nav-header:not(.p-plus__primary) {
		margin-left: -15px;
	}

	/*
	 * Posledná položka („Kontakt“) po načítaní odskakovala do „Viac“.
	 *
	 * priority-plus rozhoduje, čo sa zmestí, na skrytom klone menu, v ktorom je
	 * tlačidlo „Viac“ zobrazené VŽDY (~70 px), aj keď by potom nebolo treba.
	 * bundle.css kontajner posúva o -15px doľava, ale šírku mu nechá 100 %,
	 * takže vpravo ostáva 15 px nevyužitých. Pri kontajneri 1170 px (≥ 1200 px)
	 * potrebuje osem SK položiek 1000 px a klon im nechal 995 px — o 5 px menej.
	 *
	 * Vrátením tých 15 px končí menu presne na pravom okraji kontajnera
	 * (zarovno s prepínačom jazyka) a všetky položky sa zmestia s rezervou ~10 px.
	 * Na užších šírkach (992–1199 px) sa položky do „Viac“ presúvajú naďalej,
	 * tam sa naozaj nezmestia.
	 *
	 * Mobil (< 992 px) má v bundle.css vlastné `margin-left: 0; width: 100%`.
	 */
	.c-header .navigation .p-plus-container {
		width: calc(100% + 15px);
	}
}