/* ============================================================================
   Status Filter
   ============================================================================ */

.ffmpeg-status-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
}

.ffmpeg-filter-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.375rem 1rem;
  border-radius: 9999px;
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none;
  border: 1px solid var(--ffmpeg-border);
  background: var(--ffmpeg-surface);
  color: var(--ffmpeg-text);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.ffmpeg-filter-link:hover {
  background: var(--ffmpeg-surface-2);
  border-color: var(--ffmpeg-accent);
  color: var(--ffmpeg-accent);
  text-decoration: none;
}

.ffmpeg-filter-link--active,
.ffmpeg-filter-link--active:hover {
  background: var(--ffmpeg-accent);
  border-color: var(--ffmpeg-accent);
  color: var(--ffmpeg-on-accent);
}

/* ============================================================================
   Output Indicators
   ============================================================================ */

.ffmpeg-output-indicators {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}

.ffmpeg-output-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.5rem;
  border-radius: 4px;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.ffmpeg-output-badge--available {
  background: var(--ffmpeg-success-bg);
  color: var(--ffmpeg-success);
}

.ffmpeg-output-badge--missing {
  background: var(--ffmpeg-surface-2);
  color: var(--ffmpeg-text-muted);
}
