.esight-product-gallery { 
    width: 45% !important; 
    flex: 0 0 45% !important; 
}

.main-image-wrapper { 
    position: relative; 
    width: 100%; 
    margin-bottom: 15px; 
    overflow: hidden; 
}

.main-image-wrapper img { 
    width: 100% !important; 
    aspect-ratio: 1 / 1 !important; 
    object-fit: cover !important; 
    display: block; 
    border-radius: var(--radius-card); 
}

.esight-arrow { 
    font-family: var(--font-sans) !important; 
    position: absolute !important; 
    top: 50% !important; 
    transform: translateY(-50%) !important; 
    background: rgba(0, 0, 0, 0.3) !important; 
    color: var(--text-white) !important; 
    border: none !important; 
    font-size: 20px !important; 
    width: 36px !important; 
    height: 36px !important; 
    cursor: pointer !important; 
    z-index: 10 !important; 
    border-radius: 50% !important; 
    display: flex !important; 
    align-items: center !important; 
    justify-content: center !important; 
    transition: var(--transition-base) !important; 
    padding: 0 !important; 
}

.esight-arrow:hover { 
    background: rgba(0, 0, 0, 0.6) !important; 
}

.esight-arrow.prev-arrow { left: 15px !important; }
.esight-arrow.next-arrow { right: 15px !important; }

.thumbnail-wrapper { 
    display: grid !important; 
    grid-template-columns: repeat(4, 1fr) !important; 
    gap: 15px !important; 
}

.esight-gallery-thumb { 
    width: 100% !important; 
    height: auto !important; 
    aspect-ratio: 1 / 1 !important; 
    object-fit: cover !important; 
    cursor: pointer; 
    opacity: 0.6; 
    transition: var(--transition-base); 
    border-radius: var(--radius-atom); 
}

.esight-gallery-thumb.active, .esight-gallery-thumb:hover { 
    opacity: 1; 
}

@media (max-width: 767px) {
    .esight-product-gallery { 
        width: 100% !important; 
        flex: 0 0 100% !important; 
    }
}