/* ========================================================================== */
/* ETHNOS R149 — centrages Messages et Annuaire responsive                    */
/* Base : R148. Corrections ciblées du 4 août 2026.                           */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* 1 — Messages : le champ de recherche prend son axe sur la colonne           */
/*     Conversations, jamais sur le volet complet.                             */
/* -------------------------------------------------------------------------- */
html body .memberMessagesDrawer .memberMessageSidebar > div:nth-child(2){
  box-sizing:border-box !important;
  width:100% !important;
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  justify-items:center !important;
}
html body .memberMessagesDrawer .memberMessageSearch{
  box-sizing:border-box !important;
  width:calc(100% - 51px) !important;
  max-width:calc(100% - 51px) !important;
  margin:12px 0 !important;
  justify-self:center !important;
  align-self:center !important;
  inset-inline:auto !important;
  left:auto !important;
  right:auto !important;
  transform:none !important;
}
html body .memberMessagesDrawer .memberMessageSubfilters{
  box-sizing:border-box !important;
  width:100% !important;
  min-width:0 !important;
  justify-self:stretch !important;
}

/* 1536 × 864 et formats inférieurs : 40 px de moins que la largeur compacte  */
/* précédente, tout en conservant exactement le même axe horizontal.          */
@media (max-width:1536px){
  html body .memberMessagesDrawer .memberMessageSearch{
    width:calc(100% - 118px) !important;
    max-width:calc(100% - 118px) !important;
  }
}

/* -------------------------------------------------------------------------- */
/* 2 — Annuaire : retrait du double espace supérieur hérité de l'ancien shell, */
/*     centrage symétrique et typographies adaptées jusqu'à 1920 × 1080.       */
/* -------------------------------------------------------------------------- */
@media (max-width:1920px) and (max-height:1080px){
  html body .memberDirectoryShell{
    box-sizing:border-box !important;
    width:100% !important;
    padding:0 !important;
  }
  html body .memberDirectoryHeader{
    box-sizing:border-box !important;
    width:100% !important;
    padding:15px 18px 12px !important;
    text-align:center !important;
  }
  html body .memberDirectoryHeader h2{
    width:100% !important;
    margin:0 auto !important;
    font-size:27px !important;
    line-height:1.04 !important;
    text-align:center !important;
  }
  html body .memberDirectoryHeader h2 small{
    font-size:.44em !important;
  }
  html body .memberDirectoryHeader p{
    width:100% !important;
    max-width:none !important;
    margin:6px auto 0 !important;
    font-size:10px !important;
    line-height:1.35 !important;
    text-align:center !important;
  }
  html body .memberDirectoryContent{
    box-sizing:border-box !important;
    width:100% !important;
    padding:11px 14px 4px !important;
  }
  html body .memberDirectorySection,
  html body .memberDirectoryNameForm,
  html body .memberDirectoryInlineSearch,
  html body .memberDirectoryLocationForm,
  html body .memberDirectoryLetterForm,
  html body .memberDirectoryAlphabet{
    box-sizing:border-box !important;
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  html body .memberDirectorySection h3{
    font-size:17px !important;
    line-height:1.08 !important;
    text-align:center !important;
  }
  html body .memberDirectoryDrawer label,
  html body .memberDirectoryNameForm>p{
    font-size:9px !important;
    line-height:1.3 !important;
    text-align:center !important;
  }
  html body .memberDirectoryDrawer input,
  html body .memberDirectoryDrawer select,
  html body .memberDirectoryDrawer form button,
  html body .memberDirectoryLocationForm>button,
  html body .memberDirectoryLocationForm .realFlagSelectButton{
    font-size:10px !important;
  }
  html body .memberDirectoryAlphabet button{
    font-size:10px !important;
  }
  html body .memberDirectoryShell > .memberDrawerCloseButton{
    font-size:13px !important;
  }
}

/* 1536 × 864 et moins : version plus compacte, sans modifier la structure. */
@media (max-width:1600px) and (max-height:920px){
  html body .memberDirectoryHeader{
    padding:10px 12px 8px !important;
  }
  html body .memberDirectoryHeader h2{
    font-size:22px !important;
  }
  html body .memberDirectoryHeader h2 small{
    font-size:.43em !important;
  }
  html body .memberDirectoryHeader p{
    margin-top:4px !important;
    font-size:8.5px !important;
    line-height:1.28 !important;
  }
  html body .memberDirectoryContent{
    padding:8px 10px 3px !important;
  }
  html body .memberDirectorySection{
    padding-bottom:9px !important;
    margin-bottom:9px !important;
  }
  html body .memberDirectorySection h3{
    margin-bottom:6px !important;
    font-size:14px !important;
  }
  html body .memberDirectoryDrawer label{
    margin-bottom:4px !important;
    font-size:8px !important;
  }
  html body .memberDirectoryNameForm>p{
    margin-top:4px !important;
    font-size:7px !important;
  }
  html body .memberDirectoryDrawer input,
  html body .memberDirectoryDrawer select,
  html body .memberDirectoryDrawer form button,
  html body .memberDirectoryLocationForm>button,
  html body .memberDirectoryLocationForm .realFlagSelectButton{
    font-size:9px !important;
  }
  html body .memberDirectoryAlphabet button{
    font-size:9px !important;
  }
  html body .memberDirectoryShell > .memberDrawerCloseButton{
    font-size:11px !important;
  }
}
