/* ========================================
   FILTER PILLS
   Reusable pill-shaped filter links
   ======================================== */

.filter-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}

.filter-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  border: 1px solid #e5e7eb;
  background: white;
  text-decoration: none;
  color: #6b7280;
  font-weight: 500;
}

.filter-pill:hover {
  border-color: #d1d5db;
  color: #374151;
}

[data-theme="dark"] .filter-pill {
  background: #1f2937;
  border-color: #374151;
  color: #9ca3af;
}

[data-theme="dark"] .filter-pill:hover {
  border-color: #4b5563;
  color: #d1d5db;
}

/* Active pill (selected filter) */
.filter-pill.is-active {
  border-width: 2px;
  border-color: #3b82f6;
  color: #374151;
}

[data-theme="dark"] .filter-pill.is-active {
  border-color: #60a5fa;
  color: #f3f4f6;
}

/* Icon color variants */
.filter-pill .fas { color: #3b82f6; }
[data-theme="dark"] .filter-pill .fas { color: #60a5fa; }

.filter-pill.is-shared .fas { color: #0ea5e9; }
.filter-pill.is-available .fas { color: #10b981; }
.filter-pill.is-location .fas { color: #8b5cf6; }

[data-theme="dark"] .filter-pill.is-shared .fas { color: #38bdf8; }
[data-theme="dark"] .filter-pill.is-available .fas { color: #34d399; }
[data-theme="dark"] .filter-pill.is-location .fas { color: #a78bfa; }

/* Active pill border color variants */
.filter-pill.is-active.is-shared { border-color: #0ea5e9; }
.filter-pill.is-active.is-available { border-color: #10b981; }
.filter-pill.is-active.is-location { border-color: #8b5cf6; }

[data-theme="dark"] .filter-pill.is-active.is-shared { border-color: #38bdf8; }
[data-theme="dark"] .filter-pill.is-active.is-available { border-color: #34d399; }
[data-theme="dark"] .filter-pill.is-active.is-location { border-color: #a78bfa; }

@media screen and (max-width: 768px) {
  .filter-pill-row {
    gap: 0.375rem;
  }
}