:root{
    --color-base: #313131 ;
    --color-main: #2F81FF ;
    --color-white: #FFFFFF ;
    --color-black: #000000 ;
    --color-text-base: #8C8C8C ;
    --color-bg-base: #F3F4F5 ;
    --color-text-input: #5F5F5F ;
    --color-text-input-placeholder: #A3A3A3;
    --color-text-tips: #BABABA ;
    --color-text-produce: #34C759;
    --color-text-expend: #FF9500;
    --color-footer-text: #1A1A1A ;
    --color-popper: #303133 ;
    --color-table-th: #555555;
    --color-table-hover: #F3FAFF;
    --color-input-label: #999999 ;
    --color-input-border: #B8E3FF ;
    --color-input-error-border: #FF4D4F ;
    --color-dialog-title: #333333 ;
    --color-coupon-dialog-red: #F5222D ;
    --color-coupon-dialog-bg: #F7F8FA ;
    --color-coupon-pink-bg: #FFEBEE;
    --color-border: #ebebeb ;
    --main-bg: #F3F4F5 ;
    /*Button*/
    --button-background-color: #DFF2FF ;
    --color-button-info: #F5FBFF ;
    --color-button-orange: #FF9F0A;
    --button-default-bg-color: #F9F9F9;
    --button-delete-bg-hover: #FFCCC7;
    --button-delete-text-hover: #FF505D;
    --button-dialog-cancel-bg: #F3F7FA ;
    --button-green: #32D74B ;
    --button-green-1: #2FEBE0 ;
 /*滚动条颜色*/
    --scrollbar-thumb: rgba(144,147,153,.5) ;
    --scrollbar-thumb-hover:rgba(144,147,153,.5);
    --scrollbar-border-radius: 10px ;
    --scrollbar-border-radius-track: 2px ;
    /*margin/padding*/
    --spacing-4: 4px;
    --spacing-6: 6px;
    --spacing-8: 8px;
    --spacing-10: 10px;
    --spacing-12: 12px;
    --spacing-14: 14px;
    --spacing-15: 15px;
    --spacing-16: 16px;
    --spacing-18: 18px;
    --spacing-20: 20px;
    --spacing-22: 22px;
    --spacing-24: 24px;
    --spacing-26: 26px;
    --spacing-30: 30px;
    --spacing-32: 32px;
    --spacing-36: 36px;
    --spacing-40: 40px;
    --spacing-50: 50px;
    /*字体大小 | 字体源*/
    --text-font-size-base: 14px ;
    --text-font-size-12: 12px ;
    --text-font-size-16: 16px ;
    --text-font-size-18: 18px ;
    --text-font-size-20: 20px ;
    --text-font-size-22: 22px ;
    --text-font-size-24: 24px ;
    --text-font-size-26: 26px ;
    --text-font-size-28: 28px ;
    --text-font-size-30: 30px ;
    --text-font-size-32: 32px ;
    --text-font-size-40: 40px ;
    --text-font-size-44: 44px ;
    --text-font-size-48: 48px ;
/*    border*/
    --border-radius-base: 12px ;
    --border-radius-20: 20px ;
    --border-radius-12: 12px ;
    --border-radius-4: 4px ;

}
/*@font-face {*/
/*    font-family: Montserrat-Regular;*/
/*    src: url("./Montserrat-Regular.otf");*/
/*}*/
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    /*font-family: 'SF Pro Text-Regular';*/
}

body {
    -webkit-text-size-adjust: 100% !important;
}

html, body,#app {
    /*font-family: "Microsoft YaHei", 微软雅黑, "MicrosoftJhengHei", 华文细黑, STHeiti, MingLiu;*/
    color: var(--color-base);
    font-size: var(--text-font-size-base);
}
i.menu-icon{
    font-size: 20px;
}
a{
    text-decoration: none;
    color: var(--color-base);
}
a:hover{
    color:var(--color-main) ;
}
li {
    list-style: none;
}
img {
    -o-object-fit: cover;
    object-fit: cover;
}
::-webkit-scrollbar {
    /*width: 3px !important;*/
    /*height: 0px !important;*/
    display: none;
}
.el-dialog::-webkit-scrollbar {
    width: 3px !important;
    height: 0px !important;
    display: block;
}
::-webkit-scrollbar-track {
    border-radius: 2px;
}

::-webkit-scrollbar-corner {
    background: var(--color-base);
}

::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
    border-radius: var(--spacing-10);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb);
}

::-ms-clear,
::-ms-reveal {
    display: none;
}
.bs-padding-10 {
    padding: var(--spacing-10);
}
.bs-padding-32 {
    padding: var(--spacing-32);
}
.bs-padding-16 {
    padding: var(--spacing-16);
}
.bs-padding-l-16 {
    padding-left: var(--spacing-16);
}
.bs-padding-right-16 {
    padding-right: var(--spacing-16);
}

.bs-padding-t-16 {
    padding-top: var(--spacing-16);
}
.bs-padding-b-16 {
    padding-bottom: var(--spacing-16);
}
.bs-padding-right-32 {
    padding-right: var(--spacing-32);
}
.bs-padding-left-32 {
    padding-left: var(--spacing-32);
}
.bs-padding-left-16 {
    padding-left: var(--spacing-16);
}
.bs-padding-top-32 {
    padding-top: var(--spacing-32);
}
.bs-padding-top-16 {
    padding-top: var(--spacing-16);
}
.bs-padding-bottom-32 {
    padding-bottom: var(--spacing-32);
}
.bs-padding-20 {
    padding: var(--spacing-20);
}
.bs-padding-30 {
    padding: var(--spacing-30);
}
.bs-padding-36 {
    padding: var(--spacing-36);
}
.bs-padding-left-10 {
    padding-left: var(--spacing-10);
}
.bs-padding-bottom-6 {
    padding-bottom: var(--spacing-6);
}
.bs-padding-bottom-10 {
    padding-bottom: var(--spacing-10);
}
.bs-padding-bottom-20 {
    padding-bottom: var(--spacing-20);
}
.bs-padding-bottom-32 {
    padding-bottom: var(--spacing-32);
}
.bs-padding-top-10 {
    padding-top: var(--spacing-10);
}
.bs-padding-top-20 {
    padding-top: var(--spacing-20);
}
.bs-padding-right-10 {
    padding-right: var(--spacing-10);
}
.bs-padding-right-6 {
    padding-right: var(--spacing-6);
}
.bs-padding-left-20 {
    padding-left: var(--spacing-20);
}
.bs-padding-right-20 {
    padding-right: var(--spacing-20);
}
.bs-padding-left-15 {
    padding-left: var(--spacing-15);
}
.bs-mt-4 {
    margin-top: var(--spacing-4);
}
.bs-mt-8 {
    margin-top: var(--spacing-8);
}
.bs-mt-10 {
    margin-top: var(--spacing-10);
}
.bs-mt-12 {
    margin-top: var(--spacing-12);
}
.bs-mt-16 {
    margin-top: var(--spacing-16);
}
.bs-mt-20 {
    margin-top: var(--spacing-20);
}

.bs-mt-22 {
    margin-top: var(--spacing-22);
}

.bs-mt-30 {
    margin-top: var(--spacing-30);
}
.bs-mt-32 {
    margin-top: var(--spacing-32);
}
.bs-mt-40 {
    margin-top: var(--spacing-40);
}
.bs-mt-50 {
    margin-top: var(--spacing-50);
}
.bs-mb-0{
    margin-bottom: 0;
}
.bs-mt-0{
    margin-top: 0;
}
bs-mt-5 {
    margin-top: 5px;
}
.bs-mt-40{
    margin-top: 40px;
}
.bs-mb-4 {
    margin-bottom: var(--spacing-4);
}

.bs-mb-6 {
    margin-bottom: var(--spacing-6);
}
.bs-mb-8 {
    margin-bottom: var(--spacing-8);
}
.bs-mb-10 {
    margin-bottom: var(--spacing-10);
}
.bs-mb-16 {
    margin-bottom: var(--spacing-16);
}
.bs-mb-18 {
    margin-bottom: var(--spacing-18);
}
.bs-mb-20 {
    margin-bottom: var(--spacing-20);
}
.bs-mb-22 {
    margin-bottom: var(--spacing-22);
}
.bs-mb-24 {
    margin-bottom: var(--spacing-24);
}
.bs-mb-26 {
    margin-bottom: var(--spacing-26);
}
.bs-mb-30 {
    margin-bottom: var(--spacing-30);
}
.bs-mb-32 {
    margin-bottom: var(--spacing-32);
}
.bs-mb-40 {
    margin-bottom: var(--spacing-40);
}
.bs-mt-90 {
    margin-top: 90px;
}
.bs-mr-0 {
    margin-right: 0;
}
.bs-mr-8 {
    margin-right: var(--spacing-8);
}
.bs-mr-10 {
    margin-right: var(--spacing-10);
}
.bs-mr-16 {
    margin-right: var(--spacing-16);
}
.bs-mr-20 {
    margin-right: var(--spacing-20);
}
.bs-mr-30 {
    margin-right: var(--spacing-30);
}
.bs-ml-8 {
    margin-left: var(--spacing-8);
}
.bs-ml-10 {
    margin-left: var(--spacing-10);
}
.bs-ml-16 {
    margin-left: var(--spacing-16);
}
.bs-ml-20 {
    margin-left: var(--spacing-20);
}
.bs-ml-32 {
    margin-left: var(--spacing-32);
}
.bs-margin-16 {
    margin: var(--spacing-16);
}
.bs-margin-t-b-16 {
    margin: 16px 0;
}
.bs-margin-l-r-16 {
    margin: 0 16px;
}
.bs-margin-r-16 {
    margin-right: 16px;
}
.bs-margin-32 {
    margin: 32px;
}
.bs-margin-t-32 {
    margin-top: 32px;
}
.bs-margin-b-32 {
    margin-bottom: 32px;
}
.bs-margin-l-32 {
    margin-left: 32px;
}
.bs-margin-r-32 {
    margin-right: 32px;
}
.bs-input,.bs-input .el-input__inner {
    width: 100%;
    height: 40px;
    line-height: 40px;
    transition: border-color ease-in-out 0.25s;
    color: var(--color-base);
    border-color: var(--color-border);
    border-radius: var(--border-radius-12);
    font-size: var(--text-font-size-16);
}
.bs-input.el-textarea{
    height: auto;
}
.bs-input .el-textarea__inner{
    width: 100%;
    height: auto!important;
    transition: border-color ease-in-out 0.25s;
    color: var(--color-base);
    border-color: var(--color-border);
    border-radius: var(--border-radius-12);
    font-size: var(--text-font-size-16);
}
.border-radius-12 {
    border-radius: var(--border-radius-12);
}
.bs-input:focus, .bs-input:hover,.bs-input .el-input__inner:focus,.bs-input .el-input__inner:hover,
.bs-input  .el-textarea__inner:focus,.bs-input  .el-textarea__inner:hover{
    border-color: var(--color-input-border);
}
.bs-form .el-form-item__label{
    color: var(--color-text-input) !important;
}
.bs-input::-moz-placeholder {
    font-size: var(--text-font-size-16);
    color: var(--color-text-input-placeholder);
}
.bs-input .el-input__prefix .el-input__icon,.bs-input .el-input__suffix-inner .el-input__icon,
.el-input .el-input__suffix .el-input__suffix-inner{
    line-height: 40px !important;
}
.bs-input::placeholder {
    color: var(--color-text-input-placeholder);
    font-size: var(--text-font-size-16);
}
.bs-flex{
    display: flex;
}
.bs-flex-items-center{
    align-items: center;
}
.bs-flex-items-end{
    align-items: end;
}
.bs-flex-items-baseline{
    align-items: baseline;
}
.bs-flex-items-flex-start{
    align-items: flex-start;
}
.bs-flex-justify-center{
    justify-content: center;
}
.bs-flex-space-between{
    justify-content: space-between;
}
.bs-flex-start{
    justify-content: flex-start;
}
.bs-flex-end{
    justify-content: flex-end;
}
.bs-flex-space-around{
    justify-content: space-around;
}
.bs-flex-space-end{
    justify-content: flex-end;
}
.bs-flex-wrap {
    flex-wrap : wrap;
}
.bs-flex-direction {
    flex-direction: column;
}
.bs-gap-6{
    gap: var(--spacing-6);
}
.bs-gap-8{
    gap: var(--spacing-8);
}
.bs-gap-10{
    gap: var(--spacing-10);
}
.bs-gap-16{
    gap: var(--spacing-16);
}
.bs-gap-32{
    gap: var(--spacing-32);
}
.bs-flex-1{
    flex: 1;
}
.bs-text-orange{
    color: var(--color-button-orange);
}
.bs-text-blue{
    color: var(--color-main);
}
.bs-text-light-blue {
    color: var(--color-input-border);
}
.bs-text-err{
    color: var(--button-delete-text-hover);
}
.bs-text-green{
    color: var(--button-green);
}
.bs-text-gray{
    color: var(--color-text-input);
}
.bs-text-base {
    color: var(--color-input-label);
}
.bs-text-base-black {
    color: var(--color-black);
}
.bs-text-product {
    color: var(--color-text-produce)
}
.bs-text-expend {
    color: var(--color-text-expend)
}
.bs-text-white {
    color: #FFFFFF;
}
.bs-text-font-12 {
    font-size: var(--text-font-size-12);
}
.bs-text-font-16 {
    font-size: var(--text-font-size-16);
}
.bs-text-font-18 {
    font-size: var(--text-font-size-18);
}
.bs-text-font-22 {
    font-size: var(--text-font-size-22);
}
.bs-text-font-26 {
    font-size: var(--text-font-size-26);
}
.bs-text-font-30 {
    font-size: var(--text-font-size-30);
}
.bs-text-font-32 {
    font-size: var(--text-font-size-32);
}
.bs-text-font-20 {
    font-size: var(--text-font-size-20);
}
.bs-text-weight-bold{
    font-weight: bold !important;
}
.bs-text-color-gray{
    color: var(--color-text-input);
    word-break: break-all;
    font-size: var(--text-font-size-16);
}
.bs-text-bg-gray {
    background-color: var(--color-text-input);
}
.bs-text-gray{
    color: var(--color-text-input);
}
.bs-text-bg-eb{
    background-color: var(--color-border);
}
.bs-bg-white {
    background-color: var(--color-white);
}
.bs-text-bg-orange{
    background-color: var(--color-button-orange);
}
.bs-text-bg-blue{
    background-color: var(--color-main);
}
.bs-text-bg-err{
    background-color: var(--button-delete-text-hover);
}
.bs-text-bg-green{
    background-color: var(--button-green);
 }
.bs-text-bg-green-1{
    background-color: var(--button-green-1);
}
.bs-text-bg-light-blue{
    background-color: var(--color-input-border);
}
.bs-underline-detail {
    border-bottom: 1px solid #D8D8D8;
}
.bs-underline-white{
    color: var(--color-white);
    border-bottom: 1px solid var(--color-white);
}
a.bs-underline-white:hover,.bs-underline-white:hover{
    border-bottom: 1px solid var(--color-main);
}
.bs-message-error{
    z-index:999!important;
}
.bs-underline{
    border-bottom: 1px solid var(--color-border);
}
.bs-bg {
  background-color:  var(--color-bg-base)
}
.bs-bg-time {
    background-color: #eaf9ee;
}
.bs-br-base {
    border-radius: var(--border-radius-base);
}
.bs-border-none {
    border: none;
}
.bs-over-text{
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    white-space: normal;
}
.bs-over-text-2{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    white-space: normal;
}
.bs-ellipsis{
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
}
.bs-text-center{
    text-align: center;
}
.bs-text-left{
    text-align: left;
}
.bs-text-right{
    text-align: right;
}
.bs-cursor{
    cursor: pointer;
}
/*换行*/
.bs-word-break{
    word-break: break-all;
}
/*线*/
.bs-line{
    width: 100%;
    height: 1px;
    background-color: var(--color-border);
    border-color: var(--color-border);
}
/*.bs-line-50 {*/
/*    height: 50px;*/
/*}*/
.bs-height-100 {
    height: 100%;
}