/* app/assets/stylesheets/pagination.css */

/* CSS-Variablen für dynamische Farben */
.pagination-wrapper {
    --pagination-color: #00ae8f!important;
}

/* Aktive Seite Styling */
.pagination-active {
    color: var(--pagination-color) !important;
    border-color: var(--pagination-color) !important;
    outline-color: var(--pagination-color) !important;
    font-weight: 600;
}

/* Hover-Effekte für Links */
.pagination-link:hover {
    color: var(--pagination-color) !important;
}

/* Hover-Effekte für Navigationspfeile */
.pagination-arrow:hover svg {
    color: var(--pagination-color) !important;
}

/* Smooth transitions für alle Pagination-Elemente */
.page-link,
.page-item,
.pagination-link,
.pagination-arrow {
    transition: all 0.2s ease-in-out;
}

/* Disabled state */
.page-item.disabled svg {
    cursor: not-allowed;
    opacity: 0.5;
}

/* Focus states für Barrierefreiheit */
.page-link:focus,
.page-item:focus,
.pagination-link:focus,
.pagination-arrow:focus {
    outline: 2px solid var(--pagination-color);
    outline-offset: 2px;
    border-radius: 4px;
}