﻿/* wwwroot/css/components/pagination.css */

/* Custom Theme (Default for DevaCode) */
.pagination-custom {
    display: flex;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
}

    .pagination-custom .page-item {
        display: inline-block;
    }

    .pagination-custom .page-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 40px;
        height: 40px;
        padding: 0 12px;
        background: rgba(30, 41, 59, 0.5);
        border: 1px solid rgba(129, 140, 248, 0.2);
        border-radius: 12px;
        color: #cbd5e1;
        font-size: 14px;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.2s ease;
    }

        .pagination-custom .page-link:hover {
            background: rgba(129, 140, 248, 0.2);
            border-color: #818cf8;
            color: white;
            transform: translateY(-1px);
        }

    .pagination-custom .page-item.active .page-link {
        background: linear-gradient(90deg, #4f46e5, #7c3aed);
        border-color: transparent;
        color: white;
    }

    .pagination-custom .page-item.disabled .page-link {
        opacity: 0.5;
        cursor: not-allowed;
    }

        .pagination-custom .page-item.disabled .page-link:hover {
            transform: none;
            background: rgba(30, 41, 59, 0.5);
        }

/* Minimal Theme */
.pagination-minimal {
    display: flex;
    gap: 6px;
    justify-content: center;
    flex-wrap: wrap;
}

    .pagination-minimal .pagination-btn {
        min-width: 36px;
        height: 36px;
        padding: 0 10px;
        background: transparent;
        border: none;
        border-radius: 8px;
        color: #94a3b8;
        font-size: 14px;
        cursor: pointer;
        transition: all 0.2s;
    }

        .pagination-minimal .pagination-btn:hover {
            background: rgba(129, 140, 248, 0.1);
            color: #a5b4fc;
        }

        .pagination-minimal .pagination-btn.active {
            background: #4f46e5;
            color: white;
        }

    .pagination-minimal .pagination-ellipsis {
        color: #64748b;
        padding: 0 4px;
    }
