/**
 * Shared Conversation Styles
 * Used by: Continue Chat Modal (for detailed view with badges)
 * Desktop Panel and Mobile Menu use Tailwind classes directly
 */

/* Status Badge */
.status-badge {
    font-size: 0.6875rem; /* 11px */
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
}

.status-active {
    background-color: #d1fae5; /* green-100 */
    color: #065f46; /* green-800 */
}

.status-paused {
    background-color: #fef3c7; /* yellow-100 */
    color: #92400e; /* yellow-800 */
}

.status-completed {
    background-color: #e0e7ff; /* indigo-100 */
    color: #3730a3; /* indigo-800 */
}

/* Unread Badge */
.unread-badge {
    background-color: #ef4444; /* red-500 */
    color: white;
    font-size: 0.6875rem; /* 11px */
    font-weight: 600;
    padding: 0.125rem 0.375rem;
    border-radius: 9999px;
    min-width: 1.25rem;
    text-align: center;
    line-height: 1;
}

/* Footer with time and last activity */
.conversation-footer {
    display: flex;
    align-items: center;
}

.conversation-time {
    font-size: 0.75rem; /* text-xs */
    color: #9ca3af; /* text-gray-400 */
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.dark .conversation-time {
    color: #6b7280;
}

.last-activity {
    font-weight: 600;
    color: #6b7280; /* text-gray-500 */
}

.dark .last-activity {
    color: #9ca3af;
}