/* Job-Linker — przełącznik języka w nagłówku.
 * Zgłoszenie właściciela 2026-08-16: widget GTranslate w lewym dolnym rogu
 * był na telefonie za duży i zasłaniał treść.
 *
 * ⚠️ WSZĘDZIE `!important` — CELOWO, nie z lenistwa.
 * GTranslate nie ma pliku CSS. Jego `float.js` **skleja arkusz w JavaScripcie
 * i wstrzykuje go do `<head>` po załadowaniu strony**, czyli PO naszym pliku.
 * Kolejność w kaskadzie jest więc zawsze przeciwko nam i sama specyficzność
 * selektora nie wystarcza. To jedyne miejsce w motywie, gdzie ta reguła
 * obowiązuje — nie kopiuj tego wzorca do innych plików.
 */

.jl-lang-slot {
	display: inline-flex;
	align-items: center;
	/* Lista języków musi móc wyjść poza pasek nagłówka. */
	overflow: visible;
	position: relative;
	z-index: 1000;
}

/* 🔴 PUŁAPKA znaleziona 2026-09-03 (zgłoszenie właściciela: na liście ofert nie da się
 * kliknąć języka w środku rozwiniętej listy, bo "Szybkie filtry" są nad nią).
 *
 * z-index:1000 na .jl-lang-slot działa TYLKO wewnątrz stosu warstw nagłówka - nie
 * pozwala niczemu "uciec" ponad INNY stos warstw. Sam nagłówek motywu ma WŁASNY,
 * niski z-index (`.apus-header` = 6 na desktopie, `.header-mobile` = 3 na telefonie),
 * a pasek "Szybkie filtry" nad mapą (`.jl-qf`, jl-quick-filters.css) jest `sticky`
 * z z-index:20 - wyzszym niz caly naglowek. Efekt: rozwinieta lista jezykow rysuje
 * sie POD paskiem filtrow, choc sama w sobie ma z-index 1000.
 *
 * Naprawa: podnosimy z-index NAGLOWKA (nie samej listy) ponad 20, zeby caly jego stos
 * warstw mogl wygrac z paskiem filtrow. Zostaje bezpiecznie ponizej Select2 (1051) i
 * modala aplikacji (1050) - patrz komentarz w jl-quick-filters.css.
 *
 * ⚠️ `!important` tu OBOWIAZKOWE z INNEGO powodu niz reszta pliku: `.apus-header {
 * z-index: 6; }` w motywie rodzica (superio/css/template.css) ma TAKA SAMA
 * specyficznosc jak nasza regula - o tym, kto wygrywa, decyduje wylacznie kolejnosc
 * w kaskadzie. Sprawdzone w przegladarce: `jl-lang-switcher.css` laduje sie PRZED
 * `template.css` (kolejnosc enqueue), wiec bez `!important` regula motywu rodzica
 * i tak wygrywala mimo pozniejszej zmiany. */
.apus-header,
.header-mobile {
	z-index: 30 !important;
}

/* --- sam przełącznik: z „pudełka" robimy mały guzik --------------------- */

.jl-lang-slot .gt_float_switcher {
	font-family: inherit !important;
	font-size: 12px !important;
	line-height: 1 !important;
	/* Cień i białe tło miały sens przy elemencie pływającym nad treścią.
	 * W pasku nagłówka wyglądałyby jak przyklejona naklejka. */
	box-shadow: none !important;
	background: transparent !important;
	border-radius: 8px !important;
}

.jl-lang-slot .gt_float_switcher .gt-selected {
	background-color: transparent !important;
	border-radius: 8px !important;
	float: none !important;
}

.jl-lang-slot .gt_float_switcher .gt-selected .gt-current-lang {
	padding: 4px 6px !important;
	display: flex !important;
	align-items: center !important;
	gap: 4px;
}

/* Flaga: wtyczka daje 33 px, w pasku nagłówka to za dużo. */
.jl-lang-slot .gt_float_switcher img {
	width: 20px !important;
	height: auto !important;
	margin: 0 !important;
	border-radius: 3px !important;
	vertical-align: middle !important;
}

.jl-lang-slot .gt_float_switcher .gt-selected .gt-current-lang span.gt-lang-code {
	top: 0 !important;
	font-weight: 600;
	letter-spacing: .02em;
}

/* --- rozwinięta lista --------------------------------------------------- */

.jl-lang-slot .gt_float_switcher .gt_options {
	position: absolute !important;
	top: 100% !important;
	right: 0 !important;
	min-width: 130px;
	background: #fff !important;
	border-radius: 8px !important;
	box-shadow: 0 6px 20px rgba(0, 51, 102, .18) !important;
	overflow: hidden !important;
}

.jl-lang-slot .gt_float_switcher .gt_options a {
	padding: 8px 10px !important;
	font-size: 13px !important;
	color: #003366 !important;
}

.jl-lang-slot .gt_float_switcher .gt_options a:hover {
	background: #F2F5F9 !important;
	color: #003366 !important;
}

/* --- telefon: jeszcze ciaśniej, obok hamburgera ------------------------- */

.jl-lang-slot--mobile {
	/* Odstęp od dzwonka po lewej i od hamburgera po prawej. */
	margin: 0 10px 0 4px;
}

.jl-lang-slot--desktop {
	margin-left: 14px;
}

@media ( max-width: 480px ) {
	/* Na najwęższych ekranach zostaje sama flaga — kod języka („PL") niesie
	 * tę samą informację co flaga, a każde 20 px w tym pasku jest zajęte. */
	.jl-lang-slot--mobile .gt_float_switcher .gt-selected .gt-current-lang span.gt-lang-code {
		display: none !important;
	}

	.jl-lang-slot--mobile {
		margin: 0 6px 0 2px;
	}
}

/* Widoczny stan skupienia (dostępność) — motyw go tu nie daje. */
.jl-lang-slot .gt_float_switcher .gt-selected:focus-visible,
.jl-lang-slot .gt_float_switcher .gt_options a:focus-visible {
	outline: 2px solid #007BFF !important;
	outline-offset: 2px;
}