/* ── REPRISE (IA + humain) ── bloo-header ──
 * FICHIER : assets/css/card-hero.css
 * ROLE : carte publique (rel2997, décisions de Gilles du 12/10/2026, maquette validée) : hero à 3 lignes (repères 1, 2, 3 de
 *        l'aperçu du back-office), pastille de DISPONIBILITÉ du titulaire sur la photo et sa bulle (sans fenêtre modale), tuile
 *        « Mon Wallet » discrète (identité connectée du VISITEUR) et sa fenêtre, écart réduit entre les lignes de boutons.
 * ENTREES/SORTIES : feuille chargée par _card-head.php après card-redesign.css (?v = date du fichier) ; classes posées par
 *                   _card-body.php (#bcPresence, #bcPresenceBubble, .bc-hero-n, #blooWalletLed.bc-wallet) et
 *                   _card-js-core.php (fenêtre #blooWalletModal .bc-wlm).
 * DEPEND : variables de la carte (--card-accent, --card-bg, --card-text-sec) ; icônes bli (assets/icons/bloo-icons.css).
 * APPELE PAR : _card-head.php.
 * REPRISE :
 *   - Les mises en page imposent des couleurs avec des sélecteurs à identifiant et !important (ex. card-redesign.css :
 *     « body:not(#bloo-nx)[data-layout] .card-wrap .card-inner #blooWalletLed * ») : les règles d'ici portent un
 *     identifiant ET « html body:not(#bloo-nx) » pour l'emporter là où il le faut (icônes blanches de la pastille).
 *   - .bli-calendar-clock et .bli-calendar-off : absentes du jeu local (assets/icons/bloo-icons.css, généré par le kit) ;
 *     même format (--bli : masque SVG), tracés exacts de lucide-static 1.53.0 (_lucide_kit/vendor). À retirer d'ici le jour
 *     où le kit les inclut.
 *   - La pastille est placée en JavaScript (point à 45° du cadre de l'avatar, rond ou carré arrondi) : invisible tant
 *     qu'elle n'est pas placée (data-placed), jamais au mauvais endroit.
 * MAJ : 2026-10-12 · rel2997 · création
 *       2026-10-12 · rel2999 · Bento : slogan (ligne 3 du hero) affiché, il était masqué par layouts/bento.css
 *       2026-10-12 · rel3000 · tuile « Mon Wallet » : cachée hors session Wallet ([hidden]), point de disponibilité de l'utilisateur (.bc-wl-pr) ;
 *         Bento en pages (.modules-page.bento-mosaic : tuiles étirées, trous comblés)
 *       2026-10-13 · rel3005 · L6 Visio Call : .bli-webcam (tracé exact lucide-static 1.53.0 webcam.svg) pour la tuile « Appel Visio »
 *       2026-10-15 · fenêtre « Mon Wallet » : initiales centrées dans l'avatar, fond blanc derrière une photo / un logo
 * ── fin REPRISE ── */
.bli-calendar-clock{--bli:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 14v2.2l1.6 1' /%3E%3Cpath d='M16 2v3' /%3E%3Cpath d='M21 7.338V5a2 2 0 00-2-2H5a2 2 0 00-2 2v14a2 2 0 002 2h2.338' /%3E%3Cpath d='M3 9h5.859' /%3E%3Cpath d='M8 2v3' /%3E%3Ccircle cx='16' cy='16' r='6' /%3E%3C/svg%3E")}
.bli-calendar-off{--bli:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 2v3' /%3E%3Cpath d='m2 2 20 20' /%3E%3Cpath d='M21 9h-5.5' /%3E%3Cpath d='M3 9h6' /%3E%3Cpath d='M3.586 3.586A2 2 0 003 5v14a2 2 0 002 2h14a2 2 0 001.414-.586' /%3E%3Cpath d='M8.656 3H19a2 2 0 012 2v10.344' /%3E%3C/svg%3E")}
.bli-webcam{--bli:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='10' r='8' /%3E%3Ccircle cx='12' cy='10' r='3' /%3E%3Cpath d='M7 22h10' /%3E%3Cpath d='M12 22v-4' /%3E%3C/svg%3E")}

/* Repères 1, 2, 3 du hero : aperçu du back-office seulement (?wip=1&hero_marks=1) */
html body:not(#bloo-nx) .card-identity .bc-hero-n{display:inline-flex;align-items:center;justify-content:center;width:1.45em;height:1.45em;min-width:16px;min-height:16px;margin-left:.4em;border-radius:50%;background:#111 !important;color:#fff !important;-webkit-text-fill-color:#fff;font:700 10px/1 Inter,system-ui,sans-serif !important;font-style:normal !important;letter-spacing:0 !important;text-transform:none !important;vertical-align:middle;text-shadow:none !important}

/* Bento masquait le slogan (layouts/bento.css : .card-tagline{display:none}) : hero à 3 lignes partout (règle de Gilles du 12/10/2026) */
html body:not(#bloo-nx)[data-layout="bento"] .card-identity .card-tagline{display:block !important;font-size:12px !important;line-height:1.45;max-width:34ch;margin:4px auto 0 !important}

/* [rel3000] Bento en pages : chaque page est une mosaïque (4 colonnes, 4 rangées au plus, _card-body.php) dans la piste du carrousel ;
   les tuiles remplissent leur case (les pages génériques centrent leurs boutons), les trous laissés par une tuile large sont comblés */
html body:not(#bloo-nx)[data-layout="bento"] .card-wrap .card-inner .modules-page.bento-mosaic{justify-items:stretch !important;grid-auto-flow:row dense !important;width:100% !important;min-width:100% !important;box-sizing:border-box}

/* Pastille de disponibilité du titulaire */
.card-avatar-wrap{position:relative}
html body:not(#bloo-nx) #bcPresence{position:absolute;z-index:30;width:var(--bc-pr-sz,28px);height:var(--bc-pr-sz,28px);padding:0 !important;margin:0 !important;border-radius:50% !important;border:3px solid var(--card-bg,#fff) !important;background:var(--bc-pr,#16a34a) !important;display:flex;align-items:center;justify-content:center;box-sizing:border-box;box-shadow:0 2px 6px rgba(0,0,0,.18);cursor:pointer;-webkit-appearance:none;appearance:none;visibility:hidden;line-height:0;min-width:0 !important;min-height:0 !important;transform:none !important}
html body:not(#bloo-nx) #bcPresence[data-placed]{visibility:visible}
html body:not(#bloo-nx) #bcPresence .bli{color:#fff !important;font-size:calc(var(--bc-pr-sz,28px) * .5);--bli-w:1em;width:1em}
html body:not(#bloo-nx) #bcPresence:focus-visible{outline:2px solid var(--card-accent,#6366f1);outline-offset:2px}
html body:not(#bloo-nx) #bcPresenceBubble{position:absolute;z-index:40;display:flex;align-items:center;gap:8px;width:max-content;max-width:min(290px,84vw);box-sizing:border-box;padding:6px 12px 6px 6px;border-radius:14px;background:#fff !important;box-shadow:0 6px 22px rgba(0,0,0,.18),0 0 0 1px rgba(0,0,0,.05);text-align:left;font-family:Inter,system-ui,sans-serif}
html body:not(#bloo-nx) #bcPresenceBubble[hidden]{display:none}
html body:not(#bloo-nx) #bcPresenceBubble::before{content:'';position:absolute;top:-6px;left:var(--bc-pr-ar,50%);width:12px;height:12px;background:#fff;transform:translateX(-50%) rotate(45deg);box-shadow:-1px -1px 0 rgba(0,0,0,.05)}
html body:not(#bloo-nx) #bcPresenceBubble .bc-pr-dot{position:relative;width:22px;height:22px;border-radius:50%;background:var(--bc-pr,#16a34a) !important;display:flex;align-items:center;justify-content:center;flex:none}
html body:not(#bloo-nx) #bcPresenceBubble .bc-pr-dot .bli{color:#fff !important;font-size:12px;--bli-w:1em;width:1em}
html body:not(#bloo-nx) #bcPresenceBubble .bc-pr-txt{display:flex;flex-direction:column;gap:1px;min-width:0}
html body:not(#bloo-nx) #bcPresenceBubble .bc-pr-txt b{font:600 12.5px/1.3 Inter,system-ui,sans-serif !important;color:var(--bc-pr-ink,#166534) !important}
html body:not(#bloo-nx) #bcPresenceBubble .bc-pr-txt small{font:400 11.5px/1.35 Inter,system-ui,sans-serif !important;color:#4b5563 !important}

/* Écart entre les lignes de boutons (demande de Gilles du 12/10/2026 : 3 lignes toujours entières) */
html body:not(#bloo-nx)[data-layout] .card-wrap .card-inner .modules-page.modules-page{row-gap:clamp(3px,.9vh,8px) !important}

/* Tuile « Mon Wallet » : identité connectée du visiteur, discrète */
html body:not(#bloo-nx) #blooWalletLed.bc-wallet{display:flex !important;align-items:center;gap:10px !important;width:calc(100% - clamp(40px,12vw,64px)) !important;max-width:420px;margin:8px auto 0 !important;padding:4px 8px 4px 5px !important;border:1px dashed color-mix(in srgb,var(--card-accent,#7c5cfc) 45%,transparent) !important;border-radius:14px !important;background:transparent !important;min-height:38px;box-sizing:border-box;text-align:left;cursor:pointer}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-av{position:relative;width:26px;height:26px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--card-accent,#7c5cfc) 80%,transparent)}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-av img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-ini{color:#fff !important;font:700 9.5px/1 Inter,system-ui,sans-serif !important;letter-spacing:0}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet[hidden]{display:none !important}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-pr{position:absolute;right:-3px;bottom:-3px;width:11px;height:11px;border-radius:50%;border:2px solid var(--card-bg,#fff);box-sizing:content-box}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-pr[hidden]{display:none}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-tt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;opacity:.88}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-cap{font:600 8.5px/1.2 Inter,system-ui,sans-serif !important;letter-spacing:.08em;text-transform:uppercase;opacity:.6}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-nm{font:600 11.5px/1.25 Inter,system-ui,sans-serif !important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-sub{font-weight:400;font-size:11px;opacity:.75}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-act{display:inline-flex;align-items:center;gap:4px;flex:none;padding:4px 2px;font:600 10.5px/1 Inter,system-ui,sans-serif !important;opacity:.75}
html body:not(#bloo-nx) #blooWalletLed.bc-wallet .bc-wl-act .bli{font-size:12px;--bli-w:1em;width:1em}

/* Fenêtre « Mon Wallet » */
#blooWalletModal .bc-wlm{max-height:88vh;overflow:auto}
#blooWalletModal .bc-wlm-h{display:flex;align-items:center;gap:12px;margin-bottom:6px}
#blooWalletModal .bc-wlm-i{width:42px;height:42px;border-radius:14px;background:var(--card-accent-sheet,#7c5cfc);display:flex;align-items:center;justify-content:center;flex:none;color:#fff}
#blooWalletModal .bc-wlm-i .bli{font-size:22px;color:#fff}
#blooWalletModal .bc-wlm-ht{min-width:0}
#blooWalletModal .bc-wlm-h h3{margin:0;font:800 18px/1.2 Inter,system-ui,sans-serif;color:#17181c}
#blooWalletModal .bc-wlm-pr{font-weight:700}
#blooWalletModal .bc-wlm-h p{margin:2px 0 0;font:500 12.5px/1.35 Inter,system-ui,sans-serif;color:#6b7280}
#blooWalletModal .bc-wlm-x{margin-left:auto;align-self:flex-start;width:34px;height:34px;border-radius:50%;border:0;background:#f1f2f5;color:#17181c;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none}
#blooWalletModal .bc-wlm-l{margin:14px 0 2px;font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:#6b7280}
#blooWalletModal .bc-wlm-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:1.5px solid #e6e8ec;border-radius:16px;padding:11px 12px;margin-top:8px;background:#fff;color:#17181c;cursor:pointer;font-family:inherit}
#blooWalletModal .bc-wlm-row.on{border-color:var(--card-accent-sheet,#7c5cfc);background:color-mix(in srgb,var(--card-accent-sheet,#7c5cfc) 7%,#fff)}
#blooWalletModal .bc-wlm-av{width:40px;height:40px;border-radius:50%;flex:none;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#eceef2}
#blooWalletModal .bc-wlm-row.on .bc-wlm-av{background:var(--card-accent-sheet,#7c5cfc)}
#blooWalletModal .bc-wlm-img{width:100%;height:100%;object-fit:cover;display:block}
#blooWalletModal .bc-wlm-row.on .bc-wlm-av:has(img){background:#fff}
#blooWalletModal .bc-wlm-av .bc-wl-ini{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font:700 13px/1 var(--card-font,Inter),system-ui,sans-serif;color:#4b5563}
#blooWalletModal .bc-wlm-row.on .bc-wlm-av .bc-wl-ini{color:#fff}
#blooWalletModal .bc-wlm-tx{min-width:0;display:flex;flex-direction:column}
#blooWalletModal .bc-wlm-tx b{font:700 14.5px/1.25 Inter,system-ui,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#blooWalletModal .bc-wlm-tx small{font:500 12.5px/1.3 Inter,system-ui,sans-serif;color:#6b7280}
#blooWalletModal .bc-wlm-tag{align-self:flex-start;margin-top:3px;padding:1px 7px;border-radius:999px;font:700 10.5px/1.5 Inter,system-ui,sans-serif;background:color-mix(in srgb,var(--card-accent-sheet,#7c5cfc) 14%,#fff);color:var(--card-accent-sheet,#7c5cfc)}
#blooWalletModal .bc-wlm-ck{margin-left:auto;width:22px;height:22px;border-radius:50%;border:2px solid #cfd3da;flex:none;display:flex;align-items:center;justify-content:center;box-sizing:border-box}
#blooWalletModal .bc-wlm-row.on .bc-wlm-ck{border-color:var(--card-accent-sheet,#7c5cfc);background:var(--card-accent-sheet,#7c5cfc)}
#blooWalletModal .bc-wlm-ck .bli{font-size:13px;color:#fff}
#blooWalletModal .bc-wlm-e{margin:12px 2px 0;font:500 12px/1.45 Inter,system-ui,sans-serif;color:#6b7280}
#blooWalletModal .bc-wlm-b{display:flex;gap:8px;margin-top:16px}
#blooWalletModal .bc-wlm-b a,#blooWalletModal .bc-wlm-b button{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:14px;font:700 14px/1 Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer;border:1.5px solid var(--card-accent-sheet,#7c5cfc)}
#blooWalletModal .bc-wlm-b a{background:var(--card-accent-sheet,#7c5cfc);color:#fff}
#blooWalletModal .bc-wlm-b a .bli{color:#fff}
#blooWalletModal .bc-wlm-b button{background:#fff;color:var(--card-accent-sheet,#7c5cfc)}
@media (min-width:600px){#blooWalletModal{align-items:center !important}#blooWalletModal .bc-wlm{border-radius:22px !important}}