/* Penelope Fase 15 - CSS aggiuntivo per la scheda Assistente. */

.assistant { display: flex; flex-direction: column; gap: 1rem; max-width: 900px; }
.assistant .hint { color: var(--muted, #666); font-size: 0.95rem; }
.chip-row { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.chip {
  padding: 0.4rem 0.75rem; border-radius: 999px;
  background: #eef2ff; border: 1px solid #c7d2fe;
  color: #1e3a8a; font-size: 0.9rem; cursor: pointer;
}
.chip:hover { background: #dbeafe; }
.chat-scroll {
  display: flex; flex-direction: column; gap: 0.75rem;
  max-height: 60vh; overflow-y: auto;
  background: #fafafa; border: 1px solid #e5e7eb; border-radius: 8px;
  padding: 1rem;
}
.chat-bubble {
  padding: 0.75rem 1rem; border-radius: 12px;
  max-width: 90%;
}
.chat-bubble__who { font-size: 0.75rem; color: #6b7280; margin-bottom: 0.25rem; text-transform: uppercase; letter-spacing: 0.5px; }
.chat-bubble__text { white-space: pre-wrap; line-height: 1.4; }
.chat-bubble--user { background: #dbeafe; align-self: flex-end; }
.chat-bubble--bot  { background: #fff; border: 1px solid #e5e7eb; align-self: flex-start; }
.chat-bubble.error { border-color: #fecaca; background: #fef2f2; }
.chat-actions { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.5rem; flex-wrap: wrap; }
.chat-meta { color: #9ca3af; font-size: 0.8rem; margin-left: auto; }
.chat-form { display: flex; gap: 0.5rem; }
.chat-form input { flex: 1; }
.assistant-table {
  width: 100%; border-collapse: collapse; margin-top: 0.5rem;
  font-size: 0.9rem;
}
.assistant-table th, .assistant-table td {
  padding: 0.4rem 0.6rem; border-bottom: 1px solid #e5e7eb; text-align: left;
}
.assistant-table th { background: #f3f4f6; font-weight: 600; }

@media (max-width: 640px) {
  .chat-bubble { max-width: 100%; }
  .assistant-table { font-size: 0.85rem; }
  .chip { font-size: 0.85rem; }
}