@layer blocks {
	.blkRun {
		
	}
	
	.mapLegenda {
		margin: 1.5rem 0 0 0;
		display: flex;
		flex-direction: column;
		gap: 1rem;
	}

	.mapLegenda__title h3 {
		margin-bottom: 1rem;
	}

	.mapLegenda__buttons {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 0.75rem;
	}

	.trasa-map {
		width: 100%;
		height: 60vh;
		min-height: 470px;
		border-radius: var(--borderRadius1);
		overflow: hidden;
	}
	
	.trasa-map-waiting {
		position: relative;
		background-color: var(--color__silver--light);
	}
	
	.trasa-map-waiting > .placeholder {
		position: absolute;
		inset: 0;
		z-index: 1;
	}
	
	.trasa-map-waiting .placeholder > img {
		object-fit: cover;
		width: 100%;
		height: 100%;
		filter: blur(8px);
	}
	
	.trasa-map-waiting .b {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		z-index: 2;
	}

	.chartTrase__wrapper {
		margin-top: 2rem;
	}
	
	main:has(.run__panel > .theme--overFooter:last-child) + footer {
		padding-top: calc(var(--theme__padBlockStart) * 2);
		margin-top: calc(var(--theme__padBlockStart) * -1);
	}
	
	.map__gpx {
		margin-top: var(--spacing6);
	}

	/* ==================================================================================
	   RAZPIS 45. MTS (2026-10-11): zemljevid trase po grafikah "04 Trase - podstran" in "05 Prizorisce"
	   - statistika nad zemljevidom (nadmorska visina, visinski metri, temperatura, vlaznost)
	   - legenda s piktogrami: zelen krog z belo ikono + ležeč lahek napis (brez gumba/obrobe)
	   - visinski profil: vec prostora nad njim
	   ================================================================================== */
	.maratonTrasa {
		position: relative;
	}

	.trasaStats {
		position: absolute;
		z-index: 3;
		top: var(--spacing4);
		left: var(--spacing4);
		display: flex;
		flex-direction: column;
		gap: var(--spacing1);
		margin: 0;
		padding: var(--spacing2) var(--spacing3);
		list-style: none;
		color: #14906c;
		background-color: hsl(var(--hslColor__white) / 0.88);
		border-radius: var(--borderRadius1);
	}

	.trasaStats li {
		display: flex;
		align-items: center;
		gap: var(--spacing2);
		line-height: 1.15;
	}

	.trasaStats__icon {
		flex: 0 0 auto;
		width: 1.15rem;
		height: 1.15rem;
	}

	.trasaStats__icon svg {
		width: 100%;
		height: 100%;
	}

	.trasaStats__value {
		font-size: var(--size__body--big);
		font-weight: var(--weight__bold);
		letter-spacing: -0.01em;
		white-space: nowrap;
		font-variant-numeric: tabular-nums;
	}

	/* pomen podatka je v title atributu, bralniki zaslona dobijo besedilo */
	.trasaStats__label {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.mapLegenda {
		margin-top: var(--spacing6);
	}

	.mapLegenda__buttons {
		gap: var(--spacing4) var(--spacing7);
	}

	.mapLegenda .mapLegenda__entry {
		flex-direction: row-reverse;
		gap: var(--spacing3);
		min-width: 0;
		height: auto;
		padding: 0;
		border: 0;
		border-radius: 0;
		outline-offset: 6px;
		background: none;
		color: var(--color__black);
		font-size: var(--size__body);
		font-style: italic;
		font-weight: var(--weight__normal);
		letter-spacing: 0;
		transition: opacity 0.3s ease;
	}

	.mapLegenda .mapLegenda__entry span {
		flex: 0 1 auto;
		text-align: left;
	}

	.mapLegenda .mapLegenda__entry .icon {
		width: 2.4rem;
		height: 2.4rem;
		margin: 0;
		padding: 0.55rem;
		border-radius: 50%;
		background-color: var(--color__green);
		color: var(--color__white);
		fill: var(--color__white);
		stroke: none;
		transition: background-color 0.3s ease;
	}

	.mapLegenda .mapLegenda__entry .icon svg {
		width: 100%;
		height: 100%;
	}

	.mapLegenda .mapLegenda__entry .icon svg path {
		fill: currentColor;
		stroke: none;
	}

	.mapLegenda .mapLegenda__entry:hover .icon {
		background-color: var(--color__green--dark);
	}

	/* izklopljen filter = zbledel piktogram */
	.mapLegenda .mapLegenda__entry[aria-selected="false"] {
		opacity: 0.4;
	}

	.chartTrase__wrapper {
		margin-top: var(--spacing7);
	}

	@media (max-width: 47.99em) {
		.trasaStats {
			top: var(--spacing2);
			left: var(--spacing2);
			padding: var(--spacing1) var(--spacing2);
		}

		.trasaStats__value {
			font-size: var(--size__body);
		}

		.mapLegenda__buttons {
			gap: var(--spacing3) var(--spacing5);
		}
	}

	@media (min-width: 65em) {
		/* višji zemljevid na širokih zaslonih: vsaj 60 % višine okna, sicer ~35 % širine, največ 80 % višine okna */
		.trasa-map {
			height: clamp(60vh, 35vw, 80vh);
		}

		.mapLegenda .mapLegenda__entry .icon {
			width: 1.6rem;
			height: 1.6rem;
			padding: 0.38rem;
		}
	}
}