/* Assistant Advisor : bulle flottante + fenetre de discussion.
   Mobile d'abord (ARCHITECTURE.md section 12), BEM, CSS maison, aucun
   CDN tiers, aucune dependance externe. Couleurs et typographie
   reprises de styles.css (variables --navy/--teal/--ocean deja
   definies), aucune nouvelle direction artistique. */

.advisor {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 90;
}

/* Progressive enhancement : la bulle reste masquee si JavaScript est
   desactive (advisor-widget.js retire cette classe au chargement),
   le parcours principal restant entierement fonctionnel sans elle. */
.advisor--js-disabled {
  display: none;
}

.advisor__bubble {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: none;
  background: var(--navy, #142a4d);
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
  position: relative;
}

.advisor__bubble:hover,
.advisor__bubble:focus-visible {
  background: var(--navy-2, #1c3a66);
}

.advisor__bubble-icon {
  pointer-events: none;
}

.advisor__badge {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--coral, #e0604f);
  border: 2px solid var(--surface, #fff);
}

.advisor__window {
  position: fixed;
  right: 16px;
  bottom: 84px;
  left: 16px;
  top: 16px;
  display: flex;
  flex-direction: column;
  background: var(--surface, #fff);
  border-radius: 22px;
  box-shadow: 0 24px 60px rgba(10, 31, 61, .38);
  border: 1px solid var(--line, #e2e6ec);
  overflow: hidden;
  font-family: inherit;
  transform: translateY(8px);
  opacity: 0;
  transition: transform .22s ease-out, opacity .22s ease-out;
}

.advisor__window[hidden] {
  display: none;
}

.advisor__window--open {
  transform: translateY(0);
  opacity: 1;
}

/* reduced motion : apparition directe, jamais d'animation forcee */
@media (prefers-reduced-motion: reduce) {
  .advisor__window {
    transition: none;
  }
}

.advisor__header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: var(--navy, #142a4d);
  color: #fff;
}

.advisor__title {
  font-weight: 700;
  flex: 1;
}

.advisor__locale-switch {
  display: flex;
  gap: 4px;
}

.advisor__locale-btn {
  min-width: 36px;
  min-height: 32px;
  border: 1px solid rgba(255, 255, 255, .4);
  background: transparent;
  color: #fff;
  border-radius: 8px;
  font-size: 12px;
  cursor: pointer;
}

.advisor__locale-btn--active {
  background: rgba(255, 255, 255, .2);
}

.advisor__close {
  min-width: 40px;
  min-height: 40px;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
  line-height: 1;
}

.advisor__history {
  flex: 1;
  overflow-y: auto;
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.advisor__message {
  max-width: 90%;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
}

.advisor__message--assistant {
  background: var(--soft, #eef2f7);
  color: var(--ink, #1a1a1a);
  align-self: flex-start;
}

.advisor__message--user {
  background: var(--navy, #142a4d);
  color: #fff;
  align-self: flex-end;
}

.advisor__sources {
  margin-top: 6px;
  font-size: 11px;
  color: var(--muted, #6b7280);
}

.advisor__form {
  padding: 10px 12px;
  border-top: 1px solid var(--line, #e2e6ec);
}

.advisor__input-label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.advisor__input-row {
  display: flex;
  gap: 8px;
}

.advisor__input {
  flex: 1;
  min-height: 44px;
  border: 1.5px solid var(--line, #e2e6ec);
  border-radius: 14px;
  padding: 0 14px;
  font-size: 16px;
  background: var(--surface, #fff);
  color: var(--ink, #1a1a1a);
}

.advisor__send {
  min-width: 44px;
  min-height: 44px;
  border: none;
  border-radius: 10px;
  background: var(--teal, #1f9c8d);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
}

.advisor__suggestions {
  padding: 8px 12px 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-top: 1px solid var(--line, #e2e6ec);
  background: var(--bg-alt, #f8fafc);
  max-height: 140px;
  overflow-y: auto;
}

.advisor__suggestions-title {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted, #6b7280);
}

.advisor__suggestions-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.advisor__suggestion-chip {
  display: block;
  width: 100%;
  background: var(--surface, #ffffff);
  border: 1px solid var(--line, #e2e6ec);
  border-radius: 12px;
  padding: 6px 10px;
  font-size: 12px;
  color: var(--ink, #142a4d);
  cursor: pointer;
  text-align: left;
  line-height: 1.35;
  transition: all 0.15s ease;
  white-space: normal;
  word-break: break-word;
}

.advisor__suggestion-chip:hover,
.advisor__suggestion-chip:focus-visible {
  background: var(--soft, #eef2f7);
  border-color: var(--teal, #1f9c8d);
  color: var(--teal, #1f9c8d);
  outline: none;
}

.advisor__hint {
  padding: 6px 12px 10px;
  font-size: 11px;
  color: var(--muted, #6b7280);
  margin: 0;
  line-height: 1.4;
}

/* Tablette et ordinateur (>= 600px, seuil documente dans
   TRANSMISSION.md) : panneau flottant ancre pres de la bulle, jamais
   plein ecran, sans recouvrir la navigation principale. */
@media (min-width: 600px) {
  .advisor__window {
    left: auto;
    top: auto;
    width: 360px;
    height: 520px;
    max-height: calc(100vh - 120px);
    bottom: 84px;
    right: 16px;
    border-radius: 16px;
  }
}

.advisor__actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.advisor__actions .advisor__suggestion-chip:disabled { opacity: .5; cursor: default; }

/* ---------- Refonte visuelle 2026 : meme comportement, nouveau dessin ---------- */
.advisor__bubble {
  background: linear-gradient(135deg, #19CDB9 0%, #2F6FED 100%);
  box-shadow: 0 12px 30px rgba(47, 111, 237, .4), 0 0 0 6px rgba(20, 184, 166, .16);
  transition: transform .2s ease, box-shadow .2s ease;
  animation: advisorPulse 3.2s ease-in-out infinite;
}
.advisor__bubble:hover,
.advisor__bubble:focus-visible {
  background: linear-gradient(135deg, #2BDDC9 0%, #4A83F5 100%);
  transform: scale(1.06);
}
@keyframes advisorPulse { 0%, 100% { box-shadow: 0 12px 30px rgba(47, 111, 237, .4), 0 0 0 6px rgba(20, 184, 166, .16); } 50% { box-shadow: 0 12px 30px rgba(47, 111, 237, .4), 0 0 0 12px rgba(20, 184, 166, 0); } }
.advisor__header { background: linear-gradient(135deg, #12335F, #0A1F3D); padding: 14px 18px; }
.advisor__message { border-radius: 16px; }
.advisor__message--assistant { border-bottom-left-radius: 5px; }
.advisor__message--user { background: linear-gradient(135deg, #2F6FED, #12335F); border-bottom-right-radius: 5px; }
.advisor__send { background: linear-gradient(135deg, #19CDB9, #0E9F90); border-radius: 14px; color: #04312b; font-weight: 800; }
.advisor__suggestions { background: var(--soft, #f8fafc); }
.advisor__suggestion-chip { transition: all .18s ease; }
@media (max-width: 900px) {
  .advisor { bottom: 96px; }
  .advisor__window { bottom: 160px; }
}
@media (prefers-reduced-motion: reduce) { .advisor__bubble { animation: none; } }