.pisell-lowcode__booking-add-time-header {
  margin-top: 10px;
  margin-bottom: 10px;
}

.pisell-lowcode__booking-add-time-body {
  padding: 10px 32px 30px;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;

  .pisell-lowcode__booking-add-time-hours {
    padding: 6px;
    color: var(--Gray-900, #101828);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    background: var(--Gray-50, #F9FAFB);
    margin: 10px 0;
    flex: 0 0 100%;
    position: sticky;
    top: 58px !important;
    z-index: 1;
  }

  .pisell-lowcode__booking-add-time-child-card-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;



    .pisell-lowcode__booking-add-time-child-card {
      flex: 0 0 calc(50% - 5px);
      border-radius: 10px;

      background: #FFF;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px 20px;
      cursor: pointer;
      position: relative;

      &::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        cursor: pointer;
        border-radius: 10px;
        border: 1px solid var(--Gray-true-300, #D6D6D6);
      }

      &.pisell-lowcode__booking-add-time-child-card-active {
        &::before {
          border-color: #7f56d9;
          border-width: 2px;
        }
      }

      .pisell-lowcode__booking-add-time-child-card-left {

        .pisell-lowcode__booking-add-time-child-card-left-time {
          color: var(--Gray-900, #101828);
          font-size: 20px;
          font-style: normal;
          font-weight: 500;
        }

        .pisell-lowcode__booking-add-time-child-card-left-price {
          color: var(--Gray-500, #667085);
          font-size: 16px;
          font-style: normal;
          font-weight: 400;
        }
      }

      .pisell-lowcode__booking-add-time-child-card-right {}
    }
  }

  .pisell-lowcode__booking-add-time-footer {
    width: 100%;
  }
}

.pisell-lowcode__booking-add-time-total-wrap {
  border-bottom: 1px solid var(--Gray-true-300, #f9fafb);
  margin: -10px -32px 10px;
  padding: 10px 32px 0;
  background-color: #f3f4f6;

  .pisell-lowcode__booking-add-time-summary-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: none;
    margin: 0;
    padding: 0 0 10px 0;

    .pisell-lowcode__booking-add-time-summary {
      padding-right: 20px;

      .pisell-lowcode__booking-add-time-summary-time {}

      .pisell-lowcode__booking-add-time-summary-total {}
    }

    .pisell-lowcode__booking-add-time-quantity-wrap {
      display: flex;
      align-items: center;
      justify-content: center;


      .pisell-lowcode__booking-add-time-quantity {
        margin-right: 14px;
        color: var(--Gray-500, #667085);
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        white-space: nowrap;
      }

      .pisell-lowcode__booking-add-time-quantity-select {
        min-width: 75px;
        border-radius: 30px;
        height: 44px;
        padding: 0 16px;
        background-color: var(--Gray-true-200, #E5E5E5);
      }
    }
  }
}