/* OG Impact – maps and batch list. Colours follow the Ocean Gardener globals. */
.og-map {
	--og-pin: #8b3a1e;
	--og-pin-sm: #a8553a;
	position: relative;
	width: 100%;
	border-radius: 24px;
	overflow: hidden;
	background: #bfe3ef;
	isolation: isolate;
}
.og-map__canvas {
	width: 100%;
	height: var(--og-map-h, 420px);
}
@media (max-width: 767px) {
	.og-map__canvas { height: min(var(--og-map-h, 420px), 340px); }
}

.og-map__legend {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	display: flex;
	gap: 16px;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.85);
	font: 500 13px/16px Roboto, sans-serif;
	color: #324b4e;
	pointer-events: none;
}
.og-map__legend span { display: inline-flex; align-items: center; gap: 6px; }
.og-map__key { display: inline-block; border-radius: 50%; background: var(--og-pin); }
.og-map__key--lg { width: 10px; height: 10px; }
.og-map__key--sm { width: 8px; height: 8px; background: var(--og-pin-sm); opacity: 0.75; }

/* Accessible text fallback: visible only if the map cannot load. */
.og-map__list {
	position: absolute !important;
	width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
	margin: 0; padding: 0;
}
.og-map--nokey .og-map__canvas,
.og-map--error .og-map__canvas { display: none; }
.og-map--nokey .og-map__list,
.og-map--error .og-map__list {
	position: static !important; width: auto; height: auto; clip: auto; white-space: normal;
	display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 6px 24px;
	padding: 56px 24px 24px; list-style: none; font: 14px/20px Roboto, sans-serif; color: #324b4e;
}

/* Hotspots */
.og-pin { position: absolute; transform: translate(-50%, -50%); }
.og-pin:hover { z-index: 999 !important; }
.og-pin__dot {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--og-pin);
	color: #fff;
	font: 700 13px/1 Roboto, sans-serif;
	box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9), 0 2px 6px rgba(0, 0, 0, 0.25);
	cursor: default;
}
.og-pin--sm .og-pin__dot { background: var(--og-pin-sm); }
.og-pin__label {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
	font: 500 11px/14px Roboto, sans-serif;
	color: #324b4e;
	text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 2px #fff;
	pointer-events: none;
}

/* Batch list */
.og-batches { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; }
@media (max-width: 767px) { .og-batches { grid-template-columns: 1fr; } }
.og-batches__col { list-style: none; margin: 0; padding: 0; }
.og-batches__col li {
	display: flex; gap: 12px; padding: 8px 0; border-bottom: 1px solid #e6d8c5;
	font: 13px/18px Roboto, sans-serif; color: #554d47;
}
.og-batches__date { width: 90px; flex-shrink: 0; }
.og-batches__name { flex: 1 1 auto; }
.og-batches__count { width: 32px; text-align: right; font-weight: 600; }

/* Elementor atomic slot (block with class og-map-<set>) */
.og-map__fallback {
	position: absolute !important;
	width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* Batch table: collapsed to 3 rows on phones */
.og-batches__toggle { display: none; }
@media (max-width: 767px) {
	.og-batches--collapsed .og-batches__extra { display: none; }
	.og-batches__toggle {
		display: block; grid-column: 1 / -1; justify-self: start; margin-top: 12px; padding: 0;
		background: none; border: 0; cursor: pointer;
		font: 600 14px/20px Roboto, sans-serif; color: #324b4e; text-decoration: underline; text-underline-offset: 3px;
	}
}