.page-bg {
    background-color: #d4ddf5;
    background-image: linear-gradient(0deg, #f4f4f4 1.1px, transparent 0), linear-gradient(90deg, #f4f4f4 1.1px, transparent 0);
    background-size: 20px 20px;
}

.bg00 {
    background-color: #ccc;
}

.bg01 {
    background-size: 100% 100%;
    /* background-image: url("./images/banner.jpg")  */
     background-color: #369;
}

.lyt-fc {
    display: flex;
    flex-direction: column
}

.lyt-fr {
    display: flex;
    flex-direction: row
}

.lyt-cc {
    justify-content: center;
    align-items: center
}

.green,
.green .x-menu-item-text,
.green .x-btn-inner,
.green .x-fa {
    color: forestgreen !important
}

.blue,
.blue .x-menu-item-text,
.blue .x-btn-inner,
.blue .x-fa {
    color: dodgerblue !important
}


.red,
.red .x-menu-item-text,
.red .x-btn-inner,
.red .x-fa {
    color: mediumvioletred !important
}

.orange,
.orange .x-menu-item-text,
.orange .x-btn-inner,
.orange .x-fa {
    color: darkorange !important
}


.treelist-with-nav {
    background-color: #32404e;
}

.x-treelist-item-expander {
    left: auto !important;
    right: 8px !important;
    line-height: 30px!important;
    top: 6px !important;
}

.x-treelist-row .x-treelist-item-wrap .x-treelist-item-icon {
    left: 4px;
    line-height: 32px!important;
}

 
.x-treelist-row .x-treelist-item-wrap .x-treelist-item-wrap {
    background-color: bisque !important;
}

.toc-menu-wrap {
    display: block;
}

.toc_menu_item_4 {
    width: 150px;
    text-align: center;
    display: block;
    float: left;
    margin: 10px;
    padding: 10px;
    background-color: #f5f5f5;
    color: #000000;
    border-radius: 5px;
    border-bottom: 5px solid #cccccc;
    cursor: pointer;
}

.toc_menu_item_4:hover {
    background-color: #ffc;
    border-bottom: 5px solid green;

}

.field-diabled .x-form-text-wrap{
    background-color: #eee!important;
    color:#493302!important;
}
.field-diabled .x-form-text-wrap input{
    background-color: #f5f5f5!important;
    border:#493302!important;
    color:#32404e
}
.field-readonly .x-form-text-wrap{
    background-color: #eee!important;
    color:#493302!important;
}
.field-readonly .x-form-text-wrap input{
    background-color: #f5f5f5!important;
    border:#493302!important;
    color:#32404e
}

.control{
    background-color: #5892cc4b;
}

.actioncolumn-icon-mr10{margin-right:10px}

.grid-checkcolumn-disabled{
    color:#000000;
    
    background-color: #eeeeeec0;
}
.grid-checkcolumn-disabled .x-grid-checkcolumn{  color:#000000;}
/* .grid-checkcolumn-disabled:nth-child(2n+1){
    color:#000000;
    background-color: #eee;
} */
 


.todayStatBox {}

.todayStatBox .stat-item {
    float: left;
    width: 150px;
    background-color: #fff;
    border-radius: 5px;
    margin: 8px;
    border: 1px solid #ccc
}

.todayStatBox .stat-item .stat-item-title {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: 5px;
    font-size: 11pt;
}

.todayStatBox .stat-item .stat-item-value {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #fff;
    padding: 10px;
    font-size: 14pt;
    font-weight: bold;
}

.todayStatBox .stat-item .stat-item-msg {
    padding: 5px;
    margin: 5px;
    font-size: 10pt;
    height: 40px;
    display: inline-block;
    word-break: break-all;
    overflow: hidden;
}

.todayStatBox .green .stat-item-title {
    background-color: green;
    color: #fff
}

.todayStatBox .blue .stat-item-title {
    background-color: blue;
    color: #fff
}

.todayStatBox .black .stat-item-title {
    background-color: black;
    color: #fff
}


.todayStatBox .orange .stat-item-title {
    background-color: orange;
    color: #fff
}


.state-302 .stat-item-title {
    background-color: #478058;
    color: #fff
}

.state-302 .stat-item-value {
    background-color: rgba(0, 128, 0, .1)!important;
    color: #000
}

.state-301 .stat-item-title {
    background-color: #FEC37D;
    color: #fff
}

.state-301 .stat-item-value {
    background-color: rgba(255, 165, 0, .1)!important;
    color: #000
}

.state-210 .stat-item-title {
    background-color: rgb(153, 51, 107);
    color: #fff
}

.state-210 .stat-item-value {
    background-color: rgba(51, 102, 153, 0.1)!important;
    color: #000
}

.state-200 .stat-item-title {
    background-color: #06040033;
    color: #fff
}

.state-200 .stat-item-value {
    background-color: rgba(233, 231, 226, 0.1)!important;
    color: #000
}

/* .todayStatBox .state-300 .stat-item-title {
    background-color: #369;
    color: #fff
}
.todayStatBox .state-300 .stat-item-msg {
    background-color: rgba(51,102,153,0.2);
    color: #000;
    overflow: hidden;
}
.todayStatBox .state-300 .stat-item-value {
    background-color: rgba(51,102,153,0.1);
    color: #000
} */


.state-400 .stat-item-title {
    background-color:#f63636;
    color: #fff
}

.state-400 .stat-item-value {
    background-color: rgba(255, 0, 0, 0.1)!important;
    color: #000
}

.field-diabled .x-form-text-wrap{
    background-color: #eee!important;
    color:#493302!important;
}
.field-diabled .x-form-text-wrap input{
    background-color: #f5f5f5!important;
    border:#493302!important;
    color:#32404e
}

.field-readonly .x-form-text-wrap{
    background-color: #eee!important;
    color:#493302!important;
}
.field-readonly .x-form-text-wrap input{
    background-color: #f5f5f5!important;
    border:#493302!important;
    color:#32404e
}

.mini-font div.x-grid-cell-inner {
    font-size: 9pt!important;
    font-weight: bold!important;
    color:#369!important;
}

.bgtran{
    background-color: transparent;
}
 
.readonly{
    background-color: #f5f5f5!important;
}
.readonly .x-form-field{
    border:#ccc;
    background-color: #eee!important;
    color:#000!important;
}

.todayStatBox {}

.todayStatBox .stat-item {
    float: left;
    width: 150px;
    background-color: #fff;
    border-radius: 5px;
    margin: 8px;
    border: 1px solid #ccc
}

.todayStatBox .stat-item .stat-item-title {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: 5px;
    font-size: 11pt;
}

.todayStatBox .stat-item .stat-item-value {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #fff;
    padding: 10px;
    font-size: 14pt;
    font-weight: bold;
}

.todayStatBox .stat-item .stat-item-msg {
    padding: 5px;
    margin: 5px;
    font-size: 10pt;
    height: 40px;
    display: inline-block;
    word-break: break-all;
    overflow: hidden;
}

.todayStatBox .green .stat-item-title {
    background-color: green;
    color: #fff
}

.todayStatBox .blue .stat-item-title {
    background-color: blue;
    color: #fff
}

.todayStatBox .black .stat-item-title {
    background-color: black;
    color: #fff
}


.todayStatBox .orange .stat-item-title {
    background-color: orange;
    color: #fff
}


.state-302 .stat-item-title {
    background-color: #478058;
    color: #fff
}

.state-302 .stat-item-value {
    background-color: rgba(0, 128, 0, .1) !important;
    color: #000
}

.state-301 .stat-item-title {
    background-color: #FEC37D;
    color: #fff
}

.state-301 .stat-item-value {
    background-color: rgba(255, 165, 0, .1) !important;
    color: #000
}

.state-210 .stat-item-title {
    background-color: rgb(153, 51, 107);
    color: #fff
}

.state-210 .stat-item-value {
    background-color: rgba(51, 102, 153, 0.1) !important;
    color: #000
}

.state-200 .stat-item-title {
    background-color: #06040033;
    color: #fff
}

.state-200 .stat-item-value {
    background-color: rgba(233, 231, 226, 0.1) !important;
    color: #000
}

/* .todayStatBox .state-300 .stat-item-title {
    background-color: #369;
    color: #fff
}
.todayStatBox .state-300 .stat-item-msg {
    background-color: rgba(51,102,153,0.2);
    color: #000;
    overflow: hidden;
}
.todayStatBox .state-300 .stat-item-value {
    background-color: rgba(51,102,153,0.1);
    color: #000
} */


.state-400 .stat-item-title {
    background-color: #f63636;
    color: #fff
}

.state-400 .stat-item-value {
    background-color: rgba(255, 0, 0, 0.1) !important;
    color: #000
}

.field-must .x-form-text-wrap {
    background-color: #f8cdcd !important;
    color: #493302 !important;
}

.field-must .x-form-text-wrap input {
    background-color: #f8cdcd !important;
    border: #493302 !important;
    color: #32404e
}

.field-diabled .x-form-text-wrap {
    background-color: #eee !important;
    color: #493302 !important;
}

.field-diabled .x-form-text-wrap input {
    background-color: #f5f5f5 !important;
    border: #493302 !important;
    color: #32404e
}

.field-readonly .x-form-text-wrap {
    background-color: #eee !important;
    color: #493302 !important;
}

.field-readonly .x-form-text-wrap input {
    background-color: #f5f5f5 !important;
    border: #493302 !important;
    color: #32404e
}

.mini-font div.x-grid-cell-inner {
    font-size: 9pt !important;
    font-weight: bold !important;
    color: #369 !important;
}

.bgtran {
    background-color: transparent;
}

.readonly {
    background-color: #f5f5f5 !important;
}

.readonly .x-form-field {
    border: #ccc;
    background-color: #eee !important;
    color: #000 !important;
}

.bg-tran {
    background-color: transparent;
}


/*#region*/
.bi-1001 {
    color: white;
    height: 100%;
    width: 100%;
}

.bi-1001 * {
    background-color: transparent;
}

.bi-1001 .box {
    border: 1px solid rgba(71, 39, 186, 0.31);
    margin: 3px
}

.bi-1001 .body {
    padding: 10px;
}



.bi-1001 .bg {
    background: url('../../../yizhuo/resources/images/bg1002.png') no-repeat top center;
    background-size: cover;
    height: 100%;
    width: 100%;
    position: absolute;
    x: 0;
    y: 0;
    z-index: -1000;
    filter: blur(3px)
}

.bi-1001 .title {

    color: white;
    font-weight: bold;
    text-align: center;
    line-height: 36px;
}

.bi-1001 .title img {
    border-radius: 5px;
    border: 4px solid white;
    width: 64px;
    height: 64px;
    line-height: 48px;
    margin-right: '20px'
}

.bi-1001 .title .context {
    margin-left: 20px;
    font-family: "Microsoft Yahei";
    color: white;
    font-weight: bold;
    font-size: 32px;
    padding: 10px 20px;
    background-color: #ffffff50;
    border-radius: 5px;

}

.bi-1001 .main {
    margin-top: 20px;
    text-align: center;
}

.bi-1001 .todayStatBox .stat-item {
    position: relative;
    float: left;
    width: 200px;
    background-color: #fff;
    border-radius: 5px;
    margin: 10px;
    border: 1px solid #ccc
}

.bi-1001 .todayStatBox .stat-item .stat-item-title {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: 5px 2px;
    text-align: center;
    font-size: 11pt;
}

.bi-1001 .todayStatBox .stat-item .stat-item-value {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #fff;
    width: 100%;
    text-align: center;
    padding: 10px;
    font-size: 14pt;
    font-weight: bold;
    position: relative;
}

.bi-1001 .todayStatBox .stat-item .stat-item-msg {
    padding: 5px;
    margin: 5px;
    font-size: 10pt;
    height: 40px;
    display: inline-block;
    word-break: break-all;
    overflow: hidden;
}

.bi-1001 .todayStatBox .green .stat-item-title {
    background-color: green;
    color: #fff
}

.bi-1001 .todayStatBox .blue .stat-item-title {
    background-color: blue;
    color: #fff
}

.bi-1001 .todayStatBox .black .stat-item-title {
    background-color: black;
    color: #fff
}


.bi-1001 .todayStatBox .orange .stat-item-title {
    background-color: orange;
    color: #fff
}

.bi-1001 .column-white {
    color: white;
    font-size: 16px;
    padding: 5px;
}

.bi-1001 .stat-item-ou {
    position: absolute;
    display: block;
    width: 32px;
    /* height:100%; */
    height: 32px;
    border-radius: 50%;
    line-height: 32px;
    background-color: #369;
    color: white;
    left: 4px;
    bottom: 2px;

}

.bi-1001 .currentTitle {
    font-size: 32px;
    color: white;
    margin-top: 0px;
    font-family: "微软雅黑";
    line-height: 48px;
    text-align: center;


}

.bi-1001 .currentDate {
    font-size: 32px;
    color: white;
    margin-top: 0px;
    font-family: "微软雅黑";
    line-height: 48px;
    text-align: center;

}

.OU102 .stat-item-ou {
    background-color: #369;
}

.OU103 .stat-item-ou {
    background-color: green;
}

.OU104 .stat-item-ou {
    background-color: rgb(243, 57, 240);
}

/*#endregion*/

.icon-red {
    color: red
}

.icon-green {
    color: green
}

.icon-orange {
    color: orange
}

.icon-blue {
    color: blue
}

.icon-purple {
    color: purple
}

.icon-yellow {
    color: yellow
}

.icon-brown {
    color: brown
}

.icon-margin-l5 {
    margin-left: 5px;
}

.icon-margin-r5 {
    margin-right: 5px;
}

.icon-margin-lr5 {
    margin-left: 5px;
    margin-right: 5px;
}


/* 日期时间选择器样式 */
.h2mini7-datetime-picker {
    width: auto !important;
}

.h2mini7-time-panel {
    padding: 10px;
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
    text-align: center;
}

.h2mini7-time-header {
    font-weight: bold;
    margin-bottom: 10px;
    color: #333;
}

.h2mini7-time-slider-container {
    margin: 0 auto 10px;
    width: 200px;
}

.h2mini7-time-slider {
    margin-bottom: 5px;
}

.h2mini7-time-value {
    font-size: 14px;
    font-weight: bold;
    color: #157fcc;
    margin-bottom: 10px;
}

.h2mini7-time-fields {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 5px;
}

.h2mini7-time-separator {
    margin: 0 5px;
    font-size: 16px;
    font-weight: bold;
}


/* 组件根元素样式 */
.multiple-progress-widget {
    padding: 5px;
}

/* 进度条容器 */
.multiple-progress-container {
    width: 100%;
}

/* 单个工序的样式 */
.process-step {
    margin-bottom: 10px;
    font-size: 12px;
}

.step-name {
    margin-bottom: 3px;
}

.progress-bar {
    height: 12px;
    background-color: #f0f0f0;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 3px;
}

.progress-fill {
    height: 100%;
    background-color: #4CAF50;
    /* 默认绿色进度条 */
    transition: width 0.3s ease;
    /* 平滑动画效果 */
}

.step-percent {
    text-align: right;
    font-size: 11px;
    color: #666;
}

.feedback-press-btn {}

.feedback-press-btn .x-btn-inner-default-small {
    font-size: 32px !important;
    font-weight: bold !important;
    line-height:36px!important;
}
.feedback-press-btn .x-fa{
     font-size: 24px !important;
    font-weight: bold !important;
}

.tdCls-14{
    font-size: 14px;
    padding:2px;
    font-weight:600;
    height:75
}
.tdCls-16{
    font-size: 16px;
    padding:2px;
}

.tdCls-18{
    font-size: 18px;
}
.tdCls-24{
    font-size: 24px;
    padding:3px;
}