/* ════════════════════════════════════════════════════════════════════════════
   QUOI DE NEUF — pop-up quotidien + fil d'actualité
   Concept valide par Arthur le 30/08 (CONCEPTS-QUOI-DE-NEUF-2026-08.html).
   Classes qdn-* (pop-up) et fil-* (panneau) reprises telles quelles du concept
   pour que ce qui est construit corresponde exactement a ce qui a ete valide.
   ════════════════════════════════════════════════════════════════════════════ */

.fil-btn-wrap{position:relative}
.fil-dot{position:absolute;top:-7px;right:-9px;min-width:17px;height:17px;padding:0 4px;box-sizing:border-box;border-radius:9px;background:var(--danger);border:2px solid var(--topbar-bg);display:flex;align-items:center;justify-content:center;color:#fff;font-size:9.5px;font-weight:700;line-height:1}
.fil-dot.hidden{display:none}

/* ── Pop-up « Quoi de neuf ? » ── */
.qdn-backdrop{position:fixed;top:62px;left:0;right:0;bottom:0;background:rgba(26,22,17,.4);backdrop-filter:blur(2px);z-index:160;display:none;align-items:flex-start;justify-content:center;padding:36px 20px}
.qdn-backdrop.open{display:flex}
.qdn-modal{background:var(--cp);border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.35);width:min(620px,94vw);max-height:calc(100vh - 130px);display:flex;flex-direction:column;overflow:hidden;border:0.5px solid var(--border)}
.qdn-head{padding:18px 22px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;background:var(--gold-bg)}
.qdn-head-l{display:flex;align-items:center;gap:10px}
.qdn-head-l i{font-size:20px;color:var(--gold-text)}
.qdn-title{font-size:16px;font-weight:600;color:var(--text)}
.qdn-date{font-size:11px;color:var(--text2);margin-top:2px}
.qdn-close{background:none;border:none;cursor:pointer;color:var(--text2);font-size:18px;padding:4px;line-height:1}
.qdn-body{flex:1;overflow-y:auto;padding:6px 22px 18px}
.qdn-sec{margin-top:18px}
.qdn-sec-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.qdn-sec-head i{font-size:15px;color:var(--gold-text)}
.qdn-sec-title{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text)}
.qdn-recap-row{display:flex;gap:10px;flex-wrap:wrap}
.qdn-recap-chip{background:var(--bg2);border:0.5px solid var(--border);border-radius:10px;padding:7px 12px;font-size:12.5px;display:flex;align-items:center;gap:6px;color:var(--text)}
.qdn-recap-chip b{font-weight:700}
.qdn-recap-sub-label{font-size:10.5px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.03em;margin:10px 0 6px}
.qdn-recap-chip.sub{background:transparent;border-style:dashed;padding:5px 10px;font-size:12px;color:var(--text2)}
.qdn-link{font-size:11.5px;color:var(--gold-text);text-decoration:none;margin-top:8px;display:inline-block;cursor:pointer}
.qdn-link:hover{text-decoration:underline}
.qdn-groupes{margin-top:12px;background:var(--bg2);border:0.5px solid var(--border);border-radius:10px;padding:9px 12px}
.qdn-groupes-label{font-size:11px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.03em;display:flex;align-items:center;gap:6px;margin-bottom:6px}
.qdn-groupe-row{font-size:12.5px;color:var(--text);padding:3px 0;display:flex;align-items:center;gap:8px}
.qdn-groupe-row.muted{color:var(--text3);font-style:italic}
.qdn-groupe-tag{font-size:10px;font-weight:700;padding:2px 8px;border-radius:8px;flex-shrink:0}
.qdn-groupe-tag.present{background:var(--gold-bg);color:var(--gold-text)}
.qdn-groupe-tag.arr{background:var(--success-bg);color:var(--success)}
.qdn-groupe-tag.dep{background:var(--danger-bg);color:var(--danger)}
.qdn-item{background:var(--bg2);border:0.5px solid var(--border);border-radius:12px;padding:10px 13px;margin-bottom:8px}
.qdn-item-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.qdn-item-tag{font-size:10px;background:var(--gold-bg);color:var(--gold-text);border-radius:6px;padding:1px 7px;font-weight:600}
.qdn-item-time{font-size:10.5px;color:var(--text3)}
.qdn-item-txt{font-size:12.5px;line-height:1.55;color:var(--text)}
.qdn-item-txt.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Mise en forme du texte libre (07/09) : titres ## , listes - / bullet, paragraphes
   separes par une ligne vide. Meme echelle typographique que .qdn-item-txt pour
   rester coherent dans la meme carte. */
.qdn-item-txt .qdn-txt-h{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text);margin:10px 0 4px}
.qdn-item-txt .qdn-txt-h:first-child{margin-top:0}
.qdn-item-txt .qdn-txt-p{margin:0 0 8px;font-size:12.5px;line-height:1.55;color:var(--text)}
.qdn-item-txt .qdn-txt-p:last-child{margin-bottom:0}
.qdn-item-txt .qdn-txt-liste{margin:0 0 8px;padding-left:18px;font-size:12.5px;line-height:1.55;color:var(--text)}
.qdn-item-txt .qdn-txt-liste:last-child{margin-bottom:0}
.qdn-item-txt .qdn-txt-liste li{margin:2px 0}
.qdn-more{font-size:11px;color:var(--gold-text);cursor:pointer;margin-top:4px;display:inline-block}
.qdn-empty{font-size:12px;color:var(--text3);font-style:italic;padding:6px 0}
.qdn-foot{border-top:1px solid var(--border);padding:13px 22px;display:flex;gap:10px;justify-content:flex-end;flex-shrink:0;background:var(--bg2)}
.qdn-btn{padding:9px 16px;border-radius:10px;font-size:12.5px;font-weight:600;cursor:pointer;border:0.5px solid var(--border);background:var(--cp);color:var(--text);font-family:inherit}
.qdn-btn.pri{background:var(--text);color:#fff;border:none}
.qdn-btn.pri:hover{opacity:.88}

/* ── Panneau « Fil d'actualité » (droite, plein hauteur sous l'en-tete) ── */
.fil-panel{position:fixed;top:62px;right:0;bottom:0;width:min(430px,94vw);background:var(--cp);border-left:0.5px solid var(--border);box-shadow:-8px 0 30px rgba(0,0,0,.12);z-index:150;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .22s ease}
.fil-panel.open{transform:translateX(0)}
.fil-tabs{display:flex;border-bottom:1px solid var(--border);flex-shrink:0}
.fil-tab{flex:1;padding:13px 10px;text-align:center;font-size:12.5px;font-weight:600;color:var(--text2);cursor:pointer;border-bottom:2px solid transparent;position:relative;background:none;border-left:none;border-right:none;border-top:none;font-family:inherit}
.fil-tab.active{color:var(--gold-text);border-bottom-color:var(--gold)}
.fil-tab .b{background:var(--danger);color:#fff;font-size:9.5px;font-weight:700;border-radius:8px;padding:1px 5px;margin-left:5px}
.fil-view{flex:1;overflow:hidden;display:flex;flex-direction:column;min-height:0}
.fil-view.hidden{display:none}
.fil-actu-head{padding:10px 16px;display:flex;justify-content:space-between;align-items:center;border-bottom:0.5px solid var(--border);flex-shrink:0}
.fil-actu-head .lu{font-size:11px;color:var(--gold-text);cursor:pointer}
.fil-filters{display:flex;gap:6px;padding:8px 16px;flex-wrap:wrap;border-bottom:0.5px solid var(--border);flex-shrink:0}
.fil-chip{font-size:10.5px;padding:4px 10px;border-radius:20px;background:var(--bg2);color:var(--text2);cursor:pointer;border:0.5px solid var(--border);font-family:inherit}
.fil-chip.active{background:var(--text);color:#fff;border-color:var(--text)}
.fil-list{flex:1;overflow-y:auto;padding:10px 14px 16px;display:flex;flex-direction:column;gap:8px}
.fil-item{background:var(--bg2);border:0.5px solid var(--border);border-radius:12px;padding:10px 30px 10px 12px;position:relative}
.fil-item.unread{border-left:3px solid var(--gold)}
.fil-item-del{position:absolute;top:8px;right:8px;background:none;border:none;cursor:pointer;color:var(--text3);font-size:12px;padding:3px;line-height:1;border-radius:5px}
.fil-item-del:hover{background:var(--border);color:var(--text)}
.fil-item-top{display:flex;align-items:center;gap:7px;margin-bottom:4px}
.fil-item-ico{width:22px;height:22px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;color:#fff}
.ic-recap{background:#2a5a7a}.ic-info{background:#ef9f27}.ic-maj{background:var(--gold)}.ic-mention{background:#6a4a8a}.ic-groupe{background:#1d9e75}
.fil-item-cat{font-size:10.5px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.03em;flex:1}
.fil-item-time{font-size:10px;color:var(--text3)}
.fil-item-txt{font-size:12.5px;line-height:1.5;color:var(--text)}
.fil-item-txt.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fil-item-more{font-size:11px;color:var(--gold-text);cursor:pointer;margin-top:3px;display:inline-block}
.fil-revoir{margin:0 14px 12px;padding:9px;text-align:center;font-size:12px;color:var(--gold-text);background:var(--gold-bg);border-radius:10px;cursor:pointer;flex-shrink:0}
.fil-empty{padding:30px 20px;text-align:center;color:var(--text3);font-size:12.5px;font-style:italic}

/* Onglet Messages (reutilise .postit-* deja existant pour « Equipe ») */
.msg-subtabs{display:flex;gap:6px;padding:9px 14px;border-bottom:0.5px solid var(--border);flex-shrink:0}
.msg-subtab{flex:1;text-align:center;padding:7px;font-size:11.5px;font-weight:600;border-radius:9px;cursor:pointer;color:var(--text2);background:var(--bg2);border:none;font-family:inherit}
.msg-subtab.active{background:var(--text);color:#fff}
.msg-sub-view{flex:1;overflow:hidden;display:flex;flex-direction:column;min-height:0}
.msg-sub-view.hidden{display:none}
.msg-scope-note{font-size:10.5px;color:var(--text3);padding:6px 16px;font-style:italic;flex-shrink:0}
.equipe-wrap{flex:1;display:flex;flex-direction:column;min-height:0;background:transparent}
.equipe-wrap .postit-messages{background:transparent}
.equipe-wrap .postit-form{border-top:0.5px solid var(--border)}

@media screen and (max-width: 640px) {
  .fil-panel{width:100vw}
  .qdn-backdrop{padding:0;top:58px}
  .qdn-modal{width:100%;max-height:calc(100vh - 58px);border-radius:0}
}

/* ── Conversations (1:1, reprises telles quelles du concept valide) ── */
.conv-list{flex:1;overflow-y:auto;padding:6px 10px}
.conv-list.hidden{display:none}
.conv-row{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:10px;cursor:pointer}
.conv-row:hover{background:var(--bg2)}
.conv-av{width:34px;height:34px;border-radius:50%;background:var(--gold);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.conv-mid{flex:1;min-width:0}
/* Couleur personnalisee par contact (14/09) : pastille + palette repliable */
.conv-av-wrap{position:relative;flex-shrink:0}
.cc-dot-btn{position:absolute;bottom:-2px;right:-2px;width:15px;height:15px;border-radius:50%;background:var(--surface,#fff);border:1px solid var(--border);color:var(--text3);font-size:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.cc-dot-btn:hover{color:var(--text)}
.cc-pop{position:absolute;top:40px;left:0;z-index:20;background:var(--surface,#fff);border:0.5px solid var(--border);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.15);padding:8px;display:flex;flex-wrap:wrap;gap:6px;width:116px}
.cc-swatch{width:22px;height:22px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}
.cc-swatch:hover{border-color:var(--text3)}
.cc-reset{width:22px;height:22px;border-radius:50%;background:var(--bg);border:0.5px solid var(--border);color:var(--text3);font-size:11px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.cc-reset:hover{color:var(--text)}
.conv-name{font-size:12.5px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px}
.conv-prev{font-size:11.5px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:230px}
.conv-time{font-size:10px;color:var(--text3)}
.conv-dot{width:8px;height:8px;border-radius:50%;background:var(--gold);flex-shrink:0}
.conv-thread{flex:1;display:flex;flex-direction:column;min-height:0}
.conv-thread.hidden{display:none}
.conv-thread-head{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:0.5px solid var(--border);flex-shrink:0}
.conv-back{background:none;border:none;cursor:pointer;color:var(--text2);font-size:16px;display:flex}
.conv-thread-name{font-size:13px;font-weight:600;color:var(--text)}
.conv-thread-msgs{flex:1;overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.bulle{max-width:78%;padding:8px 12px;border-radius:14px;font-size:12.5px;line-height:1.45}
.bulle.moi{align-self:flex-end;background:var(--text);color:#fff;border-bottom-right-radius:4px}
.bulle.eux{align-self:flex-start;background:var(--bg2);color:var(--text);border:0.5px solid var(--border);border-bottom-left-radius:4px}
.bulle-time{font-size:9.5px;opacity:.6;margin-top:3px;text-align:right}
.conv-reply{padding:10px 14px;border-top:0.5px solid var(--border);display:flex;gap:8px;flex-shrink:0}
.conv-reply input{flex:1;border:0.5px solid var(--border);border-radius:20px;padding:8px 13px;font-size:12.5px;font-family:inherit;background:var(--bg2);color:var(--text);outline:none}
.conv-reply button{background:var(--text);color:#fff;border:none;border-radius:50%;width:34px;height:34px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}

/* ── Conversations : liste active + nouveau message + avatars colores ── */
.conv-header-row{display:flex;align-items:center;gap:10px;padding:9px 14px 6px;flex-shrink:0}
.conv-new-btn{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:#fff;background:var(--text);border:none;border-radius:20px;padding:6px 12px;cursor:pointer;white-space:nowrap;font-family:inherit}
.conv-new-btn:hover{opacity:.88}
.conv-picker-toggle{margin:0 14px 8px;padding:8px 12px;border-radius:10px;background:var(--gold-bg);color:var(--gold-text);font-size:11.5px;font-weight:600;display:flex;align-items:center;gap:6px;cursor:pointer}
.conv-picker-toggle-switch{margin-left:auto;font-size:10px;font-weight:700;text-decoration:underline}
.conv-mode-pill{margin-left:auto;font-size:10px;font-weight:600;color:var(--text2);background:var(--bg2);border:0.5px solid var(--border);border-radius:20px;padding:3px 9px;display:flex;align-items:center;gap:4px;cursor:pointer;flex-shrink:0}
.conv-mode-pill:hover{background:var(--border)}
.bulle-row{display:flex;align-items:flex-end;gap:7px}
.bulle-row.moi{justify-content:flex-end}
.bulle-av{width:22px;height:22px;border-radius:50%;color:#fff;font-size:9.5px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}

/* ── Onglet Back-office (remplace l'ancienne bulle Direction) ── */
.msg-subtabs .msg-subtab{flex:1 1 0;min-width:0}