/* ========================================================================== */
/* ETHNOS R143 — finitions Messages, Favoris et navigation basse              */
/* Base : R142. Modifications ciblées du 3 août 2026.                         */
/* ========================================================================== */

/* 1 — Un seul axe horizontal pour tous les bandeaux des volets Messages. */
html body .memberMessagesDrawer .memberMessageCenter{
  --r143-message-header-height:clamp(122px,15.2vh,164px);
}
html body .memberMessagesDrawer .memberMessageDashboardHeader,
html body .memberMessagesDrawer .memberMessageWorkspaceHeader,
html body .memberMessagesDrawer .memberMessageSideDrawerHeader{
  box-sizing:border-box !important;
  width:100% !important;
  height:var(--r143-message-header-height) !important;
  min-height:var(--r143-message-header-height) !important;
  max-height:var(--r143-message-header-height) !important;
  margin:0 !important;
  border-top:0 !important;
  border-left:0 !important;
  border-right:0 !important;
}
html body .memberMessagesDrawer .memberMessageDashboardHeader,
html body .memberMessagesDrawer .memberMessageSideDrawerHeader{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
html body .memberMessagesDrawer .memberMessageWorkspaceHeader{
  align-items:center !important;
}
html body .memberMessagesDrawer .memberMessageWorkspace,
html body .memberMessagesDrawer .memberMessageSideDrawer,
html body .memberMessagesDrawer .memberMessageDashboard{
  top:0 !important;
  bottom:0 !important;
}

/* 2 — Bouton + décollé de la séparation verticale. */
html body .memberMessagesDrawer [data-new-private-room]{
  flex:0 0 auto !important;
  transform:translateX(-4px) !important;
}
html body .memberMessagesDrawer [data-new-private-room]:hover,
html body .memberMessagesDrawer [data-new-private-room]:focus-visible{
  transform:translateX(-4px) translateY(-1px) !important;
}

/* 3 — Invitations créées depuis un nouveau salon : nom du salon bien lisible. */
html body .memberMessagesDrawer .memberInvitationFacts.hasRoomName{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}
html body .memberMessagesDrawer .memberInvitationFacts.hasRoomName>div:first-child{
  background:var(--profile-cream-trophy) !important;
  border-color:rgba(242,103,34,.22) !important;
}
html body .memberMessagesDrawer .memberInvitationFacts.hasRoomName>div:first-child b{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* 4 — Champs Conversations : aucun débordement en 1366 et 1635. */
html body .memberMessagesDrawer .memberMessageSidebar,
html body .memberMessagesDrawer .memberMessageMain,
html body .memberMessagesDrawer .memberMessageSearch,
html body .memberMessagesDrawer .memberMessageSearch input,
html body .memberMessagesDrawer .memberMessageComposer,
html body .memberMessagesDrawer .memberMessageComposer textarea{
  min-width:0 !important;
  box-sizing:border-box !important;
}
html body .memberMessagesDrawer .memberMessageSearch{
  width:auto !important;
  max-width:calc(100% - 36px) !important;
}
html body .memberMessagesDrawer .memberMessageComposer textarea{
  width:100% !important;
  max-width:100% !important;
}
@media (max-width:1500px){
  html body .memberMessagesDrawer .memberMessageSearch{
    margin-left:16px !important;
    margin-right:22px !important;
    max-width:calc(100% - 38px) !important;
  }
}
@media (min-width:1501px) and (max-width:1700px),
       (max-width:1500px){
  html body .memberMessagesDrawer .memberMessageComposer{
    grid-template-columns:auto minmax(0,1fr) auto !important;
    gap:6px !important;
    padding-left:13px !important;
    padding-right:13px !important;
  }
  html body .memberMessagesDrawer .memberMessageComposerTools{gap:5px !important}
  html body .memberMessagesDrawer .memberMessageComposerTools button{
    width:36px !important;
    min-width:36px !important;
  }
  html body .memberMessagesDrawer .memberMessageComposerSend{
    min-width:80px !important;
    padding-left:11px !important;
    padding-right:11px !important;
  }
}

/* 5 — Salons favoris : mêmes codes graphiques que Profil et Messages. */
html body .memberFavoritesShell{
  --favorites-cream-main:#fff8ee;
  --favorites-cream-alt:#f8fbf8;
  --favorites-cream-warm:#fff5e9;
  --favorites-navy:#071a39;
  --favorites-orange:#f26722;
  height:100% !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto !important;
  gap:0 !important;
  padding:0 !important;
  color:var(--favorites-navy) !important;
  background:var(--favorites-cream-main) !important;
  background-image:none !important;
}
html body .memberFavoritesShell>header{
  min-height:var(--r143-message-header-height,clamp(122px,15.2vh,164px)) !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  padding:20px clamp(24px,2.2vw,38px) !important;
  border:0 !important;
  border-bottom:1px solid rgba(49,209,207,.28) !important;
  background:linear-gradient(118deg,#03141e 0%,#062431 70%,#083241 100%) !important;
}
html body .memberFavoritesShell>header h2{
  margin:0 !important;
  color:var(--favorites-orange) !important;
  font-family:var(--ethnos-official-title) !important;
  font-size:clamp(28px,2.15vw,40px) !important;
  font-weight:800 !important;
  line-height:1.03 !important;
  letter-spacing:-.025em !important;
}
html body .memberFavoritesShell>header p{
  margin:10px 0 0 !important;
  color:#e2edef !important;
  font-family:Manrope,Inter,"Segoe UI",Arial,sans-serif !important;
  font-size:clamp(13px,.92vw,16px) !important;
  font-weight:650 !important;
  line-height:1.48 !important;
}
html body .memberFavoritesList{
  min-height:0 !important;
  align-content:start !important;
  gap:10px !important;
  padding:clamp(18px,2vw,30px) !important;
  overflow-y:auto !important;
  background:var(--favorites-cream-main) !important;
}
html body .memberFavoriteSalonRow{
  min-height:72px !important;
  box-sizing:border-box !important;
  padding:13px 15px !important;
  border:1px solid rgba(7,26,57,.13) !important;
  border-radius:12px !important;
  background:var(--favorites-cream-alt) !important;
  box-shadow:0 6px 16px rgba(7,26,57,.045) !important;
}
html body .memberFavoriteSalonRow:nth-child(even){
  background:var(--favorites-cream-warm) !important;
}
html body .memberFavoriteSalonRow h3{
  color:var(--favorites-navy) !important;
  font-family:var(--ethnos-official-title) !important;
  font-size:clamp(16px,1.12vw,21px) !important;
  font-weight:700 !important;
}
html body .memberFavoriteSalonRow p{
  color:#617886 !important;
  font-size:clamp(10px,.72vw,12px) !important;
}
html body .memberFavoriteSalonRow button{
  min-height:42px !important;
  padding:0 16px !important;
  border:1px solid var(--favorites-orange) !important;
  border-radius:10px !important;
  background:linear-gradient(180deg,#ff9a58,#f27630) !important;
  color:var(--favorites-navy) !important;
  font-family:var(--ethnos-official-title) !important;
  font-size:clamp(11px,.76vw,14px) !important;
  font-weight:800 !important;
}
html body .memberFavoritesEmpty{
  padding:22px !important;
  border:1px dashed rgba(7,26,57,.20) !important;
  border-radius:12px !important;
  background:var(--favorites-cream-alt) !important;
  color:#657b87 !important;
  font-size:clamp(11px,.76vw,14px) !important;
}
html body .memberFavoritesShell>.memberDrawerCloseButton{
  width:calc(100% - 28px) !important;
  min-width:0 !important;
  min-height:44px !important;
  margin:10px 14px 14px !important;
  padding:0 14px !important;
  border:1px solid var(--favorites-navy) !important;
  border-radius:10px !important;
  background:var(--favorites-navy) !important;
  color:#fffaf3 !important;
  font-family:var(--ethnos-official-title) !important;
  font-size:clamp(13px,.84vw,16px) !important;
  font-weight:800 !important;
  box-shadow:0 8px 18px rgba(7,26,57,.12) !important;
}

/* 6 — La vraie navigation basse va jusqu'à la butée gauche, sous Tchat. */
@media (min-width:901px){
  html body .memberWorldDock{
    left:0 !important;
    right:calc(var(--ethnos-context-width) - 16px) !important;
    box-sizing:border-box !important;
    padding-left:calc(var(--ethnos-search-width) + 49px) !important;
    transform:none !important;
    border-radius:0 16px 16px 0 !important;
    z-index:78 !important;
  }
  html body .memberExplorerPanel{
    position:relative !important;
    z-index:90 !important;
  }
}

/* Petits formats PC : les quatre faits d'une invitation repassent sur deux lignes. */
@media (max-width:1500px){
  html body .memberMessagesDrawer .memberInvitationFacts.hasRoomName{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
