.user-region {
	--ur-accent: var(--page-color, #12293F);
	--ur-accent-rgb: var(--page-color-rgb, 18, 41, 63);
	--ur-border: #d6d9dd;
	--ur-muted: #666766;
	--ur-radius: 8px;
	/* Kolor „filtrowanie włączone” – gdy wybrano region. */
	--ur-active: #C4204F;
	--ur-active-rgb: 196, 32, 79;
	--ur-navy: #12293F;
	--ur-navy-rgb: 18, 41, 63;
	--ur-tint: #E9EEF4;
	--ur-tint-border: #CAD5E2;

	position: relative;
	max-width: 420px;
	margin: 0 0 1.5rem;
	padding: 18px 20px 16px;
	border: 1px solid var(--ur-border);
	border-top: 3px solid var(--ur-accent);
	border-radius: var(--ur-radius);
	background: #fff;
	color: #050505;
	font-size: 15px;
	line-height: 1.5;
}

.user-region__title {
	margin-bottom: 4px;
	font-size: 17px;
	font-weight: 700;
	color: var(--ur-accent);
}

.user-region__desc {
	margin: 0 0 14px;
	font-size: 13px;
	color: var(--ur-muted);
}

.user-region--guest .user-region__desc {
	margin-bottom: 0;
}

.user-region__desc a {
	font-weight: 700;
	color: var(--ur-accent);
	text-decoration: underline;
}

/* Fallback bez JS */
.user-region__form {
	display: flex;
	gap: 8px;
}

.user-region__form[hidden] {
	display: none;
}

.user-region__native {
	flex: 1;
	min-width: 0;
	height: 44px;
	padding: 0 10px;
	border: 1px solid var(--ur-border);
	border-radius: var(--ur-radius);
	background: #fff;
}

.user-region__submit {
	height: 44px;
	padding: 0 16px;
	border: 0;
	border-radius: var(--ur-radius);
	background: var(--ur-accent);
	color: #fff;
	font-weight: 700;
	cursor: pointer;
}

/* Combobox */
.user-region__combo {
	position: relative;
}

.user-region__toggle {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	height: 46px;
	margin: 0;
	padding: 0 14px 0 12px;
	border: 1px solid var(--ur-border);
	border-radius: var(--ur-radius);
	background: #fff;
	color: var(--ur-muted);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.user-region__toggle:hover {
	border-color: #b2b2b2;
}

.user-region__toggle:focus-visible,
.user-region__combo.is-open .user-region__toggle {
	outline: none;
	border-color: var(--ur-accent);
	box-shadow: 0 0 0 3px rgba(var(--ur-accent-rgb), .15);
}

.user-region__combo.has-value .user-region__toggle {
	padding-right: 64px;
	border-color: var(--ur-tint-border);
	background: var(--ur-tint);
	color: var(--ur-navy);
	font-weight: 700;
}

.user-region__combo.has-value .user-region__toggle:hover {
	border-color: rgba(var(--ur-navy-rgb), .35);
}

.user-region__combo.has-value .user-region__toggle:focus-visible,
.user-region__combo.has-value.is-open .user-region__toggle {
	border-color: rgba(var(--ur-navy-rgb), .45);
	box-shadow: 0 0 0 3px rgba(var(--ur-navy-rgb), .12);
}

.user-region__combo.has-value .user-region__icon svg {
	fill: var(--ur-active);
}

.user-region__icon,
.user-region__chevron {
	display: inline-flex;
	flex-shrink: 0;
}

.user-region__icon svg {
	width: 18px;
	height: 18px;
	fill: var(--ur-accent);
}

.user-region__value {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.user-region__chevron svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
	transition: transform .2s ease-in-out;
}

.user-region__combo.has-value .user-region__chevron {
	position: absolute;
	right: 14px;
	color: var(--ur-navy);
}

.user-region__combo.is-open .user-region__chevron svg {
	transform: rotate(180deg);
}

.user-region__clear {
	position: absolute;
	top: 50%;
	right: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	margin: -12px 0 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--ur-muted);
	cursor: pointer;
	transition: background-color .15s ease-in-out, color .15s ease-in-out;
}

.user-region__clear[hidden] {
	display: none;
}

.user-region__clear:hover,
.user-region__clear:focus-visible {
	outline: none;
	background: #f0f2f0;
	color: #050505;
}

.user-region__clear svg {
	width: 14px;
	height: 14px;
	fill: currentColor;
}

.user-region__panel {
	position: absolute;
	z-index: 50;
	top: calc(100% + 6px);
	left: 0;
	right: 0;
	overflow: hidden;
	border: 1px solid var(--ur-border);
	border-radius: var(--ur-radius);
	background: #fff;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .12), 0 2px 6px rgba(0, 0, 0, .06);
	animation: user-region-in .14s ease-out;
}

.user-region__panel[hidden] {
	display: none;
}

@keyframes user-region-in {
	from { opacity: 0; transform: translateY(-4px); }
	to   { opacity: 1; transform: none; }
}

.user-region__search-wrap {
	position: relative;
	padding: 8px;
	border-bottom: 1px solid #eceeef;
}

.user-region__search-wrap svg {
	position: absolute;
	top: 50%;
	left: 20px;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	fill: var(--ur-muted);
	pointer-events: none;
}

.user-region .user-region__search {
	width: 100%;
	height: 38px;
	margin: 0;
	padding: 0 12px 0 36px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: #f5f6f7;
	color: #050505;
	font: inherit;
	font-size: 14px;
	box-shadow: none;
}

.user-region .user-region__search:focus {
	outline: none;
	border-color: rgba(var(--ur-accent-rgb), .35);
	background: #fff;
}

.user-region__list {
	max-height: 264px;
	margin: 0;
	padding: 6px;
	overflow-y: auto;
	overscroll-behavior: contain;
	list-style: none;
	scrollbar-width: thin;
}

.user-region__list:empty {
	display: none;
}

.user-region__option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin: 0;
	padding: 9px 10px;
	border-radius: 6px;
	cursor: pointer;
	font-size: 14px;
	line-height: 1.3;
}

.user-region__option::before {
	content: none;
}

.user-region__option.is-active {
	background: rgba(var(--ur-navy-rgb), .05);
}

.user-region__option.is-selected {
	background: rgba(var(--ur-navy-rgb), .08);
	color: var(--ur-navy);
	font-weight: 700;
}

.user-region__option-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.user-region__option-parent {
	font-size: 12px;
	font-weight: 400;
	color: var(--ur-muted);
}

.user-region__option mark {
	padding: 0;
	background: transparent;
	color: inherit;
	text-decoration: underline;
	text-decoration-color: var(--ur-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 2px;
	font-weight: 700;
}

.user-region__option-check {
	display: inline-flex;
	flex-shrink: 0;
}

.user-region__option-check svg {
	width: 16px;
	height: 16px;
	fill: var(--ur-navy);
}

.user-region__empty {
	padding: 18px 12px;
	font-size: 13px;
	text-align: center;
	color: var(--ur-muted);
}

.user-region__empty[hidden] {
	display: none;
}

/* Stopka: status zapisu + link do regionu */
.user-region__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 6px 12px;
	min-height: 20px;
	margin-top: 10px;
	font-size: 13px;
}

.user-region__status:empty {
	display: none;
}

.user-region__status.is-saving {
	color: var(--ur-muted);
}

.user-region__status.is-success {
	color: #28741C;
	font-weight: 700;
}

.user-region__status.is-error {
	color: #b1251e;
}

.user-region__link {
	margin-left: auto;
	font-weight: 700;
	color: var(--ur-accent);
	text-decoration: none;
}

.user-region__link:hover {
	text-decoration: underline;
}

.user-region__link[hidden] {
	display: none;
}

.user-region.is-saving .user-region__toggle {
	cursor: progress;
}

@media (prefers-reduced-motion: reduce) {
	.user-region__panel,
	.user-region__chevron svg {
		animation: none;
		transition: none;
	}
}

/* ==========================================================================
   Wariant: mobilne menu (hamburger) – widoczny tam, gdzie menu mobilne (< 1200px)
   ========================================================================== */
.user-region--menu {
	max-width: none;
	margin: 20px 0;
	padding: 14px 0 0;
	border: 0;
	border-top: 2px solid #eceeef;
	border-radius: 0;
	background: transparent;
}

.user-region--menu .user-region__title {
	margin-bottom: 8px;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.user-region--menu .user-region__toggle {
	height: 42px;
	font-size: 14px;
}

/* W wąskim, przewijanym panelu lista otwiera się w przepływie zamiast nad treścią. */
.user-region--menu .user-region__panel {
	position: static;
	margin-top: 6px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
}

.user-region--menu .user-region__list {
	max-height: 220px;
}

.user-region--menu .user-region__footer {
	margin-top: 8px;
}

.user-region--menu .user-region__link {
	margin-left: 0;
}

@media (min-width: 1200px) {
	.user-region--menu {
		display: none;
	}
}

/* ==========================================================================
   Wariant: pływający (prawy dolny róg)
   ========================================================================== */
.user-region-float {
	--ur-accent: var(--page-color, #12293F);
	--ur-accent-rgb: var(--page-color-rgb, 18, 41, 63);
	--ur-active: #C4204F;
	--ur-active-rgb: 196, 32, 79;
	--ur-navy: #12293F;
	--ur-navy-rgb: 18, 41, 63;
	--ur-tint: #E9EEF4;
	--ur-tint-border: #CAD5E2;

	/* Nad przyciskiem „do góry” (.main-footer__back-to-top__wrap: 40px, 10px od krawędzi; od 1200px – 30px). */
	position: fixed;
	z-index: 990;
	right: 10px;
	bottom: 60px;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 10px;
	max-width: calc(100vw - 20px);
}

@media (min-width: 1200px) {
	.user-region-float {
		right: 30px;
		bottom: 84px;
		gap: 12px;
	}
}

.user-region-float__toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	max-width: min(260px, 100%);
	height: 46px;
	margin: 0;
	padding: 0 18px 0 14px;
	border: 0;
	border-radius: 999px;
	background: var(--ur-accent);
	color: #fff;
	font: inherit;
	font-size: 14px;
	font-weight: 700;
	box-shadow: 0 8px 24px rgba(var(--ur-accent-rgb), .35), 0 2px 6px rgba(0, 0, 0, .15);
	cursor: pointer;
	transition: transform .15s ease-in-out, box-shadow .15s ease-in-out, background-color .2s ease-in-out, padding .25s ease-in-out, gap .25s ease-in-out;
}

.user-region-float__toggle:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(var(--ur-accent-rgb), .4), 0 2px 6px rgba(0, 0, 0, .15);
}

.user-region-float__toggle:focus-visible {
	outline: 3px solid rgba(var(--ur-accent-rgb), .35);
	outline-offset: 3px;
}

.user-region-float__toggle svg {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.user-region-float__label {
	overflow: hidden;
	max-width: 220px;
	white-space: nowrap;
	text-overflow: ellipsis;
	transition: max-width .25s ease-in-out, opacity .2s ease-in-out;
}

.user-region-float.is-compact:not(.is-open) .user-region-float__toggle:not(:hover):not(:focus-visible) {
	gap: 0;
	padding: 0 14px;
}

.user-region-float.is-compact:not(.is-open) .user-region-float__toggle:not(:hover):not(:focus-visible) .user-region-float__label,
.user-region-float.is-compact:not(.is-open) .user-region-float__toggle:not(:hover):not(:focus-visible) .user-region-float__chevron {
	max-width: 0;
	opacity: 0;
}

.user-region-float.is-compact:not(.is-open):not(.has-value) .user-region-float__toggle:not(:hover):not(:focus-visible) {
	position: relative;
}

.user-region-float.is-compact:not(.is-open):not(.has-value) .user-region-float__toggle:not(:hover):not(:focus-visible)::after {
	position: absolute;
	top: 6px;
	right: 6px;
	margin: 0;
}

/* Wybrany region = filtrowanie włączone – przycisk w kolorze „aktywnym”. */
.user-region-float.has-value .user-region-float__toggle {
	padding-right: 14px;
	border: 1px solid var(--ur-tint-border);
	border-radius: 10px;
	background: var(--ur-tint);
	color: var(--ur-navy);
	box-shadow: 0 6px 18px rgba(var(--ur-navy-rgb), .14), 0 1px 4px rgba(0, 0, 0, .08);
}

.user-region-float.has-value .user-region-float__toggle:hover {
	border-color: rgba(var(--ur-navy-rgb), .35);
	box-shadow: 0 10px 24px rgba(var(--ur-navy-rgb), .18), 0 1px 4px rgba(0, 0, 0, .08);
}

.user-region-float.has-value .user-region-float__toggle:focus-visible {
	outline-color: rgba(var(--ur-navy-rgb), .3);
}

.user-region-float.has-value .user-region-float__toggle > svg {
	fill: var(--ur-active);
}

.user-region-float__chevron {
	display: none;
	flex-shrink: 0;
	overflow: hidden;
	max-width: 18px;
	transition: max-width .25s ease-in-out, opacity .2s ease-in-out;
}

.user-region-float__chevron svg {
	display: block;
	width: 18px;
	height: 18px;
	fill: currentColor;
	transition: transform .2s ease-in-out;
}

.user-region-float.has-value .user-region-float__chevron {
	display: inline-flex;
}

.user-region-float.is-open .user-region-float__chevron svg {
	transform: rotate(180deg);
}

/* Bez wybranego regionu – delikatna pulsująca kropka zachęcająca do wyboru. */
.user-region-float:not(.has-value) .user-region-float__toggle::after {
	content: "";
	width: 8px;
	height: 8px;
	margin-left: 2px;
	border-radius: 50%;
	background: #fff;
	animation: user-region-pulse 1.8s ease-in-out infinite;
}

@keyframes user-region-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50%      { opacity: .35; transform: scale(.7); }
}

.user-region-float__card {
	position: relative;
	width: 340px;
	max-width: 100%;
	animation: user-region-in .16s ease-out;
}

.user-region-float__card[hidden] {
	display: none;
}

.user-region--floating {
	max-width: none;
	margin: 0;
	box-shadow: 0 16px 40px rgba(0, 0, 0, .16), 0 2px 8px rgba(0, 0, 0, .08);
}

.user-region--floating .user-region__title {
	padding-right: 32px;
}

/* Karta stoi przy dolnej krawędzi ekranu – lista rozwija się do góry. */
.user-region--floating .user-region__panel {
	top: auto;
	bottom: calc(100% + 6px);
	animation-name: user-region-in-up;
}

/* Lista nad kartą musi się zmieścić w oknie także na niskich ekranach (telefon w poziomie). */
.user-region--floating .user-region__list {
	max-height: max(120px, min(264px, calc(100vh - 380px)));
}

@supports (height: 100dvh) {
	.user-region--floating .user-region__list {
		max-height: max(120px, min(264px, calc(100dvh - 380px)));
	}
}

@media (max-width: 1199px) {
	.user-region--floating {
		padding: 16px 16px 14px;
	}

	.user-region-float__close {
		top: 10px;
		right: 8px;
	}
}

@keyframes user-region-in-up {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: none; }
}

.user-region-float__close {
	position: absolute;
	z-index: 1;
	top: 12px;
	right: 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: #666766;
	cursor: pointer;
	transition: background-color .15s ease-in-out, color .15s ease-in-out;
}

.user-region-float__close:hover,
.user-region-float__close:focus-visible {
	outline: none;
	background: #f0f2f0;
	color: #050505;
}

.user-region-float__close svg {
	width: 14px;
	height: 14px;
	fill: currentColor;
}

@media (prefers-reduced-motion: reduce) {
	.user-region-float__toggle,
	.user-region-float__label,
	.user-region-float__chevron,
	.user-region-float__chevron svg,
	.user-region-float__card,
	.user-region-float:not(.has-value) .user-region-float__toggle::after {
		animation: none;
		transition: none;
	}
}

/* ==========================================================================
   Widżet: Filtr regionu (górny pasek headera)
   ========================================================================== */
.user-region-status {
	--ur-active: #C4204F;
	--ur-active-rgb: 196, 32, 79;
	--ur-navy: #12293F;
	--ur-navy-rgb: 18, 41, 63;
	--ur-tint: #E9EEF4;
	--ur-tint-border: #CAD5E2;

	display: inline-flex;
	align-items: center;
	gap: 6px;
	max-width: 320px;
	height: 26px;
	padding: 0 4px 0 10px;
	border: 1px solid var(--ur-tint-border);
	border-radius: 999px;
	background: var(--ur-tint);
	color: var(--ur-navy);
	font-size: 11px;
	line-height: 1;
	white-space: nowrap;
	transition: opacity .2s ease-in-out;
}

.user-region-status[hidden] {
	display: none;
}

/* Pusty kontener widżetu (gość / brak regionu) nie zajmuje miejsca w pasku. */
.widget--user-region-status:not(:has(.user-region-status:not([hidden]))) {
	display: none;
}

.user-region-status.is-saving {
	opacity: .5;
	pointer-events: none;
}

.user-region-status__icon {
	flex-shrink: 0;
	width: 13px;
	height: 13px;
	fill: var(--ur-active);
}

.user-region-status__label {
	font-weight: 500;
	text-transform: uppercase;
	color: #666766;
}

.user-region-status__name {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: 700;
	color: var(--ur-navy);
	text-decoration: none;
}

.user-region-status__name:hover {
	text-decoration: underline;
}

.user-region-status__clear {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--ur-navy);
	cursor: pointer;
	transition: background-color .15s ease-in-out, color .15s ease-in-out;
}

.user-region-status__clear:hover,
.user-region-status__clear:focus-visible {
	outline: none;
	background: var(--ur-navy);
	color: #fff;
}

.user-region-status__clear svg {
	width: 10px;
	height: 10px;
	fill: currentColor;
}

@media (prefers-reduced-motion: reduce) {
	.user-region-status,
	.user-region-status__clear {
		transition: none;
	}
}

/* Odświeżanie treści po zmianie regionu */
.is-region-loading [data-region-block],
.is-region-loading .region-main-query #page-content {
	opacity: .5;
	pointer-events: none;
	transition: opacity .2s;
}
