a:focus{outline:none}
*{box-sizing:border-box}

html,
body{
  margin:0;
  width:100%;
  height:100%;
  overflow:hidden;
  background:#fff;
}

body{
  font-family:Arial,sans-serif;
  color:#515151;
}

[contenteditable=true]:empty:before{
  content:attr(data-text);
  color:#A4A4A4;
}

[contenteditable=true]:focus{
  outline:none;
}


/* =========================================================
   CHAT PRINCIPAL
   ========================================================= */

.e4f5g6h{
  position:relative;
  width:670px;
  margin:0 auto;
  height:100vh;
  overflow:hidden;
}

.bDCd01x{
  position:relative;
  overflow-y:auto;
  overflow-x:hidden;
  width:100%;
  padding:8px 8px 1px;
  -webkit-overflow-scrolling:touch;
}

.bDCd01x::-webkit-scrollbar{
  width:6px;
}

.bDCd01x::-webkit-scrollbar-thumb{
  background:#ddd;
  border-radius:8px;
}


/* =========================================================
   GROUPE / MEMBRE
   ========================================================= */

.chat-container{
  display:flex;
  width:100%;
  align-items:flex-start;
  margin:0 0 8px;
}

/* V7.6.77 : 20 px réellement ajoutés quand l'auteur change.
   On utilise du padding plutôt qu'une marge haute afin d'éviter
   la fusion des marges verticales avec le bloc précédent. */
.chat-container.user-change-gap{
  padding-top:20px;
}

.message-img{
  width:44px;
  flex:0 0 44px;
  display:flex;
  justify-content:center;
  padding-top:0;
  transform:translateY(-9px);
  cursor:pointer;
}

.message-img img,
.initials{
  width:36px;
  height:36px;
  border-radius:50%;
  object-fit:cover;
}

.initials{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#EEF1F4;
  color:#62809B;
  font-size:14px;
}

.message-wrapper{
  width:calc(100% - 44px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-width:0;
}

.message-name{
  font-size:14px;
  font-weight:700;
  color:#62809B;
  margin:0 0 3px 5px;
  cursor:pointer;
}

.message-stack{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  max-width:min(76%,480px);
}

.message-line{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  width:100%;
}

.message-line:not(.mine-line){
  cursor:pointer;
}

.message-bubble{
  background:#F5F5F5;
  padding:8px 11px;
  border-radius:17px;
  font-size:15px;
  line-height:20px;
  word-break:break-word;
  max-width:100%;
  margin:0 0 2px;
}

.message-bubble.mention{
  border-left:4px solid #62809B;
  background:#E9EEF2;
  padding-left:8px;
}

.message-bubble.has-reply,
.person-row-bubble.has-reply{
  min-width:200px;
}

.mention-name{
  color:#62809B;
  font-weight:700;
  margin-right:5px;
}

.message-date{
  font-size:9px;
  color:#B8B8B8;
  margin:0 5px 3px;
}


/* =========================================================
   PETITE CITATION DE RÉPONSE STYLE TELEGRAM
   ========================================================= */

.reply-quote{
  width:100%;
  min-width:0;
  margin:0 0 6px;
  padding:4px 8px 5px;
  border-left:3px solid #62809B;
  border-radius:7px;
  background:#E8EFF3;
}

.reply-quote-name{
  color:#62809B;
  font-size:13px;
  line-height:16px;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.reply-quote-text{
  color:#4E4E4E;
  font-size:13px;
  line-height:17px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}


/* =========================================================
   MES MESSAGES
   ========================================================= */

.chat-container.mine{
  justify-content:flex-end;
}

.chat-container.mine .message-img{
  order:2;
  margin-left:5px;
  cursor:default;
}

.chat-container.mine .message-wrapper{
  order:1;
  align-items:flex-end;
  width:calc(100% - 49px);
}

.chat-container.mine .message-name{
  margin:0 5px 3px 0;
  text-align:right;
  cursor:default;
}

.chat-container.mine .message-stack{
  align-items:flex-end;
}

.chat-container.mine .message-line{
  align-items:flex-end;
}

.chat-container.mine .message-bubble{
  background:#CBD5DE;
}

.chat-container.mine .message-date{
  margin-right:5px;
}


/* =========================================================
   COMPOSEUR PRINCIPAL
   Pas de bordure haute
   ========================================================= */

.aDEa22S{
  position:fixed;
  bottom:0;
  right:50%;
  margin-right:-335px;
  width:670px;
  background:#fff;
  z-index:700;
  padding-bottom:env(safe-area-inset-bottom);
}

.bSBa29u{
  width:100%;
}

.cA1Lb26Y{
  width:100%;
}

.bCDf40u{
  width:48px;
  vertical-align:bottom;
}

.aDEa24m{
  position:relative;
  border-radius:22px;
  background:#F4F4F4;
  padding:5px;
  margin:7px 0 7px 8px;
  width:calc(100% - 12px);
}

.aDEa25B{
  min-height:28px;
  max-height:104px;
  overflow-y:auto;
  padding:3px 8px;
  color:#515151;
  font-size:18px;
  line-height:23px;
}

.bCDf41C,
.bCDf53v{
  width:36px;
  height:36px;
  border-radius:50%;
  margin:7px 6px 7px 4px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.bCDf41C{
  display:none;
  background:#62809B;
  color:#fff;
  font-size:17px;
}

.bCDf53v{
  background:#C7D2DC;
  color:#fff;
  font-size:26px;
  line-height:34px;
}

.eB1Hj17R{
  position:fixed;
  right:12px;
  bottom:58px;
  display:none;
  background:#62809B;
  color:#fff;
  border-radius:20px;
  padding:3px 8px;
  font-size:13px;
  z-index:710;
}


/* =========================================================
   PHOTO DANS LE CHAT
   ========================================================= */

.photo-message-bubble{
  width:min(100%,68vw);
  max-width:100%;
  padding:6px;
  overflow:hidden;
}

.photo-card-frame{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  max-width:100%;
  height:auto;
  max-height:58vh;
  overflow:hidden;
  border-radius:13px;
  background:#ECEFF1;
  vertical-align:top;
}

.photo-card{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:58vh;
  object-fit:contain;
  cursor:pointer;
}

@media(min-width:801px){
  .photo-message-bubble{
    width:min(100%,320px);
  }
  .photo-card-frame,
  .photo-card{
    max-width:100%;
    max-height:420px;
  }
}


/* =========================================================
   ÉCRANS BLANCS PLEIN ÉCRAN
   ========================================================= */

.member-action-view,
.quick-reply-view,
.coordinate-view,
.private-contact-view,
.private-contact-warning-view,
.private-audio-view,
.person-view,
.media-view,
.private-photo-view,
.private-location-view,
.private-photo-warning-view{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  background:#fff;
  overflow:hidden;
}

.person-view{
  z-index:1000;
}

.member-action-view,
.quick-reply-view,
.coordinate-view,
.private-contact-view,
.private-contact-warning-view,
.private-audio-view,
.media-view,
.private-photo-view,
.private-location-view,
.private-photo-warning-view{
  z-index:1050;
}


/*
 * La flèche est alignée sur le bord gauche de la zone centrale
 * de 670px, même si le fond blanc recouvre tout l'écran.
 */
.member-screen-back{
  position:absolute;
  top:7px;
  left:max(8px, calc(50% - 335px + 8px));
  width:40px;
  height:44px;
  border:0;
  background:transparent;
  color:#62809B;
  font-size:38px;
  line-height:38px;
  padding:0;
  cursor:pointer;
  z-index:30;
}


/* =========================================================
   IDENTITÉ MEMBRE
   ========================================================= */

.member-action-content,
.quick-reply-content,
.coordinate-content,
.media-content,
.private-location-content,
.private-photo-warning-content{
  width:100%;
  max-width:400px;
  margin:0 auto;
  padding:76px 24px 30px;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.member-large-avatar{
  display:block;
  width:94px;
  height:94px;
  border-radius:50%;
  object-fit:cover;
  background:#ECEFF1;
}

.member-large-name{
  margin-top:12px;
  color:#222;
  font-size:20px;
  line-height:25px;
  font-weight:700;
  text-align:center;
}


/* =========================================================
   FICHE INTERMÉDIAIRE
   ========================================================= */

.member-action-buttons{
  width:100%;
  margin-top:31px;
  display:flex;
  flex-direction:column;
  gap:11px;
}

.member-action-button{
  width:100%;
  min-height:48px;
  border:0;
  border-radius:11px;
  background:#F1F3F5;
  color:#4E4E4E;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  padding:10px 14px;
}

.member-action-button:active{
  background:#E7E9EB;
}

.member-action-primary{
  background:#62809B;
  color:#fff;
}

.member-action-primary:active{
  background:#62809B;
}


/* =========================================================
   RÉPONSE RAPIDE
   ========================================================= */

.quick-reply-quote{
  width:100%;
  margin-top:25px;
  padding:7px 10px 8px;
  border-left:4px solid #62809B;
  border-radius:8px;
  background:#E8EFF3;
  overflow:hidden;
}

.quick-reply-quote-name{
  color:#62809B;
  font-size:14px;
  line-height:18px;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.quick-reply-quote-text{
  margin-top:1px;
  color:#4E4E4E;
  font-size:14px;
  line-height:18px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.quick-reply-input{
  width:100%;
  min-height:96px;
  max-height:180px;
  overflow-y:auto;
  margin-top:28px;
  padding:12px 14px;
  background:#F4F4F4;
  border-radius:14px;
  color:#515151;
  font-size:17px;
  line-height:22px;
  word-break:break-word;
}

.quick-reply-send{
  width:100%;
  min-height:47px;
  margin-top:12px;
  border:0;
  border-radius:10px;
  background:#62809B;
  color:#fff;
  font-size:20px;
  font-weight:700;
  cursor:pointer;
}

.quick-reply-send:disabled{
  opacity:.45;
  cursor:default;
}


/* =========================================================
   COORDONNÉE
   ========================================================= */

.coordinate-text{
  width:100%;
  margin-top:27px;
  padding:14px;
  border-radius:12px;
  background:#F4F4F4;
  color:#777;
  font-size:14px;
  line-height:20px;
  text-align:center;
}


/* =========================================================
   AJOUTER UNE PHOTO
   ========================================================= */

.media-content{
  padding-top:88px;
}

.media-title{
  width:100%;
  color:#222;
  font-size:20px;
  line-height:25px;
  font-weight:700;
  text-align:center;
  margin-bottom:24px;
}

.media-file-input{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
}

.media-file-label{
  width:100%;
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  background:#F1F3F5;
  color:#4E4E4E;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  padding:10px 14px;
}

.media-preview-wrap{
  width:100%;
  margin-top:18px;
  display:flex;
  justify-content:center;
}

.media-preview{
  display:block;
  max-width:100%;
  max-height:42vh;
  object-fit:contain;
  border-radius:13px;
  background:#ECEFF1;
}

.media-file-name{
  width:100%;
  min-height:18px;
  margin-top:8px;
  color:#999;
  font-size:12px;
  line-height:18px;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}


.media-note,
.private-photo-note{
  width:100%;
  margin-top:12px;
  padding:12px 13px;
  border-radius:12px;
  background:#F4F4F4;
  color:#777;
  font-size:13px;
  line-height:18px;
  text-align:center;
}

.private-photo-note + .media-file-label{
  margin-top:18px;
}

.media-error{
  width:100%;
  min-height:17px;
  margin-top:8px;
  color:#B45151;
  font-size:12px;
  line-height:17px;
  text-align:center;
}


/* =========================================================
   VUE DES ÉCHANGES
   Photo + pseudo dans une zone fixe.
   Seule la liste des échanges défile.
   ========================================================= */

.person-identity{
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:670px;
  height:219px;
  padding-top:76px;
  display:flex;
  flex-direction:column;
  align-items:center;
  background:#fff;
  z-index:10;
}

.person-messages{
  position:absolute;
  top:219px;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:670px;
  overflow-y:auto;
  overflow-x:hidden;
  padding:8px 9px 22px;
  -webkit-overflow-scrolling:touch;
}

.person-messages::-webkit-scrollbar{
  width:6px;
}

.person-messages::-webkit-scrollbar-thumb{
  background:#ddd;
  border-radius:8px;
}

.person-message-row{
  display:flex;
  align-items:flex-start;
  width:100%;
  margin-bottom:8px;
}

.person-message-row:not(.mine){
  cursor:pointer;
}

.person-row-avatar{
  width:42px;
  flex:0 0 42px;
  display:flex;
  justify-content:center;
  transform:translateY(-8px);
}

.person-row-avatar img{
  width:34px;
  height:34px;
  border-radius:50%;
  object-fit:cover;
}

.person-row-main{
  max-width:calc(100% - 42px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.person-row-name{
  font-size:13px;
  font-weight:700;
  color:#62809B;
  margin:0 0 3px 5px;
}

.person-row-bubble{
  background:#F5F5F5;
  padding:8px 11px;
  border-radius:16px;
  font-size:15px;
  line-height:20px;
  max-width:min(82vw,460px);
  word-break:break-word;
}

.person-row-bubble.mention{
  border-left:4px solid #62809B;
  background:#E9EEF2;
  padding-left:8px;
}

.person-row-time{
  font-size:9px;
  color:#B8B8B8;
  margin:2px 0 0 6px;
}

.person-message-row.mine{
  justify-content:flex-end;
  cursor:default;
}

.person-message-row.mine .person-row-avatar{
  order:2;
  margin-left:5px;
}

.person-message-row.mine .person-row-main{
  order:1;
  align-items:flex-end;
}

.person-message-row.mine .person-row-name{
  margin-right:5px;
}

.person-message-row.mine .person-row-bubble{
  background:#CBD5DE;
}




/* =========================================================
   PHOTO PRIVÉE
   ========================================================= */

.private-photo-warning-content{
  width:100%;
  max-width:400px;
  margin:0 auto;
  padding:96px 24px 30px;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.private-photo-warning-title{
  width:100%;
  color:#222;
  font-size:21px;
  line-height:26px;
  font-weight:700;
  text-align:center;
}

.private-photo-warning-text{
  width:100%;
  margin-top:18px;
  padding:14px;
  border-radius:12px;
  background:#F4F4F4;
  color:#666;
  font-size:14px;
  line-height:20px;
  text-align:center;
}

.private-photo-warning-cancel{
  margin-top:10px;
}

.private-photo-box{
  min-width:210px;
}

.private-photo-label{
  font-size:14px;
  line-height:19px;
}

.private-photo-open,
.photo-send-preview-close,
.photo-send-preview-button{
  display:inline-block;
  margin-top:7px;
  border:0;
  border-radius:9px;
  padding:7px 10px;
  background:#62809B;
  color:#fff;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.session-photo-edit-badge{
  position:absolute;
  right:4px;
  bottom:4px;
  width:29px;
  height:29px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#fff;
  color:#62809B;
  font-size:16px;
  line-height:29px;
  font-weight:700;
  box-shadow:0 0 0 1px rgba(98,128,155,.16), 0 2px 8px rgba(0,0,0,.12);
}
/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:800px){

  .e4f5g6h{
    width:100%;
    max-width:100%;
  }

  .aDEa22S{
    width:100%;
    right:0;
    margin-right:0;
  }

  .message-stack{
    max-width:82%;
  }
}


/* =========================================================
   VIEWPORT MOBILE MODERNE
   ========================================================= */

@supports (height:100dvh){

  .e4f5g6h,
  .member-action-view,
  .quick-reply-view,
  .coordinate-view,
  .private-contact-view,
  .private-contact-warning-view,
  .private-audio-view,
  .person-view,
  .media-view,
  .private-photo-view,
  .private-photo-warning-view{
    height:100dvh !important;
  }
}


/* =========================================================
   APERÇU PHOTO AVANT ENVOI
   ========================================================= */

.photo-send-preview{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:2450;
  background:#000;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:58px 14px 104px;
}

.photo-send-preview-close{
  position:absolute;
  top:8px;
  right:max(14px, calc(50% - 335px + 14px));
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:38px;
  line-height:38px;
  font-weight:300;
  padding:0;
  cursor:pointer;
  z-index:2460;
  -webkit-tap-highlight-color:transparent;
}

.photo-send-preview-image{
  display:block;
  max-width:min(100%,1000px);
  max-height:calc(100vh - 170px);
  object-fit:contain;
}

.photo-send-preview-error{
  position:absolute;
  left:50%;
  bottom:76px;
  transform:translateX(-50%);
  width:calc(100% - 28px);
  max-width:400px;
  padding:7px 10px;
  border-radius:8px;
  background:rgba(0,0,0,.72);
  color:#fff;
  font-size:12px;
  line-height:17px;
  text-align:center;
  z-index:2460;
}

.photo-send-preview-button{
  position:absolute;
  left:50%;
  bottom:max(16px, env(safe-area-inset-bottom));
  transform:translateX(-50%);
  width:calc(100% - 28px);
  max-width:400px;
  min-height:48px;
  border:0;
  border-radius:11px;
  background:#62809B;
  color:#fff;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  z-index:2460;
  -webkit-tap-highlight-color:transparent;
}

.photo-send-preview-button:disabled{
  opacity:.55;
  cursor:default;
}

@supports (height:100dvh){
  .photo-send-preview{
    height:100dvh;
  }

  .photo-send-preview-image{
    max-height:calc(100dvh - 170px);
  }
}

/* =========================================================
   VISIONNEUSE PHOTO
   ========================================================= */

.photo-viewer{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  background:#000;
  z-index:2500;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:56px 14px 24px;
}

.photo-viewer-close{
  position:absolute;
  top:8px;
  right:max(14px, calc(50% - 335px + 14px));
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:38px;
  line-height:38px;
  font-weight:300;
  padding:0;
  cursor:pointer;
  z-index:2510;
}

.photo-viewer-image{
  display:block;
  max-width:min(100%,1000px);
  max-height:calc(100vh - 82px);
  object-fit:contain;
}

@supports (height:100dvh){
  .photo-viewer{
    height:100dvh;
  }

  .photo-viewer-image{
    max-height:calc(100dvh - 82px);
  }
}


/* =========================================================
   SUPPRESSION DU HALO BLEU AU TOUCHER SUR MOBILE
   ========================================================= */

button,
.chat-container,
.message-line,
.message-img,
.message-name,
.message-bubble,
.person-message-row,
.person-row-avatar,
.person-row-name,
.person-row-bubble,
.member-action-button,
.media-file-label,
.photo-card,
.private-coordinate-open,
.private-location-open,
.private-photo-open,
.private-text-open{
  -webkit-tap-highlight-color:transparent;
}

button:focus,
button:active,
.chat-container:focus,
.message-line:focus,
.person-message-row:focus,
.member-action-button:focus,
.media-file-label:focus,
.private-coordinate-open:focus,
.private-location-open:focus,
.private-photo-open:focus,
.private-text-open:focus,
.photo-send-preview-close:focus,
.photo-send-preview-button:focus,
.private-dark-close:focus,
.private-dark-send:focus,
.private-audio-record-circle:focus{
  outline:none;
}


/* =========================================================
   IDENTITÉ TEMPORAIRE À L'ENTRÉE DU CHAT
   ========================================================= */

.session-gate{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:4000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(245,248,250,.48);
  -webkit-backdrop-filter:blur(1px);
  backdrop-filter:blur(1px);
}

.session-card{
  width:100%;
  max-width:330px;
  min-height:300px;
  padding:27px 24px 24px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 32px rgba(0,0,0,.14);
  display:flex;
  flex-direction:column;
  align-items:center;
}

.session-photo-zone{
  width:104px;
  height:104px;
  margin-bottom:23px;
}

.session-photo-input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  overflow:hidden;
  pointer-events:none;
}

.session-photo-picker{
  position:relative;
  display:block;
  width:104px;
  height:104px;
  border-radius:50%;
  background:#F1F3F5;
  cursor:pointer;
  overflow:visible;
  -webkit-tap-highlight-color:transparent;
}

.session-photo-preview{
  display:block;
  width:104px;
  height:104px;
  border-radius:50%;
  object-fit:cover;
  background:#ECEFF1;
}

.session-photo-placeholder{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
}

.session-camera{
  position:relative;
  display:block;
  width:39px;
  height:29px;
  border:3px solid #8EA3B5;
  border-radius:7px;
}

.session-camera-top{
  position:absolute;
  left:8px;
  top:-9px;
  width:17px;
  height:8px;
  background:#8EA3B5;
  border-radius:4px 4px 0 0;
}

.session-camera-lens{
  position:absolute;
  left:10px;
  top:5px;
  width:13px;
  height:13px;
  border:3px solid #8EA3B5;
  border-radius:50%;
}

.session-photo-plus{
  position:absolute;
  right:0;
  bottom:3px;
  width:29px;
  height:29px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#62809B;
  color:#fff;
  font-size:22px;
  line-height:29px;
  font-weight:400;
  box-shadow:0 0 0 3px #fff;
}

.session-pseudo-input{
  width:100%;
  height:46px;
  border:0;
  border-radius:12px;
  background:#F4F4F4;
  padding:0 13px;
  color:#515151;
  font-family:Arial,sans-serif;
  font-size:17px;
}

.session-pseudo-input:focus{
  outline:none;
}

.session-pseudo-input::placeholder{
  color:#A4A4A4;
}

.session-error{
  width:100%;
  min-height:18px;
  margin-top:8px;
  color:#B45151;
  font-size:12px;
  line-height:17px;
  text-align:center;
}

.session-enter-btn{
  width:100%;
  min-height:47px;
  margin-top:10px;
  border:0;
  border-radius:10px;
  background:#62809B;
  color:#fff;
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.session-enter-btn:disabled{
  opacity:.55;
  cursor:default;
}

@supports (height:100dvh){
  .session-gate{
    height:100dvh;
  }
}


/* =========================================================
   V18 : MOTEUR RÉEL DE CHAT
   ========================================================= */

.message-bubble.pending,
.person-row-bubble.pending{
  opacity:.68;
}

.coordinate-input{
  width:100%;
  height:46px;
  margin-top:14px;
  border:0;
  border-radius:12px;
  background:#F4F4F4;
  padding:0 13px;
  color:#515151;
  font-family:Arial,sans-serif;
  font-size:16px;
}

.coordinate-input:focus{
  outline:none;
}

.coordinate-input::placeholder{
  color:#A4A4A4;
}

.coordinate-error{
  width:100%;
  min-height:17px;
  margin-top:7px;
  color:#B45151;
  font-size:12px;
  line-height:17px;
  text-align:center;
}

.private-coordinate-box{
  min-width:190px;
}

.private-coordinate-label{
  font-size:14px;
  line-height:19px;
}

.private-coordinate-open,
.private-location-open,
.private-text-open{
  display:inline-block;
  margin-top:7px;
  border:0;
  border-radius:9px;
  padding:7px 10px;
  background:#62809B;
  color:#fff;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.private-coordinate-value,
.private-text-value{
  margin-top:7px;
  padding:7px 9px;
  border-radius:8px;
  background:rgba(255,255,255,.72);
  color:#404040;
  font-size:14px;
  line-height:19px;
  word-break:break-word;
  user-select:text;
}

.message-bubble,
.person-row-bubble{
  white-space:pre-wrap;
}


/* =========================================================
   OUTILS PRIVÉS : IDENTITÉ FIXE
   ========================================================= */

.private-contact-warning-content{
  width:100%;
  max-width:430px;
  margin:0 auto;
  padding:76px 22px 28px;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.private-contact-view,
.private-contact-warning-view,
.private-audio-view{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  background:#fff;
  overflow:hidden;
  z-index:1060;
}

/*
 * Même géométrie que .person-identity et que la fiche membre :
 * la photo commence à 76px et le pseudo ne bouge plus entre
 * le menu, les contacts et l'audio.
 */
.private-tool-identity{
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:670px;
  height:219px;
  padding-top:76px;
  display:flex;
  flex-direction:column;
  align-items:center;
  background:#fff;
  z-index:10;
}

.private-tool-body{
  position:absolute;
  top:219px;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:430px;
  overflow-y:auto;
  overflow-x:hidden;
  padding:8px 22px 28px;
  -webkit-overflow-scrolling:touch;
}

.private-contact-intro,
.private-audio-info{
  width:100%;
  margin-top:4px;
  padding:13px 14px;
  border-radius:12px;
  background:#F4F4F4;
  color:#6D6D6D;
  font-size:13px;
  line-height:19px;
  text-align:center;
}

.private-contact-grid{
  width:100%;
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:11px;
}

.private-contact-service{
  min-width:0;
  border:0;
  background:transparent;
  padding:4px 2px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  color:#555;
  font-size:11px;
  line-height:14px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.private-contact-service img{
  width:46px;
  height:46px;
  display:block;
  object-fit:contain;
  border-radius:13px;
}

.private-contact-hint{
  width:100%;
  margin-top:20px;
  color:#929292;
  font-size:12px;
  line-height:18px;
  text-align:center;
}

.private-contact-box,
.private-audio-box{
  min-width:205px;
}

.private-contact-label,
.private-audio-label{
  font-size:14px;
  line-height:19px;
}

.private-contact-open,
.private-audio-open{
  display:inline-block;
  margin-top:7px;
  border:0;
  border-radius:9px;
  padding:7px 10px;
  background:#62809B;
  color:#fff;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}

.private-contact-value{
  margin-top:9px;
  padding:9px 10px;
  border-radius:9px;
  background:rgba(255,255,255,.75);
  color:#333;
  font-size:14px;
  line-height:19px;
  word-break:break-word;
  user-select:text;
}

.private-contact-link{
  display:block;
  margin-top:8px;
  color:#62809B;
  font-weight:700;
  text-decoration:none;
  word-break:break-all;
}


/* =========================================================
   ÉCRANS NOIRS : CONTACT / ENREGISTREMENT VOCAL
   ========================================================= */

.private-dark-view{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:2470;
  background:#000;
  overflow:hidden;
  color:#fff;
}

.private-dark-close{
  position:absolute;
  top:8px;
  right:max(14px, calc(50% - 335px + 14px));
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:38px;
  line-height:38px;
  font-weight:300;
  padding:0;
  cursor:pointer;
  z-index:2485;
  -webkit-tap-highlight-color:transparent;
}

.private-dark-content{
  position:absolute;
  top:70px;
  bottom:88px;
  left:50%;
  transform:translateX(-50%);
  width:calc(100% - 36px);
  max-width:430px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:18px 0;
}

.private-dark-title{
  width:100%;
  color:#fff;
  font-size:20px;
  line-height:26px;
  font-weight:700;
  text-align:center;
}

.private-contact-compose-icon{
  display:block;
  width:64px;
  height:64px;
  object-fit:contain;
  margin-bottom:16px;
  border-radius:16px;
}

.private-dark-input{
  width:100%;
  height:48px;
  margin-top:22px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:12px;
  background:#1B1B1B;
  color:#fff;
  padding:0 14px;
  font-family:Arial,sans-serif;
  font-size:16px;
}

.private-dark-input:focus{
  outline:none;
  border-color:rgba(255,255,255,.62);
}

.private-dark-input::placeholder{
  color:#929292;
}

.private-dark-warning{
  width:100%;
  margin-top:15px;
  color:#BDBDBD;
  font-size:12px;
  line-height:18px;
  text-align:center;
}

.private-dark-error{
  width:100%;
  min-height:18px;
  margin-top:10px;
  color:#FFB0B0;
  font-size:12px;
  line-height:18px;
  text-align:center;
}

.private-dark-send{
  position:absolute;
  left:50%;
  bottom:max(16px, env(safe-area-inset-bottom));
  transform:translateX(-50%);
  width:calc(100% - 28px);
  max-width:400px;
  min-height:48px;
  border:0;
  border-radius:11px;
  background:#62809B;
  color:#fff;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  z-index:2485;
}

.private-dark-send:disabled{
  opacity:.48;
  cursor:default;
}


/* =========================================================
   VOCAL PRIVÉ
   ========================================================= */

.private-audio-open-recorder{
  margin-top:18px;
}

.private-audio-status{
  width:100%;
  min-height:20px;
  margin-top:12px;
  color:#777;
  font-size:13px;
  line-height:19px;
  text-align:center;
}

.private-audio-recorder-content{
  position:absolute;
  top:66px;
  bottom:88px;
  left:50%;
  transform:translateX(-50%);
  width:calc(100% - 36px);
  max-width:430px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow-y:auto;
  padding:18px 0;
}

.private-audio-timer{
  margin-top:30px;
  color:#fff;
  font-size:30px;
  line-height:38px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
}

.private-audio-record-circle{
  position:relative;
  width:88px;
  height:88px;
  margin-top:28px;
  border:4px solid #fff;
  border-radius:50%;
  background:transparent;
  padding:0;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  -webkit-tap-highlight-color:transparent;
}

.private-audio-record-symbol{
  display:block;
  width:62px;
  height:62px;
  border-radius:50%;
  background:#D94949;
  transition:width .12s ease,height .12s ease,border-radius .12s ease;
}

.private-audio-record-circle.recording .private-audio-record-symbol{
  width:34px;
  height:34px;
  border-radius:6px;
}

.private-audio-record-circle:disabled{
  opacity:.42;
  cursor:default;
}

.private-audio-recorder-status{
  width:100%;
  min-height:20px;
  margin-top:18px;
  color:#BDBDBD;
  font-size:13px;
  line-height:19px;
  text-align:center;
}

.private-audio-preview{
  width:100%;
  margin-top:18px;
  filter:invert(1) hue-rotate(180deg);
}

.private-audio-player{
  width:230px;
  max-width:100%;
  margin-top:8px;
}

@supports (height:100dvh){
  .private-dark-view{
    height:100dvh;
  }
}

@media(max-width:430px){
  .private-contact-grid{
    grid-template-columns:repeat(3,1fr);
  }
}


/* =========================================================
   V26.3 - CONTACT / VOCAL DIRECTEMENT SUR FOND NOIR
   ========================================================= */

/*
 * La zone identité est volontairement non interactive :
 * même si un navigateur calcule une zone plus grande que prévu,
 * elle ne peut jamais intercepter un clic sur les commandes.
 */
.private-dark-identity{
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:670px;
  height:219px;
  padding-top:76px;
  display:flex;
  flex-direction:column;
  align-items:center;
  background:#000;
  z-index:2478;
  pointer-events:none;
}

.private-dark-identity .member-large-name{
  color:#fff;
}

.private-contact-dark-content{
  position:absolute;
  top:219px;
  bottom:82px;
  left:50%;
  transform:translateX(-50%);
  width:calc(100% - 36px);
  max-width:430px;
  overflow-y:auto;
  overflow-x:hidden;
  padding:12px 0 24px;
  color:#fff;
  z-index:2479;
  -webkit-overflow-scrolling:touch;
}

.private-dark-subtitle{
  width:100%;
  margin-top:7px;
  color:#aaa;
  font-size:13px;
  line-height:18px;
  text-align:center;
}

.private-contact-grid-dark{
  margin-top:22px;
}

.private-dark-view .private-contact-service{
  position:relative;
  z-index:2480;
  color:#fff;
  pointer-events:auto;
}

.private-dark-view .private-contact-service img{
  background:#fff;
}

.private-dark-view .private-contact-service.selected{
  opacity:1;
}

.private-dark-view .private-contact-service.selected img{
  box-shadow:0 0 0 3px #62809B;
}

.private-contact-entry-wrap{
  width:100%;
  margin-top:23px;
}

.private-contact-selected-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
}

.private-contact-selected-title{
  color:#fff;
  font-size:17px;
  line-height:22px;
  font-weight:700;
}

.private-contact-selected-row .private-contact-compose-icon{
  width:42px;
  height:42px;
  margin:0;
  border-radius:11px;
  background:#fff;
}

.private-contact-entry-wrap .private-dark-input{
  margin-top:17px;
}

.private-contact-compose-view .private-dark-send,
.private-audio-recorder-view .private-dark-send{
  pointer-events:auto;
}

/*
 * L'enregistreur commence sous la même identité fixe que les autres
 * écrans membre. Les commandes sont dans leur propre couche.
 */
.private-audio-recorder-content{
  top:219px;
  z-index:2479;
}

.private-audio-record-circle{
  z-index:2480;
  pointer-events:auto;
}

/*
 * Les anciens écrans blancs restent dans le HTML pour compatibilité
 * avec le reste du code mais ne doivent jamais capter les clics.
 */
.private-contact-view,
.private-audio-view{
  pointer-events:none;
}

.private-contact-view button,
.private-audio-view button{
  pointer-events:none;
}


/* =========================================================
   V26.4 - ALERTE DE MODÉRATION PLEIN ÉCRAN
   ========================================================= */

.moderation-alert-view{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:8000;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  overflow:hidden;
}

.moderation-alert-content{
  width:100%;
  max-width:390px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.moderation-alert-icon{
  width:66px;
  height:66px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:4px solid #C94D4D;
  border-radius:50%;
  color:#C94D4D;
  font-family:Arial,sans-serif;
  font-size:42px;
  line-height:58px;
  font-weight:700;
}

.moderation-alert-title{
  width:100%;
  margin-top:22px;
  color:#C94D4D;
  font-family:Arial,sans-serif;
  font-size:22px;
  line-height:28px;
  font-weight:700;
}

.moderation-alert-text{
  width:100%;
  margin-top:13px;
  color:#555;
  font-family:Arial,sans-serif;
  font-size:16px;
  line-height:23px;
}

.moderation-alert-ok{
  width:100%;
  min-height:48px;
  margin-top:28px;
  border:0;
  border-radius:11px;
  background:#62809B;
  color:#fff;
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.moderation-alert-ok:focus,
.moderation-alert-ok:active{
  outline:none;
}

@supports (height:100dvh){
  .moderation-alert-view{
    height:100dvh;
  }
}


/* =========================================================
   V26.5 - PARCOURS OUTILS PRIVÉS : BLANC PUIS NOIR
   ========================================================= */

.private-contact-view,
.private-audio-view{
  pointer-events:auto !important;
}

.private-contact-view button,
.private-audio-view button{
  pointer-events:auto !important;
}

.private-tool-title{
  width:100%;
  margin-top:4px;
  color:#222;
  font-size:18px;
  line-height:24px;
  font-weight:700;
  text-align:center;
}

.private-tool-start-button{
  margin-top:18px;
}

/*
 * L'écran noir est une vraie nouvelle couche : aucune identité
 * membre n'y est affichée.
 */
.private-contact-dark-content{
  top:66px !important;
  bottom:82px;
  padding:18px 0 24px;
}

.private-audio-recorder-content{
  top:66px !important;
  bottom:88px;
}

.private-contact-grid-dark{
  margin-top:24px;
}

.private-dark-view .private-contact-service{
  pointer-events:auto !important;
}

.private-dark-view .private-contact-service img{
  background:#fff;
}

.private-dark-close,
.private-dark-send,
.private-audio-record-circle{
  pointer-events:auto !important;
}

/* L'ancien correctif d'identité noire n'est plus utilisé. */
.private-dark-identity{
  display:none !important;
}

/* =========================================================
   V26.5 - ÉTAT DE VÉRIFICATION PHOTO
   ========================================================= */

.photo-verification-text{
  font-variant-numeric:tabular-nums;
}


/* =========================================================
   V26.6 - NOUVEAUX MESSAGES PENDANT LA LECTURE PLUS HAUT
   ========================================================= */

.new-messages-indicator{
  position:fixed;
  right:calc(50% - 321px);
  bottom:66px;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:#fff;
  color:#62809B;
  box-shadow:0 2px 12px rgba(0,0,0,.18);
  padding:0;
  cursor:pointer;
  z-index:715;
  -webkit-tap-highlight-color:transparent;
}

.new-messages-arrow{
  display:flex;
  width:100%;
  height:100%;
  align-items:center;
  justify-content:center;
  font-size:24px;
  line-height:42px;
  font-weight:700;
  transform:translateY(-1px);
}

.new-messages-count{
  position:absolute;
  top:-5px;
  right:-4px;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:10px;
  background:#25D366;
  color:#fff;
  border:2px solid #fff;
  font-size:11px;
  line-height:16px;
  font-weight:700;
  text-align:center;
  font-variant-numeric:tabular-nums;
}

@media(max-width:800px){
  .new-messages-indicator{
    right:14px;
  }
}


/* =========================================================
   V26.6 - LECTEUR VOCAL PERSONNALISÉ
   La progression utilise la durée connue lors de l'enregistrement,
   sans dépendre de la durée parfois mal interprétée du WebM natif.
   ========================================================= */

.private-audio-preview{
  display:none !important;
}

.private-audio-player{
  display:none !important;
}

.private-audio-custom-player{
  width:100%;
  max-width:300px;
  margin-top:12px;
  display:flex;
  align-items:center;
  gap:9px;
}

.private-audio-preview-player{
  margin-top:18px;
  color:#fff;
}

.private-audio-play-toggle{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border:0;
  border-radius:50%;
  padding:0 0 0 2px;
  background:#62809B;
  color:#fff;
  font-size:15px;
  line-height:34px;
  text-align:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.private-audio-play-toggle.playing{
  padding-left:0;
  font-size:13px;
}

.private-audio-progress{
  position:relative;
  flex:1 1 auto;
  min-width:80px;
  height:6px;
  border-radius:4px;
  background:#D9D9D9;
  overflow:hidden;
  cursor:pointer;
}

.private-audio-progress-fill{
  position:absolute;
  top:0;
  left:0;
  width:0;
  height:100%;
  border-radius:4px;
  background:#62809B;
}

.private-audio-custom-time{
  flex:0 0 auto;
  color:#777;
  font-size:11px;
  line-height:16px;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}

.private-audio-preview-player .private-audio-progress{
  background:#555;
}

.private-audio-preview-player .private-audio-progress-fill{
  background:#fff;
}

.private-audio-preview-player .private-audio-play-toggle{
  background:#fff;
  color:#222;
}

.private-audio-preview-player .private-audio-custom-time{
  color:#D5D5D5;
}

.private-audio-engine{
  display:none !important;
}


/* =========================================================
   V26.7 - CITATION CLIQUABLE / MESSAGE ORIGINAL
   ========================================================= */

.reply-quote{
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.reply-quote:focus{
  outline:none;
}

.reply-quote:active{
  opacity:.82;
}

.message-bubble{
  transition:
    box-shadow .22s ease,
    transform .22s ease;
}

.message-bubble.reply-target-highlight,
.message-line.reply-target-highlight{
  box-shadow:
    0 0 0 3px rgba(98,128,155,.30),
    0 3px 14px rgba(0,0,0,.12);
  transform:scale(1.012);
}


/* =========================================================
   V27 - IDENTITÉ / CODE DE RETOUR
   ========================================================= */

.session-secondary-btn,
.session-forget-btn{
  width:100%;
  min-height:43px;
  margin-top:10px;
  border:0;
  border-radius:10px;
  background:#F1F3F5;
  color:#44525E;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.session-forget-btn{
  background:transparent;
  color:#777;
  font-size:13px;
  font-weight:500;
}

.simple-white-overlay{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:7600;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:#fff;
  overflow:auto;
}

.simple-white-card{
  width:100%;
  max-width:390px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.simple-white-back{
  position:fixed;
  top:14px;
  left:max(14px,calc(50% - 321px));
  width:42px;
  height:42px;
  border:0;
  padding:0;
  background:transparent;
  color:#222;
  font-size:39px;
  line-height:38px;
  cursor:pointer;
  z-index:7602;
  -webkit-tap-highlight-color:transparent;
}

.simple-white-title{
  width:100%;
  color:#202428;
  font-size:22px;
  line-height:28px;
  font-weight:700;
}

.simple-white-text{
  width:100%;
  margin-top:12px;
  color:#666;
  font-size:15px;
  line-height:22px;
}

.return-code-input{
  width:100%;
  min-height:49px;
  margin-top:23px;
  box-sizing:border-box;
  border:1px solid #D8DDE1;
  border-radius:11px;
  padding:0 14px;
  background:#fff;
  color:#202428;
  font-size:17px;
  text-align:center;
  letter-spacing:.8px;
  text-transform:uppercase;
  outline:none;
}

.return-code-input:focus{
  border-color:#62809B;
  box-shadow:0 0 0 2px rgba(98,128,155,.12);
}

.return-code-key{
  width:64px;
  height:64px;
  margin-bottom:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:3px solid #62809B;
  color:#62809B;
  font-size:33px;
  font-weight:700;
}

.return-code-value{
  width:100%;
  min-height:54px;
  margin-top:22px;
  border:1px dashed #62809B;
  border-radius:11px;
  padding:9px 12px;
  background:#F7F9FA;
  color:#354B5C;
  font-family:monospace;
  font-size:18px;
  line-height:26px;
  font-weight:700;
  letter-spacing:.8px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.return-code-copy-status{
  min-height:18px;
  margin-top:7px;
  color:#7A7A7A;
  font-size:12px;
  line-height:18px;
}

.return-code-card .session-enter-btn,
#quietReminderView .session-enter-btn{
  margin-top:22px;
}

.quiet-reminder-icon{
  margin-bottom:16px;
  font-size:42px;
  line-height:48px;
}

.quiet-code-label{
  margin-top:22px;
  color:#555;
  font-size:13px;
  font-weight:600;
}


/* =========================================================
   V27 - MENU +
   ========================================================= */

.plus-menu-card{
  max-width:360px;
}

.plus-menu-button{
  width:100%;
  min-height:49px;
  margin-top:12px;
  border:0;
  border-radius:11px;
  background:#62809B;
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.plus-menu-logout{
  margin-top:22px;
  background:#F1F3F5;
  color:#A24444;
}

.plus-menu-note{
  margin-top:12px;
  color:#888;
  font-size:12px;
  line-height:18px;
}


/* =========================================================
   V27 - FLÈCHE VIOLETTE DES RÉPONSES DIRECTES
   ========================================================= */

.pending-replies-indicator{
  position:fixed;
  right:calc(50% - 321px);
  bottom:116px;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:#7757A6;
  color:#fff;
  box-shadow:0 2px 12px rgba(0,0,0,.18);
  padding:0;
  cursor:pointer;
  z-index:716;
  -webkit-tap-highlight-color:transparent;
}

.pending-replies-arrow{
  display:flex;
  width:100%;
  height:100%;
  align-items:center;
  justify-content:center;
  font-size:24px;
  line-height:42px;
  font-weight:700;
  transform:translateY(-1px);
}

.pending-replies-count{
  position:absolute;
  top:-5px;
  right:-4px;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:10px;
  background:#fff;
  color:#7757A6;
  border:2px solid #7757A6;
  box-sizing:border-box;
  font-size:11px;
  line-height:16px;
  font-weight:700;
  text-align:center;
  font-variant-numeric:tabular-nums;
}

@media(max-width:800px){
  .pending-replies-indicator{
    right:14px;
  }

  .simple-white-back{
    left:14px;
  }
}


/* =========================================================
   V27 - AUCUNE HEURE VISIBLE
   ========================================================= */

.message-date,
.person-row-time{
  display:none !important;
}


/* =========================================================
   V27 - CHARGEMENT D'HISTORIQUE
   ========================================================= */

.history-end-row{
  width:100%;
  box-sizing:border-box;
  padding:12px 18px;
  color:#8A8A8A;
  font-size:12px;
  line-height:18px;
  text-align:center;
}

.history-top-loading{
  width:100%;
  box-sizing:border-box;
  padding:8px 18px 10px;
  color:#8A8A8A;
  text-align:center;
  font-size:12px;
  line-height:16px;
  font-weight:400;
  background:transparent;
  border:0;
}

.history-top-loading-label{
  display:block;
}

.history-top-loading-dots{
  display:block;
  height:24px;
  margin-top:1px;
  font-size:24px;
  line-height:24px;
  letter-spacing:3px;
  font-weight:700;
  white-space:pre;
}

@supports (height:100dvh){
  .simple-white-overlay{
    height:100dvh;
  }
}


/* =========================================================
   V27.1 - ENTRÉE PAR CODE PLUS DISCRÈTE
   ========================================================= */

.session-return-link{
  display:block;
  align-self:flex-start;
  margin-top:12px;
  padding:0;
  border:0;
  background:transparent;
  color:#62809B;
  font-size:13px;
  line-height:20px;
  font-weight:600;
  text-align:left;
  text-decoration:none;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.session-return-link:active{
  opacity:.7;
}


/* =========================================================
   V27.1 - MENU +
   ========================================================= */

.plus-menu-card{
  justify-content:center;
}

.plus-menu-button{
  margin-top:10px;
}

.plus-menu-primary{
  background:#62809B;
  color:#fff;
}

.plus-menu-secondary{
  background:#F0F1F2;
  color:#202428;
}

.plus-menu-secondary:active{
  background:#E7E9EB;
}

.plus-menu-logout{
  margin-top:18px;
  background:#F0F1F2;
  color:#B04444;
}


/* =========================================================
   V27.1 - MES PARAMÈTRES
   ========================================================= */

.profile-settings-card{
  max-width:360px;
}

.profile-settings-photo-row{
  position:relative;
  width:100%;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  margin-top:26px;
}

.profile-settings-photo-button{
  position:relative;
  width:92px;
  height:92px;
  margin-top:0;
  padding:0;
  border:0;
  border-radius:50%;
  background:#EEF1F3;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.profile-settings-photo{
  display:block;
  width:92px;
  height:92px;
  border-radius:50%;
  object-fit:cover;
  background:#EEF1F3;
}

.profile-settings-initial{
  position:absolute;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#EEF1F4;
  color:#62809B;
  font-size:38px;
  line-height:1;
  font-weight:700;
  pointer-events:none;
}

.profile-settings-delete{
  position:absolute;
  top:0;
  right:14px;
  width:24px;
  height:24px;
  margin-top:0;
  display:none;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:0;
  padding:0;
  box-sizing:border-box;
  background:transparent;
  color:#555;
  font-size:24px;
  line-height:24px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.profile-settings-pencil{
  position:absolute;
  right:-1px;
  bottom:2px;
  width:29px;
  height:29px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:3px solid #fff;
  border-radius:50%;
  box-sizing:border-box;
  background:#62809B;
  color:#fff;
  font-size:16px;
  line-height:20px;
  font-weight:700;
}

.profile-settings-label{
  width:100%;
  margin-top:26px;
  margin-bottom:7px;
  color:#555;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-align:left;
}

.profile-settings-pseudo{
  width:100%;
  min-height:48px;
  box-sizing:border-box;
  border:1px solid #D7DBDF;
  border-radius:10px;
  padding:0 13px;
  background:#fff;
  color:#222;
  font-size:16px;
  line-height:48px;
  outline:none;
}

.profile-settings-pseudo:focus{
  border-color:#62809B;
  box-shadow:0 0 0 2px rgba(98,128,155,.11);
}

.profile-settings-error{
  width:100%;
  margin-top:10px;
  text-align:left;
}

.profile-settings-save{
  width:100%;
  min-height:48px;
  margin-top:20px;
  border:0;
  border-radius:10px;
  background:#62809B;
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.profile-settings-save:disabled{
  background:#D8DDE1;
  color:#92999F;
  cursor:default;
}


/* =========================================================
   V27.1 - MESSAGE SUPPRIMÉ
   ========================================================= */

.deleted-message{
  color:#858585;
  font-size:13px;
  line-height:19px;
  font-style:italic;
}

.deleted-message-icon{
  margin-right:5px;
  font-style:normal;
}

.delete-message-card{
  max-width:360px;
}

.delete-message-confirm,
.delete-message-cancel{
  width:100%;
  min-height:48px;
  border:0;
  border-radius:10px;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.delete-message-confirm{
  margin-top:24px;
  background:#B04444;
  color:#fff;
}

.delete-message-cancel{
  margin-top:10px;
  background:#F0F1F2;
  color:#222;
}


/* =========================================================
   V27.1 - CONSULTATION DE SES PROPRES CONTENUS PRIVÉS
   ========================================================= */

.own-private-open{
  margin-top:7px;
}


/* =========================================================
   V27.1 - APPUI LONG SUR SES MÉDIAS
   ========================================================= */

.message-line.own-message-line .message-bubble{
  touch-action:manipulation;
}

/* =========================================================
   V27.2 - CURSEURS SUR SON PROPRE PROFIL / SES MESSAGES
   ========================================================= */

.chat-container.mine .message-img,
.chat-container.mine .message-name,
.message-line.mine-line,
.message-line.mine-line .message-bubble,
.person-message-row.mine,
.person-message-row.mine .person-row-avatar,
.person-message-row.mine .person-row-name,
.person-message-row.mine .person-row-bubble{
  cursor:pointer;
}

/* Les contrôles internes conservent naturellement leur propre pointeur. */
.message-line.mine-line button,
.person-message-row.mine button{
  cursor:pointer;
}


/* =========================================================
   V27.2 - DÉCOMPTE PHOTO DANS MES PARAMÈTRES
   ========================================================= */

.profile-photo-cooldown{
  width:100%;
  margin-top:12px;
  padding:9px 11px;
  border-radius:9px;
  background:#F4F5F6;
  color:#747474;
  font-size:12px;
  line-height:17px;
  text-align:center;
}

.profile-settings-photo-button:disabled{
  cursor:default;
  opacity:.72;
}


/* =========================================================
   V27.2 - ANCIEN PROFIL
   ========================================================= */

.old-profile-prefix{
  color:#A8A8A8;
  font-size:10px;
  line-height:14px;
  font-weight:500;
}

.message-name .old-profile-prefix,
.person-row-name .old-profile-prefix{
  margin-right:3px;
}


/* =========================================================
   V27.2 - MESSAGE PRIVÉ DANS LE FLUX PUBLIC
   ========================================================= */

.private-message-view,
.private-message-warning-view{
  z-index:1080;
}

.private-message-content{
  max-width:400px;
}

.private-message-lock{
  margin-top:24px;
  font-size:29px;
  line-height:34px;
}

.private-message-info{
  width:100%;
  margin-top:10px;
  padding:12px 14px;
  border-radius:12px;
  background:#F4F4F4;
  color:#6B6B6B;
  font-size:13px;
  line-height:19px;
  text-align:center;
}

.private-message-input{
  margin-top:18px;
}

.private-message-error{
  width:100%;
  margin-top:9px;
  text-align:left;
}

.private-message-warning-content{
  padding-top:88px;
  max-width:400px;
}

.private-message-warning-lock{
  margin-bottom:15px;
  font-size:36px;
  line-height:42px;
}

.private-message-trust-option{
  width:100%;
  margin-top:22px;
  padding:12px 13px;
  box-sizing:border-box;
  display:flex;
  align-items:flex-start;
  gap:9px;
  border-radius:10px;
  background:#F4F4F4;
  color:#626262;
  font-size:12px;
  line-height:18px;
  text-align:left;
  cursor:pointer;
}

.private-message-trust-option input{
  margin:2px 0 0;
  flex:0 0 auto;
}

.private-text-reply{
  display:block;
  margin-top:10px;
  border:0;
  border-radius:9px;
  padding:8px 11px;
  background:#62809B;
  color:#fff;
  font-size:12px;
  line-height:17px;
  font-weight:700;
  cursor:pointer;
}

/* =========================================================
   READIM - CONNEXION / INSCRIPTION INTÉGRÉE
   ========================================================= */

.readim-auth-view{
  z-index:12050;
}

.readim-auth-card{
  width:min(420px,calc(100vw - 36px));
}

.readim-auth-input{
  box-sizing:border-box;
  width:100%;
  min-height:48px;
  margin:0 0 12px 0;
  padding:0 14px;
  border:1px solid #d9dfe4;
  border-radius:10px;
  background:#fff;
  color:#111;
  font-size:16px;
  outline:none;
}

.readim-auth-input:focus{
  border-color:#62809B;
  box-shadow:0 0 0 2px rgba(98,128,155,.12);
}

.readim-register-photo-picker{
  display:flex;
  align-items:center;
  justify-content:center;
  width:104px;
  height:104px;
  margin:0 auto 18px auto;
  border-radius:52px;
  overflow:hidden;
  background:#f1f3f5;
  cursor:pointer;
}

.readim-register-photo-preview{
  width:100%;
  height:100%;
  object-fit:cover;
}

.readim-register-photo-placeholder{
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  padding:12px;
  color:#62809B;
  font-size:13px;
  font-weight:700;
  text-align:center;
}

/* =========================================================
   READIM INTÉGRATION V2 - ERREURS DE CONNEXION / INSCRIPTION
   ========================================================= */

.readim-auth-card .session-error{
  box-sizing:border-box;
  width:100%;
  min-height:0;
  margin:0 0 10px 0;
  padding:10px 12px;
  border-radius:9px;
  background:#F3C8C8;
  color:#111;
  font-size:13px;
  line-height:18px;
  text-align:left;
}


/* =========================================================
   READIM INTÉGRATION V2 - RECHERCHE PAR PSEUDO
   ========================================================= */

.pseudo-search-card,
.search-message-content{
  max-width:400px;
}

.pseudo-search-input{
  box-sizing:border-box;
  width:100%;
  min-height:48px;
  margin-top:18px;
  padding:0 14px;
  border:1px solid #D9DFE4;
  border-radius:10px;
  background:#fff;
  color:#111;
  font-size:16px;
  outline:none;
}

.pseudo-search-input:focus{
  border-color:#62809B;
  box-shadow:0 0 0 2px rgba(98,128,155,.12);
}

.pseudo-search-submit{
  margin-top:10px;
}

.pseudo-search-error,
.search-message-error,
.delete-account-error{
  box-sizing:border-box;
  width:100%;
  min-height:0;
  margin:10px 0 0 0;
  padding:10px 12px;
  border-radius:9px;
  background:#F3C8C8;
  color:#111;
  font-size:13px;
  line-height:18px;
  text-align:left;
}

.pseudo-search-summary{
  width:100%;
  box-sizing:border-box;
  margin-top:14px;
  border-radius:12px;
  background:#EEF4F8;
  padding:12px 14px;
  color:#49677D;
  font-size:13px;
  line-height:19px;
  text-align:left;
}

.pseudo-search-results{
  width:100%;
  margin-top:0;
  display:flex;
  flex-direction:column;
  gap:9px;
}

.pseudo-search-result{
  box-sizing:border-box;
  width:100%;
  min-height:74px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:1px solid #E1E7EB;
  border-radius:15px;
  background:#fff;
  color:#202428;
  text-align:left;
  cursor:default;
  -webkit-tap-highlight-color:transparent;
}

.pseudo-search-result:hover,
.pseudo-search-result:active{
  background:#F7F8F9;
}

.pseudo-search-result-photo,
.pseudo-search-result-initial{
  width:52px;
  height:52px;
  flex:0 0 52px;
  border-radius:50%;
}

.pseudo-search-result-photo{
  object-fit:cover;
}

.pseudo-search-result-initial,
.search-message-large-initial,
.message-profile-initial,
.person-profile-initial,
.search-target-initial{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#EEF1F4;
  color:#62809B;
  font-weight:700;
}

.pseudo-search-result-initial{
  font-size:20px;
}

.pseudo-search-result-name{
  min-width:0;
  overflow:hidden;
  color:#222;
  font-size:15px;
  line-height:20px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.search-message-view{
  z-index:1090;
}

.search-message-avatar-wrap{
  width:94px;
  height:94px;
}

.search-message-avatar-wrap img,
.search-message-large-initial{
  width:94px;
  height:94px;
  border-radius:50%;
  object-fit:cover;
}

.search-message-large-initial{
  font-size:30px;
}

.search-message-origin{
  margin-top:8px;
  color:#8B8B8B;
  font-size:12px;
  line-height:17px;
  text-align:center;
}

.search-message-input{
  margin-top:22px;
}

.search-contact-quote{
  box-sizing:border-box;
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:6px;
  padding:7px 9px;
  border-left:3px solid #62809B;
  border-radius:8px;
  background:#EDF1F4;
}

.search-contact-icon{
  flex:0 0 auto;
  font-size:15px;
  line-height:20px;
}

.search-target-photo,
.search-target-initial{
  width:28px;
  height:28px;
  flex:0 0 28px;
  border-radius:50%;
}

.search-target-photo{
  object-fit:cover;
}

.search-target-initial{
  font-size:11px;
}

.search-contact-name{
  min-width:0;
  overflow:hidden;
  color:#4D6478;
  font-size:12px;
  line-height:17px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.search-contact-deleted{
  margin-right:3px;
  color:#A8A8A8;
  font-size:9px;
  font-weight:500;
}


/* =========================================================
   READIM INTÉGRATION V2 - PROFIL SUPPRIMÉ DANS L'HISTORIQUE
   ========================================================= */

.message-profile-initial{
  width:36px;
  height:36px;
  border-radius:50%;
  font-size:14px;
}

.person-profile-initial{
  width:38px;
  height:38px;
  border-radius:50%;
  font-size:14px;
}

.deleted-profile-prefix{
  margin-right:3px;
  color:#A8A8A8;
  font-size:10px;
  line-height:14px;
  font-weight:500;
}

.chat-container.profile-deleted .message-img,
.chat-container.profile-deleted .message-name,
.person-message-row.profile-deleted .person-row-avatar,
.person-message-row.profile-deleted .person-row-name{
  cursor:default;
}


/* =========================================================
   READIM INTÉGRATION V2 - SUPPRESSION DE COMPTE
   ========================================================= */

.profile-delete-account{
  width:100%;
  min-height:47px;
  margin-top:24px;
  border:0;
  border-radius:10px;
  background:#F0F1F2;
  color:#B04444;
  font-family:Arial,sans-serif;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
}

.delete-account-card{
  max-width:390px;
}

.delete-account-confirm,
.delete-account-cancel{
  width:100%;
  min-height:47px;
  border:0;
  border-radius:10px;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}

.delete-account-confirm{
  margin-top:20px;
  background:#B04444;
  color:#fff;
}

.delete-account-cancel{
  margin-top:9px;
  background:#F0F1F2;
  color:#222;
}

/* =========================================================
   READIM INTÉGRATION V3
   ========================================================= */

/* Le premier avatar ne doit plus toucher le bord supérieur. */
.bDCd01x{
  padding-top:14px;
}

/* La recherche commence plus bas que la flèche de retour. */
.pseudo-search-view{
  align-items:flex-start;
  padding-top:96px;
  padding-bottom:28px;
}

.pseudo-search-card{
  margin:0 auto;
}

.readim-auth-label{
  width:100%;
  margin:0 0 6px 1px;
  color:#666;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-align:left;
}

.readim-auth-select,
.profile-settings-select{
  line-height:normal;
  cursor:pointer;
}

.profile-settings-view{
  align-items:flex-start;
  padding-top:72px;
  padding-bottom:32px;
}

.profile-settings-card{
  margin:0 auto;
  padding-bottom:20px;
}

.profile-settings-pseudo + .profile-settings-label{
  margin-top:14px;
}

.profile-settings-optional{
  color:#999;
  font-weight:500;
}

.member-profile-meta{
  min-height:17px;
  max-width:100%;
  margin-top:3px;
  color:#8A8A8A;
  font-size:12px;
  line-height:17px;
  font-weight:400;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.member-profile-meta:empty{
  display:none;
}

.search-contact-quote.is-clickable{
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.search-contact-quote.is-clickable:hover,
.search-contact-quote.is-clickable:active{
  background:#E4EAEE;
}

/* =========================================================
   READIM INTÉGRATION V4
   ========================================================= */

/*
 * Le premier avatar doit conserver l'espacement validé en V3.
 * L'avatar a déjà transform:translateY(-9px), donc 14px de padding
 * donnent environ 5px d'espace visuel réel au-dessus de sa tête.
 */
.bDCd01x{
  padding-top:14px;
}

/*
 * Recherche : on conserve EXACTEMENT la position verticale validée en V3.
 * Le titre / champ / bouton restent fixes à cette position ; seule la zone
 * .pseudo-search-scroll située dessous peut défiler.
 */
.pseudo-search-view{
  z-index:7630;
  align-items:flex-start;
  justify-content:flex-start;
  padding:0 18px 38px;
}

.pseudo-search-shell{
  box-sizing:border-box;
  width:100%;
  max-width:660px;
  margin:0 auto;
  display:block;
  padding:88px 0 36px;
}

.pseudo-search-fixed{
  width:100%;
  text-align:center;
  background:transparent;
}

.pseudo-search-fixed .pseudo-search-input{margin-top:0;}

.pseudo-search-scroll{
  width:100%;
  overflow:visible;
  padding-bottom:0;
}

.pseudo-search-result-name{
  display:block;
  min-width:0;
}

.pseudo-search-result-pseudo{
  display:block;
  min-width:0;
  overflow:hidden;
  color:#202529;
  font-size:16px;
  line-height:21px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.pseudo-search-result-country{
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:#7B8389;
  font-size:12px;
  line-height:17px;
  font-weight:400;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.readim-forgot-link{
  display:block;
  align-self:flex-start;
  margin-top:10px;
  color:#62809B;
  font-size:13px;
  line-height:19px;
  font-weight:600;
  text-decoration:none;
}

.profile-app-section{
  box-sizing:border-box;
  width:100%;
  margin-top:24px;
  padding-top:18px;
  border-top:1px solid #ECEFF1;
  text-align:left;
}

.profile-app-title{
  color:#202428;
  font-size:14px;
  line-height:20px;
  font-weight:700;
}

.profile-app-status{
  margin-top:5px;
  color:#7E858A;
  font-size:12px;
  line-height:18px;
}

.profile-app-button{
  box-sizing:border-box;
  width:100%;
  min-height:44px;
  margin-top:9px;
  padding:0 14px;
  border:0;
  border-radius:10px;
  background:#F0F1F2;
  color:#222;
  font-size:14px;
  line-height:20px;
  font-weight:700;
  cursor:pointer;
}

.profile-app-button:disabled{
  opacity:.58;
  cursor:default;
}

.profile-private-messaging-section{
  box-sizing:border-box;
  width:100%;
  margin-top:24px;
  padding-top:18px;
  border-top:1px solid #ECEFF1;
  text-align:left;
}

.profile-sound-setting-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:100%;
  margin-top:11px;
}

.profile-sound-setting-copy{
  min-width:0;
  flex:1 1 auto;
}

.profile-sound-setting-copy strong{
  display:block;
  color:#24292D;
  font-size:13px;
  line-height:18px;
  font-weight:700;
}

.profile-sound-setting-copy span{
  display:block;
  margin-top:2px;
  color:#7E858A;
  font-size:12px;
  line-height:17px;
}

.profile-setting-switch{
  position:relative;
  flex:0 0 46px;
  width:46px;
  height:26px;
  border:0;
  border-radius:999px;
  padding:0;
  background:#D7DCE0;
  cursor:pointer;
  transition:background .16s ease;
  -webkit-tap-highlight-color:transparent;
}

.profile-setting-switch span{
  position:absolute;
  top:3px;
  left:3px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,.18);
  transition:transform .16s ease;
}

.profile-setting-switch.is-on{background:#62809B;}
.profile-setting-switch.is-on span{transform:translateX(20px);}
.profile-setting-switch:disabled{opacity:.55;cursor:default;}

.pwa-caution{
  width:100%;
  margin-top:12px;
  color:#8A8A8A;
  font-size:12px;
  line-height:18px;
  text-align:center;
}

.pwa-secondary-button{
  margin-top:9px;
}

/* Pas de repositionnement vertical spécifique : la position validée reste à 96px. */

/* =========================================================
   READIM INTÉGRATION V5 - CLAVIER MOBILE / ZONE D'ENVOI
   =========================================================
 * Les overlays de composition suivent la hauteur RÉELLEMENT visible
 * du navigateur (VisualViewport) lorsque le clavier logiciel s'ouvre.
 * Le bouton d'envoi reste ainsi accessible sans fermer le clavier.
 */
.composer-keyboard-view{
  --readim-visual-height:100dvh;
  --readim-visual-top:0px;
  top:var(--readim-visual-top) !important;
  bottom:auto !important;
  height:var(--readim-visual-height) !important;
  max-height:var(--readim-visual-height) !important;
}

.composer-keyboard-view .quick-reply-content,
.composer-keyboard-view .coordinate-content{
  box-sizing:border-box;
  height:100%;
  max-height:100%;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding-bottom:calc(20px + env(safe-area-inset-bottom));
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scroll-padding-bottom:calc(72px + env(safe-area-inset-bottom));
}

.composer-keyboard-view.readim-keyboard-open .quick-reply-content,
.composer-keyboard-view.readim-keyboard-open .coordinate-content{
  padding-bottom:calc(12px + env(safe-area-inset-bottom));
}

/* L'écran noir de saisie de contact possède déjà un bouton absolute bottom.
 * En suivant la hauteur VisualViewport, ce bouton remonte automatiquement
 * juste au-dessus du clavier. */
.composer-keyboard-view.private-contact-compose-view .private-dark-send{
  bottom:max(12px, env(safe-area-inset-bottom));
}

@supports not (height:100dvh){
  .composer-keyboard-view{
    --readim-visual-height:100vh;
  }
}


/* =========================================================
   READIM INTÉGRATION V7.1 - ANCIENNE VERSION DU SITE
   ========================================================= */
.profile-legacy-messages-link{
  display:inline-block;
  margin-top:18px;
  color:#62809B;
  font-size:13px;
  line-height:18px;
  text-decoration:underline;
  cursor:pointer;
}

/* =========================================================
   READIM INTÉGRATION V7.1 - CLAVIER MOBILE HARMONISÉ
   =========================================================
 * Répondre, contact depuis Rechercher et Message privé gardent exactement
 * leur contenu : aucun avatar, pseudo, meta ou contexte n'est supprimé.
 * Lorsque le clavier s'ouvre, la zone devient simplement scrollable et le
 * moteur VisualViewport fait remonter naturellement le bas du formulaire.
 */
.composer-keyboard-view.readim-keyboard-open .quick-reply-send{
  flex:0 0 auto;
  margin-bottom:calc(18px + env(safe-area-inset-bottom));
}

.composer-keyboard-view.readim-keyboard-open .quick-reply-content,
.composer-keyboard-view.readim-keyboard-open .coordinate-content{
  scroll-padding-bottom:calc(92px + env(safe-area-inset-bottom));
}

/* Connexion / inscription : même logique de hauteur visible que les
 * overlays de message. Le formulaire reste scrollable et son bouton
 * principal peut toujours être remonté au-dessus du clavier. */
.readim-auth-view.composer-keyboard-view{
  box-sizing:border-box;
}

.readim-auth-view .readim-auth-card{
  box-sizing:border-box;
  min-height:0;
  max-height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  scroll-padding-bottom:calc(82px + env(safe-area-inset-bottom));
}

.readim-auth-view.readim-keyboard-open{
  align-items:flex-start;
  justify-content:center;
  padding-top:12px;
  padding-bottom:calc(10px + env(safe-area-inset-bottom));
}

.readim-auth-view.readim-keyboard-open .readim-auth-card{
  padding-bottom:calc(14px + env(safe-area-inset-bottom));
}

/* =========================================================
   READIM INTÉGRATION V7.3 - CLAVIER MOBILE : MÊME MÉCANIQUE
   QUE MESSAGE PRIVÉ
   =========================================================
 * Le message privé fonctionne parce que son contenu a assez de hauteur pour
 * pouvoir défiler réellement lorsque le clavier réduit le viewport.
 *
 * Pour les écrans plus courts (Répondre, profil trouvé, connexion...), un
 * simple padding dans un bloc height:100% n'augmente pas forcément scrollHeight.
 * On ajoute donc une vraie réserve FLEX après le contenu, uniquement clavier
 * ouvert. Cette réserve est invisible mais crée physiquement la course de scroll.
 */
@media (max-width:800px){
  .composer-keyboard-view.readim-keyboard-open:not(.private-message-view) .quick-reply-content::after,
  .composer-keyboard-view.readim-keyboard-open:not(.private-message-view) .coordinate-content::after{
    content:"";
    display:block;
    width:100%;
    height:190px;
    min-height:190px;
    flex:0 0 190px;
    pointer-events:none;
  }

  .readim-auth-view.composer-keyboard-view.readim-keyboard-open .readim-auth-card::after{
    content:"";
    display:block;
    width:100%;
    height:190px;
    min-height:190px;
    pointer-events:none;
  }

  /* Le champ garde sa taille normale : aucun rétrécissement clavier. */
  .composer-keyboard-view.readim-keyboard-open .quick-reply-input{
    min-height:96px;
    max-height:180px;
  }
}

/* =========================================================
   READIM INTÉGRATION V7.4 - RECHERCHE + AUTH : COURSE DE SCROLL
   =========================================================
 * Répondre fonctionne déjà correctement en V7.3. Recherche et Auth reçoivent
 * une réserve supplémentaire réelle afin que le scroll forcé puisse placer
 * leur bouton entièrement au-dessus du clavier, même sur Samsung Internet.
 */
@media (max-width:800px){
  .search-message-view.readim-keyboard-open .search-message-content::after{
    content:"";
    display:block;
    width:100%;
    height:240px;
    min-height:240px;
    flex:0 0 240px;
    pointer-events:none;
  }

  .readim-auth-view.readim-keyboard-open .readim-auth-card::after{
    content:"";
    display:block;
    width:100%;
    height:240px;
    min-height:240px;
    pointer-events:none;
  }

  /* Le champ conserve toujours sa taille normale : aucun rétrécissement. */
  .composer-keyboard-view.readim-keyboard-open .quick-reply-input{
    min-height:96px;
    max-height:180px;
  }
}



/* =========================================================
   READIM INTÉGRATION V7.5 - VRAIE COURSE DE SCROLL
   =========================================================
 * Sur Samsung, les pseudo-éléments ::after utilisés en V7.3/V7.4 ne
 * fournissaient pas toujours une course de scroll réellement exploitable.
 * Recherche et Auth utilisent maintenant un élément HTML réel placé après
 * les actions. Il ne prend aucune place hors clavier.
 */
.readim-keyboard-scroll-spacer{
  display:block;
  width:100%;
  height:0;
  min-height:0;
  flex:0 0 0;
  pointer-events:none;
  visibility:hidden;
}

@media (max-width:800px){
  .search-message-view.readim-keyboard-open .readim-keyboard-scroll-spacer,
  .readim-auth-view.readim-keyboard-open .readim-keyboard-scroll-spacer{
    height:110px;
    min-height:110px;
    flex:0 0 110px;
  }

  /* Désactive les réserves virtuelles des versions précédentes uniquement
     sur les deux écrans désormais équipés d'un vrai spacer. */
  .search-message-view.readim-keyboard-open .search-message-content::after,
  .readim-auth-view.readim-keyboard-open .readim-auth-card::after{
    content:none !important;
    display:none !important;
    height:0 !important;
    min-height:0 !important;
  }
}


/* =========================================================
   READIM V7.6.5 - INSCRIPTION MOBILE + FAUSSE DATE
   ========================================================= */
.readim-auth-view.readim-register-mode{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch;
  align-items:flex-start !important;
}
.readim-auth-view.readim-register-mode .readim-auth-card{
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
  overscroll-behavior:auto !important;
  scroll-padding-bottom:0 !important;
}
.readim-auth-view.readim-register-mode .readim-keyboard-scroll-spacer{
  display:none !important;
}
.readim-auth-view.readim-register-mode .readim-register-photo-picker{
  margin-top:24px;
}
.readim-birthday-field{
  position:relative;
  width:100%;
}
.readim-birthday-field .readim-auth-input{
  width:100%;
}
.readim-birthday-fake{
  position:absolute;
  z-index:5;
  left:0;
  right:42px;
  top:0;
  bottom:0;
  display:flex;
  align-items:center;
  padding-left:26px;
  color:#8a8a8a;
  font-size:16px;
  line-height:1;
  cursor:pointer;
  background:transparent;
  -webkit-tap-highlight-color:transparent;
}

/* Recherche : reprendre la réserve de 190px de Répondre, validée sur Samsung. */
@media (max-width:800px){
  .search-message-view.readim-keyboard-open .readim-keyboard-scroll-spacer{
    height:190px !important;
    min-height:190px !important;
    flex:0 0 190px !important;
  }
}


/* =========================================================
   READIM V7.6.6 - CORRECTIONS SAMSUNG VERIFIEES
   ========================================================= */
/* La date visible est désormais un vrai bouton HTML. Le input date natif
   ne dessine plus rien à l'écran et sert uniquement à ouvrir le picker. */
.readim-birthday-field{
  position:relative;
  width:100%;
}
.readim-birthday-fake{
  position:relative !important;
  inset:auto !important;
  z-index:2 !important;
  display:flex !important;
  width:100% !important;
  min-height:58px;
  align-items:center;
  justify-content:space-between;
  box-sizing:border-box;
  padding:0 18px 0 26px !important;
  border:1px solid #D9DFE4;
  border-radius:10px;
  background:#fff !important;
  color:#8a8a8a !important;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
.readim-birthday-fake.has-value{ color:#111 !important; }
.readim-birthday-fake-arrow{
  color:#111;
  font-size:24px;
  line-height:1;
}
.readim-birthday-native{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  left:50% !important;
  bottom:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Recherche uniquement : le bouton devient sticky dans le conteneur qui
   suit déjà la hauteur VisualViewport. Il reste donc physiquement au-dessus
   du clavier, sans dépendre d'un calcul de scroll ou d'un spacer. */
@media (max-width:800px){
  .search-message-view.readim-keyboard-open #searchMessageSend{
    position:sticky !important;
    bottom:18px !important;
    z-index:20 !important;
    flex:0 0 auto !important;
    margin-top:14px !important;
    margin-bottom:18px !important;
  }
  .search-message-view.readim-keyboard-open .readim-keyboard-scroll-spacer{
    display:none !important;
    height:0 !important;
    min-height:0 !important;
    flex:0 0 0 !important;
  }
}


/* =========================================================
   READIM V7.6.10 - RETOUR BASE + COMPOSITEURS PETIT MOBILE
   ========================================================= */
/* Les overlays restent des volets complets, indépendamment de leur contenu. */
#quickReplyView,#privateMessageView,#searchMessageView{
  position:fixed !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  box-sizing:border-box !important;
  background:#fff !important;
}

/* Inscription par volets : un seul champ/question visible à la fois. */
.readim-register-wizard{ width:100%; }
.readim-register-progress{ margin:8px 0 24px; text-align:center; color:#8a8a8a; font-size:13px; }
.readim-register-step{ display:none; width:100%; }
.readim-register-step.is-active{ display:block; }
.readim-register-question{ margin:0 0 16px; color:#222; font-size:19px; line-height:25px; font-weight:700; text-align:center; }
.readim-register-actions{ width:100%; margin-top:18px; }
.readim-register-actions .session-enter-btn{ width:100%; }
.readim-register-prev{ margin-bottom:10px; }
.readim-register-step .readim-register-photo-picker{ margin-top:8px !important; }
.readim-birthday-fake{ min-height:58px; justify-content:flex-start !important; }
.readim-birthday-fake-arrow{ display:none !important; }

/* Tablette et ordinateur : largeur fixe pour les trois formulaires. */
@media (min-width:601px){
  #quickReplyView .quick-reply-content,
  #privateMessageView .quick-reply-content,
  #searchMessageView .quick-reply-content{
    width:450px !important;
    max-width:450px !important;
    box-sizing:border-box !important;
  }

  #quickReplyInput,#privateMessageInput,#searchMessageInput,
  #quickReplySend,#privateMessageSend,#searchMessageSend{
    width:400px !important;
    max-width:400px !important;
    box-sizing:border-box !important;
  }
}

/* Petit téléphone uniquement : champ compact + action ronde dans la même ligne. */
@media (max-width:600px){
  #quickReplyView .quick-reply-content,
  #privateMessageView .quick-reply-content,
  #searchMessageView .quick-reply-content{
    width:100% !important;
    max-width:400px !important;
    box-sizing:border-box !important;
  }

  .readim-mobile-composer-row{ position:relative; width:100%; margin-top:28px; }

  #quickReplyInput,#privateMessageInput,#searchMessageInput{
    width:calc(100% - 58px) !important;
    min-height:48px !important;
    max-height:112px !important;
    margin-top:0 !important;
    margin-right:58px !important;
    padding:12px 14px !important;
    border-radius:22px !important;
    box-sizing:border-box !important;
  }

  #quickReplySend,#privateMessageSend,#searchMessageSend{
    position:absolute !important;
    right:0 !important;
    width:44px !important;
    min-width:44px !important;
    height:44px !important;
    min-height:44px !important;
    margin:0 !important;
    padding:0 !important;
    border-radius:50% !important;
    font-size:0 !important;
    line-height:44px !important;
    z-index:10 !important;
  }

  #quickReplySend,#privateMessageSend,#searchMessageSend{ top:2px !important; bottom:auto !important; }

  #quickReplySend::before,#privateMessageSend::before,#searchMessageSend::before{
    content:"";
    display:block;
    width:20px;
    height:20px;
    margin:12px auto 0;
    background-repeat:no-repeat;
    background-position:center;
    background-size:20px 20px;
  }
  #privateMessageSend::before,#searchMessageSend::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M2.4 3.4 22 12 2.4 20.6l1.7-6.7L15 12 4.1 10.1z'/%3E%3C/svg%3E");
  }
  #quickReplySend::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9.4 7.2V3L2 10.4l7.4 7.4v-4.3c5.1 0 8.7 1.6 11.6 5.1-.9-5.4-4-10.8-11.6-11.4z'/%3E%3C/svg%3E");
  }
  #quickReplySend:disabled,#privateMessageSend:disabled,#searchMessageSend:disabled{
    background:#b9bec2 !important;
    opacity:1 !important;
  }
}


/* V7.6.13 - retour visuel pendant l'activation des notifications. */
.readim-wait-dots{display:inline-block;min-width:18px;text-align:left;}
.readim-wait-dots::after{content:'';animation:readimWaitDots 1.2s steps(4,end) infinite;}
@keyframes readimWaitDots{0%{content:''}25%{content:'.'}50%{content:'..'}75%,100%{content:'...'}}


/* =========================================================
   READIM V7.6.17 - OVERLAYS D'INFORMATION AU-DESSUS PARAMETRES
   ========================================================= */
#informationOverlayView,
#pwaIosHelpView{
  z-index:7900 !important;
}

/* =========================================================
   V7.6.18 - RETOUR UNIFORME SUR TOUS LES VOLETS
   Même flèche bleue, même taille et même position que les
   écrans Répondre / Message privé.
   ========================================================= */
.simple-white-back,
.member-screen-back{
  position:absolute !important;
  top:12px !important;
  left:max(8px, calc(50% - 335px + 8px)) !important;
  width:40px !important;
  height:44px !important;
  border:0 !important;
  padding:0 !important;
  background:transparent !important;
  color:#62809B !important;
  font-size:38px !important;
  line-height:38px !important;
  cursor:pointer;
  z-index:7602;
  -webkit-tap-highlight-color:transparent;
}

@media(max-width:800px){
  .simple-white-back,
  .member-screen-back{
    left:8px !important;
  }
}


/* V7.6.24 : lien Recherche, photos de profil et contexte des réponses privées */
.search-message-origin-link{border:0;background:transparent;padding:0;margin:0;color:#62809B;font:inherit;text-decoration:none;cursor:pointer;}
.profile-photo-enlarge{cursor:pointer;}
.photo-viewer-image.profile-preview-loading{filter:blur(10px);transform:scale(1.015);}
.photo-viewer-loader{position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:readimPhotoSpin .8s linear infinite;z-index:2508;}
@keyframes readimPhotoSpin{to{transform:rotate(360deg);}}
.private-reply-context{margin:0 0 10px;padding:8px 10px;border-left:3px solid #62809B;background:#f2f4f6;border-radius:7px;text-align:left;}
.private-reply-context-name{font-size:13px;font-weight:700;color:#555;margin-bottom:2px;}
.private-reply-context-text{font-size:14px;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.private-message-reply-quote{width:100%;}

/* V7.6.26 : encart compact uniquement lors d'une réponse privée */
.private-message-info.private-message-info-reply{padding:7px 10px;margin-top:8px;font-size:13px;line-height:17px;}
.private-message-info.private-message-info-reply + .private-message-reply-quote{margin-top:8px;}


/* V7.6.27 : réponse privée compacte sur téléphone, tablette et ordinateur. */
#privateMessageInfo.private-message-info-reply{
  width:auto !important;
  max-width:100% !important;
  align-self:center !important;
  box-sizing:border-box !important;
  padding:7px 12px !important;
  margin-top:8px !important;
  font-size:13px !important;
  line-height:17px !important;
}


/* =========================================================
   LOCALISATION PRIVÉE - V7.6.33
   ========================================================= */
.private-location-title{
  width:100%;
  margin-top:24px;
  color:#222;
  font-size:18px;
  line-height:24px;
  font-weight:700;
  text-align:center;
}
.private-location-note{
  width:100%;
  margin-top:14px;
  padding:14px 16px;
  box-sizing:border-box;
  border-radius:12px;
  background:#f1f3f4;
  color:#555;
  font-size:14px;
  line-height:20px;
  text-align:center;
}
.private-location-error{width:100%;margin-top:12px;}
.private-location-send{width:100%;margin-top:18px;}


/* =========================================================
   V7.6.34 - LOCALISATION + LIENS ACCUEIL PWA
   ========================================================= */
.private-location-note{margin-top:24px;}
.private-location-note-title{
  margin:0 0 7px 0;
  color:#333;
  font-size:15px;
  line-height:20px;
  font-weight:700;
  text-align:center;
}
.chat-home-direct-link{
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  box-sizing:border-box;
}

/* =========================================================
   V7.6.35 - Messages publics longs + icône localisation
   ========================================================= */
.public-message-text{
  display:block;
  min-width:0;
}
/* =========================================================
   V7.6.73 - COMPACTAGE VISUEL DES SÉRIES PUBLIQUES
   ========================================================= */
.public-sequence-toggle{
  align-self:flex-start;
  margin:4px 0 7px;
  padding:6px 10px;
  border:0;
  border-radius:15px;
  background:#E8EFF3;
  color:#62809B;
  font-family:Arial,sans-serif;
  font-size:12px;
  line-height:16px;
  font-weight:700;
  cursor:pointer;
}
.chat-container.mine .public-sequence-toggle{
  align-self:flex-end;
}
.public-sequence-hidden{
  display:none;
}

.public-message-text.is-collapsed{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  max-height:40px;
}
.public-message-text.is-expanded{
  display:block;
  max-height:none;
  overflow:visible;
}
.public-message-expand{
  display:none;
  margin:3px 0 0;
  padding:0;
  border:0;
  background:transparent;
  color:#62809B;
  font:inherit;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.private-location-label{
  display:flex;
  align-items:center;
  gap:5px;
}
.private-location-type-icon{
  width:20px;
  height:20px;
  flex:0 0 20px;
  display:block;
}

/* V7.6.36 - localisation publique */
.public-location-box{margin-top:4px;}
.public-location-value{margin-top:5px;font-weight:700;}
.public-location-quota{margin:8px 0 0;color:#b3261e;font-size:13px;line-height:18px;text-align:center;}

/* =========================================================
   V7.6.37 - OVERLAYS ADAPTATIFS + FONDATION MULTI-GROUPES
   =========================================================
   Le défilement appartient au volet plein écran, jamais au panneau intérieur.
   overflow:auto ne montre aucun défilement tant que le contenu tient.
   Les 30px bas créent une petite réserve seulement lorsque le contenu atteint
   pratiquement le bas du viewport ou le dépasse.
*/
.member-action-view,
.quick-reply-view,
.coordinate-view,
.private-contact-view,
.private-contact-warning-view,
.private-audio-view,
.person-view,
.media-view,
.private-photo-view,
.private-location-view,
.private-photo-warning-view,
.simple-white-overlay{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch;
  box-sizing:border-box;
  padding-bottom:30px;
}

/* Les panneaux internes ne créent pas une seconde scrollbar. */
.member-action-view > *,
.quick-reply-view > *,
.coordinate-view > *,
.private-contact-view > *,
.private-contact-warning-view > *,
.private-audio-view > *,
.person-view > *,
.media-view > *,
.private-photo-view > *,
.private-location-view > *,
.private-photo-warning-view > *,
.simple-white-overlay > *{
  max-height:none;
}

/* V7.6.40 - bouton Créer un compte visible dans Connexion */

.readim-create-account-btn{
  width:100%;
  min-height:47px;
  margin-top:12px;
  border:0;
  border-radius:10px;
  background:#E7E7E7;
  color:#333;
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.readim-create-account-btn:active{ opacity:.82; }


/* =========================================================
   READIM V7.6.47 - DATE DE NAISSANCE SIMPLE (3 SELECTEURS DIV)
   ========================================================= */
.readim-birthday-selectors{display:flex;gap:8px;width:100%;position:relative;overflow:visible;}
.readim-birthday-selector{position:relative;flex:1 1 0;min-width:0;}
.readim-birthday-selector-btn{width:100%;min-height:58px;border:1px solid #D9DFE4;border-radius:10px;background:#fff;padding:0 10px;font:inherit;font-size:15px;color:#8a8a8a;text-align:center;cursor:pointer;box-sizing:border-box;}
.readim-birthday-selector-btn.has-value{color:#111;}
.readim-birthday-options{display:none;position:absolute;z-index:12020;left:0;right:0;top:calc(100% + 5px);max-height:220px;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#fff;border:1px solid #D9DFE4;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.14);padding:4px 0;}
.readim-birthday-option{padding:11px 8px;text-align:center;cursor:pointer;font-size:15px;color:#111;background:#fff;}
.readim-birthday-option:active{background:#f0f2f4;}
@media (max-width:420px){.readim-birthday-selectors{gap:6px}.readim-birthday-selector-btn{padding:0 5px;font-size:14px}.readim-birthday-option{font-size:14px}}

/* V7.6.48 - 3 sélecteurs de naissance maison, indépendants et tactiles. */
#readimBirthdaySelectors.readim-birthday-selectors{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
  width:100% !important;
  overflow:visible !important;
  position:relative !important;
}
#readimBirthdaySelectors .readim-birthday-selector{
  display:block !important;
  position:relative !important;
  width:auto !important;
  min-width:0 !important;
  overflow:visible !important;
}
#readimBirthdaySelectors .readim-birthday-selector-btn{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  min-height:54px !important;
  padding:0 6px !important;
  box-sizing:border-box !important;
  touch-action:manipulation;
}
#readimBirthdaySelectors .readim-birthday-options{
  display:none;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:calc(100% + 5px) !important;
  max-height:210px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  z-index:30050 !important;
}
#readimBirthdaySelectors .readim-birthday-selector.is-open .readim-birthday-options{
  display:block;
}
@media(max-width:420px){
  #readimBirthdaySelectors.readim-birthday-selectors{gap:5px !important;}
  #readimBirthdaySelectors .readim-birthday-selector-btn{font-size:13px !important;padding:0 3px !important;}
}


/* V7.6.50 - actions après indisponibilité technique de la modération photo */
.readim-register-photo-error-actions{display:flex;flex-direction:column;gap:9px;margin-top:12px;}
.readim-register-photo-error-actions button{width:100%;min-height:44px;border-radius:9px;padding:10px 12px;font-size:14px;font-weight:600;cursor:pointer;}
.readim-register-photo-retry{background:#fff;border:1px solid #c8cdd2;color:#333;}
.readim-register-photo-skip{background:#62809B;border:1px solid #62809B;color:#fff;}

/* V7.6.51 - étape photo facultative après création du compte */
.readim-register-skip-photo{display:block;width:100%;max-width:430px;margin:10px auto 0;padding:12px 16px;border:0;border-radius:10px;background:#eceff1;color:#333;font-size:15px;font-weight:600;cursor:pointer;}
.readim-register-skip-photo:hover{background:#e2e6e9;}

/* V7.6.52 - overlay photo post-inscription totalement indépendant */
.readim-photo-setup-card{width:min(430px,calc(100% - 28px));margin:auto;padding-bottom:30px;}
.readim-photo-setup-text{text-align:center;font-size:14px;line-height:1.45;color:#555;margin:0 0 16px;}
#readimPhotoSetupView{overflow-y:auto;padding:20px 0 30px;}
#readimPhotoSetupSubmit,#readimPhotoSetupSkip{width:100%;max-width:430px;margin-left:auto;margin-right:auto;}

/* V7.6.61 : espace visuel entre le bouton principal photo et Passer. */
#readimPhotoSetupSkip{margin-top:12px;}

/* V7.6.65 - la poubelle ne participe jamais au centrage de l'avatar. */
@media (max-width:420px){
  .profile-settings-delete{right:12px;}
}

/* V7.6.66 - avatar Parametres : centrage invariant photo / initiale. */
.profile-settings-photo-row{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:92px !important;
  margin-top:26px !important;
}
.profile-settings-photo-button{
  display:block !important;
  position:relative !important;
  width:92px !important;
  height:92px !important;
  margin:0 auto !important;
  flex:none !important;
}
.profile-settings-photo,
.profile-settings-initial{
  width:92px !important;
  height:92px !important;
  box-sizing:border-box !important;
  border-radius:50% !important;
}
.profile-settings-initial{
  position:absolute !important;
  inset:0 !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
}
.profile-settings-delete{
  position:absolute !important;
  top:0 !important;
  right:18px !important;
  left:auto !important;
  transform:none !important;
  z-index:3 !important;
}
@media(max-width:420px){
  .profile-settings-delete{right:16px !important;}
}

/* V7.6.70 - pendant la confirmation/succès de suppression de la photo de profil,
 * masquer réellement la flèche Retour de Mes paramètres derrière l'overlay blanc.
 * L'utilisateur doit choisir Annuler/Supprimer (puis OK) dans l'overlay courant. */
#deleteProfilePhotoView,
#deleteProfilePhotoDoneView{
  z-index:7705 !important;
}


/* V7.6.78 - tous les avatars sans photo utilisent désormais
   le fond clair uniforme et l'initiale bleu site, quel que soit
   le contexte (flux, fiches, recherche, paramètres). */
.initials,
.pseudo-search-result-initial,
.search-message-large-initial,
.message-profile-initial,
.person-profile-initial,
.search-target-initial,
.profile-settings-initial{
  background:#EEF1F4 !important;
  color:#62809B !important;
}

/* =========================================================
   V7.6.80 - CONTACTS + VRAIE MESSAGERIE PRIVÉE
   ========================================================= */
.direct-hub-bubble{
  position:fixed;
  top:max(12px, env(safe-area-inset-top));
  /* V7.6.103 : léger retrait supplémentaire du bord droit pour la bulle Discussions. */
  right:max(10px, calc(50% - 335px + 10px));
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  padding:0;
  background:#35A766;
  color:#fff;
  font-size:14px;
  line-height:36px;
  font-weight:700;
  text-align:center;
  cursor:pointer;
  z-index:720;
  box-shadow:none;
  -webkit-tap-highlight-color:transparent;
}
.direct-hub-bubble.is-zero{background:#F5F5F5;}
.direct-hub-bubble span{color:#fff;}
@media(max-width:800px){.direct-hub-bubble{right:10px;}}

.direct-hub-view,
.direct-chat-view{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  background:#fff;
  overflow:hidden;
}
.direct-hub-view{z-index:7700;}
.direct-chat-view{z-index:7750;}
@supports(height:100dvh){.direct-hub-view,.direct-chat-view{height:100dvh;}}

.readim-screen-close{
  position:absolute;
  top:7px;
  right:max(8px, calc(50% - 335px + 8px));
  width:42px;
  height:44px;
  border:0;
  padding:0;
  background:transparent;
  color:#62809B;
  font-size:32px;
  line-height:40px;
  font-weight:400;
  cursor:pointer;
  z-index:7705;
  -webkit-tap-highlight-color:transparent;
}
@media(max-width:800px){.readim-screen-close{right:8px;}}

.direct-screen-header{
  box-sizing:border-box;
  height:62px;
  padding:17px 62px 10px;
  border-bottom:1px solid #E8ECEF;
  background:#fff;
  text-align:center;
}
.direct-screen-title{font-size:20px;line-height:28px;font-weight:700;color:#202428;}
.direct-hub-scroll{
  box-sizing:border-box;
  width:100%;
  max-width:670px;
  height:calc(100% - 62px);
  margin:0 auto;
  padding:10px 14px 40px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.direct-section{padding:8px 0 20px;}
.direct-section-title{margin:0 4px 9px;color:#62809B;font-size:13px;line-height:18px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;}
.direct-list{display:flex;flex-direction:column;gap:3px;}
.direct-conversation-row,
.direct-request-row{
  box-sizing:border-box;
  width:100%;
  min-height:64px;
  display:flex;
  align-items:center;
  gap:11px;
  border:0;
  border-radius:11px;
  background:#fff;
  padding:8px;
  text-align:left;
}
.direct-conversation-row{cursor:pointer;}
.direct-conversation-row:active{background:#F3F5F6;}
.direct-list-avatar{
  width:46px;height:46px;flex:0 0 46px;border-radius:50%;object-fit:cover;background:#EEF1F4;
}
.direct-list-initial{
  width:46px;height:46px;flex:0 0 46px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#EEF1F4;color:#62809B;font-size:17px;font-weight:700;
}
.direct-row-main{min-width:0;flex:1;}
.direct-row-top{display:flex;align-items:center;gap:8px;}
.direct-row-name{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#202428;font-size:15px;font-weight:700;}
.direct-row-time{flex:0 0 auto;color:#999;font-size:11px;}
.direct-row-preview{margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#777;font-size:13px;line-height:18px;}
.direct-row-unread{min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:#35A766;color:#fff;font-size:11px;line-height:22px;font-weight:700;text-align:center;}
.direct-request-actions{display:flex;gap:7px;flex:0 0 auto;}
.direct-request-accept,.direct-request-reject{min-height:34px;border-radius:8px;padding:0 10px;font-size:12px;font-weight:700;cursor:pointer;}
.direct-request-accept{border:0;background:#62809B;color:#fff;}
.direct-request-reject{border:1px solid #D9DEE2;background:#fff;color:#666;}
.direct-empty-state{box-sizing:border-box;margin:22px auto 0;max-width:390px;padding:30px 18px;text-align:center;}
.direct-empty-title{color:#202428;font-size:18px;line-height:24px;font-weight:700;}
.direct-empty-text{margin:10px 0 20px;color:#6E7479;font-size:14px;line-height:21px;}
.direct-profile-actions{width:100%;max-width:400px;margin:15px auto 3px;display:flex;flex-direction:column;gap:8px;}
.direct-profile-actions .member-action-button{margin:0;}
.direct-contact-action,.direct-chat-action{border-color:#DCE2E6;}

.direct-chat-header{
  box-sizing:border-box;
  width:100%;
  height:62px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:7px 88px 7px 58px;
  border-bottom:1px solid #E8ECEF;
  background:#fff;
}
.direct-chat-avatar-wrap{width:40px;height:40px;flex:0 0 40px;}
.direct-chat-avatar-wrap img,.direct-chat-header-initial{width:40px;height:40px;border-radius:50%;object-fit:cover;}
.direct-chat-header-initial{display:flex;align-items:center;justify-content:center;background:#EEF1F4;color:#62809B;font-size:15px;font-weight:700;}
.direct-chat-identity{min-width:0;max-width:280px;text-align:left;}
.direct-chat-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#202428;font-size:15px;line-height:19px;font-weight:700;}
.direct-chat-status{margin-top:1px;color:#8B9196;font-size:11px;line-height:15px;}
.direct-chat-menu{
  position:absolute;top:8px;right:max(10px, calc(50% - 335px + 10px));width:38px;height:42px;border:0;background:transparent;color:#62809B;font-size:27px;line-height:38px;cursor:pointer;z-index:7755;
}
/* Si la conversation a été ouverte directement depuis un profil, la croix
   occupe déjà le coin droit : le menu se décale uniquement dans ce cas. */
.direct-chat-view.has-right-close .direct-chat-menu{
  right:max(50px, calc(50% - 335px + 50px));
}
@media(max-width:800px){
  .direct-chat-menu{right:10px;}
  .direct-chat-view.has-right-close .direct-chat-menu{right:50px;}
}
.direct-chat-messages{
  box-sizing:border-box;
  width:100%;
  max-width:670px;
  height:calc(100% - 126px);
  margin:0 auto;
  padding:14px 12px 18px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  background:#fff;
}
.direct-load-older{display:block;margin:0 auto 14px;border:0;background:transparent;color:#62809B;font-size:13px;cursor:pointer;}
/* V7.6.349 - respiration visuelle quand l’émetteur change en messagerie privée. */
.direct-message-line{display:flex;width:100%;margin:4px 0;}
.direct-message-line:not(.mine) + .direct-message-line.mine,
.direct-message-line.mine + .direct-message-line:not(.mine){
  margin-top:14px;
}
.direct-message-line.mine{justify-content:flex-end;}
.direct-message-bubble{box-sizing:border-box;max-width:82%;padding:9px 11px;border-radius:13px;background:#F0F2F4;color:#202428;font-size:14px;line-height:20px;white-space:pre-wrap;word-break:break-word;}
.direct-message-line.mine .direct-message-bubble{
  background:rgba(98,128,155,.18);
  color:#2F3A43;
}
.direct-message-time{margin-top:4px;text-align:right;font-size:9px;line-height:12px;opacity:.65;}
.direct-chat-empty{padding:50px 20px;text-align:center;color:#8B9196;font-size:14px;line-height:21px;}
.direct-chat-composer{
  box-sizing:border-box;
  position:absolute;
  left:50%;bottom:0;transform:translateX(-50%);
  width:100%;max-width:670px;min-height:64px;
  display:flex;align-items:flex-end;gap:8px;
  padding:9px 12px max(9px, env(safe-area-inset-bottom));
  border-top:1px solid #E8ECEF;background:#fff;
}
.direct-chat-input{
  box-sizing:border-box;flex:1;min-width:0;min-height:42px;max-height:112px;overflow-y:auto;border:1px solid #D7DDE1;border-radius:21px;padding:10px 13px;color:#202428;font-size:14px;line-height:20px;outline:0;background:#fff;
}
.direct-chat-input:empty:before{content:attr(data-text);color:#A1A6AA;pointer-events:none;}
.direct-chat-send{width:42px;height:42px;flex:0 0 42px;border:0;border-radius:50%;background:#62809B;color:#fff;font-size:19px;line-height:42px;padding:0;cursor:pointer;}
.direct-chat-send:disabled{background:#D1D6DA;color:#fff;cursor:default;}
.direct-options-card{gap:11px;}
.direct-options-card .member-action-button,.direct-options-card .delete-account-confirm,.direct-options-card .delete-account-cancel{width:100%;}

.direct-chat-view.readim-keyboard-open{
  height:var(--readim-visual-height,100dvh) !important;
  top:var(--readim-visual-top,0px) !important;
  bottom:auto !important;
}
.direct-group-membership-notice{
  box-sizing:border-box;
  width:100%;
  max-width:400px;
  margin:17px auto 3px;
  padding:11px 12px;
  border-radius:9px;
  background:#F1F4F6;
  color:#596A78;
  font-size:13px;
  line-height:19px;
  text-align:center;
}
.direct-chat-input.is-disabled{background:#F3F5F6;color:#9AA0A5;}

/* =========================================================
   V7.6.81 - ÉTATS CONTACTS / BULLE DISCUSSIONS
   ========================================================= */
/* Priorité visuelle :
   - gris = aucune nouveauté ;
   - bleu ReadIM = activité contact uniquement ;
   - vert (style par défaut) = au moins un message privé non lu. */
.direct-hub-bubble.is-contact{background:#62809B;}
.direct-hub-bubble.is-zero{background:#F5F5F5;}
.direct-hub-bubble.is-zero span{color:#737C84;}

.direct-contact-notice-row{
  box-sizing:border-box;
  width:100%;
  min-height:64px;
  display:flex;
  align-items:center;
  gap:11px;
  border:0;
  border-radius:11px;
  background:#F6F8FA;
  padding:8px;
  text-align:left;
  cursor:pointer;
}
.direct-contact-notice-row:active{background:#EEF2F5;}

/* Quand la relation de contact n'autorise plus l'écriture, le champ est
   remplacé par une action explicite au lieu d'un composer grisé. */
.direct-chat-contact-action{
  box-sizing:border-box;
  width:100%;
  min-height:44px;
  border:0;
  border-radius:22px;
  padding:0 18px;
  background:#62809B;
  color:#fff;
  font-size:14px;
  line-height:44px;
  font-weight:700;
  text-align:center;
  cursor:pointer;
}
.direct-chat-contact-action:disabled{
  background:#D1D6DA;
  color:#fff;
  cursor:default;
}

/* Conversation créée à l'acceptation mais encore vide : petite indication
   discrète en haut du flux plutôt qu'un grand écran vide centré. */
.direct-chat-empty{
  padding:15px 20px 20px;
  text-align:center;
  color:#8B9196;
  font-size:13px;
  line-height:19px;
}


/* V7.6.82 - Sur la fiche ouverte depuis la recherche,
   les actions (ajout contact / discussion privee) passent
   sous l'encadre d'information pour suivre le contexte affiché. */
.search-profile-actions{
  margin-top:16px;
}

.search-profile-actions:first-of-type{
  margin-bottom:2px;
}


/* =========================================================
   V7.6.83 - ALIGNEMENT DES BOUTONS FLOTTANTS / MENU PRIVÉ
   =========================================================
   - Bulle Discussions : 36 px, même diamètre et même axe droit que le +.
   - Menu ⋮ : ~10 px du bord droit lorsqu'aucune croix n'occupe le coin.
*/


/* V7.6.84 - séparation visuelle actions du groupe / actions privées. */
.member-direct-actions-separator{
  width:100%;
  height:1px;
  margin:10px 0 8px;
  background:#E7EBEE;
}

/* =========================================================
   V7.6.85 - DISCUSSIONS CONSOLIDÉ : CONVERSATIONS / CONTACTS / GROUPES
   ========================================================= */
.direct-library-view{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  background:#fff;
  overflow:hidden;
  z-index:7725;
}
.direct-create-group-view{z-index:7740;}
@supports(height:100dvh){.direct-library-view{height:100dvh;}}

.direct-library-scroll{
  box-sizing:border-box;
  width:100%;
  max-width:670px;
  height:calc(100% - 62px);
  margin:0 auto;
  padding:12px 14px 42px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}

.direct-hub-main-section{
  border-top:1px solid #EEF1F3;
  padding-top:18px;
}
.direct-section-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.direct-see-all{
  box-sizing:border-box;
  width:100%;
  min-height:38px;
  margin-top:7px;
  border:0;
  border-radius:10px;
  background:#F1F4F6;
  color:#62809B;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-align:center;
  cursor:pointer;
}
.direct-see-all:active{background:#E8EEF2;}
.direct-inline-empty{
  box-sizing:border-box;
  padding:13px 8px;
  color:#8A9095;
  font-size:13px;
  line-height:19px;
  text-align:center;
}

.direct-contact-row,
.direct-blocked-row,
.direct-group-row{
  box-sizing:border-box;
  width:100%;
  min-height:62px;
  display:flex;
  align-items:center;
  gap:11px;
  border:0;
  border-radius:11px;
  padding:8px;
  background:#fff;
  color:#202428;
  text-align:left;
  cursor:pointer;
}
.direct-contact-row:active,
.direct-blocked-row:active,
.direct-group-row:active{background:#F3F5F6;}
.direct-group-row.is-current{background:#F5F8FA;}
.direct-row-badge{
  flex:0 0 auto;
  padding:4px 7px;
  border-radius:9px;
  background:#EEF2F5;
  color:#62809B;
  font-size:10px;
  line-height:13px;
  font-weight:700;
}
.direct-group-current-badge{
  background:#62809B;
  color:#fff;
}
.direct-group-avatar,
.direct-group-initial{
  width:46px;
  height:46px;
  flex:0 0 46px;
  border-radius:50%;
  object-fit:cover;
  background:#EEF1F4;
}
.direct-group-initial{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#62809B;
  font-size:17px;
  font-weight:700;
}

.direct-library-search-wrap{
  box-sizing:border-box;
  width:100%;
  padding:3px 0 12px;
}
.direct-library-search{
  box-sizing:border-box;
  width:100%;
  height:44px;
  border:1px solid #D9DEE2;
  border-radius:22px;
  padding:0 16px;
  outline:0;
  background:#F7F8F9;
  color:#202428;
  font-size:15px;
}
.direct-library-search:focus{
  border-color:#B9C8D3;
  background:#fff;
}
.direct-create-group-open{
  margin:2px 0 15px;
}

.direct-create-group-form{
  box-sizing:border-box;
  width:100%;
  max-width:440px;
  margin:0 auto;
  padding:2px 2px 30px;
}
.direct-create-group-form label,
.direct-create-group-label{
  display:block;
  margin:15px 0 7px;
  color:#303438;
  font-size:14px;
  line-height:19px;
  font-weight:700;
}
.direct-create-group-form label span{font-weight:400;color:#858B90;}
.direct-create-group-form>input[type=text],
.direct-create-group-form textarea,
.direct-create-group-form input[type=file]{
  box-sizing:border-box;
  width:100%;
  border:1px solid #D5DBDF;
  border-radius:11px;
  padding:11px 12px;
  background:#fff;
  color:#202428;
  font-family:inherit;
  font-size:15px;
}
.direct-create-group-form textarea{
  min-height:94px;
  resize:vertical;
}
.direct-group-slug-field{
  box-sizing:border-box;
  width:100%;
  display:flex;
  align-items:center;
  overflow:hidden;
  border:1px solid #D5DBDF;
  border-radius:11px;
  background:#fff;
}
.direct-group-slug-field span{
  padding:11px 8px 11px 12px;
  background:#F5F6F7;
  color:#7B8288;
  font-size:13px;
  white-space:nowrap;
}
.direct-group-slug-field input{
  min-width:0;
  flex:1;
  border:0;
  outline:0;
  padding:11px 12px 11px 4px;
  background:#fff;
  color:#202428;
  font-size:15px;
}
.direct-create-group-hint,
.direct-create-group-counter{
  margin-top:5px;
  color:#8A9095;
  font-size:11px;
  line-height:16px;
}
.direct-create-group-counter{text-align:right;}
.direct-create-radio{
  display:flex !important;
  align-items:flex-start;
  gap:8px;
  margin:8px 0 !important;
  font-weight:400 !important;
  color:#4E5459 !important;
}
.direct-create-radio input{margin-top:2px;}
.direct-create-group-form .session-enter-btn{margin-top:18px;}

/* Recherche globale : les groupes sont affichés séparément des pseudos. */
.pseudo-search-category{
  width:100%;
  margin-top:14px;
}
.pseudo-search-category-title{
  display:none;
}
.pseudo-search-groups-results{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:9px;
}
.pseudo-search-group-result{
  box-sizing:border-box;
  width:100%;
  min-height:74px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:1px solid #E1E7EB;
  border-radius:15px;
  background:#fff;
  color:#202428;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.pseudo-search-group-result:active{background:#F7F8F9;}
.pseudo-search-group-photo,
.pseudo-search-group-initial{
  width:52px;
  height:52px;
  flex:0 0 52px;
  border-radius:50%;
  object-fit:cover;
  background:#EEF1F4;
}
.pseudo-search-group-initial{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#62809B;
  font-size:16px;
  font-weight:700;
}
.pseudo-search-group-meta{
  margin-top:2px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#8A9095;
  font-size:11px;
  line-height:15px;
}

/* =========================================================
   V7.6.92 - ADMINISTRATION DE GROUPE DANS « MES GROUPES »
   ========================================================= */
.direct-group-admin-view{z-index:7735;}
.direct-group-admin-form{
  box-sizing:border-box;
  width:100%;
  max-width:440px;
  margin:0 auto;
  padding:2px 2px 34px;
}
.direct-group-admin-form>label,
.direct-group-admin-form>.direct-create-group-label{
  display:block;
  margin:15px 0 7px;
  color:#303438;
  font-size:14px;
  line-height:19px;
  font-weight:700;
}
.direct-group-admin-form>input[type=text],
.direct-group-admin-form textarea{
  box-sizing:border-box;
  width:100%;
  border:1px solid #D5DBDF;
  border-radius:11px;
  padding:11px 12px;
  background:#fff;
  color:#202428;
  font-family:inherit;
  font-size:15px;
}
.direct-group-admin-form textarea{
  min-height:94px;
  resize:vertical;
}
.direct-group-admin-photo-row{
  display:flex;
  align-items:center;
  gap:14px;
  margin:3px 0 10px;
}
.direct-group-admin-photo{
  width:86px;
  height:86px;
  flex:0 0 86px;
  margin:0 !important;
  border:1px dashed #AFBECA;
  border-radius:17px;
  overflow:hidden;
  background:#EEF1F4;
  color:#62809B;
  display:flex !important;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:29px !important;
  font-weight:800 !important;
  -webkit-tap-highlight-color:transparent;
}
.direct-group-admin-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:none;
}
.direct-group-admin-photo-actions{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}
.direct-group-admin-photo-actions strong{
  color:#292D31;
  font-size:14px;
}
.direct-group-admin-photo-actions span{
  color:#7D858B;
  font-size:11px;
  line-height:16px;
}
.direct-admin-text-button{
  margin:2px 0 0;
  padding:0;
  border:0;
  background:transparent;
  color:#62809B;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}
.direct-admin-hidden-file{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
}
.direct-group-admin-public-url{
  margin-top:7px;
  color:#62809B;
  font-size:12px;
  line-height:17px;
  overflow-wrap:anywhere;
}
.direct-group-admin-success{
  box-sizing:border-box;
  margin-top:14px;
  padding:10px 12px;
  border-radius:10px;
  background:#EEF5F0;
  color:#3F624A;
  font-size:12px;
  line-height:17px;
}
.direct-group-admin-form .session-enter-btn{margin-top:18px;}
.direct-admin-secondary-btn{
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  margin-top:9px;
  border:0;
  border-radius:11px;
  background:#EEF2F5;
  color:#62809B;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}
.direct-group-admin-danger{
  box-sizing:border-box;
  margin-top:24px;
  padding:15px;
  border:1px solid #EAD8D8;
  border-radius:13px;
  background:#FFFAFA;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.direct-group-admin-danger strong{
  color:#6F3030;
  font-size:14px;
}
.direct-group-admin-danger span{
  color:#8B6B6B;
  font-size:11px;
  line-height:16px;
}
.direct-group-admin-danger button{
  min-height:42px;
  margin-top:4px;
  border:0;
  border-radius:10px;
  background:#F1E7E7;
  color:#8A3030;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
}
.direct-group-row.is-admin-entry .direct-row-badge{
  background:#EEF2F5;
  color:#62809B;
}

/* =========================================================
   V7.6.96 - RÉACTIONS SUR MESSAGES / PHOTOS
   ========================================================= */
.member-reaction-bar{
  width:100%;
  min-height:48px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:4px;
  padding:6px 8px;
  border:1px solid #ECEFF1;
  border-radius:16px;
  background:#F8F9FA;
}

.member-reaction-choice{
  width:46px;
  height:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:12px;
  background:transparent;
  font-size:25px;
  line-height:1;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.member-reaction-choice:active,
.member-reaction-choice.is-selected{
  background:#E8EFF3;
}

.message-reactions{
  display:none;
  flex-wrap:wrap;
  align-items:center;
  gap:4px;
  margin:1px 4px 5px;
  min-height:0;
}

.message-reactions.has-reactions{
  display:flex;
}

.message-line.mine-line .message-reactions,
.person-message-row.mine .message-reactions{
  justify-content:flex-end;
}

.message-reaction-pill{
  min-width:34px;
  height:25px;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  border:1px solid #E7EAED;
  border-radius:13px;
  background:#F7F8F9;
  padding:0 7px;
  color:#555;
  font-size:15px;
  line-height:23px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.message-reaction-pill.is-mine{
  border-color:#C8D6E1;
  background:#E8EFF3;
}

.message-reaction-count{
  font-size:11px;
  font-weight:700;
  line-height:1;
}

/* =========================================================
   V7.6.98 - RÉACTIONS PLUS LISIBLES + ACTIVITÉ DANS LE FLUX
   ========================================================= */
.member-reaction-choice{
  box-sizing:border-box;
  border:2px solid transparent;
}

.member-reaction-choice:active{
  background:#EEF2F5;
}

.member-reaction-choice.is-selected{
  border-color:#62809B;
  background:#EEF3F7;
  box-shadow:0 0 0 1px rgba(98,128,155,.10);
}

.message-reaction-pill.is-mine{
  border-color:#62809B;
  background:#EEF3F7;
  color:#3F5F79;
}

.reaction-activity-bubble{
  padding:8px 10px;
  border:1px solid #E6EBEF;
  background:#F7F9FA;
  color:#4C545A;
}

.reaction-activity-label{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:13px;
  line-height:18px;
  color:#535C63;
}

.reaction-activity-label strong{
  color:#2F3438;
  font-weight:700;
}

.reaction-activity-emoji{
  flex:0 0 auto;
  font-size:17px;
  line-height:1;
}

.reaction-activity-bubble .reply-quote{
  margin-top:7px;
  margin-bottom:0;
}


/* =========================================================
   V7.6.99 - RÉACTIONS TOUT LE FIL + MINI LOADER
   ========================================================= */
.member-reaction-choice.is-selected{
  border-color:#62809B;
  background:#E7EEF4;
  box-shadow:0 0 0 1px rgba(98,128,155,.18);
}

.message-reaction-pill.is-mine{
  border-color:#62809B;
  background:#E7EEF4;
  color:#425B70;
}

.member-reaction-emoji,
.message-reaction-emoji{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  min-height:18px;
}

.member-reaction-choice.is-loading .member-reaction-emoji,
.message-reaction-pill.is-loading .message-reaction-emoji{
  width:18px;
  height:18px;
  min-width:18px;
  min-height:18px;
  overflow:hidden;
  color:transparent;
  font-size:0;
  border:2px solid rgba(98,128,155,.24);
  border-top-color:#62809B;
  border-radius:50%;
  animation:readimReactionSpin .65s linear infinite;
}

@keyframes readimReactionSpin{
  to{transform:rotate(360deg)}
}

/* =========================================================
   V7.6.107 - PHOTOS DANS LA MESSAGERIE PRIVÉE + MENUS SÉPARÉS
   ========================================================= */
.direct-chat-more{
  width:42px;
  height:42px;
  flex:0 0 42px;
  border:0;
  border-radius:50%;
  padding:0;
  background:#F0F1F2;
  color:#62809B;
  font-size:27px;
  line-height:42px;
  font-weight:500;
  text-align:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.direct-chat-more:active{background:#E7E9EB;}

.direct-photo-bubble{
  max-width:82%;
  padding:4px;
  overflow:hidden;
}
.direct-photo-open{
  display:block;
  max-width:100%;
  margin:0;
  padding:0;
  border:0;
  border-radius:10px;
  overflow:hidden;
  background:transparent;
  cursor:pointer;
}
.direct-photo-open img{
  display:block;
  width:auto;
  max-width:min(260px,68vw);
  max-height:390px;
  height:auto;
  object-fit:contain;
  border-radius:10px;
  background:#ECEFF1;
}
.direct-photo-bubble .direct-message-time{padding:0 5px 2px;}
.direct-photo-pending{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  border:0;
  text-align:left;
  cursor:pointer;
  font-family:inherit;
}
.direct-photo-pending strong{
  display:block;
  color:inherit;
  font-size:14px;
  line-height:20px;
}
.direct-photo-pending span{
  display:block;
  color:#6F777D;
  font-size:11px;
  line-height:16px;
}
.direct-photo-pending .direct-message-time{
  align-self:stretch;
  width:100%;
}

.direct-photo-send-card,
.direct-photo-warning-card{
  max-width:380px;
  gap:11px;
}
.direct-photo-file-input{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  overflow:hidden !important;
  pointer-events:none !important;
}
.direct-photo-send-note{
  color:#7A8187;
  font-size:12px;
  line-height:18px;
  text-align:center;
}
.direct-photo-preview{
  display:block;
  width:auto;
  max-width:100%;
  max-height:390px;
  margin:6px auto 0;
  border-radius:12px;
  object-fit:contain;
  background:#F1F3F4;
}
.direct-photo-send-card .session-enter-btn,
.direct-photo-warning-card .session-enter-btn,
.direct-photo-warning-card .delete-account-cancel{
  width:100%;
}
.direct-contact-options-name{
  margin-top:-2px;
  text-align:center;
  font-weight:700;
}
.direct-contact-block-button{
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  border:0;
  border-radius:11px;
  background:#111;
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}
.direct-contact-block-button:active{opacity:.84;}
.photo-viewer.direct-photo-viewer-top{z-index:30500;}
#directContactOptionsView .session-enter-btn,
#directContactOptionsView .delete-account-confirm{width:100%;}

/* =========================================================
   V7.6.108 - DISCUSSIONS ÉPURÉES / COMPOSEURS / PHOTOS DIRECTES
   ========================================================= */

/* Le bouton unique du composeur public doit avoir la même hauteur visuelle
   que le champ (44 px à sa hauteur de base), tout en restant centré. */
.bCDf40u{width:56px;}
.bCDf41C,
.bCDf53v{
  width:44px;
  height:44px;
  margin:7px 6px 7px 4px;
}
.bCDf41C{line-height:44px;}
.bCDf53v{line-height:44px;}

/* Discussions est traité visuellement comme une page interne : flèche Retour,
   aucun titre/bordure de header et compteur global à droite. */
.direct-hub-back{z-index:7710 !important;}
.direct-hub-inline-bubble{
  position:absolute;
  top:max(12px, env(safe-area-inset-top));
  right:max(10px, calc(50% - 335px + 10px));
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  padding:0;
  background:#35A766;
  color:#fff;
  font-size:14px;
  line-height:36px;
  font-weight:700;
  text-align:center;
  z-index:7710;
  pointer-events:none;
  box-shadow:none;
}
.direct-hub-inline-bubble.is-contact{background:#62809B;}
.direct-hub-inline-bubble.is-zero{background:#F5F5F5;color:#737C84;}
.direct-hub-inline-bubble span{color:inherit;}
@media(max-width:800px){.direct-hub-inline-bubble{right:10px;}}

#directHubView .direct-hub-scroll{
  height:100%;
  padding-top:max(62px, calc(env(safe-area-inset-top) + 54px));
}
.direct-hub-first-main-section{
  border-top:0;
  padding-top:8px;
}

/* Un seul bouton dynamique à droite dans la vraie messagerie privée :
   + lorsque le champ est vide, avion d'envoi dès qu'il contient du texte. */
.direct-chat-composer{align-items:flex-end;}
.direct-chat-input{
  min-height:44px;
  border-radius:22px;
  padding-top:11px;
  padding-bottom:11px;
}
.direct-chat-send{
  width:44px;
  height:44px;
  flex:0 0 44px;
  border:0;
  border-radius:50%;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#F0F1F2;
  color:#62809B;
  font-size:27px;
  line-height:44px;
  font-weight:500;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.direct-chat-send.is-send{
  background:#62809B;
  color:#fff;
  font-size:19px;
}
.direct-chat-send.is-more{background:#F0F1F2;color:#62809B;font-size:27px;}
.direct-chat-send:disabled{
  opacity:.55;
  cursor:default;
}

/* Identité du contact en tête des overlays relation/photo. */
.direct-contact-options-card,
.direct-photo-send-card{max-width:390px;}
.direct-overlay-person{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  margin-bottom:16px;
}
.direct-overlay-person-avatar{
  width:88px;
  height:88px;
  border-radius:50%;
  overflow:hidden;
  background:#EEF1F4;
  display:flex;
  align-items:center;
  justify-content:center;
}
.direct-overlay-person-avatar img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.direct-overlay-person-initial{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#62809B;
  font-size:29px;
  line-height:88px;
  font-weight:700;
}
.direct-overlay-person-name{
  width:100%;
  margin-top:14px;
  color:#202428;
  font-size:22px;
  line-height:28px;
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.direct-overlay-person-meta{
  width:100%;
  min-height:20px;
  margin-top:4px;
  color:#8A8F93;
  font-size:14px;
  line-height:20px;
}
.direct-photo-send-card .plus-menu-button{margin-top:0;}
.direct-photo-send-card .session-error{margin-top:9px;}

/* Pour le privé direct, on réutilise vraiment l'aperçu noir du chat public,
   mais il doit passer au-dessus des overlays directs (z-index > 30240). */
.photo-send-preview.direct-photo-send-preview-top{z-index:30450;}
.photo-send-preview.direct-photo-send-preview-top .photo-send-preview-close,
.photo-send-preview.direct-photo-send-preview-top .photo-send-preview-error,
.photo-send-preview.direct-photo-send-preview-top .photo-send-preview-button{z-index:30460;}

/* Chargement progressif des photos dans les bulles directes : la place est
   réservée dès le rendu, un petit loader est visible, puis l'image apparaît. */
.direct-photo-open{max-width:100%;}
.direct-photo-image-shell{
  position:relative;
  display:block;
  max-width:100%;
  max-height:390px;
  overflow:hidden;
  border-radius:10px;
  background:#ECEFF1;
}
.direct-photo-image-shell img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:10px;
  opacity:0;
  transition:opacity .18s ease;
}
.direct-photo-image-shell.is-loaded img{opacity:1;}
.direct-photo-image-loader{
  position:absolute;
  left:50%;
  top:50%;
  width:24px;
  height:24px;
  margin:-12px 0 0 -12px;
  border:2px solid rgba(98,128,155,.22);
  border-top-color:#62809B;
  border-radius:50%;
  animation:readimPhotoSpin .8s linear infinite;
  z-index:1;
}
.direct-photo-image-shell.is-loaded .direct-photo-image-loader{display:none;}
.direct-photo-image-shell.is-error .direct-photo-image-loader{animation:none;border-color:#B7BEC3;}
.direct-photo-image-shell.is-error .direct-photo-image-loader:after{
  content:'×';
  position:absolute;
  inset:0;
  color:#7A8187;
  font-size:17px;
  line-height:20px;
  text-align:center;
}

/* Icône Material « image » devant l'annonce d'une photo masquée. */
.direct-photo-pending-title{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.direct-photo-material-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
  fill:currentColor;
}

/* Le bouton gris de refus a été supprimé : la croix ferme simplement l'overlay. */
.direct-photo-warning-card{gap:16px;}


/* =========================================================
   V7.6.109 - FINITIONS COMPOSEURS / CONVERSATION DIRECTE
   ========================================================= */
/* Le composeur public reste la référence visuelle. Le bouton rond est
   volontairement 2 px plus petit que le champ (42 vs ~44 px), mais son
   enveloppe verticale conserve exactement la même hauteur afin qu'il soit
   parfaitement centré. */
.bCDf41C,
.bCDf53v{
  width:42px;
  height:42px;
  margin:8px 6px 8px 4px;
}
.bCDf41C{line-height:42px;}
.bCDf53v{line-height:42px;}

/* La conversation directe est épurée : aucun trait sous l'en-tête ni au-dessus
   du composeur. Son champ reprend le fond, la typo, l'arrondi et la hauteur
   visuelle du composeur du chat de groupe. */
.direct-chat-header{border-bottom:0;}
.direct-chat-composer{
  border-top:0;
  align-items:flex-end;
}
.direct-chat-input{
  min-height:44px;
  max-height:112px;
  border:0;
  border-radius:22px;
  padding:10px 13px 9px;
  background:#F4F4F4;
  color:#515151;
  font-size:18px;
  line-height:23px;
}
.direct-chat-input.is-disabled{background:#F4F4F4;}
.direct-chat-input:empty:before{color:#A4A4A4;}
.direct-chat-send{
  width:42px;
  height:42px;
  flex:0 0 42px;
  margin-bottom:1px;
  line-height:42px;
}
.direct-chat-send.is-more{
  background:#C7D2DC;
  color:#fff;
  font-size:26px;
}
.direct-chat-send.is-send{
  background:#62809B;
  color:#fff;
  font-size:17px;
}

/* État transitoire : une conversation déjà connue affiche un petit loader
   jusqu'à ce que son historique ait réellement répondu. Cela empêche le faux
   « Envoyez votre premier message » pendant une requête réseau lente. */
.direct-chat-loading{
  width:100%;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px 20px;
}
.direct-chat-loading-spinner{
  width:24px;
  height:24px;
  border:3px solid #E3E8EC;
  border-top-color:#62809B;
  border-radius:50%;
  animation:readimDirectLoadingSpin .75s linear infinite;
}
.direct-chat-load-error{
  padding:24px 20px;
  text-align:center;
  color:#8B9196;
  font-size:13px;
  line-height:19px;
}
@keyframes readimDirectLoadingSpin{to{transform:rotate(360deg);}}

/* =========================================================
   V7.6.110 - HARMONISATION OVERLAYS / AXE COMPOSEUR
   ========================================================= */
/* Le + public partage exactement l'axe horizontal des flèches flottantes
   (right:14px, diamètre 42px). Taille V7.6.109 conservée. */
.bCDf41C,
.bCDf53v{
  margin:8px 14px 8px 0;
}

/* Les overlays de la vraie messagerie privée commencent à la même hauteur que
   les fiches du chat de groupe : l'identité n'est plus centrée au milieu. */
#directOptionsView,
#directContactOptionsView,
#directTwoPersonView,
#directMediaView,
#directPhotoWarningView,
#directConfirmView{
  box-sizing:border-box;
  align-items:flex-start;
  justify-content:center;
  padding-top:max(76px, calc(env(safe-area-inset-top) + 62px));
}

/* Deux portraits légèrement superposés = conversation entre deux personnes. */
.direct-pair-avatars{
  width:122px;
  height:88px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 22px;
  position:relative;
}
.direct-pair-avatar{
  position:absolute;
  top:0;
  width:82px;
  height:82px;
  border-radius:50%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#EEF1F4;
  box-shadow:0 0 0 3px #fff;
}
.direct-pair-avatar-self{left:0;z-index:1;}
.direct-pair-avatar-other{right:0;z-index:2;}
.direct-pair-avatar img{display:block;width:100%;height:100%;object-fit:cover;}
.direct-pair-avatar .direct-overlay-person-initial{
  width:100%;height:100%;font-size:27px;line-height:82px;
}

.direct-two-person-card{max-width:390px;gap:0;}
.direct-two-person-text{
  width:100%;
  color:#777;
  font-size:14px;
  line-height:21px;
  text-align:center;
}
.direct-two-person-note{
  width:100%;
  margin-top:6px;
  color:#9A9EA2;
  font-size:12px;
  line-height:18px;
  text-align:center;
}
.direct-two-person-card .session-enter-btn{width:100%;margin-top:18px;}

/* =========================================================
   V7.6.137 - AJOUT CONTACT : EXPLICATION EN 2 ÉTAPES
   ========================================================= */
.direct-two-person-steps{
  width:100%;
  margin-top:14px;
}
.direct-two-person-step{
  width:100%;
  box-sizing:border-box;
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-top:9px;
  padding:11px 12px;
  border-radius:11px;
  background:#F4F5F6;
}
.direct-two-person-step:first-child{margin-top:0;}
.direct-two-person-step-number{
  flex:0 0 25px;
  width:25px;
  height:25px;
  border-radius:50%;
  background:#62809B;
  color:#fff;
  font-size:13px;
  line-height:25px;
  font-weight:700;
  text-align:center;
}
.direct-two-person-step-text{
  flex:1 1 auto;
  min-width:0;
  color:#4C4C4C;
  font-size:13px;
  line-height:19px;
  text-align:left;
}
.direct-two-person-step-note{
  margin-top:3px;
  color:#7E858B;
  font-size:12px;
  line-height:17px;
}
.direct-two-person-ready{
  width:100%;
  margin-top:15px;
  color:#62809B;
  font-size:13px;
  line-height:19px;
  font-weight:700;
  text-align:center;
}
.direct-two-person-warning{
  width:100%;
  box-sizing:border-box;
  margin-top:11px;
  padding:10px 12px;
  border-radius:10px;
  background:#FFF3F3;
  color:#C62828;
  font-size:13px;
  line-height:19px;
  font-weight:700;
  text-align:center;
}
.direct-two-person-card .session-enter-btn{margin-top:16px;}

/* Confirmation directe : la croix est l'unique annulation. */
#directConfirmView .delete-account-cancel{display:none !important;}

/* V7.6.111 */
#directHubInlineBubble{display:none !important;}
#directHubView .direct-hub-scroll{width:100%;max-width:670px;box-sizing:border-box;overflow-x:hidden;}
#directHubView .direct-list-avatar,#directHubView .direct-list-initial{width:46px !important;height:46px !important;min-width:46px !important;flex:0 0 46px !important;}
#directHubView .direct-conversation-row,#directHubView .direct-contact-row,#directHubView .direct-blocked-row,#directHubView .direct-group-row{width:100%;box-sizing:border-box;}
#directHubView img.direct-list-avatar{display:block;object-fit:cover;}
@media(max-width:800px){.bCDf40u{width:60px;}.bCDf41C,.bCDf53v{margin-left:auto;margin-right:14px;}}
@media(min-width:801px){.bCDf40u{width:60px;}.bCDf41C,.bCDf53v{margin-left:auto;margin-right:14px;}}


/* =========================================================
   V7.6.112 - HIÉRARCHIE VISUELLE GROUPE / PRIVÉ
   ========================================================= */
.readim-action-context-title{
  width:100%;
  color:#62809B;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-align:center;
}
.member-group-context-title{
  margin-bottom:1px;
}
.member-direct-context-title{
  margin:0 0 1px;
}

/* Répondre appartient au même ensemble d'actions de groupe : aucun bouton
   bleu privilégié sur cette fiche. */
#memberReplyBtn{
  background:#F1F3F5;
  color:#4E4E4E;
}
#memberReplyBtn:active{background:#E7E9EB;}

/* Menu + : même gabarit vertical que les autres overlays avec identité. */
.plus-menu-view{
  box-sizing:border-box;
  align-items:flex-start;
  justify-content:center;
  padding-top:max(76px, calc(env(safe-area-inset-top) + 62px));
}
.plus-menu-card{
  justify-content:flex-start;
  margin:0 auto;
}
.plus-menu-identity{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  margin-bottom:24px;
}
.plus-menu-view .readim-action-context-title{margin-bottom:2px;}
.plus-menu-view .plus-menu-primary,
.plus-menu-view .plus-menu-secondary{
  background:#F0F1F2;
  color:#202428;
}
.plus-menu-section-separator{
  width:100%;
  height:1px;
  margin:16px 0 2px;
  background:#E7EBEE;
}

/* La position verticale du bouton violet est pilotée par JS ; sa géométrie
   (taille/axe horizontal) reste identique à celle déjà validée. */
.pending-replies-indicator{
  transition:bottom .14s ease;
}


/* =========================================================
   V7.6.113 - CORRECTION EFFECTIVE DES RETOUCHES V7.6.112
   ========================================================= */
.plus-menu-identity{display:flex !important;}
.plus-menu-identity .member-large-avatar{display:block !important;width:112px;height:112px;min-width:112px;object-fit:cover;border-radius:50%;}
.plus-menu-identity .member-large-name{display:block !important;margin-top:12px;}
.plus-menu-view .readim-action-context-title,
.member-group-context-title,
.member-direct-context-title{display:block !important;color:#62809B !important;}
#directGroupsSection{order:999;}
#directHubScroll{display:flex;flex-direction:column;}
#directHubScroll > .direct-section{flex:0 0 auto;}


/* =========================================================
   V7.6.114 - RENDU ROBUSTE DES BLOCS AJOUTÉS
   ========================================================= */
#directHubScroll{display:flex !important;flex-direction:column !important;}
#directGroupsSection{order:9999 !important;}
#directContactsSection{order:20 !important;}
#directBlockedSection{order:30 !important;}
#directHubScroll > .direct-hub-first-main-section{order:10 !important;}

.plus-menu-identity{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  width:100% !important;
  margin:0 0 18px !important;
}
.plus-menu-identity #plusMenuAvatar{
  display:block !important;
  width:112px !important;
  height:112px !important;
  min-width:112px !important;
  border-radius:50% !important;
  object-fit:cover !important;
}
.plus-menu-identity #plusMenuName{
  display:block !important;
  margin-top:12px !important;
  font-size:24px !important;
  line-height:30px !important;
  font-weight:700 !important;
  text-align:center !important;
  color:#202428 !important;
}
.readim-action-context-title,
.plus-group-context-title,
.member-group-context-title,
.member-direct-context-title{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  color:#62809B !important;
  text-align:center !important;
  font-size:14px !important;
  line-height:20px !important;
  font-weight:700 !important;
}
.plus-group-context-title{margin:0 0 8px !important;}
.member-group-context-title{margin:0 0 8px !important;}
.member-direct-context-title{margin:10px 0 8px !important;}


/* =========================================================
   V7.6.115 - MENU STRUCTURÉ + ORDRE DISCUSSIONS SANS AMBIGUÏTÉ
   ========================================================= */
/* L'ordre réel est désormais imposé dans le DOM par JS. Aucun ancien order
   CSS ne doit pouvoir inverser les sections. */
#directMessagesSection,
#directContactsSection,
#directBlockedSection,
#directGroupsSection{order:initial !important;}
#directHubScroll{display:block !important;}

/* Les titres sont des RUBRIQUES de menu, pas des sous-titres du profil. */
.plus-menu-view .readim-action-context-title,
#memberActionView .member-group-context-title,
#memberActionView .member-direct-context-title{
  box-sizing:border-box !important;
  width:100% !important;
  margin:18px 0 8px !important;
  padding:0 4px !important;
  color:#62809B !important;
  font-size:13px !important;
  line-height:18px !important;
  font-weight:700 !important;
  letter-spacing:.02em !important;
  text-transform:uppercase !important;
  text-align:left !important;
}
.plus-menu-view .plus-group-context-title{margin-top:2px !important;}
#memberActionView .member-group-context-title{margin-top:18px !important;}
#memberActionView .member-direct-context-title{margin-top:10px !important;}

/* Vraies coupures entre : actions du groupe / navigation / déconnexion. */
.plus-menu-section-separator{
  display:block !important;
  width:100% !important;
  height:1px !important;
  margin:18px 0 8px !important;
  background:#E3E7EA !important;
}
.plus-menu-logout-separator{margin-top:20px !important;}

/* La déconnexion retrouve son statut destructif, sans devenir un bouton bleu. */
#plusLogout,
#plusLogout.plus-menu-secondary{
  color:#B94A4A !important;
  font-weight:700 !important;
}

/* Les boutons ordinaires restent neutres. */
.plus-menu-view #plusPublicPhoto,
.plus-menu-view #plusPublicLocation,
.plus-menu-view #plusSearch,
.plus-menu-view #plusSettings{
  background:#F0F1F2 !important;
  color:#202428 !important;
}


/* =========================================================
   V7.6.116 - CORRECTIONS CIBLÉES VALIDÉES
   ========================================================= */
/* Fallback CSS : même si le DOM initial provient d'un ancien fragment, le
   rendu visuel reste Messages -> Contacts -> Bloqués -> Groupes. Le JS
   réordonne aussi physiquement les nœuds. */
#directHubScroll{
  display:flex !important;
  flex-direction:column !important;
}
#directMessagesSection{order:10 !important;}
#directContactsSection{order:20 !important;}
#directBlockedSection{order:30 !important;}
#directGroupsSection{order:40 !important;}

/* Le trait après les actions « Dans le groupe » doit être perceptible : il
   sépare réellement les actions de publication de la navigation générale. */
.plus-menu-section-separator,
.plus-menu-navigation-separator,
.plus-menu-logout-separator{
  display:block !important;
  align-self:stretch !important;
  width:auto !important;
  height:0 !important;
  min-height:0 !important;
  margin:16px 4px 8px !important;
  padding:0 !important;
  border:0 !important;
  border-top:1px solid #D7DDE2 !important;
  background:transparent !important;
  opacity:1 !important;
}
.plus-menu-logout-separator{margin-top:20px !important;}


/* =========================================================
   V7.6.117 - PARCOURS RECHERCHE / CONTACT / MESSAGERIE
   ========================================================= */
.plus-tools-context-title{
  margin:22px 8px 8px !important;
  text-transform:uppercase;
  text-align:left !important;
  color:#62809B;
  font-weight:700;
  letter-spacing:.2px;
}
/* OUTILS remplace le trait entre les actions du groupe et Recherche. */
.plus-tools-context-title + #plusSearch{margin-top:0 !important;}

.search-message-choice-actions{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:24px;
}
.search-message-choice-actions .member-action-button{
  width:100%;
}

.direct-contact-added-card{
  width:min(620px,calc(100vw - 44px));
  align-items:center;
}
.direct-contact-added-person{
  margin-bottom:18px;
}
.direct-contact-added-text{
  width:100%;
  text-align:center;
  color:#777;
  font-size:18px;
  line-height:1.45;
  margin:0 0 24px;
}
#directContactAddedEnter{width:100%;}


/* =========================================================
   V7.6.118 - FICHE MEMBRE ADAPTATIVE + OVERLAYS RELATION
   ========================================================= */
.member-extra-actions{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:11px;
}
.member-more-actions-toggle{
  align-self:center;
  width:auto;
  min-height:30px;
  margin:-2px auto 0;
  padding:3px 10px;
  border:0;
  background:transparent;
  color:#62809B;
  font-size:14px;
  line-height:20px;
  font-weight:700;
  text-align:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.member-more-actions-toggle:active{opacity:.72;}

/* La confirmation après ajout utilise la même hauteur de départ que les
   autres overlays avec portrait ; elle ne doit jamais être centrée au milieu. */
#directContactAddedView{
  box-sizing:border-box;
  align-items:flex-start;
  justify-content:center;
  padding-top:max(76px, calc(env(safe-area-inset-top) + 62px));
}
#directContactAddedView .direct-contact-added-card{
  margin:0 auto;
}

/* L'étape « ajouter en contact » est une navigation dans le parcours,
   donc flèche retour à gauche, comme les autres pages, pas une croix. */
#directTwoPersonView > #directTwoPersonClose{
  position:absolute;
}


/* =========================================================
   V7.6.119 - ACTIONS MEMBRE SMARTPHONE + OPTIONS CONTACT
   ========================================================= */
/* Le menu commence plus près de la description du profil. */
#memberActionView .member-action-buttons{
  margin-top:18px !important;
}
#memberActionView .member-group-context-title{
  margin-top:0 !important;
}

/* Les actions secondaires conservent TOUJOURS le format ReadIM normal :
   une colonne de grands boutons gris. Aucun affichage en tuiles/colonnes. */
#memberActionView #memberExtraActions.member-extra-actions{
  width:100% !important;
  display:flex;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:11px !important;
}
#memberActionView #memberExtraActions.member-extra-actions > .member-action-button{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  flex:0 0 auto !important;
}

/* Smartphone : petit LIEN gris, sans fond, sans bordure, en bas à droite. */
@media(max-width:600px){
  #memberActionView #memberMoreActionsToggle.member-more-actions-toggle{
    display:none;
    align-self:flex-end !important;
    width:auto !important;
    min-width:0 !important;
    min-height:20px !important;
    margin:0 4px 0 auto !important;
    padding:1px 0 !important;
    border:0 !important;
    border-radius:0 !important;
    outline:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    color:#8A8A8A !important;
    font-size:12px !important;
    line-height:18px !important;
    font-weight:400 !important;
    text-align:right !important;
    text-decoration:none !important;
  }
}

/* Tablettes / ordinateurs : tout afficher, aucun lien Plus d’actions. */
@media(min-width:601px){
  #memberActionView #memberMoreActionsToggle{display:none !important;}
  #memberActionView #memberExtraActions{display:flex !important;}
}

/* Options d’un contact depuis Discussions : navigation par flèche, action
   d’ouverture neutre, puis séparation des actions relationnelles. */
#directContactOptionsView #directContactOptionsClose.member-screen-back{
  position:absolute !important;
  display:block !important;
}
#directContactOptionsView #directContactOpenChat.session-enter-btn{
  background:#F1F3F5 !important;
  color:#2E3337 !important;
}
#directContactOptionsView #directContactOpenChat.session-enter-btn:active{
  background:#E7E9EB !important;
}
#directContactOptionsView .direct-contact-options-separator{
  display:block !important;
  width:100% !important;
  height:0 !important;
  margin:16px 0 4px !important;
  border:0 !important;
  border-top:1px solid #E1E5E8 !important;
}


/* =========================================================
   V7.6.120 - ÉCHANGES + ÉTAT VIDE DISCUSSIONS
   ========================================================= */
.person-exchanges-section-title{
  position:absolute;
  top:219px;
  left:50%;
  transform:translateX(-50%);
  box-sizing:border-box;
  width:100%;
  max-width:670px;
  height:42px;
  padding:10px 18px 8px;
  background:#fff;
  color:#62809B;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  text-align:left;
  z-index:9;
}
.person-messages{
  top:261px;
}


/* =========================================================
   V7.6.121 - ALIGNEMENT PHOTO PRIVÉE + ESPACE ÉCHANGES
   ========================================================= */
/* L'identité de l'overlay d'envoi d'une photo privée doit commencer à la
   même hauteur que les autres overlays profil/privés (76px). */
#privatePhotoView .media-content{
  padding-top:76px !important;
}

/* La rubrique des échanges est une section indépendante du bloc profil.
   On laisse un espace visible sous sexe/âge/pays avant son intitulé. */
#personView .person-exchanges-section-title{
  top:239px !important;
}
#personView .person-messages{
  top:281px !important;
}


/* =========================================================
   V7.6.122 - OVERLAYS D'ACTIONS UNIFORMES + META STABLE
   ========================================================= */

/* Un titre d'action unique, placé DANS l'encadré explicatif.
   Le pseudo reste exclusivement dans l'identité du profil en haut. */
.private-action-note-title{
  margin:0 0 7px 0;
  color:#333;
  font-size:15px;
  line-height:20px;
  font-weight:700;
  text-align:center;
}

/* Le vocal suit désormais exactement le modèle de la localisation :
   identité en haut, puis un seul encadré titre + description. */
#privateAudioView .private-audio-info{
  margin-top:4px !important;
}
#privateAudioView .private-tool-title{
  display:none !important;
}

/* Message privé : le titre fait partie de l'encadré. */
#privateMessageInfo .private-action-note-title{
  margin-bottom:7px;
}
#privateMessageInfo.private-message-info-reply{
  padding:12px 14px !important;
}

/* Photo privée : même hiérarchie titre + explication. */
#privatePhotoView .private-photo-note{
  margin-top:12px;
}

/* Correctif de repaint Samsung Internet / Chrome / WebView :
   les lignes sexe · âge · pays restent dans une couche simple et stable. */
.member-profile-meta.readim-meta-ready{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  min-height:17px !important;
  position:relative !important;
  z-index:12 !important;
  transform:none !important;
  -webkit-transform:none !important;
  backface-visibility:visible !important;
  -webkit-backface-visibility:visible !important;
}

/* Les identités audio étaient centrées via transform, ce qui peut provoquer
   un défaut de compositing/repaint sur certains navigateurs mobiles.
   On garde exactement la même géométrie sans transform. */
.private-tool-identity{
  left:0 !important;
  right:0 !important;
  margin:0 auto !important;
  transform:none !important;
  -webkit-transform:none !important;
}
.private-tool-body{
  left:0 !important;
  right:0 !important;
  margin:0 auto !important;
  transform:none !important;
  -webkit-transform:none !important;
}

/* Réserver la ligne méta même pendant les mises à jour de profil afin
   d'éviter tout saut vertical des overlays. */
#privateMessageMeta,
#privateAudioMeta,
#privatePhotoMeta,
#privateLocationMeta,
#memberActionMeta,
#personProfileMeta{
  min-height:17px;
}


/* =========================================================
   V7.6.123 - FINITIONS OVERLAYS ACTIONS DU GROUPE
   ========================================================= */

/* Le cadenas n'est plus affiché sur l'overlay de message privé. */
.private-message-lock{
  display:none !important;
}

/* Harmonisation du parcours "Envoyer un vocal" :
   plus d'air entre l'encadré explicatif, le bouton principal
   et la petite ligne d'information du dessous. */
.private-audio-open-recorder{
  margin-top:24px !important;
}
.private-audio-status{
  margin-top:20px !important;
}

/* L'action "choisir une photo privée" doit suivre le code couleur
   principal du projet, comme les autres actions principales. */
#privatePhotoView .media-file-label-primary{
  background:#62809B !important;
  color:#FFFFFF !important;
}

/* Léger confort visuel pour le titre et son encadré sur le message privé,
   désormais sans cadenas au-dessus. */
#privateMessageView .private-message-info{
  margin-top:18px !important;
}


/* =========================================================
   V7.6.124 - VOCAL : CORRECTION STRUCTURELLE + PHOTO PUBLIQUE
   ========================================================= */

/*
 * L'ancien overlay vocal est différent des autres :
 * .private-tool-identity avait une hauteur fixe de 219px tandis que
 * photo + pseudo + meta occupent environ 227px.
 * Le corps commençait donc avant la fin réelle de l'identité.
 *
 * On porte uniquement le vocal à 239px. Avec les 8px de padding du body
 * et les 4px de marge de l'encadré, celui-ci commence vers 251px,
 * soit l'espacement du modèle "Partager ma localisation".
 */
#privateAudioView .private-tool-identity{
  height:239px !important;
}
#privateAudioView .private-tool-body{
  top:239px !important;
}

/* Le corps vocal conserve sa liste verticale et son scroll dans l'espace
   restant ; aucune transformation ou marge artificielle sur la meta. */
#privateAudioView .private-audio-body{
  box-sizing:border-box !important;
}

/* Photo publique depuis le bouton + :
   même hiérarchie que les autres actions : encadré explicatif puis CTA bleu. */
#mediaView .media-content{
  padding-top:88px !important;
}
#mediaView .public-photo-action-note{
  margin-top:0 !important;
}
#mediaView .public-photo-action-note + .media-file-label{
  margin-top:18px !important;
}
#mediaView .media-file-label-primary{
  background:#62809B !important;
  color:#FFFFFF !important;
}
#mediaView .media-file-label-primary:active{
  background:#62809B !important;
  opacity:.92;
}

/* L'ancien titre isolé ne doit plus réserver d'espace dans cette vue. */
#mediaView .media-title{
  display:none !important;
}


/* =========================================================
   V7.6.125 - AJOUT DE CONTACT COMME ÉVÉNEMENT DU GROUPE
   ========================================================= */

.contact-add-bubble{
  background:#F4F4F4 !important;
}

.contact-add-event{
  box-sizing:border-box;
  width:100%;
  color:#555;
  font-size:13px;
  line-height:19px;
}

.contact-add-main{
  display:flex;
  align-items:flex-start;
  gap:8px;
}

.contact-add-icon{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  font-size:17px;
  line-height:19px;
}

.contact-add-help{
  margin-top:8px;
  color:#777;
  font-size:12px;
  line-height:17px;
}

.contact-add-action,
.contact-add-open-direct{
  box-sizing:border-box;
  width:100%;
  min-height:40px;
  margin-top:11px;
  padding:8px 12px;
  border:0;
  border-radius:10px;
  background:#62809B;
  color:#fff;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-align:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.contact-add-action:disabled{
  opacity:.58;
  cursor:default;
}

.contact-add-action:active,
.contact-add-open-direct:active{
  opacity:.90;
}

/* L'annonce publique reste compacte ; la version destinée directement au
   membre peut être un peu plus large pour accueillir son bouton d'action. */
.message-bubble.contact-add-bubble{
  max-width:min(92%,420px);
}

/* Le regroupement existant des longues séries est réutilisé :
   après deux ajouts consécutifs du même membre, "Voir les ajouts" permet
   d'ouvrir la suite sans polluer le flux. */
.message-line[data-sequence-kind="contact_add"].public-sequence-hidden{
  display:none;
}

/* =========================================================
   V7.6.128 - PARTAGE DU GROUPE
   ========================================================= */
.group-share-content{
  padding-top:76px;
}
.group-share-note{
  margin-top:24px;
}
.group-share-link-box{
  width:100%;
  margin-top:16px;
  padding:14px 14px 12px;
  border-radius:12px;
  background:#F1F3F4;
  text-align:center;
}
.group-share-link{
  display:block;
  width:100%;
  min-width:0;
  margin:0;
  padding:3px 2px;
  border:0;
  outline:0;
  background:transparent;
  color:#333;
  font-family:Arial,Helvetica,sans-serif;
  font-size:14px;
  line-height:20px;
  text-align:center;
  cursor:text;
  -webkit-user-select:text;
  user-select:text;
}
.group-share-link-hint{
  margin-top:7px;
  color:#7C8389;
  font-size:12px;
  line-height:17px;
}
.group-share-fallback{
  width:100%;
  margin-top:10px;
  display:flex;
  gap:10px;
}
.group-share-fallback-button{
  flex:1 1 0;
  min-height:44px;
  border:0;
  border-radius:10px;
  background:#F0F1F2;
  color:#202428;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}
.group-share-fallback-button:active{background:#E7E9EB;}
.plus-menu-view #plusShareGroup{
  background:#F0F1F2 !important;
  color:#202428 !important;
}

/* =========================================================
   V7.6.132 - SKELETONS STABLES POUR DISCUSSIONS
   ========================================================= */
#directHubView .direct-list.is-loading{
  width:100%;
  box-sizing:border-box;
}
.direct-loading-row{
  position:relative;
  box-sizing:border-box;
  width:100%;
  min-height:64px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:8px 34px 8px 8px;
  border-radius:11px;
  background:#F3F5F6;
  overflow:hidden;
  pointer-events:none;
}
.direct-loading-avatar{
  width:46px;
  height:46px;
  min-width:46px;
  flex:0 0 46px;
  border-radius:50%;
  background:#E8ECEF;
}
.direct-loading-copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.direct-loading-line{
  display:block;
  height:8px;
  border-radius:6px;
  background:#E3E7EA;
}
.direct-loading-line-main{width:58%;}
.direct-loading-line-sub{width:76%;height:7px;}
.direct-loading-dots{
  position:absolute;
  right:10px;
  bottom:8px;
  display:flex;
  align-items:center;
  gap:3px;
  height:6px;
}
.direct-loading-dots span{
  width:4px;
  height:4px;
  border-radius:50%;
  background:#98A2AA;
  opacity:.14;
  animation-duration:1.2s;
  animation-iteration-count:infinite;
  animation-timing-function:steps(1,end);
}
.direct-loading-dots span:nth-child(1){animation-name:readimDirectLoadingDotOne;}
.direct-loading-dots span:nth-child(2){animation-name:readimDirectLoadingDotTwo;}
.direct-loading-dots span:nth-child(3){animation-name:readimDirectLoadingDotThree;}
/* 1 point -> 2 points -> 3 points -> 1 point. */
@keyframes readimDirectLoadingDotOne{
  0%,100%{opacity:.82;}
}
@keyframes readimDirectLoadingDotTwo{
  0%,24%,75%,100%{opacity:.14;}
  25%,74%{opacity:.82;}
}
@keyframes readimDirectLoadingDotThree{
  0%,49%,75%,100%{opacity:.14;}
  50%,74%{opacity:.82;}
}
@media (prefers-reduced-motion:reduce){
  .direct-loading-dots span{animation:none;opacity:.55;}
}


/* =========================================================
   V7.6.136 - AJOUT MUTUEL : MESSAGE + OVERLAY PÉDAGOGIQUE
   ========================================================= */
.contact-mutual-more{
  display:inline-block;
  width:auto;
  margin:7px 0 0 28px;
  padding:5px 10px;
  border:0;
  border-radius:14px;
  background:#E8EFF3;
  color:#62809B;
  font-family:Arial,Helvetica,sans-serif;
  font-size:12px;
  line-height:16px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.contact-mutual-more:active{opacity:.84;}

.contact-mutual-info-view{
  box-sizing:border-box;
  align-items:flex-start;
  justify-content:center;
  padding-top:max(70px, calc(env(safe-area-inset-top) + 58px));
  overflow-y:auto;
}
.contact-mutual-info-card{
  max-width:410px;
  margin:0 auto 28px;
  gap:0;
}
.contact-mutual-info-title{
  margin-bottom:18px;
}
.contact-mutual-pair{
  width:100%;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:12px;
  margin:0 auto 16px;
}
.contact-mutual-person{
  width:96px;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.contact-mutual-avatar{
  width:72px;
  height:72px;
  border-radius:50%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#EEF1F4;
}
.contact-mutual-avatar img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.contact-mutual-avatar .direct-overlay-person-initial{
  width:100%;
  height:100%;
  font-size:24px;
  line-height:72px;
}
.contact-mutual-name{
  width:100%;
  margin-top:7px;
  overflow:hidden;
  color:#333;
  font-size:13px;
  line-height:17px;
  font-weight:700;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.contact-mutual-link{
  flex:0 0 auto;
  margin-top:24px;
  color:#62809B;
  font-size:24px;
  line-height:28px;
  font-weight:700;
}
.contact-mutual-intro{
  width:100%;
  margin-bottom:16px;
  color:#444;
  font-size:14px;
  line-height:21px;
  font-weight:700;
  text-align:center;
}
.contact-mutual-step{
  width:100%;
  box-sizing:border-box;
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-top:9px;
  padding:11px 12px;
  border-radius:11px;
  background:#F4F5F6;
}
.contact-mutual-step-number{
  flex:0 0 25px;
  width:25px;
  height:25px;
  border-radius:50%;
  background:#62809B;
  color:#fff;
  font-size:13px;
  line-height:25px;
  font-weight:700;
  text-align:center;
}
.contact-mutual-step-text{
  flex:1 1 auto;
  min-width:0;
  color:#4C4C4C;
  font-size:13px;
  line-height:19px;
}
.contact-mutual-private-ready{
  width:100%;
  margin-top:16px;
  color:#62809B;
  font-size:14px;
  line-height:20px;
  font-weight:700;
  text-align:center;
}
.contact-mutual-free-rule{
  width:100%;
  margin-top:20px;
  color:#555;
  font-size:13px;
  line-height:19px;
  font-weight:700;
  text-align:center;
}
.contact-mutual-warning{
  width:100%;
  box-sizing:border-box;
  margin-top:9px;
  padding:11px 12px;
  border-radius:10px;
  background:#FFF3F3;
  color:#C62828;
  font-size:13px;
  line-height:19px;
  text-align:center;
}

/* =========================================================
   V7.6.161 - Administration intégrée à la PWA en AJAX / SPA
   ========================================================= */
.readim-admin-view{
  position:fixed;
  inset:0;
  z-index:21000;
  background:#fff;
  overflow:hidden;
}
.readim-admin-content{
  position:absolute;
  inset:0;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  background:#fff;
}
.readim-admin-loader{
  position:absolute;
  inset:0;
  z-index:4;
  display:none;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding:0;
  background:#fff;
  color:#30343a;
}
.readim-admin-view.is-loading .readim-admin-content{visibility:hidden;pointer-events:none;}

/* =========================================================
   V7.6.162 - SKELETONS ADMIN STABLES, IDENTIQUES À DISCUSSIONS
   ========================================================= */
.readim-admin-skeleton-shell{
  width:100%;
  max-width:670px;
  min-height:100%;
  margin:0 auto;
  padding:26px 18px 52px;
  box-sizing:border-box;
  background:#fff;
}
.readim-admin-skeleton-head{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 44px;
  align-items:start;
  gap:14px;
  margin:0 0 28px;
  padding:4px 0 0;
}
.readim-admin-skeleton-back{
  display:block;
  width:18px;
  height:30px;
  margin:5px 0 0 3px;
  border-radius:8px;
  background:#E3E7EA;
}
.readim-admin-skeleton-head-copy{display:flex;min-width:0;flex-direction:column;gap:9px;padding-top:3px;}
.readim-admin-skeleton-head-spacer{display:block;width:44px;height:44px;background:transparent;}
.readim-admin-skeleton-line{display:block;height:10px;border-radius:7px;background:#E3E7EA;}
.readim-admin-skeleton-line.is-title{height:18px;max-width:260px;}
.readim-admin-skeleton-line.is-subtitle{height:8px;max-width:460px;}
.readim-admin-skeleton-line.is-heading{height:12px;}
.readim-admin-skeleton-line.is-small{height:7px;}
.readim-admin-skeleton-line.is-number{height:26px;background:#DDE3E7;}
.readim-admin-skeleton-stack{display:grid;gap:16px;}
.readim-admin-skeleton-card,
.readim-admin-skeleton-day,
.readim-admin-skeleton-row{
  position:relative;
  overflow:hidden;
  box-sizing:border-box;
  width:100%;
  border-radius:17px;
  background:#F3F5F6;
  pointer-events:none;
}
.readim-admin-skeleton-card{min-height:142px;padding:20px 36px 20px 18px;display:flex;flex-direction:column;gap:13px;}
.readim-admin-skeleton-card.is-brand{min-height:116px;}
.readim-admin-skeleton-card.is-search{min-height:146px;}
.readim-admin-skeleton-card.is-selection{min-height:238px;}
.readim-admin-skeleton-card.is-profile{min-height:220px;}
.readim-admin-skeleton-card.is-update{min-height:178px;}
.readim-admin-skeleton-card.is-upload{min-height:180px;}
.readim-admin-skeleton-card.is-actions{min-height:160px;}
.readim-admin-skeleton-card.is-safe{min-height:205px;}
.readim-admin-skeleton-card.is-push{min-height:158px;}
.readim-admin-skeleton-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.readim-admin-skeleton-day{padding:20px 36px 20px 18px;min-height:620px;}
.readim-admin-skeleton-day>.readim-admin-skeleton-line{margin-bottom:10px;}
.readim-admin-skeleton-stat{padding:15px 0;border-top:1px solid #E7EBEE;display:flex;flex-direction:column;gap:8px;}
.readim-admin-skeleton-stat .is-number{width:34%;}
.readim-admin-skeleton-list{display:grid;gap:11px;}
.readim-admin-skeleton-row{min-height:76px;display:flex;align-items:center;gap:12px;padding:10px 36px 10px 10px;}
.readim-admin-skeleton-circle{width:52px;height:52px;flex:0 0 52px;border-radius:50%;background:#E8ECEF;}
.readim-admin-skeleton-row-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:9px;}
.readim-admin-skeleton-dots{right:11px;bottom:10px;}
.readim-admin-status-loader{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:28px;
  background:#fff;
  color:#62809B;
  font-size:16px;
  font-weight:800;
  text-align:center;
}
.readim-admin-status-loader .direct-loading-dots{position:static;height:8px;}
@media(max-width:600px){
  .readim-admin-skeleton-shell{padding:22px 18px 44px;}
  .readim-admin-skeleton-head{grid-template-columns:40px minmax(0,1fr) 44px;gap:10px;margin-bottom:24px;}
  .readim-admin-skeleton-grid{grid-template-columns:1fr;}
  .readim-admin-skeleton-day{min-height:590px;}
}
.readim-admin-error{
  position:absolute;
  inset:0;
  z-index:5;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:28px;
  background:#fff;
  color:#30343a;
  text-align:center;
}
.readim-admin-error strong{font-size:18px;}
.readim-admin-error button{
  width:min(100%,420px);
  min-height:52px;
  border:0;
  border-radius:16px;
  padding:12px 18px;
  font:inherit;
  font-weight:800;
  background:#f2f3f4;
  color:#262a2e;
}
.readim-admin-error button:first-of-type{background:#62809B;color:#fff;}
.readim-admin-assets{display:none;}

/* =========================================================
   V7.6.163 - ADMIN : entête harmonisé + squelette au même niveau
   ========================================================= */
.readim-admin-skeleton-head{
  position:relative;
}
.readim-admin-skeleton-back{
  position:absolute;
  top:-19px;
  left:-10px;
  width:40px;
  height:44px;
  margin:0;
  border-radius:0;
  background:transparent;
}
.readim-admin-skeleton-back::before{
  content:'‹';
  display:block;
  width:40px;
  height:44px;
  color:#DDE3E7;
  font-size:38px;
  line-height:38px;
  font-family:Arial,Helvetica,sans-serif;
}
.readim-admin-skeleton-head-copy{
  grid-column:2;
  grid-row:1;
  padding-top:50px;
}
.readim-admin-skeleton-avatar{
  grid-column:3;
  grid-row:1;
}
@media(max-width:600px){
  .readim-admin-skeleton-head-copy{padding-top:50px;}
}
/* V7.6.163 - la fausse flèche du squelette occupe exactement le même repère. */
.readim-admin-skeleton-back{
  position:fixed !important;
  top:12px !important;
  left:max(8px, calc(50% - 335px + 8px)) !important;
  z-index:21003;
}
@media(max-width:800px){.readim-admin-skeleton-back{left:8px !important;}}


/* =========================================================
   V7.6.164 - flèche skeleton Admin alignée visuellement avec le volet +
   ========================================================= */
.readim-admin-skeleton-back::before{
  text-align:center !important;
}

/* =========================================================
   V7.6.166 - ADMIN : accueil hiérarchique + cache de vues isolé
   ========================================================= */
.readim-admin-page-slot{
  display:none;
  width:100%;
  min-height:100%;
  background:#fff;
}
.readim-admin-page-slot.is-active{display:block;}

/* Le menu Administration n'appartient à aucune page mise en cache.
   V7.6.166 : c'est la page d'accueil de l'espace Admin. Sa flèche revient au
   menu + ; toutes les sous-pages reviennent ici. */
.readim-admin-global-menu{
  position:fixed;
  inset:0;
  z-index:23000;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding:28px 18px 40px;
  background:#fff;
  color:#202428;
  font-family:Arial,Helvetica,sans-serif;
}
.readim-admin-global-menu-back{
  z-index:23001 !important;
}
.readim-admin-global-menu-inner{
  width:100%;
  max-width:560px;
  margin:68px auto 0;
  padding:12px 0 30px;
}
.readim-admin-global-menu-title{
  margin:0 0 8px;
  color:#202428;
  font-size:31px;
  line-height:1.15;
  font-weight:800;
}
.readim-admin-global-menu-sub{
  margin:0 0 28px;
  color:#747c83;
  font-size:15px;
  line-height:1.5;
}
.readim-admin-global-menu-list{display:grid;gap:11px;}
.readim-admin-global-menu-item{
  display:block;
  width:100%;
  border:1px solid #e7ebee;
  border-radius:17px;
  padding:17px 18px;
  background:#fff;
  color:#202428;
  font-family:Arial,Helvetica,sans-serif;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.readim-admin-global-menu-item strong{
  display:block;
  margin:0 0 4px;
  font-size:17px;
  line-height:1.25;
  font-weight:800;
}
.readim-admin-global-menu-item span{
  display:block;
  color:#747c83;
  font-size:13px;
  line-height:1.4;
}
.readim-admin-global-menu-item:active{background:#f3f7fa;transform:scale(.992);}
@media(max-width:600px){
  .readim-admin-global-menu-inner{margin-top:58px;}
  .readim-admin-global-menu-title{font-size:28px;}
  .readim-admin-global-menu-item{padding:16px;}
}
/* V7.6.309 : aucune sélection bleue persistante après un touch/clic.
 * Le repère bleu est réservé au vrai focus clavier. */
.readim-admin-global-menu-item:focus{outline:none;}
.readim-admin-global-menu-item:focus-visible{
  outline:2px solid #62809B;
  outline-offset:2px;
}


/* =========================================================
   V7.6.167 - bouton + mobile : aucun flash/carré bleu au toucher
   ========================================================= */
#bCDf54b,
.bCDf53v{
  -webkit-tap-highlight-color:transparent !important;
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
  touch-action:manipulation;
  outline:none !important;
}
#bCDf54b:focus,
#bCDf54b:focus-visible,
#bCDf54b:active,
.bCDf53v:focus,
.bCDf53v:focus-visible,
.bCDf53v:active{
  outline:none !important;
  box-shadow:none !important;
}

/* =========================================================
   V7.6.168 - skeletons Admin sans titres + ordre opérationnel
   ========================================================= */
.readim-admin-skeleton-head.is-compact{margin-bottom:14px;}
.readim-admin-skeleton-head.is-compact .readim-admin-skeleton-head-copy{padding-top:0!important;}
.readim-admin-skeleton-card.is-auto{min-height:178px;}

/* =========================================================
   V7.6.169 - MESSAGES INTERACTIFS DE GROUPE
   ========================================================= */
.direct-interactive-admin-section{
  box-sizing:border-box;
  margin-top:24px;
  padding:15px;
  border:1px solid #E2E7EA;
  border-radius:15px;
  background:#fff;
}
.direct-interactive-admin-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.direct-interactive-admin-head>div{min-width:0;}
.direct-interactive-admin-head strong{
  display:block;
  color:#292D31;
  font-size:16px;
  line-height:21px;
}
.direct-interactive-admin-head span{
  display:block;
  margin-top:4px;
  color:#7B8389;
  font-size:11px;
  line-height:16px;
}
.direct-interactive-create{
  flex:0 0 auto;
  min-height:38px;
  padding:0 13px;
  border:0;
  border-radius:10px;
  background:#62809B;
  color:#fff;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.direct-interactive-admin-list{display:grid;gap:10px;margin-top:13px;}
.direct-interactive-admin-card{
  box-sizing:border-box;
  border:1px solid #E5E9EC;
  border-radius:13px;
  padding:12px;
  background:#FAFBFC;
}
.direct-interactive-admin-card.is-inactive{opacity:.68;}
.direct-interactive-admin-card-head{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.direct-interactive-position{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  flex:0 0 30px;
  border-radius:50%;
  background:#EEF2F5;
  color:#62809B;
  font-size:12px;
  font-weight:800;
}
.direct-interactive-admin-card-copy{min-width:0;flex:1;}
.direct-interactive-admin-card-copy strong{
  display:block;
  color:#292D31;
  font-size:14px;
  line-height:19px;
  overflow-wrap:anywhere;
}
.direct-interactive-admin-card-copy span{
  display:block;
  margin-top:2px;
  color:#7A8288;
  font-size:11px;
  line-height:15px;
}
.direct-interactive-status{
  flex:0 0 auto;
  padding:5px 7px;
  border-radius:999px;
  background:#EDF4F8;
  color:#62809B;
  font-size:10px;
  font-weight:700;
}
.direct-interactive-status.off{background:#EEE;color:#777;}
.direct-interactive-admin-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  margin-top:11px;
}
.direct-interactive-admin-actions button{
  min-height:38px;
  border:0;
  border-radius:9px;
  padding:8px 9px;
  background:#EEF2F5;
  color:#43505A;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.direct-interactive-admin-actions button.primary{background:#62809B;color:#fff;}
.direct-interactive-order-actions{display:flex;gap:7px;margin-top:9px;}
.direct-interactive-order-actions button{
  width:38px;
  height:34px;
  border:0;
  border-radius:9px;
  background:#F0F2F4;
  color:#62809B;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.direct-interactive-overlay{
  position:fixed;
  inset:0;
  z-index:7795;
  background:#fff;
  color:#202428;
}
.direct-interactive-close{z-index:7797!important;}
.direct-interactive-overlay-scroll{
  position:absolute;
  inset:0;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.direct-interactive-overlay-inner{
  box-sizing:border-box;
  width:100%;
  max-width:520px;
  margin:0 auto;
  padding:68px 18px 42px;
}
.direct-interactive-overlay-inner h2{
  margin:0 0 22px;
  color:#202428;
  font-size:24px;
  line-height:30px;
}
.direct-interactive-overlay-inner>label,
.direct-interactive-field-title{
  display:block;
  margin:14px 0 7px;
  color:#303438;
  font-size:14px;
  line-height:19px;
  font-weight:700;
}
.direct-interactive-overlay-inner input[type=text],
.direct-interactive-overlay-inner textarea,
.direct-interactive-select{
  box-sizing:border-box;
  width:100%;
  border:1px solid #D5DBDF;
  border-radius:11px;
  padding:11px 12px;
  background:#fff;
  color:#202428;
  font-family:inherit;
  font-size:15px;
}
.direct-interactive-overlay-inner textarea{min-height:96px;resize:vertical;}
.direct-interactive-select{min-height:46px;}
.direct-interactive-optional{color:#8A9095;font-weight:400;}
.direct-interactive-type-fields{margin-top:12px;}
.direct-interactive-options-editor{display:grid;gap:8px;}
.direct-interactive-option-edit-row{display:flex;align-items:center;gap:8px;}
.direct-interactive-option-edit-row input{flex:1;min-width:0;}
.direct-interactive-option-remove{
  width:40px;
  height:42px;
  flex:0 0 40px;
  border:0;
  border-radius:10px;
  background:#F1F2F3;
  color:#666;
  font-size:24px;
  line-height:1;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.direct-interactive-add-option{margin-top:9px!important;}
.direct-interactive-active{margin-top:18px!important;}
.direct-interactive-results-meta{
  margin-bottom:14px;
  padding:12px 14px;
  border-radius:12px;
  background:#F3F6F8;
  color:#59656E;
  font-size:13px;
  line-height:19px;
}
.direct-interactive-results-options{display:grid;gap:8px;}
.direct-interactive-results-option{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:48px;
  padding:10px 12px;
  border:1px solid #E4E8EB;
  border-radius:11px;
  background:#fff;
}
.direct-interactive-results-option span:first-child{flex:1;min-width:0;font-size:13px;line-height:18px;}
.direct-interactive-results-option strong{flex:0 0 auto;color:#62809B;font-size:13px;white-space:nowrap;}
.direct-interactive-results-subtitle{margin:22px 0 9px;font-size:15px;font-weight:800;}
.direct-interactive-results-people{display:grid;gap:7px;}
.direct-interactive-result-person{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  background:#F7F8F9;
  font-size:13px;
}
.direct-interactive-result-person strong{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.direct-interactive-result-person span{flex:0 0 auto;color:#62809B;text-align:right;max-width:48%;}

/* Carte membre : vraie présence dans le flux, mais aucun élément de profil,
   réponse, citation, réaction ou contact n'est attaché à cette bulle. */
.chat-container.interactive-admin-container{
  margin-top:20px;
  margin-bottom:12px;
}
.interactive-admin-container .interactive-admin-avatar{
  cursor:default!important;
  pointer-events:none;
}
.interactive-admin-avatar-placeholder{
  width:100%;
  height:100%;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#EAF0F4;
  color:#62809B;
  font-weight:800;
}
.interactive-admin-container .interactive-admin-name{
  cursor:default!important;
  pointer-events:none;
}
.interactive-admin-card-bubble{
  box-sizing:border-box;
  width:min(100%,430px);
  margin-top:2px;
  padding:14px;
  border:1px solid #DDE4E8;
  border-radius:16px;
  background:#F8FAFB;
  color:#202428;
}
.interactive-admin-card-title{
  margin:0;
  font-size:15px;
  line-height:20px;
  font-weight:800;
  overflow-wrap:anywhere;
}
.interactive-admin-card-text{
  margin-top:7px;
  color:#59636A;
  font-size:13px;
  line-height:19px;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.interactive-poll-choices{display:grid;gap:8px;margin-top:12px;}
.interactive-poll-choice{
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:9px 11px;
  border:1px solid #D7DEE2;
  border-radius:11px;
  background:#fff;
  color:#2E3438;
  text-align:left;
  font-family:inherit;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.interactive-poll-choice.is-selected{
  border-color:#62809B;
  box-shadow:inset 0 0 0 1px #62809B;
}
.interactive-poll-choice-dot{
  width:17px;
  height:17px;
  flex:0 0 17px;
  border:2px solid #AAB4BA;
  border-radius:50%;
  background:#fff;
}
.interactive-poll-choice.is-selected .interactive-poll-choice-dot{
  border:5px solid #62809B;
}
.interactive-poll-choice-text{
  flex:1;
  min-width:0;
  font-size:13px;
  line-height:18px;
  overflow-wrap:anywhere;
}
.interactive-poll-choice-percent{
  min-width:46px;
  flex:0 0 46px;
  align-self:center;
  color:#62809B;
  font-size:12px;
  line-height:16px;
  font-weight:800;
  text-align:right;
  white-space:nowrap;
}
.interactive-admin-action-button{
  display:flex;
  width:100%;
  min-height:44px;
  margin-top:12px;
  border:0;
  border-radius:10px;
  align-items:center;
  justify-content:center;
  background:#62809B;
  color:#fff;
  font-size:13px;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.interactive-admin-video{
  display:block;
  width:100%;
  max-height:360px;
  margin-top:11px;
  border-radius:12px;
  background:#000;
}
.interactive-poll-saving{opacity:.62;pointer-events:none;}

@media(max-width:480px){
  .direct-interactive-admin-head{align-items:center;}
  .direct-interactive-admin-actions{grid-template-columns:1fr 1fr;}
  .direct-interactive-overlay-inner{padding-left:16px;padding-right:16px;}
  .interactive-admin-card-bubble{width:100%;}
}

/* =========================================================
   V7.6.170 - RECHERCHE PAR PSEUDO = INTERACTIONS RÉCENTES
   ========================================================= */
.person-search-state{
  position:relative;
  box-sizing:border-box;
  width:calc(100% - 18px);
  max-width:620px;
  min-height:92px;
  margin:10px auto 18px;
  padding:18px 18px 22px;
  border-radius:14px;
  background:#F4F5F6;
  color:#5D6266;
  text-align:center;
}
.person-search-loading{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:92px;
  padding-bottom:30px;
}
.person-search-loading-label{
  font-size:14px;
  line-height:20px;
  font-weight:600;
  color:#7A8085;
}
.person-search-state .direct-loading-dots{
  right:50%;
  bottom:14px;
  transform:translateX(50%);
}
.person-search-empty-title{
  color:#4E5357;
  font-size:15px;
  line-height:21px;
  font-weight:700;
}
.person-search-empty-text{
  margin-top:7px;
  color:#858B90;
  font-size:13px;
  line-height:19px;
}


/* =========================================================
   V7.6.253 - retours supérieurs réellement fixes partout
   Le menu Administration global et les overlays historiques utilisent le
   même rond blanc fixe ; le chevron reçoit un centrage optique Android.
   ========================================================= */
.simple-white-back,
.member-screen-back{
  position:fixed !important;
  top:12px !important;
  left:max(8px, calc(50% - 335px + 8px)) !important;
  width:44px !important;
  height:44px !important;
  border:0 !important;
  border-radius:50% !important;
  padding:0 !important;
  background:#fff !important;
  color:#62809B !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:0 !important;
  line-height:1 !important;
  text-decoration:none !important;
  box-shadow:0 1px 6px rgba(32,36,40,.10) !important;
  z-index:7602 !important;
}
.readim-admin-global-menu-back{z-index:23001 !important;}
.simple-white-back,
.member-screen-back{display:grid !important;place-items:center !important;}
.simple-white-back::before,
.member-screen-back::before{
  content:'';
  display:block;
  width:29px;
  height:29px;
  background:center/29px 29px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 18l-6-6 6-6' fill='none' stroke='%2362809B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  transform:translateY(4px);
}
@media(max-width:800px){
  .simple-white-back,.member-screen-back{left:8px !important;}
}

/* =========================================================
   V7.6.259 - croix de fermeture des overlays
   Même bouton rond que les retours : 44 px blanc, ombre légère, X SVG 29 px.
   Le X est symétrique, donc aucun décalage vertical artificiel.
   ========================================================= */
.readim-screen-close,
.photo-send-preview-close,
.photo-viewer-close,
.private-dark-close{
  top:12px !important;
  right:max(8px, calc(50% - 335px + 8px)) !important;
  width:44px !important;
  height:44px !important;
  border:0 !important;
  border-radius:50% !important;
  padding:0 !important;
  background:#fff !important;
  color:#62809B !important;
  display:grid !important;
  place-items:center !important;
  font-size:0 !important;
  line-height:1 !important;
  box-shadow:0 1px 6px rgba(32,36,40,.10) !important;
  cursor:pointer !important;
  -webkit-tap-highlight-color:transparent !important;
}
.readim-screen-close::before,
.photo-send-preview-close::before,
.photo-viewer-close::before,
.private-dark-close::before{
  content:'';
  display:block;
  width:29px;
  height:29px;
  background:center/29px 29px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M17 7L7 17' fill='none' stroke='%2362809B' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
}
@media(max-width:800px){
  .readim-screen-close,
  .photo-send-preview-close,
  .photo-viewer-close,
  .private-dark-close{right:8px !important;}
}

/* =========================================================
   V7.6.265 - navigation utilisateur harmonisée sur Administration
   Tous les chevrons utilisateur partagent le bouton Admin validé : rond blanc
   fixe 44 px, SVG 29 px, même bord gauche et même centrage optique.
   Toutes les croix principales restent fixes : un overlay scrollable ne peut
   plus emporter sa fermeture hors de l'écran.
   ========================================================= */
.simple-white-back,
.member-screen-back{
  position:fixed !important;
  top:12px !important;
  left:max(8px, calc(50% - 335px + 8px)) !important;
  width:44px !important;
  height:44px !important;
  border:0 !important;
  border-radius:50% !important;
  padding:0 !important;
  background:#fff !important;
  color:#62809B !important;
  display:grid !important;
  place-items:center !important;
  font-size:0 !important;
  line-height:1 !important;
  box-shadow:0 1px 6px rgba(32,36,40,.10) !important;
  -webkit-tap-highlight-color:transparent !important;
}
.simple-white-back::before,
.member-screen-back::before{
  content:'' !important;
  display:block !important;
  width:29px !important;
  height:29px !important;
  background:center/29px 29px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 18l-6-6 6-6' fill='none' stroke='%2362809B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  transform:translateY(4px) !important;
}
.readim-screen-close,
.photo-send-preview-close,
.photo-viewer-close,
.private-dark-close{
  position:fixed !important;
}
/* La vraie conversation privée doit toujours retrouver le même repère droit,
   y compris après l'ouverture du + et de ses overlays. */
#directChatClose,
#directMediaClose,
#directOptionsClose{
  position:fixed !important;
  top:12px !important;
  right:max(8px, calc(50% - 335px + 8px)) !important;
}
@media(max-width:800px){
  .simple-white-back,
  .member-screen-back{left:8px !important;}
  #directChatClose,
  #directMediaClose,
  #directOptionsClose{right:8px !important;}
}

/* V7.6.265 - alignement final des croix utilisateur sur Administration. */
.readim-screen-close::before,
.photo-send-preview-close::before,
.photo-viewer-close::before,
.private-dark-close::before{
  transform:translateY(3px) !important;
}
@media(max-width:800px){
  .readim-screen-close,
  .photo-send-preview-close,
  .photo-viewer-close,
  .private-dark-close,
  #directChatClose,
  #directMediaClose,
  #directOptionsClose{right:10px !important;}
}


/* =========================================================
   V7.6.266 - vraie messagerie privée : navigation sans bande opaque
   La conversation principale n'a qu'un chevron. Les croix appartiennent aux
   overlays du +. L'en-tête avatar/pseudo reste fixe visuellement mais devient
   transparent afin que les bulles puissent défiler derrière sans être coupées.
   ========================================================= */
#directChatClose,#directChatMenu{display:none !important;}
.direct-chat-header{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  z-index:7752 !important;
  background:transparent !important;
  border-bottom:0 !important;
  pointer-events:none !important;
}
.direct-chat-messages{
  height:calc(100% - 64px) !important;
  padding-top:76px !important;
}
.direct-actions-card{
  width:calc(100% - 36px);
  max-width:430px;
  gap:11px;
}
.direct-actions-person{
  margin-bottom:10px;
}
#directActionContact[disabled]{
  opacity:.72;
}
.direct-actions-card .member-action-button,
.direct-actions-card .plus-menu-button{width:100%;}
#directActionsView .direct-actions-context-title{
  box-sizing:border-box !important;
  width:100% !important;
  margin:4px 0 8px !important;
  padding:0 4px !important;
  color:#62809B !important;
  font-size:13px !important;
  line-height:18px !important;
  font-weight:700 !important;
  letter-spacing:.02em !important;
  text-transform:uppercase !important;
  text-align:left !important;
}
#directActionsView #directExtraActions.member-extra-actions{
  width:100% !important;
  display:flex;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:11px !important;
}
#directActionsView #directExtraActions.member-extra-actions > .member-action-button{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  flex:0 0 auto !important;
}
#directActionsView .direct-actions-separator{
  display:block !important;
  width:100% !important;
  height:0 !important;
  margin:16px 0 4px !important;
  padding:0 !important;
  border:0 !important;
  border-top:1px solid #D7DDE2 !important;
  background:transparent !important;
  opacity:1 !important;
}
@media(max-width:600px){
  #directActionsView #directMoreActionsToggle.member-more-actions-toggle{
    display:none;
    align-self:flex-end !important;
    width:auto !important;
    min-width:0 !important;
    min-height:20px !important;
    margin:0 4px 0 auto !important;
    padding:1px 0 !important;
    border:0 !important;
    border-radius:0 !important;
    outline:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    color:#8A8A8A !important;
    font-size:12px !important;
    line-height:18px !important;
    font-weight:400 !important;
    text-align:right !important;
    text-decoration:none !important;
  }
}
@media(min-width:601px){
  #directActionsView #directMoreActionsToggle{display:none !important;}
  #directActionsView #directExtraActions{display:flex !important;}
}
/* Les contrôles fixes restent des boutons isolés : aucun bandeau blanc fixe. */
#directChatView:before{content:none !important;display:none !important;background:transparent !important;}

/* =========================================================
   V7.6.269 - PRÉFÉRENCES DE PREMIER CONTACT PRIVÉ
   ========================================================= */
#directMessageSettingsView,
#directGateView{
  box-sizing:border-box;
  align-items:flex-start;
  justify-content:center;
  padding-top:max(76px, calc(env(safe-area-inset-top) + 62px));
}

.direct-message-settings-card{
  width:min(520px,calc(100vw - 42px));
  max-width:520px;
  align-items:stretch;
  padding-bottom:28px;
}
.direct-message-settings-card .simple-white-title{text-align:left;}
.direct-settings-intro{
  margin:9px 0 4px;
  color:#777;
  font-size:13px;
  line-height:19px;
  text-align:left;
}
.direct-settings-section{
  width:100%;
  box-sizing:border-box;
  margin-top:20px;
  padding-top:17px;
  border-top:1px solid #E5E8EA;
}
.direct-settings-section-title{
  color:#2D3338;
  font-size:15px;
  line-height:21px;
  font-weight:700;
  margin-bottom:11px;
  text-align:left;
}
.direct-settings-hint{
  color:#8A9095;
  font-size:12px;
  line-height:18px;
  margin:0 0 10px;
  text-align:left;
}
.direct-settings-own-country,
.direct-settings-chip-grid{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.direct-settings-chip{
  min-height:37px;
  padding:7px 12px;
  border:1px solid #D7DDE2;
  border-radius:19px;
  background:#fff;
  color:#4D555B;
  font-size:13px;
  line-height:19px;
  cursor:pointer;
}
.direct-settings-own-country{margin-bottom:10px;}
.direct-settings-chip.is-own{font-weight:400;}
.direct-settings-chip.is-selected{
  border-color:#62809B;
  background:#62809B;
  color:#fff;
}
.direct-settings-link{
  width:100%;
  min-height:42px;
  margin-top:12px;
  border:0;
  border-radius:10px;
  background:#F1F3F5;
  color:#44525E;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  text-align:left;
  padding-right:14px;
  padding-left:14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.direct-settings-link-label{
  display:block;
  text-align:left;
}
.direct-settings-link-chevron{
  display:block;
  flex:0 0 24px;
  width:24px;
  height:24px;
  object-fit:contain;
}
.direct-settings-countries-panel{margin-top:10px;}
.direct-settings-country-search{
  width:100%;
  height:44px;
  box-sizing:border-box;
  border:1px solid #D7DDE2;
  border-radius:10px;
  padding:0 12px;
  outline:none;
  font-size:14px;
  background:#fff;
}
.direct-settings-country-search:focus{border-color:#62809B;}
.direct-settings-country-list{
  width:100%;
  max-height:250px;
  margin-top:7px;
  overflow:auto;
  border:1px solid #E1E5E8;
  border-radius:10px;
  background:#fff;
}
.direct-settings-country-row{
  width:100%;
  min-height:42px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 11px;
  border:0;
  border-bottom:1px solid #EEF0F2;
  background:#fff;
  color:#444;
  text-align:left;
  font-size:13px;
  cursor:pointer;
}
.direct-settings-country-row:last-child{border-bottom:0;}
.direct-settings-country-row.is-selected{color:#354B5C;font-weight:700;background:#F4F7F9;}
.direct-settings-country-check{width:20px;color:#62809B;text-align:center;font-weight:700;}
.direct-settings-toggle{
  display:flex;
  align-items:center;
  gap:8px;
  color:#535B61;
  font-size:13px;
  line-height:20px;
}
.direct-settings-toggle input{accent-color:#62809B;}
.direct-settings-value{
  min-height:22px;
  margin:11px 0 4px;
  color:#354B5C;
  font-size:14px;
  text-align:left;
}
.direct-settings-age-description{
  color:#8A9095;
  font-size:13px;
  line-height:19px;
  font-weight:400;
}
.direct-settings-range{
  width:100%;
  accent-color:#62809B;
}
.direct-settings-range-ends{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:1px;
  color:#92979B;
  font-size:11px;
  line-height:16px;
}
.direct-settings-age-range{
  position:relative;
  height:34px;
  margin-top:2px;
}
.direct-settings-age-range::before,
.direct-settings-age-selection{
  position:absolute;
  top:14px;
  height:4px;
  transform:translateY(-50%);
  border-radius:999px;
  pointer-events:none;
}
.direct-settings-age-range::before{
  content:"";
  z-index:0;
  left:0;
  right:0;
  background:#D9DDE0;
}
.direct-settings-age-selection{
  z-index:1;
  left:0%;
  right:0%;
  background:#62809B;
}
/* V7.6.319 : le rail et les deux ronds visibles sont de vrais éléments DOM.
 * On ne dépend plus de variables CSS posées via jQuery 2.0 : Chrome/PWA Android
 * met donc à jour immédiatement la position des ronds pendant le glissement. */
.direct-settings-age-thumb{
  position:absolute;
  z-index:3;
  top:14px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#62809B;
  transform:translate(-50%,-50%);
  pointer-events:none;
}
.direct-settings-age-thumb-min{left:0%;}
.direct-settings-age-thumb-max{left:100%;}
.direct-settings-age-range .direct-settings-range{
  -webkit-appearance:none!important;
  appearance:none!important;
  position:absolute;
  z-index:4;
  left:0;
  top:0;
  width:100%;
  height:28px;
  margin:0;
  padding:0;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  opacity:0;
  pointer-events:none;
}
.direct-settings-age-range input[type=range]::-webkit-slider-runnable-track{
  height:4px;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.direct-settings-age-range input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:28px;
  height:28px;
  margin-top:-12px;
  border:0!important;
  border-radius:50%;
  background:transparent!important;
  box-shadow:none!important;
  pointer-events:auto;
}
.direct-settings-age-range input[type=range]::-moz-range-track,
.direct-settings-age-range input[type=range]::-moz-range-progress{
  height:4px;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.direct-settings-age-range input[type=range]::-moz-range-thumb{
  width:28px;
  height:28px;
  border:0!important;
  border-radius:50%;
  background:transparent!important;
  box-shadow:none!important;
  pointer-events:auto;
}
.direct-message-settings-card .session-enter-btn{width:100%;margin-top:20px;}

.direct-gate-card{
  width:min(430px,calc(100vw - 42px));
  max-width:430px;
  align-items:stretch;
  padding-bottom:28px;
}
.direct-gate-title{
  color:#252A2E;
  font-size:19px;
  line-height:25px;
  font-weight:700;
  text-align:center;
}
.direct-gate-text{
  margin-top:10px;
  color:#6F757A;
  font-size:14px;
  line-height:21px;
  text-align:center;
}
.direct-gate-card > .session-enter-btn{width:100%;margin-top:18px;}
.direct-gate-birthday{
  width:100%;
  margin-top:18px;
}
.direct-gate-birthday label{
  display:block;
  margin-bottom:7px;
  color:#4D555B;
  font-size:13px;
  font-weight:700;
}
.direct-gate-birthday input{
  width:100%;
  height:46px;
  box-sizing:border-box;
  border:1px solid #D7DDE2;
  border-radius:10px;
  padding:0 11px;
  background:#fff;
  color:#333;
  font-size:15px;
}
.direct-gate-birthday-note{
  margin-top:7px;
  color:#8A9095;
  font-size:11px;
  line-height:17px;
}
.direct-gate-birthday .session-enter-btn{width:100%;margin-top:13px;}
.direct-gate-contact-help{
  width:100%;
  margin-top:20px;
  padding-top:17px;
  border-top:1px solid #E2E6E9;
}
.direct-gate-contact-title{
  color:#333A40;
  font-size:15px;
  line-height:21px;
  font-weight:700;
  text-align:center;
}
.direct-gate-contact-help .session-enter-btn{width:100%;margin-top:15px;}
.direct-gate-contact-unavailable{
  margin-top:14px;
  padding:11px 12px;
  border-radius:10px;
  background:#F3F5F6;
  color:#6F767C;
  font-size:12px;
  line-height:18px;
  text-align:center;
}
#directGateError,#directMessageSettingsError{margin-top:13px;}


/* =========================================================
   V7.6.270 - RECHERCHE : ACTION PRIVÉE DISCRÈTE + FICHE SIMPLE
   ========================================================= */
.pseudo-search-result{
  cursor:default;
}
.pseudo-search-result-main{
  flex:1 1 auto;
  min-width:0;
  min-height:52px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
}
.pseudo-search-result:hover,
.pseudo-search-result:active{background:#F7F8F9;}
.pseudo-search-result-action{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:#F0F1F2;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.pseudo-search-result-action:active{background:#E5E7E9;}
.pseudo-search-result-action img{
  display:block;
  width:18px;
  height:18px;
  opacity:.66;
}
.pseudo-search-result-action.is-verify img{opacity:.58;}
.person-search-private-button{
  width:min(330px,calc(100vw - 48px));
  margin-top:22px;
}
#personView.search-profile-mode .person-identity{
  height:auto;
  min-height:330px;
}
#personView.search-profile-mode #personExchangesTitle,
#personView.search-profile-mode #personMessages{
  display:none !important;
}

/* =========================================================
   V7.6.271 - fiche de compatibilité avant messagerie privée
   ========================================================= */
.profile-message-settings-open{
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  margin-top:14px;
  padding:0 14px;
  border:0;
  border-radius:10px;
  background:#F0F1F2;
  color:#25292D;
  font-family:Arial,sans-serif;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.profile-message-settings-open:active{background:#E5E7E9;}

.person-search-pair-avatars{
  margin-bottom:14px;
}
#personView.search-profile-mode #personProfileAvatar{
  display:none !important;
}
#personView.search-profile-mode .person-identity{
  box-sizing:border-box;
  height:auto;
  min-height:100%;
  padding-bottom:34px;
}
.person-search-compatibility{
  box-sizing:border-box;
  width:min(430px,calc(100vw - 38px));
  margin:19px auto 0;
  text-align:left;
}
.person-search-compatibility-title{
  color:#202428;
  font-size:17px;
  line-height:23px;
  font-weight:700;
  text-align:center;
}
.person-search-compatibility-text{
  margin-top:7px;
  color:#777D82;
  font-size:14px;
  line-height:21px;
  text-align:center;
}
.person-search-check-card,
.person-search-criteria-row,
.person-search-blocked-help{
  box-sizing:border-box;
  width:100%;
  margin-top:14px;
  padding:14px;
  border:1px solid #E5E8EA;
  border-radius:12px;
  background:#FAFBFB;
}
.person-search-check-title,
.person-search-criteria-label{
  color:#25292D;
  font-size:14px;
  line-height:20px;
  font-weight:700;
}
.person-search-check-status{
  margin-top:4px;
  font-size:13px;
  line-height:18px;
  font-weight:700;
}
.person-search-check-status.is-pending{color:#7A7F84;}
.person-search-check-help{
  margin-top:6px;
  color:#7A7F84;
  font-size:13px;
  line-height:19px;
}
.person-search-birthday-selectors{
  margin-top:12px;
}
#personSearchBirthdaySelectors.readim-birthday-selectors{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:8px !important;
  width:100% !important;
  overflow:visible !important;
  position:relative !important;
}
#personSearchBirthdaySelectors .readim-birthday-selector{
  display:block !important;
  position:relative !important;
  width:auto !important;
  min-width:0 !important;
  overflow:visible !important;
}
#personSearchBirthdaySelectors .readim-birthday-selector-btn{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  min-height:50px !important;
  padding:0 6px !important;
  box-sizing:border-box !important;
  touch-action:manipulation;
}
#personSearchBirthdaySelectors .readim-birthday-options{
  display:none;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:calc(100% + 5px) !important;
  max-height:210px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  z-index:30320 !important;
}
#personSearchBirthdaySelectors .readim-birthday-selector.is-open .readim-birthday-options{display:block;}
.person-search-birthday-note{
  margin-top:8px;
  color:#94999D;
  font-size:12px;
  line-height:17px;
}
.person-search-inline-action{
  width:100%;
  margin-top:11px;
}
.person-search-criteria{
  width:100%;
}
.person-search-criteria-row{
  background:#fff;
}
.person-search-criteria-ok{
  margin-top:5px;
  color:#4F735B;
  font-size:13px;
  line-height:19px;
  font-weight:700;
}
.person-search-criteria-ok span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  margin-right:4px;
  border-radius:50%;
  background:#E9F1EB;
  color:#3F6B4D;
  font-size:12px;
}
.person-search-blocked-help{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#777D82;
  font-size:13px;
  line-height:19px;
}
.person-search-blocked-help strong{color:#25292D;font-size:14px;}
.person-search-private-button{
  width:min(430px,calc(100vw - 38px));
  margin-top:17px;
}
@media(max-width:420px){
  #personSearchBirthdaySelectors.readim-birthday-selectors{gap:5px !important;}
  #personSearchBirthdaySelectors .readim-birthday-selector-btn{font-size:13px !important;padding:0 3px !important;}
}
#personView.search-profile-mode{
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
#personView.search-profile-mode .person-identity{
  position:relative;
  top:auto;
  left:auto;
  transform:none;
  margin:0 auto;
  width:100%;
  max-width:670px;
  min-height:100%;
  padding-top:76px;
}

/* =========================================================
   V7.6.274 - sections paramètres + Mes tags + genre recherché
   ========================================================= */
.profile-settings-section-subtitle{
  margin-top:5px;
  color:#8A9095;
  font-size:12px;
  line-height:18px;
  font-weight:400;
}
.profile-private-messaging-section .profile-message-settings-open{
  margin-top:12px;
}
.profile-tags-section{
  box-sizing:border-box;
  width:100%;
  margin-top:24px;
  padding-top:18px;
  border-top:1px solid #ECEFF1;
  text-align:left;
}
.profile-tags-open{margin-top:12px;}
#profileTagsView{
  box-sizing:border-box;
  align-items:flex-start;
  justify-content:center;
  padding-top:max(76px, calc(env(safe-area-inset-top) + 62px));
}
.profile-tags-card{
  width:min(520px,calc(100vw - 42px));
  max-width:520px;
  align-items:stretch;
  padding-bottom:28px;
}
.profile-tags-card .simple-white-title{text-align:left;}
.profile-tags-intro{
  margin:9px 0 2px;
  color:#7E858A;
  font-size:13px;
  line-height:19px;
  text-align:left;
}
.profile-tags-category{
  width:100%;
  box-sizing:border-box;
  margin-top:19px;
  padding-top:16px;
  border-top:1px solid #E7EAEC;
}
.profile-tags-category:first-child{
  margin-top:13px;
  padding-top:0;
  border-top:0;
}
.profile-tags-category-title{
  color:#2D3338;
  font-size:14px;
  line-height:20px;
  font-weight:700;
  text-align:left;
}
.profile-tags-grid{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.profile-tag-pill{
  box-sizing:border-box;
  min-height:35px;
  padding:7px 12px;
  border:1px solid rgba(98,128,155,.18);
  border-radius:50px;
  background:rgba(98,128,155,.08);
  color:#4D6172;
  font-family:Arial,sans-serif;
  font-size:13px;
  line-height:19px;
  font-weight:600;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.profile-tag-pill.is-selected{
  border-color:#62809B;
  background:#62809B;
  color:#fff;
}
.profile-tags-save{
  width:100%;
  margin-top:22px;
}
.profile-tags-save:disabled{
  background:#DADDE0 !important;
  color:#92979B !important;
  opacity:1 !important;
  cursor:default;
}
.person-search-genre-options,
.direct-gate-genre-options{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}

/* =========================================================
   V7.6.273 - Compatibilité recherche + médias privés
   ========================================================= */
.person-search-criteria-row.is-bad{
  border-color:#efd2d2;
  background:#fffafa;
}
.person-search-criteria-bad{
  margin-top:5px;
  font-size:13px;
  line-height:1.35;
  color:#a33a3a;
}
.person-search-criteria-bad>span{
  display:inline-flex;
  width:18px;
  height:18px;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#b64848;
  color:#fff;
  font-weight:700;
  margin-right:5px;
  vertical-align:-2px;
}
.direct-gate-mismatch-list{margin:16px 0 4px;}
.person-search-contact-free-rule{
  margin:10px 0 0;
  color:#666;
  font-size:12px;
  line-height:1.42;
}
.direct-conversation-settings-title{margin-bottom:8px;}
.direct-media-permission-status{
  margin:0 0 14px;
  color:#555;
  font-size:14px;
  line-height:1.45;
}
.direct-video-send-card{max-width:430px;}
.direct-video-send-note{
  margin:12px 0 14px;
  padding:10px 12px;
  border-radius:12px;
  background:#f3f7fa;
  color:#536675;
  font-size:13px;
  line-height:1.4;
}
.direct-video-preparing{
  margin:14px 0 0;
  padding:11px 12px;
  border-radius:12px;
  background:#f5f5f5;
  color:#555;
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}
.direct-video-preview{
  width:100%;
  max-height:54vh;
  margin-top:14px;
  border-radius:14px;
  background:#111;
}
.direct-video-prepared-info{
  margin:10px 0 0;
  color:#536675;
  font-size:13px;
  text-align:center;
}
#directVideoSendButton{margin-top:14px;}
.direct-video-line .direct-message-bubble{padding:7px;}
.direct-video-bubble{max-width:min(280px,72vw);}
.direct-video-open{
  display:block;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  width:100%;
}
.direct-video-thumbnail-shell{
  position:relative;
  display:block;
  width:min(250px,66vw);
  aspect-ratio:16/10;
  border-radius:12px;
  overflow:hidden;
  background:#1c1c1c;
}
.direct-video-thumbnail-shell>img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.direct-video-thumb-placeholder{
  display:flex;
  width:100%;
  height:100%;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:30px;
}
.direct-video-play{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:42px;
  height:42px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.62);
  color:#fff;
  font-size:18px;
  padding-left:2px;
}
.direct-video-duration{
  position:absolute;
  right:7px;
  bottom:7px;
  padding:3px 6px;
  border-radius:7px;
  background:rgba(0,0,0,.7);
  color:#fff;
  font-size:11px;
  font-weight:600;
}
.direct-video-ephemeral-label{
  display:block;
  padding:7px 3px 1px;
  font-size:12px;
  color:#666;
}
.direct-message-line.mine .direct-video-ephemeral-label{color:#66717A;}
/* V7.6.274 : photo et vidéo masquées utilisent exactement la même carte. */
.direct-photo-pending,
.direct-video-pending{
  display:flex!important;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  padding:9px 11px!important;
  border:0;
  text-align:left;
  cursor:pointer;
  font-family:inherit;
}
.direct-photo-pending strong,
.direct-video-pending strong{
  display:block;
  color:inherit;
  font-size:14px;
  line-height:20px;
}
.direct-photo-pending>span,
.direct-video-pending>span{
  display:block;
  color:#6F777D;
  font-size:11px;
  line-height:16px;
}
.direct-video-pending .direct-message-time{
  align-self:stretch;
  width:100%;
}
.direct-video-viewer{
  position:fixed;
  inset:0;
  align-items:center;
  justify-content:center;
  background:#000;
  z-index:30320;
}
.direct-video-viewer-inner{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
}
#directVideoViewer{
  display:block;
  width:100%;
  height:100%;
  max-height:100vh;
  object-fit:contain;
  background:#000;
}
.direct-video-viewer-close{
  position:fixed!important;
  z-index:30330!important;
  background:rgba(255,255,255,.92)!important;
}
.direct-video-viewer-status{
  position:absolute;
  left:20px;
  right:20px;
  bottom:28px;
  color:#fff;
  text-align:center;
  font-size:13px;
}


/* =========================================================
   V7.6.278 - TRACE VIDÉO = MÊME FAMILLE VISUELLE QUE PHOTO
   ========================================================= */
.direct-photo-pending strong,
.direct-video-pending strong{
  color:#66717A;
}

.direct-video-trace .direct-video-trace-bubble{
  width:auto;
  max-width:82%;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:2px;
  padding:9px 11px;
  white-space:normal;
}
.direct-video-trace-icon{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  min-height:18px;
  margin-bottom:3px;
  color:#66717A;
}
.direct-video-trace-icon .direct-photo-material-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
}
.direct-video-trace-text{
  width:100%;
  color:#66717A;
  font-size:14px;
  line-height:20px;
  font-weight:600;
  text-align:left;
  white-space:normal;
}
.direct-video-trace.mine .direct-video-trace-text{
  text-align:right;
}
.direct-video-trace.mine .direct-video-trace-icon{
  justify-content:flex-start;
}
.direct-video-trace .direct-message-time{
  width:100%;
  margin-top:4px;
  text-align:right;
  color:#66717A;
}

/* V7.6.290 : même famille visuelle pour la trace d'une photo éphémère. */
.direct-photo-trace .direct-photo-trace-bubble{
  width:auto;
  max-width:82%;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:2px;
  padding:9px 11px;
  white-space:normal;
}
.direct-photo-trace-icon{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  min-height:18px;
  margin-bottom:3px;
  color:#66717A;
}
.direct-photo-trace-icon .direct-photo-material-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
}
.direct-photo-trace-text{
  width:100%;
  color:#66717A;
  font-size:14px;
  line-height:20px;
  font-weight:600;
  text-align:left;
  white-space:normal;
}
.direct-photo-trace.mine .direct-photo-trace-text{
  text-align:right;
}
.direct-photo-trace.mine .direct-photo-trace-icon{
  justify-content:flex-start;
}
.direct-photo-trace .direct-message-time{
  width:100%;
  margin-top:4px;
  text-align:right;
  color:#66717A;
}

.direct-location-bubble{
  min-width:190px;
  max-width:82%;
}
.direct-location-label{
  display:flex;
  align-items:center;
  gap:5px;
  width:100%;
  color:#66717A;
  font-size:14px;
  line-height:19px;
  font-weight:600;
}
.direct-location-label .private-location-type-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
}
.direct-location-value{
  margin-top:7px;
  font-size:14px;
  line-height:19px;
  color:#202428;
  white-space:normal;
  word-break:break-word;
}
.direct-message-line.mine .direct-location-label,
.direct-message-line.mine .direct-location-value{
  color:#2F3A43;
}

/* V7.6.291 : la localisation appelée depuis la vraie messagerie doit passer
   au-dessus du chat (z-index 7750) et du menu d’actions. Le mode groupe
   historique conserve son z-index normal. */
#privateLocationView.direct-private-location-top{
  z-index:30220 !important;
}


/* =========================================================
   V7.6.348 - VOCAL ÉPHÉMÈRE DANS LA VRAIE MESSAGERIE
   Le recorder historique est réutilisé par la messagerie directe. Son
   z-index historique (2470) le plaçait derrière #directChatView (7750),
   donnant l’impression que le menu se fermait sans rien ouvrir.
   ========================================================= */
#privateAudioRecorderView{
  z-index:30310 !important;
}

/* =========================================================
   V7.6.326 - PROFIL SUPPRIMÉ : ACTION À LA PLACE DU COMPOSEUR
   ========================================================= */
.direct-chat-unavailable{
  display:flex;
  flex-direction:column;
  align-items:center;
}
.direct-unavailable-delete{
  box-sizing:border-box;
  flex:1 1 auto;
  width:100%;
  min-height:44px;
  margin:0;
  padding:10px 16px;
  border:0;
  border-radius:12px;
  background:#E8EAEC;
  color:#4F555A;
  font-family:inherit;
  font-size:15px;
  line-height:22px;
  font-weight:600;
  text-align:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.direct-unavailable-delete:disabled{
  opacity:.6;
  cursor:default;
}


/* =========================================================
   V7.6.314 - en-tête flottant compact de la messagerie privée
   Trois éléments fixes de 44 px : retour / identité / webcam. Le rectangle
   central ne crée aucun bandeau opaque sur toute la largeur.
   ========================================================= */
#directChatView .direct-chat-header{
  height:68px !important;
  padding:0 !important;
  display:block !important;
  background:transparent !important;
  pointer-events:none !important;
}
#directChatView .direct-chat-person-card{
  position:fixed;
  top:12px;
  left:max(60px, calc(50% - 335px + 60px));
  right:max(60px, calc(50% - 335px + 60px));
  height:44px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  gap:8px;
  padding:3px 10px 3px 3px;
  border-radius:16px;
  background:#fff;
  box-shadow:0 1px 6px rgba(32,36,40,.10);
  overflow:hidden;
  z-index:7754;
  pointer-events:none;
}
#directChatView .direct-chat-avatar-wrap{width:38px;height:38px;flex:0 0 38px;}
#directChatView .direct-chat-avatar-wrap img,
#directChatView .direct-chat-header-initial{width:38px;height:38px;border-radius:50%;object-fit:cover;}
#directChatView .direct-chat-identity{
  min-width:0;
  max-width:none;
  flex:1 1 auto;
  overflow:hidden;
  text-align:left;
}
#directChatView .direct-chat-name,
#directChatView .direct-chat-status{
  display:block;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#directChatView .direct-chat-name{font-size:15px;line-height:18px;}
#directChatView .direct-chat-status{margin-top:0;font-size:11px;line-height:15px;}
@media(max-width:800px){
  #directChatView .direct-chat-person-card{left:60px;right:60px;}
}

/* =========================================================
   V7.6.315 - capsule identité centrée et hauteur 50 px
   Les trois contrôles supérieurs de la conversation privée ont la même
   hauteur. La capsule prend seulement la largeur utile de son contenu,
   reste centrée dans l'écran et tronque le pseudo avant de toucher les ronds.
   ========================================================= */
#directChatView .direct-chat-header{
  height:74px !important;
}
#directChatView #directChatBack.member-screen-back{
  width:50px !important;
  height:50px !important;
}
#directChatView .direct-chat-person-card{
  top:12px;
  left:50% !important;
  right:auto !important;
  width:max-content;
  max-width:min(538px, calc(100vw - 132px));
  height:50px;
  padding:3px 12px 3px 3px;
  gap:8px;
  border-radius:25px;
  transform:translateX(-50%);
}
#directChatView .direct-chat-avatar-wrap{
  width:44px;
  height:44px;
  flex:0 0 44px;
}
#directChatView .direct-chat-avatar-wrap img,
#directChatView .direct-chat-header-initial{
  width:44px;
  height:44px;
}
#directChatView .direct-chat-identity{
  min-width:0;
  width:auto;
  flex:0 1 auto;
  overflow:hidden;
}
@media(max-width:800px){
  #directChatView .direct-chat-person-card{
    left:50% !important;
    right:auto !important;
    max-width:calc(100vw - 132px);
  }
}



/* =========================================================
   V7.6.316 - en-tête privé ré-aligné sur les volets + séparateurs de date
   Retour et Webcam reprennent le diamètre standard 44 px des autres volets.
   La capsule identité garde son centrage V315 mais retrouve la même hauteur.
   Les séparateurs de date existent uniquement dans le fil privé.
   ========================================================= */
#directChatView .direct-chat-header{
  height:68px !important;
}
#directChatView #directChatBack.member-screen-back{
  width:44px !important;
  height:44px !important;
}
#directChatView .direct-chat-person-card{
  top:12px;
  left:50% !important;
  right:auto !important;
  width:max-content;
  max-width:min(550px, calc(100vw - 120px));
  height:44px;
  padding:3px 10px 3px 3px;
  gap:8px;
  border-radius:22px;
  transform:translateX(-50%);
}
#directChatView .direct-chat-avatar-wrap{
  width:38px;
  height:38px;
  flex:0 0 38px;
}
#directChatView .direct-chat-avatar-wrap img,
#directChatView .direct-chat-header-initial{
  width:38px;
  height:38px;
}
#directChatView .direct-chat-identity{
  min-width:0;
  width:auto;
  flex:0 1 auto;
  overflow:hidden;
}
@media(max-width:800px){
  #directChatView .direct-chat-person-card{
    left:50% !important;
    right:auto !important;
    max-width:calc(100vw - 120px);
  }
}

.direct-date-separator-row{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  margin:13px 0 12px;
  pointer-events:none;
}
.direct-date-separator{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  min-height:30px;
  max-width:calc(100% - 32px);
  padding:5px 14px;
  border-radius:12px;
  background:#F5F6F7;
  color:#626A70;
  font-size:13px;
  line-height:20px;
  font-weight:700;
  white-space:nowrap;
  text-align:center;
  box-shadow:0 1px 4px rgba(32,36,40,.06);
}


/* =========================================================
   V7.6.317 - catégories / hashtags configurables par groupe
   ========================================================= */
.group-member-tags-builder{box-sizing:border-box;margin-top:22px;padding-top:18px;border-top:1px solid #E7EAEC;}
.group-member-tags-head{display:flex;flex-direction:column;gap:4px;margin-bottom:11px;text-align:left;}
.group-member-tags-head strong{font-size:14px;line-height:19px;color:#303438;}
.group-member-tags-head strong em{font-style:normal;font-weight:400;color:#858B90;}
.group-member-tags-head span{font-size:11px;line-height:16px;color:#7D858B;}
.group-member-tags-categories{display:flex;flex-direction:column;gap:10px;}
.group-member-tags-category{box-sizing:border-box;padding:12px;border:1px solid #E1E5E8;border-radius:13px;background:#FAFBFC;}
.group-member-tags-category-top{display:grid;grid-template-columns:1fr 34px;gap:8px;align-items:center;}
.group-member-tags-category-input,.group-member-tags-new-input{box-sizing:border-box;width:100%;min-height:42px;border:1px solid #D5DBDF;border-radius:10px;background:#fff;padding:9px 11px;color:#202428;font:inherit;font-size:14px;outline:none;}
.group-member-tags-category-input:focus,.group-member-tags-new-input:focus{border-color:#62809B;}
.group-member-tags-remove-category{width:34px;height:34px;border:0;border-radius:50%;background:#EEF1F3;color:#5F686F;font-size:21px;line-height:34px;cursor:pointer;}
.group-member-tags-pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px;}
.group-member-tags-pill{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:0 7px 0 11px;border-radius:999px;background:#EAF0F4;color:#40596B;font-size:12px;font-weight:700;}
.group-member-tags-pill button{width:22px;height:22px;border:0;border-radius:50%;background:transparent;color:#6E7B84;font-size:16px;line-height:20px;padding:0;cursor:pointer;}
.group-member-tags-add-row{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:10px;align-items:center;}
.group-member-tags-add-tag{min-height:42px;border:0;border-radius:10px;background:#EEF2F5;color:#62809B;padding:0 13px;font:inherit;font-size:13px;font-weight:700;cursor:pointer;}
.group-member-tags-add-category{margin-top:10px!important;}
.group-member-tags-empty{padding:10px 0;text-align:left;}

/* =========================================================
   V7.6.320 - ORDRE DES CATÉGORIES + RÉGLAGES NOTIFICATIONS
   ========================================================= */
.group-member-tags-category-top.has-order{
  grid-template-columns:minmax(0,1fr) auto 34px;
}
.group-member-tags-order{
  display:flex;
  align-items:center;
  gap:4px;
}
.group-member-tags-move{
  width:30px;
  height:30px;
  padding:0;
  border:1px solid #DDE3E7;
  border-radius:50%;
  background:#fff;
  color:#62809B;
  font:inherit;
  font-size:16px;
  line-height:28px;
  font-weight:700;
  text-align:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.group-member-tags-move:disabled{
  color:#B8C0C6;
  background:#F4F6F7;
  cursor:default;
  opacity:.65;
}

#readimNotificationSettingsView{
  box-sizing:border-box;
  align-items:flex-start;
  justify-content:center;
  padding-top:max(76px, calc(env(safe-area-inset-top) + 62px));
}
.readim-notification-settings-card{
  width:min(520px,calc(100vw - 42px));
  max-width:520px;
  align-items:stretch;
  padding-bottom:28px;
  text-align:left;
}
.readim-notification-settings-card .simple-white-title{text-align:left;}
.readim-notification-settings-intro{
  margin:9px 0 4px;
  color:#777;
  font-size:13px;
  line-height:19px;
}
.readim-notification-settings-section{
  width:100%;
  box-sizing:border-box;
  margin-top:20px;
  padding-top:18px;
  border-top:1px solid #E7EAEC;
}
.readim-notification-settings-section-title{
  margin:0 0 4px;
  color:#303438;
  font-size:14px;
  line-height:20px;
  font-weight:700;
}
.readim-notification-setting-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:100%;
  box-sizing:border-box;
  padding:11px 0;
}
.readim-notification-setting-copy{
  min-width:0;
  flex:1 1 auto;
}
.readim-notification-setting-copy strong{
  display:block;
  color:#24292D;
  font-size:14px;
  line-height:19px;
  font-weight:700;
}
.readim-notification-setting-copy span{
  display:block;
  margin-top:3px;
  color:#7E858A;
  font-size:12px;
  line-height:17px;
}
.readim-notification-settings-card .session-enter-btn{
  width:100%;
  margin-top:20px;
}


/* =========================================================
   V7.6.321 - GROUPES DIRECTEMENT DANS DISCUSSIONS
   ========================================================= */
#directGroupsSection{order:40 !important;}
#directAdminGroupsSection{order:50 !important;}
.direct-hub-create-group{margin:12px 0 0;}
#directAdminGroupsSection .direct-inline-empty{margin-bottom:4px;}

/* =========================================================
   V7.6.322 - À PROPOS CONTEXTUEL + STATISTIQUES DU GROUPE
   ========================================================= */
.member-about-section{
  box-sizing:border-box;
  width:100%;
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid #E7EBEE;
}
.member-about-title{
  margin:0 0 9px !important;
  text-align:left;
}
.member-about-shell{
  position:relative;
  display:block;
  width:100%;
  min-height:86px;
  box-sizing:border-box;
  border-radius:16px;
  background:#F7F9FA;
  overflow:hidden;
}
.member-about-carousel{
  display:flex;
  width:calc(100% - 78px);
  min-width:0;
  margin:0 39px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
}
.member-about-shell.is-single .member-about-carousel{
  display:block;
  width:100%;
  margin:0;
  overflow:visible;
  scroll-snap-type:none;
}
.member-about-carousel::-webkit-scrollbar{display:none;}
.member-about-card{
  box-sizing:border-box;
  flex:0 0 100%;
  width:100%;
  min-width:100%;
  max-width:100%;
  min-height:86px;
  padding:13px 14px 14px;
  border-radius:16px;
  background:transparent;
  scroll-snap-align:start;
  scroll-snap-stop:always;
}
.member-about-shell.is-single .member-about-card{
  flex:none;
  width:100%;
  min-width:100%;
  max-width:100%;
}
.member-about-category{
  margin-bottom:9px;
  color:#30363B;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-transform:none;
}
.member-about-chips{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:7px;
}
.member-about-chip{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  box-sizing:border-box;
  border:0;
  padding:5px 10px;
  border-radius:14px;
  background:#EAF0F5;
  color:#62809B;
  font-family:inherit;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-align:left;
  overflow-wrap:anywhere;
  -webkit-tap-highlight-color:transparent;
}
button.member-about-chip{cursor:pointer;}
button.member-about-chip:active{opacity:.78;}
.member-about-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  width:32px;
  height:32px;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#62809B;
  font-size:24px;
  line-height:30px;
  font-weight:400;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
#memberAboutPrev{left:4px;}
#memberAboutNext{right:4px;}
.member-about-nav:disabled{opacity:.28;cursor:default;}
.member-about-dots{
  display:flex;
  justify-content:center;
  gap:5px;
  min-height:7px;
  margin:0 0 8px;
}
.member-about-dot{
  display:block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#D9DEE2;
}
.member-about-dot.is-active{background:#62809B;}

.direct-group-admin-invite-hint{
  margin-top:10px;
}
.direct-group-admin-invite-hint > label{
  display:block;
  margin-bottom:7px;
}
.direct-group-admin-invite-hint > label span{
  color:#8A8A8A;
  font-weight:400;
}
.direct-group-admin-stats{
  margin:18px 0 4px;
  padding-top:16px;
  border-top:1px solid #E7EBEE;
}
.direct-group-admin-stats-title{
  margin-bottom:10px;
  color:#30363B;
  font-size:15px;
  line-height:20px;
  font-weight:700;
}
.direct-group-admin-stats-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.direct-group-admin-stat-card{
  box-sizing:border-box;
  min-height:78px;
  padding:12px;
  border-radius:14px;
  background:#F5F5F5;
  text-align:center;
}
.direct-group-admin-stat-card strong{
  display:block;
  margin-bottom:4px;
  color:#30363B;
  font-size:22px;
  line-height:27px;
}
.direct-group-admin-stat-card span{
  display:block;
  color:#747B81;
  font-size:12px;
  line-height:16px;
}
@media(max-width:380px){
  .direct-group-admin-stats-grid{grid-template-columns:1fr;}
}

/* =========================================================
   V7.6.323 - À PROPOS ALIGNÉ + AÉRATION
   ========================================================= */
#memberActionView .member-about-section{
  padding-top:16px !important;
}
#memberActionView .member-about-title{
  box-sizing:border-box !important;
  width:100% !important;
  margin:0 0 4px !important;
  padding:0 4px !important;
  text-align:left !important;
  text-transform:none !important;
}

/* =========================================================
   V7.6.324 - AÉRATION À PROPOS + VOCAL ÉPHÉMÈRE DIRECT
   ========================================================= */
#memberActionView .member-about-section{
  padding-top:26px !important;
}
.direct-audio-player-view{
  background:#000;
}
.direct-audio-player-content .direct-audio-player{
  width:min(100%,340px);
  max-width:340px;
  margin-top:28px;
}
.direct-audio-player-content .private-audio-recorder-status{
  max-width:340px;
}
.direct-audio-pending .direct-photo-pending-title .direct-photo-material-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
}

/* =========================================================
   V7.6.325 - SUGGESTION DU GROUPE POUR TOI
   Carte personnelle injectée dans le fil, distincte d'une bulle publique.
   ========================================================= */
.group-suggestion-container{
  margin-top:18px;
  margin-bottom:16px;
  align-items:flex-start;
}
.group-suggestion-container .message-img,
.group-suggestion-container .message-name{
  cursor:default;
}
.group-suggestion-container .message-wrapper{
  max-width:min(82%,480px);
}
.group-suggestion-title{
  color:#6f767c;
  font-size:12px;
  line-height:17px;
  font-weight:700;
  margin-bottom:6px;
}
.group-suggestion-card{
  box-sizing:border-box;
  width:min(100%,420px);
  padding:18px 16px 13px;
  border:1px solid #e3e7ea;
  border-radius:13px;
  background:#fff;
  box-shadow:0 2px 8px rgba(20,35,48,.06);
}
.group-suggestion-profile{
  display:flex;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  flex-direction:column;
  align-items:center;
  appearance:none;
  -webkit-appearance:none;
  font:inherit;
  color:inherit;
  cursor:pointer;
}
.group-suggestion-avatar{
  display:block;
  width:72px;
  height:72px;
  margin-bottom:9px;
}
.group-suggestion-avatar .profile-avatar,
.group-suggestion-avatar img,
.group-suggestion-avatar .avatar-placeholder,
.group-suggestion-avatar > span,
.group-suggestion-avatar > div{
  width:72px !important;
  height:72px !important;
  min-width:72px !important;
  border-radius:50% !important;
  object-fit:cover;
}
.group-suggestion-profile strong{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#202427;
  font-size:16px;
  line-height:21px;
  font-weight:700;
}
.group-suggestion-meta{
  display:block;
  margin-top:3px;
  color:#858b90;
  font-size:12px;
  line-height:17px;
  text-align:center;
}
.group-suggestion-match{
  margin:14px 0 5px;
  padding-top:12px;
  border-top:1px solid #edf0f2;
  color:#555d63;
  font-size:12px;
  line-height:17px;
  text-align:left;
}
.group-suggestion-criteria{
  display:block;
  box-sizing:border-box;
  width:100%;
  padding:8px 10px 7px;
  border:0;
  border-radius:9px;
  background:#f5f6f7;
  color:#30363b;
  font:inherit;
  font-size:12px;
  line-height:17px;
  text-align:left;
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
}
.group-suggestion-criteria > span{
  display:block;
  margin-top:2px;
  color:#62809B;
  font-size:11px;
  line-height:15px;
  font-weight:700;
}
@media(max-width:420px){
  .group-suggestion-container .message-wrapper{max-width:calc(100% - 52px);}
  .group-suggestion-card{padding:16px 13px 12px;}
}

/* V7.6.335 - séparation lisible entre autorisations médias et textes privés. */
#directOptionsView .direct-contact-options-separator{
  display:block;
  width:100%;
  height:0;
  margin:18px 0 4px;
  border:0;
  border-top:1px solid #E1E5E8;
}

/* =========================================================
   V7.6.339 - choix de recherche + recherche avancée publique
   ========================================================= */
.search-choice-view{z-index:7620;align-items:flex-start;padding-top:17vh;}
.search-choice-card{max-width:390px;padding-top:18px;}
.search-choice-button{width:100%;margin-top:14px;}
.search-choice-card .simple-white-title{margin-bottom:8px;}
@media(max-width:680px){
  .search-choice-view{padding-top:13vh;}
}

.advanced-search-view{z-index:7630;align-items:flex-start;padding:0 18px 38px;}
.advanced-search-shell{
  width:100%;
  max-width:660px;
  margin:0 auto;
  padding:88px 0 36px;
  box-sizing:border-box;
}
.advanced-search-selectors{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:10px;
  align-items:start;
}
.advanced-search-selector{position:relative;min-width:0;z-index:4;}
.advanced-search-selector.is-open{z-index:8;}
.advanced-search-selector-trigger{
  width:100%;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border:1px solid #DEE4E8;
  border-radius:10px;
  padding:0 10px 0 12px;
  background:#fff;
  color:#333A3F;
  font-family:Arial,sans-serif;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.advanced-search-selector-trigger:active{background:#F7F8F9;}
.advanced-search-selector-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.advanced-search-selector-chevron{display:block;width:18px;height:18px;flex:0 0 18px;transition:transform .15s ease;}
.advanced-search-selector.is-open .advanced-search-selector-chevron{transform:rotate(180deg);}
.advanced-search-selector-menu{
  position:absolute;
  top:46px;
  left:0;
  right:0;
  overflow:hidden;
  border:1px solid #DEE4E8;
  border-radius:11px;
  background:#fff;
  box-shadow:0 8px 24px rgba(29,39,46,.10);
}
.advanced-search-selector-menu[hidden]{display:none!important;}
.advanced-search-selector-option{
  width:100%;
  min-height:40px;
  display:block;
  border:0;
  border-bottom:1px solid #EEF1F3;
  padding:9px 12px;
  background:#fff;
  color:#3C4348;
  font-family:Arial,sans-serif;
  font-size:13px;
  line-height:18px;
  font-weight:600;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.advanced-search-selector-option:last-child{border-bottom:0;}
.advanced-search-selector-option:active{background:#F4F6F7;}
.advanced-search-selector-option.is-selected{display:none;}
.advanced-search-status{
  width:100%;
  box-sizing:border-box;
  margin-top:14px;
  border-radius:12px;
  background:#F5F7F8;
  padding:12px 14px;
  color:#626b71;
  font-size:13px;
  line-height:19px;
  text-align:left;
}
.advanced-search-status.is-ok{background:#EEF4F8;color:#49677D;}
.advanced-search-status.is-error{background:#FFF0F0;color:#7B2929;}
.advanced-search-results{display:flex;flex-direction:column;gap:9px;margin-top:14px;}
.advanced-search-result{
  width:100%;
  min-height:74px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid #E1E7EB;
  border-radius:15px;
  background:#fff;
  padding:10px 12px;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.advanced-search-result:active{background:#F7F8F9;}
.advanced-search-result-photo,
.advanced-search-result-initial{
  width:52px;
  height:52px;
  flex:0 0 52px;
  border-radius:50%;
  background:#E9F0F5;
}
.advanced-search-result-photo{display:block;object-fit:cover;}
.advanced-search-result-initial{display:grid;place-items:center;color:#62809B;font-size:20px;font-weight:900;}
.advanced-search-result-main{min-width:0;flex:1;}
.advanced-search-result-name{display:block;color:#202529;font-size:16px;line-height:21px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.advanced-search-result-meta{display:block;color:#7B8389;font-size:12px;line-height:17px;margin-top:3px;}
.advanced-search-result-recent{display:inline-block;width:max-content;margin-top:5px;border-radius:999px;background:#EDF4F8;color:#62809B;font-size:10px;line-height:15px;font-weight:800;padding:3px 8px;}
.advanced-search-empty{margin-top:14px;border-radius:12px;background:#F5F7F8;padding:13px 14px;color:#626B71;font-size:13px;line-height:19px;text-align:left;}
.advanced-search-geo-view{z-index:7900;align-items:flex-start;padding-top:17vh;}
@media(max-width:680px){
  .advanced-search-geo-view{padding-top:13vh;}
}
#advancedSearchGeoClose{z-index:7905;}
.advanced-search-geo-card{max-width:420px;}
.advanced-search-geo-allow{width:100%;margin-top:22px;}
.advanced-search-geo-status{width:100%;min-height:18px;margin-top:12px;color:#747C83;font-size:13px;line-height:19px;text-align:center;}
@media(max-width:520px){
  .advanced-search-view{padding-left:14px;padding-right:14px;}
  .advanced-search-shell{padding-top:88px;}
  .advanced-search-selectors{gap:8px;}
  .advanced-search-selector-trigger{height:38px;padding-left:10px;padding-right:8px;font-size:12px;}
  .advanced-search-selector-menu{top:44px;}
  .advanced-search-selector-option{font-size:12px;}
}
@media(max-width:520px){
  .pseudo-search-view{padding-left:14px;padding-right:14px;}
  .pseudo-search-shell{padding-top:88px;}
  .pseudo-search-result-action{width:36px;height:36px;flex-basis:36px;}
}



/* =========================================================
   V7.6.347 - À propos interactif : tags, ville, points communs
   V7.6.346 - cadre fixe + flèches superposées
   ========================================================= */
.member-about-location-wrap{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
}
.member-about-location{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  min-height:28px;
  max-width:100%;
  color:#62809B;
  font-size:13px;
  line-height:18px;
  font-weight:700;
}
.member-about-location.member-about-chip{padding-left:10px;padding-right:12px;}
.member-about-location img{width:16px;height:16px;object-fit:contain;opacity:.95;flex:0 0 auto;}
.member-about-location strong{font-size:13px;line-height:18px;font-weight:700;color:#62809B;}
.member-about-empty{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:0 10px;
  color:#8A9298;
  font-size:14px;
  line-height:20px;
  text-align:center;
  word-break:normal;
  overflow-wrap:break-word;
}
.member-about-hint{
  width:100%;
  box-sizing:border-box;
  margin-top:9px;
  padding:0 4px;
  color:#899198;
  font-size:11px;
  line-height:16px;
  text-align:center;
}
.member-about-interaction-view{
  align-items:flex-start;
  padding-top:17vh;
}
@media(max-width:680px){.member-about-interaction-view{padding-top:13vh;}}
.member-about-interaction-card{max-width:410px;}
.member-about-interaction-card .simple-white-text{margin-top:12px;}
.member-about-me-too{width:100%;margin-top:22px;}
.member-about-interaction-status{
  min-height:18px;
  margin-top:11px;
  color:#62809B;
  font-size:13px;
  line-height:18px;
  font-weight:700;
  text-align:center;
}
.member-about-city-card{max-width:430px;}
.member-about-city-pair{
  width:100%;
  display:grid;
  grid-template-columns:82px minmax(56px,1fr) 82px;
  align-items:center;
  gap:10px;
  margin-top:22px;
}
.member-about-city-person{min-width:0;text-align:center;}
.member-about-city-avatar{
  width:72px;
  height:72px;
  margin:0 auto;
  border-radius:50%;
  overflow:hidden;
  background:#E9F0F5;
  display:grid;
  place-items:center;
  color:#62809B;
  font-size:24px;
  font-weight:800;
}
.member-about-city-avatar img{display:block;width:100%;height:100%;object-fit:cover;}
.member-about-city-avatar .direct-overlay-person-initial{display:grid;place-items:center;width:100%;height:100%;color:#62809B;font-size:24px;font-weight:800;}
.member-about-city-person-name{margin-top:6px;color:#4A5156;font-size:12px;line-height:16px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.member-about-city-link{display:flex;align-items:center;justify-content:center;gap:4px;color:#A6ADB2;}
.member-about-city-link i{display:block;flex:1;height:1px;min-width:28px;background:#CDD3D7;}
.member-about-city-link span{font-size:22px;line-height:22px;font-weight:400;color:#9BA3A9;}
.member-about-city-text{margin-top:18px !important;}
.member-about-city-distance{width:100%;margin-top:22px;}
.member-about-city-distance-result{min-height:18px;margin-top:12px;color:#62809B;font-size:14px;line-height:20px;font-weight:800;text-align:center;}
.member-distance-geo-card{max-width:390px;}



/* =========================================================
   V7.6.352 - DISCUSSIONS PAR RUBRIQUE / CONTACTS = FAVORIS
   ========================================================= */
#directHubView .direct-hub-scroll{
  padding-top:max(72px, calc(env(safe-area-inset-top) + 64px));
}
.direct-hub-selector{
  position:relative;
  width:100%;
  margin:0 0 14px;
  z-index:8;
}
.direct-hub-selector-trigger{
  box-sizing:border-box;
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:1px solid #DEE3E7;
  border-radius:11px;
  padding:0 12px 0 14px;
  background:#F5F6F7;
  color:#24292D;
  font-size:14px;
  line-height:20px;
  font-weight:700;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.direct-hub-selector-trigger img{
  width:19px;
  height:19px;
  flex:0 0 19px;
  transition:transform .16s ease;
}
.direct-hub-selector.is-open .direct-hub-selector-trigger img{transform:rotate(180deg);}
.direct-hub-selector-menu{
  position:absolute;
  left:0;
  right:0;
  top:48px;
  box-sizing:border-box;
  overflow:hidden;
  border:1px solid #DEE3E7;
  border-radius:12px;
  background:#fff;
  box-shadow:0 8px 24px rgba(31,39,45,.12);
  z-index:12;
}
.direct-hub-selector-menu button{
  box-sizing:border-box;
  width:100%;
  min-height:44px;
  display:block;
  border:0;
  border-bottom:1px solid #EEF1F3;
  padding:9px 14px;
  background:#fff;
  color:#24292D;
  font-size:14px;
  line-height:20px;
  font-weight:600;
  text-align:left;
  cursor:pointer;
}
.direct-hub-selector-menu button:last-child{border-bottom:0;}
.direct-hub-selector-menu button:active{background:#F4F6F7;}

/* Le libellé du sélecteur remplace les anciens titres empilés. */
#directHubView .direct-hub-main-section{
  border-top:0 !important;
  padding-top:2px !important;
}
#directHubView .direct-hub-main-section .direct-section-title-row{display:none !important;}
#directHubView #directMessagesSection,
#directHubView #directContactsSection,
#directHubView #directBlockedSection,
#directHubView #directGroupsSection,
#directHubView #directAdminGroupsSection{display:none !important;}
#directHubView[data-direct-hub-tab="messages"] #directMessagesSection,
#directHubView[data-direct-hub-tab="contacts"] #directContactsSection,
#directHubView[data-direct-hub-tab="blocked"] #directBlockedSection,
#directHubView[data-direct-hub-tab="groups"] #directGroupsSection,
#directHubView[data-direct-hub-tab="admin_groups"] #directAdminGroupsSection{display:block !important;}
#directHubView .direct-see-all{display:none !important;}

.direct-hub-tab-search{
  box-sizing:border-box;
  width:100%;
  margin:0 0 10px;
}
.direct-hub-tab-search input{
  box-sizing:border-box;
  width:100%;
  min-height:42px;
  border:1px solid #DEE3E7;
  border-radius:11px;
  padding:9px 13px;
  background:#fff;
  color:#24292D;
  font-size:14px;
  line-height:20px;
  outline:none;
}
.direct-hub-tab-search input:focus{border-color:#62809B;}
#directBlockedEmpty{padding-top:16px;padding-bottom:16px;}


/* V7.6.353 - invitation de contact + navigation Discussions. */
.direct-contact-invite-button{width:100%;min-height:46px;margin-top:16px;border:0;border-radius:12px;background:#F1F2F3;color:#30363B;font-size:15px;font-weight:700;cursor:pointer;}
.direct-contact-invite-view{align-items:flex-start;padding-top:17vh;}
.direct-contact-invite-card{max-width:410px;}
.direct-contact-invite-card .simple-white-text{margin-top:12px;}
.direct-contact-invite-copy{width:100%;min-height:46px;margin-top:10px;border:0;border-radius:12px;background:#F1F2F3;color:#30363B;font-size:15px;font-weight:700;}
.direct-contact-invite-status{min-height:20px;margin-top:12px;color:#747C83;font-size:13px;line-height:19px;text-align:center;}
@media(max-width:680px){.direct-contact-invite-view{padding-top:13vh;}}


/* =========================================================
   V7.6.355 - PROFIL DEPUIS LA MESSAGERIE PRIVÉE
   ========================================================= */
#directChatView .direct-chat-person-card{
  border:0;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:pointer;
  pointer-events:auto !important;
  -webkit-tap-highlight-color:transparent;
}
#directChatView .direct-chat-person-card:active{background:#F7F8F9;}
#directChatView .direct-chat-person-card:disabled{cursor:default;opacity:.78;}
#memberActionView.direct-profile-mode{
  z-index:9000 !important;
}
#memberActionView.direct-profile-mode .member-action-content{
  padding-top:76px;
}
#memberActionView.direct-profile-mode .member-action-buttons{
  margin-top:20px;
  gap:0;
}
#memberActionView.direct-profile-mode .member-group-context-title,
#memberActionView.direct-profile-mode #memberReactionBar,
#memberActionView.direct-profile-mode #memberReplyBtn,
#memberActionView.direct-profile-mode #memberViewPhotoBtn,
#memberActionView.direct-profile-mode #memberPrivateMessageBtn,
#memberActionView.direct-profile-mode #memberMoreActionsToggle,
#memberActionView.direct-profile-mode #memberExtraActions{
  display:none !important;
}
#memberActionView.direct-profile-mode .member-about-section{
  display:block !important;
  margin-top:0 !important;
  padding-top:0 !important;
  border-top:0 !important;
}
#memberActionView.direct-profile-mode .member-about-title{
  display:none !important;
}
#memberActionView.direct-profile-mode .member-about-dots{
  margin-top:0;
}
.photo-viewer.profile-photo-viewer-top{z-index:30500 !important;}

/* =========================================================
   V7.6.359 - PHOTOS DU MEMBRE DANS LE CARROUSEL / GALERIE
   ========================================================= */
.member-about-media-trigger{
  min-width:74px;
  justify-content:center;
}
.member-about-media-view{
  align-items:flex-start;
  justify-content:center;
  padding:78px 18px 38px;
}
.member-about-media-card{
  width:100%;
  max-width:660px;
  align-items:stretch;
  text-align:left;
}
.member-about-media-card .simple-white-title{text-align:center;}
.member-about-media-text{
  width:100%;
  box-sizing:border-box;
  margin:10px 0 0;
  text-align:center;
}
.member-about-media-grid{
  width:100%;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(92px,1fr));
  gap:8px;
  margin-top:20px;
}
.member-about-media-thumb{
  position:relative;
  width:100%;
  aspect-ratio:1/1;
  display:block;
  overflow:hidden;
  padding:0;
  border:0;
  border-radius:10px;
  background:#EEF1F3;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.member-about-media-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.member-about-media-thumb:active{opacity:.82;}
.member-about-media-status{
  width:100%;
  min-height:18px;
  margin-top:14px;
  color:#81898F;
  font-size:12px;
  line-height:18px;
  text-align:center;
}
.member-about-media-more{
  width:100%;
  min-height:42px;
  margin-top:10px;
  border:0;
  border-radius:11px;
  background:#F0F1F2;
  color:#42484D;
  font-family:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
.photo-viewer.member-media-viewer-top{z-index:30500 !important;}
@media(max-width:520px){
  .member-about-media-view{padding-left:14px;padding-right:14px;}
  .member-about-media-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;}
}


/* =========================================================
   V7.6.370 - MES REVENUS / PARCOURS CRESCENDO
   Un seul scroll natif : aucun conteneur revenue n'installe
   de zone overflow scrollable.
   ========================================================= */
.revenue-view{
  z-index:30220;
  align-items:flex-start;
  justify-content:center;
  background:#fff;
}
.revenue-scroll{width:100%;height:auto;overflow:visible;box-sizing:border-box;}
.revenue-shell{width:100%;max-width:680px;margin:0 auto;padding:78px 18px 52px;box-sizing:border-box;}
.revenue-kicker{margin:0 0 11px;color:#62809B;font-size:12px;line-height:18px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}

/* Ecran d'entrée : volontairement très court */
.revenue-simple-hero{padding:29px 25px 25px;border-radius:24px;background:linear-gradient(145deg,#F3F6F8 0%,#E9EFF3 100%);box-sizing:border-box;}
.revenue-simple-mark{display:flex;align-items:center;justify-content:center;width:47px;height:47px;margin-bottom:19px;border-radius:15px;background:#62809B;color:#fff;font-size:24px;line-height:47px;font-weight:800;box-shadow:0 5px 16px rgba(98,128,155,.18);}
.revenue-simple-hero h1{max-width:520px;margin:0;color:#202428;font-size:35px;line-height:1.08;letter-spacing:-.9px;}
.revenue-simple-hero>p{max-width:570px;margin:14px 0 0;color:#59636C;font-size:15px;line-height:1.55;}
.revenue-simple-points{display:grid;gap:10px;margin-top:24px;}
.revenue-simple-point{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:14px;background:rgba(255,255,255,.78);box-sizing:border-box;}
.revenue-simple-point-number{flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:#E8EEF2;color:#62809B;font-size:12px;line-height:30px;font-weight:900;text-align:center;}
.revenue-simple-point div{min-width:0;}
.revenue-simple-point strong{display:block;color:#242A2F;font-size:14px;line-height:19px;}
.revenue-simple-point small{display:block;margin-top:2px;color:#747E85;font-size:12px;line-height:17px;}
.revenue-main-button{width:100%;min-height:52px;margin-top:20px;padding:0 18px;border:0;border-radius:13px;background:#62809B;color:#fff;font-size:15px;line-height:20px;font-weight:800;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.revenue-main-button:active{opacity:.88}
.revenue-main-button:disabled{opacity:.55;cursor:default;}
.revenue-dashboard-button{margin-top:24px;}
.revenue-simple-note{margin-top:11px;color:#8A9399;font-size:11px;line-height:16px;text-align:center;}

/* Tableau de bord */
.revenue-dashboard-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;}
.revenue-dashboard-heading h1{margin:0;color:#202428;font-size:32px;line-height:1.08;letter-spacing:-.65px;}
.revenue-balance{min-width:128px;padding:13px 14px;border:1px solid #E4E9EC;border-radius:15px;background:#F7F9FA;box-sizing:border-box;}
.revenue-balance span{display:block;color:#7B858C;font-size:11px;line-height:15px;font-weight:700;}
.revenue-balance strong{display:block;margin-top:5px;color:#202428;font-size:22px;line-height:27px;letter-spacing:-.35px;white-space:nowrap;}
.revenue-preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;}
.revenue-dashboard-grid{margin-top:20px;}
.revenue-preview-stat{min-width:0;padding:15px 13px;border-radius:14px;box-sizing:border-box;}
.revenue-stat-light{border:1px solid #E6EAED;background:#F7F8F9;}
.revenue-preview-stat span{display:block;color:#737E85;font-size:11px;line-height:16px;font-weight:700;}
.revenue-preview-stat strong{display:block;margin-top:7px;color:#22282D;font-size:23px;line-height:28px;}
.revenue-preview-note{margin-top:10px;color:#969DA1;font-size:11px;line-height:1.45;}
.revenue-section-eyebrow{margin-bottom:7px;color:#62809B;font-size:12px;line-height:18px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;}

.revenue-affiliate-card{margin-top:18px;padding:22px;border:1px solid #E2E8EC;border-radius:20px;background:#fff;box-shadow:0 10px 30px rgba(39,55,66,.05);box-sizing:border-box;}
.revenue-affiliate-card h2,.revenue-dashboard-tip h2{margin:0;color:#202428;font-size:23px;line-height:1.2;letter-spacing:-.3px;}
.revenue-affiliate-loading{display:flex;align-items:center;gap:10px;min-height:48px;color:#68747B;font-size:14px;font-weight:700;}
.revenue-mini-spinner{width:18px;height:18px;border:2px solid #DDE5EA;border-top-color:#62809B;border-radius:50%;animation:revenueSpin .8s linear infinite;}
@keyframes revenueSpin{to{transform:rotate(360deg)}}
.revenue-affiliate-state>p{margin:9px 0 0;color:#69727A;font-size:14px;line-height:1.5;}
.revenue-affiliate-terms{margin-top:11px;color:#8A9399;font-size:11px;line-height:1.45;text-align:center;}
.revenue-affiliate-terms a{color:#62809B;text-decoration:none;font-weight:700;}
.revenue-affiliate-error{margin-top:12px;padding:11px 12px;border-radius:11px;background:#FFF4F4;color:#A34C4C;font-size:12px;line-height:1.4;}
.revenue-affiliate-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.revenue-active-badge{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:999px;background:#EEF4F1;color:#4D7765;font-size:11px;font-weight:800;}
.revenue-link-box{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;margin-top:17px;padding:8px;border-radius:15px;background:#F4F6F7;align-items:center;}
.revenue-link-text{min-width:0;padding:0 8px;color:#26323A;font-size:15px;line-height:20px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.revenue-link-action{min-height:38px;padding:0 12px;border:1px solid #DCE3E7;border-radius:10px;background:#fff;color:#56636B;font-size:12px;font-weight:800;cursor:pointer;}
.revenue-link-action-primary{border-color:#62809B;background:#62809B;color:#fff;}
.revenue-affiliate-feedback{min-height:18px;margin-top:7px;color:#62809B;font-size:12px;font-weight:700;}

.revenue-growth-path{display:grid;gap:10px;margin-top:18px;}
.revenue-growth-card{display:flex;align-items:flex-start;gap:13px;padding:17px 18px;border-radius:17px;box-sizing:border-box;}
.revenue-growth-card-1{background:#F6F8F9;}
.revenue-growth-card-2{background:#EDF2F5;}
.revenue-growth-card-3{background:#E1EAF0;}
.revenue-growth-step{flex:0 0 31px;width:31px;height:31px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;color:#62809B;font-size:12px;line-height:31px;font-weight:900;box-shadow:0 2px 8px rgba(39,55,66,.06);}
.revenue-growth-card>div,.revenue-growth-card-content{min-width:0;flex:1;}
.revenue-growth-card h2{margin:1px 0 0;color:#202428;font-size:18px;line-height:1.25;letter-spacing:-.15px;}
.revenue-growth-card p{margin:6px 0 0;color:#67727A;font-size:13px;line-height:1.48;}
.revenue-growth-card-3 h2{color:#334B5D;}
.revenue-growth-card-content{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.revenue-tip-link{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 14px;border-radius:11px;background:#62809B;color:#fff;font-size:12px;font-weight:800;text-decoration:none;white-space:nowrap;}

@media(max-width:600px){
  .revenue-shell{padding:70px 14px 38px;}
  .revenue-simple-hero{padding:24px 18px 21px;border-radius:20px;}
  .revenue-simple-mark{width:43px;height:43px;margin-bottom:17px;border-radius:14px;font-size:22px;line-height:43px;}
  .revenue-simple-hero h1{font-size:30px;}
  .revenue-simple-points{margin-top:20px;}
  .revenue-simple-point{padding:12px;}
  .revenue-dashboard-heading{display:block;}
  .revenue-balance{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-top:16px;padding:11px 13px;}
  .revenue-balance strong{margin-top:0;font-size:20px;}
  .revenue-preview-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .revenue-preview-stat{padding:13px 9px;text-align:center;}
  .revenue-preview-stat strong{font-size:20px;}
  .revenue-affiliate-card{padding:19px 17px;}
  .revenue-link-box{grid-template-columns:1fr 1fr;padding:8px;}
  .revenue-link-text{grid-column:1 / -1;min-height:36px;display:flex;align-items:center;padding:0 7px;font-size:14px;}
  .revenue-link-action{width:100%;}
  .revenue-growth-card{padding:15px 14px;}
  .revenue-growth-card-content{display:block;}
  .revenue-tip-link{margin-top:12px;}
}

/* =========================================================
   V7.6.374 - COMPOSEUR PRIVÉ ANCRÉ COMME LE GROUPE
   =========================================================
 * Hors clavier, la zone de saisie de la vraie messagerie privée reprend
 * l'ancrage du composeur principal du groupe : position fixed + bottom:0.
 * Cela évite qu'un calcul 100dvh trop grand sur certains Chrome/Android
 * place le composeur sous la zone réellement visible.
 *
 * Quand le clavier logiciel est détecté, on conserve volontairement le
 * chemin privé déjà validé : le composeur redevient absolute dans
 * directChatView, dont la hauteur suit VisualViewport. Aucun changement
 * n'est apporté au composeur du groupe ni à sa gestion historique.
 */
.direct-chat-composer{
  position:fixed;
  left:auto;
  right:50%;
  bottom:0;
  transform:none;
  margin-right:-335px;
  width:670px;
  max-width:100%;
  z-index:7752;
}
@media(max-width:800px){
  .direct-chat-composer{
    right:0;
    margin-right:0;
    width:100%;
  }
}
.direct-chat-view.readim-keyboard-open .direct-chat-composer{
  position:absolute;
  left:50%;
  right:auto;
  bottom:0;
  transform:translateX(-50%);
  margin-right:0;
  width:100%;
  max-width:670px;
}

