/* ============================================================
   ask_trainer.css — «Задать вопрос тренеру» (С10).
   ============================================================ */
.at-host { position: fixed; right: var(--space-lg); bottom: var(--space-lg); z-index: 70; }

.at-fab { display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  padding: 12px 18px; border-radius: var(--radius-full); border: 1px solid var(--accent-primary);
  background: var(--accent-primary); color: var(--white); font: inherit; font-weight: 600;
  box-shadow: var(--glow-primary); }
.at-fab:hover { background: var(--accent-hover); }

.at-panel { width: min(420px, calc(100vw - 32px)); max-height: min(70vh, 640px); overflow: auto;
  border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--bg-card);
  box-shadow: var(--shadow-card); padding: var(--space-md); }
.at-head { display: flex; align-items: center; gap: var(--space-xs); margin-bottom: var(--space-sm); }
.at-head .muted { font-size: 12px; }

.at-ctx { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: var(--space-sm); }
.at-chip-btn { padding: 6px 12px; border-radius: var(--radius-full); cursor: pointer;

  border: 1px solid var(--line); background: var(--bg-main); color: var(--text-muted); font: inherit; font-size: 13px; }
.at-chip-btn.active { border-color: var(--accent-primary); color: var(--text-main); }

.at-text { width: 100%; box-sizing: border-box; padding: 10px; border-radius: var(--radius-sm);
  border: 1px solid var(--line); background: var(--bg-main); color: var(--text-main); font: inherit; resize: vertical; }
.at-foot { display: flex; justify-content: flex-end; margin-top: var(--space-sm); }
.at-sent { margin-top: var(--space-sm); padding: var(--space-sm); border-left: 3px solid var(--status-success);
  background: var(--bg-main); border-radius: var(--radius-sm); font-size: 13.5px; }

.at-hist-t { margin: var(--space-md) 0 var(--space-xs); font-weight: 600; font-size: 14px; }
.at-hist { display: flex; flex-direction: column; gap: var(--space-sm); }
.at-item { padding: var(--space-sm); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.at-item-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; }
.at-q { margin-top: 4px; font-size: 13.5px; }
.at-a { margin-top: 4px; font-size: 13.5px; color: var(--status-success); }
.at-chip.at-ok { color: var(--status-success); }
.at-chip.at-wait { color: var(--status-warning); }

@media (max-width: 640px) {
  .at-host { right: var(--space-sm); bottom: var(--space-sm); }
  .at-fab span { display: none; }
}