/* Bob, l'agent — la carte des demandes entrantes (cotes Claude Design, 10/09/2026) :
   360 de large, right 24, bottom 92 (bulle 56 + marge 24 + écart 12), rayon 18,
   ombre 0 22px 50px -18px, liseré haut 3 px ambre, en-tête 55 (avatar 34),
   corps 14 16 0, société 18/680, contact 12,5, numéro 15/650 tabulaire, besoin 13
   italique sur filet ambre (3 lignes max), pied 12 16 16, boutons 42, flex 1,55 / 1. */
.x4-bob { position: fixed; right: 24px; bottom: 92px; z-index: 95; width: 360px; max-width: calc(100vw - 48px); box-sizing: border-box; border-radius: var(--r-md, 18px); border: 1px solid var(--stroke, rgba(20, 20, 25, .075)); border-top: 3px solid var(--accent-bright, #f5d547); background: var(--panel-solid, #fff); box-shadow: 0 22px 50px -18px rgba(0, 0, 0, .32); color: var(--v2-text, #16171a); font-family: var(--font, 'Manrope', -apple-system, system-ui, sans-serif); letter-spacing: -.01em; line-height: 1.3; animation: x4-bob-in .18s ease-out; }
.x4-bob.est-pile::before { content: ''; position: absolute; left: 8px; right: 8px; top: -8px; height: 24px; z-index: -1; border-radius: var(--r-md, 18px) var(--r-md, 18px) 0 0; background: var(--panel-solid, #fff); border: 1px solid var(--stroke, rgba(20, 20, 25, .075)); border-top: 3px solid var(--accent-bright, #f5d547); opacity: .96; }
@keyframes x4-bob-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.x4-bob-tete { display: flex; align-items: center; gap: 10px; height: 55px; padding: 0 12px 0 16px; box-sizing: border-box; border-bottom: 1px solid var(--stroke-2, rgba(20, 20, 25, .05)); }
.x4-bob-av { flex: none; width: 34px; height: 34px; border-radius: 99px; overflow: hidden; }
.x4-bob-av svg { display: block; width: 100%; height: 100%; }
.x4-bob-t { display: flex; flex-direction: column; font-size: 12.5px; color: var(--v2-text-2, #55595f); }
.x4-bob-t b { font-size: 12px; font-weight: 640; letter-spacing: .05em; text-transform: uppercase; color: var(--v2-text-3, #6b6f76); }
.x4-bob-x { margin-left: auto; width: 28px; height: 28px; border: 0; border-radius: 99px; background: transparent; font: inherit; font-size: 18px; line-height: 1; color: var(--v2-text-3, #6b6f76); cursor: pointer; }
.x4-bob-x:hover { background: var(--inset, rgba(0, 0, 0, .035)); color: var(--v2-text, #16171a); }
.x4-bob-corps { padding: 14px 16px 0; display: flex; flex-direction: column; gap: 4px; }
.x4-bob-soc { font-size: 18px; font-weight: 680; letter-spacing: -.015em; line-height: 1.15; }
.x4-bob-qui { font-size: 12.5px; color: var(--v2-text-2, #55595f); }
.x4-bob-mail { font-size: 12.5px; color: var(--info-fg, #3160b4); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.x4-bob-tel { display: inline-block; text-decoration: none; font-size: 15px; font-weight: 640; font-variant-numeric: tabular-nums; color: var(--v2-text, #16171a); }
.x4-bob-besoin { margin-top: 6px; padding: 2px 0 2px 10px; border-left: 3px solid var(--accent-bright, #f5d547); font-size: 13px; font-style: italic; line-height: 1.35; color: var(--v2-text, #16171a); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.x4-bob-besoin.est-vide { color: var(--v2-text-3, #6b6f76); }
.x4-bob-depuis { margin-top: 8px; display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--v2-text-3, #6b6f76); }
.x4-bob-pastille { display: inline-block; padding: 2px 9px; border-radius: 99px; background: var(--inset, rgba(0, 0, 0, .035)); color: var(--v2-text-2, #55595f); font-weight: 620; }
.x4-bob-pastille[data-ton="warn"] { background: var(--accent-soft, rgba(245, 213, 71, .26)); color: var(--v2-accent, #7d640d); }
.x4-bob-pastille[data-ton="neg"] { background: var(--neg-soft, rgba(193, 75, 64, .11)); color: var(--neg-fg, #a74137); }
.x4-bob-autres { margin-left: auto; font-weight: 620; }
.x4-bob-actes { display: flex; gap: 8px; padding: 12px 16px 16px; }
.x4-bob-btn { flex: 1; height: 42px; padding: 0 12px; border-radius: 99px; border: 1px solid var(--stroke, rgba(20, 20, 25, .075)); background: var(--panel-solid, #fff); font: inherit; font-size: 12.5px; font-weight: 620; color: var(--v2-text-2, #55595f); cursor: pointer; white-space: nowrap; }
.x4-bob-btn.est-plein { flex: 1.55; border-color: transparent; background: var(--accent-bright, #f5d547); color: #16171a; font-weight: 640; font-size: 13.5px; }
.x4-bob-btn:hover { filter: brightness(.97); }

/* Déjà connu (11/09/2026) */
.x4-bob-connu { display: inline-block; align-self: flex-start; margin-top: 2px; padding: 2px 9px; border-radius: 99px; background: var(--info-soft, rgba(49, 96, 180, .1)); color: var(--info-fg, #3160b4); font-size: 11px; font-weight: 640; }
.x4-bob-connu.est-client { background: var(--pos-soft, rgba(21, 115, 71, .12)); color: var(--pos-fg, #136d45); }
.x4-bob-connu i { font-style: normal; font-weight: 400; opacity: .85; }
/* La carte « liste » : retards, résumé du matin, réponses d'invités. */
.x4-bob-sous { font-size: 12.5px; color: var(--v2-text-2, #55595f); margin-bottom: 4px; }
.x4-bob-lignes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.x4-bob-lignes li { display: flex; flex-direction: column; gap: 1px; padding: 7px 0 7px 10px; border-left: 3px solid var(--stroke, rgba(20, 20, 25, .075)); border-bottom: 1px solid var(--stroke-2, rgba(20, 20, 25, .05)); font-size: 13px; }
.x4-bob-lignes li:last-child { border-bottom: 0; }
.x4-bob-lignes li b { font-weight: 640; color: var(--v2-text, #16171a); }
.x4-bob-lignes li span { font-size: 12px; color: var(--v2-text-3, #6b6f76); }
.x4-bob-lignes li[data-ton="neg"] { border-left-color: var(--neg-fg, #b3261e); }
.x4-bob-lignes li[data-ton="neg"] span { color: var(--neg-fg, #b3261e); }
.x4-bob-lignes li[data-ton="warn"] { border-left-color: var(--x4-warn-fg, #b45309); }
.x4-bob-lignes li[data-ton="pos"] { border-left-color: var(--pos-fg, #136d45); }
