.popup-image-modal {
    display: none; /* Hide by default */
    position: fixed;
    z-index: 1002;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    overflow: auto; /* Allow scrolling in both directions */
}

.popup-image-modal-content {
    margin: 0 auto;
    width: 100%;
    max-width: 1500px;
    position: relative; /* Necessary for zoom and pan */
    overflow: visible; /* Allow image overflow within content */
}

/* Rating container to align text and stars horizontally */
.rating-container {
    display: flex;
    align-items: center; /* Ensures both text and stars are aligned vertically */
    justify-content: space-between; /* Center the content horizontally */
    margin: 0px 50px;

}

.rating-container p {
    margin: 0px 0px 5px 0px; /* Space between the title and the stars */
    font-weight: bold; /* Make the title bold */
    text-align: center; /* Ensures text is centered */
    font: 0.8rem;
}

.star-rating {
    display: flex;
    justify-content: center; /* Ensures stars are centered */
}

.fa-star {
    font-size: 1rem; /* Adjust size as needed */
    color: gray; /* Default star color */
    margin: 0 2px; /* Spacing between stars */
}

.fa-star.checked {
    color: gold; /* Filled star color */
}


.popup-image-modal-content img {
    width: 100%;
    height: auto;
    display: block;
    cursor: zoom-in;
    transition: width 0.3s ease, height 0.3s ease; /* Smooth zoom transition */
}

@media (max-width: 768px) {
    .popup-image-modal-content img {
        margin-top: 150px;
    }
    .popup-image-modal-content imgzoomed {
        margin-top: 20px;
    }
}

.popup-image-modal-content img.zoomed {
    cursor: zoom-out;
    width: 150%; /* Set the zoomed-in width */
    height: 150%; /* Set the zoomed-in height */
}

.popup-image-modal .close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.popup-image-modal .close:hover,
.popup-image-modal .close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}
