/* Gallery and lightbox styles */
#gallery img {
    cursor: pointer;
    transition: transform 0.3s;
}

#gallery img:hover {
    transform: scale(1.05); /* Slight zoom on hover */
}

#lightbox {
    display: none; /* Hidden initially */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    justify-content: center;
    align-items: center;
    z-index: 2000;
}

#lightbox img {
    max-width: 80%;
    max-height: 80%;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.8);
}

.lightbox-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 2rem; /* Adjust as needed for icon size */
    color: white;
    cursor: pointer;
    z-index: 2001; /* Ensures arrows are above other elements */
    padding: 10px;
    user-select: none; /* Prevents text selection on click */
}

.lightbox-arrow.left {
    left: 10px;
}

.lightbox-arrow.right {
    right: 10px;
}