// Color Palette
@black: #000;
@white: #fff;
@gray-1: #f7f8fa;
@gray-2: #f2f3f5;
@gray-3: #ebedf0;
@gray-4: #dcdee0;
@gray-5: #c8c9cc;
@gray-6: #969799;
@gray-7: #646566;
@gray-8: #27282A;
@red: #FF3959;
@blue: #3370FF;
@orange: #FF7426;
@orange-dark: #ed6a0c;
@orange-light: #fffbe8;
@green: #3EC40F;
@bg-gray-1: #F7F8FA;

// Gradient Colors
@gradient-red: linear-gradient(to right, #ff6034, #ee0a24);
@gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);

// Component Colors
@text-color: @gray-8;
@active-color: @gray-2;
@active-opacity: 0.7;
@disabled-opacity: 0.5;
@background-color: @gray-1;
@background-color-light: #fafafa;
@text-link-color: #576b95;

// Padding
@padding-base: 2px;
@padding-xs: @padding-base * 2;
@padding-sm: @padding-base * 3;
@padding-md: @padding-base * 4;
@padding-lg: @padding-base * 6;
@padding-xl: @padding-base * 8;

// Font
@font-size-xs: 4px;
@font-size-sm: 12px;
@font-size-md: 14px;
@font-size-lg: 16px;
@font-weight-bold: 500;
@line-height-xs: 14px;
@line-height-sm: 18px;
@line-height-md: 20px;
@line-height-lg: 22px;
@base-font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue',
  Helvetica, Segoe UI, Arial, Roboto, 'PingFang SC', 'miui', 'Hiragino Sans GB',
  'Microsoft Yahei', sans-serif;
@price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial,
  sans-serif;

// Animation
@animation-duration-base: 0.3s;
@animation-duration-fast: 0.2s;
@animation-timing-function-enter: ease-out;
@animation-timing-function-leave: ease-in;

// Border
@border-color: @gray-3;
@border-width-base: 1px;
@border-radius-sm: 2px;
@border-radius-md: 4px;
@border-radius-lg: 8px;
@border-radius-common: 28px;
@border-radius-max: 999px;


// button
@button-primary-background-color: @orange;
@button-primary-border-color: @orange;
@button-border-radius: 28px;

// filed
@field-placeholder-text-color: #999;
@checkbox-checked-icon-color: @orange;

.van-button {
  font-size: 16px;
  .van-button__icon {
    margin-right: 6px;
  }
}
.van-button--gray {
  color: #999;
  background-color: @bg-gray-1;
  border: @button-border-width solid @bg-gray-1;
}

.van-button--black {
  color: #EDCFB3;
  background-color: #333;
  border: @button-border-width solid #333;
  padding: 0 6px;
  font-size: 12px;
}

.van-tag {
  border-radius: 4px;
}
.van-tag--primary {
  background-color: @orange;
}
.van-tag--medium {
  padding: 4px 8px;
}

//tab

// .u-tabs__wrapper {
//   height: auto;
//   .u-tabs__wrapper__nav {
//     font-size: 16px;
//     color: #595959;
//     justify-content: flex-start;
//     flex: none;
//     padding: 0 15px;
//     &:first-child {
//       padding-left: 20px;
//     }
//   }
//   // .van-tab--active {
//   //   font-size: 20px;
//   //   color: #000000;
//   //   font-weight: 600;
//   // }
//   .van-tabs__nav--line {
//     padding-bottom: 5px;
//   }
//   .u-tabs__wrapper__nav__line {
//     background: linear-gradient(90deg, #EF6E4D 0%, rgba(255, 255, 255, 0) 100%);
//     border-radius: 13px;
//     height: 5px;
//     bottom: 0;
//     // left: -10px;
//     transform: translateX(-100%);
//   }
// }