/* La carte d'un showroom : la coque est celle de la fiche technique (fiche.css), seul le contenu change. */

/* le bandeau sous la photo d'entrée : les deux villes se touchent */
.faits li { align-content: start; }
.faits-villes { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .45rem; }
.faits-ville {
  display: inline-flex; align-items: center; gap: .3rem; min-height: 44px; padding: 0 .7rem 0 .9rem;
  border: 1px solid var(--trait); border-radius: 999px; background: #fff; color: var(--encre);
  font: 600 .9375rem var(--f-texte); cursor: pointer; touch-action: manipulation;
  transition: border-color 200ms ease, transform 160ms var(--ease-out);
}
.faits-ville small { font: inherit; font-weight: 500; color: var(--encre-2); }
.faits-ville .ic { width: 1rem; height: 1rem; color: var(--encre-2); transition: transform 200ms var(--ease-out); }
.faits-ville:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) {
  .faits-ville:hover { border-color: var(--encre); }
  .faits-ville:hover .ic { transform: translateX(2px); }
}

/* ouvert ou fermé, maintenant, à l'heure de Paris */
.sr-statut { display: inline-flex; align-items: center; gap: .55rem; margin: 1.1rem 0 -.4rem; font-weight: 600; color: var(--encre-2); }
.sr-pastille { width: .6rem; height: .6rem; border-radius: 50%; background: #9AA6B2; box-shadow: 0 0 0 4px rgba(154, 166, 178, .22); }
.sr-statut.est-ouvert { color: #2E6B3F; }
.sr-statut.est-ouvert .sr-pastille { background: #2F8A4B; box-shadow: 0 0 0 4px rgba(47, 138, 75, .18); }

.sr-photos .ft-photo { aspect-ratio: 1; background: var(--givre); }
@media (min-width: 640px) { .sr-photos .ft-photo { aspect-ratio: 4 / 3; } }
.sr-photos .ft-photo img { object-fit: cover; }

.sr-adresse { font-style: normal; font-size: 1.125rem; line-height: 1.45; margin: .9rem 0 1rem; }
.sr-plan { margin: 0 0 1rem; display: grid; gap: .4rem; }
.sr-plan img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 6px; border: 1px solid var(--trait-doux); }
.sr-plan figcaption { font-size: .8125rem; color: var(--encre-2); }
.sr-itineraires { display: flex; flex-wrap: wrap; gap: .5rem; }
.sr-itineraires .btn-encre { flex: 1 1 100%; }
.sr-itineraires .btn-ligne { flex: 1 1 0; }
@media (min-width: 640px) { .sr-itineraires .btn-encre { flex: 2 1 0; } }

.sr-horaires .aujourdhui dt, .sr-horaires .aujourdhui dd { color: var(--encre); font-weight: 600; }
.sr-horaires dt span { margin-left: .35rem; font-size: .8125rem; font-weight: 500; color: var(--flamme-fonce); }
.sr-vide { margin: .8rem 0 0; color: var(--encre-2); }
.feuille-showroom .ft-lignes a { color: var(--encre); }
.feuille-showroom .ft-pied .btn { gap: .5rem; }