.card-champ {
    background: #f2f4f7;
    border-radius: 20px;
    padding: 15px;
    text-align: center;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    transition: 0.2s;
    min-height: 18vh;
    display: flex;
    flex-direction: column;
}

[data-bs-theme="dark"] .card-champ{
    background-color: #25140a;
}

[data-bs-theme="dark"] .card-text{
    color: white;
    text-decoration: none;
    font-size: medium;
}

.card-champ:hover {
    transform: scale(1.05);
}

.card-champ img.logo {
    width: 90px;
    height: 90px;
    object-fit: contain;
    margin-bottom: 10px;
}

.card-top {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

.champ-bg {
    background: #D0662A;
    padding: 10px;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1;
    max-width: 120px;
}

.champ-bg img {
    max-width: 80%;
    max-height: 80%;
    object-fit: contain;
}

.card-body {
    margin-top: auto;
}

.card-champ img.flag {
    width: 25px;
    margin-top: 5px;
}

.row-champ {
    background: #f2f4f7;
    border-radius: 15px;
    padding: 10px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    transition: 0.2s;
}

a{
    color: white;
    text-decoration: none !important;
}

[data-bs-theme="dark"] .row-champ{
    background-color: #25140a;
    color: white;
}

[data-bs-theme="dark"] .row-champ strong{
    color: white;
    text-decoration: none;
}

.row-champ strong{
    color: black;
}

.row-champ img.logo {
    height: 35px;
}

.row-champ img.flag {
    height: 25px;
}

.row-champ:hover {
    transform: scale(1.01);
}

.pagination{
    --bs-pagination-font-size:#D0662A;
    --bs-pagination-hover-color:#D0662A;
    --bs-pagination-focus-color:#D0662A;
    --bs-pagination-active-bg:#D0662A;
}

.active > .page-link {
    background-color: #D0662A;
    border: #D0662A;
}

.page-link, .page-link:hover {
    color: #D0662A;
}

[data-bs-theme="dark"] .pagination{
    background: #2E3232;
}

b, strong {
    font-size: smaller;
}

.row-cols-md-5 {
    display: grid;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .row-cols-md-5>* {
        flex: 0 0 auto;
        min-width: 100% !important;
    }
}

/* Sur mobile (moins de 768px) : 2 colonnes */
@media (max-width: 1450px) {
    .row-cols-md-5 {
        display: grid;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem;
    }
    .card-champ {
        font-size: 0.9rem;
    }
    .row-cols-md-5 > *{
        width: 100%;
    } 
}

/* Sur mobile (moins de 768px) : 2 colonnes */
@media (max-width: 1200px) {
    .row-cols-md-5 {
        display: grid;
        grid-template-columns: repeat(5, 1fr) !important;
        gap: 0.75rem;
    }
    .card-champ {
        font-size: 0.9rem;
    }
    .row-cols-md-5 > *{
        width: 100%;
    } 
}

@media (max-width: 1050px) {
    .row-cols-md-5 {
        display: grid;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem;
    }
    .card-champ {
        font-size: 0.9rem;
    }
    .row-cols-md-5 > *{
        width: 100%;
    } 
}

@media (max-width: 520px){
    .row-cols-md-5 {
        grid-template-columns: repeat(1, 1fr) !important;
    }
}