/* Оборот клиента: второй ряд под телом строки, снаружи ссылки
   на профиль (ui/client-turnover.js) — интерактив внутри интерактива
   нажимался бы непредсказуемо. .client-line получает flex-wrap
   только здесь: без второй строки ему нечего переносить, и на
   остальных потребителях client-row.js (без турновера) свойство
   простаивает. */

.client-line { flex-wrap: wrap; }

.client__turnover {
  flex-basis: 100%;
  order: 3;
  /* Тот же левый край, что у тела строки: отступ ряда (--sp-4),
     ширина лица (face.css: 11.5cqw), зазор до тела (--sp-3) — те же
     три числа, что уже расставляют лицо и тело внутри .client. */
  margin-left: calc(var(--sp-4) + 11.5cqw + var(--sp-3));
  margin-top: calc(var(--sp-1) * -1);
  padding-bottom: var(--sp-2);
  display: flex;
  align-items: center;
  gap: var(--sp-1);
  border: none;
  background: none;
  font: inherit;
  font-size: var(--fs-xs);
  color: var(--text-dim);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}

.client__turnover .icon {
  width: var(--fs-sm);
  height: var(--fs-sm);
  color: var(--text-faint);
}

.client__turnover--zero { color: var(--text-faint); }

.client__turnover:active { color: var(--text); }
.client__turnover:active .icon { color: var(--accent-text); }

@media (hover: hover) {
  .client__turnover:hover { color: var(--text); }
}