@import '../helpers/helpers';

.checkout-widget {
  &__voucher-accordion {
    margin-top: 10px;
  }

  &__voucher-toggle {
    margin-bottom: 8px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    color: $blue;
    font-size: .875rem;

    &.collapsed {
      margin-bottom: 0;

      .checkout-widget__icon {
        transform: rotate(180deg);
      }
    }
  }

  &__icon {
    width: 16px;
    height: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  &__voucher-section {
    margin-top: 1rem;
  }

  &__voucher-list {
    list-style: none;
    padding: 0;
  }

  &__voucher-value {
    font-weight: bold;
  }
}

.collapsing {
  height: 0;
  overflow: hidden;
  transition: height .3s ease-in-out;
}

.collapse.show {
  height: auto;
  transition: height .3s ease-in-out;
}