/*-----start:盒模型弹性布局-----*/
.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

/*子元素排列：垂直排列*/
.flex-direction-column {
    -webkit-box-orient: vertical;
    -webkit-flex-flow: column;
    -ms-flex-flow: column;
    flex-flow: column;
}

/*子元素：自动占满剩余的空间*/
.flex-1 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

/*子元素：水平居中*/
.flex-pack-center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

/*子元素：垂直居中*/
.flex-align-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

/*子元素：垂直居中 + 水平居中*/
.flex-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;

    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

/*子元素：两端对齐*/
.flex-pack-justify {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

/*-----end:盒模型-----*/

/*-----start:盒模型 新版-----*/
/*flex水平排 + 垂直居中 + 水平居中*/
.flex-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*flex水平排 + 垂直居中 + 水平左对齐*/
.flex-justify-start {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*flex水平排 + 垂直居中 + 水平右对齐*/
.flex-justify-end {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*flex水平排 + 垂直居中 + 水平两端对齐*/
.flex-justify-between {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*flex水平排 + 垂直居中 + 水平均匀排列(周围空间相等)*/
.flex-justify-around {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -ms-flex-pack: distribute;
    -webkit-justify-content: space-around;
    justify-content: space-around;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*flex水平排 + 垂直居中 + 水平均匀排列(间隔相等)*/
.flex-justify-evenly {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -ms-flex-pack: distribute;
    -webkit-justify-content: space-evenly;
    justify-content: space-evenly;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*flex水平排 + 水平居中 + 垂直顶部对齐*/
.flex-align-start {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;

    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
}

/*flex水平排 + 水平居中 + 垂直底部对齐*/
.flex-align-end {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;

    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-align-items: flex-end;
    align-items: flex-end;
}

/*flex垂直排*/
.flex-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

/*flex垂直排 + 垂直居中 + 水平居中*/
.flex-col-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;

    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
/*flex垂直排 + 垂直居中 + 水平左对齐*/
.flex-col-justify-start {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;

    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
/*flex垂直排 + 垂直居中 + 水平右对齐*/
.flex-col-justify-end {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;

    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
/*flex垂直排 + 垂直居中 + 水平均匀排列(周围空间相等)*/
.flex-col-justify-around {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;

    -ms-flex-pack: distribute;
    -webkit-justify-content: space-around;
    justify-content: space-around;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
/*flex垂直排 + 垂直居中 + 水平两端对齐*/
.flex-col-justify-between {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;

    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
/*flex垂直排 + 垂直居中 + 水平均匀排列(间隔相等)*/
.flex-col-justify-evenly {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;

    -ms-flex-pack: distribute;
    -webkit-justify-content: space-evenly;
    justify-content: space-evenly;

    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
/*flex垂直排 + 水平居中 + 垂直左对齐*/
.flex-col-align-start {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;

    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;

    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
}

/*flex垂直排 + 水平居中 + 垂直右对齐*/
.flex-col-align-end {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;

    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;

    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-align-items: flex-end;
    align-items: flex-end;
}

/*-----end:盒模型 新版-----*/

/*-----start:配色-----*/
.ap-color-blue {
    color: #1890FF;
}

.ap-color-green {
    color: #13CE66;
}

.ap-color-yellow {
    color: #ffba00;
}

.ap-color-red {
    color: #ff4949;
}

.ap-color-gray {
    color: #909399;
}

.ap-bg-blue {
    background-color: #1890FF;
    color: white;
}

.ap-bg-green {
    background-color: #13CE66;
    color: white;
}

.ap-bg-yellow {
    background-color: #ffba00;
    color: white;
}

.ap-bg-red {
    background-color: #ff4949;
    color: white;
}

.ap-bg-gray {
    background-color: #909399;
    color: white;
}

/*-----end:color-----*/
/*-----start:tag-----*/
.ap-tag {
    display: inline-block;
    padding: 0 10px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;

    background-color: #ecf5ff;
    color: #1890FF;
    border: 1px solid #d9ecff;
}

.ap-tag-success {
    display: inline-block;
    padding: 0 10px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;

    background-color: #f0f9eb;
    color: #13CE66;
    border: 1px solid #e1f3d8;
}

.ap-tag-info {
    display: inline-block;
    padding: 0 10px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;

    background-color: #f4f4f5;
    color: #909399;
    border: 1px solid #e9e9eb;
}

.ap-tag-warning {
    display: inline-block;
    padding: 0 10px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;

    background-color: #fdf6ec;
    color: #ffba00;
    border: 1px solid #faecd8;
}

.ap-tag-danger {
    display: inline-block;
    padding: 0 10px;
    border-radius: 4px;
    box-sizing: border-box;
    white-space: nowrap;

    background-color: #fef0f0;
    color: #ff4949;
    border: 1px solid #fde2e2;
}

/*-----end:tag-----*/

/*----- 表单：start -----*/
.ap-form-row {
    width: 100%
}

/*----- 表单：end -----*/

/*----- 分隔线 -----*/
.ap-split-line {
    background-color: #DCDFE6;
    height: 1px;
    margin: 5px 0px;
}

/*----- 单行超出省略 -----*/
.ap-ellipse {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*----- 权限 -----*/
.ap-readonly {
    background-color: #f5f7fa;
    border-color: #e4e7ed;
    color: #c0c4cc;
    cursor: not-allowed;
}

/*----- 代码式样 -----*/
.api-code {
    color: #c7254e;
    background-color: #f9f2f4;
    border-radius: 4px;
    padding: 0 5px;
    white-space: pre;
    width: fit-content;
}
.api-memo {
    color: #9e9e9e;
}