Задача:

В интернет-магазине на WordPress (используется дочерняя тема для настроек) необходимо реализовать пользовательскую интерактивность для кнопок фильтрации товаров.

Требования к визуальным эффектам:

• При наведении курсора мыши на кнопку фильтра, она должна визуально подсвечиваться. Эффект такой же, как на предоставленном скриншоте (акцент серым фоном).
• Когда фильтр активен (выбран пользователем), на его месте также должен отображаться серый фон, чтобы четко выделить выбранный раздел. Кнопки представлены в виде картинок-значков (иконок).

Требования к шрифту:

• Необходимо заменить шрифт для цифр на странице, которые находятся на предоставленном скриншоте. Шрифты для замены уже загружены, их нужно только подключить через CSS для соответствующего селектора.

Технические требования:

Правки вносить через каскадные таблицы стилей (CSS) дочерней темы. Найти подходящие CSS-правила по заданным селекторам в настройках не удалось.