/* ========================================================================== */
/* ETHNOS R166 — médias sur une ligne et profil responsive ciblé             */
/* Base : R165. Correctifs validés le 4 août 2026.                            */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* PHOTOS / DOCUMENTS — nom sous la vignette, verrouillé sur UNE seule ligne. */
/* La ligne du nom occupe toute la largeur du bandeau afin que « Photo de     */
/* profil » et les futurs noms de documents ne se coupent plus en deux.       */
/* -------------------------------------------------------------------------- */
html body .memberMediaBand{
  min-height:0 !important;
  grid-template-columns:minmax(84px,1fr) auto !important;
  grid-template-rows:auto auto !important;
  grid-template-areas:
    "visual actions"
    "copy copy" !important;
  column-gap:12px !important;
  row-gap:6px !important;
  align-items:start !important;
}
html body .memberMediaBandFile{display:contents !important}
html body .memberMediaBandVisual{
  grid-area:visual !important;
  justify-self:start !important;
  align-self:center !important;
}
html body .memberMediaBandActions{
  grid-area:actions !important;
  justify-self:end !important;
  align-self:center !important;
  margin:0 !important;
}
html body .memberMediaBandCopy{
  grid-area:copy !important;
  grid-column:1 / -1 !important;
  box-sizing:border-box !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  overflow:hidden !important;
  text-align:left !important;
}
html body .memberMediaBandCopy strong{
  display:block !important;
  box-sizing:border-box !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  text-overflow:ellipsis !important;
  line-height:1.08 !important;
  text-align:left !important;
}
html body .memberMediaBandCopy small{display:none !important}

@media (max-width:1750px){
  html body .memberMediaBand{column-gap:10px !important;row-gap:5px !important}
  html body .memberMediaBandCopy strong{font-size:15px !important}
}
@media (max-width:1600px) and (max-height:920px){
  html body .memberMediaBand{
    grid-template-columns:minmax(78px,1fr) auto !important;
    column-gap:9px !important;
    row-gap:4px !important;
    padding-top:8px !important;
    padding-bottom:8px !important;
  }
  html body .memberMediaBandCopy strong{font-size:13px !important}
}
@media (min-width:1650px) and (max-width:1750px) and (min-height:980px) and (max-height:1120px){
  html body .memberMediaBandCopy strong{font-size:14px !important}
}
@media (min-width:1200px) and (max-width:1299px) and (max-height:760px){
  html body .memberMediaBandCopy strong{font-size:12px !important}
}

/* -------------------------------------------------------------------------- */
/* CARTE PROFIL HAUTE — pseudo exact, retours autorisés uniquement aux        */
/* majuscules déjà préparées par le JS. Le bloc texte est remonté pour que    */
/* les pseudos longs utilisent proprement les deux lignes disponibles.        */
/* -------------------------------------------------------------------------- */
html body .memberProfileCompact:not(.isExpanded) .memberIdentityText{
  min-width:0 !important;
  max-width:100% !important;
}
html body .memberProfileCompact:not(.isExpanded) .memberIdentity h2{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  white-space:normal !important;
  overflow:visible !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  hyphens:none !important;
  text-overflow:clip !important;
  line-height:.93 !important;
}
@media (min-width:1760px){
  html body .memberProfileCompact:not(.isExpanded) .memberIdentityText{
    transform:translateY(-6px) !important;
  }
  html body .memberProfileCompact:not(.isExpanded) .memberProfileMetaRow{
    margin-top:3px !important;
  }
}

/* -------------------------------------------------------------------------- */
/* VOLET PROFIL — « Langue principale » et les boutons ne se coupent plus.   */
/* Sous 1750 px, les deux informations passent sur deux lignes compactes :    */
/* aucune collision entre « Résidence » et « Langue principale ».            */
/* -------------------------------------------------------------------------- */
@media (min-width:1200px) and (max-width:1750px){
  html body .memberProfileDrawer .memberProfileDetailsInline{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:4px !important;
  }
  html body .memberProfileDrawer .memberProfileDetailsInline > div{
    display:grid !important;
    grid-template-columns:112px minmax(0,1fr) !important;
    align-items:center !important;
    column-gap:6px !important;
    min-width:0 !important;
  }
  html body .memberProfileDrawer .memberProfileDetailsInline dt{
    display:block !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    white-space:nowrap !important;
    overflow:visible !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    text-overflow:clip !important;
    font-size:9px !important;
    line-height:1 !important;
    letter-spacing:.02em !important;
  }
  html body .memberProfileDrawer .memberProfileDetailsInline dd{
    min-width:0 !important;
    margin:0 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  html body .memberProfileDrawer .memberEdit,
  html body .memberProfileDrawer .memberLogout,
  html body .memberProfileDrawer .memberProfileBottomClose{
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    line-height:1 !important;
    text-align:center !important;
  }
}
@media (min-width:1300px) and (max-width:1600px){
  html body .memberProfileDrawer .memberProfileDetailsInline > div{
    grid-template-columns:104px minmax(0,1fr) !important;
  }
  html body .memberProfileDrawer .memberProfileDetailsInline dt{font-size:8px !important}
}

/* 1710 × 1067 : actions compactes et strictement sur une ligne. */
@media (min-width:1650px) and (max-width:1750px) and (min-height:980px) and (max-height:1120px){
  html body .memberProfileDrawer .memberProfileActions{
    grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr) !important;
    gap:8px !important;
  }
  html body .memberProfileDrawer .memberEdit,
  html body .memberProfileDrawer .memberLogout{
    min-height:40px !important;
    padding:0 8px !important;
    font-size:11px !important;
  }
}

/* 1280 × 712 : profil compact, bouclier ≈ -30 %, statistiques et actions     */
/* réduites, sans aucune coupure de libellé.                                  */
@media (min-width:1200px) and (max-width:1299px) and (max-height:760px){
  html body .memberProfileDrawer{
    padding:6px 10px 10px !important;
  }
  html body .memberProfileDrawer > .memberProfileDetails{
    padding:7px 9px !important;
  }
  html body .memberProfileDrawer .memberProfileDetailsInline{
    grid-template-columns:minmax(0,1fr) !important;
    gap:3px !important;
  }
  html body .memberProfileDrawer .memberProfileDetailsInline > div{
    grid-template-columns:92px minmax(0,1fr) !important;
    column-gap:4px !important;
  }
  html body .memberProfileDrawer .memberProfileDetailsInline dt,
  html body .memberProfileDrawer .memberProfileDetails dt{
    font-size:8px !important;
    line-height:1 !important;
  }
  html body .memberProfileDrawer .memberProfileDetails dd{
    margin-top:3px !important;
    font-size:9px !important;
    line-height:1.05 !important;
  }

  html body .memberProfileDrawer > .memberTrophies{
    padding:5px 8px 6px !important;
  }
  html body .memberProfileDrawer .memberTrophyIntro{
    gap:4px !important;
  }
  html body .memberProfileDrawer .memberTrophyIntro > img{
    width:78px !important;
    height:78px !important;
    filter:drop-shadow(0 4px 6px rgba(7,26,57,.10)) !important;
  }
  html body .memberProfileDrawer .memberTrophyCopy span{
    font-size:12px !important;
    line-height:1.02 !important;
  }
  html body .memberProfileDrawer .memberTrophyCopy p{
    margin-top:2px !important;
    font-size:8px !important;
    line-height:1.05 !important;
  }

  html body .memberProfileDrawer > .memberStats{
    padding:0 2px !important;
    gap:4px !important;
  }
  html body .memberProfileDrawer .memberStats div{
    min-height:34px !important;
    padding:3px 1px !important;
  }
  html body .memberProfileDrawer .memberStats b{
    font-size:12px !important;
    line-height:1 !important;
  }
  html body .memberProfileDrawer .memberStats span{
    font-size:5.5px !important;
    line-height:1.02 !important;
    letter-spacing:0 !important;
  }

  html body .memberProfileDrawer .memberProfileActions{
    grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr) !important;
    gap:5px !important;
    margin-top:5px !important;
  }
  html body .memberProfileDrawer .memberEdit,
  html body .memberProfileDrawer .memberLogout{
    min-height:28px !important;
    padding:0 4px !important;
    border-radius:7px !important;
    font-size:8px !important;
    box-shadow:0 3px 8px rgba(7,26,57,.06) !important;
  }
  html body .memberProfileDrawer .memberProfileBottomClose{
    min-height:30px !important;
    margin-top:6px !important;
    border-radius:8px !important;
    font-size:9px !important;
    box-shadow:0 4px 10px rgba(7,26,57,.08) !important;
  }
}