/*
 * En-tête et pied de page du Theme Builder (mises en page 12 et 13).
 *
 * Chaque bloc vise une classe posée dans le champ « Classe CSS » du module Divi. Le
 * préfixe `.et-db #et-boc .et-l` et la classe de type (`.et_pb_menu`…) redonnent la
 * spécificité qu'avait le CSS libre du module : Divi imprime ses propres styles de module
 * après ce fichier, dans le <body>, et l'emporterait sinon à spécificité égale.
 */
.et-db #et-boc .et-l {
  /* En-tête */
  .et_pb_section.entete {
    position: sticky;
    z-index: 10;
  }

  .et_pb_column.entete-logo {
    min-inline-size: 100px;
  }

  /* Pied de page — au téléphone, les logos passent au-dessus du menu */
  .et_pb_column.pied-colonne-menu {
    @media (width <= 767px) {
      order: 1;
    }
  }

  .et_pb_column.pied-colonne-logos {
    @media (width <= 767px) {
      order: 0;
    }
  }

  .et_pb_menu.pied-menu {
    .et-menu {
      flex-direction: column;

      li {
        font-size: inherit;
      }

      a {
        text-decoration: underline;

        &:is(:hover, :focus-visible) {
          opacity: 0.8;
        }
      }
    }

    /* Le menu reste une liste de liens à la tablette, au lieu du menu hamburger. */
    @media (width <= 980px) {
      .et_mobile_nav_menu {
        display: none;
      }

      .et_pb_menu__menu {
        display: block;
        text-align: start;
      }

      .et_pb_module {
        margin-block-end: initial;
      }

      li.menu-item {
        padding-inline: 0;
      }

      .et-menu {
        margin-inline: 0;
      }
    }
  }

  .et_pb_image.pied-logo .et_pb_image_wrap {
    display: block;
  }

  .et_pb_image.pied-logo-3m {
    inline-size: clamp(120px, 50%, 300px);
  }

  .et_pb_group.pied-icones {
    @media (width <= 767px) {
      justify-content: start;

      .et_pb_icon_wrap .et-pb-icon {
        font-size: 24px;
      }
    }
  }
}

/* Liens de rappel de la fenêtre « Vous avez un compte avec nous ? » (modules/compte-existant.php) :
   sans fenêtre sur la page (personne connectée, panier, caisse, module éteint), ils ne mènent nulle part. */
body:not(:has(#compte-existant)) :is(li:has(> a[href$="#compte-existant"]), a[href$="#compte-existant"]) {
  display: none;
}