/* FGR AI Label – Basis-Styles für das Kennzeichnungs-Icon.
   Position/Abstand/Höhe kommen als CSS-Custom-Properties direkt vom jeweiligen
   Element (Inline-Style) – bewusst NICHT über wp_add_inline_style nachgeladen,
   da manche Cache-/Optimierungs-Plugins dynamisch angehängtes CSS filtern.

   Alle Layout-Eigenschaften des Icons selbst stehen mit !important: Themes/Page-
   Builder setzen auf Galerie-/Produktbildern oft eigene img{width:100%}-Regeln
   mit höherer Spezifität als unsere einfache Klasse – ohne !important würde das
   Icon dann auf die volle Bildbreite gestreckt (live beobachtet auf moai.style).

   z-index bewusst NIEDRIG (5): Das Icon soll nur über seinem eigenen Bild liegen,
   nicht über fixierten Headern/Sticky-Menüs/Modals der Seite. Ein absolut
   positioniertes Element malt ohnehin schon über normalen Inhalt, ein sehr hoher
   z-index wie 9999 würde dagegen auch bewusst darüberliegende Navigation
   durchbrechen (live beobachtet: Icon lag über dem Sticky-Menü auf moai.style).

   display:block statt inline-block: Viele Themes/Galerien setzen auf ihre <img>
   eine responsive img{width:100%}-Regel, damit das Bild sich am umgebenden
   Container (z.B. einer flexiblen Galerie-Zelle) ausrichtet. Ein inline-block-
   Wrapper hat aber standardmäßig KEINE eigene Breite - er schrumpft auf die
   Größe seines Inhalts (= das <img>), wodurch 100% vom <img> wieder nur 100%
   von dessen eigener Ausgangsgröße ergibt, statt sich am echten Container
   auszurichten. Ergebnis: das Bild bleibt kleiner als gleich große
   Geschwister-Bilder ohne Kennzeichnung (live beobachtet auf fernandfog.ie und
   moai.style, Produktgalerie-Thumbnails). display:block füllt dagegen per
   Default die volle Breite des eigentlichen Elternelements aus, genau wie ein
   <img> ohne Wrapper es auch täte. */

.fgr-ail-wrap {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    line-height: 0;
}

.fgr-ail-wrap > img:not(.fgr-ail-badge) {
    max-width: 100%;
    height: auto;
}

.fgr-ail-badge {
    position: absolute !important;
    top: var(--fgr-ail-top, auto) !important;
    right: var(--fgr-ail-right, auto) !important;
    bottom: var(--fgr-ail-bottom, auto) !important;
    left: var(--fgr-ail-left, auto) !important;
    height: var(--fgr-ail-h, 32px) !important;
    width: auto !important;
    max-width: none !important;
    max-height: 50px !important;
    object-fit: contain !important;
    pointer-events: none !important;
    z-index: 5 !important;
}

[style*="--fgr-ail-logo"]::after {
    content: "" !important;
    position: absolute !important;
    top: var(--fgr-ail-top, auto) !important;
    right: var(--fgr-ail-right, auto) !important;
    bottom: var(--fgr-ail-bottom, auto) !important;
    left: var(--fgr-ail-left, auto) !important;
    height: var(--fgr-ail-h, 32px) !important;
    width: var(--fgr-ail-w, auto) !important;
    max-height: 50px !important;
    background-image: var(--fgr-ail-logo) !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    pointer-events: none !important;
    z-index: 5 !important;
}