/* Frame details page — performance + layout (Font Awesome not loaded) */

.frame-details-page .image-container-details {
    position: relative;
    aspect-ratio: 4/3;
    /* background: #f5f5f5; */
    border-radius: 4px;
    overflow: hidden;
}

.frame-details-page .main-imagre-frame-details {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.frame-details-page .thumbnail-wrapper {
    flex: 0 0 auto;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 4px;
    overflow: hidden;
}

.frame-details-page .thumbnail-wrapper.active-thumbnail {
    border-color: #19a1dd;
}

.frame-details-page .thumbnail {
    width: 124px;
    height: 62px;
    object-fit: contain;
    display: block;
}

.frame-details-page .btn-return-catalog {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.frame-details-page .btn-return-catalog .specx-icon {
    flex-shrink: 0;
}

.frame-details-page .specxsorter-scroll-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 18px;
    height: 18px;
    transform: translate(-50%, -50%);
    color: var(--primary-color, #19a1dd);
    z-index: 2;
    pointer-events: none;
}

.frame-details-page .scroll-up .specxsorter-scroll-icon path {
    fill: currentColor !important;
}

.frame-details-page .specxsorter-testimonials {
    display: none;
}

@media (min-width: 769px) {
    .frame-details-page .specxsorter-testimonials {
        display: block;
    }
}
