/* Suporte / chamados (views/suporte.js). Prefixo sup-. */
.sup-h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-size: 16px; }
.sup-h3 .ic { width: 18px; height: 18px; color: var(--primary-2); }
.sup-pedido {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 14px; border: 1px solid var(--border-2); border-radius: var(--radius-sm); background: var(--surface-2);
}
.sup-pedido-txt { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 180px; }
.sup-lbl { gap: 6px; }
.sup-err { margin: 0; min-height: 1em; color: var(--red); font-size: 13px; }
.sup-err:empty { display: none; }
.sup-lista { display: flex; flex-direction: column; }
.sup-item {
  display: grid; gap: 4px; padding: 14px 18px; border-top: 1px solid var(--border);
  color: var(--text); text-decoration: none; transition: background .15s ease;
}
.sup-item:first-child { border-top: 0; }
.sup-item:hover { background: var(--surface-2); }
.sup-item.novo { box-shadow: inset 3px 0 0 var(--primary); }
.sup-item-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sup-assunto { flex: 1; min-width: 160px; }
.sup-ultima { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.sup-data { font-size: 12px; }

.sup-voltar { margin-bottom: 12px; align-self: flex-start; width: max-content; }
.sup-chat { display: flex; flex-direction: column; overflow: hidden; }
.sup-chat-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.sup-chat-tit { margin: 0 0 4px; font-size: 18px; }
.sup-pd-itens { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 18px 12px; }
.sup-msgs {
  display: flex; flex-direction: column; gap: 10px;
  padding: 16px 18px; min-height: 220px; max-height: min(60vh, 560px); overflow-y: auto;
  border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--bg-2);
}
.sup-msg { max-width: min(80%, 620px); display: flex; flex-direction: column; gap: 4px; }
.sup-msg.meu { align-self: flex-end; align-items: flex-end; }
.sup-msg.equipe { align-self: flex-start; }
.sup-msg-autor { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 4px; }
.sup-msg-autor .ic { width: 13px; height: 13px; color: var(--primary-2); }
.sup-msg-txt {
  padding: 10px 14px; border-radius: 14px; line-height: 1.45; overflow-wrap: anywhere;
  background: var(--surface-2); border: 1px solid var(--border-2);
}
.sup-msg.meu .sup-msg-txt { background: var(--primary-soft); border-color: rgba(229, 51, 42, .35); border-bottom-right-radius: 4px; }
.sup-msg.equipe .sup-msg-txt { border-bottom-left-radius: 4px; }
.sup-resp { display: flex; gap: 10px; align-items: flex-end; padding: 14px 18px 4px; }
.sup-resp textarea { flex: 1; min-height: 48px; }
.sup-dica { padding: 0 18px 12px; font-size: 12px; }
.sup-fechado { padding: 16px 18px; display: flex; align-items: center; gap: 8px; }
@media (max-width: 640px) {
  .sup-msg { max-width: 92%; }
  .sup-resp { padding: 12px; }
  .sup-resp .btn span { display: none; }
  .sup-dica { display: none; }
}