.bc-filter-bar {
  /* border: 1px solid #2C9CFA; */
  .header {
    padding: 0.5rem 0 0.5rem 1.5rem;
    font-size: 14px;
    /* background-color: #d1e9fe; */
    & .title{
      text-align: left;
    }
  }
  .body {
    transition: max-height .5s;
    // padding: 1.6rem;
    margin: 1.6rem;
    &.close {
      // max-height: 11rem;
      overflow: hidden;
    }
    &.colse-completed {
      overflow: hidden;
      padding: 0px;
      max-height: 0px;
    }
    // max-height: 100rem;
  }
  .footer {
    position: relative;
    background-color: @color-functional-white;
    border-top: 1px solid @color-functional-white;
    padding-bottom: .5rem;
    &.open {
      background-color: @color-functional-white;

      &>.img {
        transition: all .2s;
        transform: rotate(180deg)
      }
      border-bottom: 0px;
      border-top: 1px solid @color-functional-white;
      margin-top: -1.6rem;
    }
    .flex-arrow {
      width: 3rem;
      height: 1.6rem;
      background-color: @color-functional-white;
      position: absolute;
      left: 50%;
      text-align: center;
      cursor: pointer;
      margin-top: -1px;
      border-bottom: 1px solid @color-functional-white;
      border-right: 1px solid @color-functional-white;
      border-left: 1px solid @color-functional-white;
      &.open {
        background-color: @color-functional-white;
        &>.img {
          transform: rotate(180deg)
        }
        border-bottom: 0px;
        border-top: 1px solid @color-functional-white;
        margin-top: -1.55rem;
      }
    }
  }
  .apply-time /deep/ .haloe-form-item-error-tip {
    margin-left: 27.5rem;
  }
  &-simple {
    position: relative;
    border: 1px solid @color-complementary-7;
    padding-bottom: 1rem;
    .footer {
      // width: 100%;
      text-align: right;
      background-color: transparent;
      border-width: 0px;
      // display: block;
      // position: absolute;
      right: 1.6rem;
      bottom: 0px;
      .icon-btn {
        margin-left: 10px;
        i {
          transition: all .2s linear;
        }
        &.rotate-icon i {
          transform: rotate(-180deg);
        }
      }
      .footer-wrapper {
        font-size: 0px;
      }
    }

  }

  &-adapter {
    border: 1px solid @color-complementary-7;
    .adaptive-item-wrapper {
      margin-bottom: 0px;
      .adaptive-item {
        float: left;
        &.footer {
          float: right;
        }
      }
      &::after {
        clear: both;
        content: "";
        display: block;
      }
      .footer {
        display: block;
        background-color: transparent;
        border-top-color: transparent;
        .icon-btn {
          margin-left: 10px;
          i {
            transition: all .2s linear;
          }
          &.rotate-icon i {
            transform: rotate(-180deg);
          }
        }
        .footer-wrapper {
          text-align: right;
          margin-bottom: 1rem;
        }
      }
    }
  }
}