.top-panel {
  margin: 0 auto 32px;
  max-width: 1240px;
  &.pt-40 {
    padding-top: 40px;
  }

  .buttons {
    margin-bottom: 32px;
    .btn {
      font-weight: 700;
    }
  }

  .filters {
    padding: 16px 0 24px;

    background-color: #F5F4F4;
    border-top: #E8E8E8 solid 1px;
    border-bottom: #E8E8E8 solid 1px;
    .limiter {
      display: flex;
      flex-direction: row;
      align-items: flex-end;
    }
    .search {
      flex-grow: 1;
      label {
        margin-bottom: 2px;
        color: #86898E;
      }
      input {
        height: 40px;
        padding: 8px 52px 8px 16px;
        border: #BFBFBF solid 1px;
        border-radius: 12px;
        background: #ffffff url('~src/assets/images/icons/search_24dp.svg') calc(100% - 12px) 50% no-repeat;
      }
    }
    .advanced {
      margin-left: 24px;
      button {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 8px;
        height: 40px;
        padding: 8px 16px;
        background-color: #F9B417;
        color: #ffffff;
        border-radius: 20px;
        font-size: 14px;
        font-weight: 700;
        text-transform: uppercase;
        &:before {
          width: 24px;
          height: 24px;
          background: transparent url('~src/assets/images/icons/filter_empty_24.svg') 50% 50% no-repeat;
          content: '';
        }
        &.filled:before {
          background-image: url('~src/assets/images/icons/filter_filled_24.svg');
        }
      }
    }
  }
}

