/* SocMap Seite — Bundesland-Choropleth + Register. */

.socmap-page__controls {
	display: flex; gap: var(--s-4); align-items: center;
	padding: var(--s-3) var(--s-6);
	border-bottom: 1px solid var(--line-2);
	background: var(--paper-2);
	font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .08em;
	color: var(--muted);
}
.socmap-page__controls input {
	border: 1px solid var(--line-2); background: var(--paper);
	color: var(--fg); padding: var(--s-1) var(--s-2);
	font: inherit; font-size: var(--fs-sm);
	text-transform: none; letter-spacing: 0; min-width: 240px;
}

#socmap-map { padding: var(--s-6); max-width: var(--content-max); margin: 0 auto; }

/* Karte */
.bl-map__wrap { margin: 0 auto var(--s-6); }
.bl-map__inner {
	background: var(--paper-2);
	border: 1px solid var(--line-2);
	padding: var(--s-4);
	display: flex; justify-content: center;
}
.bl-map { width: 100%; max-width: 640px; height: auto; }
.bl-path { cursor: pointer; outline: none; stroke: var(--line-2); fill-rule: evenodd; }
.bl-path:hover { stroke: var(--signal); stroke-width: 1.6; }
.bl-path:focus-visible { stroke: var(--signal); stroke-width: 2; }
.bl-path.is-active { stroke: var(--signal); stroke-width: 2; }
.bl-label__code {
	font-family: var(--font); font-size: 10px; fill: var(--muted); font-weight: 500;
	letter-spacing: .06em; text-transform: uppercase;
}
.bl-label text { fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; }
.bl-label__num {
	font-family: var(--font); fill: var(--ink); font-weight: 500;
	font-variant-numeric: tabular-nums;
}

.bl-legend {
	display: flex; justify-content: space-between; align-items: center;
	margin-top: var(--s-3); font-size: var(--fs-xxs);
	color: var(--muted); text-transform: uppercase; letter-spacing: .08em;
}
.bl-legend__scale { display: inline-flex; align-items: center; gap: var(--s-1); }
.bl-legend__step { display: inline-block; width: 24px; height: 10px; border: 1px solid var(--line-2); }

/* Register */
.bl-detail__hint {
	font-size: var(--fs-xxs); color: var(--muted); text-transform: uppercase;
	letter-spacing: .08em; margin: 0 0 var(--s-3);
}
.bl-table {
	width: 100%; border-collapse: separate; border-spacing: 0;
	font-size: var(--fs-sm);
	border: 1px solid var(--line-2);
	background: var(--paper);
}
.bl-table thead th {
	background: var(--paper-2); text-align: left;
	font-size: var(--fs-xxs); letter-spacing: .1em; text-transform: uppercase;
	padding: var(--s-2) var(--s-3);
	border-bottom: 1px solid var(--signal); color: var(--muted); font-weight: 500;
}
.bl-table thead th.num { text-align: right; }
.bl-table tbody td {
	padding: var(--s-2) var(--s-3);
	border-bottom: 1px solid var(--line); vertical-align: top;
}
.bl-table tbody td.num { text-align: right; color: var(--fg); }
.bl-table tbody tr:nth-child(even) td { background: var(--soft); }
.bl-table tbody tr:hover td { background: var(--paper-3); cursor: pointer; }
.bl-table .col-idx { width: 44px; text-align: right; color: var(--muted); font-size: var(--fs-xxs); }
.bl-table a { color: var(--fg); text-decoration: none; border-bottom: 1px solid var(--line-2); }
.bl-table a:hover { color: var(--signal); border-color: var(--signal); }

/* Ausland */
.bl-foreign { margin-top: var(--s-6); border-top: 1px solid var(--line-2); padding-top: var(--s-4); }
.bl-foreign__title {
	font-size: var(--fs-md); margin: 0 0 var(--s-3);
	text-transform: uppercase; letter-spacing: .06em;
}
.bl-foreign__list {
	list-style: none; margin: 0; padding: 0;
	display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--s-1) var(--s-4);
	font-size: var(--fs-sm);
}
.bl-foreign__list li { padding: var(--s-1) 0; border-bottom: 1px solid var(--line); }
.bl-foreign__list a { color: var(--fg); text-decoration: none; }
.bl-foreign__list a:hover { color: var(--signal); }

/* Fokus-Ansicht */
.bl-focus { }
.bl-focus__head {
	display: flex; gap: var(--s-4); align-items: baseline; justify-content: space-between;
	padding: var(--s-3) 0; border-bottom: 1px solid var(--line-2);
	margin-bottom: var(--s-3);
}
.bl-focus__code {
	display: inline-block; padding: 2px 6px; margin-right: var(--s-2);
	border: 1px solid var(--signal); color: var(--signal);
	font-weight: 600; letter-spacing: .06em;
}
.bl-focus__reset {
	appearance: none; border: 1px solid var(--line-2); background: transparent;
	color: var(--fg); padding: var(--s-1) var(--s-3);
	font: inherit; font-size: var(--fs-xxs); text-transform: uppercase; letter-spacing: .08em;
	cursor: pointer;
}
.bl-focus__reset:hover { border-color: var(--signal); color: var(--signal); }
.bl-table--nested { border: 1px solid var(--line-2); }

@media (max-width: 767px) {
	.socmap-page__controls input { min-width: 160px; }
	#socmap-map { padding: var(--s-3); }
	.bl-map__inner { padding: var(--s-2); }
}