.ai-image-label-host--relative {
position: relative;
}
.ai-image-label-host--inline {
display: inline-block;
max-width: 100%;
vertical-align: top;
}
.ai-image-label-host--wrapper {
display: inline-block;
max-width: 100%;
line-height: 0;
vertical-align: top;
}
.ai-image-label-overlay {
--aiml-label-offset: 0.5rem;
position: absolute;
z-index: 30;
display: flex;
max-width: calc(100% - 1rem);
flex-wrap: wrap;
gap: 0.25rem;
line-height: normal;
pointer-events: none;
}
.ai-image-label-position--top-left {
top: var(--aiml-label-offset);
left: var(--aiml-label-offset);
justify-content: flex-start;
}
.ai-image-label-position--top-right {
top: var(--aiml-label-offset);
right: var(--aiml-label-offset);
justify-content: flex-end;
}
.ai-image-label-position--bottom-left {
bottom: var(--aiml-label-offset);
left: var(--aiml-label-offset);
justify-content: flex-start;
}
.ai-image-label-position--bottom-right {
right: var(--aiml-label-offset);
bottom: var(--aiml-label-offset);
justify-content: flex-end;
} .ai-image-label-badge {
display: inline-block;
max-width: 100%;
box-sizing: border-box;
padding: 0.2em 0.5em;
border-radius: 999px;
background: rgba(0, 0, 0, 0.55);
color: #fff;
font-family: inherit;
font-size: 0.625rem;
font-weight: 500;
letter-spacing: 0.02em;
line-height: 1.35;
overflow-wrap: break-word;
white-space: normal;
}
.ai-image-label-description {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
.wp-block-cover.ai-image-label-host > .ai-image-label-overlay {
z-index: 40;
} @media (forced-colors: active) {
.ai-image-label-badge {
border: 1px solid CanvasText;
background: Canvas;
color: CanvasText;
}
}
@media (max-width: 480px) {
.ai-image-label-overlay {
--aiml-label-offset: 0.35rem;
max-width: calc(100% - 0.7rem);
}
}