/* ========================================
   ExpenseIQ — Sync Status Styles
   ======================================== */

.sync-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: var(--radius-full);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  transition: all var(--transition-fast);
}

.sync-badge.synced {
  background: var(--color-income-bg);
  color: var(--color-income);
}

.sync-badge.syncing {
  background: var(--color-info-bg);
  color: var(--color-info);
}

.sync-badge.offline {
  background: var(--color-warning-bg);
  color: var(--color-warning);
}

.sync-badge.error {
  background: var(--color-expense-bg);
  color: var(--color-expense);
}

.voice-pulse {
  width: 8px; height: 8px; background: #ef4444;
  border-radius: 50%; animation: voicePulse 1s infinite;
}
@keyframes voicePulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(1.3); }
}