/* ---------------------------------------------------------------
   Die Seitenspalte auf den Guide- und Kampagnenseiten

   Zwei Kaesten unter den Veranstaltungen, im selben Zuschnitt wie
   das Firmen-Trio: weisser Grund, feine Linie, sechs Pixel Radius.
   Die Spalte soll wie eine Spalte aussehen und nicht wie drei
   Elemente aus drei Bauteilen.
   --------------------------------------------------------------- */
.fa-spalte-kasten {
	background: var(--fa-karte);
	border: 1px solid var(--fa-linie);
	border-radius: 6px;
	padding: 16px 18px 18px;
	margin-top: 20px;
}

.fa-spalte-titel {
	font-family: "Archivo", "Segoe UI", system-ui, sans-serif;
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -.01em;
	line-height: 1.25;
	margin: 0 0 10px;
}

/* --- WhatsApp --------------------------------------------------
   Gruen nur im Zeichen und im Knopf. Ein durchgehend gruener Kasten
   waere in einer Spalte aus weissen Kaesten ein Fremdkoerper - und
   die Hausfarben sind Papier, Tinte und Gelb.

   #1D8B4E ist dasselbe Gruen wie im Band unter dem Kopf, nicht das
   grelle Marken-Gruen von WhatsApp: Zwei Toene fuer dieselbe Sache
   auf derselben Seite sind ein Fehler, und der dunklere traegt
   weissen Text bei ausreichendem Kontrast.
   --------------------------------------------------------------- */
.fa-spalte-wa-zeichen {
	display: block;
	width: 26px;
	height: 26px;
	margin-bottom: 8px;
	color: #1D8B4E;
}
.fa-spalte-wa-zeichen svg { width: 100%; height: 100%; display: block; }

.fa-spalte-wa-satz {
	margin: 0 0 13px;
	color: var(--fa-text-sekund);
	font-size: 14.5px;
	line-height: 1.5;
}

.fa-spalte-wa-knopf {
	display: inline-block;
	padding: 8px 16px;
	border-radius: 999px;
	background: #1D8B4E;
	color: #FFFFFF;
	font-family: "Archivo", "Segoe UI", system-ui, sans-serif;
	font-size: 14.5px;
	font-weight: 700;
	text-decoration: none;
}
.fa-spalte-wa-knopf:hover,
.fa-spalte-wa-knopf:focus-visible {
	background: #166E3D;
	color: #FFFFFF;
}

/* --- Neueste Nachrichten ---------------------------------------
   Datum und Titel, kein Bild. Fuenf Vorschauen mit Bild waeren in
   einer 360 Pixel breiten Spalte ein zweiter Aufmacher neben dem
   eigentlichen Inhalt.
   --------------------------------------------------------------- */
.fa-spalte-liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.fa-spalte-liste li + li {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid var(--fa-linie);
}

.fa-spalte-liste a {
	display: block;
	text-decoration: none;
	color: var(--fa-tinte);
}

.fa-spalte-datum {
	display: block;
	font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
	font-size: 11px;
	letter-spacing: .04em;
	color: var(--fa-text-sekund);
	margin-bottom: 2px;
}

.fa-spalte-name {
	display: block;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
}
.fa-spalte-liste a:hover .fa-spalte-name,
.fa-spalte-liste a:focus-visible .fa-spalte-name { text-decoration: underline; }

/* --- Schmale Schirme -------------------------------------------
   theme.css blendet die Seitenspalte auf dem Telefon aus, weil ihr
   einziger Inhalt - die Termine - dort mitten in der Beitragsliste
   steht. Auf den Guide-Seiten gibt es diese Liste nicht, und die
   Kaesten haetten sonst gar keinen Ort. Sie laufen deshalb unter
   dem Inhalt weiter.
   --------------------------------------------------------------- */
@media (max-width: 767px) {
	body.post-type-archive-firma #right-sidebar,
	body.tax-kampagne #right-sidebar {
		display: block;
		margin-top: 26px;
	}

	body.post-type-archive-firma .inside-right-sidebar,
	body.tax-kampagne .inside-right-sidebar {
		padding: 0 var(--fa-rand);
	}
}