/*
 * Buchvorschau - Gestaltung.
 *
 * Auftrag: "Nutze das vorhandene Design der bisherigen Buchkarten." Diese
 * Datei setzt deshalb KEINE Kartengestaltung. Die Karte, ihre Abstaende,
 * Schriften und Farben kommen unveraendert vom Theme (Extendable) und von
 * WooCommerce. Hier stehen nur die beiden Teile, die es vorher nicht gab:
 * das Etikett und der deaktivierte Button. Beide uebernehmen die Farben des
 * Themes ueber currentColor - es entsteht keine neue Farbwelt.
 */

/* --- Etikett „Demnächst erhältlich" ---------------------------------- */

.kdpbd-bv-etikett {
	margin: 0.6em 0 0.2em;
	font-size: 0.85em;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	line-height: 1.3;
	display: inline-block;
	padding: 0.25em 0.7em;
	border: 1px solid currentColor;
	border-radius: 999px;
	opacity: 0.9;
}

/* --- Deaktivierter Button „Bald verfügbar" ---------------------------- */

.kdpbd-bv-buttonbereich {
	margin-top: 0.5em;
}

.kdpbd-bv-button {
	display: inline-block;
	padding: 0.7em 1.2em;
	border: 1px solid currentColor;
	border-radius: 4px;
	font-size: 0.95em;
	line-height: 1.2;
	text-align: center;
	opacity: 0.55;
	cursor: not-allowed;
	/* Weder Klick noch Ziehen noch Textauswahl - der Button ist wirklich
	   nur eine Beschriftung. */
	pointer-events: none;
	user-select: none;
}

/* --- Cover vollstaendig, niemals beschnitten -------------------------- */

/*
 * BUGFIX 1.0.1: In 1.0.0 stand hier ".kdpbd-bv-karte" - eine Klasse, die
 * das Plugin an keiner Stelle ausgegeben hat. Die Regel war damit
 * wirkungslos, obwohl sie als Sicherheitsnetz gegen Beschnitt gedacht war.
 *
 * Der Anker ist jetzt ".kdpbd-bv-cover". Dieser Container wird vom Plugin
 * SELBST um den Bildblock gelegt (KDPBD_BV_Ausgabe::block_inhalt()) - und
 * zwar ausschliesslich bei markierten Vorschauprodukten. Damit gilt die
 * Regel nachweislich genau dort und nirgendwo sonst. Auf Klassen des
 * Themes oder von WooCommerce stuetzt sich nichts mehr.
 *
 * Der Container selbst darf die Anordnung nicht veraendern - er ist nur
 * ein Anker. "display: contents" nimmt ihn aus dem Layout heraus: seine
 * Kinder verhalten sich, als gaebe es ihn nicht. Die Karte sieht dadurch
 * genauso aus wie ohne ihn.
 */
.kdpbd-bv-cover {
	display: contents;
}

/*
 * Das Theme gibt Produktbilder bereits mit object-fit: contain und einem
 * festen Seitenverhaeltnis aus - nachgemessen am 19.09.2026 an einer
 * bestehenden Buchkarte. Diese Regel haelt das fuer Vorschaukarten
 * ausdruecklich fest, damit ein hochformatiges Buchcover auch dann
 * vollstaendig sichtbar bleibt, wenn das Theme sein Verhaeltnis einmal
 * aendert. "contain" heisst: lieber Rand als Beschnitt.
 */
.kdpbd-bv-cover img {
	object-fit: contain;
	width: 100%;
	height: auto;
	max-width: 100%;
}

/* --- Drei Ausgabe-Buttons je Buch (NEU 1.1.0) ------------------------ */

/*
 * Die Buttons tragen die Button-Klassen des Themes
 * (wp-block-button__link wp-element-button) und sehen deshalb aus wie der
 * bisherige "Bei Amazon kaufen"-Button. Diese Regeln ordnen sie nur an:
 * untereinander, gleich breit - drei Buttons nebeneinander passen in eine
 * schmale Karte nicht.
 */
.kdpbd-bv-ausgaben {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.45em;
}

/*
 * Bewusst KEIN "width: 100%": Diese Angabe bleibt seit 1.0.1 dem
 * Cover-Anker vorbehalten (test-stylesheet.php prueft das). Die Buttons
 * werden stattdessen vom Flex-Container gestreckt (align-items: stretch).
 */
.kdpbd-bv-ausgabe {
	display: block;
	box-sizing: border-box;
	text-align: center;
}

/* 1.2.0: Die Regel ".kdpbd-bv-ausgabe--fehlt" ist entfallen - eine
   Ausgabe ohne Link wird nicht mehr ausgegeben (siehe ausgaben_html()). */

/* NEU 1.3.0: Ausgabe, die am Produkt ausdruecklich als "bald verfügbar"
   markiert ist - erkennbar nicht klickbar, im Umriss statt gefuellt. */
.kdpbd-bv-ausgabe--bald {
	padding: 0.6em 1em;
	border: 1px solid currentColor;
	border-radius: 4px;
	font-size: 0.9em;
	opacity: 0.6;
	cursor: not-allowed;
	pointer-events: none;
	user-select: none;
}

/* Hinweis im Erscheinungsbild des PartnerNet-Plugins (0.8em, 70 %). */
.kdpbd-bv-hinweis {
	display: block;
	margin: 0.1em 0 0;
	font-size: 0.8em;
	opacity: 0.7;
}

/* Einzelseite: nicht ueber die ganze Inhaltsbreite ziehen. */
.kdpbd-bv-ausgaben--einzeln {
	max-width: 22em;
}

/* --- Schmale Bildschirme --------------------------------------------- */

@media (max-width: 600px) {
	.kdpbd-bv-button {
		display: block;
		width: 100%;
	}
	.kdpbd-bv-etikett {
		font-size: 0.8em;
	}
}

/* --- Katalogkarte: Coverrahmen im Hochformat (NEU 1.2.0) ------------- */

/*
 * AUFTRAG (Sven, 22.09.2026): Bildrahmen an das Hochformat der Buchcover
 * anpassen, keine weissen Streifen links oder rechts, Cover einheitlich
 * gross, nichts Wichtiges abschneiden, nichts verzerren.
 *
 * WOHER DIE STREIFEN KAMEN (nachgemessen am 22.09.2026): Die zusaetzliche
 * CSS der Website (Website-Editor -> Stile) setzt fuer Produktbilder
 * "aspect-ratio: 3/4 !important; object-fit: contain !important" und einen
 * hellen Hintergrund rgb(239, 236, 227). Die Cover sind schmaler als 3:4
 * - "contain" fuellt die Breite deshalb mit diesem Hintergrund auf. Die
 * Bilddateien selbst haben KEINEN weissen Rand (Pixel fuer Pixel geprueft).
 *
 * DAS SEITENVERHAELTNIS 33:50 (= 0,66) - an allen sechs Covern ausgemessen:
 *   Asuka 0,703 · Wunsch 0,667 · Frohes Fest 0,626 · LKW 0,734 und 0,730 ·
 *   Passwort 0,667. Ein gemeinsamer Rahmen muss bei abweichenden Bildern
 *   etwas abschneiden. 0,66 ist das Verhaeltnis, bei dem an KEINEM Cover
 *   Titel, Autorname, Schrift oder Hauptmotiv beruehrt wird - geprueft an
 *   den Originaldateien. Bei exakt 2:3 wuerde "Frohes Fest" oben in die
 *   Tafel "Weihnachten ist auch nur ..." schneiden.
 *
 * object-position 50 % 30 %: Waagerecht mittig. Senkrecht wirkt der Wert nur
 *   bei Covern, die SCHMALER sind als der Rahmen (heute nur "Frohes Fest"):
 *   dort wird oben weniger abgeschnitten als unten, damit die Tafel oben
 *   vollstaendig bleibt (oben 25 px, unten 58 px von 1586 px).
 *
 * "cover" statt "contain": fuellt den Rahmen ohne Streifen und ohne
 *   Verzerrung - das Bild wird gleichmaessig skaliert.
 *
 * Die Regel gilt nur in Produktkarten (li.wc-block-product) und ist
 * spezifischer als die Regel der Website-CSS; die bleibt unangetastet.
 */
.wc-block-product .wc-block-components-product-image img,
.wc-block-product .wc-block-components-product-image--aspect-ratio-1-1 img {
	aspect-ratio: 33 / 50 !important;
	object-fit: cover !important;
	object-position: 50% 30% !important;
	background-color: transparent !important;
}