/* FTS-CHAT.CSS — styles communs Messages + Forum */
:root {
  --black:   #0a0a0a;
  --white:   #f5f2ee;
  --brand:   #f8e702;
  --brand-ink:#050505;
  --danger:  #ff5a5a;
  --danger-bg:rgba(255,90,90,.12);
  --red:     #f8e702;
  --gold:    #f8e702;
  --grey:    #1c1c1c;
  --grey2:   #141414;
  --muted:   #888;
  --border:  #2a2a2a;
  /* Messagerie */
  --msg-out: rgba(248,231,2,.18);
  --msg-in:  #1c1c1c;
  --badge:   #f8e702;
  --r:       14px;
}

html, body {
  height: 100%; height: calc(var(--vh, 100vh));
  background: var(--black); color: var(--white);
  font-family: "DM Sans", sans-serif; overflow: hidden;
  -webkit-font-smoothing: antialiased;
}

/* ══ AUTH LOADING ════════════════════════════════════════════════ */
.auth-loading {
  position: fixed; inset: 0; background: var(--black);
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 1rem; z-index: 9999;
}
.auth-logo { font-family: "Bebas Neue", sans-serif; font-size: 2.5rem; letter-spacing: .04em; }
.auth-logo span { color: var(--red); }
.spinner { width: 26px; height: 26px; border: 2px solid #2a2a2a; border-top-color: var(--red); border-radius: 50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ══ SHELL ═══════════════════════════════════════════════════════ */
.app {
  display: flex;
  height: 100vh; height: calc(var(--vh, 100vh));
  position: relative; overflow: hidden;
  background: var(--black);
}

/* ══════════════════════════════════════════════════════════════════
   SIDEBAR — liste des conversations
══════════════════════════════════════════════════════════════════ */
.sidebar {
  width: 340px; min-width: 340px;
  background: var(--grey2);
  border-right: 1px solid var(--border);
  display: flex; flex-direction: column;
  flex-shrink: 0;
}

/* En-tête sidebar */
.sb-hdr {
  display: flex; align-items: center; gap: .8rem;
  padding: 1rem; background: var(--grey2);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.sb-avatar {
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .9rem; font-weight: 600; color: #fff;
  flex-shrink: 0; text-transform: uppercase; cursor: pointer;
  transition: opacity .2s;
}
.sb-avatar:hover { opacity: .8; }
.sb-title {
  flex: 1; font-family: "Bebas Neue", sans-serif;
  font-size: 1.4rem; letter-spacing: .04em;
  color: var(--white);
}
.sb-title span { color: var(--red); }
.btn-compose {
  width: 36px; height: 36px; border-radius: 50%;
  background: transparent; border: 1px solid var(--border);
  color: var(--muted); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; transition: all .2s; flex-shrink: 0;
}
.btn-compose:hover { background: var(--grey); color: var(--white); border-color: #444; }

/* Barre de recherche */
.sb-search {
  padding: .55rem .8rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.search-inp {
  width: 100%; background: var(--grey);
  border: 1px solid var(--border); border-radius: 8px;
  color: var(--white); font-family: "DM Sans", sans-serif;
  font-size: .88rem; padding: .55rem .9rem .55rem 2.4rem;
  outline: none; transition: border-color .2s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: 10px center;
}
.search-inp:focus { border-color: rgba(248,231,2,.4); }
.search-inp::placeholder { color: #444; }

/* Liste conversations */
.conv-list { flex: 1; overflow-y: auto; }
.conv-list::-webkit-scrollbar { width: 3px; }
.conv-list::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 2px; }

.conv-empty {
  padding: 3rem 1.5rem; text-align: center;
}
.conv-empty-icon { font-size: 3rem; display: block; opacity: .25; margin-bottom: .8rem; }
.conv-empty p { font-size: .82rem; color: var(--muted); line-height: 1.7; }

.conv-item {
  display: flex; align-items: center; gap: .9rem;
  padding: .8rem 1rem; cursor: pointer;
  transition: background .12s;
  border-bottom: 1px solid rgba(255,255,255,.03);
  position: relative;
}
.conv-item:hover  { background: rgba(255,255,255,.03); }
.conv-item.active { background: rgba(248,231,2,.07); border-left: 2px solid var(--red); padding-left: calc(1rem - 2px); }

.conv-av {
  width: 48px; height: 48px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; font-weight: 600; color: #fff;
  flex-shrink: 0; text-transform: uppercase;
}
.conv-body { flex: 1; min-width: 0; }
.conv-row1 { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: .2rem; gap: .4rem; }
.conv-name { font-size: .93rem; font-weight: 500; color: var(--white); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.conv-ts { font-size: .68rem; color: var(--muted); white-space: nowrap; flex-shrink: 0; }
.conv-ts.unread { color: var(--gold); }
.conv-row2 { display: flex; align-items: center; gap: .4rem; }
.conv-preview { font-size: .8rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.conv-badge {
  background: var(--red); color: var(--brand-ink, #050505); font-size: .6rem; font-weight: 700;
  min-width: 18px; height: 18px; padding: 0 4px;
  border-radius: 9px; text-align: center; line-height: 18px; flex-shrink: 0;
}

/* Nav bas sidebar */
.sb-nav {
  display: flex; border-top: 1px solid var(--border);
  background: var(--grey2); flex-shrink: 0;
  padding-bottom: env(safe-area-inset-bottom);
}
.snav {
  flex: 1; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 3px; padding: .65rem .4rem;
  text-decoration: none; color: var(--muted); font-size: .58rem;
  letter-spacing: .06em; text-transform: uppercase;
  border: none; background: transparent; cursor: pointer;
  font-family: "DM Sans", sans-serif; transition: color .2s;
}
.snav .ico { font-size: 1.2rem; line-height: 1; }
.snav:hover { color: var(--white); }
.snav.logout:hover { color: var(--red); }

/* ══════════════════════════════════════════════════════════════════
   MAIN — zone de chat
══════════════════════════════════════════════════════════════════ */
.main {
  flex: 1; display: flex; flex-direction: column;
  background: var(--black); min-width: 0; position: relative;
}

/* État vide (desktop) */
.chat-empty {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 1rem; text-align: center; padding: 2rem;
  background: var(--black);
}
.chat-empty-ring {
  width: 80px; height: 80px; border-radius: 50%;
  border: 2px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 2rem;
}
.chat-empty-title { font-family: "Bebas Neue", sans-serif; font-size: 1.8rem; letter-spacing: .04em; }
.chat-empty-title span { color: var(--red); }
.chat-empty-sub { font-size: .82rem; color: var(--muted); line-height: 1.6; max-width: 240px; }
.btn-start {
  margin-top: .5rem; padding: .65rem 1.4rem;
  background: var(--red); border: none; color: var(--brand-ink, #050505);
  border-radius: var(--r); cursor: pointer;
  font-family: "DM Sans", sans-serif; font-size: .88rem;
  font-weight: 500; transition: background .2s;
}
.btn-start:hover { background: var(--red-dark); }

/* Zone chat */
.chat-zone {
  display: none; flex: 1; flex-direction: column;
  min-height: 0; background: var(--black);
}
.chat-zone.on { display: flex; }

/* Header chat */
.chat-hdr {
  display: flex; align-items: center; gap: .8rem;
  padding: .8rem 1rem; background: var(--grey2);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.btn-back {
  display: none; background: transparent; border: none;
  color: var(--muted); font-size: 1.4rem; cursor: pointer;
  padding: .1rem .3rem; line-height: 1; transition: color .2s;
  flex-shrink: 0;
}
.btn-back:hover { color: var(--white); }
.chat-hdr-av {
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .9rem; font-weight: 600; color: #fff;
  flex-shrink: 0; text-transform: uppercase;
}
.chat-hdr-info { flex: 1; min-width: 0; }
.chat-hdr-name { font-size: .95rem; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-hdr-sub { font-size: .7rem; color: var(--muted); margin-top: .05rem; }

/* Messages */
.messages {
  flex: 1; overflow-y: auto;
  padding: 1rem 5%;
  display: flex; flex-direction: column; gap: .2rem;
}
.messages::-webkit-scrollbar { width: 3px; }
.messages::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 2px; }

.day-sep {
  display: flex; align-items: center;
  margin: .8rem 0; gap: .6rem;
}
.day-sep::before, .day-sep::after { content: ""; flex: 1; height: 1px; background: #1e1e1e; }
.day-sep span {
  font-size: .62rem; color: var(--muted); padding: .2rem .7rem;
  background: #141414; border: 1px solid #1e1e1e;
  border-radius: 6px; white-space: nowrap;
}

.msg-wrap {
  display: flex; flex-direction: column;
  max-width: 70%; animation: msgIn .15s ease; margin: .05rem 0;
}
@keyframes msgIn { from { opacity:0; transform:translateY(3px); } to { opacity:1; transform:translateY(0); } }
.msg-wrap.own   { align-self: flex-end; align-items: flex-end; }
.msg-wrap.other { align-self: flex-start; align-items: flex-start; }

.msg-sender { font-size: .68rem; font-weight: 500; color: var(--gold); margin-bottom: .2rem; padding: 0 .4rem; }

.msg-bubble {
  padding: .55rem .8rem .45rem;
  border-radius: var(--r); font-size: .88rem;
  line-height: 1.5; word-break: break-word;
  position: relative;
}
.msg-wrap.own   .msg-bubble { background: var(--msg-out); border: 1px solid rgba(248,231,2,.25); border-bottom-right-radius: 3px; }
.msg-wrap.other .msg-bubble { background: var(--msg-in);  border: 1px solid var(--border); border-bottom-left-radius: 3px; }
/* Espace réservé pour l'heure */
.msg-bubble::after { content: ""; display: inline-block; width: 52px; }

.msg-foot {
  position: absolute; bottom: .35rem; right: .65rem;
  display: flex; align-items: center; gap: .2rem;
}
.msg-time  { font-size: .6rem; color: rgba(245,242,238,.35); white-space: nowrap; }
.msg-check { font-size: .6rem; color: var(--gold); }

/* Input */
.input-area {
  padding: .6rem .8rem;
  padding-bottom: calc(.6rem + env(safe-area-inset-bottom));
  background: var(--grey2);
  border-top: 1px solid var(--border);
  flex-shrink: 0;
  display: flex; align-items: flex-end; gap: .5rem;
}
.input-pill {
  flex: 1; background: var(--grey);
  border: 1px solid var(--border);
  border-radius: 22px; display: flex; align-items: flex-end;
  transition: border-color .2s;
}
.input-pill:focus-within { border-color: rgba(248,231,2,.5); }
.msg-input {
  flex: 1; background: transparent; border: none;
  color: var(--white); font-family: "DM Sans", sans-serif;
  font-size: 1rem; /* 1rem = 16px → évite le zoom iOS */
  padding: .6rem 1rem; resize: none; outline: none;
  max-height: 140px; line-height: 1.5; min-height: 40px;
}
.msg-input::placeholder { color: #444; }
.btn-send {
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--red); border: none; color: var(--brand-ink, #050505);
  cursor: pointer; display: flex; align-items: center;
  justify-content: center; font-size: 1rem;
  transition: background .2s; flex-shrink: 0;
}
.btn-send:hover { background: var(--red-dark); }

/* ══════════════════════════════════════════════════════════════════
   MODAL — nouveau message
══════════════════════════════════════════════════════════════════ */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.8);
  z-index: 1000; display: flex;
  align-items: flex-end; /* sheet depuis le bas sur mobile */
  justify-content: center;
  backdrop-filter: blur(4px);
}
.modal-overlay.hidden { display: none; }

.modal {
  background: var(--grey2);
  border-radius: 16px 16px 0 0;
  border: 1px solid var(--border); border-bottom: none;
  padding: .5rem 1.5rem 1.5rem;
  width: 100%; max-width: 480px;
  max-height: 92vh; overflow-y: auto;
  animation: slideUp .25s ease;
}
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* Poignée */
.modal-grip {
  width: 36px; height: 4px; background: #333;
  border-radius: 2px; margin: .7rem auto 1rem;
}

.modal-hdr {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 1rem;
}
.modal-title { font-family: "Bebas Neue", sans-serif; font-size: 1.6rem; letter-spacing: .03em; }
.btn-modal-close {
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--grey); border: 1px solid var(--border);
  color: var(--muted); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: .8rem; transition: all .2s;
}
.btn-modal-close:hover { border-color: var(--red); color: var(--red); }

/* Type tabs */
.type-tabs { display: flex; gap: .4rem; margin-bottom: 1.2rem; }
.type-tab {
  flex: 1; padding: .6rem; background: var(--grey);
  border: 1px solid var(--border); border-radius: 8px;
  color: var(--muted); font-family: "DM Sans", sans-serif;
  font-size: .82rem; cursor: pointer; text-align: center;
  transition: all .15s;
}
.type-tab:hover { border-color: #444; color: var(--white); }
.type-tab.on { background: rgba(248,231,2,.1); border-color: var(--red); color: var(--red); }

.modal-lbl { font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); display: block; margin: .8rem 0 .4rem; }
.modal-field {
  width: 100%; background: var(--grey); border: 1px solid var(--border);
  border-radius: 8px; color: var(--white); font-family: "DM Sans", sans-serif;
  font-size: 1rem; padding: .65rem .9rem; outline: none;
  transition: border-color .2s;
}
.modal-field:focus { border-color: rgba(248,231,2,.5); }

/* Picker membres */
.picker-search {
  width: 100%; background: var(--grey);
  border: 1px solid var(--border); border-radius: 8px;
  color: var(--white); font-family: "DM Sans", sans-serif;
  font-size: 1rem; padding: .6rem .9rem .6rem 2.4rem;
  outline: none; margin-bottom: .5rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: 10px center;
}
.picker-search::placeholder { color: #444; }

.user-list {
  max-height: 240px; overflow-y: auto;
  border: 1px solid var(--border); border-radius: 8px;
  background: var(--black);
}
.user-row {
  display: flex; align-items: center; gap: .8rem;
  padding: .65rem .9rem; cursor: pointer;
  transition: background .12s;
  border-bottom: 1px solid rgba(255,255,255,.03);
}
.user-row:last-child { border-bottom: none; }
.user-row:hover { background: rgba(255,255,255,.03); }
.user-row.sel  { background: rgba(248,231,2,.07); }
.user-av {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; font-weight: 600; color: #fff;
  flex-shrink: 0; text-transform: uppercase;
}
.user-name  { flex: 1; font-size: .88rem; color: var(--white); }
.user-role  { font-size: .65rem; color: var(--muted); }
.user-check {
  width: 20px; height: 20px; border-radius: 50%;
  border: 2px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: .65rem; color: #fff; transition: all .15s; flex-shrink: 0;
}
.user-row.sel .user-check { background: var(--red); border-color: var(--red); }

.sel-info { font-size: .75rem; color: var(--muted); margin: .5rem 0; min-height: 1.1em; }
.modal-err { font-size: .75rem; color: var(--red); margin-bottom: .4rem; min-height: 1rem; }

.modal-btns { display: flex; gap: .6rem; margin-top: .8rem; }
.btn-mcancel {
  flex: 1; padding: .75rem; background: var(--grey);
  border: 1px solid var(--border); color: var(--muted);
  border-radius: 8px; cursor: pointer;
  font-family: "DM Sans", sans-serif; font-size: .88rem;
  transition: all .2s;
}
.btn-mcancel:hover { border-color: #444; color: var(--white); }
.btn-mstart {
  flex: 1; padding: .75rem; background: var(--red);
  border: none; color: var(--brand-ink, #050505); border-radius: 8px;
  cursor: pointer; font-family: "DM Sans", sans-serif;
  font-size: .88rem; font-weight: 500; transition: background .2s;
}
.btn-mstart:hover { background: var(--red-dark); }

/* ══════════════════════════════════════════════════════════════════
   MOBILE — layout complet
   Sur mobile : sidebar = plein écran, chat slide depuis la droite
══════════════════════════════════════════════════════════════════ */
@media (max-width: 700px) {

  /* Sidebar prend tout l'écran */
  .sidebar {
    width: 100%; min-width: 0;
    border-right: none;
  }

  /* Main = overlay qui slide depuis la droite */
  .main {
    position: fixed; inset: 0;
    z-index: 20;
    transform: translateX(100%);
    transition: transform .28s cubic-bezier(.4,0,.2,1);
    background: var(--black);
    display: flex; flex-direction: column; /* toujours flex */
  }

  /* Quand une conv est ouverte */
  .app.chat-open .main { transform: translateX(0); }
  .app.chat-open .sidebar { visibility: hidden; }

  /* Bouton retour visible */
  .btn-back { display: flex !important; }

  /* Pas besoin de l'empty state sur mobile */
  .chat-empty { display: none; }

  /* Chat zone always flex sur mobile */
  .chat-zone { display: flex !important; flex: 1; min-height: 0; }

  /* Bulles plus larges */
  .msg-wrap { max-width: 86%; }
  .messages { padding: .8rem 3%; }

  /* CRITIQUE : font-size 16px sur tous les inputs → empêche le zoom iOS */
  input, textarea, select { font-size: 16px !important; }

  /* Modal depuis le bas (déjà configuré, mais s'assurer) */
  .modal-overlay { align-items: flex-end; }
}

/* Desktop : modal centrée */
@media (min-width: 701px) {
  .modal-overlay { align-items: center; }
  .modal { border-radius: 16px; border-bottom: 1px solid var(--border); animation: modalIn .2s ease; max-width: 440px; }
  @keyframes modalIn { from { opacity:0; transform:scale(.96); } to { opacity:1; transform:scale(1); } }
  .modal-grip { display: none; }
}

/* ────────────────────────────────────────────────────────────────
   Extensions Forum — même shell que Messages
──────────────────────────────────────────────────────────────── */
.forum-category-group { border-bottom: 1px solid rgba(255,255,255,.03); }
.forum-category-group .conv-item { border-bottom: none; }
.forum-category-group.open .conv-item { background: rgba(248,231,2,.045); }
.forum-chevron { color: var(--muted); font-size: .8rem; transition: transform .2s; }
.forum-category-group.open .forum-chevron { transform: rotate(90deg); color: var(--gold); }
.forum-subchannels { display: none; padding: 0 0 .45rem 4.2rem; }
.forum-category-group.open .forum-subchannels { display: block; }
.forum-subchannel {
  display: flex; align-items: center; gap: .55rem;
  padding: .45rem .8rem; margin: .15rem .8rem .15rem 0;
  border-radius: 9px; cursor: pointer; color: var(--muted);
  font-size: .82rem; transition: all .15s;
}
.forum-subchannel:hover { background: rgba(255,255,255,.04); color: var(--white); }
.forum-subchannel.active { background: rgba(248,231,2,.09); color: var(--white); }
.forum-sub-icon { width: 20px; text-align: center; flex-shrink: 0; }
.forum-sub-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-bar,
.pending-bar {
  display:none; align-items:center; justify-content:space-between; gap:.7rem;
  padding:.55rem 1rem; font-size:.72rem; border-bottom:1px solid var(--border);
  background:var(--grey2); color:var(--muted); flex-shrink:0;
}
.pending-bar.show { display:flex; color:var(--gold); border-bottom-color:rgba(248,231,2,.25); background:#171303; }
.admin-bar.show { display:flex; color:#e07070; border-bottom-color:#3a1a1a; background:#1a0a0a; }
.btn-admin-small { background:transparent; border:1px solid #3a1a1a; color:#e07070; border-radius:8px; padding:.25rem .55rem; cursor:pointer; }
.btn-admin-small:hover { border-color:var(--red); color:#fff; }
.upload-bar { display:none; align-items:center; gap:.7rem; padding:.5rem 1rem; background:var(--grey2); border-top:1px solid var(--border); font-size:.72rem; color:var(--muted); }
.upload-bar.show { display:flex; }
.upload-track { flex:1; height:4px; border-radius:999px; background:#2a2a2a; overflow:hidden; }
.upload-fill { height:100%; width:0%; background:var(--red); transition:width .2s; }
.btn-attach { width:42px; height:42px; border-radius:50%; background:var(--grey); border:1px solid var(--border); color:var(--muted); cursor:pointer; flex-shrink:0; }
.btn-attach:hover { color:var(--gold); border-color:var(--gold); }
.msg-img, .msg-video { max-width:100%; max-height:260px; border-radius:10px; margin-top:.25rem; display:block; cursor:pointer; }
.msg-media-wrap { display:grid; gap:.45rem; margin-top:.25rem; }
.msg-audio-card { display:grid; gap:.45rem; min-width:min(280px, 70vw); }
.msg-audio-title { font-size:.78rem; font-weight:700; color:var(--white); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.msg-file-card {
  display:grid; gap:.6rem; min-width:min(330px, 76vw); margin-top:.35rem;
  padding:.8rem; border:1px solid rgba(248,231,2,.16); border-radius:16px;
  background:linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.03));
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
}
.msg-file-visible-title {
  display: flex;
  align-items: center;
  gap: .45rem;
  width: 100%;
  color: var(--white);
  font-size: .9rem;
  font-weight: 900;
  line-height: 1.25;
  margin-bottom: .15rem;
  overflow-wrap: anywhere;
}
.msg-file-main { display:flex; align-items:center; gap:.7rem; color:var(--white); text-decoration:none; min-width:0; padding:.55rem; border-radius:13px; background:rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.055); }
.msg-file-main:hover .msg-file-title { color:var(--gold); }
.msg-file-icon { width:40px; height:40px; display:grid; place-items:center; flex-shrink:0; border-radius:12px; background:rgba(248,231,2,.12); font-size:1.2rem; box-shadow: inset 0 0 0 1px rgba(248,231,2,.12); }
.msg-file-info { display:grid; gap:.12rem; min-width:0; flex:1; max-width:100%; }
.msg-file-title { display:block; color:var(--white); font-size:.84rem; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.msg-file-sub { font-size:.68rem; color:var(--muted); font-weight:700; }
.msg-file-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; }
.msg-file-open,
.msg-file-download {
  display:inline-flex; align-items:center; justify-content:center; gap:.35rem; width:fit-content; min-height:34px;
  padding:.46rem .72rem; border-radius:999px; text-decoration:none; font-size:.72rem; font-weight:900; line-height:1;
}
.msg-file-open { color:var(--white); border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.07); }
.msg-file-download { color:var(--gold); border:1px solid rgba(248,231,2,.38); background:rgba(248,231,2,.09); }
.msg-file-open:hover, .msg-file-download:hover { border-color:var(--gold); background:rgba(248,231,2,.14); }
.msg-file-download.compact { margin-top:.05rem; }
.msg-pdf { display:inline-flex; align-items:center; gap:.45rem; color:var(--gold); text-decoration:none; margin-top:.25rem; }
.msg-pdf:hover { text-decoration:underline; }
.btn-del-msg { margin-top:.25rem; background:transparent; border:none; color:#777; font-size:.7rem; cursor:pointer; padding:.15rem .4rem; }
.btn-del-msg:hover { color:var(--red); }
.notif-mini { padding:.55rem .8rem; font-size:.72rem; color:var(--muted); border-top:1px solid var(--border); }
.btn-notif { width:100%; background:transparent; border:1px solid var(--border); color:var(--muted); border-radius:8px; padding:.55rem .8rem; cursor:pointer; font-family:"DM Sans", sans-serif; }
.btn-notif.on, .btn-notif:hover { color:var(--gold); border-color:var(--gold); background:rgba(248,231,2,.07); }


/* ════════════════════════════════════════════════════════════════
   FTS Chat Modern — harmonisation avec Espace Membres
   CSS uniquement : ne change pas la logique Firebase.
════════════════════════════════════════════════════════════════ */
body.fts-chat-modern {
  background:
    radial-gradient(circle at top right, rgba(248,231,2,.13), transparent 32%),
    radial-gradient(circle at bottom left, rgba(248,231,2,.08), transparent 28%),
    var(--black);
}
body.fts-chat-modern .app { background: transparent; }
body.fts-chat-modern .sidebar {
  background: rgba(20,20,20,.92);
  border-right: 1px solid rgba(255,255,255,.08);
  box-shadow: 14px 0 35px rgba(0,0,0,.22);
}
body.fts-chat-modern .sb-hdr {
  min-height: 76px;
  padding: 1rem;
  background: linear-gradient(135deg, rgba(248,231,2,.11), rgba(248,231,2,.06));
  border-bottom: 1px solid rgba(255,255,255,.08);
}
body.fts-chat-modern .sb-title {
  font-family: "Bebas Neue", sans-serif;
  font-size: 1.55rem;
  letter-spacing: .05em;
}
body.fts-chat-modern .sb-title::after {
  content: attr(data-subtitle);
  display: block;
  margin-top: .15rem;
  font-family: "DM Sans", sans-serif;
  color: var(--muted);
  font-size: .62rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body.fts-chat-modern .sb-search { padding: .75rem .85rem; background: rgba(10,10,10,.28); }
body.fts-chat-modern .search-inp {
  min-height: 42px;
  border-radius: 999px;
  background-color: rgba(255,255,255,.04);
}
body.fts-chat-modern .conv-list { padding: .45rem; }
body.fts-chat-modern .conv-item {
  margin-bottom: .35rem;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  background: rgba(255,255,255,.025);
  padding: .85rem;
}
body.fts-chat-modern .conv-item.active {
  border-left: 1px solid rgba(248,231,2,.45);
  padding-left: .85rem;
  border-color: rgba(248,231,2,.38);
  background: rgba(248,231,2,.08);
}
body.fts-chat-modern .conv-av,
body.fts-chat-modern .sb-avatar,
body.fts-chat-modern .chat-hdr-av {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 8px 18px rgba(0,0,0,.18);
}
body.fts-chat-modern .notif-mini { padding: .65rem .85rem; }
body.fts-chat-modern .btn-notif {
  border-radius: 999px;
  border-color: rgba(248,231,2,.28);
  background: rgba(248,231,2,.06);
  color: var(--gold);
}
body.fts-chat-modern .sb-nav { display: none; }
body.fts-chat-modern .main {
  background:
    radial-gradient(circle at top right, rgba(248,231,2,.05), transparent 35%),
    var(--black);
}
body.fts-chat-modern .chat-empty-ring {
  width: 96px;
  height: 96px;
  border-color: rgba(248,231,2,.22);
  background: rgba(255,255,255,.025);
}
body.fts-chat-modern .chat-empty-title { font-size: 2.15rem; }
body.fts-chat-modern .chat-empty-sub { max-width: 320px; }
body.fts-chat-modern .btn-start {
  border-radius: 999px;
  box-shadow: 0 12px 24px rgba(248,231,2,.18);
}
body.fts-chat-modern .chat-hdr {
  min-height: 72px;
  background: rgba(20,20,20,.94);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
body.fts-chat-modern .messages { padding-bottom: calc(1rem + env(safe-area-inset-bottom)); }
body.fts-chat-modern .msg-bubble { border-radius: 18px; }
body.fts-chat-modern .msg-wrap.own .msg-bubble {
  background: linear-gradient(135deg, rgba(248,231,2,.30), rgba(248,231,2,.18));
  border: 1px solid rgba(248,231,2,.22);
}
body.fts-chat-modern .msg-wrap.other .msg-bubble {
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.07);
}
body.fts-chat-modern .input-area {
  padding: .75rem .85rem calc(.75rem + env(safe-area-inset-bottom));
  background: rgba(10,10,10,.96);
  border-top: 1px solid rgba(255,255,255,.08);
}
body.fts-chat-modern .input-pill {
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
}
body.fts-chat-modern .btn-send,
body.fts-chat-modern .btn-attach,
body.fts-chat-modern .btn-compose {
  border-radius: 999px;
}
body.fts-chat-modern .btn-send { box-shadow: 0 10px 22px rgba(248,231,2,.18); }
body.fts-chat-modern .pending-bar,
body.fts-chat-modern .admin-bar {
  border-radius: 0;
}

@media (max-width: 700px) {
  body.fts-chat-modern .conv-list { padding: .6rem .7rem calc(84px + env(safe-area-inset-bottom)); }
  body.fts-chat-modern .sidebar { box-shadow: none; }
  body.fts-chat-modern .chat-hdr { min-height: 64px; }
}

/* Navigation partagée : ne jamais gêner une conversation ouverte */
body.fts-chat-modern .app.chat-open ~ .fts-bottom-nav,
body.fts-chat-modern .app.chat-open ~ .fts-bottom-spacer { display: none; }
@media (min-width: 701px) {
  body.fts-chat-modern .fts-bottom-nav,
  body.fts-chat-modern .fts-bottom-spacer { display: none; }
}


/* Police marque FTS : uniquement gros titres Messages */
@font-face {
  font-family: "FTS Budmo";
  src: url("../fonts/budmo-jiggler.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

body.fts-chat-modern .sb-title.fts-brand-title,
body.fts-chat-modern .chat-empty-title.fts-brand-title {
  font-family: "FTS Budmo", "Bebas Neue", Impact, sans-serif !important;
  letter-spacing: .025em;
  text-transform: uppercase;
}

body.fts-chat-modern .sb-title.fts-brand-title span {
  display: block;
  color: var(--red);
  font-family: inherit;
  font-size: .72em;
  line-height: 1;
}

body.fts-chat-modern .chat-empty-title.fts-brand-title span {
  color: var(--red);
  font-family: inherit;
}

/* ════════════════════════════════════════════════════════════════
   V15 — Harmonisation Messages + Forum avec le dashboard FTS
   Mise en page uniquement : aucun changement Firebase / logique JS.
════════════════════════════════════════════════════════════════ */
body.fts-chat-modern {
  --panel-soft: rgba(255,255,255,.045);
  --panel-border: rgba(255,255,255,.09);
  --panel-border-strong: rgba(248,231,2,.22);
}

body.fts-chat-modern .app {
  isolation: isolate;
}

body.fts-chat-modern .sidebar {
  border-right-color: var(--panel-border);
}

body.fts-chat-modern .sb-hdr {
  position: relative;
  overflow: hidden;
}

body.fts-chat-modern .sb-hdr::before {
  content: '';
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(248,231,2,.75), rgba(255,87,87,.55), transparent);
  opacity: .8;
}

body.fts-chat-modern .conv-item,
body.fts-chat-modern .forum-subchannel,
body.fts-chat-modern .chat-empty-ring,
body.fts-chat-modern .input-pill,
body.fts-chat-modern .modal,
body.fts-chat-modern .user-list {
  border-color: var(--panel-border);
}

body.fts-chat-modern .forum-category-group {
  margin: 0 0 .5rem;
  border: 0;
}

body.fts-chat-modern .forum-category-group .conv-item:first-child {
  margin-bottom: .25rem;
}

body.fts-chat-modern .forum-subchannels {
  padding: 0 .55rem .45rem 4.6rem;
}

body.fts-chat-modern .forum-subchannel {
  min-height: 42px;
  margin: .18rem 0;
  border: 1px solid rgba(255,255,255,.055);
  background: rgba(255,255,255,.025);
}

body.fts-chat-modern .forum-subchannel.active {
  border-color: var(--panel-border-strong);
}

body.fts-chat-modern .chat-empty {
  background:
    radial-gradient(circle at 50% 34%, rgba(248,231,2,.09), transparent 28%),
    transparent;
}

body.fts-chat-modern .chat-empty-title,
body.fts-chat-modern .modal-title {
  letter-spacing: .045em;
}

body.fts-chat-modern .chat-hdr,
body.fts-chat-modern .input-area,
body.fts-chat-modern .upload-bar {
  backdrop-filter: blur(16px);
}

body.fts-chat-modern .messages {
  scroll-behavior: smooth;
}

body.fts-chat-modern .btn-compose,
body.fts-chat-modern .btn-chat-del,
body.fts-chat-modern .btn-attach {
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.10);
}

body.fts-chat-modern .btn-compose:hover,
body.fts-chat-modern .btn-chat-del:hover,
body.fts-chat-modern .btn-attach:hover {
  background: rgba(248,231,2,.08);
}

@media (max-width: 700px) {
  body.fts-chat-modern .app:not(.chat-open) {
    height: calc(var(--vh, 100vh) - 62px - env(safe-area-inset-bottom));
  }

  body.fts-chat-modern .sb-hdr {
    min-height: 72px;
    padding: .9rem 1rem;
  }

  body.fts-chat-modern .sb-title {
    font-size: 1.42rem;
  }

  body.fts-chat-modern .sb-search {
    padding: .7rem .85rem .55rem;
  }

  body.fts-chat-modern .conv-list {
    padding: .55rem .7rem .9rem;
  }

  body.fts-chat-modern .notif-mini {
    padding: .55rem .85rem .8rem;
  }

  body.fts-chat-modern .app.chat-open .main {
    height: var(--vh, 100vh);
  }

  body.fts-chat-modern .app.chat-open .input-area {
    padding-bottom: calc(.75rem + env(safe-area-inset-bottom));
  }

  body.fts-chat-modern .modal-overlay {
    z-index: 130;
  }
}


/* Patch UX v19 — lisibilité forum/messages */
body.fts-chat-modern .msg-wrap { animation: ftsMsgIn .18s ease both; }
@keyframes ftsMsgIn { from { opacity: .72; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }
body.fts-chat-modern .msg-bubble { box-shadow: 0 10px 26px rgba(0,0,0,.18); }
body.fts-chat-modern .msg-sender { opacity: .86; font-weight: 900; letter-spacing: .01em; }
body.fts-chat-modern .conv-item { transition: transform .16s ease, border-color .16s ease, background .16s ease; }
body.fts-chat-modern .conv-item:hover { transform: translateY(-1px); }
body.fts-chat-modern .conv-item.active { box-shadow: inset 0 0 0 1px rgba(248,231,2,.12); }
body.fts-chat-modern .chat-hdr { box-shadow: 0 12px 28px rgba(0,0,0,.12); }
body.fts-chat-modern .input-area { box-shadow: 0 -14px 28px rgba(0,0,0,.16); }
@media (max-width: 700px) {
  .msg-file-card { min-width: min(320px, 84vw); }
  body.fts-chat-modern .msg-bubble { max-width: 86vw; }
}


/* Patch UX v20 — switch contextuel Messages / Forum */
body.fts-chat-modern .discussion-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  padding: .72rem .85rem .62rem;
  background: rgba(10,10,10,.30);
  border-bottom: 1px solid rgba(255,255,255,.07);
}
body.fts-chat-modern .discussion-switch-item {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  text-decoration: none;
  color: rgba(245,242,238,.72);
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 900;
  line-height: 1;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
body.fts-chat-modern .discussion-switch-item:hover {
  transform: translateY(-1px);
  color: var(--white);
  border-color: rgba(248,231,2,.24);
  background: rgba(248,231,2,.065);
}
body.fts-chat-modern .discussion-switch-item.is-active {
  color: var(--brand-ink, #050505);
  background: linear-gradient(135deg, rgba(248,231,2,1), rgba(248,231,2,.78));
  border-color: rgba(248,231,2,.75);
  box-shadow: 0 10px 22px rgba(248,231,2,.13), inset 0 0 0 1px rgba(255,255,255,.22);
}
body.fts-chat-modern .discussion-switch-ico {
  font-size: 1rem;
  line-height: 1;
}
body.fts-chat-modern .discussion-switch-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 700px) {
  body.fts-chat-modern .discussion-switch {
    padding: .65rem .85rem .55rem;
    gap: .4rem;
  }
  body.fts-chat-modern .discussion-switch-item {
    min-height: 40px;
    font-size: .76rem;
  }
}


/* Patch UX v22 — switch visible aussi quand une discussion est ouverte sur mobile */
body.fts-chat-modern .discussion-switch-main {
  display: none;
  flex-shrink: 0;
}
@media (max-width: 700px) {
  body.fts-chat-modern .app.chat-open .discussion-switch-main {
    display: grid;
    position: relative;
    z-index: 2;
    padding-top: calc(.62rem + env(safe-area-inset-top));
    background: linear-gradient(180deg, rgba(20,20,20,.98), rgba(20,20,20,.92));
  }
  body.fts-chat-modern .app.chat-open .discussion-switch-main + .chat-hdr {
    border-top: 1px solid rgba(255,255,255,.055);
  }
}

/* Patch UX forum fichiers v24 — rendu plus lisible sans toucher à la logique upload/Firebase */
body.fts-chat-modern .msg-file-card,
body.fts-chat-modern .msg-audio-card,
body.fts-chat-modern .msg-media-wrap {
  position: relative;
  width: min(360px, 78vw);
  max-width: 100%;
  display: grid;
  gap: .62rem;
  margin-top: .28rem;
  padding: .72rem;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.11);
  background: linear-gradient(145deg, rgba(255,255,255,.072), rgba(255,255,255,.035));
  box-shadow: 0 10px 24px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.055);
  overflow: hidden;
}

body.fts-chat-modern .msg-file-card::before,
body.fts-chat-modern .msg-audio-card::before,
body.fts-chat-modern .msg-media-wrap::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: rgba(248,231,2,.52);
}

body.fts-chat-modern .msg-file-card--pdf::before { background: #ff6b6b; }
body.fts-chat-modern .msg-file-card--audio::before { background: #f8e702; }
body.fts-chat-modern .msg-file-card--video::before,
body.fts-chat-modern .msg-media-wrap--video::before { background: #8b7cff; }
body.fts-chat-modern .msg-file-card--image::before,
body.fts-chat-modern .msg-media-wrap--image::before { background: #5ee0a0; }

body.fts-chat-modern .msg-file-visible-title { display: none; }

body.fts-chat-modern .msg-file-main {
  display: flex;
  align-items: center;
  gap: .72rem;
  min-width: 0;
  padding: .62rem .66rem;
  border-radius: 14px;
  color: var(--white);
  text-decoration: none;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.065);
}

body.fts-chat-modern .msg-file-main:hover {
  border-color: rgba(248,231,2,.34);
  background: rgba(248,231,2,.08);
}

body.fts-chat-modern .msg-file-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  border-radius: 13px;
  background: rgba(248,231,2,.12);
  box-shadow: inset 0 0 0 1px rgba(248,231,2,.14);
  font-size: 1.28rem;
}

body.fts-chat-modern .msg-file-info { min-width: 0; display: grid; gap: .14rem; }

body.fts-chat-modern .msg-file-title,
body.fts-chat-modern .msg-media-title strong {
  color: var(--white);
  font-size: .88rem;
  line-height: 1.22;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.fts-chat-modern .msg-file-sub {
  color: var(--muted);
  font-size: .69rem;
  line-height: 1.2;
  font-weight: 800;
}

body.fts-chat-modern .msg-media-title {
  display: flex;
  align-items: center;
  gap: .45rem;
  min-width: 0;
  padding-left: .12rem;
}

body.fts-chat-modern .msg-media-title span { flex-shrink: 0; }

body.fts-chat-modern .msg-img,
body.fts-chat-modern .msg-video {
  width: 100%;
  max-width: 100%;
  max-height: 290px;
  object-fit: cover;
  border-radius: 13px;
  margin: 0;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.22);
}

body.fts-chat-modern .msg-audio {
  width: 100%;
  min-width: min(260px, 62vw);
}

body.fts-chat-modern .msg-file-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .46rem;
}

body.fts-chat-modern .msg-file-actions.compact { margin-top: -.05rem; }

body.fts-chat-modern .msg-file-open,
body.fts-chat-modern .msg-file-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: .43rem .72rem;
  border-radius: 999px;
  text-decoration: none;
  font-size: .72rem;
  line-height: 1;
  font-weight: 900;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

body.fts-chat-modern .msg-file-open {
  color: var(--white);
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.07);
}

body.fts-chat-modern .msg-file-download {
  color: var(--gold);
  border: 1px solid rgba(248,231,2,.38);
  background: rgba(248,231,2,.085);
}

body.fts-chat-modern .msg-file-open:hover,
body.fts-chat-modern .msg-file-download:hover {
  transform: translateY(-1px);
  border-color: var(--gold);
  background: rgba(248,231,2,.13);
}

@media (max-width: 760px){
  body.fts-chat-modern .msg-file-card,
  body.fts-chat-modern .msg-audio-card,
  body.fts-chat-modern .msg-media-wrap {
    width: min(340px, 84vw);
    padding: .66rem;
    border-radius: 15px;
  }
  body.fts-chat-modern .msg-file-main { padding: .58rem; }
  body.fts-chat-modern .msg-file-icon { width: 38px; height: 38px; border-radius: 12px; }
  body.fts-chat-modern .msg-file-title,
  body.fts-chat-modern .msg-media-title strong { font-size: .82rem; }
}


/* ================================================================
   PATCH UX CHAT/FORUM v25 — polish visuel prudent
   Aucune logique messages/forum/Cloudinary/Firebase modifiée.
   ================================================================ */

:root {
  --chat-shadow-soft: 0 14px 38px rgba(0,0,0,.30);
  --chat-shadow-lift: 0 20px 52px rgba(0,0,0,.40);
  --chat-border-soft: rgba(255,255,255,.09);
}

.conv-item,
.msg-bubble,
.forum-post,
.forum-thread,
.file-card,
.fts-file-card,
.discussion-switch,
.composer,
.chat-main,
.sidebar {
  border-color: var(--chat-border-soft);
}

.conv-item,
.msg-bubble,
.forum-post,
.forum-thread,
.file-card,
.fts-file-card {
  box-shadow: var(--chat-shadow-soft);
}

.conv-item:hover,
.forum-post:hover,
.forum-thread:hover,
.file-card:hover,
.fts-file-card:hover {
  transform: translateY(-1px);
  box-shadow: var(--chat-shadow-lift);
}

.conv-item,
.forum-post,
.forum-thread,
.file-card,
.fts-file-card,
.discussion-switch a,
.discussion-switch button,
.btn-compose,
.btn-send,
.attach-btn {
  -webkit-tap-highlight-color: transparent;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    background .18s ease,
    color .18s ease,
    opacity .18s ease;
}

.discussion-switch a:active,
.discussion-switch button:active,
.conv-item:active,
.file-card:active,
.fts-file-card:active,
.btn-compose:active,
.btn-send:active,
.attach-btn:active {
  transform: scale(.985);
}

:where(a, button, input, textarea, [role="button"], .conv-item, .file-card, .fts-file-card):focus-visible {
  outline: 2px solid rgba(248,231,2,.9);
  outline-offset: 3px;
  border-radius: 14px;
}

/* Les métadonnées restent lisibles sans voler l’attention */
.conv-last,
.conv-meta,
.msg-time,
.forum-meta,
.file-meta,
.fts-file-meta {
  color: rgba(245,242,238,.62);
}

/* Les pièces jointes ressortent comme actions utiles */
.file-card,
.fts-file-card {
  background:
    linear-gradient(135deg, rgba(248,231,2,.08), rgba(255,255,255,.035)),
    rgba(20,20,20,.92);
}

/* Meilleur confort mobile : éviter les effets hover inutiles */
@media (max-width: 720px) {
  .conv-item:hover,
  .forum-post:hover,
  .forum-thread:hover,
  .file-card:hover,
  .fts-file-card:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}



/* ================================================================
   PATCH TYPO MARQUE v32 — Messages + Forum alignés sur index
   Aucune logique JS/Firebase modifiée.
   ================================================================ */
body.fts-chat-modern .sb-title.fts-brand-title,
body.fts-chat-modern .chat-empty-title.fts-brand-title {
  font-family: "FTS Budmo", "Bebas Neue", Impact, sans-serif !important;
  font-weight: 400 !important;
  text-transform: uppercase;
  letter-spacing: .035em;
  line-height: .86 !important;
  color: var(--white);
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

body.fts-chat-modern .sb-title.fts-brand-title {
  font-size: clamp(2.25rem, 8vw, 3.1rem) !important;
}

body.fts-chat-modern .chat-empty-title.fts-brand-title {
  font-size: clamp(3.2rem, 13vw, 6rem) !important;
}

body.fts-chat-modern .sb-title.fts-brand-title span,
body.fts-chat-modern .chat-empty-title.fts-brand-title span {
  display: block;
  font-family: inherit !important;
  color: var(--red);
  line-height: .86;
  font-size: .86em;
}

body.fts-chat-modern .chat-empty-title.fts-brand-title::before {
  content: none !important;
}

@media (max-width: 720px) {
  body.fts-chat-modern .sb-title.fts-brand-title {
    font-size: clamp(2rem, 8vw, 2.75rem) !important;
  }
}


/* Correctif v33 — navigation globale visible sur PC dans Messages / Forum
   Avant : fts-chat.css masquait complètement .fts-bottom-nav dès 701px.
   Résultat : sur ordinateur, impossible de revenir facilement vers Membres / Docs / Hub messages.
   On garde le comportement mobile actuel : la nav se masque quand une conversation est ouverte. */
@media (min-width: 701px) {
  body.fts-chat-modern .fts-bottom-nav,
  body.fts-chat-modern .app.chat-open ~ .fts-bottom-nav {
    display: grid !important;
  }

  body.fts-chat-modern .fts-bottom-spacer,
  body.fts-chat-modern .app.chat-open ~ .fts-bottom-spacer {
    display: block !important;
  }

  body.fts-chat-modern .app {
    min-height: calc(100vh - 104px);
  }
}