/* FlipTalk : la messagerie de l'app et ses onglets (13/11/2026). Chargé pour tous par lbf-fliptalk.php ; code : bloc FlipTalk d'app.js.
   Le nom (en-tête de la liste) pour tous ; la barre des onglets (#ftnav) et le bouton + (#ftfab) avec #chatp.ft-on, posé dans la
   liste quand window.LBF_FT.tabs est vrai (option lbf_ft_pour). Opés : .ft-op ; Actus : .ft-card, .ft-kp, .ft-ev. */
#chatp .ft-wm{display:inline-flex;align-items:baseline;font:800 19px/1.1 var(--font,'DM Sans',sans-serif);letter-spacing:-.01em;color:#2A2521}
#chatp .ft-wm em{margin-right:1px;font-family:var(--serif,'Cormorant Garamond',Georgia,serif);font-size:1.3em;font-style:italic;font-weight:700;line-height:.9;color:#E8621A}

/* La barre des onglets, en bas (téléphone) */
#chatp .ft-nav,#chatp .ft-fab{display:none}
#chatp.ft-on .ft-nav{position:relative;z-index:3;flex:none;display:grid;grid-template-columns:repeat(4,1fr);gap:2px;padding:6px max(6px,calc((100% - 760px)/2)) calc(var(--bot,0px) + 6px);background:#fff;border-top:1px solid #E7DFD5}
#chatp.ft-on .ft-nav button{display:flex;flex-direction:column;align-items:center;gap:3px;min-height:54px;padding:4px 0 2px;border:0;background:none;color:#6E6886;font:600 12.5px/1.15 var(--font,'DM Sans',sans-serif);cursor:pointer;-webkit-tap-highlight-color:transparent}
#chatp.ft-on .ft-nav .ft-ic{position:relative;display:flex;align-items:center;justify-content:center;width:62px;height:32px;border-radius:16px;transition:background-color .18s}
#chatp.ft-on .ft-nav .ft-ic svg{width:23px;height:23px}
#chatp.ft-on .ft-nav button:hover .ft-ic{background:#F6F1EA}
#chatp.ft-on .ft-nav button.on{color:#A13D12;font-weight:800}
#chatp.ft-on .ft-nav button.on .ft-ic{background:#FFE3CF}
#chatp.ft-on .ft-nav button:focus-visible{outline:none}
#chatp.ft-on .ft-nav button:focus-visible .ft-ic{box-shadow:0 0 0 2px #E8621A}
#chatp .ft-nav .ft-b{position:absolute;top:-3px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#E8621A;color:#fff;font:800 11px/18px var(--font,'DM Sans',sans-serif);font-style:normal;text-align:center;box-shadow:0 0 0 2px #fff;box-sizing:border-box}
#chatp .ft-nav .ft-b.dot{top:1px;left:calc(50% + 9px);width:10px;min-width:10px;height:10px;padding:0}
#chatp .ft-nav .ft-b[hidden]{display:none}

/* Le bouton +, au-dessus de la barre */
#chatp.ft-on .ft-fab{position:absolute;right:max(16px,calc((100% - 760px)/2 + 16px));bottom:calc(var(--bot,0px) + 82px);z-index:4;display:flex;align-items:center;justify-content:center;width:56px;height:56px;padding:0;border:0;border-radius:18px;background:#E8621A;color:#fff;box-shadow:0 10px 24px -8px rgba(232,98,26,.7),0 2px 6px rgba(42,37,33,.18);cursor:pointer;-webkit-tap-highlight-color:transparent}
#chatp.ft-on .ft-fab svg{width:25px;height:25px}
#chatp.ft-on .ft-fab[hidden]{display:none}
#chatp.ft-on .ft-fab:active{transform:scale(.96)}
#chatp.ft-on .ft-fab:focus-visible{outline:3px solid #2A2521;outline-offset:2px}
#chatp .dmx.ft-l{padding-bottom:96px}

/* Ordinateur : les onglets en colonne, à gauche de la liste */
@media (min-width:1000px){
  #chatp.ft-on .ft-nav{position:absolute;top:calc(var(--top,0px) + 84px);left:max(12px,calc((100% - 760px)/2 - 100px));display:flex;flex-direction:column;gap:6px;width:84px;padding:0;background:none;border:0}
  #chatp.ft-on .ft-nav button{min-height:58px}
  #chatp.ft-on .ft-fab{bottom:28px}
}

/* Boutons */
#chatp .ft-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 16px;border:1px solid #E1D8CC;border-radius:999px;background:#fff;color:#3D3552;font:700 14px/1.2 var(--font,'DM Sans',sans-serif);text-decoration:none;cursor:pointer}
#chatp .ft-btn svg{width:17px;height:17px}
#chatp .ft-btn.primary{background:#E8621A;border-color:#E8621A;color:#fff;box-shadow:0 8px 18px -10px rgba(232,98,26,.9)}
#chatp .ft-btn.ghost{background:transparent;border-color:transparent;color:#6E6886}
#chatp .ft-btn:disabled{opacity:.6;cursor:default}
#chatp .cp-empty .ft-btn{margin-top:14px}
#chatp .ft-more{display:block;margin:16px auto 6px;padding:8px 16px;border:1px solid #E7DFD5;border-radius:999px;background:#fff;color:#3D3552;font:700 13px var(--font,'DM Sans',sans-serif);cursor:pointer}

/* Opés */
#chatp .ft-intro{margin:10px 16px 6px;font-size:13px;line-height:1.4;color:#857C93}
#chatp .ft-op{position:relative;display:flex;align-items:center;gap:13px;width:100%;min-height:76px;padding:10px 16px;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
#chatp .ft-op::after{content:"";position:absolute;left:81px;right:0;bottom:0;height:1px;background:#EEE7DF}
#chatp .ft-op:hover{background:#F8F4EF}
#chatp .ft-op.unr{background:#FFE7D4}
#chatp .ft-op.unr:hover{background:#FFDFC7}
#chatp .ft-op.unr::before{content:"";position:absolute;left:5px;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:#E8621A}
#chatp .ft-opc{flex:none;display:flex;align-items:center;justify-content:center;width:52px;height:52px;overflow:hidden;border-radius:14px;background:#F3EDE6;color:#8E86A0}
#chatp .ft-opc img{width:100%;height:100%;object-fit:cover}
#chatp .ft-opc svg{width:24px;height:24px}
#chatp .ft-opt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
#chatp .ft-l1{display:flex;align-items:baseline;gap:8px}
#chatp .ft-l1 b{flex:1;min-width:0;overflow:hidden;font-size:15.5px;font-weight:700;color:#2A2521;white-space:nowrap;text-overflow:ellipsis}
#chatp .ft-l1 i{flex:none;font-size:12px;font-style:normal;color:#857C93}
#chatp .ft-op.unr .ft-l1 i{font-weight:800;color:#D4561A}
#chatp .ft-l2{display:flex;align-items:center;gap:7px;min-width:0;font-size:12.5px;color:#6E6886}
#chatp .ft-l2>span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#chatp .ft-l3{overflow:hidden;font-size:13.5px;color:#857C93;white-space:nowrap;text-overflow:ellipsis}
#chatp .ft-op.unr .ft-l3{font-weight:650;color:#2B2636}
#chatp .ft-nx{display:inline-flex;align-items:center;gap:5px;max-width:100%}
#chatp .ft-nx svg{flex:none;width:14px;height:14px;color:#E8621A}
#chatp .ft-st{flex:none;padding:2px 8px;border-radius:999px;font-size:11.5px;font-style:normal;font-weight:700;line-height:1.5}
#chatp .ft-st.p-etude{background:#EEE9F7;color:#4B3F75}
#chatp .ft-st.p-achat{background:#FFE7D4;color:#A13D12}
#chatp .ft-st.p-travaux{background:#F6EBD6;color:#7A5A1E}
#chatp .ft-st.p-vente{background:#E2F3EA;color:#1F6B45}
#chatp .ft-st.p-fin{background:#EEECEF;color:#5E5A66}

/* Actus */
#chatp .ft-card{margin:10px 14px;padding:14px 16px;border:1px solid #EAE2D8;border-radius:16px;background:#fff;box-shadow:0 1px 2px rgba(42,37,33,.04)}
#chatp .ft-me{margin-top:12px;background:linear-gradient(135deg,#FFF6EE 0%,#FFFDF9 55%,#F7F3FD 100%);border-color:#F2DCC9}
#chatp .ft-meh{margin:0;font:800 15px/1.25 var(--font,'DM Sans',sans-serif);color:#2A2521}
#chatp .ft-mes{margin:4px 0 10px;font-size:13px;line-height:1.4;color:#6E6886}
#chatp .ft-kinds{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 10px}
#chatp .ft-kd{height:34px;padding:0 13px;border:1px solid #E1D8CC;border-radius:17px;background:#fff;color:#3D3552;font:700 13px var(--font,'DM Sans',sans-serif);cursor:pointer}
#chatp .ft-kd.on.k-cherche{background:#2D5BB7;border-color:#2D5BB7;color:#fff}
#chatp .ft-kd.on.k-vend{background:#C2511A;border-color:#C2511A;color:#fff}
#chatp .ft-kd.on.k-finance{background:#1F6B45;border-color:#1F6B45;color:#fff}
#chatp .ft-kd.on.k-dispo{background:#4B3F75;border-color:#4B3F75;color:#fff}
#chatp .ft-tw{position:relative}
#chatp .ft-tw textarea{display:block;box-sizing:border-box;width:100%;min-height:66px;padding:11px 12px 22px;border:1px solid #E1D8CC;border-radius:12px;background:#fff;color:#2A2521;font:15px/1.4 var(--font,'DM Sans',sans-serif);resize:none}
#chatp .ft-tw textarea:focus{outline:none;border-color:#B9A9C9;box-shadow:0 0 0 3px rgba(61,53,82,.08)}
#chatp .ft-cnt{position:absolute;right:10px;bottom:6px;font-size:11px;color:#A79FB4;pointer-events:none}
#chatp .ft-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}
#chatp .ft-me .ft-acts{justify-content:flex-end}
#chatp .ft-stb{display:flex;flex-direction:column;align-items:flex-start;gap:7px;margin-top:9px}
#chatp .ft-stt{margin:0;font-size:15px;line-height:1.42;color:#2A2521;overflow-wrap:anywhere}
#chatp .ft-stm{margin:8px 0 0;font-size:12.5px;color:#857C93}
#chatp .ft-kp{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-style:normal;font-weight:800;line-height:1.4}
#chatp .ft-kp.k-cherche{background:#E3ECFC;color:#2D5BB7}
#chatp .ft-kp.k-vend{background:#FFE7D4;color:#A13D12}
#chatp .ft-kp.k-finance{background:#E2F3EA;color:#1F6B45}
#chatp .ft-kp.k-dispo{background:#EEE9F7;color:#4B3F75}
#chatp .ft-kp.k-club{background:#3D3552;color:#F5C04A}
#chatp .ft-h{margin:24px 16px 4px;font:800 12px/1.2 var(--font,'DM Sans',sans-serif);letter-spacing:.07em;text-transform:uppercase;color:#857C93}
#chatp .ft-none{margin:8px 16px}
#chatp .ft-s .ft-sh{display:flex;align-items:center;gap:11px}
#chatp .ft-s .dm-avw{position:relative;flex:none}
#chatp .ft-s .dm-avw .av{width:42px;height:42px}
#chatp .ft-sw{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
#chatp .ft-sw b{overflow:hidden;font-size:14.5px;color:#2A2521;white-space:nowrap;text-overflow:ellipsis}
#chatp .ft-sw span{overflow:hidden;font-size:12.5px;color:#857C93;white-space:nowrap;text-overflow:ellipsis}
#chatp .ft-ago{flex:none;align-self:flex-start;font-size:12px;font-style:normal;color:#A79FB4}
#chatp .ft-s .ft-acts{margin-top:10px}
#chatp .ft-adm{font-size:12.5px;color:#A13D12}
#chatp .ft-ev{display:flex;align-items:center;gap:12px;box-sizing:border-box;width:calc(100% - 28px);margin:8px 14px;padding:12px 14px;border:1px solid #E6DDF2;border-radius:16px;background:linear-gradient(135deg,#F7F3FD 0%,#FFFDF9 100%);color:inherit;font:inherit;text-align:left;cursor:pointer}
#chatp .ft-ev:hover{border-color:#D6C9EA}
#chatp .ft-evd{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:48px;height:52px;border:1px solid #E6DDF2;border-radius:12px;background:#fff}
#chatp .ft-evd b{font:800 19px/1 var(--font,'DM Sans',sans-serif);color:#3D3552}
#chatp .ft-evd i{margin-top:2px;font-size:11.5px;font-style:normal;font-weight:800;color:#E8621A;text-transform:uppercase}
#chatp .ft-evt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
#chatp .ft-evt b{font-size:14.5px;line-height:1.25;color:#2A2521}
#chatp .ft-evt span{font-size:12.5px;color:#6E6886}
#chatp .ft-opps{margin:8px 14px}

/* La salle d'une opération : le bouton FlipBoard de l'en-tête, la carte des infos */
#chatp .ft-fbb svg{width:21px;height:21px}
#chatp .ft-gi .gi-dtx{margin:0 0 10px}

/* 13/11/2026 : un .cp-hint caché reste caché (app.css lui donne display:flex : « Aucune conversation épinglée. » restait affiché sous la liste) */
.cp-hint[hidden]{display:none}

/* 13/11/2026 (Isma, 18 h 03) : la réaction à cheval sur le bas de la bulle, comme WhatsApp ; la toucher : qui a réagi */
#chatp .dm-th .cm.has-re{margin-bottom:15px}
#chatp .dm-th .cm.has-re>.cm-b{padding-bottom:14px}
html.dm-wa #chatp .dm-th .cm.has-re .cm-b:has(>.cm-tx+.cm-t) .cm-t{bottom:14px}
#chatp .dm-th .cm-b>.cm-re{position:absolute;left:10px;bottom:-14px;z-index:2;display:inline-flex;align-items:center;gap:4px;height:26px;margin:0;padding:0 8px;border:1px solid #E9DFD3;border-radius:999px;background:#fff;box-shadow:0 1px 4px rgba(42,37,33,.16);font:600 12px/1 var(--font,inherit);color:#5F574F;white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent}
#chatp .dm-th .cm-b>.cm-re.me{border-color:#F3B48A}
#chatp .dm-th .cm-b>.cm-re .cm-rei{font-style:normal;font-size:15px;line-height:1;letter-spacing:1px}
#chatp .dm-th .cm-b>.cm-re .cm-ren{font-style:normal;font-size:12px;font-weight:700;color:#6E655C}
#chatp .dm-th .cm-b>button.cm-re:active{transform:scale(.95)}
#chatp .dm-th .cm-b>.cm-re:focus-visible{outline:2px solid #3D3552;outline-offset:2px}
.rx-f{display:flex;gap:6px;margin:12px 0 0;overflow-x:auto;scrollbar-width:none}
.rx-f::-webkit-scrollbar{display:none}
.rx-f button{flex:none;display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 12px;border:1px solid #E7DFD5;border-radius:999px;background:#fff;color:#3D3552;font:600 14px var(--font,inherit);cursor:pointer}
.rx-f button b{font-size:12.5px;font-weight:700;color:#6E655C}
.rx-f button.on{border-color:#3D3552;background:#3D3552;color:#fff}
.rx-f button.on b{color:rgba(255,255,255,.75)}
.rx-r .av{flex:none}
.rx-r .rx-n{flex:1;min-width:0}
.rx-r .rx-n b{display:block}
.rx-r[hidden]{display:none}

/* Mentions @ dans les groupes : la liste au-dessus du champ, le nom dans la bulle, la pastille @ */
#chatp .cp-comp.cm-greply{position:relative}
#chatp .ft-menl{position:absolute;left:10px;right:10px;bottom:calc(100% + 6px);z-index:30;max-height:min(46vh,320px);overflow:auto;overscroll-behavior:contain;padding:6px;border:1px solid #E7DFD5;border-radius:16px;background:#fff;box-shadow:0 12px 32px -10px rgba(42,37,33,.32)}
#chatp .ft-menh{margin:2px 8px 4px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8B8178}
#chatp .ft-meni{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;border-radius:11px;background:none;text-align:left;font:inherit;color:#2A2521;cursor:pointer;-webkit-tap-highlight-color:transparent}
#chatp .ft-meni.on,#chatp .ft-meni:hover{background:#FFF1E6}
#chatp .ft-meni .av{flex:none}
#chatp .ft-meni>span{min-width:0;display:flex;flex-direction:column}
#chatp .ft-meni b{font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#chatp .ft-meni i{font-style:normal;font-size:12px;color:#8B8178}
#chatp .cm-tx .cm-men{font-weight:700;color:#C2410C;border-radius:4px;cursor:pointer}
#chatp .cm-tx .cm-men.me{background:rgba(232,98,26,.12);padding:0 2px}
html.dm-wa #chatp .cm.mine .cm-tx .cm-men{color:#FFD2B0}
html.dm-wa #chatp .cm.mine .cm-tx .cm-men.me{background:rgba(255,255,255,.14)}
#chatp .dm-at{flex:none;display:inline-grid;place-items:center;width:22px;height:22px;margin-right:6px;border-radius:11px;background:#E8621A;color:#fff;font:800 12.5px/1 var(--font,inherit);font-style:normal;box-shadow:0 2px 6px -2px rgba(232,98,26,.6)}

/* 13/11/2026, soir. Isma (19 h 56) : « Que les message de groupes et les opé soit également dans le fil de discussion générale » ;
   (19 h 57) : « Pour les op qu'on puisse faire ajouter des membres, si par exemple on veut discuter avec un agent immobilier ».
   La salle d'une opération dans la liste : un carré (la couverture de l'opération, sinon la maison, comme dans Opés) et la
   pastille « Opé » ; les invités d'une salle (pastille « Invité », encadré de l'écran d'invitation). */
.grp-av.op{border-radius:14px;background:#F3EDE6;color:#8E86A0}
.grp-av.op>svg{width:23px;height:23px}
.grp-av.op.ph{background:#E9E3DA}
.grp-av.op.ph img{border-radius:14px}
.grp-av.op.xl{border-radius:28px}
.grp-av.op.xl>svg{width:46px;height:46px}
.grp-av.op.xl.ph img{border-radius:28px}
#chatp .cp-avb .grp-av.op,#chatp .cp-avb .grp-av.op.ph img{border-radius:12px}
#chatp .dm-opt{display:inline-block;margin-right:6px;padding:0 7px;border-radius:999px;background:#FFE7D4;color:#A13D12;font-size:11px;font-style:normal;font-weight:700;line-height:1.6;vertical-align:1px}
#chatp .dm-it.unr .dm-opt{background:#FFD9BD}
#chatp .ft-st.p-inv,.grp-adm.grp-inv{background:#EEE9F7;color:#4B3F75}
#chatp .ft-invh{margin:12px 16px 6px;padding:11px 14px;border:1px solid #E7DFD5;border-radius:12px;background:#fff;font-size:13.5px;line-height:1.45;color:#4D4360}
#chatp .ft-invn{margin:16px 16px 4px}
#chatp .ft-gi .gi-link+.gi-link{border-top:1px solid #F0EAE2}

/* 13/11/2026, soir : le fond des conversations. Isma (18 h 20) : « en arrière-plan peut-être mettre des petits motifs très léger du
   logo Le bon flip.. ? Ou alors d'un logo flip talk ? » ; QCM : « les deux avec les logos des autres app ? », « Un peu plus
   marqué ». fliptalk-fond.svg : une tuile de 380 px (la maison du logo, la bulle de FlipTalk, les carreaux et les pictogrammes
   des applis), dans un seul ton, sous les messages privés et les groupes ; elle ne défile pas avec les messages.
   Retirer : ces deux règles. */
#chatp .cp-body:has(>.dm-th){background-image:url(/wp-content/uploads/lbf-app/fliptalk-fond.svg?v=20261113);background-repeat:repeat;background-position:0 0;background-size:380px 380px}
html.dm-wa #chatp .cp-body.cp-body:has(>.dm-th){background-image:url(/wp-content/uploads/lbf-app/fliptalk-fond.svg?v=20261113);background-repeat:repeat;background-position:0 0;background-size:380px 380px}

/* 13/11/2026, 23 h 45 : « Flip » des logotypes FlipTalk et FlipThink toujours en Cormorant italique, comme les logos des outils
   (avec l'habillage Club, --serif vaut Gloock, qui n'a pas d'italique : le mot restait droit). */
#chatp .ft-wm em{font-family:'Cormorant Garamond',Georgia,serif}
