/* Secal Regalia® — plg_system_secalscripts — feuille 10 : diaporama
   Chargée sur : page d'accueil (tuiles). */

/* =============================================================================
   DIAPORAMA DE LA TUILE D'ACCUEIL

   Le cadre reprend les dimensions de l'image fixe qu'il remplace : hauteur
   plafonnée à 190 px, photo entière visible. Une première version recadrait
   les photos en « cover », ce qui les tronquait — un fanion coupé n'a aucun
   intérêt dans une vitrine.

   Les deux images sont superposées et le fondu se fait sur l'opacité : sans
   superposition, la tuile sauterait à chaque changement.
   ============================================================================= */

.secal-diapo {
    position: relative;
    display: block;
    width: 100%;
    margin: 4px auto 10px;

    /* La tuile est une colonne flexible : plutôt que de figer une hauteur,
       le diaporama prend tout l'espace que lui laissent le titre, la liste
       et le bouton. Les photos sont donc aussi grandes que la tuile le
       permet, et s'adaptent aux écrans étroits comme aux larges. */
    flex: 1 1 auto;
    min-height: 170px;
    overflow: hidden;
}

/* Grille sur quatre colonnes (au-delà de 1000 px) : la tuile a une hauteur
   fixe, et le second bouton (« Créer mon fanion ») prend sa place sur le
   diaporama. Le minimum y descend donc à 120 px pour que la tuile ne grandisse
   pas. Sur mobile, la tuile suit son contenu : le diaporama garde 170 px. */
@media (min-width: 1001px) {
    .secal-diapo { min-height: 120px; }
}

/* Les deux images occupent exactement le cadre, entières et centrées. */
.secal-diapo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    margin: 0;
    max-height: none;
    transition: opacity .7s ease;
    animation: none !important;
}

.secal-diapo .secal-diapo-dessous { opacity: 1; }
.secal-diapo .secal-diapo-dessus  { opacity: 0; }

@media (prefers-reduced-motion: reduce) {
    .secal-diapo img {
        transition: none;
    }
}