/* Questionnaire « Quel miel choisir ? » en conversation (bulles) — voir inc/quiz.php et assets/quiz.js */
.me-quiz{background:var(--me-black-2);border:1px solid var(--me-line);border-radius:14px;padding:18px 12px;margin:8px 0 28px}
.me-chat{border-color:rgba(242,194,27,.35);box-shadow:0 0 0 1px rgba(242,194,27,.08),0 18px 40px rgba(0,0,0,.35)}
.me-chat__tete .me-kicker{margin:0 0 6px}
.me-quiz h2{margin:0 0 4px;font-size:clamp(24px,6vw,34px)}
.me-quiz__sub{color:var(--me-grey);margin:0 0 16px;font-size:15px}

/* Fenêtre de conversation : hauteur stable, défilement interne (la page ne saute pas) */
.me-chat__fenetre{background:var(--me-black);border:1px solid var(--me-line);border-radius:12px;overflow:hidden}
.me-chat__fil{display:flex;flex-direction:column;gap:10px;padding:14px 12px;min-height:150px;max-height:430px;overflow-y:auto;scroll-behavior:smooth;overscroll-behavior:contain}
.me-chat__bulle{max-width:86%;padding:11px 14px;border-radius:16px;font:500 15px/1.45 var(--me-body);word-wrap:break-word}
.me-chat__bulle--bot{align-self:flex-start;background:var(--me-black-2);color:#fff;border:1px solid var(--me-line);border-bottom-left-radius:5px}
.me-chat__bulle--moi{align-self:flex-end;background:var(--me-gold);color:#0a0a0b;font-weight:700;border-bottom-right-radius:5px}
@media (prefers-reduced-motion:no-preference){.me-chat__bulle,.me-chat__carte{animation:me-chat-entree .22s ease-out}}
@keyframes me-chat-entree{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Points « en train d'écrire » */
.me-chat__frappe{display:flex;gap:5px;padding:14px 16px}
.me-chat__frappe span{width:7px;height:7px;border-radius:50%;background:var(--me-grey-2);animation:me-chat-point 1s infinite ease-in-out}
.me-chat__frappe span:nth-child(2){animation-delay:.15s}.me-chat__frappe span:nth-child(3){animation-delay:.3s}
@keyframes me-chat-point{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

/* Réponses proposées : grosses pastilles faciles à toucher */
.me-chat__choix{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px 16px;border-top:1px solid var(--me-line);background:rgba(255,255,255,.015)}
.me-chat__choix:empty{display:none}
.me-chat__opt{flex:1 1 calc(50% - 8px);min-height:var(--me-tap,48px);padding:11px 16px;border-radius:999px;border:1.5px solid var(--me-gold);background:transparent;color:#fff;font:700 15px/1.25 var(--me-body);cursor:pointer;transition:background .15s,color .15s}
.me-chat__opt:hover,.me-chat__opt:focus-visible{background:var(--me-gold);color:#0a0a0b;outline:none}
.me-chat__opt:focus-visible{box-shadow:0 0 0 3px rgba(242,194,27,.35)}
.me-chat__opt--discret{flex:0 1 auto;border-color:var(--me-line);color:var(--me-grey);font-weight:600}
.me-chat__opt--discret:hover,.me-chat__opt--discret:focus-visible{background:transparent;color:var(--me-gold);border-color:var(--me-gold)}

/* Carte du conseil : image + nom et prix, boutons sur toute la largeur en dessous */
.me-chat__carte{align-self:stretch;display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px 14px;align-items:start;background:var(--me-black-2);border:1px solid var(--me-line);border-radius:12px;padding:14px}
.me-chat__carte--principale{border-color:var(--me-gold)}
.me-chat__carte img{width:72px;height:72px;border-radius:8px;object-fit:contain;background:#000}
.me-chat__carte-corps{min-width:0}
.me-chat__carte h3{margin:0 0 4px;font-size:17px;line-height:1.2}
.me-chat__pourquoi{color:var(--me-grey);font-size:13.5px;line-height:1.45;margin:0 0 6px}
.me-chat__prix{color:var(--me-gold);font-weight:800;margin:0;font-variant-numeric:tabular-nums}
.me-chat__actions{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.me-chat__actions .me-btn{flex:1 1 100%;display:flex;align-items:center;justify-content:center;min-height:46px;padding:10px 16px;text-align:center;text-decoration:none}
.me-chat__lien{margin:0 auto;color:var(--me-grey);font-size:13.5px;text-decoration:underline;text-underline-offset:3px}
.me-chat__lien:hover{color:var(--me-gold)}
.me-chat__note{align-self:stretch;color:var(--me-grey-2);font-size:12.5px;margin:2px 0 0}

/* Explication indexable (page « Quel miel choisir ? ») */
.me-quiz__static{margin-top:18px;border-top:1px solid var(--me-line);padding-top:14px}
.me-quiz__static h3{font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--me-grey-2);margin:0 0 8px;font-family:var(--me-body)}
.me-quiz__static ol{padding-left:18px;margin:0;color:var(--me-grey);font-size:14px}
.me-quiz__static li{margin:4px 0}
.me-quiz__static ul{margin:8px 0 0;padding-left:18px;color:var(--me-grey);font-size:14px}
.me-quiz__disclaimer{color:var(--me-grey-2);font-size:12.5px;margin:14px 0 0}

@media (min-width:768px){
  .me-quiz{padding:28px}
  .me-chat{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px;align-items:start}
  .me-chat .me-quiz__static{grid-column:1/-1}
  .me-chat__tete{padding-top:12px}
  .me-chat__opt{flex:1 1 calc(50% - 8px)}
  .me-chat__actions .me-btn{flex:0 1 auto}
  .me-chat__lien{margin:0}
}
