/* Pagination Wrapper */
.pagination-wrapper {
    text-align: center;
    margin-top: 30px;
}

/* Pagination List */
.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 0;
    list-style: none;
}

/* Pagination Button */
.pagination li {
    display: inline;
    margin: 0 5px;
}

/* Default Button Style */
.pagination li a {
    color: #333; /* Default Text Color */
    text-decoration: none;
    border: 2px solid #272ade; /* Default Border Color */
    width: 40px; /* Fixed width for square shape */
    height: 40px; /* Fixed height for square shape */
    display: inline-block;
    text-align: center; /* Center text horizontally */
    line-height: 40px; /* Align text vertically */
    border-radius: 0; /* Square shape */
    background-color: white; /* Default Background Color */
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: bold;
    transition: all 0.3s ease-in-out;
}


/* Hover Effect */
.pagination li a:hover {
    background-color: #272ade; /* Hover Background Color */
    color: white;
    border-color: #272ade; /* Hover Border Color */
}

/* Active Button Style */
.pagination li a.active {
    background-color: #FF5733; /* Active Button Background Color */
    color: white; /* Active Button Text Color */
    border-color: #FF5733; /* Active Button Border Color */
}