/* My Local Explorer 2.4.4 — affichage mobile ultra-large.
   Overrides ciblés; ne remplace pas le CSS compilé de l'application. */
html, body, #root {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  overflow-x: hidden;
}
#root {
  min-height: 100vh;
  min-height: 100dvh;
}
#root > div {
  width: 100%;
  min-width: 0;
  min-height: 100vh;
  min-height: 100dvh;
}
@media (max-width: 639.98px) {
  /* L'application remplit tout l'écran, sans mode « page de bureau réduite ». */
  #root > div > header > div {
    width: 100%;
    max-width: none;
    min-width: 0;
    height: 70px;
    padding-inline: 8px;
    gap: 10px;
  }
  #root > div > header [data-testid="brand-link"] {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
  }
  #root > div > header [data-testid="brand-link"] > span:first-child {
    width: 43px;
    height: 43px;
    border-radius: 13px;
  }
  #root > div > header [data-testid="brand-link"] > span:last-child {
    min-width: 0;
    overflow: hidden;
  }
  #root > div > header [data-testid="brand-link"] > span:last-child > span:first-child {
    font-size: clamp(13px, 3.9vw, 16px);
    line-height: 1.25;
  }
  #root > div > header [data-testid="brand-link"] > span:last-child > span:last-child {
    font-size: 12px;
  }
  #root > div > header [data-testid="language-switcher-trigger"] {
    flex-shrink: 0;
  }
  #root > div > main {
    display: block;
    width: 100%;
    max-width: none;
    min-width: 0;
    box-sizing: border-box;
    margin-inline: 0;
    padding: 14px 6px calc(108px + env(safe-area-inset-bottom, 0px));
  }
  #root > div > main > div {
    max-width: 100%;
    min-width: 0;
  }
  /* Bannière dimensionnée pour un écran vertical comme sur l'exemple. */
  #root [data-testid="hero-section"] {
    width: 100%;
    border-radius: 25px;
  }
  #root [data-testid="hero-section"] > img {
    display: block;
    width: 100%;
    height: clamp(265px, 38svh, 340px);
    object-fit: cover;
  }
  #root [data-testid="hero-section"] > div:last-child {
    padding: 22px;
  }
  #root [data-testid="hero-title"] {
    font-size: clamp(29px, 8vw, 36px);
    line-height: 1.09;
    overflow-wrap: anywhere;
  }
  /* Barre persistante, lisible et respectueuse des bords système. */
  #root > div > nav {
    width: 100%;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  #root > div > nav > div {
    width: 100%;
    max-width: none;
    min-width: 0;
    padding: 9px 5px 8px;
  }
  #root > div > nav [data-testid^="bottom-nav-"] {
    min-width: 0;
    min-height: 49px;
    padding-inline: 2px;
    font-size: 11px;
    line-height: 1.2;
  }
  #root > div > nav [data-testid^="bottom-nav-"] svg {
    height: 23px;
    width: 23px;
  }
  #root > div > nav [data-testid^="bottom-nav-"] span {
    max-width: 100%;
  }
  /* Empêche Safari de zoomer au focus des champs. */
  #root input:not([type="checkbox"]):not([type="radio"]),
  #root select,
  #root textarea {
    font-size: max(16px, 1rem);
  }
}
@media (max-width: 359.98px) {
  #root > div > header > div { padding-inline: 10px; gap: 6px; }
  #root > div > header [data-testid="brand-link"] > span:first-child { width: 38px; height: 38px; }
  #root > div > main { padding-inline: 5px; }
  #root > div > nav [data-testid^="bottom-nav-"] { font-size: 10px; }
}
@media (min-width: 640px) and (max-width: 1023.98px) {
  #root > div > main { width: 100%; max-width: 100%; }
  #root > div > nav > div { max-width: 640px; }
}

/* 2.4.4 : préserve la quasi-totalité de la largeur utile sur téléphone.
   La page d'application possède son propre modèle pleine largeur hors thème WP. */
@media (min-width: 640px) and (max-width: 767.98px) {
  #root > div > header > div { padding-inline: 10px; max-width: none; }
  #root > div > main {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    padding-inline: 10px;
  }
}


/* 2.4.13 — Fenêtre d'installation compacte : 7 langues entièrement visibles. */
[data-testid="installation-popup"] {
  box-sizing: border-box;
  max-height: calc(100dvh - 20px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
[data-testid="installation-popup"] .mle-install-sections {
  margin-top: 12px;
  gap: 10px;
}
[data-testid="installation-popup"] .mle-install-panel {
  padding: 12px;
  border-radius: 16px;
}
[data-testid="installation-popup"] .mle-install-panel h3 {
  margin-bottom: 7px;
  line-height: 1.35;
}
[data-testid="installation-popup"] .mle-install-flags {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}
[data-testid="installation-popup"] .mle-install-flag {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 64px;
  padding: 8px 2px;
  border-radius: 12px;
  cursor: pointer;
}
[data-testid="installation-popup"] .mle-install-flag-emoji {
  font-size: 23px;
  line-height: 1.15;
}
[data-testid="installation-popup"] .mle-install-flag-label {
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.03em;
  line-height: 1.2;
  white-space: nowrap;
}
@media (max-width: 480px) {
  [data-testid="installation-popup"] {
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    padding: 20px 14px 14px;
  }
  [data-testid="installation-popup"] .mle-install-panel { padding: 10px; }
}
@media (max-height: 640px) {
  [data-testid="installation-popup"] .mle-install-sections { gap: 7px; }
  [data-testid="installation-popup"] .mle-install-flag { min-height: 55px; padding: 5px 2px; }
}


/* v2.4.14: explicit installation opt-out (persisted on this device). */
[data-testid="installation-popup"] .mle-install-decline-footer {
  position: sticky;
  bottom: -14px;
  z-index: 2;
  margin: 10px -2px -10px;
  padding: 12px 4px 10px;
  background: #fff;
  border-top: 1px solid #e5e7eb;
  text-align: center;
}
[data-testid="installation-popup"] .mle-install-decline-button {
  display: block;
  width: 100%;
  min-height: 44px;
  border: 1px solid #d1d5db;
  border-radius: 12px;
  background: #fff;
  color: #334155;
  font-size: 14px;
  font-weight: 650;
  cursor: pointer;
}
[data-testid="installation-popup"] .mle-install-decline-button:hover,
[data-testid="installation-popup"] .mle-install-decline-button:focus-visible {
  background: #f8fafc;
  outline-offset: 2px;
}
[data-testid="installation-popup"] .mle-install-decline-note {
  font-size: 11px;
  line-height: 1.4;
  color: #64748b;
  margin: 7px 0 0;
}


/* v2.4.20 — Espace gérant : navigation et arrivées vraiment adaptées au mobile.
   Les autres pages et l'affichage ordinateur restent inchangés. */
.mle-admin-mobile-nav { display: none; }
@media (max-width: 767.98px) {
  #root .mle-admin-page {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
  #root .mle-admin-top {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  #root .mle-admin-identification { min-width: 0; width: 100%; }
  #root .mle-admin-identification h1 {
    font-size: clamp(26px, 7vw, 32px);
    line-height: 1.15;
    margin-bottom: 7px;
  }
  #root .mle-admin-identification [data-testid="admin-user-email"] {
    font-size: 12px;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
  #root .mle-admin-camping-switcher {
    width: 100%;
    max-width: 100%;
    min-height: 46px;
    justify-content: space-between;
    font-size: 14px;
  }
  #root .mle-admin-logout { align-self: flex-start; min-height: 42px; }

  /* Sur téléphone : un seul sélecteur natif, sans onglets sur plusieurs étages. */
  #root .mle-admin-page .mle-admin-tabs { display: none !important; }
  #root .mle-admin-page .mle-admin-mobile-nav {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    min-width: 0;
    font-size: 13px;
    font-weight: 700;
    color: #334155;
  }
  #root .mle-admin-mobile-nav select {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 48px;
    border: 1px solid #cbd5e1;
    border-radius: 14px;
    background: #f1f5f9;
    color: #0f172a;
    padding: 10px 36px 10px 14px;
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    text-overflow: ellipsis;
    cursor: pointer;
  }
  #root .mle-admin-mobile-nav select:focus-visible {
    outline: 3px solid #93c5fd;
    outline-offset: 2px;
  }

  /* Le bloc Aujourd'hui / Demain, la date et Imprimer forment deux rangées nettes. */
  #root .mle-arrivals-tools {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    align-items: center;
    gap: 10px 8px;
    width: 100%;
  }
  #root .mle-arrivals-tools > * { min-width: 0; }
  #root .mle-arrivals-day {
    min-height: 42px;
    padding: 9px 8px;
    white-space: nowrap;
    font-size: 14px;
    text-align: center;
  }
  #root .mle-arrivals-date {
    justify-self: start;
    font-size: clamp(12px, 3.4vw, 14px);
    line-height: 1.4;
    margin: 0;
  }
  #root .mle-arrivals-print {
    justify-self: end;
    min-height: 40px;
    margin-inline-start: 0;
    padding-inline: 10px;
    font-size: 13px;
    white-space: nowrap;
  }
  #root [data-testid="arrivals-summary"] { gap: 7px; }
  #root [data-testid="arrivals-summary"] > div {
    min-width: 0;
    padding: 10px 6px;
    border-radius: 14px;
    text-align: center;
  }
  #root [data-testid="arrivals-summary"] > div > div:first-child {
    font-size: 24px;
    line-height: 1.35;
  }
  #root [data-testid="arrivals-summary"] > div > div:last-child {
    font-size: 11px;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }
  #root [data-testid^="arrival-row-"] {
    display: grid;
    grid-template-columns: 60px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    padding: 11px 9px;
  }
  #root [data-testid^="arrival-row-"] > span:first-child {
    width: 60px;
    height: 44px;
    font-size: 12px;
  }
  #root [data-testid^="arrival-row-"] > div:nth-child(2) { min-width: 0; }
  #root [data-testid^="arrival-row-"] > label:last-child {
    grid-column: 1 / -1;
    justify-self: end;
    min-height: 38px;
    max-width: 100%;
    white-space: nowrap;
  }
}
@media print {
  .mle-admin-mobile-nav { display:none !important; }
}


/* v2.4.21 — Header/branding responsive, sans texte MYLOCALE tronqué. */
#root > div > header .mle-brand-logo {
  display: block;
  width: 44px;
  height: 44px;
  object-fit: cover;
  flex: 0 0 44px;
}
@media (max-width: 639.98px) {
  #root > div > header > div {
    height: 70px;
    padding-inline: 8px;
    gap: 5px;
  }
  #root > div > header [data-testid="brand-link"] {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    gap: 6px;
    min-width: 0;
    overflow: visible;
  }
  #root > div > header .mle-brand-logo {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-radius: 12px;
  }
  #root > div > header [data-testid="brand-link"] > span:last-child {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
  }
  #root > div > header .mle-brand-name {
    font-size: clamp(12px, 3.55vw, 15px);
    line-height: 1.25;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }
  #root > div > header [data-testid="brand-camping-name"] {
    display: block;
    font-size: 11px;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #root > div > header > div > div:last-child {
    flex: 0 0 auto;
    gap: 4px;
    min-width: 0;
  }
  #root > div > header [data-testid="language-switcher-trigger"] {
    height: 34px;
    padding-inline: 8px;
    gap: 4px;
    font-size: 12px;
  }
  #root > div > header [data-testid="header-call-button"],
  #root > div > header [data-testid="header-admin-link"] {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
  }
}
@media (max-width: 359.98px) {
  #root > div > header > div { padding-inline: 5px; gap: 4px; }
  #root > div > header .mle-brand-logo { width: 36px; height: 36px; flex-basis: 36px; }
  #root > div > header [data-testid="brand-link"] { gap: 4px; }
  #root > div > header .mle-brand-name { font-size: 12px; }
  #root > div > header [data-testid="brand-camping-name"] { font-size: 10px; }
  #root > div > header [data-testid="language-switcher-trigger"] { padding-inline: 5px; font-size: 11px; }
  #root > div > header [data-testid="header-call-button"],
  #root > div > header [data-testid="header-admin-link"] { width: 31px; height: 31px; }
  #root > div > header > div > div:last-child { gap: 3px; }
}


/* v2.4.22 — Afficher MYLOCALEXPLORE en entier dans le coin supérieur gauche.
   Garder le camping sur la seconde ligne et tous les boutons accessibles. */
@media (max-width: 639.98px) {
  #root > div > header > div {
    padding-inline: 6px;
    gap: 4px;
  }
  #root > div > header [data-testid="brand-link"] {
    flex: 1 1 auto;
    min-width: 0;
    gap: 5px;
  }
  #root > div > header .mle-brand-logo {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border-radius: 10px;
  }
  #root > div > header [data-testid="brand-link"] > span:last-child {
    min-width: 0;
    flex: 1 1 auto;
    overflow: visible;
  }
  #root > div > header .mle-brand-name {
    display: block;
    font-size: clamp(10px, 3.15vw, 13px);
    font-weight: 800;
    letter-spacing: -0.055em;
    line-height: 1.2;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }
  #root > div > header [data-testid="brand-camping-name"] {
    font-size: clamp(9px, 2.6vw, 11px);
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #root > div > header > div > div:last-child {
    flex-shrink: 0;
    gap: 3px;
  }
  #root > div > header [data-testid="language-switcher-trigger"] {
    height: 32px;
    padding-inline: 5px;
    gap: 3px;
    font-size: 11px;
  }
  #root > div > header [data-testid="header-call-button"],
  #root > div > header [data-testid="header-admin-link"] {
    width: 30px;
    height: 30px;
  }
}
@media (max-width: 359.98px) {
  #root > div > header > div { padding-inline: 4px; gap: 3px; }
  #root > div > header .mle-brand-logo {
    width: 31px;
    height: 31px;
    flex-basis: 31px;
  }
  #root > div > header [data-testid="brand-link"] { gap: 3px; }
  #root > div > header .mle-brand-name {
    font-size: clamp(9px, 3.15vw, 11px);
    letter-spacing: -0.055em;
  }
  #root > div > header [data-testid="brand-camping-name"] { font-size: 9px; }
  #root > div > header [data-testid="language-switcher-trigger"] {
    padding-inline: 4px;
    font-size: 10px;
  }
  #root > div > header [data-testid="header-call-button"],
  #root > div > header [data-testid="header-admin-link"] { width: 28px; height: 28px; }
  #root > div > header > div > div:last-child { gap: 2px; }
}


/* v2.4.28 — Accueil compact sur smartphones : hiérarchie lisible et sans débordement.
   Ciblage exclusif de l'écran mobile : aucune incidence sur les pages ordinateur
   ni sur l'espace gérant (déjà doté de ses styles spécifiques). */
@media (max-width: 639.98px) {
  /* Zone supérieure : garder marque et trois actions visibles sur une ligne. */
  #root > div > header > div {
    height: 62px;
    min-height: 62px;
    padding-inline: 7px;
    gap: 4px;
  }
  #root > div > header [data-testid="brand-link"] { min-width: 0; gap: 5px; }
  #root > div > header .mle-brand-logo {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
  }
  #root > div > header .mle-brand-name {
    font-size: clamp(10px, 3vw, 12.5px);
    line-height: 1.22;
    letter-spacing: -0.045em;
  }
  #root > div > header [data-testid="brand-camping-name"] {
    font-size: clamp(9px, 2.4vw, 10.5px);
    line-height: 1.32;
  }
  #root > div > header [data-testid="language-switcher-trigger"] {
    min-height: 32px;
    padding-inline: 5px;
  }

  /* Espacements du contenu adaptés à la largeur physique du téléphone. */
  #root > div > main {
    padding: 12px 9px calc(104px + env(safe-area-inset-bottom, 0px));
  }
  #root > div > main > div { min-width: 0; }
  #root [data-testid="hero-section"] { border-radius: 22px; }
  #root [data-testid="hero-section"] > img {
    height: clamp(225px, 30svh, 285px);
  }
  #root [data-testid="hero-section"] > div:last-child { padding: 16px; }
  #root [data-testid="hero-title"] {
    font-size: clamp(24px, 6.8vw, 30px);
    line-height: 1.12;
  }
  #root [data-testid="hero-address"],
  #root [data-testid="hero-phone-link"] {
    max-width: 100%;
    font-size: 11px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  /* La carte de logement tient sur une hauteur raisonnable ; pas de texte
     superposé, même si le nom ou l'emplacement sont plus longs. */
  #root [data-testid="housing-card"] {
    min-width: 0;
    gap: 10px;
    padding: 12px;
    border-radius: 20px;
  }
  #root [data-testid="housing-card"] > img {
    width: 62px;
    height: 62px;
    flex: 0 0 62px;
    border-radius: 13px;
  }
  #root [data-testid="housing-card"] > div { min-width: 0; }
  #root [data-testid="housing-card-name"] {
    font-size: 14.5px;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }
  #root [data-testid="housing-card-name"] > span {
    display: block;
    margin-inline-start: 0;
    margin-top: 2px;
    font-size: 11px;
    line-height: 1.3;
  }
  #root [data-testid="housing-card"] > div > div:nth-child(2) {
    font-size: 12.5px;
    line-height: 1.43;
    gap: 1px;
  }
  #root [data-testid="housing-card"] > svg { width: 16px; height: 16px; }

  /* Les catégories restent défilantes horizontalement, avec trois visibles. */
  #root [data-testid^="shortcut-"] {
    min-width: 94px;
    width: 94px;
    max-width: 94px;
    min-height: 94px;
    gap: 7px;
    padding: 10px 6px;
    border-radius: 19px;
  }
  #root [data-testid^="shortcut-"] > span:first-child {
    width: 36px;
    height: 36px;
  }
  #root [data-testid^="shortcut-"] > span:last-child {
    min-width: 0;
    max-width: 100%;
    font-size: 11px;
    line-height: 1.28;
    overflow-wrap: anywhere;
  }

  #root [data-testid="for-you-now-section"] { padding: 16px; border-radius: 21px; }
  #root [data-testid="for-you-now-section"] h2 {
    font-size: clamp(17px, 5vw, 20px);
    line-height: 1.23;
  }
  /* Navigation toujours devant le contenu mais jamais derrière MyAssistant. */
  #root > div > nav > div { padding: 7px 4px 8px; }
  #root > div > nav [data-testid^="bottom-nav-"] {
    min-width: 0;
    min-height: 54px;
    gap: 4px;
    padding: 5px 1px;
    font-size: 10px;
    line-height: 1.2;
    white-space: nowrap;
  }
  #root > div > nav [data-testid^="bottom-nav-"] svg {
    width: 21px;
    height: 21px;
    flex-shrink: 0;
  }
  #root > div > nav [data-testid^="bottom-nav-"] span {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media (max-width: 359.98px) {
  #root > div > header > div { padding-inline: 4px; gap: 3px; }
  #root > div > header .mle-brand-logo { width: 30px; height: 30px; flex-basis: 30px; }
  #root > div > main { padding-inline: 7px; }
  #root [data-testid="housing-card"] { gap: 8px; padding: 10px; }
  #root [data-testid="housing-card"] > img { width: 54px; height: 54px; flex-basis: 54px; }
  #root [data-testid="housing-card-name"] { font-size: 13px; }
  #root [data-testid="housing-card"] > div > div:nth-child(2) { font-size: 12px; }
  #root [data-testid^="shortcut-"] { min-width: 89px; width: 89px; max-width: 89px; }
  #root > div > nav [data-testid^="bottom-nav-"] { font-size: 9.5px; }
}

/* 2.4.56 : public accommodation, reception, arrivals and departures.
   Scoped to avoid changing the manager or other camping guide pages. */
.mle-stay-guide{display:grid;gap:14px;min-width:0;color:#152642}
.mle-stay-contact{display:flex;gap:13px;align-items:center;min-width:0;padding:15px 16px;border-radius:22px;background:#f0f5fe;border:1px solid #e3edfe}
.mle-stay-contact-icon,.mle-stay-guide-title-icon,.mle-stay-panel-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:#2164eb;background:#dce9ff;border-radius:16px}
.mle-stay-contact-icon{width:46px;height:46px;border-radius:50%}
.mle-stay-lucide{height:21px;width:21px}
.mle-stay-contact-text{min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.4}
.mle-stay-contact-label{font-size:17px;font-weight:800;letter-spacing:-.02em}
.mle-stay-contact-hours{font-size:12px;color:#57677f}
.mle-stay-contact-link{display:inline-block;width:fit-content;max-width:100%;font-size:clamp(17px,4.5vw,23px);font-weight:800;line-height:1.3;text-decoration:none;color:#1d5df0;overflow-wrap:anywhere}
.mle-stay-contact-link:hover{text-decoration:underline}
.mle-stay-guide-card{border:1px solid #e3e9f2;border-radius:24px;padding:16px;background:#fff;box-shadow:0 6px 23px rgba(15,23,42,.045);min-width:0}
.mle-stay-guide-title{display:flex;align-items:center;gap:10px;font-weight:800;font-size:clamp(18px,5vw,23px);line-height:1.25;letter-spacing:-.02em;margin:0 0 16px;color:#152642}
.mle-stay-guide-title-icon{width:37px;height:37px;border-radius:12px}
.mle-stay-guide-panels{display:grid;gap:12px}
.mle-stay-guide-panel{padding:16px;border-radius:20px;min-width:0;background:#eff6fd}
.mle-stay-guide-panel.mle-stay-departure{background:#fbf7ef}
.mle-stay-guide-panel h4{display:flex;align-items:center;gap:10px;color:#195ce2;font-size:17px;font-weight:800;line-height:1.35;margin:0 0 11px}
.mle-stay-guide-panel .mle-stay-panel-icon{width:34px;height:34px;border-radius:50%;background:#dfeeff}
.mle-stay-departure .mle-stay-panel-icon{background:#fff0cf;color:#cc8311}
.mle-stay-guide-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.mle-stay-guide-list li{display:flex;align-items:flex-start;gap:11px;font-size:14px;line-height:1.55;color:#283a52;overflow-wrap:anywhere}
.mle-stay-guide-dot{display:inline-flex;justify-content:center;align-items:center;min-width:20px;height:20px;flex:0 0 20px;background:#e0effd;border-radius:50%;color:#1862c8;font-size:12px;font-weight:800;margin-top:1px}
.mle-stay-departure .mle-stay-guide-dot{color:#be7c17;background:#f8e8ca}
.mle-stay-guide .mle-stay-muted{color:#66758b;font-size:13px;line-height:1.5;margin:0}
.mle-stay-guide-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.mle-stay-explore{display:flex;align-items:center;justify-content:center;gap:10px;flex:1 1 200px;min-height:46px;text-align:center;background:#2161e9;color:white!important;border-radius:999px;padding:10px 14px;font-weight:750;font-size:14px;text-decoration:none!important;box-shadow:0 4px 12px rgba(37,99,235,.14)}
.mle-stay-explore .mle-stay-lucide{width:18px;height:18px}
.mle-stay-explore span:last-child{font-size:23px;line-height:14px}
.mle-stay-explore:hover{background:#1749be}
.mle-stay-offers{display:inline-flex;justify-content:center;align-items:center;min-height:43px;border-radius:999px;border:1px solid #d4e3fa;padding:9px 16px;background:white;color:#205bd1!important;font-weight:700;font-size:13px;text-decoration:none!important}
.mle-stay-explore:focus-visible,.mle-stay-offers:focus-visible,.mle-stay-contact-link:focus-visible{outline:3px solid #60a5fa;outline-offset:3px}
@media(min-width:640px){.mle-stay-guide-panels{grid-template-columns:1fr 1fr}.mle-stay-guide-card{padding:23px}.mle-stay-guide-panel{padding:18px}.mle-stay-guide-list li{font-size:15px}}
@media(max-width:380px){.mle-stay-guide-card{padding:12px}.mle-stay-guide-panel{padding:13px}.mle-stay-contact{padding:13px}.mle-stay-guide-actions{gap:7px}.mle-stay-explore{flex-basis:100%}.mle-stay-offers{width:100%}}

/* MYLOCALEXPLORE 2.4.57 — compact lodging image, one reservation control, elegant offers.
   All selectors are scoped to the public accommodation UI. */
.mle-public-stay-hero{
  display:block; height:clamp(118px,30vw,165px); object-fit:cover;
  object-position:center 53%;
}
.mle-stay-private-area{
  min-width:0; border:1px solid #e0e9f6; border-radius:22px;
  padding:12px; background:#f8fbff;
  box-shadow:0 6px 20px rgba(24,64,130,.045);
}
.mle-stay-private-trigger{
  appearance:none; -webkit-appearance:none; display:flex;
  justify-content:center; align-items:center; text-align:center;
  width:100%; min-height:50px; border:0; border-radius:999px;
  background:#2361e8; padding:12px 17px;
  color:white; font-size:clamp(13px,3.7vw,16px); line-height:1.35;
  font-weight:750; cursor:pointer;
  box-shadow:0 5px 14px rgba(31,96,225,.19);
  transition:background .15s ease,transform .15s ease;
}
.mle-stay-private-trigger:hover{background:#174fcb}
.mle-stay-private-trigger:active{transform:scale(.99)}
.mle-stay-private-trigger:focus-visible{outline:3px solid #7db7ff;outline-offset:3px}
/* 2.4.56 used a flexible split row; keep the visitor actions full width. */
.mle-stay-guide-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;width:100%}
.mle-stay-explore{width:100%;min-height:49px;flex:auto}
.mle-stay-offers{
  position:relative;display:flex;align-items:center;justify-content:flex-start;
  gap:12px;box-sizing:border-box;width:100%;min-width:0;min-height:56px;
  padding:9px 16px;border-radius:20px;overflow:hidden;
  border:1px solid #c9daf8;background:linear-gradient(105deg,#fff 0%,#f8fbff 69%,#eef6ff 100%);
  color:#1b55c4!important;text-align:left;text-decoration:none!important;
  box-shadow:0 5px 13px rgba(19,66,143,.085);
  transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.mle-stay-offers::after{
  content:"";position:absolute;z-index:0;right:-25px;bottom:-51px;
  width:148px;height:107px;border-radius:50%;
  background:radial-gradient(ellipse at 50% 20%,#d2e9ff 4%,#e9f6ff 57%,transparent 73%);
  pointer-events:none;
}
.mle-stay-offers:hover{border-color:#8bb7ff;background:#f1f7ff;transform:translateY(-1px)}
.mle-stay-offers-icon,.mle-stay-offers-label,.mle-stay-offers-chevron{position:relative;z-index:1}
.mle-stay-offers-icon{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 39px;
  width:39px;height:39px;border-radius:50%;background:#e3efff;color:#1e61d7;
}
.mle-stay-offers-icon svg{width:20px;height:20px}
.mle-stay-offers-label{min-width:0;font-size:clamp(14px,4.1vw,17px);font-weight:800;line-height:1.3}
.mle-stay-offers-chevron{margin-left:auto;font-size:27px;font-weight:600;line-height:1;color:#2765d5}
@media(max-width:380px){
  .mle-stay-private-area{padding:9px;border-radius:20px}
  .mle-stay-private-trigger{padding:12px 10px}
  .mle-stay-offers{padding:8px 12px;gap:9px}
}
@media(prefers-reduced-motion:reduce){
  .mle-stay-offers,.mle-stay-private-trigger{transition:none}
}

/* 2.4.59 : stable image box while stay data and remote images load. */
#root [data-testid="housing-card"] > img {
  display: block;
  object-fit: cover;
  background: #eaf2ff;
  color: transparent;
  overflow: hidden;
}

/* 2.4.61 — iOS/Android keyboard, safe areas and installation-dialog stability. */
@media (max-width: 639.98px) {
  /* The bottom bar must never cover a focused text field or an on-screen keyboard. */
  html.mle-keyboard-visible #root > div > nav {
    visibility: hidden;
    pointer-events: none;
  }
  html.mle-keyboard-visible #root > div > main {
    padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));
  }
  /* The chat remains usable with the virtual keyboard: do not hide MyAssistant. */
  html.mle-keyboard-visible #mle-myassistant.mle-ma-open {
    bottom: calc(8px + var(--mle-keyboard-gap, 0px));
  }
  html.mle-keyboard-visible #mle-myassistant .mle-ma-panel {
    max-height: max(120px, calc(var(--mle-visual-height, 100dvh) - 95px));
  }
  #root > div > nav [data-testid^="bottom-nav-"]:focus-visible {
    outline: 3px solid #2563eb;
    outline-offset: -3px;
  }
}
[data-testid="installation-popup"] {
  max-height: min(calc(100dvh - 16px), calc(var(--mle-visual-height, 100dvh) - 12px)) !important;
  padding-bottom: max(14px, env(safe-area-inset-bottom, 0px));
  overscroll-behavior: contain;
}
/* A dialogue may contain many languages and actions on landscape or small screens. */
@media (max-height: 480px) {
  [data-testid="installation-popup"] { padding-top: 12px; }
  [data-testid="installation-popup"] .mle-install-sections { gap: 6px; }
}