/* ==========================================================================
   The legal map and its colours: the state law pages and the homepage.
   Levels run from bright green (legal) to off-black (illegal).
   ========================================================================== */

.bud-legal,
.bud-home-legal {
	--legal-recreational: #3ef06e;
	--legal-medical: #1f9d4d;
	--legal-decriminalized: #1f9d4d;
	--legal-low-thc: #123b24;
	--legal-illegal: #070908;
	--legal-none: #2a2e2b;
}

.bud-legal-swatch {
	display: inline-block;
	flex: none;
	width: 14px;
	height: 14px;
	border-radius: 4px;
	box-shadow: inset 0 0 0 1px rgb(255 255 255 / 25%);
}

.bud-legal-swatch.is-recreational { background: var(--legal-recreational); }
.bud-legal-swatch.is-medical { background: var(--legal-medical); }
.bud-legal-swatch.is-decriminalized { background: repeating-linear-gradient(45deg, #1f9d4d 0 3px, #070908 3px 6px); }
.bud-legal-swatch.is-low-thc { background: var(--legal-low-thc); }
.bud-legal-swatch.is-illegal { background: var(--legal-illegal); }

/* Map */
.bud-legal-map-wrap {
	position: relative;
	min-width: 0;
}

.bud-legal-map {
	display: block;
	width: 100%;
	max-height: min(66vh, 560px);
}

.bud-map-state path,
.bud-map-state circle {
	stroke: #4a524c;
	stroke-width: 0.75;
	stroke-linejoin: round;
	transition: opacity 0.15s ease;
}

.bud-map-state.is-recreational { fill: var(--legal-recreational); }
.bud-map-state.is-medical { fill: var(--legal-medical); }
.bud-map-state.is-low-thc { fill: var(--legal-low-thc); }
.bud-map-state.is-illegal { fill: var(--legal-illegal); }
.bud-map-state.is-none { fill: var(--legal-none); }

a.bud-map-state:hover path,
a.bud-map-state:hover circle,
a.bud-map-state:focus-visible path,
a.bud-map-state:focus-visible circle {
	stroke: #fff;
	stroke-width: 2;
}

a.bud-map-state {
	outline: 0;
}

.bud-map-state.is-dimmed path,
.bud-map-state.is-dimmed circle {
	opacity: 0.18;
}

.bud-legal-tip {
	position: absolute;
	z-index: 2;
	padding: 0.35rem 0.6rem;
	border-radius: 8px;
	background: #f3f1e8;
	font-size: 0.85rem;
	font-weight: 700;
	white-space: nowrap;
	color: #101510;
	pointer-events: none;
}

.bud-legal-tip[hidden] {
	display: none;
}
