/* Styling both icons for a consistent circular look */
.icon-next, 
.icon-prev {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 65px;             /* Adjust size of the circle */
    height: 65px;            /* Adjust size of the circle */
    background-color: black;  /* Dark background */
    color: #fff;             /* Light arrow color */
    border-radius: 50%;      /* Makes it a circle */
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease;
    font-size: 24px;         /* Adjust arrow size */
}

/* Hover effect for better UX */
.icon-next:hover, 
.icon-prev:hover {
    background-color: black;  /* Slightly lighter on hover */
    transform: scale(1.05);  /* Subtle pop effect */
}

/* Specific spacing if they are next to each other */
.icon-prev {
    margin-right: 10px;
}