/* =====================================================================
   Couleur de fond des blocs (accueil, page promotions) — définie en
   back-office, facultative.

   Les gabarits partials/homepage_blocks/* posent :
   - .has-block-bg + style="--block-bg: #rrggbb" quand une couleur est choisie
     (sinon le bloc reste blanc) ;
   - .is-tone-dark / .is-tone-light selon la luminosité perçue de cette couleur
     (App\Service\BlockColor, même seuil que les bannières) : texte blanc sur
     fond sombre, noir sur fond clair.

   Seul le texte posé directement sur le fond du bloc change de couleur
   (titres, noms de catégories / d'offres) : les tuiles produits, pastilles
   et boutons gardent leur propre fond blanc.
   ===================================================================== */

.homepage-block.is-tone-light {
    --block-fg: #1d2433;
}

.homepage-block.is-tone-dark {
    --block-fg: #fff;
}

.homepage-block.has-block-bg {
    background: var(--block-bg) !important;
}

/* Hors accueil (page promotions…), un bloc coloré n'est pas encore une carte :
   on lui donne de l'air pour que la couleur se lise comme un fond. */
body:not(.home-page) .homepage-block.has-block-bg {
    margin-bottom: 2rem;
    padding: 2.4rem 2.8rem;
    border-radius: .2rem;
}

/* Blocs publicitaires (images seules) : avec une couleur, ils deviennent une carte. */
.homepage-block.has-block-bg[class*="homepage-block-pub-style"] {
    padding: 2rem 2.4rem;
}

/* --- Texte posé sur le fond du bloc ----------------------------------- */
.homepage-block.is-tone-light .title,
.homepage-block.is-tone-dark .title,
.homepage-block.is-tone-light .category-name,
.homepage-block.is-tone-light .category-name a,
.homepage-block.is-tone-dark .category-name,
.homepage-block.is-tone-dark .category-name a {
    color: var(--block-fg) !important;
}

/* Puces des carrousels (mobile) sur fond sombre */
.homepage-block.is-tone-dark .swiper-pagination .swiper-pagination-bullet {
    border-color: rgba(255, 255, 255, .85);
}

.homepage-block.is-tone-dark .swiper-pagination .swiper-pagination-bullet-active {
    background-color: #fff;
}

@media (max-width: 767.98px) {
    body:not(.home-page) .homepage-block.has-block-bg,
    .homepage-block.has-block-bg[class*="homepage-block-pub-style"] {
        padding: 1.6rem 1.4rem;
    }
}