/* Bild-KI-Kennzeichnung – Frontend */

.wpbkk {
	position: relative;
	display: inline-block;
	max-width: 100%;
	vertical-align: top;
	line-height: 0;
}

.wpbkk > img {
	display: block;
}

/* Block mit CSS-Hintergrundbild: Bezugsrahmen für das Badge. */
.wpbkk-bg {
	position: relative;
}

/*
 * Beitragsbild-Block setzt width:100% am <img>;
 * ein inline-block-Rahmen würde auf die Bildbreite schrumpfen.
 */
.wp-block-post-featured-image .wpbkk {
	display: block;
}

/* Beschnittene Galerien: der Rahmen muss die Kachel ausfüllen. */
.wp-block-gallery.is-cropped .wpbkk,
.wp-block-gallery.has-nested-images figure.wp-block-image .wpbkk {
	display: flex;
	flex: 1 0 0%;
	width: 100%;
	height: 100%;
}

.wpbkk__badge {
	position: absolute;
	z-index: 2;
	padding: 0.2em 0.5em;
	border-radius: 3px;
	background: var(--wpbkk-bg, rgba(0, 0, 0, 0.72));
	color: var(--wpbkk-color, #fff);
	font-family: var(--wpbkk-font, system-ui, sans-serif);
	font-size: var(--wpbkk-size, 12px);
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.02em;
	pointer-events: none;
	white-space: nowrap;
}

/* Positionen: Abstand 8px vom Rand, Mitte über transform. */
.wpbkk__badge.wpbkk--top-left,
.wpbkk__badge.wpbkk--top-center,
.wpbkk__badge.wpbkk--top-right {
	top: 8px;
}

.wpbkk__badge.wpbkk--bottom-left,
.wpbkk__badge.wpbkk--bottom-center,
.wpbkk__badge.wpbkk--bottom-right {
	bottom: 8px;
}

.wpbkk__badge.wpbkk--top-left,
.wpbkk__badge.wpbkk--center-left,
.wpbkk__badge.wpbkk--bottom-left {
	left: 8px;
}

.wpbkk__badge.wpbkk--top-right,
.wpbkk__badge.wpbkk--center-right,
.wpbkk__badge.wpbkk--bottom-right {
	right: 8px;
}

.wpbkk__badge.wpbkk--top-center,
.wpbkk__badge.wpbkk--bottom-center {
	left: 50%;
	transform: translateX(-50%);
}

.wpbkk__badge.wpbkk--center-left,
.wpbkk__badge.wpbkk--center-right {
	top: 50%;
	transform: translateY(-50%);
}

.wpbkk__badge.wpbkk--center {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* Vorschau auf der Einstellungsseite. */
.wpbkk-preview .wpbkk-preview__image {
	display: block;
	width: 320px;
	max-width: 100%;
	height: 180px;
	border-radius: 4px;
	background: linear-gradient(135deg, #f6d365 0%, #fda085 45%, #5b86e5 100%);
}

.wpbkk-caption-note {
	font-size: 0.85em;
	opacity: 0.8;
}

/* Beitragshinweis */
.wpbkk-post-notice {
	display: flex;
	gap: 0.6em;
	align-items: flex-start;
	margin: 1.5em 0;
	color: var(--wpbkk-notice-color, inherit);
	font-family: var(--wpbkk-notice-font, inherit);
	font-size: var(--wpbkk-notice-size, 0.9em);
	line-height: 1.5;
}

.wpbkk-post-notice--box {
	padding: 0.75em 1em;
	border: 1px solid currentcolor;
	border-radius: 4px;
	background: var(--wpbkk-notice-bg, transparent);
}

.wpbkk-post-notice--bar {
	padding: 0.75em 1em;
	border-left: 4px solid currentcolor;
	background: var(--wpbkk-notice-bg, transparent);
}

.wpbkk-post-notice--text {
	font-style: italic;
}

/* Ausrichtung: Text und (bei Leiste) Symbol gemeinsam verschieben. */
.wpbkk-post-notice.wpbkk-align-left {
	justify-content: flex-start;
	text-align: left;
}

.wpbkk-post-notice.wpbkk-align-center {
	justify-content: center;
	text-align: center;
}

.wpbkk-post-notice.wpbkk-align-right {
	justify-content: flex-end;
	text-align: right;
}

.wpbkk-post-notice__icon {
	flex: none;
	width: 1.3em;
	height: 1.3em;
}
