/* SceneSite front. Colours come from :root custom properties set by the plugin. */

.ss-shell,
.ss-filters,
.ss-card,
.ss-map,
.ss-event-head,
.ss-tour,
.ss-empty,
.ss-footer {
	color: var(--ss-ink, #f3ecdf);
	font-family: "Iowan Old Style", Palatino, Georgia, serif;
}

.ss-shell {
	max-width: 1120px;
	margin: 0 auto;
	padding: 1.5rem 1.25rem 3rem;
}

.ss-layout {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: 1.5rem;
	align-items: start;
}

/* Single pages: content + right sidebar (context about the page). */
.ss-layout-side {
	grid-template-columns: minmax(0, 1fr) 300px;
}

/* Listings: filters left, map + list in the middle, page context right. */
.ss-layout-3 {
	grid-template-columns: 240px minmax(0, 1fr) 260px;
}

@media (max-width: 1100px) {
	.ss-layout-3 {
		grid-template-columns: 240px minmax(0, 1fr);
	}

	.ss-layout-3 > .ss-col-context {
		grid-column: 2;
	}
}

.ss-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.ss-search {
	display: flex;
	gap: 0.5rem;
	margin: 0 0 1rem;
	position: relative;
}

.ss-search input,
.ss-range input,
.ss-facet input {
	flex: 1;
	background: var(--ss-bg-2, #1a1714);
	color: var(--ss-ink, #f3ecdf);
	border: 1px solid var(--ss-line, #3a332c);
	border-radius: 999px;
	padding: 0.7rem 1rem;
	font: inherit;
}

.ss-search button,
.ss-range button,
.ss-facet button,
.ss-button,
.ss-filters-open,
.ss-sheet-close {
	background: var(--ss-accent, #ff4d1c);
	color: #140c08;
	border: 0;
	border-radius: 999px;
	padding: 0.7rem 1rem;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.ss-suggest {
	position: absolute;
	z-index: 5;
	top: calc(100% + 0.35rem);
	left: 0;
	right: 0;
	margin: 0;
	padding: 0.35rem;
	list-style: none;
	background: var(--ss-bg-2, #1a1714);
	border: 1px solid var(--ss-line, #3a332c);
}

.ss-suggest a {
	display: block;
	padding: 0.45rem 0.6rem;
	color: inherit;
	text-decoration: none;
}

.ss-suggest a:hover,
.ss-suggest a:focus {
	background: var(--ss-bg, #100e0c);
}

.ss-clear {
	margin: 0 0 1rem;
}

.ss-clear[hidden] {
	display: none;
}

.ss-facet {
	margin: 0 0 1.25rem;
}

.ss-facet h3,
.ss-tour h3,
.ss-results-head h1 {
	font-size: 0.78rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	margin: 0 0 0.55rem;
}

.ss-facet ul,
.ss-region,
.ss-chips,
.ss-tour ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ss-facet a,
.ss-sort a,
.ss-chip {
	display: flex;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.35rem 0;
	color: var(--ss-ink, #f3ecdf);
	text-decoration: none;
	border-bottom: 1px solid var(--ss-line, #3a332c);
}

.ss-facet a.is-on,
.ss-sort a.is-current {
	color: var(--ss-signal, #d6ff4a);
}

.ss-count,
.ss-card-date,
.ss-card-where,
.ss-price,
.ss-found {
	color: var(--ss-muted, #b7ab9a);
	font-size: 0.92rem;
}

.ss-region-region,
.ss-region-city {
	margin-left: 0.75rem;
}

.ss-range,
.ss-facet form {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-top: 0.6rem;
}

.ss-results-head {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	align-items: end;
	margin-bottom: 1rem;
}

.ss-results-head h1 {
	font-size: clamp(1.8rem, 4vw, 3rem);
	letter-spacing: 0;
	text-transform: none;
	line-height: 0.95;
}

.ss-sort {
	display: flex;
	gap: 0.75rem;
	flex-wrap: wrap;
}

.ss-sort a {
	border: 0;
	padding: 0;
}

.ss-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0 0 1rem;
}

.ss-chip {
	border: 1px solid var(--ss-line, #3a332c);
	border-radius: 999px;
	padding: 0.25rem 0.7rem;
}

.ss-list {
	display: grid;
	gap: 0.75rem;
}

.ss-card {
	background: var(--ss-bg-2, #1a1714);
	border-left: 3px solid var(--ss-accent, #ff4d1c);
	padding: 0.9rem 1rem 0.7rem;
}

.ss-card-link {
	color: inherit;
	text-decoration: none;
}

.ss-card-title {
	margin: 0.15rem 0;
	font-size: 1.35rem;
}

.ss-card-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem 0.8rem;
	align-items: center;
	margin: 0.45rem 0 0;
}

.ss-card-meta a {
	color: var(--ss-signal, #d6ff4a);
}

.ss-badge {
	display: inline-block;
	padding: 0.1rem 0.45rem;
	border-radius: 999px;
	background: var(--ss-line, #3a332c);
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.ss-badge-sold_out {
	background: var(--ss-signal, #d6ff4a);
	color: #14140c;
}

.ss-badge-cancelled,
.ss-badge-merged {
	background: transparent;
	border: 1px solid var(--ss-muted, #b7ab9a);
	color: var(--ss-muted, #b7ab9a);
}

.ss-badge-giveaway {
	background: transparent;
	border: 1px solid var(--ss-signal, #d6ff4a);
	color: var(--ss-signal, #d6ff4a);
}

.ss-giveaway p {
	margin: 0 0 0.5rem;
}

.ss-giveaway-event .ss-meta,
.ss-giveaway-deadline,
.ss-giveaway-checked {
	color: var(--ss-muted, #b7ab9a);
}

.ss-giveaway-closed .ss-giveaway-summary,
.ss-giveaway-closed .ss-giveaway-deadline {
	text-decoration: line-through;
}

.ss-map {
	width: 100%;
	margin: 0 0 1rem;
	background:
		linear-gradient(rgba(255, 77, 28, 0.08) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 77, 28, 0.08) 1px, transparent 1px),
		var(--ss-bg-2, #1a1714);
	background-size: 48px 48px;
	border: 1px solid var(--ss-line, #3a332c);
	overflow: hidden;
}

.ss-map .leaflet-container {
	height: 100%;
	width: 100%;
	background: transparent;
	font: inherit;
}

.ss-pin,
.ss-cluster {
	border-radius: 999px;
	border: 2px solid #140c08;
	box-shadow: 0 0 0 1px rgba(243, 236, 223, 0.35);
}

.ss-pin {
	width: 14px;
	height: 14px;
}

.ss-pin-town {
	opacity: 0.72;
	border-style: dashed;
}

.ss-cluster {
	min-width: 28px;
	height: 28px;
	padding: 0 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ss-accent, #ff4d1c);
	color: #140c08;
	font-weight: 700;
	font-family: ui-sans-serif, system-ui, sans-serif;
}

.ss-popup {
	color: #140c08;
	font-family: ui-sans-serif, system-ui, sans-serif;
}

.ss-popup a {
	color: #8a220c;
}

.ss-empty,
.ss-past,
.ss-tour,
.ss-event-head,
.ss-footer,
.ss-context {
	margin: 1.25rem 0;
}

.ss-empty h2,
.ss-event-head .ss-card-date {
	margin: 0 0 0.4rem;
}

.ss-button {
	display: inline-block;
	text-decoration: none;
}

.ss-footer {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 1rem;
	border-top: 1px solid var(--ss-line, #3a332c);
	padding-top: 1.25rem;
}

.ss-nav-pagination,
.navigation.pagination {
	margin-top: 1.25rem;
}

.navigation.pagination .nav-links {
	display: flex;
	gap: 0.6rem;
	flex-wrap: wrap;
}

.ss-standalone {
	background: var(--ss-bg, #100e0c);
	color: var(--ss-ink, #f3ecdf);
}

.ss-standalone a {
	color: var(--ss-signal, #d6ff4a);
}

/* Full filter model: type-ahead fields, picked chips, quick picks, location tree, toggle. */
.ss-picked {
	margin: 0 0 0.5rem;
}

.ss-typeahead {
	position: relative;
	display: flex;
	gap: 0.3rem;
}

.ss-typeahead input,
.ss-narrow input {
	flex: 1;
	min-width: 0;
	width: 100%;
	font: inherit;
	padding: 0.4rem 0.6rem;
	border: 1px solid var(--ss-line, #3a332c);
	border-radius: 6px;
	background: transparent;
	color: inherit;
}

.ss-typeahead .ss-suggest {
	position: absolute;
	z-index: 20;
	top: 100%;
	left: 0;
	right: 0;
	margin: 0.2rem 0 0;
	padding: 0.25rem 0;
	list-style: none;
	background: var(--ss-bg-2, #1a1714);
	border: 1px solid var(--ss-line, #3a332c);
	border-radius: 6px;
	max-height: 18rem;
	overflow: auto;
}

.ss-typeahead .ss-suggest a {
	display: flex;
	justify-content: space-between;
	gap: 0.5rem;
	padding: 0.35rem 0.6rem;
	text-decoration: none;
}

.ss-typeahead .ss-suggest a[aria-selected="true"],
.ss-typeahead .ss-suggest a:focus {
	background: var(--ss-line, #3a332c);
}

.ss-suggest-meta {
	opacity: 0.7;
	font-size: 0.85em;
}

.ss-quick {
	list-style: none;
	margin: 0.4rem 0 0;
	padding: 0;
}

.ss-tree > summary {
	cursor: pointer;
	margin: 0.4rem 0;
}

.ss-region {
	list-style: none;
	margin: 0;
	padding: 0 0 0 0.8rem;
}

.ss-region-0 {
	padding-left: 0;
}

.ss-toggle.is-on {
	font-weight: 700;
}

[data-ss-hidden] {
	display: none !important;
}

/* Context slots (page flow: fold > main > funnels > right sidebar > footer). */
.ss-context-fold,
.ss-context-main,
.ss-context-funnels {
	margin: 1.5rem 0;
}

.ss-funnel-links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.ss-funnel-links a {
	display: inline-block;
	padding: 0.35rem 0.7rem;
	border: 1px solid var(--ss-line, #3a332c);
	border-radius: 999px;
	text-decoration: none;
}

.ss-funnel-links .ss-count {
	opacity: 0.7;
	font-size: 0.85em;
}

.ss-funnel-regions .ss-funnel-links {
	display: block;
}

.ss-funnel-regions .ss-funnel-links > li {
	margin: 0 0 0.6rem;
}

.ss-funnel-regions .ss-funnel-links ul {
	list-style: none;
	padding: 0;
	margin: 0.4rem 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.ss-home-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 1rem 0;
}

.ss-more {
	margin: 0.5rem 0 0;
}

@media (max-width: 800px) {
	.ss-layout,
	.ss-layout-3,
	.ss-layout-side {
		grid-template-columns: 1fr;
	}

	.ss-layout-3 > .ss-col-context {
		grid-column: auto;
	}

	.ss-filters-open,
	.ss-sheet-bar {
		display: flex;
	}

	.ss-filters-open {
		gap: 0.35em;
		align-items: center;
	}

	.ss-sheet-foot {
		display: block;
		position: sticky;
		bottom: 0;
		padding: 0.75rem 0 0;
		background: inherit;
	}

	.ss-sheet-foot .ss-button {
		width: 100%;
	}

	.ss-sheet-bar {
		justify-content: space-between;
		align-items: center;
		margin-bottom: 0.75rem;
	}

	.ss-filters > .ss-sheet {
		display: none;
	}

	.ss-filters > .ss-sheet[open] {
		display: block;
		position: fixed;
		inset: auto 0 0 0;
		width: 100%;
		max-height: 86vh;
		overflow: auto;
		margin: 0;
		padding: 1rem 1rem 2rem;
		background: var(--ss-bg, #100e0c);
		border-top: 3px solid var(--ss-accent, #ff4d1c);
		color: var(--ss-ink, #f3ecdf);
	}

	.ss-results-head {
		flex-direction: column;
		align-items: start;
	}
}

/* Max price filter (client-side, hash only) */
.ss-card[hidden],
[data-ss-price][hidden] {
	display: none !important;
}

/* eikkin-nl/stats */
.ss-stats {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1.5rem;
}
.ss-stat-num {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

/* Mobile: the left sidebar is not the filter list. Menu Plus slides that list in from the left. */
@media (max-width: 768px) {
	body.ss-has-filters #left-sidebar {
		display: none;
	}
}

/* 404: the not-found text and the grouped near matches. No event list. */
.ss-404-head h1 {
	margin-bottom: 0.25rem;
}

.ss-404-suggest {
	margin: 1rem 0;
}

.ss-404-fold .ss-search {
	margin: 1rem 0 1.5rem;
}

/* Search chips (plan §8) and the search field in the filter sidebar. */
.ss-search-chips { margin: 0 0 1rem; }
.ss-chip-kind { font-size: .75em; opacity: .7; text-transform: uppercase; letter-spacing: .03em; }
.ss-facet-search .ss-search { display: flex; gap: .25rem; flex-wrap: wrap; }
.ss-facet-search .ss-search input[type="search"] { flex: 1 1 8rem; min-width: 0; }

.ss-card-tickets {
	font-weight: 600;
}

.ss-facts {
	margin: 0;
}

.ss-facts dt {
	font-weight: 600;
}

.ss-facts dd {
	margin: 0 0 0.4rem;
}

.ss-shell .screen-reader-text:not(:focus) {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

.ss-image {
	margin: 0 0 1rem;
}

.ss-image img,
.ss-card-image {
	max-width: 100%;
	height: auto;
}
