/* Domus Suisse - en-tete et menu mobiles (< 992 px, la ou Houzez affiche #header-mobile).
   En-tete fixe de 56 px qui s'efface a la lecture (domus-mobile-header.js ajoute
   html.dmh-hide), loupe de recherche, menu plein ecran a deux niveaux.
   Charte : #1E4D59, rayon 6px, sans ombre. Sans JS : en-tete fixe, toujours visible. */

@media (max-width: 991.98px) {

  :root { --dmh-h: 56px; --dmh-top: 56px; }
  html.dmh-hide { --dmh-top: 0px; }
  body { padding-top: var(--dmh-h) !important; }

  /* --- En-tete ------------------------------------------------------------- */
  .header-main-wrap {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 900 !important;
    background: #FFFFFF;
    transition: transform 170ms ease;
  }
  body.admin-bar .header-main-wrap { top: 46px; }
  html.dmh-hide .header-main-wrap { transform: translateY(-100%); }

  #header-mobile {
    height: var(--dmh-h);
    box-sizing: border-box;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    padding: 0 4px !important;
    background: #FFFFFF;
    border-bottom: 1px solid rgba(30, 77, 89, 0.14);
    box-shadow: none !important;
  }
  #header-mobile .header-mobile-left { justify-self: start; }
  #header-mobile .header-mobile-center { flex: none !important; justify-self: center; padding: 0 !important; text-align: center; }
  #header-mobile .header-mobile-right { justify-self: end; display: flex; align-items: center; }
  #header-mobile .logo-mobile img { display: block; height: 24px; width: auto; max-width: 100%; }
  #header-mobile .btn {
    width: 44px;
    height: 48px;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0 !important;
    background: transparent !important;
    color: #1E4D59 !important;
    font-size: 22px;
    box-shadow: none !important;
  }
  #header-mobile .toggle-button-left { width: 48px; }
  #header-mobile .dmh-search svg { display: block; }

  /* La barre "Rechercher" collante sous l'en-tete est supprimee : la loupe de l'en-tete la remplace. */
  .mobile-search-nav { display: none !important; }

  /* --- Menu plein ecran ------------------------------------------------------ */
  .offcanvas-mobile-menu {
    width: 100% !important;
    max-width: 420px;
    display: flex !important;
    flex-direction: column;
  }
  .offcanvas-mobile-menu .offcanvas-header {
    flex: none;
    height: 56px;
    box-sizing: border-box;
    padding: 0 4px 0 20px;
    border-bottom: 1px solid rgba(30, 77, 89, 0.14);
  }
  .offcanvas-mobile-menu .offcanvas-title {
    font: 600 17px Raleway, sans-serif !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #1E4D59;
  }
  .offcanvas-mobile-menu .btn-close {
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1E4D59;
    opacity: 1;
  }
  .offcanvas-mobile-menu-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0 20px !important; }

  #mobile-main-nav { margin: 0; padding: 0; }
  #mobile-main-nav > li { position: relative; list-style: none; border-bottom: 1px solid rgba(30, 77, 89, 0.14); }
  #mobile-main-nav > li > a.nav-link,
  #mobile-main-nav > li > a.dmh-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 56px;
    padding: 0 48px 0 0 !important;
    font: 600 17px/1.2 Raleway, sans-serif !important;
    color: #1E4D59 !important;
    text-decoration: none;
  }
  #mobile-main-nav > li > .nav-mobile-trigger {
    position: absolute;
    top: 4px;
    right: -6px;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1E4D59;
    cursor: pointer;
  }
  #mobile-main-nav > li.dmh-open > .nav-mobile-trigger i { transform: rotate(180deg); }

  /* Niveau "Trouver un logement" : deplie, groupes A louer / A vendre en pastilles. */
  #mobile-main-nav li.dmh-open > .dropdown-menu {
    display: block !important;
    position: static !important;
    float: none;
    min-width: 0;
    margin: 0 !important;
    padding: 0 0 16px !important;
    border: 0;
    background: transparent;
    box-shadow: none;
    transform: none !important;
  }
  #mobile-main-nav li.dmh-open > .dropdown-menu > li { list-style: none; }
  #mobile-main-nav li.dmh-open > .dropdown-menu > li:not(.dmh-group) > a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0 !important;
    font: 500 15px Inter, sans-serif;
    color: #1E4D59;
    background: transparent;
    text-decoration: none;
  }
  #mobile-main-nav li.dmh-group { padding: 0 0 16px; }
  #mobile-main-nav li.dmh-group > .nav-mobile-trigger,
  #mobile-main-nav li.dmh-group > a.dmh-hidden { display: none !important; }
  #mobile-main-nav .dmh-label {
    margin: 0 0 8px;
    font: 600 12px Raleway, sans-serif;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: #1E4D59;
  }
  #mobile-main-nav li.dmh-group > .dropdown-menu {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    position: static !important;
    float: none;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: 0;
    background: transparent;
    box-shadow: none;
    transform: none !important;
  }
  #mobile-main-nav li.dmh-group > .dropdown-menu > li { list-style: none; }
  #mobile-main-nav li.dmh-group > .dropdown-menu a {
    display: flex;
    align-items: center;
    height: 44px;
    box-sizing: border-box;
    padding: 0 14px !important;
    border-radius: 6px;
    background: #F1F5F6;
    border: 1px solid rgba(30, 77, 89, 0.14);
    font: 500 15px Inter, sans-serif;
    color: #214847;
    white-space: nowrap;
    text-decoration: none;
  }
  #mobile-main-nav .domus-lang-switcher { display: none !important; }
  #mobile-main-nav .dmh-badge {
    min-width: 22px;
    height: 22px;
    box-sizing: border-box;
    padding: 0 6px;
    border-radius: 4px;
    background: #1E4D59;
    color: #FFFFFF;
    font: 600 13px/22px Inter, sans-serif;
    text-align: center;
  }

  /* Pied du menu : langue + creer une annonce. */
  .dmh-foot {
    flex: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px 20px calc(20px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(30, 77, 89, 0.14);
    background: #FFFFFF;
  }
  .dmh-lang { display: flex; gap: 4px; padding: 4px; background: #F1F5F6; border: 1px solid rgba(30, 77, 89, 0.14); border-radius: 6px; }
  .dmh-lang a, .dmh-lang span {
    flex: 1;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font: 600 15px Inter, sans-serif;
    color: #1E4D59;
    text-decoration: none;
  }
  .dmh-lang [aria-current] { background: #1E4D59; color: #FFFFFF; }
  .dmh-cta {
    height: 52px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: #1E4D59;
    color: #FFFFFF !important;
    font: 600 16px Inter, sans-serif;
    text-decoration: none;
  }
  .dmh-cta:hover { background: #163A46; }

  /* Compte : invite, membre ou pro (rendu par domus-mobile-header.js). */
  #mobile-main-nav > li.dmh-account { list-style: none; border-bottom: 1px solid rgba(30, 77, 89, 0.14); padding: 16px 0; }
  #mobile-main-nav > li.dmh-account .dmh-label { margin: 0 0 10px; }
  .dmh-acc-list { display: flex; flex-direction: column; gap: 8px; }
  .dmh-acc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .dmh-acc-list a,
  .dmh-acc-list button {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 44px;
    padding: 0 12px;
    border-radius: 6px;
    border: 1px solid rgba(30, 77, 89, 0.14);
    background: #F1F5F6;
    color: #214847;
    font: 500 15px Inter, sans-serif;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
  }
  .dmh-acc-list .dmh-acc-primary { min-height: 48px; background: #1E4D59; border-color: #1E4D59; color: #FFFFFF; font-weight: 600; }
  .dmh-acc-list .dmh-acc-primary:hover { background: #163A46; }

  /* Groupes repliables sans sous-menu (ex. Outils, Ajouter un bien). */
  #mobile-main-nav > li:not(.dmh-open) > .dropdown-menu { display: none !important; }
  #mobile-main-nav .dmh-chev { display: block; width: 9px; height: 9px; margin: 0 auto 4px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); }
  #mobile-main-nav > li.dmh-open > .nav-mobile-trigger .dmh-chev { transform: rotate(-135deg); margin: 4px auto 0; }

  /* Pied compact : une seule ligne (langue + creer une annonce). */
  .dmh-foot { flex-direction: row; align-items: center; gap: 10px; padding: 10px 20px calc(10px + env(safe-area-inset-bottom)); }
  .dmh-lang { flex: 0 0 auto; width: 168px; }
  .dmh-lang a, .dmh-lang span { height: 40px; }
  .dmh-cta { flex: 1 1 auto; height: 44px; font-size: 15px; }

  /* Traits limites : un seul separateur, sous l'en-tete. */
  #mobile-main-nav > li,
  #mobile-main-nav > li.dmh-account { border-bottom: 0 !important; }
  #mobile-main-nav > li.dmh-account { padding: 12px 0 8px; }
  #mobile-main-nav > li > a.nav-link,
  #mobile-main-nav > li > a.dmh-row { min-height: 52px; }
  .dmh-foot { border-top: 0; }
  .dmh-lang { border: 0; }
  .dmh-acc-list a,
  .dmh-acc-list button { border: 0; }
  #mobile-main-nav li.dmh-group > .dropdown-menu a { border: 0; }

  /* Traits : la regle Houzez pose une bordure sous chaque lien (a), pas sous le li. */
  #mobile-main-nav > li > a.nav-link,
  #mobile-main-nav > li > a.dmh-row,
  #mobile-main-nav > li.dmh-open > a.nav-link { border-bottom: 0 !important; }

  /* Pastilles : grille 2 colonnes, Tous les biens en pleine largeur. */
  #mobile-main-nav li.dmh-group > .dropdown-menu { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; }
  #mobile-main-nav li.dmh-group > .dropdown-menu > li { min-width: 0; }
  #mobile-main-nav li.dmh-group > .dropdown-menu > li:first-child { grid-column: 1 / -1; }
  #mobile-main-nav li.dmh-group > .dropdown-menu > li > a { width: 100%; justify-content: center; text-align: center; white-space: normal; }

  /* Pas de defilement horizontal dans le menu : colonnes bornees, contenu contenu dans le panneau. */
  .offcanvas-mobile-menu,
  .offcanvas-mobile-menu-body { overflow-x: hidden; }
  #mobile-main-nav { width: 100%; min-width: 0; }
  #mobile-main-nav li.dmh-group > .dropdown-menu { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .dmh-acc-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .dmh-acc-list a,
  .dmh-acc-list button { max-width: 100%; min-width: 0; }

  /* Pastilles : disposition en flex, largeurs explicites (une pleine ligne, deux demi-lignes). */
  #mobile-main-nav li.dmh-group > .dropdown-menu { display: flex !important; flex-wrap: wrap; gap: 8px; width: 100%; box-sizing: border-box; }
  #mobile-main-nav li.dmh-group > .dropdown-menu > li { flex: 0 0 calc(50% - 4px); width: calc(50% - 4px); max-width: calc(50% - 4px); min-width: 0; box-sizing: border-box; }
  #mobile-main-nav li.dmh-group > .dropdown-menu > li:first-child { flex: 0 0 100%; width: 100%; max-width: 100%; }
  #mobile-main-nav li.dmh-group > .dropdown-menu > li > a { display: flex; width: 100%; box-sizing: border-box; min-width: 0; overflow: hidden; text-overflow: ellipsis; justify-content: center; }

  /* Header droit : nom de l'utilisateur connecte, sans icone ni cadre. */
  .header-mobile-right .toggle-button-right.dmh-user { border: 0; background: none; box-shadow: none; padding: 0 4px; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #1E4D59; font: 600 15px Inter, sans-serif; }

  /* Icones du menu. */
  .dmh-ico { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 22px; width: 22px; height: 22px; color: #1E4D59; }
  .dmh-ico svg { display: block; width: 22px; height: 22px; }
  .dmh-acc-list .dmh-acc-primary .dmh-ico { color: #FFFFFF; }
  .dmh-acc-list a .dmh-ico,
  .dmh-acc-list button .dmh-ico { margin-right: 10px; }
  .dmh-acc-grid a { justify-content: flex-start; }
  .dmh-acc-grid a .dmh-ico { margin-right: 8px; }
}

@media (max-width: 991.98px) and (prefers-reduced-motion: reduce) {
  .header-main-wrap { transition: none; }
}


/* Recherche mobile : une seule loupe (encadree, domus-search-trigger). La loupe non encadree .dmh-search est masquee. Le bouton compte n'apparait qu'une fois l'utilisateur connecte (classe dmh-user posee par le JS), pour ne pas flasher l'ancienne icone au chargement. */
@media (max-width: 991.98px) {
  #header-mobile .dmh-search { display: none !important; }
  #header-mobile .header-mobile-right .toggle-button-right:not(.dmh-user) { display: none !important; }
}
