/* Assistente de voz "Jornada Acosta" — usa os tokens do Acosta OPS (styles.css),
   então acompanha o tema claro/escuro automaticamente. */
.asst-root { position: fixed; right: 22px; bottom: 22px; z-index: 900; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.asst-root[hidden], .asst-panel[hidden], .asst-btn[hidden] { display: none !important; }

.asst-fab {
  width: 54px; height: 54px; border-radius: 50%; cursor: pointer;
  display: grid; place-items: center; color: var(--gold-bright);
  background: radial-gradient(circle at 35% 30%, var(--surface-hover), var(--surface));
  border: 1px solid var(--gold-line); box-shadow: var(--shadow-md);
  transition: transform .15s ease, border-color .15s ease;
}
.asst-fab:hover { transform: translateY(-1px); border-color: var(--gold); }
.asst-fab:focus-visible, .asst-btn:focus-visible, .asst-close:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.asst-root[data-state="listening"] .asst-fab, .asst-root[data-state="speaking"] .asst-fab { border-color: var(--gold); color: var(--gold); }

.asst-panel {
  width: min(360px, calc(100vw - 32px)); max-height: min(560px, calc(100vh - 110px));
  display: flex; flex-direction: column; gap: 12px; padding: 18px 18px 14px;
  background: var(--surface); color: var(--text); border: 1px solid var(--line-strong);
  border-radius: 16px; box-shadow: var(--shadow-md);
}
.asst-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.asst-head h2 { margin: 0; font-size: 22px; line-height: 1.1; }
.asst-sub { margin: 4px 0 0; font-size: 13px; color: var(--text-dim); }
.asst-close { background: transparent; border: 0; color: var(--text-dim); font-size: 22px; line-height: 1; cursor: pointer; padding: 2px 6px; border-radius: 8px; }
.asst-close:hover { color: var(--text); background: var(--surface-hover); }

/* orbe: reage ao volume da conversa via --asst-level (0..1) */
.asst-orb { --asst-level: 0; align-self: center; width: 92px; height: 92px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(circle, var(--gold-wash) 0%, transparent 70%); }
.asst-orb-core { width: 46px; height: 46px; border-radius: 50%;
  background: radial-gradient(circle at 38% 32%, var(--gold-bright), var(--gold) 55%, var(--gold-deep));
  box-shadow: 0 0 calc(10px + 26px * var(--asst-level)) var(--gold-line);
  transform: scale(calc(1 + 0.32 * var(--asst-level))); transition: transform .08s linear; opacity: .55; }
.asst-root[data-state="listening"] .asst-orb-core, .asst-root[data-state="speaking"] .asst-orb-core { opacity: 1; }
.asst-root[data-state="connecting"] .asst-orb-core { animation: asst-breathe 1.4s ease-in-out infinite; opacity: .85; }
@keyframes asst-breathe { 50% { transform: scale(1.12); } }

.asst-status { margin: 0; text-align: center; font-size: 14px; color: var(--text-dim); min-height: 1.4em; }
.asst-root[data-state="error"] .asst-status { color: var(--red); }

.asst-log { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; overflow-y: auto; min-height: 0; flex: 1 1 auto; }
.asst-log:empty { display: none; }
.asst-line { font-size: 14px; line-height: 1.45; padding: 8px 10px; border-radius: 10px; background: var(--surface-soft); border: 1px solid var(--line); }
.asst-line--user { background: transparent; }
.asst-who { display: block; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); margin-bottom: 2px; }

.asst-actions { display: flex; gap: 8px; }
.asst-btn { flex: 1; font: inherit; font-size: 14px; font-weight: 600; padding: 10px 14px; border-radius: 10px; cursor: pointer;
  background: transparent; color: var(--text); border: 1px solid var(--line-strong); }
.asst-btn:hover { background: var(--surface-hover); }
.asst-btn--primary { background: var(--gold); border-color: var(--gold); color: var(--bg); }
.asst-btn--primary:hover { background: var(--gold-bright); }
.asst-note { margin: 0; font-size: 12px; color: var(--text-faint); line-height: 1.4; }

@media (max-width: 520px) { .asst-root { right: 14px; bottom: 14px; } }
@media (prefers-reduced-motion: reduce) {
  .asst-fab, .asst-orb-core { transition: none; }
  .asst-root[data-state="connecting"] .asst-orb-core { animation: none; }
}
@media print { .asst-root { display: none !important; } }