/* J-Tools: układ nagłówka TownPress 3.x (Ustawienia → J-Tools → Nagłówek). Kolory i drobny wygląd — w Dodatkowym CSS strony. */

@media (min-width: 992px) {

	/* Menu główne w nagłówku: logo po lewej na wysokości dwóch rzędów, nad menu przyciski i wyszukiwarka. */
	.jtools-menu-w-naglowku .header__content-inner {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-areas: "logo narzedzia" "logo menu";
		/* przyciski na górze, menu 20 px pod nimi; nadmiar wysokości (wysokie logo) zostaje pod menu */
		grid-template-rows: auto 1fr;
		align-items: start;
		column-gap: 30px;
		row-gap: 20px;
	}

	.jtools-menu-w-naglowku .header-logo {
		grid-area: logo;
		width: auto;
	}

	.jtools-menu-w-naglowku .header-toolbar {
		grid-area: narzedzia;
		position: static;
		justify-self: end;
	}

	/* Pasek menu na szerokość pozycji, przy prawej krawędzi (jak w TownPress 1.x). */
	.jtools-menu-w-naglowku .jtools-menu-naglowek {
		grid-area: menu;
		width: fit-content;
		max-width: 100%;
		margin-left: auto;
	}

	/* Styl klasyczny (TownPress 1.x): pasek 50 px z zaokrągleniem i cieniem, pozycje 16 px, strzałka podmenu przy tekście,
	   aktywna pozycja pogrubiona bez tła, podmenu 220 px tuż pod paskiem. Kolor paska — akcent ze skórki motywu. */
	.jtools-menu-klasyczne .jtools-menu-naglowek {
		padding: 0 15px;
		border: 0;
		border-top: 3px solid rgba(0, 0, 0, .2);
		border-radius: 4px;
		box-shadow: -10px 10px 10px rgba(0, 0, 0, .25);
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .header-menu__list {
		padding: 0;
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .header-menu__item--level-0 {
		padding: 0;
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .header-menu__item--level-0.menu-item-has-children {
		padding-right: 10px;
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .header-menu__item-link--level-0 {
		height: auto;
		padding: 14px 10px;
		font-size: 16px;
		font-weight: 400;
		line-height: 19.2px;
		letter-spacing: normal;
		background: none;
		border: 0;
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .menu-item-has-children > .header-menu__item-link--level-0 {
		padding-right: 22px;
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .menu-item-has-children > .header-menu__item-link--level-0::after {
		top: 17px;
		right: 0;
		font-size: 12px;
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .header-menu__item--level-0.current-menu-item > .header-menu__item-link--level-0,
	.jtools-menu-klasyczne .jtools-menu-naglowek .header-menu__item--level-0.current-menu-ancestor > .header-menu__item-link--level-0 {
		font-weight: 700;
		background: none;
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .header-menu__submenu--level-0 {
		top: 100%;
		left: 0;
		width: 220px;
		padding: 5px 15px;
	}

	.jtools-menu-klasyczne .jtools-menu-naglowek .header-menu__submenu--level-0 .header-menu__item-link {
		padding: 7px 0;
		font-size: 14px;
		line-height: 18.2px;
	}

	/* Przyciski (widżety) i wyszukiwarka w jednym rzędzie. */
	.jtools-przyciski-w-rzedzie .header-toolbar {
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: flex-end;
		/* odstęp przed wyszukiwarką daje jej margines z motywu (20 px) */
		gap: 0;
	}

	.jtools-przyciski-w-rzedzie .header-toolbar::before,
	.jtools-przyciski-w-rzedzie .header-toolbar::after {
		display: none;
	}

	.jtools-przyciski-w-rzedzie .header-toolbar > * {
		float: none;
		margin-top: 0;
		margin-bottom: 0;
	}
}

/* Elementy paska nagłówka (przyciski, wyszukiwarka) pływają w prawo co 20 px; 20 px odstępu pod wyszukiwarką. */
.jtools-pasek-w-prawo .header-toolbar__item {
	float: right;
	margin-left: 20px;
}

.jtools-pasek-w-prawo .header-search .c-search-form {
	margin: 0 0 20px;
}

/* Telefony (opcja „mobilne”): po rozwinięciu „Menu” — menu, pod nim wyśrodkowany rząd przycisków, na dole wyszukiwarka
   na całą szerokość; bez szerokości, floatów i przesunięć z widoku komputerowego. Motyw pokazuje pasek przez slideToggle
   (display:block w atrybucie style), więc układ kolumnowy dotyczy tylko rozwiniętego paska. */
@media (max-width: 991px) {
	.jtools-naglowek-mobilny .header-toolbar-toggle__menu-button--active {
		color: #fff;
	}

	.jtools-naglowek-mobilny .header-toolbar[style*="block"] {
		display: flex !important;
		flex-direction: column;
		gap: 15px;
	}

	.jtools-naglowek-mobilny .header-toolbar > * {
		order: 2;
	}

	.jtools-naglowek-mobilny .header-toolbar > #header-mobile-menu {
		order: 1;
	}

	.jtools-naglowek-mobilny .header-toolbar > .header-search {
		order: 3;
	}

	body.jtools-naglowek-mobilny #header .header-toolbar .widget {
		width: auto;
		margin: 0;
	}

	body.jtools-naglowek-mobilny #header .header-toolbar .widget__inner {
		width: auto !important;
		max-width: none;
		padding: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
	}

	body.jtools-naglowek-mobilny #header .header-toolbar .jtools-przyciski:not(.jtools-przyciski--bez-telefonu) {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		gap: 10px;
		margin: 0;
		box-shadow: none;
	}

	body.jtools-naglowek-mobilny #header .header-toolbar .jtools-przycisk {
		float: none;
		margin: 0 !important;
	}

	body.jtools-naglowek-mobilny #header .header-toolbar .jtools-przyciski--polacz-dostepnosc .a11y-toggle + .a11y-toggle {
		margin-left: -10px !important;
	}

	body.jtools-naglowek-mobilny #header .header-toolbar .header-search {
		float: none;
		width: auto;
		margin: 0 !important;
	}
}

/* Menu zastępcze (strona bez własnego menu mobilnego): motyw wstawia na początek paska nav menu mobilnego (na komputerze
   ukryty), przez co pierwszy widżet przestaje być :first-child i dostaje margines .widget (24 px) — przyciski zjechałyby
   w dół. Na komputerze zostaje więc jak przed dodaniem menu. */
@media (min-width: 992px) {
	.jtools-menu-mobilne-zastepcze .header-toolbar > .header-mobile-menu:first-child + .widget {
		margin-top: 0;
	}
}
