/* =============================================================================
   Painel Player — Suporte (Fase 3: tempo real + conversa estilo chat)
   Camada aditiva, reaproveita os tokens --apex-* já definidos em
   apex-panel-premium.css. Não redefine nada das telas existentes.
   ========================================================================= */

.apx-support-nav-dot {
    display:inline-block; width:7px; height:7px; margin-left:6px; border-radius:50%;
    background:var(--apex-gold,#d9b56b); box-shadow:0 0 0 3px var(--apex-gold-soft,rgba(217,181,107,.35));
    vertical-align:middle;
}

.apx-support-badge {
    display:inline-flex; align-items:center; gap:5px; padding:.32rem .68rem; border-radius:999px;
    font-size:11.5px; font-weight:700; letter-spacing:.01em; border:1px solid transparent;
}
.apx-support-badge.st-open { background:rgba(91,155,213,.14); color:#8ec3ff; border-color:rgba(91,155,213,.3); }
.apx-support-badge.st-waiting-team { background:rgba(217,181,107,.14); color:var(--apex-gold,#d9b56b); border-color:var(--apex-gold-soft,rgba(217,181,107,.35)); }
.apx-support-badge.st-admin-replied { background:rgba(47,206,147,.15); color:#68e4b8; border-color:rgba(47,206,147,.35); }
.apx-support-badge.st-waiting-player { background:rgba(232,166,71,.16); color:#f0b95c; border-color:rgba(232,166,71,.35); }
.apx-support-badge.st-resolved { background:rgba(47,206,147,.1); color:#68e4b8; border-color:rgba(47,206,147,.24); }
.apx-support-badge.st-closed, .apx-support-badge.st-cancelled { background:rgba(140,150,164,.14); color:#a9b2c3; border-color:rgba(140,150,164,.28); }

.apx-support-priority { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:700; opacity:.85; }
.apx-support-priority.pr-1 { color:#a9b2c3; }
.apx-support-priority.pr-2 { color:#8ec3ff; }
.apx-support-priority.pr-3 { color:var(--apex-gold,#d9b56b); }
.apx-support-priority.pr-4 { color:#ff9a92; }

.apx-support-live { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; color:#68e4b8; opacity:.9; }
.apx-support-live::before { content:''; width:6px; height:6px; border-radius:50%; background:#2fce93; box-shadow:0 0 0 0 rgba(47,206,147,.5); animation:apxSupportPulse 1.8s infinite; }
.apx-support-live.is-paused { color:var(--apex-text-muted,#93a0b3); }
.apx-support-live.is-paused::before { background:var(--apex-text-muted,#93a0b3); animation:none; }
@keyframes apxSupportPulse { 0%{box-shadow:0 0 0 0 rgba(47,206,147,.45);} 70%{box-shadow:0 0 0 6px rgba(47,206,147,0);} 100%{box-shadow:0 0 0 0 rgba(47,206,147,0);} }

/* Conversa (view.php) — bolhas Jogador (esquerda) x Administração (direita) */
.apx-support-thread { display:flex; flex-direction:column; gap:12px; padding:16px; }
.apx-support-bubble {
    max-width:82%; border-radius:14px; padding:12px 16px; border:1px solid var(--apex-border, rgba(140,172,209,.22));
    background:var(--apex-panel-soft, rgba(24,31,43,.7));
}
.apx-support-bubble.is-player { align-self:flex-start; margin-right:auto; }
.apx-support-bubble.is-admin { align-self:flex-end; margin-left:auto; background:linear-gradient(145deg,rgba(217,181,107,.1),rgba(217,181,107,.03)); border-color:var(--apex-gold-soft,rgba(217,181,107,.35)); }
.apx-support-bubble-head { display:flex; justify-content:space-between; gap:14px; margin-bottom:7px; font-size:11.5px; color:var(--apex-text-muted,#93a0b3); }
.apx-support-bubble-head strong { display:block; color:var(--apex-text,#eef2f8); font-size:13px; }
.apx-support-bubble-role { display:block; font-size:10.5px; opacity:.7; margin-top:1px; }
.apx-support-bubble-body { color:var(--apex-text,#eef2f8); line-height:1.6; word-break:break-word; font-size:13.5px; }
.apx-support-bubble.is-fresh { animation: apxSupportFlash 2.2s ease; }
@keyframes apxSupportFlash { 0% { box-shadow:0 0 0 2px var(--apex-gold-soft,rgba(217,181,107,.4)); } 100% { box-shadow:none; } }

.apx-support-list-row { position:relative; }
.apx-support-list-row.is-fresh { animation: apxSupportRowFlash 2.4s ease; }
@keyframes apxSupportRowFlash { 0% { background:rgba(217,181,107,.16); } 100% { background:transparent; } }

@media (max-width:575.98px) {
    .apx-support-bubble { max-width:100%; }
}