.category-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    z-index: 2;
    padding: .35rem .6rem;
    font-size: .75rem;
}

/* Optionnel : améliorer la lisibilité si la photo est claire */
.category-badge {
    backdrop-filter: blur(4px);
    background-color: rgba(var(--bs-primary-rgb), 0.85);
}

.index-article-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--tds-marron);
    letter-spacing: normal;
}

h1.index-article {
    letter-spacing: normal;
}

/* ## Article Show ## s*/
.article-show .article-cover {
    max-width: 80%;
}

@media (max-width: 768px) {
    .article-show .article-cover {
        max-width: 100%;
    }
}

.article-content {
    line-height: 1.7;
    font-size: 1rem;
}

/* Un peu d’air entre les paragraphes */
.article-content p {
    margin-bottom: 1rem;
}

h1.show-article {
    letter-spacing: normal;
}

.article-content h2 {
    letter-spacing: normal;
}

.article-content h3 {
    color: var(--tds-marron);
}

.card-body {
    background-color: var(--tds-creme);
}

.index-articles {
    table-layout: fixed; /* 👍 Contraint les colonnes */
    width: 100%;

}

.col-1 { width: 3%; padding-left: 10px; }
.col-2 { width: 17%; padding-right: 10px; }
.col-3 { width: 50%; padding-right: 10px;}
.col-4 { width: 10%; text-align: center;}
.col-5 { width: 10%; text-align: center;}
.col-6 { width: 10%; text-align: center;}

/* Pour éviter que du texte déborde */
.index-articles th,
.index-articles td {
    background-color: var(--tds-creme);
    color: var(--tds-marron);
    border-bottom: 1px solid var(--tds-marron);
    padding-top: 5px;
    padding-bottom: 5px;
}