/* COR Map — Contact page locator.
 *
 * The static map keeps its own styles; this file only adds the Google map and
 * hides the PNG when the map has successfully taken over. `.cor-map--replaced`
 * is applied by JS and removed again on any failure, so the fallback is a class
 * toggle rather than a rebuild.
 */

.cor-map--replaced { display: none !important; }

.cor-gmap {
	--cor-gmap-ink: #1A4348;    /* Midnight Green */
	--cor-gmap-accent: #259596; /* Agave Green */
	--cor-gmap-line: #D9D9D6;
	position: relative;
}

/* ---------- brand filter ---------- */

.cor-gmap__filters {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 20px;
}

/* Every declaration here is scoped `.cor-gmap .cor-gmap__filter` on purpose.
   The kit emits `.elementor-kit-7 button, … { background-color; padding:
   20px 60px; font-size; border-width: 2px; border-radius: 35px; … }` at
   specificity (0,1,1) — a bare `.cor-gmap__filter` is (0,1,0) and loses every
   one of those properties, which is how these came out as full-size Midnight
   Green page buttons on the first pass. The compound selector is (0,2,0) and
   wins without needing !important. Read from the generated post-7.css, not
   guessed. */
.cor-gmap .cor-gmap__filter {
	appearance: none;
	margin: 0;
	padding: 9px 20px;
	border-style: solid;
	border-width: 1px;
	border-color: var(--cor-gmap-accent);
	border-radius: 999px;
	background-color: transparent;
	color: var(--cor-gmap-ink);
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}

/* The kit's hover is (0,2,1), so these have to be (0,3,0) to hold. */
.cor-gmap .cor-gmap__filter:hover,
.cor-gmap .cor-gmap__filter:focus {
	background-color: var(--cor-gmap-accent);
	border-color: var(--cor-gmap-accent);
	color: #fff;
}

.cor-gmap .cor-gmap__filter[aria-pressed="true"] {
	background-color: var(--cor-gmap-ink);
	border-color: var(--cor-gmap-ink);
	color: #fff;
}

.cor-gmap .cor-gmap__filter:focus-visible {
	outline: 2px solid var(--cor-gmap-ink);
	outline-offset: 2px;
}

/* ---------- consent gate (static PNG stays; one button above it) ---------- */

.cor-gmap__gate {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 20px;
	margin: 0 0 20px;
}

.cor-gmap__gate-text {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: #1A4348;
}

/* Same pill as the brand filters, but the gate sits outside `.cor-gmap`, so
   the scoping trick above does not apply — scope it to the gate instead. */
.cor-gmap__gate .cor-gmap__gate-button {
	appearance: none;
	margin: 0;
	padding: 9px 20px;
	border: 1px solid #1A4348;
	border-radius: 999px;
	background-color: #1A4348;
	color: #fff;
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	line-height: 1.2;
	cursor: pointer;
}

.cor-gmap__gate .cor-gmap__gate-button:hover,
.cor-gmap__gate .cor-gmap__gate-button:focus {
	background-color: #259596;
	border-color: #259596;
	color: #fff;
}

/* ---------- the map itself ---------- */

.cor-gmap__canvas {
	/* The PNG this replaces was 1240 x 698 in the same slot. Holding the same
	   ratio means the section below the map does not jump when the map loads,
	   and it reserves the space before Google has drawn anything. */
	aspect-ratio: 1240 / 698;
	width: 100%;
	min-height: 320px;
	background: #D7D7D7; /* the PNG's own water colour, so the pre-load state
	                        reads as a map rather than as a missing image */
}

/* ---------- info window ---------- */

.cor-gmap__card {
	min-width: 200px;
	/* Google writes padding-top/right/bottom: 0 inline on .gm-style-iw-c, so
	   only its left padding survives. The breathing room on the other three
	   sides has to live here, on our own element (CS-223). */
	padding: 10px 20px 16px 4px;
	color: #2D2926;
	font-size: 15px;
	line-height: 1.45;
}

.cor-gmap__brand {
	margin: 0 0 6px;
	color: var(--cor-gmap-accent);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.cor-gmap__city {
	margin: 0;
	color: var(--cor-gmap-ink);
	font-size: 20px;
	line-height: 1.2;
}

.cor-gmap__type {
	margin: 2px 0 8px;
	color: #888B8D;
	font-size: 13px;
}

.cor-gmap__addr { margin: 0 0 6px; }

.cor-gmap__tel,
.cor-gmap__link {
	color: var(--cor-gmap-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.cor-gmap__tel:hover,
.cor-gmap__link:hover { color: var(--cor-gmap-accent); }

.cor-gmap__links {
	display: flex;
	gap: 18px;
	margin: 10px 0 0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

/* Google's own info-window chrome. Only the padding and the radius are worth
   touching — the close button and the pointer are Google's and fighting them
   produces a worse result than leaving them alone. */
.cor-gmap__canvas .gm-style-iw.gm-style-iw-c { padding: 14px 16px; border-radius: 4px; }
.cor-gmap__canvas .gm-style-iw-d { overflow: auto !important; }

/* ---------- phones ---------- */

@media (max-width: 767px) {
	/* The band's mobile gutter is already 0 so the static map could go full
	   bleed. Match that, and give the filters back the 30px the band lost. */
	.cor-gmap__filters,
	.cor-gmap__gate {
		padding: 0 30px;
		margin-bottom: 16px;
	}
	.cor-gmap .cor-gmap__filter {
		padding: 8px 16px;
		font-size: 11px;
	}
	.cor-gmap__canvas {
		/* Taller than the desktop ratio: a 16:9 slice of the United States on a
		   390px screen is 220px tall, which is not a map you can use. */
		aspect-ratio: 1 / 1;
		min-height: 360px;
	}
}