/* BoGo — panneau SWS Companion sur simwebshop.com (gabarit : front/theme/sws/_layout/_common/companion_panel.php). */
.cpnm{--ai:#5b49c7;--ai-dark:#45349f;--soft:#f1efff;--line:#ddd7fa;--ink:#1c2329;--muted:#5b5f6b;font-family:inherit}
.cpnm[hidden]{display:none}
.cpnm-pill{position:fixed;z-index:99987;inset-inline-end:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + var(--cpnm-avoid,0px) + env(safe-area-inset-bottom,0px));display:inline-flex;align-items:center;gap:8px;max-width:calc(100vw - 32px);min-height:48px;padding:6px 16px 6px 7px;border:0;border-radius:999px;background:#4f3dbb;color:#fff;font-family:inherit;font-size:14px;font-weight:600;line-height:1.25;box-shadow:0 6px 18px rgba(63,47,149,.38);cursor:pointer}
.cpnm-pill .tx{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cpnm-pill.is-compact{padding:7px}.cpnm-pill.is-compact .tx{display:none}
.cpnm-pill:hover{background:#45349f}.cpnm-pill:focus-visible{outline:3px solid #cfc7ff;outline-offset:2px}
.cpnm-pill.is-hello{animation:cpnmHello 1.6s ease-out 2}
@keyframes cpnmHello{0%{box-shadow:0 0 0 0 rgba(91,73,199,.55)}100%{box-shadow:0 0 0 14px rgba(91,73,199,0)}}
html.sws-cpnm-open .cpnm-pill{display:none}
html.sws-cpnm-wa #sws-wa-fab{display:none!important}
.cpnm-orb{flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 9%,#cfc7ff 10% 56%,#fff 57%);box-shadow:0 0 0 2px rgba(255,255,255,.22)}
.cpnm-panel{position:fixed;z-index:1060;top:0;inset-inline-end:0;width:380px;max-width:100%;height:100%;display:flex;flex-direction:column;background:#fcfbff;color:var(--ink);border-inline-start:1px solid var(--line);font-size:14.5px;line-height:1.5;transform:translateX(100%);visibility:hidden;transition:transform .22s cubic-bezier(.4,0,.2,1),visibility .22s}
html[dir="rtl"] .cpnm-panel{transform:translateX(-100%)}
.cpnm-panel.open{transform:none;visibility:visible}
.cpnm-head{position:relative;display:flex;align-items:center;gap:8px;min-height:60px;padding:8px 10px 8px 14px;background:linear-gradient(120deg,#3f2f95 0%,#5b49c7 100%);color:#fff}
.cpnm-head .ttl{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.cpnm-head b{font-size:15.5px}.cpnm-head small{font-size:12px;color:rgba(255,255,255,.8)}
.cpnm-head button{flex:0 0 auto;width:44px;height:44px;border:0;border-radius:6px;background:none;color:rgba(255,255,255,.88);font-size:22px;line-height:1;cursor:pointer}
.cpnm-head button:hover{background:rgba(255,255,255,.14);color:#fff}.cpnm-head button:focus-visible{outline:2px solid #fff;outline-offset:1px}
.cpnm-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.cpnm-msg{max-width:88%;padding:9px 12px;border-radius:12px;white-space:pre-wrap;overflow-wrap:anywhere}
.cpnm-msg.bot{align-self:flex-start;background:var(--soft);border:1px solid var(--line);color:#251c57;border-bottom-left-radius:4px}
.cpnm-msg.user{align-self:flex-end;background:var(--ai-dark);color:#fff;border-bottom-right-radius:4px}
.cpnm-typing{color:var(--ai);font-size:13px}
.cpnm-retry{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.cpnm-chips{display:flex;flex-wrap:wrap;gap:6px}
.cpnm-chips button{min-height:44px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ai-dark);font:inherit;font-size:13.5px;cursor:pointer;text-align:start}
.cpnm-chips button:hover{border-color:var(--ai)}.cpnm-chips button:focus-visible{outline:2px solid var(--ai);outline-offset:1px}
/* Action principale : un bouton et sa mention d'essai sur une ligne, sans cadre (une carte de plus chargeait le fil). */
.cpnm-card{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.cpnm-card span{color:#4b5563;font-size:12.5px}
.cpnm .cpnm-go{justify-self:start;min-height:44px;padding:8px 16px;border:0;border-radius:8px;background:#faaf0b;color:#1c2329;font-family:inherit;font-size:14px;font-weight:700;line-height:1.2;cursor:pointer}
.cpnm a.cpnm-go{display:inline-flex;align-items:center;text-decoration:none}.cpnm .cpnm-go:hover{background:#e89f00}.cpnm .cpnm-go:focus-visible{outline:2px solid var(--ai-dark);outline-offset:2px}
/* Choix montrés sous une réponse (CompanionChoices) : packs, extensions, « Créer ma boutique », questions suivantes. */
.cpnm-choices{align-self:stretch;display:flex;flex-direction:column;gap:10px}
.cpnm-ttl{font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--muted)}
.cpnm-packs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 6px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.cpnm-pack{flex:0 0 148px;scroll-snap-align:start;display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#fff}
.cpnm-pack.is-pop{flex-basis:178px;border:2px solid #faaf0b;box-shadow:0 6px 16px rgba(250,175,11,.2)}
.cpnm-pack .nm,.cpnm-feature .nm{font-weight:800;font-size:15px;color:var(--ink)}
.cpnm-pack .pr,.cpnm-feature .pr{font-size:21px;font-weight:800;line-height:1.15;color:#251c57}
.cpnm-pack .pr small,.cpnm-feature .pr small{font-size:12px;font-weight:600;color:var(--muted)}
.cpnm-pack .pr{white-space:nowrap}.cpnm-pack .pr small{display:block}
.cpnm-pack .yr,.cpnm-feature .yr{font-size:12px;color:var(--muted)}
.cpnm-bdg{align-self:flex-start;padding:2px 8px;border-radius:999px;background:#fff1cc;color:#7a4f00;font-size:11.5px;font-weight:700}
.cpnm-pack button{margin-top:8px;min-height:44px;border:0;border-radius:8px;background:var(--ai);color:#fff;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.cpnm-pack.is-pop button,.cpnm-feature button{background:#faaf0b;color:#1c2329}
.cpnm-pack button:focus-visible,.cpnm-feature button:focus-visible{outline:2px solid var(--ai-dark);outline-offset:2px}
/* Formule d'une formation : le bouton est un LIEN vers sa page (agenda du formateur ou inscription). */
.cpnm .cpnm-fgo{display:flex;align-items:center;justify-content:center;margin-top:8px;min-height:44px;padding:0 12px;border-radius:10px;background:var(--ai);color:#fff;font-size:14px;font-weight:700;text-align:center;text-decoration:none}
.cpnm .cpnm-feature .cpnm-fgo,.cpnm .cpnm-pack.is-pop .cpnm-fgo{background:#faaf0b;color:#1c2329}
.cpnm .cpnm-fgo:focus-visible{outline:2px solid var(--ai-dark);outline-offset:2px}
.cpnm-feature{display:flex;flex-direction:column;gap:6px;padding:16px;border:2px solid #faaf0b;border-radius:14px;background:linear-gradient(180deg,#fffaef 0%,#fff 70%);box-shadow:0 8px 20px rgba(250,175,11,.18)}
.cpnm-feature .nm{font-size:20px}.cpnm-feature .pr{font-size:30px}
.cpnm-feature ul{margin:4px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:13.5px;color:var(--ink)}
.cpnm-feature li::before{content:"✓";color:#0d6b37;font-weight:800;margin-inline-end:8px}
.cpnm-feature button{margin-top:8px;min-height:46px;border:0;border-radius:10px;font:inherit;font-size:15px;font-weight:800;cursor:pointer}
.cpnm-exts{display:flex;flex-direction:column;gap:6px}
.cpnm-ext{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:13.5px}
.cpnm-ext b{display:block;color:var(--ink)}.cpnm-ext span{color:var(--muted);font-size:12.5px}
.cpnm .cpnm-ext a{flex:0 0 auto;color:var(--ai-dark);font-weight:700;text-decoration:none;white-space:nowrap}
.cpnm .cpnm-ext a:hover{text-decoration:underline}
/* Menu « ⋯ » de l'en-tête : parler à l'équipe, effacer. */
.cpnm-menu{position:absolute;top:calc(100% - 6px);inset-inline-end:10px;z-index:2;min-width:240px;display:flex;flex-direction:column;padding:6px;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:0 10px 24px rgba(28,35,41,.16)}
.cpnm-menu[hidden]{display:none}
.cpnm .cpnm-menu a,.cpnm .cpnm-menu button{display:flex;align-items:center;gap:10px;width:100%;box-sizing:border-box;white-space:nowrap;min-height:44px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--ink);font:inherit;font-size:14px;font-weight:500;text-align:start;text-decoration:none;cursor:pointer}
.cpnm .cpnm-menu a:hover,.cpnm .cpnm-menu button:hover,.cpnm .cpnm-menu a:focus-visible,.cpnm .cpnm-menu button:focus-visible{background:var(--soft);outline:none}
.cpnm .cpnm-menu .cpnm-wa i{color:#0d6b37;font-size:18px}.cpnm .cpnm-menu .cpnm-forget i{color:var(--muted);font-size:16px}
.cpnm-foot{display:flex;gap:8px;align-items:flex-end;padding:10px 12px;border-top:1px solid var(--line);background:#fff}
.cpnm-foot textarea{flex:1;min-width:0;box-sizing:border-box;height:44px;min-height:44px;max-height:120px;overflow-y:hidden;padding:10px 12px;line-height:22px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:16px;resize:none;color:var(--ink);background:#fff}
.cpnm-foot textarea:focus-visible{outline:2px solid var(--ai);outline-offset:1px}
.cpnm-foot button{flex:0 0 auto;min-width:48px;height:44px;border:0;border-radius:10px;background:var(--ai);color:#fff;font-size:16px;cursor:pointer}
.cpnm-foot button:disabled{opacity:.6;cursor:wait}
.cpnm .cpnm-mic{min-width:44px;background:#fff;border:1px solid var(--line);color:var(--ai-dark)}
.cpnm .cpnm-mic[hidden]{display:none}
.cpnm .cpnm-mic.is-listening,.cpnm .cpnm-mic.is-speaking{background:var(--ai);border-color:var(--ai);color:#fff}
.cpnm-vstate{padding:0 14px;font-size:12.5px;color:var(--ai-dark)}
.cpnm-vstate:empty{display:none}
.cpnm .sws-sa-msg--system{font-size:12.5px;color:var(--muted);text-align:center}
.cpnm .sws-sa-vnote{padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:13px;line-height:1.45}
.cpnm .sws-sa-vnote div{display:flex;gap:8px;margin-top:8px}
.cpnm .sws-sa-vnote button{min-height:40px;padding:8px 14px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ai-dark);font:inherit;font-weight:600;cursor:pointer}
.cpnm .sws-sa-vnote button:first-child{background:var(--ai);border-color:var(--ai);color:#fff}.cpnm-foot button:focus-visible{outline:2px solid var(--ai-dark);outline-offset:2px}
/* Ordinateur large (≥ 1700 px depuis l'en-tête GLOBAL FIRST, 1500 avant) : le panneau POUSSE la page, qui garde assez de largeur pour sa barre d'en-tête ;
   les conteneurs Bootstrap (1170 px fixes) sont bornés à la largeur réelle, sinon ils passent sous le panneau. */
@media (min-width:1700px){
  html.sws-cpnm-docked body{margin-inline-end:380px;transition:margin .22s cubic-bezier(.4,0,.2,1)}
  html.sws-cpnm-docked .container{max-width:100%}
}
/* Ordinateur de 1100 à 1699 px : pousser la page la ferait passer sous la largeur de la barre d'en-tête (rupture du
   thème à 1024 px) ; le panneau devient une carte flottante, sous l'en-tête, qui ne masque ni le logo ni « Démarrer ». */
@media (min-width:1100px) and (max-width:1699px){
  .cpnm-panel{top:auto;bottom:16px;inset-inline-end:16px;height:min(640px,calc(100vh - 128px));border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 12px 32px rgba(63,47,149,.22)}
}
@media (max-width:1099px){
  /* Clavier virtuel ouvert (--cpnm-kb, bogo-core) : la feuille se pose au-dessus de lui, la saisie reste visible. */
  .cpnm-panel{top:auto;bottom:max(var(--cpnm-avoid,0px),var(--cpnm-kb,0px));left:0;right:0;width:100%;height:min(62vh,520px);max-height:calc(100vh - var(--cpnm-kb,0px) - 8px);border-inline-start:0;border-radius:16px 16px 0 0;overflow:hidden;transform:translateY(calc(100% + var(--cpnm-avoid,0px) + 24px));box-shadow:0 -8px 24px rgba(63,47,149,.18)}
  html[dir="rtl"] .cpnm-panel{transform:translateY(calc(100% + var(--cpnm-avoid,0px) + 24px))}
  .cpnm-panel.open,html[dir="rtl"] .cpnm-panel.open{transform:none}
  .cpnm-head{padding-top:14px;min-height:52px}
  .cpnm-head small{display:none}
  .cpnm-head::before{content:"";position:absolute;top:6px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:4px;background:rgba(255,255,255,.55)}
  html.sws-cpnm-sheet body{padding-bottom:calc(min(62vh,520px) + var(--cpnm-avoid,0px) + 8px)}
}
@media (prefers-reduced-motion:reduce){.cpnm-panel,html.sws-cpnm-docked body{transition:none}.cpnm-pill.is-hello{animation:none}}