/**
 * Rozbalovaci menu v hlavicce.
 *
 * Panel dodava plugin Max Mega Menu, ktery si vlastni podobu vynucuje
 * generovanym stylem s vysokou vahou - proto ty dlouhe selektory a
 * "!important". Vlastni soubor drzi tuhle vyjimku pohromade a mimo
 * hlavni styl webu.
 */

/*
 * Panel naskoci hned. Puvodni efekt "fade_up" ho pul vteriny prolinal
 * a posouval, takze mezi najetim mysi a prectenim odkazu byla prodleva.
 */
#mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-item ul.mega-sub-menu {
	transition: none !important;
	transform: none !important;
}

/* Panel je bily list s oranzovym pruhem, ne sedy blok bez hranic. */
#mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > ul.mega-sub-menu {
	padding: 28px 30px !important;
	border-top: 3px solid var(--acjc-accent, #fe7912) !important;
	background: #fff !important;
	box-shadow: 0 18px 40px rgba(0, 0, 0, .14) !important;
}

/*
 * Sloupce panelu stoji v mrizce se stejnymi mezerami. Mrizka patri az na
 * vnoreny seznam - "mega-menu-row" ma jedineho potomka, ktery teprve
 * obsahuje jednotlive sloupce.
 */
#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-menu-row > ul.mega-sub-menu {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 10px 30px;
}

#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-menu-column {
	float: none !important;
	width: auto !important;
	padding: 0 !important;
}

/* Nadpisy sloupcu jsou mensi nez nadpisy stranky, at nekrici. */
#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu h2,
#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu h3,
#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu .mega-block-title {
	margin: 0 0 14px !important;
	color: var(--acjc-dark, #161922) !important;
	font-size: 19px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	text-transform: none !important;
}

#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu p {
	margin: 0 0 10px !important;
	font-size: 15px !important;
	line-height: 22px !important;
}

/* Odkazy: jedna barva, bez odrazek, dotykova vyska. */
#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu ul,
#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu li {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu li::marker {
	content: none;
}

#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu a {
	display: block;
	padding: 7px 0 !important;
	color: var(--acjc-accent-ink, #fe7912) !important;
	font-size: 16px !important;
	line-height: 22px !important;
	text-decoration: none !important;
}

#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu a:hover,
#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu a:focus-visible {
	color: var(--acjc-accent-dark, #c85a00) !important;
	text-decoration: underline !important;
}

#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu img {
	display: block;
	max-width: 100%;
	height: auto;
}

/*
 * Loga znacek uvnitr sloupcu at se neroztahuji pres celou sirku - jsou to
 * doplnky, ne hlavni obsah. Fotku v poslednim sloupci to nechava velkou,
 * protoze ta uz sirku sloupce ma.
 */
#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-sub-menu .mega-menu-column img {
	max-width: 100%;
	height: auto;
}

/*
 * Vyska radku s menu se nesmi menit.
 *
 * Mezi 820 a 960 px se polozky nevesly na jednu radu, menu se zlomilo na dve
 * a hlavicka tim narostla o 70 px - obsah pod ni pri nacitani poskocil (CLS
 * 0,61). Polozky se v tomto rozmezi zuzi, aby se vesly, a rada ma pevnou
 * vysku, takze uz nic neposkakuje.
 */
@media only screen and (min-width: 768px) {
	/*
	 * "nowrap" na seznamu je tu podstatny: nez se nacte Titillium, meri se
	 * polozky nahradnim pismem, ktere je sirsi. Bez nej se menu pri prvnim
	 * vykresleni zlomilo na tri rady (190 px) a po vymene pisma se srovnalo
	 * na jednu (70 px) - cely obsah stranky se tim posunul o 120 px.
	 */
	.acjc-header #mega-menu-wrap-main-menu #mega-menu-main-menu {
		height: 70px;
		white-space: nowrap;
	}

	.acjc-header #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item {
		white-space: nowrap;
	}

	/* Rozbalovaci panel z pevne vysky vystupuje, proto vlastni zalamovani. */
	.acjc-header #mega-menu-wrap-main-menu #mega-menu-main-menu ul.mega-sub-menu {
		white-space: normal;
	}

	/*
	 * Cely radek s menu a ikonami ma pevnou vysku. Nez se nacte pismo, byl
	 * o 46 px vyssi a stranka pod nim jeste jednou poskocila.
	 */
	.acjc-header .mcb-item-header_menu-inner,
	.acjc-header .mcb-item-header_icon-inner,
	.acjc-header #mega-menu-wrap-main-menu,
	.acjc-header .mcb-column-inner:has(#mega-menu-wrap-main-menu),
	.acjc-header .mcb-wrap-inner:has(#mega-menu-wrap-main-menu),
	.acjc-header .section_wrapper:has(#mega-menu-wrap-main-menu) {
		height: 70px;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
	.acjc-header #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link {
		padding-right: 9px !important;
		padding-left: 9px !important;
		font-size: 15px !important;
	}
}

@media only screen and (min-width: 768px) and (max-width: 879px) {
	.acjc-header #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link {
		padding-right: 6px !important;
		padding-left: 6px !important;
		font-size: 14px !important;
	}

	/* Sipka u rozbalovaci polozky si tu bere misto, ktere chybi nazvum. */
	.acjc-header #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > a.mega-menu-link::after {
		margin-left: 3px !important;
	}
}

@media only screen and (max-width: 959px) {
	#mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item > ul.mega-sub-menu {
		padding: 18px !important;
		box-shadow: none !important;
	}

	#mega-menu-wrap-main-menu #mega-menu-main-menu .mega-menu-row {
		grid-template-columns: minmax(0, 1fr);
		gap: 6px;
	}
}