.mobile-pagination-container {
    background-color:none;
    padding: 12px;
    border-radius: 20px;
   
}

/* Pagination List */
.mobile-pagination {
    display: flex;
    list-style: none;
    overflow: hidden;
    border: 1px solid #2a2a2a;
    border-radius: 14px;
}

/* Links and Spans */
.mobile-pagination a.mobile-pagination-link,
.mobile-pagination span.mobile-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 61px;
    height: 50px;
    padding: 0 18px;
    text-decoration: none;
    color: #8b8b8b;
    background-color: #111;
    border-right: 1px solid #2a2a2a;
    transition: all 0.2s ease;
    font-size: 18px;
    font-weight: 500;
}

/* Previous/Next Buttons */
.mobile-page-nav-btn {
    min-width: 120px;
    color: #ffffff !important;
    font-weight: 600;
    font-size: 0.9rem;
}

/* Active Page */
.mobile-pagination a.mobile-activepage {
    color: #ffffff;
    background-color: #171717;
    font-weight: 700;
}

/* Hover Effects */
.mobile-pagination a.mobile-pagination-link:hover:not(.mobile-activepage) {
    background-color: #1f1f1f;
    color: #ffffff;
}

/* Dots */
.mobile-pagination .mobile-dots {
    cursor: default;
}

/* Remove border from last item */
.mobile-pagination li:last-child a.mobile-pagination-link {
    border-right: none;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .mobile-pagination a.mobile-pagination-link,
    .mobile-pagination span.mobile-dots {
        min-width: 42px;
        height: 44px;
        font-size: 14px;
        padding: 0 12px;
    }

    .mobile-page-nav-btn {
        min-width: 90px;
        font-size:0.9rem;
    }
}