/* Non-image elements use the vector KMG marker as an unobtrusive overlay. */
.ai-generated:not(img):not(.elementor-widget-image):not(.et_pb_image),
.ai-modified:not(img):not(.elementor-widget-image):not(.et_pb_image) {
    position: relative;
}

.ai-generated:not(img):not(.elementor-widget-image):not(.et_pb_image)::after,
.ai-modified:not(img):not(.elementor-widget-image):not(.et_pb_image)::after {
    position: absolute;
    bottom: 0;
    left: 0;
    aspect-ratio: 25 / 7;
    height: 100%;
    max-height: 1.5rem;
    margin: 1rem;
    filter: drop-shadow(0 2px 5px rgb(255 255 255 / 100%)) invert(1);
    opacity: 0.5;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
    width: fit-content !important;
    visibility: visible !important;
}

.ai-generated:not(img):not(.elementor-widget-image):not(.et_pb_image)::after {
    content: url("../images/AI_Generated_Black.svg");
}

.ai-modified:not(img):not(.elementor-widget-image):not(.et_pb_image)::after {
    content: url("../images/AI_Modified_Black.svg");
}

/*
 * Reproduce the test-bench image treatment. The server-side builder filters
 * fill --ai-image from the rendered image src before the HTML reaches the
 * browser.
 */
img.ai-generated.kmg-ai-generated-ready,
.elementor-widget-image.ai-generated img.kmg-ai-generated-ready,
.et_pb_image.ai-generated img.kmg-ai-generated-ready,
.ai-generated img.kmg-ai-generated-ready {
    content: linear-gradient(transparent, transparent);
    background:
        url("../images/AI_Generated_Overlay@8x.avif") left 1px bottom 1px /
            115.625px 54px no-repeat,
        var(--ai-image) center / cover no-repeat;
}

img.ai-modified.kmg-ai-generated-ready,
.elementor-widget-image.ai-modified img.kmg-ai-generated-ready,
.et_pb_image.ai-modified img.kmg-ai-generated-ready,
.ai-modified img.kmg-ai-generated-ready {
    content: linear-gradient(transparent, transparent);
    background:
        url("../images/AI_Modified_Overlay@8x.avif") left 1px bottom 1px /
            115.625px 54px no-repeat,
        var(--ai-image) center / cover no-repeat;
}

@supports (background-image: -webkit-named-image(apple-pay-logo-black)) {
    img.ai-generated.kmg-ai-generated-ready,
    .elementor-widget-image.ai-generated img.kmg-ai-generated-ready,
    .et_pb_image.ai-generated img.kmg-ai-generated-ready,
    .ai-generated img.kmg-ai-generated-ready {
        content: "" !important;
    }

    img.ai-modified.kmg-ai-generated-ready,
    .elementor-widget-image.ai-modified img.kmg-ai-generated-ready,
    .et_pb_image.ai-modified img.kmg-ai-generated-ready,
    .ai-modified img.kmg-ai-generated-ready {
        content: "" !important;
    }
}