/**
 * TMAEX-3850 — Réglages responsives mobile pour les blocs core
 * (paragraphe, titre, bouton, image).
 *
 * Toutes les règles ci-dessous ne s'appliquent qu'en dessous du
 * breakpoint mobile défini par le projet (782 px).
 */
@media (max-width: 782px) {
  /* --- Alignement texte (paragraphe / titre) --- */
  .c7m-text-align-left {
    text-align: left !important;
  }
  .c7m-text-align-center {
    text-align: center !important;
  }
  .c7m-text-align-right {
    text-align: right !important;
  }
  .c7m-text-align-justify {
    text-align: justify !important;
  }

  /* --- Taille de police mobile (paragraphe / titre) --- */
  .c7m-has-mobile-font-size {
    font-size: var(--c7m-font-size) !important;
    line-height: 1.3;
  }

  /* --- Alignement bouton --- */
  /* Le bouton est porté par .wp-block-button, lui-même enfant flex de
     .wp-block-buttons : on agit sur le parent pour gauche / centre / droite
     et sur le bouton lui-même pour la pleine largeur. */
  .wp-block-buttons:has(.wp-block-button.c7m-button-align-left) {
    justify-content: flex-start;
  }
  .wp-block-buttons:has(.wp-block-button.c7m-button-align-center) {
    justify-content: center;
  }
  .wp-block-buttons:has(.wp-block-button.c7m-button-align-right) {
    justify-content: flex-end;
  }
  .wp-block-buttons:has(.wp-block-button.c7m-button-align-full) {
    flex-direction: column;
    align-items: stretch;
  }
  .wp-block-button.c7m-button-align-full {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .wp-block-button.c7m-button-align-full .wp-block-button__link {
    display: block;
    width: 100%;
    text-align: center;
  }

  /* --- Alignement image --- */
  .wp-block-image.c7m-image-align-left {
    text-align: left;
    margin-left: 0;
    margin-right: auto;
  }
  .wp-block-image.c7m-image-align-center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
  .wp-block-image.c7m-image-align-right {
    text-align: right;
    margin-left: auto;
    margin-right: 0;
  }
  .wp-block-image.c7m-image-align-left img,
  .wp-block-image.c7m-image-align-right img,
  .wp-block-image.c7m-image-align-center img {
    display: inline-block;
  }

  /* --- Largeur image (curseur en %) --- */
  .wp-block-image.c7m-has-mobile-image-width img {
    width: var(--c7m-image-width) !important;
    height: auto !important;
    max-width: 100% !important;
  }
  /* Quand le bloc image est lui-même dimensionné, on ajuste aussi le
     conteneur pour rester cohérent. */
  figure.wp-block-image.c7m-has-mobile-image-width {
    width: var(--c7m-image-width) !important;
    max-width: 100%;
  }
}
