/* SEOGrow — Page « Concurrents » (Competitors.js) */

.competitors-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}
.competitors-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.competitors-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  height: 30px;
  padding: 0 var(--space-3);
  border-radius: var(--radius-full);
  border: 1px solid var(--border-primary);
  background: var(--surface-secondary);
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--transition-fast), color var(--transition-fast);
}
.competitors-chip span { color: var(--text-tertiary); font-weight: 500; }
.competitors-chip:hover { color: var(--text-primary); }
.competitors-chip.is-active {
  background: var(--color-brand-soft);
  color: var(--color-brand-primary);
  border-color: rgba(var(--color-brand-primary-rgb), 0.3);
}
.competitors-chip.is-active span { color: inherit; }
.competitors-search { max-width: 260px; }

.competitors-table tbody tr { cursor: default; }
.competitors-table__rank { width: 90px; color: var(--text-tertiary); font-variant-numeric: tabular-nums; }
.competitors-table__num { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.competitors-table__bar-col { width: 22%; }
.competitors-site { font-weight: 600; color: var(--text-primary); }
.competitors-table td { padding-top: var(--space-2); padding-bottom: var(--space-2); }
.competitors-domain {
  display: inline-flex;
  align-items: center;
  margin-left: var(--space-2);
  vertical-align: middle;
  color: var(--text-tertiary);
  text-decoration: none;
}
.competitors-domain:hover { color: var(--color-brand-primary); }
.competitors-bar {
  height: 8px;
  border-radius: var(--radius-full);
  background: var(--surface-secondary);
  overflow: hidden;
}
.competitors-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--color-brand-primary);
}
.competitors-source { margin-top: var(--space-3); }
.competitors-source a { color: inherit; }

@media (max-width: 720px) {
  .competitors-search { max-width: none; width: 100%; }
  .competitors-table__bar-col,
  .competitors-table th:nth-child(3),
  .competitors-table td:nth-child(3) { display: none; }
}
