/*
 * Die Selektoren wurden an die BEM-Struktur (z.B. __list, __item, __link) angepasst.
 *
 * KORREKTUR: Selektoren wurden zur besseren Lesbarkeit gruppiert und ein
 * Tippfehler (fehlendes Leerzeichen bei #yaspa-pagination-bottom) wurde behoben.
 */

#yaspa-pagination .yaspa-pagination__list,
#yaspa-pagination-top .yaspa-pagination__list,
#yaspa-pagination-bottom .yaspa-pagination__list {
    display: flex;
    justify-content: center; /* Standard: Zentriert */
    list-style: none;
    padding: 20px 0; /* Standard: Mit Padding */
    gap: 5px;
    margin: 0; /* Best Practice: Standard-Margin der UL entfernen */
}

#yaspa-pagination .yaspa-pagination__link,
#yaspa-pagination-top .yaspa-pagination__link,
#yaspa-pagination-bottom .yaspa-pagination__link {
    display: block;
    padding: 8px 14px;
    border: 1px solid #ddd;
    text-decoration: none;
    color: #0073aa;
    background-color: #fff;
    border-radius: 4px;
    transition: all 0.2s ease-in-out;
}

#yaspa-pagination .yaspa-pagination__link:hover,
#yaspa-pagination-top .yaspa-pagination__link:hover,
#yaspa-pagination-bottom .yaspa-pagination__link:hover {
    background-color: #f0f0f0;
    border-color: #bbb;
}

/* Der Modifier --active wird hier verwendet */
#yaspa-pagination .yaspa-pagination__item--active .yaspa-pagination__link--current,
#yaspa-pagination-top .yaspa-pagination__item--active .yaspa-pagination__link--current,
#yaspa-pagination-bottom .yaspa-pagination__item--active .yaspa-pagination__link--current {
    background-color: #0073aa;
    color: #fff;
    border-color: #0073aa;
    cursor: default;
}

/*
 * NEU: Stile für das 2-spaltige Wrapper-Layout
 */

/* Dies ist der Flex-Container für das 2-Spalten-Layout */
.yaspa-pagination-wrapper--with-results {
    display: flex;
    justify-content: space-between; /* Spalten an entgegengesetzte Enden */
    align-items: center;            /* Vertikal zentrieren */
    flex-wrap: wrap;                /* Umbruch auf kleinen Bildschirmen */
    gap: 20px;                      /* Abstand, falls es umbricht */
    padding: 10px 0;                /* Vertikaler Abstand für den gesamten Block */
}

/* Spalte 1: Der Ergebnistext */
.yaspa-pagination-wrapper--with-results .yaspa-pagination__result {
    flex-grow: 1; /* Nimmt verfügbaren Platz links ein */
    font-size: 0.9em;
    color: #555;
}

/* Spalte 2: Die Navigationsleiste */
.yaspa-pagination-wrapper--with-results nav {
    flex-shrink: 0; /* Verhindert, dass die Navigation schrumpft */
}

/*
 * KORRIGIERTER OVERRIDE:
 * WICHTIG: Überschreibt das Padding und die Zentrierung der <ul>.
 *
 * Dieser Selektor MUSS die ID-Selektoren (#yaspa-pagination...)
 * beinhalten, um die Spezifität der obigen Regeln zu überschreiben.
 */
.yaspa-pagination-wrapper--with-results #yaspa-pagination .yaspa-pagination__list,
.yaspa-pagination-wrapper--with-results #yaspa-pagination-top .yaspa-pagination__list,
.yaspa-pagination-wrapper--with-results #yaspa-pagination-bottom .yaspa-pagination__list {
    padding: 0; /* Entfernt das `padding: 20px 0` */
    justify-content: flex-end; /* Richtet die Links rechtsbündig aus (statt mittig) */
}