/* =========================================================
   Kennzeichnung von KI-Bildern in Hintergruenden

   Gesteuert wird am Bild in der Mediathek. Die Klassen setzt
   das Theme selbst (inc/ai-label.php), in Layouts muss nichts
   eingetragen werden.

   hof-ai                 Container enthaelt ein gekennzeichnetes Bild
   hof-ai-lg-<zustand>    Desktop
   hof-ai-md-<zustand>    bis 1024px (Avada-Stufe "medium")
   hof-ai-sm-<zustand>    bis 640px  (Avada-Stufe "small")

   <zustand> ist generated, edited oder none.

   Die Texte kommen als Variablen aus dem Plugin. Fehlen sie,
   weil die Ausgabe dort abgeschaltet ist, ist content ungueltig
   und es erscheint keine Marke.
   ========================================================= */


/* Bezugspunkt fuer die Marke. Avada-Container sind bereits
   relativ positioniert (gemessen); :where() hat Spezifitaet 0
   und ueberstimmt nichts, was Avada selbst setzt. */
:where( .hof-ai ) {
	position: relative;
}


/* Die Marke: klein, unten rechts, halbtransparent.

   Weiss auf rgba(18,16,10,.6) ergibt selbst ueber einem sehr
   hellen Motiv noch etwa 5,9:1 Kontrast. Zurueckhaltend, aber
   lesbar.

   Ohne content wird das Pseudo-Element nicht erzeugt. Diese
   Regel legt deshalb nur das Aussehen fest; ob die Marke
   erscheint, entscheiden die Regeln darunter. */
.hof-ai::after,
.fusion-fullwidth.hof-cat-hero::after {
	position: absolute;
	right: 12px;
	bottom: 12px;
	z-index: 3;
	display: block;
	max-width: calc(100% - 24px);
	padding: 3px 7px;
	border-radius: 2px;
	background: rgba(18, 16, 10, 0.6);
	color: #fff;
	font-family: var(--h3_typography-font-family, sans-serif);
	font-size: 11px;
	font-weight: 400;
	font-style: normal;
	line-height: 1.4;
	letter-spacing: 0.02em;
	text-transform: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	pointer-events: none;
}


/* Desktop */
.hof-ai-lg-generated::after {
	content: var(--hof-ai-label-generated);
}

.hof-ai-lg-edited::after {
	content: var(--hof-ai-label-edited);
}


/* Tablet: eigenes Bild moeglich, daher neu entscheiden */
@media only screen and (max-width: 1024px) {

	.hof-ai-md-generated::after {
		content: var(--hof-ai-label-generated);
	}

	.hof-ai-md-edited::after {
		content: var(--hof-ai-label-edited);
	}

	.hof-ai-md-none::after {
		content: none;
	}
}


/* Smartphone: kleinere Marke, eigenes Bild moeglich */
@media only screen and (max-width: 640px) {

	.hof-ai::after,
	.fusion-fullwidth.hof-cat-hero::after {
		right: 8px;
		bottom: 8px;
		max-width: calc(100% - 16px);
		font-size: 10px;
	}

	.hof-ai-sm-generated::after {
		content: var(--hof-ai-label-generated);
	}

	.hof-ai-sm-edited::after {
		content: var(--hof-ai-label-edited);
	}

	.hof-ai-sm-none::after {
		content: none;
	}
}