/**
 * Fiche agence : popup de la carte Leaflet et photo des locaux.
 *
 * Le template « taxonomy-term--office--teaser.html.twig » est partagé entre le
 * pied de page de toutes les pages et le popup de la carte des agences. Les
 * règles ci-dessous sont donc volontairement limitées au conteneur du popup,
 * pour ne rien changer au rendu du pied de page.
 */

/**
 * Dans le popup, les colonnes Bootstrap se calent sur la largeur du viewport et
 * non sur celle du popup (300 px imposés par Leaflet) : sur grand écran la
 * colonne de gauche ne fait qu'une centaine de pixels et son contenu déborde.
 * On repasse donc la fiche sur une seule colonne à l'intérieur du popup.
 */
.leaflet-popup-content .office-teaser > [class*="col-"] {
  flex: 0 0 100%;
  max-width: 100%;
}

.leaflet-popup-content .office-teaser > [class*="col-"] + [class*="col-"] {
  margin-top: 0.75rem;
}

/* Le code postal et la ville tiennent sur une ligne, sans être comprimés. */
.leaflet-popup-content .office-teaser .d-flex {
  flex-wrap: wrap;
}

/* Photo des locaux sur la page contact. */
.office-photo {
  max-width: 600px;
  margin-inline: auto;
}

.office-photo img {
  display: block;
  width: 100%;
  height: auto;
}

/* Logo sous les horaires : format reduit, il n'est plus le visuel principal. */
.office-logo img {
  max-width: 180px;
  height: auto;
}