/* ========================================================================== */
/* ETHNOS R186 — finition du volet Tchat                                      */
/* Base stricte : R185.                                                        */
/* ========================================================================== */

/* Onglet Tchat illustré par le clavier, sans flèche décorative. */
html body .r185TchatToggle{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  background-image:
    linear-gradient(90deg,rgba(3,25,38,.94) 0%,rgba(3,25,38,.66) 48%,rgba(3,25,38,.82) 100%),
    url('../assets/images/home-r186/tchat-keyboard.webp') !important;
  background-size:cover !important;
  background-position:center 56% !important;
  background-repeat:no-repeat !important;
}
html body .r185TchatToggle::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-1 !important;
  background:linear-gradient(180deg,rgba(8,51,70,.06),rgba(3,25,38,.42)) !important;
  pointer-events:none !important;
}
html body .r185TchatToggle h2{
  position:relative !important;
  z-index:1 !important;
  color:#fff9ef !important;
  text-shadow:0 3px 13px rgba(0,0,0,.95) !important;
}
html body .r185TchatToggleIcon{display:none !important}

/* Le champ Pays reprend la typographie et l’encoche de l’Annuaire. */
html body .salonQuickSearch .realFlagSelectButton{
  font-family:var(--font-interface,Manrope,"Segoe UI",Arial,sans-serif) !important;
  font-size:clamp(10px,.72vw,12px) !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  line-height:1.2 !important;
  padding-left:14px !important;
  padding-right:42px !important;
}
html body .salonQuickSearch .realFlagSelectButton::after{
  content:"" !important;
  width:8px !important;
  height:8px !important;
  right:15px !important;
  top:50% !important;
  border-right:2px solid #d7e1e3 !important;
  border-bottom:2px solid #d7e1e3 !important;
  color:transparent !important;
  font-size:0 !important;
  transform:translateY(-68%) rotate(45deg) !important;
}
html body .salonQuickSearch .realFlagSelectOption{
  font-family:var(--font-interface,Manrope,"Segoe UI",Arial,sans-serif) !important;
  font-weight:500 !important;
}

/* Bouton Fermer explicite, calqué sur l’action Rechercher. */
html body .r186TchatClose{display:none !important}
@media (min-width:901px){
  html body.isTchatDrawerOpen .memberExplorerPanel{
    display:flex !important;
    flex-direction:column !important;
  }
  html body.isTchatDrawerOpen .memberExplorerBody{
    flex:1 1 auto !important;
  }
  html body.isTchatDrawerOpen .r186TchatClose{
    appearance:none !important;
    display:block !important;
    flex:0 0 38px !important;
    width:72% !important;
    min-width:0 !important;
    height:38px !important;
    min-height:38px !important;
    margin:10px auto 14px !important;
    padding:0 10px !important;
    border:1px solid rgba(255,188,139,.78) !important;
    border-radius:9px !important;
    background:linear-gradient(180deg,#ff9655 0%,#f47f3c 100%) !important;
    color:#071826 !important;
    font-family:var(--font-interface,Manrope,"Segoe UI",Arial,sans-serif) !important;
    font-size:clamp(10px,.72vw,13px) !important;
    font-weight:800 !important;
    line-height:1 !important;
    text-align:center !important;
    box-shadow:0 7px 0 #cf5d25,0 12px 20px rgba(0,0,0,.24) !important;
    cursor:pointer !important;
    transition:transform .16s ease,filter .16s ease,box-shadow .16s ease !important;
  }
  html body.isTchatDrawerOpen .r186TchatClose:hover,
  html body.isTchatDrawerOpen .r186TchatClose:focus-visible{
    filter:brightness(1.06) !important;
    transform:translateY(-1px) !important;
    outline:none !important;
  }
  html body.isTchatDrawerOpen .r186TchatClose:active{
    transform:translateY(4px) !important;
    box-shadow:0 3px 0 #cf5d25,0 7px 12px rgba(0,0,0,.22) !important;
  }
}
@media (max-height:820px) and (min-width:901px){
  html body.isTchatDrawerOpen .r186TchatClose{
    flex-basis:33px !important;
    height:33px !important;
    min-height:33px !important;
    margin:7px auto 10px !important;
  }
}
