/**
 * Home — Travel map: dark canvas + glass frame (matches Explore / hero tone).
 * SVG fills: inc/home-map-section.php (ocean, land, visited).
 *
 * @package EveryCountry
 */

.ebc-home-map.ebc-home-map--progress {
	--ebc-map-visited: #3b82f6;
	--ebc-map-not-visited: #3d5369;
	--ebc-map-ocean: #060a10;
	--ebc-map-lake: #0a111a;
	--ebc-map-antarctica: #1e293b;

	background-color: var( --ebc-hero-canvas, #1a212a ) !important;
	background-image: radial-gradient( ellipse 120% 80% at 50% 0%, rgba( 59, 130, 246, 0.07 ), transparent 55% ),
		linear-gradient( 180deg, rgba( 255, 255, 255, 0.02 ) 0%, transparent 40% ) !important;
	color: #f8fafc !important;
	border-top: 1px solid rgba( 255, 255, 255, 0.06 ) !important;
}

.ebc-home-map__header {
	text-align: center;
	max-width: 42rem;
	margin: 0 auto 1.75rem;
}

.ebc-home-map__title {
	margin: 0 0 0.5rem !important;
	font-size: clamp( 1.65rem, 3.2vw, 2.1rem ) !important;
	font-weight: 800 !important;
	letter-spacing: -0.03em !important;
	line-height: 1.2 !important;
	color: #f8fafc !important;
}

.ebc-home-map__title::after {
	content: "";
	display: block;
	width: 2.75rem;
	height: 3px;
	margin: 0.65rem auto 0;
	background: linear-gradient( 90deg, var( --ebc-map-visited, #3b82f6 ), rgba( 96, 165, 250, 0.65 ) ) !important;
	border-radius: 2px;
}

.ebc-home-map__subtitle {
	margin: 0 auto !important;
	max-width: 36rem;
	font-size: clamp( 1rem, 1.4vw, 1.1rem ) !important;
	line-height: 1.55 !important;
	color: rgba( 226, 232, 240, 0.72 ) !important;
}

.ebc-home-map__stats {
	margin: 0.85rem 0 0 !important;
	font-size: 0.95rem !important;
	font-weight: 600 !important;
	color: #93c5fd !important;
	letter-spacing: 0.02em;
}

/* Glass map panel: tight to SVG, no large white mat */
.ebc-home-map__figure {
	margin: 0 auto 1.35rem;
	padding: 0;
	max-width: min( 100%, 72rem );
}

.ebc-home-map__map-wrap {
	position: relative;
	width: 100%;
	padding: 0;
	border-radius: 16px;
	overflow: hidden;
	line-height: 0;

	background: rgba( 255, 255, 255, 0.04 );
	backdrop-filter: blur( 14px );
	-webkit-backdrop-filter: blur( 14px );
	border: 1px solid rgba( 255, 255, 255, 0.1 );
	box-shadow:
		0 4px 24px rgba( 0, 0, 0, 0.35 ),
		inset 0 1px 0 rgba( 255, 255, 255, 0.06 );
}

.ebc-home-map__map-wrap::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	border-radius: inherit;
	box-shadow: inset 0 0 80px rgba( 59, 130, 246, 0.06 );
	z-index: 1;
}

.ebc-home-map--progress .ebc-travel-map-svg {
	display: block;
	width: 100%;
	height: auto;
	vertical-align: top;
	position: relative;
	z-index: 0;
}

/* Legend — chip-style */
.ebc-home-map__legend--visible {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.65rem 0.85rem;
	margin-left: auto;
	margin-right: auto;
	width: fit-content;
	max-width: 100%;
	padding: 0.55rem 1.1rem;
	font-size: 0.88rem;
	font-weight: 500;
	color: rgba( 226, 232, 240, 0.85 ) !important;

	background: rgba( 255, 255, 255, 0.05 );
	border: 1px solid rgba( 255, 255, 255, 0.1 );
	border-radius: 999px;
	box-shadow: 0 2px 16px rgba( 0, 0, 0, 0.2 );
}

.ebc-home-map__legend-item {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
}

.ebc-home-map__swatch {
	width: 1.05rem;
	height: 1.05rem;
	border-radius: 4px;
	flex-shrink: 0;
	border: 1px solid rgba( 255, 255, 255, 0.18 );
	box-shadow: 0 1px 4px rgba( 0, 0, 0, 0.25 );
}

.ebc-home-map__swatch--visited {
	background: var( --ebc-map-visited, #3b82f6 );
	box-shadow: 0 0 12px rgba( 59, 130, 246, 0.45 );
}

.ebc-home-map__swatch--not {
	background: var( --ebc-map-not-visited, #3d5369 );
}

@media ( max-width: 600px ) {
	.ebc-home-map.ebc-home-map--progress.alignfull {
		padding-left: var( --wp--preset--spacing--40, 1.25rem ) !important;
		padding-right: var( --wp--preset--spacing--40, 1.25rem ) !important;
	}

	.ebc-home-map__legend--visible {
		border-radius: 12px;
		padding: 0.65rem 1rem;
	}
}

@media ( prefers-reduced-transparency: reduce ) {
	.ebc-home-map__map-wrap {
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		background: rgba( 15, 20, 28, 0.94 );
	}
}