/* Puffafish Location Finder – frontend styles.
   Minimal & token-friendly; the theme can override. */

/* ---- Single (mirrors the puffafish single-event layout) ---- */
.pf-location {
	max-width: 1200px;
	margin-inline: auto;
	padding: clamp( 3rem, 5vw, 4.5rem ) 40px clamp( 3rem, 6vw, 5rem );
}
.pf-location__back { margin: 0; }
.pf-location__back a {
	display: inline-flex; align-items: center; gap: .4rem;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 500; text-decoration: none;
	color: var( --wp--preset--color--primary-green, #018940 );
}
/* Fixed to the left like the single-event back link on wide screens, sitting a
 * good bit below the header. */
@media ( min-width: 1100px ) {
	.pf-location__back a {
		position: fixed;
		left: clamp( 10px, 2vw, 30px );
		top: calc( var( --pf-header-height, 120px ) + 5rem );
		z-index: 20;
	}
}

/* Address block: the map link belongs to the address, left-aligned below it. */
.pf-map-link { display: block; margin-top: .4rem; margin-bottom: .2rem; }
.pf-location__layout {
	display: grid;
	grid-template-columns: 330px 1fr;
	gap: clamp( 2rem, 4vw, 3.5rem );
	align-items: start;
}
.pf-location__sidebar { order: -1; position: sticky; top: calc( var( --pf-header-height, 120px ) + 1rem ); }
.pf-location__main { min-width: 0; }
@media ( max-width: 900px ) {
	.pf-location__layout { grid-template-columns: 1fr; }
	/* Stacked, the sidebar goes below: reading the map and the opening hours
	   before the name and the description is the wrong way round. The order
	   above puts it left on wide screens, so it has to be reset here. */
	.pf-location__sidebar { position: static; order: 1; }
	.pf-location__main { order: 0; }
}

/* Sidebar cards */
.pf-loc-section { background-color: var( --wp--preset--color--white, #fff ); border-radius: 20px; padding: 1.75rem; margin-bottom: 1.5rem; }
.pf-loc-section--map { padding: .5rem; }
.pf-loc-section.secondary { background-color: var( --wp--preset--color--yellow, #fce849 ); padding: .7rem 1.5rem; text-align: center; font-weight: 700; color: var( --wp--preset--color--dark-green, #183028 ); }
.pf-loc-section-title { margin: 0 0 1.25rem; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 22px; color: var( --wp--preset--color--dark-green, #183028 ); }

.pf-meta-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1rem; }
.pf-meta-item { display: flex; align-items: flex-start; gap: .6rem; }
.pf-meta-label { display: inline-flex; flex-shrink: 0; color: var( --wp--preset--color--orange-cta, #f9752d ); font-size: 25px; line-height: 1.3; }
.pf-meta-label:empty { display: none; }
/* Own outline icon class so the theme's `.pf-icon { fill: currentColor }` does not
 * fill our stroke-only icons. Consistent stroke weight, no fill. */
.pf-loc-icon { display: inline-block; width: 1em; height: 1em; vertical-align: -0.125em; flex-shrink: 0; fill: none; stroke: currentColor; }
.pf-meta-value { flex: 1; min-width: 0; line-height: 1.5; display: flex; flex-direction: column; }
.pf-meta-caption { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; opacity: .55; }
.pf-meta-value a { word-break: break-word; }
.pf-meta-links { display: flex; flex-direction: column; gap: .25rem; }
.pf-address { display: flex; flex-direction: column; gap: .15rem; }
.pf-address__street { font-weight: 500; }

/* Primary vs. secondary detail rows in the sidebar card */
.pf-loc-details-extra {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgba( 0, 0, 0, .08 );
}
.pf-meta-list--extra {
	display: grid;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	gap: .85rem 1rem;
}
.pf-meta-list--extra .pf-meta-item { gap: .45rem; align-items: flex-start; }
.pf-meta-list--extra .pf-meta-label {
	color: var( --wp--preset--color--dark-green, #183028 );
	opacity: .55;
	font-size: 18px;
}
.pf-meta-list--extra .pf-meta-value { font-size: .88rem; }
.pf-meta-list--extra .pf-meta-caption { font-size: .65rem; }
.pf-meta-item--fees .pf-meta-value { gap: .75rem; }
.pf-fee-group { display: flex; flex-direction: column; gap: .1rem; }
@media ( max-width: 480px ) {
	.pf-meta-list--extra { grid-template-columns: 1fr; }
}

/* Submit CTA above the ratings block in the main column */
.pf-location__cta { margin-top: 2rem; }

/* Community submit CTA — shipped here so it renders on any active theme (e.g. wpvibe draft). */
.pf-community-cta {
	padding: 2.25rem 1.75rem;
	background-color: var( --wp--preset--color--cream-alt, #faf5d1 );
	border-radius: 20px;
	text-align: center;
}
.pf-community-cta__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .35rem;
}
.pf-community-cta__lead,
.pf-community-cta__sub {
	margin: 0;
	font-family: var( --wp--preset--font-family--body );
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.45;
	color: var( --wp--preset--color--dark-green, #183028 );
}
.pf-community-cta__sub { margin-bottom: .65rem; }
.pf-community-cta__button { margin-top: .25rem; }

/* ---- Location image placeholder (beige field, favicon bottom-left) ---- */
.pf-loc-placeholder {
	display: block;
	position: relative;
	overflow: hidden;
	background-color: var( --wp--preset--color--cream-alt, #faf5d1 );
}
.pf-loc-placeholder--card,
.pf-card__img.pf-loc-placeholder {
	width: 100%;
	height: 150px;
	flex-shrink: 0;
}
.pf-loc-placeholder--hero {
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: 10px;
	overflow: visible;
}
.pf-loc-placeholder--thumb {
	width: 64px;
	height: 64px;
	border-radius: 10px;
	flex-shrink: 0;
}
.pf-loc-placeholder__mark {
	position: absolute;
	left: 0;
	bottom: 0;
	width: auto;
	height: auto;
	max-width: 46%;
	max-height: 58%;
	object-fit: contain;
	object-position: left bottom;
	opacity: .2;
	pointer-events: none;
}
.pf-loc-placeholder--hero .pf-loc-placeholder__mark {
	bottom: -28px;
	max-width: clamp( 3.5rem, 26%, 7rem );
	opacity: .18;
	z-index: 1;
	overflow: visible;
}
.pf-loc-placeholder--thumb .pf-loc-placeholder__mark {
	max-width: 72%;
	max-height: 72%;
	opacity: .16;
}

/* Main column */
/* Contain the image so nothing is cut off, and fill the frame with a blurred
   copy of it. Solid-background logos blur to that same colour, cut-out logos
   sit on the white base below — no per-image configuration needed. */
.pf-location__image:has( img ) {
	position: relative;
	aspect-ratio: 16 / 9;
	margin-bottom: 1.75rem;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	isolation: isolate;
}
.pf-location__image:has( img )::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: var( --pf-loc-img );
	background-position: center;
	background-size: cover;
	filter: blur( 30px ) saturate( 1.2 );
	transform: scale( 1.2 );
}
.pf-location__image img { width: 100%; height: 100%; object-fit: contain; padding: clamp( 10px, 2.5%, 28px ); border-radius: 0; margin-bottom: 0; }
.pf-location__image .pf-loc-placeholder { margin-bottom: 1.75rem; }
.pf-location__image .pf-loc-placeholder--hero { margin-bottom: 0; }
/* Extra space so the hero mark (offset below the field) is not covered by the title. */
.pf-location__image:has( > .pf-loc-placeholder--hero ) {
	margin-bottom: calc( 1.75rem + clamp( 16px, 2.5vw, 28px ) );
}
.pf-location__title { margin: 0 0 1rem; font-family: var( --wp--preset--font-family--heading ); font-size: clamp( 2rem, 1.2rem + 3vw, 3.25rem ); line-height: 1.05; color: var( --wp--preset--color--dark-green, #183028 ); }
.pf-location__cats { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1.25rem; }
.pf-location__body { line-height: 1.7; }
.pf-location__body > * + * { margin-top: 1rem; }
.pf-location__nav { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 2px solid var( --wp--preset--color--cream-alt, #faf5d1 ); }
.pf-location__nav ul { list-style: none; margin: 0; padding: 0; display: flex; justify-content: space-between; gap: 1.5rem; }
.pf-location__nav a { display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; color: var( --wp--preset--color--primary-green, #018940 ); font-weight: 500; }
.pf-location__nav .pf-next { margin-left: auto; text-align: right; }
.pf-location__ratings { margin-top: 2rem; }

.pf-pill { display: inline-block; padding: .15rem .7rem; border-radius: 999px; background: rgba( 1, 137, 64, .12 ); color: var( --wp--preset--color--primary-green, #018940 ); font-size: .8rem; text-decoration: none; }
.pf-badge--verified { display: inline-block; padding: .1rem .55rem; border-radius: 999px; background: #d7f0df; color: #0a5d2c; font-size: .75rem; font-weight: 700; }

/* Related band (full-bleed khaki with zigzag top edge, like the event page) */
.pf-related {
	position: relative;
	width: 100%;
	margin-top: 3rem;
	background: #e7e1b0;
	color: var( --wp--preset--color--dark-green, #183028 );
	/* Extra bottom padding so the khaki band extends behind the footer's zigzag
	 * teeth — combined with the footer overlap below, no white/cream shows in the
	 * notches (the band flows into the footer, as on single events). */
	padding: clamp( 3rem, 6vw, 4.5rem ) 0 220px;
	clip-path: polygon( 0% 100%, 100% 100%, 100.05% 3.62%, 93.39% 0%, 93.47% 3.18%, 88.96% 0%, 89.01% 4.74%, 83.96% 0%, 84.06% 4.77%, 77.97% 0%, 78.02% 4.09%, 72.03% 0%, 72% 4.25%, 64.95% 0%, 65% 5.75%, 55.94% 0%, 55.99% 5.5%, 48.96% 0.81%, 49% 6.25%, 39.01% 0%, 39.01% 4.5%, 30.99% 0%, 31% 4.5%, 25.94% 0.26%, 26% 5.5%, 17.86% 0%, 17.92% 5.16%, 11.88% 0%, 11.95% 5.43%, 4.94% 0%, 4.9% 5.34%, 0% 0% );
}
/* Pull the footer up so it overlaps the band's bottom padding: the footer's
 * zigzag teeth then reveal the khaki band behind them, never white. */
body.single-pf_location .pf-site-footer {
	margin-top: -180px;
	position: relative;
}
.pf-related__inner { max-width: 1200px; margin-inline: auto; padding-inline: 40px; }
.pf-related h2 { margin: 0 0 1.5rem; }
.pf-related__grid { display: grid; grid-template-columns: repeat( auto-fill, minmax( 180px, 1fr ) ); gap: 1rem; }
@media ( max-width: 1300px ) {
	.pf-related {
		clip-path: polygon( 0% 100%, 100% 100%, 100.05% 3.62%, 88.96% 0%, 89.01% 4.74%, 77.97% 0%, 78.02% 4.09%, 64.95% 0%, 65% 5.75%, 48.96% 0.81%, 49% 6.25%, 30.99% 0%, 31% 4.5%, 20.24% 0%, 20.11% 5.94%, 9.17% 0%, 9% 5.94%, 0% 0% );
	}
}

/* Four wide teeth on phones, the same step the header and the footer take.
 * Without it this band kept the dense desktop edge while everything above
 * it had already thinned out. */
@media ( max-width: 700px ) {
	.pf-related {
		clip-path: polygon( 0% 100%, 100% 100%, 100.05% 3.62%, 77.97% 0%, 78.02% 4.09%, 48.96% 0.81%, 49% 6.25%, 20.24% 0%, 20.11% 5.94%, 0% 0% );
		/* The teeth are cut as a share of the band height, and stacked cards
		 * make that band tall, so the deepest notch reaches roughly 70px down
		 * - far past the 3rem the heading used to start at. */
		padding-top: 7rem;
	}
}

/* ---- Map ---- */
.pf-map { width: 100%; border-radius: 10px; overflow: hidden; z-index: 0; }
.pf-map--single { height: 240px; }
.pf-map--overview { height: 480px; }

/* Inline-SVG marker (no external PNG; immune to image CDN/lazy-load) */
.pf-marker { background: none; border: 0; }
.pf-marker svg { display: block; filter: drop-shadow( 0 2px 3px rgba( 0, 0, 0, .35 ) ); }

/* ---- Map-first layout (layout="mapfull") ---- */
/* Full-bleed hero: break out of the content container to the full viewport. */
.pf-locations--mapfull {
	position: relative;
	left: 50%;
	right: 50%;
	width: 100vw;
	max-width: 100%;
	margin-left: -50vw;
	margin-right: -50vw;
	margin-bottom: 0;
}
/* 50px gap between the map hero and the following content. Applied as padding on
 * the next block, because the block flow layout resets the hero's own
 * margin-block-end to 0 (and padding neither collapses nor gets reset). */
.pf-entry__content > :has( > .pf-locations--mapfull ) + * { padding-top: 50px; }
.pf-entry__content > :has( > .pf-locations--mapfull ) + * > :first-child { margin-top: 0; }
/* When it opens the page, tuck it up under the header's zigzag teeth (the header
 * pulls following content up by ~35px). Handles both a direct child and the
 * common case where the shortcode sits inside a full-width group wrapper. */
.pf-entry--flush .pf-entry__content > .pf-locations--mapfull:first-child,
.pf-entry--flush .pf-entry__content > :first-child > .pf-locations--mapfull:first-child,
.pf-entry__content > .pf-locations--mapfull:first-child {
	margin-top: -35px;
}
.pf-entry--flush .pf-entry__content > :first-child { margin-top: 0; }
/* Cancel the content container's top padding when the map is the page opener. */
.pf-page > .pf-entry__content > .pf-locations--mapfull:first-child { margin-top: calc( -2.5rem - 35px ); }

.pf-mapfull {
	position: relative;
	/* End a little before the fold so the headline below stays partly visible. */
	height: min( 68vh, 620px );
	min-height: 440px;
}
.pf-mapfull .pf-map--full {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}

/* Floating filter — a narrow vertical stack near the top-left, over the map. */
.pf-locations__toolbar--float {
	position: absolute;
	z-index: 500;
	top: calc( 1rem + 30px );
	left: 1rem;
	right: auto;
	flex-direction: column;
	align-items: stretch;
	gap: .5rem;
	width: auto;
	max-width: none;
	margin: 0;
	padding: .6rem;
	background: rgba( 255, 255, 255, .93 );
	-webkit-backdrop-filter: blur( 6px );
	backdrop-filter: blur( 6px );
	border-radius: 14px;
	box-shadow: 0 6px 24px rgba( 0, 0, 0, .15 );
}
/* Stacked controls — all equal width, capped at 230px. */
.pf-locations__toolbar--float input[type="search"],
.pf-locations__toolbar--float select,
.pf-locations__toolbar--float button {
	box-sizing: border-box;
	width: 230px;
	max-width: 60vw;
}

/* Right results rail — full height of the hero, scrollable. */
.pf-mapfull__panel {
	position: absolute;
	z-index: 500;
	top: calc( 1rem + 30px );
	right: 1rem;
	bottom: 1rem;
	width: min( 360px, 40vw );
	display: flex;
	flex-direction: column;
	background: rgba( 255, 255, 255, .97 );
	border-radius: 16px;
	box-shadow: 0 6px 24px rgba( 0, 0, 0, .18 );
	overflow: hidden;
}
.pf-mapfull__head {
	flex: 0 0 auto;
	padding: .75rem 1rem;
	border-bottom: 1px solid rgba( 0, 0, 0, .08 );
	font-weight: 700;
	color: var( --wp--preset--color--dark-green, #183028 );
}
.pf-mapfull__list {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: .5rem;
	display: flex;
	flex-direction: column;
	gap: .35rem;
}

/* Result row: thumbnail left, text right, action buttons on hover. */
.pf-result {
	position: relative;
	display: flex;
	gap: .7rem;
	padding: .5rem;
	border-radius: 12px;
	color: inherit;
	transition: background .15s ease;
}
.pf-result:hover,
.pf-result.is-active { background: rgba( 1, 137, 64, .08 ); }

/* Hover overlay with the two action buttons. */
.pf-result__actions {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	padding: .4rem;
	border-radius: 12px;
	background: rgba( 255, 255, 255, .94 );
	opacity: 0;
	pointer-events: none;
	transition: opacity .15s ease;
}
.pf-result:hover .pf-result__actions,
.pf-result:has( .pf-result__btn:focus-visible ) .pf-result__actions { opacity: 1; pointer-events: auto; }
.pf-result__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 200px;
	max-width: 100%;
	padding: .35rem .8rem;
	border: 0;
	border-radius: 999px;
	font: inherit;
	font-size: .8rem;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}
.pf-result__btn--go { background: var( --wp--preset--color--primary-green, #018940 ); color: #fff; }
.pf-result__btn--map { background: var( --wp--preset--color--dark-green, #183028 ); color: #fff; }
.pf-result__img { flex: 0 0 64px; }
.pf-result__img img { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; display: block; }
.pf-result__img:empty { width: 64px; height: 64px; border-radius: 10px; background: rgba( 0, 0, 0, .06 ); }
.pf-result__img .pf-loc-placeholder { display: block; }
.pf-result__body { min-width: 0; display: flex; flex-direction: column; gap: .12rem; }
.pf-result__title { font-weight: 700; line-height: 1.2; color: var( --wp--preset--color--dark-green, #183028 ); }
.pf-result__addr { font-size: .8rem; opacity: .7; }
.pf-result__text {
	font-size: .82rem; line-height: 1.4; opacity: .85;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.pf-result__details { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .2rem; }
.pf-chip {
	font-size: .7rem; padding: .1rem .5rem; border-radius: 999px;
	background: rgba( 1, 137, 64, .1 ); color: var( --wp--preset--color--primary-green, #018940 );
}

/* Stack on small screens: map on top, filter, then the rail below. */
@media ( max-width: 860px ) {
	.pf-mapfull { height: auto; min-height: 0; display: flex; flex-direction: column; }
	.pf-mapfull .pf-map--full { position: relative; inset: auto; height: 52vh; }
	.pf-locations__toolbar--float {
		position: relative; inset: auto; right: auto; max-width: none; margin: .75rem;
	}
	.pf-mapfull__panel {
		position: relative; inset: auto; width: auto; margin: 0 .75rem .75rem;
		max-height: 60vh; box-shadow: none; border: 1px solid rgba( 0, 0, 0, .1 );
	}
}

/* ---- Cards ---- */
.pf-cards { display: grid; grid-template-columns: repeat( auto-fill, minmax( 220px, 1fr ) ); gap: 1rem; }
.pf-card { display: flex; flex-direction: column; border: 1px solid rgba( 0, 0, 0, .1 ); border-radius: 14px; overflow: hidden; text-decoration: none; color: inherit; background: #fff; }
.pf-card__img:not( .pf-loc-placeholder ) {
	position: relative;
	display: block;
	overflow: hidden;
	background: #fff;
	isolation: isolate;
}
.pf-card__img:not( .pf-loc-placeholder )::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: var( --pf-loc-img );
	background-position: center;
	background-size: cover;
	filter: blur( 20px ) saturate( 1.2 );
	transform: scale( 1.2 );
}
.pf-card__img img { width: 100%; height: 150px; object-fit: contain; padding: 10px; display: block; }
.pf-card__body { padding: .75rem; display: flex; flex-direction: column; gap: .2rem; }
.pf-card__title { font-weight: 700; }
.pf-card__meta, .pf-card__cats { font-size: .82rem; opacity: .7; }

/* ---- Overview toolbar ---- */
.pf-locations__intro { margin-bottom: 1rem; }
.pf-locations__intro p { max-width: 66%; }
@media ( max-width: 782px ) { .pf-locations__intro p { max-width: 100%; } }
/* ---- Overview ---- */
.pf-locations {
	width: 100%;
	max-width: 100%;
}
.pf-locations__toolbar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: 1.5rem; max-width: 100%; }
.pf-locations__toolbar input[type="search"], .pf-locations__toolbar select { padding: .5rem .6rem; border: 1px solid rgba( 0, 0, 0, .25 ); border-radius: 10px; font: inherit; max-width: 100%; }
.pf-locations__toolbar button[type="submit"],
.pf-locations__toolbar--float button[type="submit"],
.pf-locations__toolbar .pf-locations__filter,
.pf-locations__toolbar--float .pf-locations__filter {
	padding: .575rem 1rem;
	border: 0;
	border-radius: 999px;
	background: var( --wp--preset--color--primary-green, #018940 );
	color: #fff;
	cursor: pointer;
	font: inherit;
	line-height: 1.2;
}
.pf-locations__toolbar button[type="submit"]:hover,
.pf-locations__toolbar--float button[type="submit"]:hover,
.pf-locations__toolbar .pf-locations__filter:hover,
.pf-locations__toolbar--float .pf-locations__filter:hover {
	background: var( --wp--preset--color--dark-green, #183028 );
}
.pf-locations__filter--clear {
	background: transparent !important;
	color: var( --wp--preset--color--primary-green, #018940 ) !important;
	border: 2px solid var( --wp--preset--color--primary-green, #018940 ) !important;
}
.pf-locations__filter--clear:hover {
	background: rgba( 1, 137, 64, .08 ) !important;
	color: var( --wp--preset--color--dark-green, #183028 ) !important;
	border-color: var( --wp--preset--color--dark-green, #183028 ) !important;
}
.pf-locations__views { margin-left: auto; display: inline-flex; flex-wrap: wrap; gap: .25rem; }
.pf-view-btn { background: transparent; border: 1px solid rgba( 0, 0, 0, .2 ); border-radius: 999px; padding: .4rem .9rem; cursor: pointer; }
.pf-view-btn.is-active { background: #018940; color: #fff; border-color: #018940; }
.pf-locations__featured { margin-bottom: 1.5rem; }
.pf-summary-list { columns: 2; }
@media ( max-width: 600px ) { .pf-summary-list { columns: 1; } }
.pf-summary-list__city { opacity: .6; font-size: .85rem; }

/* Prevent horizontal page scroll from full-bleed map or wide toolbars. */
body:has( .pf-locations ),
body:has( .pf-locations--mapfull ) {
	overflow-x: clip;
}

/* ---- Ratings ---- */
.pf-rating__stars { color: var( --wp--preset--color--orange-cta, #f9752d ); letter-spacing: .05em; }
.pf-rating-form { width: 100%; margin-top: 1rem; }
.pf-rating-form label { display: block; margin-bottom: .9rem; font-weight: 600; }
/* Contact-form look: 2px solid green, full width. */
.pf-rating-form select, .pf-rating-form textarea, .pf-rating-form input[type="text"], .pf-rating-form input[type="email"] {
	display: block; width: 100%; margin-top: .3rem; padding: .7rem 1rem;
	border: 2px solid var( --wp--preset--color--primary-green, #018940 );
	border-radius: 10px; font: inherit; background: var( --wp--preset--color--white, #fff );
}
.pf-rating-form textarea { min-height: 120px; }
.pf-rating-form button { padding: .7rem 1.5rem; border: 0; border-radius: 999px; background: var( --wp--preset--color--primary-green, #018940 ); color: #fff; cursor: pointer; font: inherit; }
.pf-rating__notice { color: #0a5d2c; font-weight: 600; }

/* ---- Location submission wizard ---- */
.pf-loc-submit__progress { margin: 0 0 1.5rem; }
.pf-loc-submit__progress ol {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.pf-loc-submit__progress-item {
	display: flex;
	align-items: center;
	gap: .45rem;
	font-size: .85rem;
	color: rgba( 24, 48, 40, .55 );
	cursor: default;
}
.pf-loc-submit__progress-item.is-complete,
.pf-loc-submit__progress-item.is-active { color: var( --wp--preset--color--dark-green, #183028 ); font-weight: 600; }
.pf-loc-submit__progress-item.is-complete { cursor: pointer; }
.pf-loc-submit__progress-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.65rem;
	height: 1.65rem;
	border-radius: 50%;
	border: 2px solid currentColor;
	font-size: .8rem;
	font-weight: 700;
}
.pf-loc-submit__progress-item.is-active .pf-loc-submit__progress-num,
.pf-loc-submit__progress-item.is-complete .pf-loc-submit__progress-num {
	background: var( --wp--preset--color--primary-green, #018940 );
	border-color: var( --wp--preset--color--primary-green, #018940 );
	color: #fff;
}
.pf-loc-submit__step {
	border: 0;
	margin: 0;
	padding: 0;
	min-width: 0;
}
.pf-loc-submit__checks {
	display: grid;
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	gap: .75rem 1rem;
	margin: .5rem 0 1rem;
}
.pf-loc-submit__check {
	display: flex;
	align-items: flex-start;
	gap: .45rem;
	font-size: .9rem;
	font-weight: 500;
	font-style: normal;
	line-height: 1.35;
	min-width: 0;
}
.pf-loc-submit__check input[type="checkbox"] {
	width: auto;
	margin-top: .15rem;
	flex-shrink: 0;
	accent-color: var( --wp--preset--color--primary-green, #018940 );
}
.pf-loc-submit__terms label {
	display: flex;
	align-items: flex-start;
	gap: .55rem;
	font-size: .9rem;
	font-weight: 500;
	font-style: normal;
	line-height: 1.45;
}
.pf-loc-submit__terms input { margin-top: .2rem; flex-shrink: 0; }
.pf-loc-submit__file-label { display: block; font-size: .9rem; font-weight: 500; font-style: normal; }
.pf-loc-submit__file-label input[type="file"] {
	display: block;
	width: 100%;
	margin-top: .35rem;
	font: inherit;
	font-style: normal;
}
.pf-loc-submit__nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: .75rem;
	margin-top: 1rem;
}
.pf-loc-submit__nav .pf-loc-submit__prev { margin-right: auto; }
.pf-loc-submit__submit-wrap { margin: 0; }
.pf-submit-form__submit--outline {
	background: transparent !important;
	color: var( --wp--preset--color--primary-green, #018940 ) !important;
	border: 2px solid var( --wp--preset--color--primary-green, #018940 ) !important;
}
.pf-submit-form__submit--outline:hover {
	background: rgba( 1, 137, 64, .08 ) !important;
	color: var( --wp--preset--color--dark-green, #183028 ) !important;
	transform: none;
}
@media ( max-width: 782px ) {
	.pf-loc-submit__progress-label { font-size: .78rem; }
	.pf-loc-submit__checks { grid-template-columns: 1fr; }
}
.pf-loc-submit__submit[hidden],
.pf-loc-submit__next[hidden],
.pf-loc-submit__prev[hidden] {
	display: none !important;
}

/* Ratings accordion (single location) — collapsed by default so the form
   isn't too prominent. */
.pf-ratings-accordion__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	cursor: pointer;
	list-style: none;
}
.pf-ratings-accordion__toggle::-webkit-details-marker {
	display: none;
}
.pf-ratings-accordion__toggle .pf-loc-section-title {
	margin: 0;
}
.pf-ratings-accordion__chevron {
	flex: 0 0 auto;
	width: .6rem;
	height: .6rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate( 45deg );
	transition: transform .2s ease;
	opacity: .7;
}
.pf-ratings-accordion[open] .pf-ratings-accordion__chevron {
	transform: rotate( -135deg );
}
.pf-ratings-accordion__body {
	margin-top: 1rem;
}

/* "Is this your location?" claim block (single location sidebar) */
.pf-loc-claim {
	border: 2px solid var(--wp--preset--color--primary-green, #018940);
	border-radius: 16px;
	background: var(--wp--preset--color--cream, #fffde9);
}
.pf-loc-claim__text {
	margin: 0 0 1rem;
	font-size: .95rem;
	line-height: 1.5;
}
.pf-loc-claim__button {
	width: 100%;
	text-align: center;
}
.pf-loc-claim__ok {
	margin: 0;
	font-weight: 600;
	color: var(--wp--preset--color--primary-green, #018940);
}

/* Locations teaser (homepage) — full-bleed darker-beige band with zigzag edges */
.pf-loc-teaser {
	position: relative;
	width: 100vw;
	margin-left: calc( 50% - 50vw );
	margin-top: 3rem;
	margin-bottom: 3rem;
	padding: 3rem 0;
	background: var( --wp--preset--color--cream-alt, #faf5d1 );
}
.pf-loc-teaser::before,
.pf-loc-teaser::after {
	content: "";
	position: absolute;
	left: 0;
	width: 100%;
	height: 14px;
	background: var( --wp--preset--color--cream-alt, #faf5d1 );
}
.pf-loc-teaser::before {
	top: -14px;
	clip-path: polygon( 0 100%, 5% 0, 10% 100%, 15% 0, 20% 100%, 25% 0, 30% 100%, 35% 0, 40% 100%, 45% 0, 50% 100%, 55% 0, 60% 100%, 65% 0, 70% 100%, 75% 0, 80% 100%, 85% 0, 90% 100%, 95% 0, 100% 100% );
}
.pf-loc-teaser::after {
	bottom: -14px;
	clip-path: polygon( 0 0, 5% 100%, 10% 0, 15% 100%, 20% 0, 25% 100%, 30% 0, 35% 100%, 40% 0, 45% 100%, 50% 0, 55% 100%, 60% 0, 65% 100%, 70% 0, 75% 100%, 80% 0, 85% 100%, 90% 0, 95% 100%, 100% 0 );
}
.pf-loc-teaser__inner {
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: 40px;
}
.pf-loc-teaser__title {
	margin: 0 0 1.5rem;
}
.pf-loc-teaser__grid {
	grid-template-columns: repeat( auto-fill, minmax( 200px, 1fr ) );
}
/* 1) no border on teaser + related cards */
.pf-loc-teaser__grid .pf-card,
.pf-related__grid .pf-card {
	border: 0;
}
/* 2) extra card info (shared render_card: teaser + related) */
.pf-card__rating {
	margin: .3rem 0 .1rem;
	font-size: .8rem;
}
.pf-card__meta-list {
	display: flex;
	flex-direction: column;
	gap: .12rem;
	margin-top: .2rem;
}
.pf-card__meta {
	font-size: .78rem;
	line-height: 1.35;
	opacity: .85;
}
.pf-loc-teaser__cta {
	margin-top: 1.75rem;
	text-align: center;
}
@media ( max-width: 782px ) {
	.pf-loc-teaser__inner {
		padding-inline: 20px;
	}
}

/* The site-wide reference gutter. --pf-gutter is declared in the theme
   stylesheet, but the 40px defaults above live here and this file loads
   after the theme, so the override has to be restated in this file. */
@media ( max-width: 768px ) {
	.pf-location,
	.pf-loc-teaser__inner,
	.pf-related__inner {
		padding-inline: var( --pf-gutter, 30px );
	}
}
