/**
 * mod_references - Défilement des miniatures
 * Compatible Bootstrap 5.3
 */

/* Cadre : une seule ligne, ce qui dépasse est masqué */
.mod-references-viewport {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.mod-references-track {
    display: flex;
    flex-wrap: nowrap;
    will-change: transform;
}

/* Miniature (l'espacement est en marge pour que le JS calcule le pas exact) */
.mod-references-item {
    flex: 0 0 var(--mod-ref-thumb-w, 300px);
    width: var(--mod-ref-thumb-w, 300px);
    max-width: 35vw;
    aspect-ratio: var(--mod-ref-thumb-ratio, 300 / 220);
    margin-right: 1rem;
    display: block;
    overflow: hidden;
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.mod-references-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s ease, opacity .3s ease;
}

a.mod-references-item:hover img,
a.mod-references-item:focus-visible img {
    transform: scale(1.04);
    opacity: .9;
}