kupurim

Добавить ul
display: flex;?

Читаем доку:
div ~ p

правые соседи: все p на том же уровне вложенности, которые идут после div

Т.е. следующие елементы за вашим.
У вас должен быть такой html:

<div class="document">
  <div class="info">
    <div class="title">Правила безопасности при работе с онлайн сервисами</div>
    <div class="size">.pdf 4.3 MB</div>
   </div>
  <div class="doc-logo"></div>
</div>

Посмотрите в консоль разработчика, там написано какие ссылки блокируются.

Используйте $( '.header__desctop-bottom--main' ).toggleClass('header__desctop-bottom--main_active');
И на этот класс уже вешайте стили.

Используйте name="category[]"

Вот как вариант - https://stackoverflow.com/questions/2341001/merge-...