.gallery-slider-item,
.gallery-slider-single-image,
.image-zoom-container,
.gallery-slider-thumbnails-item-inner {
    position: relative;
}

.sc-ai-agent {
    position: absolute;
    z-index: 12;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    line-height: 1;
}

.sc-ai-agent--overlay {
    width: var(--sc-ai-agent-label-width-desktop, 84px);
    cursor: help;
    appearance: none;
}

.sc-ai-agent--top-left {
    top: var(--sc-ai-agent-label-offset, 10px);
    left: var(--sc-ai-agent-label-offset, 10px);
}

.sc-ai-agent--top-right {
    top: var(--sc-ai-agent-label-offset, 10px);
    right: var(--sc-ai-agent-label-offset, 10px);
}

.sc-ai-agent--bottom-left {
    bottom: var(--sc-ai-agent-label-offset, 10px);
    left: var(--sc-ai-agent-label-offset, 10px);
}

.sc-ai-agent--bottom-right {
    right: var(--sc-ai-agent-label-offset, 10px);
    bottom: var(--sc-ai-agent-label-offset, 10px);
}

.sc-ai-agent__image {
    display: block;
    width: 100%;
    height: auto;
    opacity: var(--sc-ai-agent-label-opacity, 1);
}

.sc-ai-agent__tooltip {
    position: absolute;
    z-index: 20;
    bottom: calc(100% + 8px);
    width: max-content;
    max-width: min(240px, 78vw);
    padding: 6px 8px;
    border-radius: 4px;
    background: rgba(20, 20, 20, .96);
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.35;
    text-align: left;
    white-space: normal;
    box-shadow: 0 3px 12px rgba(0, 0, 0, .24);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(4px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}

.sc-ai-agent--top-left .sc-ai-agent__tooltip,
.sc-ai-agent--top-right .sc-ai-agent__tooltip {
    top: calc(100% + 8px);
    bottom: auto;
}

.sc-ai-agent--top-left .sc-ai-agent__tooltip,
.sc-ai-agent--bottom-left .sc-ai-agent__tooltip {
    left: 0;
}

.sc-ai-agent--top-right .sc-ai-agent__tooltip,
.sc-ai-agent--bottom-right .sc-ai-agent__tooltip {
    right: 0;
}

.sc-ai-agent:hover .sc-ai-agent__tooltip,
.sc-ai-agent:focus .sc-ai-agent__tooltip,
.sc-ai-agent:focus-visible .sc-ai-agent__tooltip,
.sc-ai-agent.is-open .sc-ai-agent__tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.sc-ai-agent:focus-visible {
    outline: 2px solid rgba(17, 17, 17, .65);
    outline-offset: 3px;
}

.sc-ai-agent--compact {
    width: 32px;
    max-width: calc(100% - 6px);
    min-height: 20px;
    right: 3px;
    bottom: 3px;
    left: auto;
    top: auto;
    pointer-events: none;
}

.sc-ai-agent--compact.sc-ai-agent--top-left {
    top: 3px;
    left: 3px;
    right: auto;
    bottom: auto;
}

.sc-ai-agent--compact.sc-ai-agent--top-right {
    top: 3px;
    right: 3px;
    bottom: auto;
}

.sc-ai-agent--compact.sc-ai-agent--bottom-left {
    bottom: 3px;
    left: 3px;
    right: auto;
}

@media (max-width: 767.98px) {
    .sc-ai-agent--overlay {
        width: var(--sc-ai-agent-label-width-mobile, 68px);
    }

    .sc-ai-agent__tooltip {
        max-width: min(220px, 84vw);
    }
}
