.scrollArea, div#grid {
    background-color: #fff;
    flex: 1;
}

.dbgrid {
    border-width: 1px;
    border-collapse: collapse;
    word-break: break-word;
    width: 100%;
    border-image: none;
    border: 1px solid #eeeeee;
    border-spacing: 0;
}

.dbgrid tr {
    width: 100%;
}

.dbgrid td {
    position: relative;
    z-index: 5;
    line-height: 1.6em;
    padding: 0 4px;
    border-bottom: 1px solid #eeeeee;
    cursor: pointer;
}

.dbgrid th {
    z-index: 101;
    font-weight: normal;
    line-height: 1.2em;
    position: sticky;
    top: -1px;
    box-sizing: content-box;
    padding: 4px;
}

.dbgrid tr>th {
    background-color: var(--s-gridThBgc);
}

.dbgrid tr>td,
.dbgrid tr>th {
    height: 1.75em;
    padding: 0 4px;
}

.dbgrid tr>th:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    bottom: -1px;
    height: 1px;
    background-color: #C3CBDD;
    z-index: 10;
}

.dbgrid tr>th:not(tr>th:last-child):after {
    content: "";
    position: absolute;
    right: 0;
    width: 1px;
    top: 0;
    bottom: 0;
    background-color: #fafafa;
    z-index: 10;
}

.dbgrid tr>td:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    bottom: -1px;
    height: 1px;
    background-color: #eeeeee;
    z-index: 10;
}

.dbgrid tr>td:not(tr>td:last-child):after {
    content: "";
    position: absolute;
    right: 0;
    width: 1px;
    top: 0;
    bottom: 0;
    background-color: #eeeeee;
    z-index: 10;
}

.dbgrid tr>th:not(tr>th:last-child):after,
.dbgrid tr>td:before,
.dbgrid tr>td:not(tr>td:last-child):after {
    background-color: #C3CBDD;
}

.dbgrid tr:not(:first-child) td {
    background-color: #ffffff;
}

.dbgrid tr:not(:first-child) td>input[type='checkbox'] {
    vertical-align: middle;
}

.dbgrid tr:hover td {
    background-color: #d7ffef !important;
}
/* VuiForm 样式 start */
form.vuiForm {
    padding: 0 12px;
}

/* 不带查询栏位的 */
form.vuiForm div.searchHead {
    justify-content: space-between;
    align-items: center;
    width: auto;
}

form.vuiForm div.searchHead>span {
    display: block;
    font-weight: bold;
    position: relative;
    padding-right: 14px;
}

form.vuiForm div.searchHead:not(.searchTextButton) {
    border-bottom: 1px solid #F7F7F7;
}

form.vuiForm div.searchHead:not(.searchTextButton)>div.searchFormButtonDiv {
    justify-content: flex-end;
    padding: .25rem 0;
}

form.vuiForm div.searchHead>div [role="configTemplate"] {
    position: relative;
}

/* 带有查询栏位的查询头 */
form.vuiForm div.searchTextButton {
    justify-content: unset;
    padding: 8px 0 0;
}

form.vuiForm [role="configTemplate"],
form.vuiForm div.searchTextButton>div [role="configTemplate"] {
    width: 1.75rem;
    height: 1.75rem;
    position: absolute;
}

form.vuiForm .searchTextButton>li>label:first-child {
    display: flex;
}

form.vuiForm .searchTextButton>li:not(.searchMaxRecord) {
    flex: none;
}

form.vuiForm .searchTextButton>li>div {
    margin-left: 0;
}

form.vuiForm .searchTextButton>li.searchMaxRecord input {
    text-align: left;
}

form.vuiForm .searchTextButton>.searchFormButtonDiv {
    margin-left: 0;
    width: 7em;
    display: flex;
    justify-content: flex-end;
}

form.vuiForm .searchTextButton>.searchFormButtonDiv button {
    height: 30px;
    background: var(--s-search-button-color);
}

form.vuiForm .searchTextButton>.searchFormButtonDiv button:hover {
    background: var(--s-search-button-hover-color);
}

form.vuiForm ul {
    padding: 4px 0 4px;
    display: flex;
    flex-wrap: wrap;
}

form.vuiForm .searchHead:not(.searchTextButton)+ul {
    padding: 8px 0 4px;
}

form.vuiForm li>div>input[type='text'],
form.vuiForm li>div>input[type='number'],
form.vuiForm li>div>input[type='date'],
form.vuiForm li>div>input[type='password'],
form.vuiForm li>div>select {
    height: 1.75rem;
    line-height: 1.75rem;
}

form.vuiForm li>div.dateArea>span:first-of-type {
    height: 1.75rem;
    line-height: 1.75rem;
}

form.vuiForm li>div.dateArea>input[type="text"]:first-of-type {
    min-width: 5.5rem;
    max-width: 7em;
}

form.vuiForm li>label:first-child {
    min-height: 1.75rem;
    height: auto;
    line-height: 1;
    text-align: right;
    justify-content: flex-end;
    width: 7em;
    margin-right: 8px;
}

form.vuiForm li,
form.vuiForm .searchTextButton>li.searchMaxRecord {
    width: 25%;
}

form.vuiForm li {
    padding: 0 6px 4px 0;
}

form.vuiForm li>div:not([role="switch"]) {
    border-color: var(--s-border);
}

form.vuiForm div[role='switch'] {
    width: 7em;
    text-align: right;
    padding-top: .25rem;
}

form.vuiForm div[role='switch']+label {
    padding-top: .25rem;
}

/* 生效于tabHead中没有自定义查询的场景 */
form.vuiForm div.searchHead:not(.searchTextButton)>div.searchFormButtonDiv:not(.tabsSearchBtn) {
    flex: 1;
}

@media only screen and (max-width: 1650px) and (orientation: landscape) {

    form.vuiForm li,
    form.vuiForm .searchTextButton>li.searchMaxRecord {
        width: 33.3%;
    }
}
/* VuiForm 样式 end */