/* Magnifying Glass Styles */
.image-zoom-container {
    position: relative;
    cursor: none;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    overflow: hidden;
}

.image-zoom-container img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.magnifying-glass {
    position: absolute;
    width: 195px;
    height: 195px;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3),
        0 0 0 1px rgba(0, 0, 0, 0.1),
        inset 0 0 20px rgba(0, 0, 0, 0.1);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 10;
    background-size: 200% 200%;
    background-repeat: no-repeat;
    background-position: center;
    transform: translate(-50%, -50%);
}

.image-zoom-container:hover .magnifying-glass {
    opacity: 1;
}