/*
Theme Name:  Smartartist
Theme URI:   https://smartist-academy.de/
Author:      Smart Artist
Description: Block-Theme für die Künstlerseiten der Smartist Academy. Ersetzt die
             Kombination aus OceanWP/Hello Elementor + Elementor Pro durch WordPress-Core
             mit Block-Patterns und einer Style-Variation je Künstlerin bzw. Künstler.
Version:     0.2.0
Requires at least: 6.5
Tested up to:      7.1
Requires PHP:      8.2
Text Domain: smartartist
License:     GPL-2.0-or-later
*/

/*
 * Grundgestaltung 2027 (Designvorschlag, design/vorschlag-2027/).
 * Farben, Schriften und Abstände stehen in theme.json; hier nur, was theme.json
 * nicht ausdrücken kann. Je Künstlerin ändert die Style-Variation nur den Akzent.
 */

/* Links folgen der Textfarbe, die Unterstreichung trägt die Markierung. */
a:where(:not(.wp-element-button)):where(:not(.wp-block-button__link)) {
	text-underline-offset: 0.18em;
	text-decoration-thickness: 1px;
}
.has-text-color a:where(:not(.wp-element-button)):where(:not(.wp-block-button__link)) {
	color: currentColor;
}

/* Knöpfe: Pille. Umriss-Variante wie im Prototyp. */
.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 1px solid currentColor;
	background: transparent;
	color: var(--wp--preset--color--tinte);
	padding: 13px 25px;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--tinte);
	color: var(--wp--preset--color--grund);
}
.has-tinte-background-color .wp-block-button.is-style-outline > .wp-block-button__link {
	color: var(--wp--preset--color--grund);
}
.wp-block-button.is-style-akzent > .wp-block-button__link,
.wp-block-button__link.has-akzent-background-color:hover {
	background: var(--wp--preset--color--akzent);
	color: var(--wp--preset--color--akzent-kontrast);
}

/* Kopfzeile */
.sa-kopf {
	gap: 16px 40px;
}
.sa-kopf .wp-block-navigation {
	gap: 8px 32px;
}
.sa-kopf .wp-block-navigation a {
	text-decoration: none;
}
.sa-kopf .wp-block-navigation .current-menu-item > a,
.sa-kopf .wp-block-navigation [aria-current="page"] {
	text-decoration: underline;
	text-underline-offset: 6px;
}
.sa-kopf .wp-block-site-logo img {
	max-height: 56px;
	width: auto;
}
.sa-kopf .wp-block-button__link {
	padding: 10px 20px;
	font-size: 0.9375rem;
}

/* Kleine Überzeile in Versalien */
.sa-ueberzeile {
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

/* Werke unbeschnitten: kein erzwungenes Seitenverhältnis */
.sa-werk-bild img {
	width: 100%;
	height: auto;
	object-fit: contain;
}
.sa-werk-buehne {
	display: flex;
	justify-content: center;
}
.sa-werk-buehne img {
	box-shadow: 0 18px 36px rgba(22, 22, 22, 0.18);
	max-height: 78vh;
	width: auto;
	max-width: 100%;
}

/* Dunkles Zitatband */
.sa-zitat .wp-block-column:first-child > p:first-child,
.sa-zitat > p:first-child {
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(1.875rem, 3.4vw, 2.875rem);
	line-height: 1.2;
}

/* Kunstwerk-Angaben als Liste wie im Prototyp */
.sa-angaben {
	border-top: 1px solid var(--wp--preset--color--linie);
	padding-top: 20px;
}

/* Fußzeile */
.sa-fuss a {
	color: var(--wp--preset--color--gedaempft);
}

/* Handy: Kopfzeile umbrechen statt überlaufen, Bilder nie breiter als der Schirm. */
@media (max-width: 781px) {
	.sa-kopf {
		flex-wrap: wrap;
	}
	.sa-kopf .wp-block-buttons {
		display: none;
	}
}
img {
	max-width: 100%;
	height: auto;
}
.wp-site-blocks {
	overflow-x: clip;
}

/* Mit Logo kein zusätzlicher Name daneben */
.sa-kopf:has(.wp-block-site-logo img) .wp-block-site-title {
	display: none;
}

/* Farbige Bänder stoßen ohne hellen Spalt aneinander */
.wp-block-post-content > .alignfull.has-background + .alignfull.has-background {
	margin-block-start: 0;
}
.wp-block-post-content > .alignfull.has-background:last-child {
	margin-block-end: 0;
}

/* Spalten dürfen schrumpfen (sonst drücken breite Einbettungen die Seite auf). */
.wp-block-column {
	min-width: 0;
}

/* Gesperrte Formular-Einbettung (Consentum-Platzhalter) im Newsletter-Band:
   Das Seitenverhältnis des Originals ist für ein Formular zu flach. */
.sa-newsletter .cst-cb {
	aspect-ratio: auto !important;
	min-height: 160px;
	max-width: 100%;
}

/* Gesperrtes Video: Der Platzhalter nimmt selbst 16:9 ein, der leere
   Seitenverhältnis-Rahmen des Embed-Blocks entfällt (sonst große Lücke). */
.wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper:has(.cst-cb)::before {
	display: none;
}
.wp-block-embed .cst-cb {
	aspect-ratio: 16 / 9;
	max-width: 100%;
}