.shop-main {
  display: flex;
  justify-content: stretch;
  padding: 0.5rem;
  gap: 1rem;

  .shop-aside {
    width: 20%;
    border-right: 1px solid #0001;
    padding: 0.25rem;

    .shop-filters {
      min-height: 10vh;
      max-height: 25vh;
      overflow-y: scroll;
      padding: 0.25rem;

      .filter-items {
        .filter-item {
          transition: all 0.2s ease-in-out;
          display: flex;
          width: 100%;
          height: auto;
          gap: 0.5rem;
          border-bottom: 1px solid #da445399;

          .custom-control {
            display: flex;
            gap: 0.5rem;
            width: 100%;
            justify-content: start;
            align-items: center;
          }

          .item-count {
            transition: all 0.2s ease-in-out;
            min-width: 3rem;
            align-self: flex-end;
            background: #da445399;
            color: #fff;
            text-align: center;
            border-radius: 0.5rem;
            padding: 0.25rem;
            margin: 0.125rem;
            font-size: 9pt;
            font-weight: bold;
          }
        }
        .filter-item:hover {
          border-bottom: 1px solid #da4453ff;
          .item-count {
            background: #da4453ff;
          }
        }
      }
    }
    .accordion-body,
    .accordion-header {
      padding: 0.25rem;
    }
    .accordion-button,
    .accordion-button:not(.collapsed) {
      background: transparent;
      font-size: 11pt;
      font-weight: bold;
      margin: 0;
      padding: 0.25rem;
    }

    .accordion-collapse {
      font-size: 9pt;
    }
  }
  .shop-content {
    width: 80%;
  }
}
@media (max-width: 768px) {
  .shop-main {
    flex-direction: column;
    .shop-aside {
      width: 100%;
    }
    .shop-content {
      width: 100%;
    }
  }
}