<div class="radikalwp-rad-pill"><label class="radikalwp-rad-pill-item"><input type="radio" name="radikalwp-filter" checked><span>همه<//span><//label><label class="radikalwp-rad-pill-item"><input type="radio" name="radikalwp-filter"><span>دکمه‌ها<//span><//label><label class="radikalwp-rad-pill-item"><input type="radio" name="radikalwp-filter"><span>کارت‌ها<//span><//label><label class="radikalwp-rad-pill-item"><input type="radio" name="radikalwp-filter"><span>لودرها<//span><//label><//div>

.radikalwp-rad-pill {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}
.radikalwp-rad-pill-item { flex-shrink: 0; cursor: pointer; }
.radikalwp-rad-pill-item input { position: absolute; opacity: 0; }
.radikalwp-rad-pill-item span {
  display: inline-block;
  padding: 9px 20px;
  font-size: 13px;
  font-weight: 700;
  color: #475569;
  background: #fff;
  border: 1.5px solid #e2e8f0;
  border-radius: 999px;
  transition: all .25s ease;
}
.radikalwp-rad-pill-item span:hover { border-color: #94a3b8; }
.radikalwp-rad-pill-item input:checked + span {
  color: #fff;
  background: #0f172a;
  border-color: #0f172a;
}
.radikalwp-rad-pill-item input:focus-visible + span {
  outline: 3px solid rgba(15, 23, 42, .25);
  outline-offset: 2px;
}