/* Accueil « Une seule question » : saisie au centre, suggestions, pastilles d'état.
   Mise en page et couleurs du design Classique ; le Nouveau design a son bloc dans design-v2.css. */

.hq { min-height: calc(100vh - 84px); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 0 6vh; }
.hq-date { margin: 0; }
.hq-title { margin: 8px 0 0; }
.hq-ask { width: min(720px, 100%); margin-top: 30px; display: flex; flex-direction: column; gap: 14px; padding: 16px 16px 14px 20px; text-align: left;
  background: rgba(246,242,234,.04); border: 1px solid var(--line-strong); }
.hq-ask:focus-within { border-color: rgba(59,217,219,.55); }
.hq-ask textarea { width: 100%; min-height: 56px; max-height: 200px; resize: none; background: transparent; border: 0; outline: 0; color: var(--ivory);
  font: inherit; font-size: 17px; line-height: 1.5; padding: 0; }
.hq-ask textarea::placeholder { color: var(--mute); }
.hq-bar { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.hq-agent { position: relative; display: flex; align-items: center; }
.hq-menu { top: auto; bottom: calc(100% + 8px); right: 0; text-align: left; }
.hq-sugg { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 18px; width: min(760px, 100%); }
.hq-chip { font-weight: 500; padding: 9px 16px; font-size: 13.5px; color: var(--sand); }
.hq-status { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 40px; }
.hq-pill { padding: 10px 18px; font-size: 13.5px; font-weight: 500; }
.hq-pill .ico { opacity: .7; }
.hq-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--mute); }
.hq-dot.warn { background: var(--ochre-light); }
.hq-dot.live { background: var(--turq); animation: mnPulse 2s infinite; }
.hq-alert { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; padding: 10px 16px; font-size: 13.5px; text-align: left;
  background: rgba(200,138,28,.10); border: 1px solid rgba(200,138,28,.35); }

@media (max-width: 860px) {
  .hq { min-height: 0; justify-content: flex-start; align-items: stretch; padding: 34px 0 24px; }
  .hq-date, .hq-title { text-align: left; }
  .hq-ask { margin-top: 24px; width: 100%; }
  .hq-sugg { justify-content: flex-start; }
  .hq-status { justify-content: flex-start; margin-top: 28px; }
  /* Le menu s'ouvre vers le bas, calé sur la zone de saisie (jamais coupé à droite). */
  .hq-ask { position: relative; }
  .hq-agent { position: static; }
  .hq-menu { top: calc(100% + 8px); bottom: auto; left: 0; right: auto; width: min(320px, 100%); }
  /* Sur téléphone, le nom de l'agent reste visible ici : la zone de saisie a la place. */
  .hq .agent-pill .ap-label { display: inline; }
  .hq-chip, .hq-pill { min-height: 44px; }
}