﻿@charset "ISO-8859-1";

.pagination {
    margin: 32px 0;
    width: 100%;
    display: flex;
    justify-content: center;
}

    .pagination ul {
        display: flex;
        list-style: none;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
    }

        .pagination ul li {
            margin: 0 4px;
        }

            .pagination ul li a {
                display: flex;
                align-items: center;
                justify-content: center;
                min-width: 36px;
                height: 36px;
                padding: 0 8px;
                border-radius: 100px;
                background: #FFFFFF;
                border: 1px solid #E6DCE6;
                color: #667085;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                cursor: pointer;
                transition: all 0.2s ease;
                text-decoration: none;
            }

                .pagination ul li a.active {
                    background: #581866;
                    color: #FFFFFF;
                    border-color: #581866;
                    font-weight: 600;
                }

                .pagination ul li a:hover:not(.active) {
                    background: #F9F7F9;
                    border-color: #581866;
                    color: #581866;
                }

                .pagination ul li a.fl-nav {
                    display: flex;
                    align-items: center;
                    min-width: 90px;
                    font-weight: 500;
                    color: #581866;
                    border: 1px solid #581866;
                }

                    .pagination ul li a.fl-nav:hover {
                        background: #581866;
                        color: #FFFFFF;
                    }

                .pagination ul li a.fl-prev span::before {
                    content: "←";
                    margin-right: 8px;
                    font-size: 18px;
                    line-height: 1;
                }

                .pagination ul li a.fl-next span::after {
                    content: "→";
                    margin-left: 8px;
                    font-size: 18px;
                    line-height: 1;
                }

/* Responsive styles */
@media only screen and (max-width: 768px) {
    .pagination ul {
        flex-wrap: wrap;
    }

        .pagination ul li {
            margin: 4px;
        }

            .pagination ul li a.fl-nav {
                min-width: auto;
                padding: 0 12px;
            }

            .pagination ul li a.fl-prev span,
            .pagination ul li a.fl-next span {
                font-size: 0;
            }

                .pagination ul li a.fl-prev span::before,
                .pagination ul li a.fl-next span::after {
                    font-size: 18px;
                    margin: 0;
                }
}
