/**
 * Pelican Search Results – supplementary styles.
 *
 * The bulk of the styling comes from the theme's _results-page.scss.
 * This file adds styles for elements introduced by the plugin
 * (e.g. map, Google autocomplete, inline card styles).
 */

/* Map container ------------------------------------------------------------ */
.results-hero__map-shell {
	position: relative;
}

.js-pelican-google-map {
	display: block;
	width: 100%;
	height: 100%;
	background: #e7e7e7;
	position: relative;
}

.js-pelican-google-map .gm-style {
	/* Grayscale is handled via JS map styles (saturation: -100) on individual
	   feature types, so markers keep their color (orange/blue). */
}

.results-hero__map-key-missing {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 10px 14px;
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.88);
	font-size: 13px;
	line-height: 1.3;
	color: #333;
	z-index: 10;
}

/* Unit card overrides (match theme template inline styles) ----------------- */
a.results-locations__unit-card {
	text-decoration: none;
	color: inherit;
}

.results-locations__unit-card {
	position: relative;
	overflow: hidden;
	padding-bottom: 10px;
}

/* Uniform image box (same approach as swiper cards) */
.results-locations__unit-card .results-locations__unit-media {
	aspect-ratio: 1 / 0.5;
	min-height: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media screen and (min-width: 768px) {
	.results-locations__unit-card .results-locations__unit-media {
		aspect-ratio: 1 / 1;
	}
}

.results-locations__unit-card .results-locations__unit-media .image-wrapper {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.results-locations__unit-card .results-locations__unit-media .image-wrapper img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.results-locations__unit-card::after {
	content: "";
	position: absolute;
	inset: 0;
	border: 3px solid transparent;
	border-radius: inherit;
	pointer-events: none;
	z-index: 50;
	transition: border-color 0.2s ease;
}

.results-locations__unit-card:hover::after,
.results-locations__unit-card:focus-within::after {
	border-color: #f07e02;
}

.results-locations__unit-content {
	position: relative;
	z-index: 2;
	padding: 14px 64px 14px 14px;
	min-height: 64px;
}

/* Sold-out cards have no action button – remove the extra right padding */
.results-locations__unit-card.is-limited .results-locations__unit-content {
	padding-right: 14px;
}

.results-locations__unit-copy {
	min-width: 0;
}

.results-locations__unit-copy strong,
.results-locations__unit-copy p {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.results-locations__unit-pricing {
	text-align: right;
	white-space: nowrap;
}

.results-locations__unit-action {
	position: absolute;
	right: 14px;
	bottom: 14px;
	z-index: 60;
}

/* NEW badge --------------------------------------------------------------- */
.results-locations__new-badge {
	display: inline-block;
	padding: 2px 8px;
	margin-left: 8px;
	border-radius: 4px;
	background: #f07e02;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	vertical-align: middle;
}

/* Unit type badge (top-right, distinct from discount badge at top-left) --- */
.results-locations__unit-type-badge {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 1;
	padding: 2px 6px;
	border-radius: 2px;
	background: #374151;
	color: #fff;
	font-size: 10px;
	line-height: 1;
	letter-spacing: 0.03em;
	font-weight: 700;
}

/* Search submit button: consistent position + no icon shift on hover ------ */
.results-hero .results-hero__submit {
	right: 8px;
}

.results-hero .results-hero__submit:hover svg,
.results-hero .results-hero__submit:focus svg {
	transform: none;
}

/* Heading spacing --------------------------------------------------------- */
.results-locations__title {
	margin-bottom: 0;
}

/* Address + distance: slightly smaller font ------------------------------- */
.results-locations__address {
	margin-bottom: 2px;
	font-size: 13px;
}

/* Per-location notice, shown under the usual meta line (phone, hours, mail).
   Editors write it on the location itself, so it carries things like an
   upcoming change of name or temporary opening hours. */
.results-locations__meta.important-info {
	display: block;
	margin-top: 4px;
	color: var(--e-global-color-accent, #f07e02);
	font-size: 13px;
	font-weight: 600;
}

@media (max-width: 767px) {
	.results-locations__meta.important-info {
		font-size: 12px;
	}
}

@media (max-width: 767px) {
	.results-locations__address {
		font-size: 12px;
	}
}

/* Location heading image: ensure cover fit -------------------------------- */
.results-locations__heading-media img {
	object-fit: cover;
	object-position: center;
}

/* Hide the legacy location-search popup (replaced by Places Autocomplete) - */
.location-search-popup,
.js-location-search-popup {
	display: none !important;
}

/* SVG placeholder image (when unit-SIZE.png doesn't exist) ---------------- */
.results-locations__unit-media .image-wrapper img[src$=".svg"] {
	max-width: 50%;
	max-height: 50%;
	padding: 10%;
	opacity: 0.3;
}

/* Google Places autocomplete dropdown styling ----------------------------- */
.pac-container {
	z-index: 10000 !important;
	border-radius: 8px;
	border: 1px solid #e0e0e0;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
	font-family: inherit;
}

.pac-item {
	padding: 8px 12px;
	cursor: pointer;
}

.pac-item:hover {
	background: #fef4e8;
}

.pac-item-query {
	font-weight: 600;
}