/**
 * Blockstile – gelten auf der Website und im Editor (Block auswählen → Stile).
 *
 * Gruppe:      Karte · Karte blau · Hinweis (Tabellen darin z. B. für Beiträge)
 * Bild:        Mit Schatten
 * Überschrift: Mit Brettkante
 * Liste:       Schritte (nummeriert)
 * Spalte:      Mitlaufend (bleibt am Computer beim Scrollen stehen)
 * Datei:       jeder Datei-Block als Download-Karte (PDF-Symbol bei .pdf)
 * Tabelle:     Terminplan (Datum | Termin) – auf der Website als Monatsliste (inc/termine.php)
 * Symbole:     zusätzliche CSS-Klasse an einer Gruppe (Block → Erweitert):
 *              bsv-symbol-ort · bsv-symbol-parken · bsv-symbol-bahn · bsv-symbol-bus ·
 *              bsv-symbol-uhr · bsv-symbol-kalender · bsv-symbol-bauer
 *              (gleiche Symbole wie im Lageplan der Anfahrt)
 */

/* ---------- Gruppe: Karte (weiß, blaue Oberkante) ---------- */
.wp-block-group.is-style-bsv-karte {
	box-sizing: border-box;
	padding: clamp(1.25rem, 0.95rem + 1vw, 1.75rem);
	border: 1px solid var(--bsv-line);
	border-top: 4px solid var(--bsv-blue);
	border-radius: var(--bsv-radius);
	background: var(--bsv-white);
	color: var(--bsv-ink);
}

/* ---------- Gruppe: Karte blau (wie die Vereinskarte im Impressum) ---------- */
.wp-block-group.is-style-bsv-karte-blau {
	box-sizing: border-box;
	padding: clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem);
	border-radius: var(--bsv-radius);
	background: var(--bsv-blue);
	color: var(--bsv-white);
}

.wp-block-group.is-style-bsv-karte-blau :is(h1, h2, h3, h4, h5, h6) {
	color: var(--bsv-white);
}

.wp-block-group.is-style-bsv-karte-blau a:not(.wp-block-button__link),
.wp-block-group.is-style-bsv-karte-blau a:not(.wp-block-button__link):hover {
	color: var(--bsv-white);
}

.wp-block-group.is-style-bsv-karte-blau .wp-block-button__link:not(.has-background) {
	border-color: var(--bsv-white);
	background: var(--bsv-white);
	color: var(--bsv-blue);
}

.wp-block-group.is-style-bsv-karte-blau .wp-block-button__link:not(.has-background):hover {
	border-color: var(--bsv-ivory);
	background: var(--bsv-ivory);
	color: var(--bsv-black);
}

.wp-block-group.is-style-bsv-karte-blau .is-style-outline > .wp-block-button__link:not(.has-background) {
	border-color: rgba(255, 255, 255, 0.7);
	background: transparent;
	color: var(--bsv-white);
}

.wp-block-group.is-style-bsv-karte-blau .is-style-outline > .wp-block-button__link:not(.has-background):hover {
	border-color: var(--bsv-white);
	background: rgba(255, 255, 255, 0.12);
	color: var(--bsv-white);
}

.wp-block-group.is-style-bsv-karte-blau .has-small-font-size {
	color: rgba(255, 255, 255, 0.86);
}

/* ---------- Gruppe: Hinweis (heller Kasten mit blauem Rand) ---------- */
.wp-block-group.is-style-bsv-hinweis {
	box-sizing: border-box;
	padding: clamp(1.25rem, 0.95rem + 1vw, 1.75rem) clamp(1.25rem, 0.9rem + 1.4vw, 2rem);
	border-left: 4px solid var(--bsv-blue);
	border-radius: 0 var(--bsv-radius) var(--bsv-radius) 0;
	background: var(--bsv-paper);
	color: var(--bsv-ink);
}

/* ---------- Gemeinsam für alle Kästen ---------- */
.wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-karte-blau, .is-style-bsv-hinweis) > * {
	margin-block: 0 0.85rem;
}

.wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-karte-blau, .is-style-bsv-hinweis) > :last-child {
	margin-bottom: 0;
}

.wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-karte-blau, .is-style-bsv-hinweis) > .wp-block-buttons {
	margin-top: 1.35rem;
}

.wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-karte-blau, .is-style-bsv-hinweis) > :is(h2, h3, h4) {
	margin-bottom: 0.6rem;
	line-height: 1.08;
}

.wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-karte-blau, .is-style-bsv-hinweis) > h2 {
	font-size: clamp(1.5rem, 1.3rem + 0.7vw, 1.875rem);
}

.wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-karte-blau, .is-style-bsv-hinweis) > h3 {
	font-size: clamp(1.25rem, 1.15rem + 0.35vw, 1.4375rem);
}

/* Buttons in Kästen: dichter beieinander, damit zwei nebeneinander auch aufs Handy passen */
.wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-karte-blau, .is-style-bsv-hinweis) .wp-block-buttons {
	gap: 0.6rem;
}

/* Hinweis in voller Breite: angenehme Zeilenlänge */
.wp-block-group.is-style-bsv-hinweis > p {
	max-width: 52rem;
}

/* Abstand zu den Nachbarblöcken, wenn ein Kasten direkt im Inhalt steht */
.entry-content > .wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-karte-blau, .is-style-bsv-hinweis) {
	margin-block: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem);
}

/* ---------- Symbole ---------- */
.wp-block-group:is(.bsv-symbol-ort, .bsv-symbol-parken, .bsv-symbol-bahn, .bsv-symbol-bus, .bsv-symbol-uhr, .bsv-symbol-kalender, .bsv-symbol-bauer)::before {
	content: "";
	display: block;
	width: 2.75rem;
	height: 2.75rem;
	margin-bottom: 1rem;
	background: center / contain no-repeat;
}

.wp-block-group.bsv-symbol-ort::before {
	border-radius: 50%;
	background-image: url("../img/symbole/ort.svg");
	box-shadow: 0 0 0 1px var(--bsv-line);
}

.wp-block-group.is-style-bsv-karte-blau.bsv-symbol-ort::before {
	box-shadow: 0 6px 16px -6px rgba(0, 20, 50, 0.5);
}

.wp-block-group.bsv-symbol-parken::before {
	background-image: url("../img/symbole/parken.svg");
}

.wp-block-group.bsv-symbol-bahn::before {
	background-image: url("../img/symbole/bahn.svg");
}

.wp-block-group.bsv-symbol-bus::before {
	background-image: url("../img/symbole/bus.svg");
}

.wp-block-group.bsv-symbol-uhr::before {
	background-image: url("../img/symbole/uhr.svg");
}

.wp-block-group.bsv-symbol-kalender::before {
	background-image: url("../img/symbole/kalender.svg");
}

.wp-block-group.bsv-symbol-bauer::before {
	border-radius: 50%;
	background-image: url("../img/symbole/bauer.svg");
	box-shadow: 0 0 0 1px var(--bsv-line);
}

/* ---------- Tabelle in der blauen Karte (z. B. Beiträge) ---------- */
.wp-block-group.is-style-bsv-karte-blau .wp-block-table {
	margin: 0 0 1rem;
	overflow: visible;
}

.wp-block-group.is-style-bsv-karte-blau .wp-block-table table {
	width: 100%;
	border: 0;
	border-collapse: collapse;
	background: transparent;
	color: var(--bsv-white);
	font-size: 1.0625rem;
}

.wp-block-group.is-style-bsv-karte-blau .wp-block-table :is(th, td) {
	padding: 0.7rem 0;
	border: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.28);
	background: transparent !important;
	color: var(--bsv-white);
	vertical-align: baseline;
}

.wp-block-group.is-style-bsv-karte-blau .wp-block-table tr,
.wp-block-group.is-style-bsv-karte-blau .wp-block-table tr:hover {
	background: transparent !important;
}

.wp-block-group.is-style-bsv-karte-blau .wp-block-table tr:last-child :is(th, td) {
	border-bottom: 0;
}

.wp-block-group.is-style-bsv-karte-blau .wp-block-table td + td {
	padding-left: 1rem;
	text-align: right;
	font-weight: 800;
	white-space: nowrap;
}

.wp-block-group.is-style-bsv-karte-blau .wp-block-table td small {
	display: block;
	color: rgba(255, 255, 255, 0.8);
	font-size: 0.875rem;
	font-weight: 400;
}

/* ---------- Liste: Schritte (nummerierte Kästchen mit Verbindungslinie) ---------- */
ol.is-style-bsv-schritte {
	margin: 1.75rem 0;
	padding: 0;
	list-style: none;
	counter-reset: bsv-schritt;
}

ol.is-style-bsv-schritte > li {
	position: relative;
	min-height: 2.5rem;
	margin: 0;
	padding: 0.2rem 0 1.4rem 3.5rem;
	counter-increment: bsv-schritt;
}

ol.is-style-bsv-schritte > li:last-child {
	padding-bottom: 0;
}

ol.is-style-bsv-schritte > li::before {
	content: counter(bsv-schritt);
	position: absolute;
	top: 0;
	left: 0;
	display: grid;
	place-items: center;
	width: 2.4rem;
	height: 2.4rem;
	border-radius: 6px;
	background: var(--bsv-blue);
	color: var(--bsv-white);
	font-size: 1.25rem;
	font-stretch: 74%;
	font-weight: 800;
	line-height: 1;
}

ol.is-style-bsv-schritte > li:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 2.75rem;
	bottom: 0.35rem;
	left: calc(1.2rem - 1px);
	width: 2px;
	background: var(--bsv-line);
}

ol.is-style-bsv-schritte > li::marker {
	content: none;
}

/* ---------- Datei: Download-Karte mit Symbol ---------- */
.wp-block-file {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
	margin: 0 0 1rem;
	padding: 0.85rem 1rem;
	border: 1px solid var(--bsv-line);
	border-radius: var(--bsv-radius);
	background: var(--bsv-white);
}

.wp-block-file > a:not(.wp-block-file__button) {
	display: flex;
	flex: 1 1 9rem;
	align-items: center;
	gap: 0.8rem;
	min-width: 0;
	color: var(--bsv-ink);
	font-weight: 700;
	line-height: 1.3;
	text-decoration: none;
	overflow-wrap: anywhere;
}

.wp-block-file > a:not(.wp-block-file__button)::before {
	content: "";
	flex: none;
	width: 2rem;
	height: 2.45rem;
	background: url("../img/symbole/datei.svg") center / contain no-repeat;
}

.wp-block-file > a[href$=".pdf" i]:not(.wp-block-file__button)::before {
	background-image: url("../img/symbole/pdf.svg");
}

.wp-block-file > a:not(.wp-block-file__button):hover {
	color: var(--bsv-blue-deep);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.wp-block-file .wp-block-file__button {
	min-height: 2.5rem;
	margin: 0 0 0 auto;
	padding: 0.45rem 0.9rem;
	border: 2px solid var(--bsv-blue);
	border-radius: 4px;
	background: var(--bsv-blue);
	color: var(--bsv-white);
	font-size: 0.9375rem;
	font-weight: 700;
	text-decoration: none;
}

.wp-block-file .wp-block-file__button:hover {
	border-color: var(--bsv-blue-deep);
	background: var(--bsv-blue-deep);
	color: var(--bsv-white);
}

.wp-block-file .wp-block-file__embed {
	flex: 1 1 100%;
	margin: 0.5rem 0 0;
}

/* In Kästen ohne eigenen Rahmen */
.wp-block-group:is(.is-style-bsv-karte, .is-style-bsv-hinweis) .wp-block-file {
	margin-bottom: 0.75rem;
	background: var(--bsv-paper);
	border-color: transparent;
}

.wp-block-group.is-style-bsv-hinweis .wp-block-file {
	background: var(--bsv-white);
}

/* ---------- Spalte: Mitlaufend (z. B. Unterlagen neben einem langen Formular) ---------- */
/* nur, wenn der Bildschirm hoch genug ist – sonst wäre das Ende der Spalte nicht erreichbar */
@media (min-width: 782px) and (min-height: 800px) {
	.wp-block-columns > .wp-block-column.is-style-bsv-mitlaufend {
		position: sticky;
		top: calc(var(--bsv-header-h, 68px) + 1.5rem);
		align-self: flex-start;
	}
}

.wp-block-column.is-style-bsv-mitlaufend > .wp-block-group + .wp-block-group {
	margin-top: 1.25rem;
}

/* ---------- Tabelle: Terminplan (im Editor kompakt; auf der Website als Monatsliste) ---------- */
.wp-block-table.is-style-bsv-termine table {
	border-collapse: collapse;
	font-size: 0.9375rem;
}

.wp-block-table.is-style-bsv-termine :is(th, td) {
	padding: 0.35rem 0.6rem;
	border: 1px solid var(--bsv-line);
	text-align: left;
	vertical-align: top;
}

.wp-block-table.is-style-bsv-termine :is(th, td):first-child {
	width: 8.5em;
	white-space: nowrap;
}

.wp-block-table.is-style-bsv-termine thead :is(th, td) {
	border-color: var(--bsv-black);
	background: var(--bsv-black);
	color: var(--bsv-white);
}

.wp-block-table.is-style-bsv-termine tbody tr:nth-child(even) {
	background: var(--bsv-paper);
}

/* ---------- Bild: Mit Schatten ---------- */
.wp-block-image.is-style-bsv-schatten img {
	border-radius: var(--bsv-radius);
	box-shadow: 0 1px 2px rgba(5, 14, 17, 0.08), 0 24px 48px -24px rgba(0, 40, 90, 0.5);
}

.wp-block-image.is-style-bsv-schatten figcaption {
	margin-top: 0.85rem;
	text-align: center;
}

/* ---------- Überschrift: Mit Brettkante ---------- */
.is-style-bsv-brettkante::before {
	content: "";
	display: block;
	width: 48px;
	height: 12px;
	margin-bottom: 1rem;
	background: conic-gradient(var(--bsv-black) 25%, var(--bsv-ivory) 0 50%, var(--bsv-black) 0 75%, var(--bsv-ivory) 0) 0 0 / 12px 12px;
}

.has-text-align-center.is-style-bsv-brettkante::before {
	margin-inline: auto;
}

.entry-content > .is-style-bsv-brettkante {
	margin-top: clamp(3rem, 2.4rem + 2vw, 4.5rem);
	margin-bottom: 1.5rem;
}

/* Breite Spalten ohne doppelten Abstand vor dem nächsten Abschnitt */
.entry-content > .wp-block-columns.alignwide {
	margin-bottom: 0;
}

/* Aufeinanderfolgende breite Abschnitte (ohne Überschriften dazwischen) mit Luft */
.entry-content > .alignwide:not(.wp-block-heading) + .alignwide:not(.wp-block-heading) {
	margin-top: clamp(2rem, 1.6rem + 1.4vw, 3rem);
}
