/* ==========================================================================
   CODE01 — Mappa sedi (Leaflet + tile CARTO dark tinte brand)
   Tutto è scoped sotto .cc-mapwrap per non interferire col resto del tema.
   I token del brand sono ridefiniti qui come fallback locale: se il tema li
   espone già su :root con gli stessi valori, il risultato non cambia.
   ========================================================================== */

.cc-mapwrap {
	--bg: #0E1014;
	--bg-2: #12151A;
	--panel-2: #1D222A;
	--line: rgba(255, 255, 255, .08);
	--line-2: rgba(255, 255, 255, .13);
	--tx: #E8EBF0;
	--tx-mut: #98A2B0;
	--tx-dim: #6B7585;
	--acc: #EB6726;
	--acc-2: #FF8A4C;
	--acc-soft: rgba(235, 103, 38, .15);

	/* Sfondo mappa richiesto dal brand. */
	--map-bg: #0F1320;

	/* Riusa i font del tema; fallback a Manrope / monospace di sistema. */
	--cc-font: 'Hurme Geometric Sans 4', 'Manrope', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--cc-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

	position: relative;
}

/* ---- Contenitore -------------------------------------------------------- */
.cc-map {
	height: 520px;
	width: 100%;
	background: var(--map-bg);
	border: 1px solid var(--line-2);
	border-radius: 14px;
	overflow: hidden;
}

@media (max-width: 720px) {
	.cc-map {
		height: 560px;
	}
}

.cc-map .leaflet-container {
	background: var(--map-bg);
	font-family: var(--cc-font);
	color: var(--tx);
}

/* ---- Tile CARTO dark, tinte verso il blu del brand ---------------------- */
.cc-map .leaflet-tile {
	filter: brightness(2.0) contrast(1.0) sepia(0.42) hue-rotate(186deg) saturate(1.5);
}

/* ---- Marker (divIcon + pallino) ----------------------------------------- */
.cc-map .cc-marker {
	background: transparent;
	border: 0;
}

.cc-dot {
	display: block;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--acc);
	border: 2px solid #fff;
	box-shadow: 0 0 0 5px var(--acc-soft), 0 0 18px 3px rgba(235, 103, 38, .55);
}

/* Versione piccola per la legenda. */
.cc-dot.sm {
	width: 10px;
	height: 10px;
	border-width: 1.5px;
	box-shadow: 0 0 0 3px var(--acc-soft), 0 0 10px 2px rgba(235, 103, 38, .45);
}

/* ---- Tooltip permanente (nome sede) ------------------------------------- */
.cc-map .leaflet-tooltip.cc-tip {
	background: rgba(14, 16, 20, .92);
	color: var(--tx);
	border: 1px solid var(--line-2);
	border-radius: 7px;
	padding: 3px 8px;
	font-family: var(--cc-mono);
	font-size: 10.5px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .1em;
	white-space: nowrap;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .45);
}

/* Nasconde la freccia del tooltip. */
.cc-map .leaflet-tooltip.cc-tip::before {
	display: none;
}

/* ---- Popup -------------------------------------------------------------- */
.cc-map .leaflet-popup.cc-pop .leaflet-popup-content-wrapper {
	background: rgba(23, 27, 33, .97);
	color: var(--tx);
	border: 1px solid var(--line-2);
	border-radius: 12px;
	box-shadow: 0 18px 50px rgba(0, 0, 0, .55);
}

.cc-map .leaflet-popup.cc-pop .leaflet-popup-tip {
	background: rgba(23, 27, 33, .97);
	border: 1px solid var(--line-2);
	box-shadow: none;
}

.cc-map .leaflet-popup.cc-pop .leaflet-popup-content {
	margin: 13px 15px;
	font-family: var(--cc-font);
	line-height: 1.5;
}

.cc-pop h5 {
	margin: 0 0 6px;
	padding: 0;
	font-family: var(--cc-mono);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--acc-2);
}

.cc-pop .a {
	color: var(--tx);
	font-size: 13.5px;
	line-height: 1.45;
}

.cc-pop .c {
	margin-top: 3px;
	font-family: var(--cc-mono);
	font-size: 11px;
	color: var(--tx-dim);
}

.cc-pop .g {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
	color: var(--acc-2);
	font-size: 12.5px;
	font-weight: 600;
	text-decoration: none;
}

.cc-pop .g:hover {
	text-decoration: underline;
}

.cc-pop .g svg {
	width: 15px;
	height: 15px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.9;
}

.cc-map .leaflet-popup.cc-pop a.leaflet-popup-close-button {
	color: var(--tx-dim);
	padding: 6px 8px 0 0;
}

.cc-map .leaflet-popup.cc-pop a.leaflet-popup-close-button:hover {
	color: var(--tx);
}

/* ---- Controlli (zoom / scala / attribuzione) in dark -------------------- */
.cc-map .leaflet-bar {
	border: 1px solid var(--line-2);
	box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
}

.cc-map .leaflet-bar a {
	background: rgba(14, 16, 20, .85);
	color: var(--tx);
	border-bottom: 1px solid var(--line);
}

.cc-map .leaflet-bar a:hover {
	background: var(--panel-2);
	color: var(--acc-2);
}

.cc-map .leaflet-control-attribution {
	background: rgba(14, 16, 20, .72);
	color: var(--tx-dim);
	border-top-left-radius: 6px;
	padding: 2px 7px;
	font-size: 10.5px;
}

.cc-map .leaflet-control-attribution a {
	color: var(--tx-mut);
}

.cc-map .leaflet-control-scale-line {
	background: rgba(14, 16, 20, .72);
	color: var(--tx-mut);
	border: 1px solid var(--line-2);
	border-top: none;
	text-shadow: none;
}

/* ---- Legenda overlay (in alto a sinistra) ------------------------------- */
.cc-legend {
	pointer-events: none;
	background: rgba(14, 16, 20, .72);
	border: 1px solid var(--line-2);
	border-radius: 10px;
	padding: 9px 11px;
	color: var(--tx);
	box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
	backdrop-filter: blur(2px);
}

.cc-legend .t {
	font-family: var(--cc-mono);
	font-size: 10px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--tx-mut);
	margin-bottom: 7px;
}

.cc-legend .r {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 4px;
	font-size: 12.5px;
	color: var(--tx);
}