.catalog-tags {
  position: relative; }
  .catalog-tags__list {
    display: flex;
    gap: 8px;
    overflow: hidden; }
    @media (max-width: 990.75px) {
      .catalog-tags__list {
        flex-wrap: nowrap;
        overflow: auto;
        margin-right: -20px;
        padding-right: 20px;
        margin-left: -20px;
        padding-left: 20px;
        scrollbar-width: none; } }
    .catalog-tags__list.active {
      flex-wrap: wrap; }
      .catalog-tags__list.active .catalog-tags__toggle {
        position: static;
        transform: none; }
        .catalog-tags__list.active .catalog-tags__toggle:after {
          display: none; }
  .catalog-tags__title {
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 600; }
    @media (max-width: 990.75px) {
      .catalog-tags__title {
        margin-bottom: 10px; } }
  .catalog-tags__link,
  .catalog-tags .toggle {
    position: relative;
    display: inline-flex;
    gap: 4px;
    height: 34px;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    background-color: #F8F8F8;
    font-size: 14px;
    transition: all ease .3s;
    white-space: nowrap;
    border-radius: 100px;
    fill: currentColor; }
    .catalog-tags__link:before,
    .catalog-tags .toggle:before {
      content: '#';
      color: #A0A0A0; }
    @media (min-width: 991.75px) {
      .catalog-tags__link,
      .catalog-tags .toggle {
        cursor: pointer; }
        .catalog-tags__link:hover,
        .catalog-tags .toggle:hover {
          background: #ECECEC;
          color: #8A6048; } }
    .catalog-tags__link.active,
    .catalog-tags .toggle.active {
      cursor: default;
      background-color: #fff; }
    .catalog-tags__link:active,
    .catalog-tags .toggle:active {
      background-color: #fff; }
  .catalog-tags__toggle {
    position: absolute;
    right: 0;
    display: none;
    align-self: flex-start;
    align-items: center; }
    .catalog-tags__toggle:after {
      pointer-events: none;
      position: absolute;
      content: '';
      top: 0;
      bottom: 0;
      right: 0;
      width: calc(100% + 100px);
      background: #000;
      background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, #FFFFFF 100px, #FFFFFF 100%); }
    .catalog-tags__toggle.visible {
      display: flex; }
      @media (max-width: 990.75px) {
        .catalog-tags__toggle.visible {
          display: none; } }
    .catalog-tags__toggle.active .icon {
      transform: rotate(180deg); }
  .catalog-tags .toggle {
    position: relative;
    z-index: 2; }
    .catalog-tags .toggle:before {
      content: none; }
