/*==============================
|   Demo Page
\==============================*/

.tpb-theme-4-page-map {
	--tpb-theme-page-map--transition-time: 0.3s;
	/* --tpb-theme-page-map--transition-time: 0s; */
}

.tpb-theme-4-page-map #demo-content {
	position: relative;
	width: 100%;
}

.tpb-theme-4-page-map #demo-content__inner {
	position: relative;
	width: 100%;
	max-width: 1000px;
}

.tpb-theme-4-page-map #main__inner {
	position: relative;
	padding: 0;
	height: 100%;
	display: block;
}

.tpb-theme-4-page-map #main__inner h3 {
	margin: 0;
	font-size: 1.5rem;
}

/* Map Wrapper */
.tpb-theme-4-page-map #map-wrapper {
	position: relative;
	width: 100%;
	min-height: calc(100svw / 0.74);
	/* min-height: calc(100svh - var(--tpb-scroll-padding-top, 0px) - var(--tpb-footer-height)); */
	height: auto;
	max-height: clamp(
		calc(100svh - var(--tpb-scroll-padding-top, 0px) - var(--tpb-footer-height)),
		calc(100svh - var(--tpb-scroll-padding-top, 0px)),
		800px
	);
	/* max-height: none; */
	margin: 0;
	padding: 0;
	background-color: #fff;
}

.tpb-theme-4-page-map .maplibregl-ctrl-bottom-right .maplibregl-ctrl:first-child {
	/* width: fit-content; */
	/* float: right; */
	margin: 10px 10px 0 10px;
}

/*==============================
|   New filter list
\==============================*/

.tpb-theme-4-page-map #map-filters {
	--tpb-map-filters--background-color: #000;
	--tpb-map-filters--color: #fff;
	--tpb-map-filters--padding: 1rem;
	--tpb-map-filters-button--border-width: 1px;
	--tpb-map-filters-button--border-style: solid;
	--tpb-map-filters-button--border-radius: 0.5em;
	--tpb-map-filters-button--padding-x: 0.2em;
	--tpb-map-filters-button--padding-y: 0.5em;
	--tpb-filter-heading--font-size: calc(1rem + 0.3vw);
	--tpb-map-filters--box-shadow: none;

	font-size: 1.25rem;
	line-height: 1.2em;
	color: var(--tpb-map-filters--color);
	height: auto;
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	padding: 0;
}

.tpb-theme-4-page-map .drop-shadow #map-filters {
	--tpb-map-filters--box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.25);
}

.tpb-theme-4-page-map .filters-container {
}

.tpb-theme-4-page-map .filters-container-heading {
	position: relative;
}

.tpb-theme-4-page-map .filters-container-heading > img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	filter: drop-shadow(var(--tpb-map-filters--box-shadow));
}

.tpb-theme-4-page-map #map-filters-mobile-container .filters-container-heading,
.tpb-theme-4-page-map .filters-container-heading ~ * {
	background-color: var(--tpb-map-filters--background-color);
}

.tpb-theme-4-page-map .filters-container.tpb-accessible-accordion {
	--tpb-accessible-accordion-button__padding-x: var(--tpb-map-filters--padding);
	--tpb-accessible-accordion-button__padding-y: calc(var(--tpb-accessible-accordion-button__padding-x)/1);
	--tpb-accessible-accordion-button__border-color: #fff;
	--tpb-accessible-accordion-icon__filter: invert(1);
}

.tpb-theme-4-page-map .filters-container.tpb-accessible-accordion .tpb-accessible-accordion-title {
	margin-right: 1rem;
}

.tpb-theme-4-page-map .filters-container fieldset {
	--tpb-fieldset-legend--padding-top: var(--tpb-map-filters--padding);
	--tpb-fieldset-legend--padding-bottom: calc(var(--tpb-map-filters--padding) / 2);

	position: relative;
	margin: 0;
	padding: 0;
	min-width: unset;
	border: none;
}

.tpb-theme-4-page-map .filters-container fieldset:before {
	content: '';
	position: absolute;
	top: 0;
	left: 1rem;
	width: calc(100% - 2 * var(--tpb-map-filters--padding));
	border-top: 1px solid #fff;
}

.tpb-theme-4-page-map .filters-container fieldset > legend {
	position: absolute;
	top: 0;
	left: 0;
	float: none;
	width: auto;
	margin: 0;
	line-height: 1em;
	padding-top: var(--tpb-fieldset-legend--padding-top);
	padding-right: var(--tpb-map-filters--padding);
	padding-bottom: var(--tpb-fieldset-legend--padding-bottom);
	padding-left: var(--tpb-map-filters--padding);
}

.tpb-theme-4-page-map .filters-container .tpb-accessible-accordion-panel > *:last-child {
	margin-bottom: 0;
}

.tpb-theme-4-page-map .filters-container .filter-group,
.tpb-theme-4-page-map .filters-container .filter-info {
	padding: var(--tpb-map-filters--padding);
}

.tpb-theme-4-page-map .filters-container .filter-group {
	/* --tpb-filter-heading--font-size: calc(1rem + .3vw); */
}

.tpb-theme-4-page-map .filters-container .filter-group:has(.filter-heading) {
	padding-top: calc(
		var(--tpb-filter-heading--font-size) + var(--tpb-fieldset-legend--padding-top) +
			var(--tpb-fieldset-legend--padding-bottom)
	);
}

.tpb-theme-4-page-map .filters-container .filter-heading {
	font-family: 'Moderat';
	font-weight: 600;
	text-transform: uppercase;
	display: block;
	flex-basis: 100%;
	font-size: var(--tpb-filter-heading--font-size);
}

.tpb-theme-4-page-map .filters-container .filter-list {
}

.tpb-theme-4-page-map .filters-container #year-filter-list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0 0.5em;
}

.tpb-theme-4-page-map .filters-container .filter-info {
	background-color: #fff;
	color: #000;
	border: 1px solid #000;
	font-size: 1rem;
	font-weight: 400;
}

.tpb-theme-4-page-map .filters-container .filter-info > *:last-child,
.tpb-theme-4-page-map .filters-container .filter-info .info-message > *:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
}

.tpb-theme-4-page-map .filters-container .filter-group.active-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25em 0.5em;
	align-items: center;
}

.tpb-theme-4-page-map .filters-container .filter-group.no-filters-available {
	display: none;
}

.tpb-theme-4-page-map .filters-container .filter-group.active-filters > .filter-list {
	display: contents;
}

.tpb-theme-4-page-map #active-filters-list .filter-item {
	max-width: 100%;
}

.tpb-theme-4-page-map #active-filters-list .filter-item-label {
	max-width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;

	background-color: var(--tpb-map-filters--background-color);
	color: var(--tpb-map-filters--color);
	/* border: 1px solid var(--tpb-map-filters--color); */
	border-width: var(--tpb-map-filters-button--border-width);
	border-style: var(--tpb-map-filters-button--border-style);
	border-color: var(--tpb-map-filters--color);
	border-radius: var(--tpb-map-filters-button--border-radius);
	padding: var(--tpb-map-filters-button--padding-x) var(--tpb-map-filters-button--padding-y);
	transition:
		background-color var(--tpb-theme-page-map--transition-time) ease-in-out,
		color var(--tpb-theme-page-map--transition-time) ease-in-out,
		border-color var(--tpb-theme-page-map--transition-time) ease-in-out;
}

.tpb-theme-4-page-map #active-filters-list .filter-item-label:hover,
.tpb-theme-4-page-map #active-filters-list .filter-item-label:active {
	background-color: var(--tpb-map-filters--color);
	color: var(--tpb-map-filters--background-color);
	border-color: var(--tpb-map-filters--background-color);
}

.tpb-theme-4-page-map #active-filters-list .filter-item-label.color-legend {
	background-color: var(--tpb-filter-item-label-color-legend--background-color);
	color: var(--tpb-map-filters--background-color);
	border-color: var(--tpb-map-filters--background-color);
}

.tpb-theme-4-page-map #active-filters-list .filter-item-label.color-legend::after {
	display: none;
}

.tpb-theme-4-page-map #active-filters-list .filter-item-label.color-legend:hover,
.tpb-theme-4-page-map #active-filters-list .filter-item-label.color-legend:active {
	background-color: var(--tpb-map-filters--background-color);
	color: var(--tpb-filter-item-label-color-legend--background-color);
	border-color: var(--tpb-filter-item-label-color-legend--background-color);
}

.tpb-theme-4-page-map .filters-container .filter-item {
	display: inline-flex;
	align-items: center;
	cursor: pointer;
	position: relative; /* anchor for the visually hidden checkbox (below) */
}

.tpb-theme-4-page-map .filter-group[data-filter-group='category'] .filter-item {
	display: block;
}

.tpb-theme-4-page-map .filter-group[data-filter-group='category'] .filter-item-label {
	display: inline-block;
	position: relative;
	padding-left: 0.4em;
	text-indent: -0.4em;
	margin-left: 0.4em;
}

.tpb-theme-4-page-map .filters-container .filter-item.filter-option-disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.tpb-theme-4-page-map .filters-container .filter-group.all-filters-selected .filter-heading,
.tpb-theme-4-page-map .filters-container .filter-item.filter-disabled {
	opacity: 0.5;
	/* cursor: not-allowed; */
	/* pointer-events: none; */
}

/* Visually hidden, NOT display:none: the checkbox must stay focusable and announced (keyboard + screen
   reader users). The label carries the look; its focus ring is in scss/templates/_map-a11y.scss. */
.tpb-theme-4-page-map .filters-container .filter-item > input[type='checkbox'] {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	opacity: 0;
	clip-path: inset(50%);
	pointer-events: none;
}

.tpb-theme-4-page-map .filters-container .filter-item > input[type='checkbox'] + label {
	cursor: inherit;
	/* cursor: pointer; */
}

.tpb-theme-4-page-map .filters-container .filter-item.filter-disabled > input[type='checkbox'] + label,
.tpb-theme-4-page-map .filters-container .filter-item > input[type='checkbox']:disabled + label,
.tpb-theme-4-page-map .filters-container select:disabled {
	cursor: not-allowed;
}

.tpb-theme-4-page-map .filters-container .filter-item > input[type='checkbox'] + label:before {
	display: inline-block;
	margin-right: 0.25em;
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
	content: '\2b';
	font-size: 0.7em;
	vertical-align: baseline;
	transform: rotate(0deg);
	transition: transform var(--tpb-theme-page-map--transition-time) ease-in-out;
}

.tpb-theme-4-page-map .filters-container .filter-item > input[type='checkbox']:checked + label:before {
	transform: rotate(45deg);
}

.tpb-theme-4-page-map .filters-container .filter-item > input + label.color-legend {
	--tpb-filter-item-label-color-legend--background-color: #000;
	--tpb-filter-item-label-color-legend--border-color: #fff;
}

.tpb-theme-4-page-map .filters-container .filter-item > input + label.color-legend:after {
	content: '';
	display: inline-block;
	background-color: var(--tpb-filter-item-label-color-legend--background-color);
	border: 1px solid var(--tpb-filter-item-label-color-legend--border-color);
	border-radius: 0.5em;
	width: 0.75em;
	height: 0.75em;
	vertical-align: baseline;
	margin-left: 0.25em;
}

.tpb-theme-4-page-map .filters-container .filter-group > select {
	background-color: var(--tpb-map-filters--background-color);
	color: var(--tpb-map-filters--color);
	border: 1px solid #fff;
	border-radius: var(--tpb-map-filters-button--border-radius);
	width: 100%;
	padding: 0.25em;
}

.tpb-theme-4-page-map .filters-container .filter-reset-btn {
	border: 1px solid var(--tpb-map-filters--background-color);
	border-width: var(--tpb-map-filters-button--border-width);
	border-style: var(--tpb-map-filters-button--border-style);
	border-color: var(--tpb-map-filters--background-color);
	border-radius: var(--tpb-map-filters-button--border-radius);
	background-color: var(--tpb-map-filters--color);
	color: var(--tpb-map-filters--background-color);
	padding: var(--tpb-map-filters-button--padding-x) var(--tpb-map-filters-button--padding-y);
	transition:
		background-color var(--tpb-theme-page-map--transition-time) ease-in-out,
		color var(--tpb-theme-page-map--transition-time) ease-in-out,
		border-color var(--tpb-theme-page-map--transition-time) ease-in-out;
}

.tpb-theme-4-page-map .filters-container .filter-reset-btn > .fa-solid {
	font-size: 0.7em;
	margin-right: 0.25em;
}

.tpb-theme-4-page-map .filters-container .filter-reset-btn:hover,
.tpb-theme-4-page-map .filters-container .filter-reset-btn:active {
	background-color: var(--tpb-map-filters--background-color);
	color: var(--tpb-map-filters--color);
	border-color: var(--tpb-map-filters--color);
}

/* Mobile map filters */
.tpb-theme-4-page-map #map-filters-mobile-container .heading-bar {
	display: none;
}

.fullscreen .tpb-theme-4-page-map #map-filters-mobile-container .heading-bar {
	display: flex;
	width: 100%;
	height: 70px;
	padding: 1rem;
	background-color: #000;
	border-bottom: 1px solid #fff;
	gap: 1rem;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	overflow: hidden;
}

.fullscreen .tpb-theme-4-page-map #map-filters-mobile-container .heading-bar > * {
	display: inline-block;
	position: relative;
}

.fullscreen .tpb-theme-4-page-map #map-filters-mobile-container .heading-bar > img {
	height: 100%;
	width: auto;
}

.fullscreen .tpb-theme-4-page-map #map-filters-mobile-container .heading-bar > h1 {
	color: #fff;
	flex-grow: 1;
	text-align: center;
	margin-bottom: 0;
	font-family: 'Moderat';
	font-weight: 600;
	text-transform: uppercase;
}

.tpb-theme-4-page-map #map-filters-mobile-container,
.tpb-theme-4-page-map #filter-indicator-mobile-container {
	display: block;
}

.tpb-theme-4-page-map #map-filters-mobile-container {
	width: 100%;
}

.tpb-theme-4-page-map #filter-indicator-mobile-container {
	flex-grow: 1;
}

.tpb-theme-4-page-map .filters-container-heading #map-filter-toggle {
	font-weight: 500;
	border: none;
	align-items: center;
}

.tpb-theme-4-page-map #map-filters-mobile-container .filters-container-heading > img,
.tpb-theme-4-page-map #map-filters-mobile-container .filters-container-heading > span {
	display: none;
}

/* Desktop map filters */
.tpb-theme-4-page-map #map-filters-desktop-container,
.tpb-theme-4-page-map #filter-indicator-desktop-container {
	display: none;
}

.tpb-theme-4-page-map #map-filters-desktop-container {
	position: relative;
	/* width: 380px; */
	width: 400px;
}

.tpb-theme-4-page-map #map-filters-desktop-container .filters-container-heading > button {
	display: none;
}

.tpb-theme-4-page-map #map-filters-desktop-container .filters-container-heading > span {
	display: block;
}

.tpb-theme-4-page-map #map-filters-desktop-container .filters-container-heading > span,
.tpb-theme-4-page-map #filter-indicator-desktop-container {
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	padding: var(--tpb-accessible-accordion-button__padding-y) var(--tpb-accessible-accordion-button__padding-x);
	font-size: var(--tpb-h3--font-size);
	line-height: 1em;
}

/* .tpb-theme-4-page-map #map-filters-desktop-container #filter-indicator { */
.tpb-theme-4-page-map #map-filters #filter-indicator {
	font-size: var(--tpb-filter-heading--font-size);
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	/* padding-bottom: 1em; */
}

.tpb-theme-4-page-map #map-filters #filter-indicator.hide {
	display: none;
}

/* .tpb-theme-4-page-map #map-filters-desktop-container #filter-indicator>.filter-indicator-number { */
.tpb-theme-4-page-map #map-filters #filter-indicator > .filter-indicator-number {
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
	margin-right: 0.25em;
}

/* .tpb-theme-4-page-map #map-filters-desktop-container #filter-indicator>.filter-indicator-number::before { */
.tpb-theme-4-page-map #map-filters #filter-indicator > .filter-indicator-number::before {
	display: inline-block;
	margin-right: 0.25em;
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
	/* content: '\f0b0'; */
	content: '\f1de';
	/* content: '\f0ae'; */
	/* content: '\f013'; */
	/* content: '\f085'; */
	font-size: 1em;
	/* vertical-align: baseline; */
}

/* .tpb-theme-4-page-map #map-filters-desktop-container #filter-indicator>.filter-indicator-number::after { */
.tpb-theme-4-page-map #map-filters #filter-indicator > .filter-indicator-number::after {
	content: attr(data-active-filters-count);
	position: relative;

	width: 1.3em;
	height: 1.3em;
	border-width: 2px;
	border-style: solid;
	border-radius: 50%;
	/* border-color: #000; */
	/* background-color: #fff; */
	/* color: #000; */
	font-weight: bold;
	text-align: center;

	display: flex;
	align-items: center;
	justify-content: center;
	padding-bottom: 0.175em;
	/* manually nudge the text upward slightly */
	font-size: 1em;
	line-height: 1em;
	pointer-events: none;

	font-family: 'Moderat';
	font-weight: 600;

	transition:
		border-color var(--tpb-theme-page-map--transition-time) ease-in-out,
		background-color var(--tpb-theme-page-map--transition-time) ease-in-out,
		color var(--tpb-theme-page-map--transition-time) ease-in-out;
}

/* .tpb-theme-4-page-map #map-filters-desktop-container .no-active-filters #filter-indicator>.filter-indicator-number::after { */
.tpb-theme-4-page-map #map-filters.no-active-filters #filter-indicator > .filter-indicator-number::after {
	border-color: #fff;
	background-color: #000;
	color: #fff;
}

/* .tpb-theme-4-page-map #map-filters-desktop-container .has-active-filter #filter-indicator>.filter-indicator-number::after, */
/* .tpb-theme-4-page-map #map-filters-desktop-container .has-active-filters #filter-indicator>.filter-indicator-number::after { */
.tpb-theme-4-page-map #map-filters.has-active-filter #filter-indicator > .filter-indicator-number::after,
.tpb-theme-4-page-map #map-filters.has-active-filters #filter-indicator > .filter-indicator-number::after {
	border-color: #000;
	background-color: #fff;
	color: #000;
}

/* .tpb-theme-4-page-map #map-filters-desktop-container #filter-indicator>.filter-indicator-text { */
.tpb-theme-4-page-map #map-filters #filter-indicator > .filter-indicator-text {
	display: none;
}

/* .tpb-theme-4-page-map #map-filters-desktop-container .has-active-filter #filter-indicator>.filter-indicator-text.singular { */
.tpb-theme-4-page-map #map-filters.has-active-filter #filter-indicator > .filter-indicator-text.singular {
	display: inline-block;
}

/* .tpb-theme-4-page-map #map-filters-desktop-container .has-active-filters #filter-indicator>.filter-indicator-text.plural { */
.tpb-theme-4-page-map #map-filters.has-active-filters #filter-indicator > .filter-indicator-text.plural {
	display: inline-block;
}

.tpb-theme-4-page-map #map-filters-desktop-container #map-filter-panel.tpb-accessible-accordion-panel {
	display: block;
	box-shadow: var(--tpb-map-filters--box-shadow);
}

/*==============================
|   Filters DEBUG // TODO: delete
\==============================*/
.tpb-theme-4-page-map .filters-container .filter-item,
.tpb-theme-4-page-map #state-filter-select option {
	opacity: 0.5;
}

.tpb-theme-4-page-map .filters-container .filter-item.relevant,
.tpb-theme-4-page-map #state-filter-select option.relevant {
	opacity: 1;
}

.tpb-theme-4-page-map .filters-container .filter-item.selected,
.tpb-theme-4-page-map #state-filter-select option.selected {
	color: greenyellow;
}

/*==============================
|   Filters Info Box
\==============================*/
.tpb-theme-4-page-map #filters-info .error-message {
	display: none;
}

.tpb-theme-4-page-map #map-filters.no-map-source #filters-info .error-message {
	display: block;
}

.tpb-theme-4-page-map #map-filters.no-map-source .filter-group,
.tpb-theme-4-page-map #map-filters.no-map-source #filters-info .info-message {
	display: none;
}

.tpb-theme-4-page-map #map-filters #filters-info .info-message .gutenberg-content a {
	max-width: fit-content;
	align-self: flex-start;
}

/*==============================
|   Development Setting
\==============================*/

.tpb-theme-4-page-map #map-settings-toggle {
	display: none;
	justify-content: flex-start;
	padding: 0;
	font-family: 'Moderat';
	font-weight: 600;
	text-transform: uppercase;
}

.tpb-theme-4-page-map #map-settings-toggle > .button-text::before {
	content: '\f013';
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
	/* font-size: 1.5em; */
	margin-right: 0.25em;
	display: inline-block;
	width: 1em;
}

.tpb-theme-4-page-map #map-settings-toggle[aria-expanded='true'] > .button-text::before {
	content: '\f00d';
}

.tpb-theme-4-page-map #map-settings-toggle > .fa-solid {
	/* margin-right: .5em; */
}

.tpb-theme-4-page-map #map-settings-panel {
	display: none;
	margin: 0.5em 0 0 0;
}

.tpb-theme-4-page-map #map-settings-panel li {
	margin: 0.25em 0;
}

.tpb-theme-4-page-map #map-settings-panel .switch {
	--tbp-switch--width: 1.75em;
	--tbp-switch--height: 1em;
	--tbp-switch--transition-time: 0.4s;
	--tbp-switch-inactive--bg-color: #ccc;
	--tbp-switch-active--bg-color: #666;
	--tbp-switch-slider--padding: 2px;
	--tbp-switch-slider--color: #fff;

	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	cursor: pointer;
	user-select: none;
	position: relative;
}

.tpb-theme-4-page-map #map-settings-panel .switch-label {
	/* margin-right: .5em; */
}

/* Hide native checkbox */
.tpb-theme-4-page-map #map-settings-panel input[type='checkbox'] {
	position: absolute;
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	z-index: 2;
	cursor: pointer;
}

/* Toggle track */
.tpb-theme-4-page-map #map-settings-panel .slider {
	position: relative;
	width: var(--tbp-switch--width);
	height: var(--tbp-switch--height);
	background-color: var(--tbp-switch-inactive--bg-color);
	border-radius: var(--tbp-switch--height);
	transition: var(--tbp-switch--transition-time);
	flex-shrink: 0;
}

/* Toggle thumb */
.tpb-theme-4-page-map #map-settings-panel .slider::before {
	content: '';
	position: absolute;
	height: calc(var(--tbp-switch--height) - (2 * var(--tbp-switch-slider--padding)));
	width: calc(var(--tbp-switch--height) - (2 * var(--tbp-switch-slider--padding)));
	left: var(--tbp-switch-slider--padding);
	top: var(--tbp-switch-slider--padding);
	background-color: white;
	border-radius: 50%;
	transition: var(--tbp-switch--transition-time);
}

/* Checked state */
.tpb-theme-4-page-map #map-settings-panel input:checked + .slider {
	background-color: var(--tbp-switch-active--bg-color);
}

.tpb-theme-4-page-map #map-settings-panel input:checked + .slider::before {
	transform: translateX(calc(var(--tbp-switch--height) - (2 * var(--tbp-switch-slider--padding))));
}

/* Focus ring for accessibility */
.tpb-theme-4-page-map #map-settings-panel input:focus + .slider {
	/* outline: 2px solid #005fcc; */
	/* outline-offset: 3px; */
}

.tpb-theme-4-page-map #map-settings-panel .map-setting label {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}

.tpb-theme-4-page-map #map-settings-panel #masking-color {
	width: unset;
	min-width: 100px;
	flex-grow: 1;
}

.tpb-theme-4-page-map #map-settings-panel #masking-color:focus-visible {
	/* border-color: rgba(247, 0, 128, 0.8); */
	outline: none;
	border: 1px solid #c6c6c6;
}

.tpb-theme-4-page-map #map-settings-panel i {
	font-size: 1.3em;
}

.tpb-theme-4-page-map #map-settings-panel #masking-color-submit {
	background-color: unset;
	border: none;
	padding: 0;
	margin: 0;
}

.tpb-theme-4-page-map #map-settings-panel #masking-color-submit:hover {
	color: cadetblue;
}

.tpb-theme-4-page-map #map-settings-panel #masking-color-submit:active {
	color: coral;
}

.tpb-theme-4-page-map #map-settings-panel a {
	color: rgba(95, 95, 95, 1);
}

.tpb-theme-4-page-map #map-settings-panel a:hover {
	color: rgba(247, 0, 128, 0.8);
}

/*==============================
|   Awardee Tooltip
\==============================*/

.tpb-theme-4-page-map .awardee-tooltip {
	position: absolute;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
	/* background: rgba(0, 0, 0, 0.85); */
	color: #000;
	border: 1px solid #000;
	border-radius: 0 0 20px 0;
	display: inline-block;
	max-width: 180px;
	width: fit-content;
	/* min-width: 0; */
	/* white-space: nowrap; */
	white-space: normal;
	word-break: normal;
	/* word-wrap: normal; */
	/* Prevents breaking words arbitrarily */
	overflow-wrap: break-word;
	/* Allows wrapping at normal break points */
	pointer-events: none;
	z-index: 9999;
	padding: 4px 8px;
}

.tpb-theme-4-page-map .awardee-tooltip .tooltip-title,
.tpb-theme-4-page-map .awardee-tooltip .tooltip-city {
	display: block;
	white-space: normal;
	word-break: normal;
	overflow-wrap: break-word;
}

.tpb-theme-4-page-map .awardee-tooltip .tooltip-title {
	font-family: 'Moderat';
	font-weight: 600;
	font-size: 1rem;
	text-transform: uppercase;
	line-height: 1em;
}

.tpb-theme-4-page-map .awardee-tooltip .tooltip-city {
	font-family: 'Manner';
	font-weight: 500;
	font-size: 1rem;
	/* line-height: 1em; */
}

.tpb-theme-4-page-map .awardee-tooltip .tooltip-city::before {
	content: '//\00a0';
	height: 1em;
	line-height: 1em;
	vertical-align: text-top;
	/* margin: 0 .25em; */
}

/*==============================
|   Cooperative Gestures
\==============================*/
.maplibregl-cooperative-gesture-screen,
.maplibregl-cooperative-gesture-screen > * {
	text-align: center;
}

/*==============================
|   Map Popup
\==============================*/

.tpb-theme-4-page-map #map-popup {
	--tpb-map-popup--width: 100%;
	--tpb-map-popup--color: #000;
	/* --tpb-map-popup--category-color: rgb(0, 171, 159); */
	--tpb-map-popup--category-color: aqua;
	--tpb-map-popup--bg-color: var(--tpb-map-popup--category-color, #000);
	--tpb-map-popup-info_arrow-icon--filter: invert(0);

	/* --tpb-map-popup-info--font-size: 3vw; */
	/* --tpb-map-popup-info--font-size: clamp(1rem, 4vw, 40px); */
	--tpb-map-popup-info--font-size: clamp(1rem, 4vw, 2.5rem);
	/* --tpb-map-popup-info-h3--font-size: 6vw; */
	/* --tpb-map-popup-info-h3--font-size: clamp(2rem, 8vw, 80px); */
	--tpb-map-popup-info-h3--font-size: clamp(2rem, 8vw, 5rem);

	/* --tpb-map-popup-close--font-size: clamp(2rem, 4vw, 30px); */
	--tpb-map-popup-close--font-size: clamp(2rem, 4vw, 1.875rem);
	--tpb-map-popup--box-shadow: none;

	position: absolute;
	bottom: 0;
	right: 0;

	height: auto;
	max-height: 100%;
	width: var(--tpb-map-popup--width);
	overflow: hidden;

	display: none;
	flex-direction: column;
	justify-content: flex-end;

	z-index: 2;
	padding: 0;
	margin: 0;
	border-radius: unset;
	border: none;
	border-top: 1px solid #000;
	border-bottom: 1px solid #fff;
	filter: drop-shadow(var(--tpb-map-popup--box-shadow));
}

.tpb-theme-4-page-map .drop-shadow #map-popup {
	--tpb-map-popup--box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.25);
}

.tpb-theme-4-page-map #map-popup.full-height {
	height: 100%;
}

.tpb-theme-4-page-map #map-popup.show {
	display: flex;
}

.tpb-theme-4-page-map #map-popup a {
	display: block;
	position: relative;
	max-height: 100%;
	width: inherit;
	overflow: hidden;
	text-decoration: none;
}

.tpb-theme-4-page-map #map-popup .popup-content {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: 100%;
	max-height: 100%;
	width: inherit;
	overflow: hidden;
	background-color: var(--tpb-map-popup--bg-color);
	transition: background-color var(--tpb-theme-page-map--transition-time) ease-in-out;
}

.tpb-theme-4-page-map #map-popup .popup-close-area:not(:disabled) {
	cursor: default;
}

.tpb-theme-4-page-map #map-popup .popup-close {
	position: absolute;
	z-index: 3;
	cursor: pointer;
	color: var(--tpb-map-popup--color);
	/* font-size: 1.75rem; */
	/* font-size: var(--tpb-map-popup-info--font-size); */
	/* font-size: var(--tpb-map-popup-info-h3--font-size); */
	/* font-size: clamp(1rem, 4vw, 30px); */
	font-size: var(--tpb-map-popup-close--font-size);
	top: 1rem;
	right: 1rem;
	transition: color var(--tpb-theme-page-map--transition-time) ease-in-out;
}

.tpb-theme-4-page-map #map-popup .popup-info {
	flex-shrink: 0;
	font-size: var(--tpb-map-popup-info--font-size);
	line-height: 1.2em;
	padding: 1rem;
	/* padding-right: 2.5em; */
	color: var(--tpb-map-popup--color);
	background-color: var(--tpb-map-popup--bg-color);
	transition:
		color var(--tpb-theme-page-map--transition-time) ease-in-out,
		background-color var(--tpb-theme-page-map--transition-time) ease-in-out;
	display: flex;
	flex-direction: column;
	gap: 0.25em;
	border-bottom: 1px solid #000;
}

/* Map Popup:hover */
.tpb-theme-4-page-map #map-popup > a:hover .popup-close:not(:hover) ~ .popup-info {
	--tpb-map-popup--color: #fff;
	--tpb-map-popup--bg-color: #000;
	--tpb-map-popup-info_arrow-icon--filter: invert(1);
}

.tpb-theme-4-page-map #map-popup > a:hover .popup-close {
	--tpb-map-popup--color: #fff;
}

.tpb-theme-4-page-map #map-popup .popup-info h3 {
	font-size: var(--tpb-map-popup-info-h3--font-size);
}

.tpb-theme-4-page-map #map-popup .popup-info h3:first-child {
	margin: 0;
	padding-right: 2rem;
}

.tpb-theme-4-page-map #map-popup .popup-info_title {
	padding-right: var(--tpb-map-popup-close--font-size);
}

.tpb-theme-4-page-map #map-popup .popup-info_title h3:first-child {
	display: inline;
	padding: 0 0.5rem 0 0;
	margin: 0;
}

.tpb-theme-4-page-map #map-popup .popup-info_title h3:first-child::after {
	content: '→';
	display: inline;
	vertical-align: middle;
	margin-left: 0.2em;
	font-size: 1.5em;
	/* width: 1em; */
	/* height: 1em; */
	/* background-color: coral; */
}

.tpb-theme-4-page-map #map-popup .popup-info_arrow-icon {
	width: 1em;
	height: 1em;
	/* font-size: 2.5rem; */
	font-size: 2em;
	position: relative;
	/* margin-top: .5rem; */
	margin-top: 0.125em;
	display: inline-block;
	display: none;
}

.tpb-theme-4-page-map #map-popup .popup-info_arrow-icon::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 1em;
	height: 1em;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: url('../img/shapes/Manner_Arrow_right_16pt.svg');
	/* background-size: .7em .7em; */
	background-size: 80% auto;
	background-repeat: no-repeat;
	background-position: center;
	color: inherit;
	/* background-color: #fff; */
	filter: var(--tpb-map-popup-info_arrow-icon--filter);
	transition: filter var(--tpb-theme-page-map--transition-time) ease-in-out;
}

.tpb-theme-4-page-map #map-popup .popup-info_year {
	font-family: 'Moderat';
	font-weight: 700;
	text-transform: uppercase;
	/* font-size: 1.25rem; */
	/* margin-top: .75rem; */
	/* margin-top: .3em; */
}

.tpb-theme-4-page-map #map-popup .popup-info_year-prefix {
	color: var(--tpb-map-popup--color);
	/* filter: var(--tpb-map-popup-info_arrow-icon--filter) */
	transition: color var(--tpb-theme-page-map--transition-time) ease-in-out;
}

.tpb-theme-4-page-map #map-popup .popup-info_category {
	/* font-size: 1.25rem; */
	border: 1px solid #000;
	border-width: 1px;
	border-style: solid;
	/* border-color: var(--tpb-map-popup--color); */
	background-color: var(--tpb-map-popup--category-color);
	border-radius: 0.375rem;
	padding: 0 0.5rem;
	width: fit-content;
	margin-top: 0.25rem;
	transition: border-color var(--tpb-theme-page-map--transition-time) ease-in-out;
	/* color: var(--tpb-map-popup--color); */
	color: initial;
}

.tpb-theme-4-page-map #map-popup > a:hover .popup-close:not(:hover) ~ .popup-info_category {
	/* .tpb-theme-4-page-map #map-popup>a:hover .popup-info_category { */
	/* color: var(--tpb-map-popup--bg-color); */
	border-color: var(--tpb-map-popup--category-color);
}

.tpb-theme-4-page-map #map-popup .popup-image {
	position: relative;
	flex-shrink: 1;
	flex-grow: 1;
	overflow: hidden;
	max-height: calc((1 / (16 / 9)) * 100vw);
	width: 100%;
}

.tpb-theme-4-page-map #map-popup .popup-image-placeholder {
	height: 100px;
}

.tpb-theme-4-page-map #map-popup .popup-image > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1);
	transition: transform var(--tpb-theme-page-map--transition-time) ease-in-out;
}

.tpb-theme-4-page-map #map-popup > a:hover .popup-image > img {
	transform: scale(1.05);
}

/*==============================
|   Mapbox Map
\==============================*/

.tpb-theme-4-page-map #map {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	mix-blend-mode: multiply;
}

/*==============================
|   Media queries
\==============================*/

@media (min-width: 960px) {
	.tpb-theme-4-page-map #map-wrapper {
		padding: 2rem;
		min-height: calc(100svh - var(--tpb-scroll-padding-top, 0px) - 0.5 * var(--tpb-footer-height));
		max-height: none;
	}
}

@media (min-width: 1280px) {
	.tpb-theme-4-page-map #map-filters-mobile-container,
	.tpb-theme-4-page-map #filter-indicator-mobile-container {
		display: none;
	}

	.tpb-theme-4-page-map #map-filters-desktop-container,
	.tpb-theme-4-page-map #filter-indicator-desktop-container {
		display: block;
	}

	.tpb-theme-4-page-map #map-popup {
		height: 100%;
		width: calc(450px + 2 * 2rem);
		padding: 2rem 2rem 6rem 2rem;
		/* display: flex; */
		flex-direction: column;
		justify-content: flex-start;
		/* max-height: calc(100% - 4 rem); */
		/* margin: 2rem; */
		/* bottom: unset; */
		/* left: unset; */
		/* right: 0; */
		/* top: 0; */
		/* justify-content: flex-start; */
		/* border: 1px solid #000; */
		/* border-radius: 0 0 80px 0; */

		/* --tpb-map-popup-info--font-size: clamp(1rem, 2vw, 20px); */
		/* --tpb-map-popup-info--font-size: clamp(1.5rem, 2vw, 20px); */
		--tpb-map-popup-info--font-size: clamp(1.5rem, 2vw, 1.25rem);
		/* --tpb-map-popup-info-h3--font-size: clamp(1rem, 4vw, 40px); */
		--tpb-map-popup-info-h3--font-size: clamp(1rem, 4vw, 2.5rem);
	}

	.tpb-theme-4-page-map #map-popup.popup-top {
		justify-content: flex-start;
	}

	.tpb-theme-4-page-map #map-popup.popup-middle {
		justify-content: center;
	}

	.tpb-theme-4-page-map #map-popup.popup-bottom {
		justify-content: flex-end;
	}

	.tpb-theme-4-page-map #map-popup > a {
		display: unset;
		width: 100%;
	}

	.tpb-theme-4-page-map #map-popup .popup-content {
		border: 1px solid #000;
		border-radius: 0 0 60px 0;
	}

	.tpb-theme-4-page-map #map-popup .popup-close {
		/* font-size: clamp(1rem, 4vw, 20px); */
		font-size: clamp(1rem, 4vw, 1.25rem);
	}
}
