/* Ticket Live */
.tl-live-chip {
    position: fixed; right: 16px; bottom: 76px; z-index: 1040;
    display: inline-flex; align-items: center; gap: 6px; cursor: default;
    background: var(--tblr-bg-surface, #fff); color: var(--tblr-body-color, #1f2937);
    border: 1px solid var(--tblr-border-color, #e5e7eb); border-radius: 999px;
    padding: 3px 10px; font-size: 12px; box-shadow: 0 2px 8px rgba(0, 0, 0, .08); opacity: .9;
}
.tl-live-chip[data-state="paused"], .tl-live-chip[data-state="error"] { cursor: pointer; }
.tl-dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; animation: tl-pulse 2s infinite; }
.tl-live-chip[data-state="idle"] .tl-dot { background: #94a3b8; animation: none; }
.tl-live-chip[data-state="paused"] .tl-dot { background: #94a3b8; animation: none; }
.tl-live-chip[data-state="error"] .tl-dot { background: #ef4444; animation: none; }
@keyframes tl-pulse {
    0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); }
    70% { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
    100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

/* "กำลังพิมพ์…" */
.tl-typing {
    position: fixed; left: 50%; transform: translateX(-50%); bottom: 76px; z-index: 1040;
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--tblr-bg-surface, #fff); border: 1px solid var(--tblr-border-color, #e5e7eb);
    border-radius: 999px; padding: 5px 14px; font-size: 13px; box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
}
.tl-typing[hidden] { display: none; }
.tl-typing-dots { display: inline-flex; gap: 3px; }
.tl-typing-dots i { width: 6px; height: 6px; border-radius: 50%; background: #3b82f6; animation: tl-bounce 1.2s infinite; }
.tl-typing-dots i:nth-child(2) { animation-delay: .15s; }
.tl-typing-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes tl-bounce { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-4px); opacity: 1; } }

/* แถบแจ้ง */
.tl-banner {
    position: fixed; top: 64px; left: 50%; transform: translateX(-50%); z-index: 1050;
    display: flex; align-items: center; gap: 10px; max-width: calc(100vw - 32px);
    background: #eff6ff; color: #1e3a8a; border: 1px solid #bfdbfe; border-radius: 10px;
    padding: 8px 10px 8px 14px; font-size: 14px; box-shadow: 0 6px 20px rgba(0, 0, 0, .12);
}
.tl-banner[hidden] { display: none; }
.tl-banner[data-kind="warn"] { background: #fffbeb; color: #92400e; border-color: #fcd34d; }
.tl-banner[data-kind="new"] { background: #ecfdf5; color: #065f46; border-color: #6ee7b7; }
.tl-banner-close { font-size: 18px; line-height: 1; padding: 0 6px; }

/* รายการใหม่ใน timeline */
.itil-timeline > .timeline-item.tl-new .timeline-content,
.itil-timeline > .timeline-item.tl-new .card {
    animation: tl-new-glow 6s ease-out;
}
@keyframes tl-new-glow {
    0%, 30% { box-shadow: 0 0 0 3px rgba(59, 130, 246, .55); }
    100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); }
}

@media (max-width: 640px) {
    .tl-live-chip { bottom: 70px; right: 8px; }
    .tl-typing { bottom: 110px; max-width: calc(100vw - 24px); }
    .tl-banner { top: 56px; font-size: 13px; }
}
@media print { .tl-live-chip, .tl-typing, .tl-banner { display: none !important; } }