/* Source: css/qaqc.css */
body {
	font-size: 13px !important;
}

.pq-grid {
	background-color: #ffffff !important;
	font-size: 13px !important;
}

div.pq-grid * {
	font-size: 13px !important;
}

div.pq-grid input[type="checkbox"]~i {
	font-size: 20px !important;
}

div.pq-theme {
	border: none !important;
}

.pq-theme>.pq-grid-top {
	background: #ffffff;
	border: none !important;
}

.pq-grid-center-o {
	margin-top: 5px !important;
	border: 1px solid #c5c5c5;
	border-bottom: none !important;
}

.pq-grid-footer.pq-pager {
	border-bottom: 1px solid #c5c5c5;
	border-top: none !important;
}

.pq-theme>.pq-grid-bottom {
	border: 1px solid #c5c5c5;
	border-top: none !important;
}

.pq-toolbar>.pq-separator,
.pq-toolbar>button,
.pq-toolbar>div,
.pq-toolbar>input,
.pq-toolbar>label,
.pq-toolbar>p,
.pq-toolbar>select,
.pq-toolbar>span,
.pq-toolbar>textarea {
	margin-left: 0px !important;
}

.pq-toolbar {
	padding-left: 0px !important;
	text-align: left !important;
}

.row label {
	font-size: 14px !important;
}

.form_edit input,
.form_edit select {
	font-size: 14px !important;
}

.form-control {
	font-size: 14px !important;
}

.h4,
h4 {
	font-size: 14px !important;
	font-weight: bold;
}

.pq-group-header {
	background: #ffffff;
	border: none !important;
}

.intro-y.box.p-0.row.ng-scope,
.listForm_divContent {
	padding: 15px !important;
	background: #ffffff;
	margin-bottom: 20px;
	-webkit-border-radius: 0 0 4px 4px;
	border-radius: 0 0 4px 4px;
	border: 1px solid #d4d5d7;
}

.intro-y.box.p-0.row.ng-scope .col-sm-12 {
	padding-top: 15px !important;
}

.intro-y.box.p-0.row.ng-scope .col-sm-12.p-0 {
	margin-top: 0px !important;
}

.row>[class^="col-"] {
	padding-left: 10px !important;
	padding-right: 10px !important;
}

.btn-group-sm>.btn,
.btn-sm {
	font-size: 13px !important;
	height: 32px !important;
}

.mr-2,
.mx-2 {
	margin-right: 4px !important;
}

.col-md-2.col-sm-2.btn_css .ml-3,
.col-12.col-sm-6 .ml-3 {
	font-weight: bold;
}

.form-control.icon.mr-2.ng-pristine.ng-valid.ng-empty.ng-touched,
.form-control.icon.mr-2.ng-valid.ng-touched.ng-not-empty.ng-dirty.ng-valid-parse {
	font-size: 13px !important;
}

.fa.fa-search {
	color: #728196 !important;
	font-size: 13px !important;
}

.col-12.tt_table>.row {
	padding-top: 15px !important;
}

.d-block.w-100.h-100 {
	margin-top: 10px !important;
}

.pq-grid-top>.pq-toolbar>button:nth-child(3) {
	display: none !important;
}

.pq-filter-icon {
	display: none;
}

.pq-grid-header-search-row>.pq-grid-col>.pq-td-div {
	width: 100%;
}

.qaqc-attachment-image { display: inline-flex; align-items: center; max-width: 100%; cursor: zoom-in; }
.qaqc-attachment-image span { min-width: 0; }
.qaqc-attachment-viewer.modal { z-index: 11000 !important; }
.qaqc-attachment-viewer .modal-dialog { width: calc(100% - 24px); max-width: 1000px; margin: 12px auto; }
.qaqc-attachment-viewer .modal-content { display: flex; flex-direction: column; max-height: calc(100dvh - 24px); }
.qaqc-attachment-viewer .modal-header { gap: 8px; flex: 0 0 auto; align-items: center; }
.qaqc-attachment-viewer .modal-header .close { margin-left: auto; }
.qaqc-attachment-viewer .qaqc-image-scroll { min-height: 0; overflow: auto; padding: 0; background: #171b1d; }
.qaqc-attachment-viewer .qaqc-image-scroll img { display: block; max-width: none; height: auto; }

.pq-editor-focus.d-block.w-100.h-100 {
	margin-top: 0 !important;
}

@media (max-width: 767.98px) {
	.page-header-fixed {
		padding-top: 0px !important;
	}

	.content {
		padding: 0px !important;
	}
}

/* Source: css/qaqc_v2.css */
.table_CongViec {
    /* background: #fff; */
    text-align: left;
    width: 100%;
}

.table_CongViec.checklist-table-grid {
    table-layout: fixed;
}

.checklist-table-grid>tbody>tr>td:not([colspan]) {
    box-sizing: border-box;
    width: auto !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    vertical-align: top;
}

.table_CongViec tr:last-child:hover {

    /* background: #1c2b3a26 !important; */
}

tr.custom_hoverTr:has(> td:hover) {
    background: #007bff;
}

.table_CongViec tr:nth-child(even) {
    background: none;
}

.table_CongViec thead {
    background: white;
    position: sticky;
    top: 64px;
    z-index: 1012;
}

.table_CongViec tr {
    padding: 0;
    margin: 5px;
}

.table_CongViec td {
    padding: 0;
    margin: 5px;
}

.table_CongViec td[colspan] {
    border: none;
}

.table_CongViec .cell-input {
    width: 20px;
    padding: 0 5px;
}

.table_CongViec .cell-members {
    width: 100px;
}

.table_CongViec .indent,
.table_CongViec .un_indent {
    display: inline-block;
    position: relative;
}

.table_CongViec .parent>.cell-name>.indent,
.table_CongViec .parent>.cell-name>.un_indent {
    margin-right: 5px;
}

.table_CongViec .parent>.nodeTitle>.cell-name>.indent>.iconTree {
    content: "";
    font-family: FontAwesome;
    display: inline-block;
    -moz-transition: -moz-transform 0.3s;
    -o-transition: -o-transform 0.3s;
    -webkit-transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    color: #3B9AE1;
}

.table_CongViec .opened>tr>.nodeTitle>.cell-name>.indent>.iconTree {
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.table_CongViec .parent>.iconLevelParent>.indent>.iconTree {
    content: "";
    font-family: FontAwesome;
    display: inline-block;
    -moz-transition: -moz-transform 0.3s;
    -o-transition: -o-transform 0.3s;
    -webkit-transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    color: #3B9AE1;
}

.table_CongViec .opened>tr>.iconLevelParent>.indent>.iconTree {
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.table_CongViec .opened>.children {
    display: table-row;
}

.status_TypeDisplay_Table_Order.opened .children {
    display: table-row;
}

.table_CongViec .children {
    display: none;
}

.table_CongViec .borderNode {
    position: absolute;
    width: 48%;
    height: 50%;
    /* padding: 0; */
    /* margin: 0; */
    border-left: 1px dotted black;
    top: 0;
    left: 9%;
    border-bottom: 1px dotted black;
}

.table_CongViec .indent .borderNodeBottom {
    content: "";
    display: block;
    width: 40%;
    position: absolute;
    top: 50%;
    /* bottom: 0; */
    left: 11px;
    border-bottom: 1px dotted black;
}

.table_CongViec .un_indent .borderNodeBottom {
    content: "";
    display: block;
    width: 40%;
    position: absolute;
    top: 50%;
    /* bottom: 0; */
    left: 11px;
    border-bottom: 1px dotted black;
}

.table_CongViec .indent .borderNodeLeft {
    width: 100%;
    position: absolute;
    height: 109%;
    top: -14px;
    /* bottom: 0; */
    left: 11px;
    border-left: 1px dotted black;
}

.table_CongViec .un_indent .borderNodeLeft {
    width: 100%;
    position: absolute;
    height: 109%;
    top: -14px;
    /* bottom: 0; */
    left: 11px;
    border-left: 1px dotted black;
}

i.fa.fa-caret-right.no_iconTree {
    color: transparent;
}

.table_CongViec i.fa.fa-caret-right {
    font-size: 15px;
}

.table_CongViec .cell-name {
    cursor: pointer;
    display: flex;

    /* width: 30%; */
    padding: 5px 0;
}

.table_CongViec .nodeTitle {
    font-size: 15px;
    width: 300px;
}

.table_CongViec .nodeTitle_Content {
    -webkit-box-flex: 1;
    flex: 1;
    padding-left: 5px;
}

.no_BorderInput {
    border: none;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: textfield !important;
}

.no_BorderInput::-webkit-inner-spin-button,
.no_BorderInput::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

.nodeTitle_Icon_Edit {
    width: 20px;
    height: 20px;
    color: #2a2e347a !important;
    font-size: 16px !important;
    border: 1px solid #e9ebf0;
    text-align: center;
    fill: #7c828d;
    background: #fff;
    border-radius: 4px;
    display: none;
    margin-right: 0px !important;
}

.nodeTitle:hover .nodeTitle_Icon_Edit {
    display: inline-block;
}

/* .nodeTitle:hover~tr {
	background: red;
} */

.popup_TamQuanTrong {
    position: absolute;
    display: none;
    z-index: 100;
    width: 100px;
    height: auto;
    background: #fff;
    padding: 5px;
}

.popup_CongTac {
    position: absolute;
    display: none;
    z-index: 100;
    width: 300px;
    height: auto;
    background: #fff;
    padding: 5px;
    font-size: 13.5px;
}

.popup_RuiRo {
    position: absolute;
    display: none;
    z-index: 100;
    width: 300px;
    height: auto;
    background: #fff;
    padding: 5px;
    font-size: 13.5px;
}

.popup_TrangThai {
    position: absolute;
    display: none;
    z-index: 100;
    width: 200px;
    height: auto;
    background: #fff;
    padding: 5px;
    font-size: 13.5px;
}

.itemCongTac {
    display: flex;
    padding: 2px;
}

.itemCongTac:hover .action_editCongTac {
    display: inline-block;
}

.action_editCongTac {
    display: none;
}

.popup_DangLoi_MucDo_Form {
    position: absolute;
    display: none;
    z-index: 100;
    width: 100px;
    height: auto;
    background: #fff;
    padding: 5px;
}

.popup_DangLoi_MucDo_Form_RuiRo {
    position: absolute;
    display: none;
    z-index: 100;
    width: 100px;
    height: auto;
    background: #fff;
    padding: 5px;
}

.popup_DangLoi_MucDo {
    position: absolute;
    display: none;
    z-index: 100;
    width: 150px;
    height: auto;
    background: #fff;
    padding: 5px;
    border: 1px solid #343a4070;
    font-size: 14px;
    font-weight: bold;
}

.parent_popup_DangLoi_MucDo {
    position: relative;
}

.parent_carousel {
    display: inline-block;
    position: relative;
    width: 100%;
}

.icon_DangLoi_MucDo img {
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 9;
}

td.nodeTamQuanTrong {
    width: 115px;
    font-size: 13.5px;
}

td.nodeSoNgay {
    width: 120px;
    font-size: 13.5px;
}

td.nodeFileThamKhao {
    width: 120px;
    font-size: 13.5px;
}

.width-100 {
    width: 100%;
}

.nodeFileThamKhao .icon {
    color: #0161cd !important;
    font-size: 16px !important;
    text-align: center;
    fill: #7c828d;
    background: #fff;
    position: relative;
    border: 1px dashed black;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    border-radius: 30px;
    width: 25px;
    height: 25px;
    margin: auto;
}

.nodeFileThamKhao .number {
    position: absolute;
    top: -7px;
    color: red;
    font-weight: bold;
    font-size: 13.5px;
    right: -7px;
}

.popup_FileThamKhao {
    position: absolute;
    display: none;
    z-index: 100;
    width: 300px;
    height: auto;
    background: #fff;
    padding: 10px;
    border-radius: 7px;
}

.contentDataTreeTable {
    border-left: 5px solid #277BC0;
    border-radius: 7px 7px 0px 0px;
    background: linear-gradient(180deg, rgba(72, 141, 198, 0.1) 91.13%, rgba(39, 123, 192, 0) 100%);
}

.itemNodeLevel tr {
    /* background: rgba(255, 255, 255, 0.66); */
    /* backdrop-filter: blur(0.5px); */
}

.itemNodeLevel_Last::before {
    content: '';
    display: block;
    height: 5px;
}

.nodeTitle_Content_Level1 {
    background: #ffff;
    border-radius: 3px;
    padding: 3px 15px;
    color: black;
    text-transform: uppercase;
    font-style: normal;
    font-weight: 800;
    font-size: 13.5px;
    box-shadow: rgb(100 100 111 / 20%) 0px 7px 29px 0px;
}

.nodeTitle_Content_Level2 {
    color: black;
    /* font-weight: bold; */
    font-weight: 700;
    font-size: 13.5px;
}

.nodeTitle_Content_Level3,
.nodeTitle_Content_Level4,
.nodeTitle_Content_Level5,
.nodeTitle_Content_Level6,
.nodeTitle_Content_Level7 {
    font-weight: 600;
    font-size: 13.5px;
    color: rgb(0 0 0 / 66%);
}

.checkbox-round {
    width: 13px;
    height: 13px;
    background-color: white;
    border-radius: 50%;
    vertical-align: middle;
    border: 1px solid #ddd;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
}

.checkbox-round:checked {
    background-color: #8753de;
}

.search_DataTreeTable {
    border: 1px solid #eaeaea;
    display: flex;
    align-items: center;
    padding: 5px;
    border-radius: 5px;
    transition: border 0.2s;
    background-color: #fff;
    width: 200px;
    height: 32px;
    float: left;
    margin-left: 10px;
    margin-top: 5px;
}

.txt_search_DataTreeTable {
    border: none;
    padding: 5px 10px;
    height: auto;
    border-radius: 0;
    transition: 0.2s;
    width: 175px;
}

.txt_search_DataTreeTable:focus {
    outline: none;
}

.popup_TagsName {
    position: absolute;
    display: none;
    z-index: 100;
    width: 300px;
    height: auto;
    background: #fff;
    padding: 10px;
    border-radius: 7px;
}

.popup_TagsName i.fa.fa-pencil.node_tabsNameIcon,
.popup_TagsName i.fa.fa-trash.node_tabsNameIcon {
    display: none;
}

.popup_TagsName td:hover i.fa.fa-pencil.node_tabsNameIcon,
.popup_TagsName td:hover i.fa.fa-trash.node_tabsNameIcon {
    display: inline-block;
}

.node_tabsName {
    border-radius: 2px 13px 13px 2px;
    padding: 2px 11px;
    color: #FFFFFF;
    margin: 0 2px;
    font-size: 12px;
    font-weight: 500;
}

.node_tabsNameIcon {
    width: 20px;
    height: 20px;
    color: #2a2e347a !important;
    font-size: 16px !important;
    border: 1px solid #e9ebf0;
    text-align: center;
    fill: #7c828d;
    background: #fff;
    border-radius: 4px;
    margin-right: 0px !important;
}

.popup_TagsName .table td {
    padding: 5px;
}

.backgroundNode_Level_2,
.backgroundNode_Level_3,
.backgroundNode_Level_4,
.backgroundNode_Level_6,
.backgroundNode_Level_5,
.backgroundNode_Level_6,
.backgroundNode_Level_7 {
    background: rgba(255, 255, 255, 0.66);
    /* padding-left: 5px !important; */
}

.backgroundNode_Level_2 .cell-name,
.backgroundNode_Level_3 .cell-name,
.backgroundNode_Level_4 .cell-name,
.backgroundNode_Level_6 .cell-name,
.backgroundNode_Level_5 .cell-name,
.backgroundNode_Level_6 .cell-name,
.backgroundNode_Level_7 .cell-name {
    /* background: rgba(255, 255, 255, 0.66); */
    padding-left: 5px !important;
}

/* .paddingNode_Level_2,
.paddingNode_Level_3,
.paddingNode_Level_4,
.paddingNode_Level_6,
.paddingNode_Level_5,
.paddingNode_Level_6,
.paddingNode_Level_7 {
	padding-left: 5px !important;
} */

.paddingNode_Level_3 {
    padding-left: 30px !important;
}

.paddingNode_Level_4 {
    padding-left: 60px !important;
}

.paddingNode_Level_5 {
    padding-left: 90px !important;
}

.paddingNode_Level_6 {
    padding-left: 120px !important;
}

.paddingNode_Level_4>.borderNodeLeft,
.paddingNode_Level_4>.borderNodeBottom {
    left: 30px !important;
}

.paddingNode_Level_5>.borderNodeLeft,
.paddingNode_Level_5>.borderNodeBottom {
    left: 60px !important;
}

.backgroundNode_Level_1 {
    /* padding-left: 5px !important; */
}

.backgroundNode_Level_1 .cell-name {
    /* background: #3B9AE1; */
}

.iconLevelParent {
    width: 16px;
    text-align: center;
}

.nodeTitle_Content.pdnodeTitle_Content_Level1 {
    padding: 0 !important;
}

.linkDinhKem {
    width: 100%;
    display: inline-block;
}

.txt_linkDinhKem {
    width: 90%;
}

.itemOption_MucDoQuanTrong {
    display: inline-block;
    width: 20px;
    text-align: center;
}

.itemOption_MucDoQuanTrong:hover {
    background: #3B9AE1;

}

.customCursor {
    cursor: pointer;
}

.popup_FileThamKhao td {
    padding: 3px;
}

.fixMultiAction {
    position: fixed;
    z-index: 1020;
    color: red;
    top: 1px;
    font-size: 15px;
    width: 100%;
    padding: 10px 0;
    background: #fff;
    transition: all .2s cubic-bezier(.785, .135, .15, .86) 0s;
}

.nodeSoThuTu_Ten {
    width: 140px;
}

.active_KhoiTaoCongViec {
    background: #3b9ae126;
}

.active_KhoiTaoCongViec .fa {
    color: red;
    font-weight: bold;
}

.nodeNguoiThucHien {
    width: 100px;
}

.nodeNgayBatDau {
    width: 100px;
}

.nodeNgayBatDau input {
    width: 100%;
}

.nodeNgayKetThuc input {
    width: 100%;
}

.nodeNgayKetThuc {
    width: 100px;
}

.nodePhanHoi {
    width: 120px;
}

.itemNguoiThucHien {
    width: 30px;
    height: 30px;
    border-radius: 50px;
    border: 1px solid #fff;
    background: #3B9AE1;
    color: #fff;
    overflow: hidden;
}

.lst_itemNguoiThucHien {
    display: flex;
    align-items: center;
    justify-content: center;
}

.itemNguoiThucHien_Name {
    line-height: 30px;
    font-size: 9px;
    font-weight: bold;
}

.iconFileThamKhao {
    width: 28px;
    height: 28px;
}

#carousel-example-generic {
    margin: 20px auto;
    width: 400px;
}

#carousel-custom {
    margin: auto;
    width: auto;
}

#carousel-custom .carousel-indicators {
    margin: 10px 0 0;
    /* overflow: auto; */
    position: static;
    text-align: left;
    white-space: nowrap;
    width: 100%;
}

#carousel-custom .carousel-indicators li {
    background-color: transparent;
    -webkit-border-radius: 0;
    border-radius: 0;
    display: inline-block;
    height: auto;
    margin: 0 !important;
    width: auto;
}

#carousel-custom .carousel-indicators li img {
    display: block;
    opacity: 0.5;
}

#carousel-custom .carousel-indicators li.active img {
    opacity: 1;
}

#carousel-custom .carousel-indicators li:hover img {
    opacity: 0.75;
}

#carousel-custom2 {
    margin: auto;
    width: auto;
}

#carousel-custom2 .carousel-indicators {
    margin: 10px 0 0;
    /* overflow: auto; */
    position: static;
    text-align: left;
    white-space: nowrap;
    width: 100%;
}

#carousel-custom2 .carousel-indicators li {
    background-color: transparent;
    -webkit-border-radius: 0;
    border-radius: 0;
    display: inline-block;
    height: auto;
    margin: 0 !important;
    width: auto;
}

#carousel-custom2 .carousel-indicators li img {
    display: block;
    opacity: 0.5;
}

#carousel-custom2 .carousel-indicators li.active img {
    opacity: 1;
}

#carousel-custom2 .carousel-indicators li:hover img {
    opacity: 0.75;
}

.icon-carousel-minus {
    position: absolute;
    top: 60px;
    right: 10px;
    width: 30px;
    height: 30px;
    z-index: 10;
    opacity: 1;
}

.icon-carousel-minus:hover {
    opacity: 0.7;
}

.icon-carousel-plus {
    position: absolute;
    top: 30px;
    right: 10px;
    width: 30px;
    height: 30px;
    z-index: 10;
    opacity: 1;
}

.icon-carousel-plus:hover {
    opacity: 0.7;
}

.icon-carousel-home {
    position: absolute;
    top: 30px;
    left: 10px;
    width: 30px;
    height: 30px;
    z-index: 10;
    opacity: 1;
}

.icon-carousel-edit {
    position: absolute;
    top: 100px;
    right: 10px;
    width: 30px;
    height: 30px;
    z-index: 10;
    opacity: 1;
}

.icon-carousel-edit:hover {
    opacity: 0.7;
}

.icon-carousel-home:hover {
    opacity: 0.7;
}

.icon-carousel-right {
    position: absolute;
    top: 150px;
    right: 10px;
    width: 30px;
    height: 30px;
    z-index: 10;
    opacity: 1;
}

.icon-carousel-left {
    position: absolute;
    top: 150px;
    left: 10px;
    width: 30px;
    height: 30px;
    z-index: 10;
    opacity: 1;
}

.txtPhanHoi {
    border: 1px solid #999999;
    width: 100%;
    margin: 5px 0;
    padding: 3px;
}

.iconUploadPhanHoi {
    width: 30px;
    height: 30px;
    border: 1px dashed black;
    display: inline-block;
    text-align: center;
    line-height: 30px;
    margin-right: 4px;
    border-radius: 50%
}

.carouselItemDetail>.carousel-inner {
    width: 400px !important;
    margin: auto;
}

.table_DetailItem td,
.table_DetailItem th {
    padding: 6px !important;
}

.DetailItem_title {
    color: rgb(66 72 164);
    font-weight: 700;
    font-size: 15px;
}

.DetailItem_title>.fa {
    color: rgb(240 18 18 / 63%);
}

.listPhanHoi {
    width: 400px;
}

.contentDataTreeTable p {
    margin-bottom: 1px !important;
    font-size: 14.667px;
}

.nodeID_tb_QAQCV2_DanhMuc_DangLoi_MucDo {
    width: 120px;
}

.phanHoiDanhGia {
    width: 400px;
}

.line_phanHoiDanhGia {
    width: 1px;
    background: black;
    margin: 0 6px;
}

.content_phanHoiDanhGia {
    display: flex;
}

.title_phanHoiDanhGia {
    font-weight: 700;
    font-size: 16px;
    color: #000000;
    text-align: center;
    text-transform: uppercase;
}

.customColor_Red {
    color: red !important;
}

.nodeDienGiai {
    width: 120px;
}

.nodeDienGiai_Item {
    display: flex;
    width: inherit;
    word-break: break-all
}

.custom-word-break {
    word-break: break-all
}

.customModal_header {
    padding-top: 4px;
    padding-bottom: 4px;
}

.noImageUpload {
    width: 400px;
    height: 300px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    border: 1px solid #00000063;
    border-radius: 5px;
}

.noImageUpload_iconButton {
    border: 2px solid rgba(105, 66, 176, 0.78);
    border-radius: 5px;
    font-weight: 600;
}

.noImageUpload_iconCamera {
    color: rgba(0, 0, 0, 0.29);
}

.customModal_body {
    padding: 10px 10px 2px 10px;
}

.customModal_ButtonClose:not(:disabled):not(.disabled):hover {
    background-color: transparent;
}

.customBtn_Close {
    border: 1px solid #0096FF;
    border-radius: 5px;
    color: #0096FF;
    font-weight: 700;
    padding: 2px 8px;
}

.customBtn_Close:hover {
    color: #0096FF;
}

.customBtn_Save {
    background: #0078D4;
    border-radius: 5px;
    color: #FFFFFF;
    font-weight: 595;
    padding: 2px 8px;
}

.customBtn_Save:hover {
    color: #FFFFFF;
}

.customBtn_KhongDuyet {
    background: #FD0F0F;
    border-radius: 5px;
    color: #FFFFFF;
    font-weight: 595;
    padding: 2px 8px;
}

.customBtn_KhongDuyet:hover {
    color: #FFFFFF;
}

.customTablePhanHoiDanhGia td,
.customTablePhanHoiDanhGia th {
    padding: 5px;
}

.customTablePhanHoiDanhGia .fa-2x {
    font-size: 14px;
    padding: 2px 5px;
}

.customModal_footer {
    padding: 8px;
}

.width_inherit {
    width: inherit;
    overflow: hidden;
}

.customTable_Scroll {
    height: 200px;
    overflow-y: auto;
    width: 100%;
    display: inline-block;
}

.customTable_Scroll_Width {
    width: 200px;
}

.custom_FontSize {
    font-size: 13.5px;
}

.custom_TitleTable {
    text-transform: uppercase;
    font-weight: normal;
    cursor: pointer;
}

.buttonMain i.fa {
    display: block;
    font-size: 17px;
}

.buttonMain {
    margin-bottom: 10px !important;
    margin-left: auto;
    order: 2;
}

.buttonMain button.btn {
    color: #025abd !important;
}

.buttonMain span {
    font-size: 11px;
}

.contentDataTreeTable .btn:focus {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.nodeDiemTru {
    width: 120px;
}

.nodeTrongSo {
    width: 120px;
}

.nodeTiLeDat {
    width: 120px;
}

.custom_FullWidth {
    width: 100%;
    display: flex;
}

.typeImage_Item_MucDoLoi {
    height: 32px;
    margin-left: auto;
    order: 2;
}

.typeImage_Item {
    padding: 10px 10px 2px 10px;
    box-shadow: 0 10px 20px rgb(0 0 0 / 19%), 0 6px 6px rgb(0 0 0 / 23%);
    border-radius: 10px;
    background: #fff;
}

.typeImage_Item_MucDoLoi_Image {
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

figure.sixteen-nine-img {
    width: 100%;
    overflow: hidden;
    margin: 0;
    padding-top: 56.25%;
    position: relative;
    border: 1px solid #00000063;
    border-radius: 5px;
}

figure.sixteen-nine-img .sixteen-nine-img-detail {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
}

figure.sixteen-nine-img .fa {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
    text-align: center;
    font-size: 100px;
}

.typeImage_Item_MoTa {
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    padding: 2px 2px 0 2px;
    margin-top: 2px;
    height: 24px;
}

img.sixteen-nine-img-icon {
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 9;
}

.typeImage_Item_thumbnail {
    /* border: 1px solid #00000063;
	border-radius: 5px; */
}

.typeImage_Item_Title {
    font-size: 14.667px;
    font-weight: 600;
    color: #0161CD;
    /* width: 80%; */
}

.typeImage_Item_Button {
    font-size: 13px;
    font-weight: 550;
}

.node_TiLeDat {
    font-size: 12px;
    padding: 2px 6px;
    color: #fff;
    border-radius: 4px;
    margin-left: 4px;
}

.box_TiLeDat {
    color: #fff;
    padding: 5px;
    border-radius: 5px;
}

.nodeCongTac {
    width: 160px;
}

.custom_wordbreak {
    word-break: break-word;
}

.node_DiemBatDau {
    width: 120px;
}

.aspect_ratio_4_3 {
    aspect-ratio: 4/3;
    width: 100%;
    object-fit: cover;
    object-position: left;
}

.lst_CongTac_Scrool {
    height: 250px;
    overflow-y: auto;
    width: 100%;
}

.fixBreadcrumbCustom {
    position: fixed;
    z-index: 1020;
    top: 2px;
    font-size: 15px;
    /* width: 60%; */
    background: #fff;
    transition: all .2s cubic-bezier(.785, .135, .15, .86) 0s;
}

.fixBreadcrumbCustom .breadcrumb {
    padding: 9px 1rem;
    ;
}

.fixBreadcrumbCustom_Title {
    font-size: 14px;
    color: #0161cd !important;
    font-weight: 600;
}

.headerDataTreeTable {
    width: 100%;
    height: auto;
    display: flex;
    background: #fff;
    padding: 0px 0 0 0;
    /* margin-bottom: 6px; */
    border-bottom: 1px solid #00000030;
}

.customHeader_Non_fixed {
    display: none !important;
}

.customColor_Black {
    color: black;
}

.box_typeImage {
    display: flex;
    flex-wrap: wrap;
    width: 1250px;
    margin: auto;
    overflow-x: scroll;
    /* justify-content: center; */
}

.full-box_typeImage {
    background-color: #9e9e9e;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1IiBoZWlnaHQ9IjUiPgo8cmVjdCB3aWR0aD0iNSIgaGVpZ2h0PSI1IiBmaWxsPSIjOWU5ZTllIj48L3JlY3Q+CjxwYXRoIGQ9Ik0wIDVMNSAwWk02IDRMNCA2Wk0tMSAxTDEgLTFaIiBzdHJva2U9IiM4ODgiIHN0cm9rZS13aWR0aD0iMSI+PC9wYXRoPgo8L3N2Zz4=);
    -webkit-transition: left 500ms;
    transition: left 500ms;
    padding: 13px 0px;
    /* justify-content: center; */
}

.box_typeImage_Item {
    padding: 5px;
    height: 100%;
    width: 50%;
    /* width: 558px; */
}

.modal.fade .modal-dialog {
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    transform: scale(0.1);
    top: 300px;
    opacity: 0;
    -webkit-transition: all 0.001s;
    -moz-transition: all 0.001s;
    transition: all 0.001s;
}

.modal.fade.show .modal-dialog {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transform: translate3d(0, -300px, 0);
    transform: translate3d(0, -300px, 0);
    opacity: 1;
}

.custom_ActiveType {
    color: #3B9AE1;
    border: 1px solid;
}

.table_role_V2,
.table_role_V2 th,
.table_role_V2 td {
    border: 1px solid black !important;
    background: #fff !important;
    padding: 5px;
    color: black;
}

.table_typeImage_Item,
.table_rtable_typeImage_Itemole_V2 th,
.table_typeImage_Item td {
    background: #fff !important;
}

.table_typeImage_Item {
    width: 100%;
}

.table_role_V2 th {
    text-align: center;
    vertical-align: middle !important;
}

.custom_FullWidth_role_V2 {
    position: relative;
    padding-bottom: 5px;
    padding-left: 2px;
}

.custom_FullWidth_role_V2 i.fa.fa-refresh {
    position: absolute;
    top: 10px;
    right: 10px;
}

.table_role_V2 tr td:hover {
    background-color: #dff0d8 !important;
}

.table_role_V2 {
    width: 100%;
}

.typeImage_Item_MoTaHinh {
    padding-top: 5px;
    width: 310px;
    margin: auto;
    text-align: center;
    height: 43px;
    overflow: hidden;
    color: black;
}

.typeImage_Item_icon {
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 9;
    top: 300px;
}

.custom_Black {
    color: black !important;
}

/* .custom_flex {
	display: flex;
}

.custom_lineHeight10 {
	line-height: 10px;
} */
.customBtn_PhanHoi {
    border: 1px solid #0070C0;
    color: #0070C0;
    font-weight: 600;
    width: 100%;
}

.custom_FontSize14 {
    font-size: 14px;
}

.custom_FontSizeBaoCao {
    font-size: 14.667px;
}

.customHeaderOrder {
    padding: 5px;
    margin-left: 10px;
    margin-top: 5px;
    color: #025abd !important;
}

.tableBaoCaoTuan td,
.tableBaoCaoTuan th {
    vertical-align: middle !important;
    padding: 4px !important;
}

.tableBaoCaoTuan .btnView {
    width: 80px;
    background-color: rgb(168, 168, 168);
    color: #fff;
}

.tableBaoCaoTuan .btnViewDetail {
    width: 80px;
    margin-top: 4px;
    background-color: rgb(22, 28, 86);
    color: #fff
}

.baocaotuan_background_white {
    background-color: #fff;
}

.tableTitle-BCT td,
.tableTitle-BCT th {
    background-color: #fff;
    padding-top: 5px;
    padding-bottom: 5px;
}

.tableTitle-BCT thead tr th {
    background-color: #DAE3F3 !important;
    font-size: 14px;
    font-weight: 400;
    color: #2F528F !important;
    padding: 7px !important;
    font-weight: bold;
    border: 1px solid #3965914a !important;
}

.table_HinhAnh_ChatLuong td {
    background-color: #fff;
}

.baocaotuan-pd {
    padding: 0px 15px 0 15px;
}

.baocaotuan_TitleBox {
    color: #fff;
    background: rgb(31, 78, 121);
    font-size: 14.667px;
    line-height: 18px;
    padding: 5px 5px;
    font-weight: 700;
    margin: 5px 0;
}

.baocaotuan {
    background-color: #fff;
    width: 1112px;
    margin: auto;
    overflow: hidden;
    box-shadow: 0 10px 20px rgb(0 0 0 / 19%), 0 6px 6px rgb(0 0 0 / 23%);
    border-radius: 10px;
}

.baocaotuan_TitleBox_Child {
    color: #002060;
    margin: 5px 0 5px 0;
    font-size: 14.667px;
}

.box_HinhAnh_HuanLuyen {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.box_HinhAnh_HuanLuyen_Item {
    border: 1px solid;
    padding: 5px;
    border-width: 0 1px 1px 0;
}

.box_HinhAnh_HuanLuyen_Item_Img {
    display: block;
    max-width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    max-height: 100%;
}

.btn-delete-Item-HinhAnh_HuanLuyen {
    background-color: #a90000;
    color: #fff;
    padding: 5px 10px;
}

.fileinput-new.thumbnail {
    padding: 4px;
    line-height: 1.42857;
    /* border: 1px solid #ddd;
	border-radius: 4px;
	-webkit-transition: border .2s ease-in-out;
	-o-transition: border .2s ease-in-out;
	transition: border .2s ease-in-out; */
}

.txt_YeuCauKhacPhuc .ql-container {
    max-width: inherit;
    height: 165px;
}

.custom_btn_addRow {
    background-color: #2e78d4;
    color: #fff !important;
}

.title_BaoCaoTuan {
    padding-top: 12px;
    color: #161c56;
    font-weight: bold;
    font-size: 24px;
}

.custom_chevronIcon {
    color: #ea7d22;
    font-weight: bold;
}

.custom_chevronIcon_Add {
    width: 28px;
    height: 28px;
    font-size: 20px;
    text-align: center;
    background: #0078D4;
    color: #fff;
    line-height: 28px;
    border-radius: 4px;
}

.custom_chevronIcon_Edit {

    width: 28px;
    height: 28px;
    font-size: 20px;
    text-align: center;
    background: #ea7d22;
    color: #fff;
    line-height: 28px;
    border-radius: 4px;
}

.custom_chevronIcon_Delete {
    margin-top: 6px;
    width: 28px;
    height: 28px;
    font-size: 20px;
    text-align: center;
    background: red;
    color: #fff;
    line-height: 28px;
    border-radius: 4px;
}

.render_ThongTinDuAn {
    color: #2F528F !important;
    background: #DAE3F3 !important;
    border: 1px solid #2F528F !important;
    border-radius: 4px;
    padding: 3px;
    font-size: 13.333px;
    margin: 2px;
}

.custom_FontSize11 {
    font-size: 14.667px;
}

.baocaotuan p {
    margin-bottom: 1px !important;
    font-size: 14.667px;
}

.treeBBKTCT li {
    list-style-type: none;
}

ul.treeBBKTCT {
    padding-left: 0;
    margin-bottom: 0;
}

.popup_DanhGia {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    z-index: 100;
    width: 120px;
    height: auto;
    background: #fff;
    padding: 5px;
    border: 1px solid #0000004f;
    border-radius: 5px;
    font-size: 14.667px;
}

.popup_DanhGia_RuiRo {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    z-index: 100;
    width: 120px;
    height: auto;
    background: #fff;
    padding: 5px;
    border: 1px solid #0000004f;
    border-radius: 5px;
    font-size: 14.667px;
}

.popup_DanhGia_HinhAnh {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    z-index: 100;
    width: 120px;
    height: auto;
    background: #fff;
    padding: 5px;
    border: 1px solid #0000004f;
    border-radius: 5px;
    font-size: 14.667px;
}

.tableChuThich td {
    border: none !important;
}

.btn-delete.action-btn {
    background-color: red;
    border: none;
    color: #fff !important;
    padding: 0;
    margin: 0;
    font-size: 16px;
    cursor: pointer;
    width: 25px;
    height: 25px;
}

.btn-add.action-btn {
    background-color: #2e78d4;
    border: none;
    color: #fff !important;
    padding: 0;
    margin: 0;
    font-size: 16px;
    cursor: pointer;
    width: 25px;
    height: 25px;
}

.table_HinhAnh_ChatLuong thead th {
    padding: 4px 5px 0px 5px !important;
    vertical-align: unset !important;
}

.custom_Input_BorderBottom {
    border-top: 0;
    border-right: 0;
    border-left: 0;
}

.custom_ShowAction_EditBCT:hover .custom_HideAction_EditBCT {
    display: inline-block;
}

.custom_HideAction_EditBCT {
    display: none;
}

.customTable_LayoutFixed {
    table-layout: fixed;
}

.custom_btnAddRow_Inline {
    position: absolute;
    right: 37px;
    top: 4px;
    background: #2e78d4;
    color: #fff;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    border-radius: 5px;
    z-index: 99999;
}

.custom_btnDeleteRow_Inline {
    position: absolute;
    right: 7px;
    top: 4px;
    background: red;
    color: #fff;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    border-radius: 5px;
    z-index: 99999;
}

.custom_BorderRight {
    border-right: 1px solid;
}

.custom_Button_DeleteGroup {
    position: absolute;
    color: #fff;
    top: 5px;
    left: 4px;
    background: red;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    border-radius: 5px;
}

.tbody_RuiRo {
    border-bottom: 1px solid #00000030;
    font-size: 13.5px;
}

.td_RuiRo {
    border-right: 1px solid #00000030;
}

.RuiRo_btnAction {
    color: #025abd !important;
    font-weight: 600;
}

.RuiRo_GroupAction {
    display: flex;
    align-items: center;
    padding: 5px;
    border-radius: 5px;
    transition: border 0.2s;
    background-color: #fff;
    width: 200px;
    height: 32px;
    float: left;
    margin-left: 10px;
    margin-top: 5px;
}

.custom_btnAddHienTruongSuViec {
    background: #2e78d4;
    color: #fff;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    border-radius: 5px;
}

.baocaotuan .ql-editor {
    padding: 4px 4px !important;
}

.baocaotuan .ql-container {
    border-top: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-bottom: 0 !important;
}

.baocaotuan .ql-editor.ql-blank::before {
    left: 0 !important;
}

.baocaotuan .ql-editor:not(.colorDefault .ql-editor) {
    color: #000000;
}

.xembaocaotuan table {
    color: #000000;
}

#xembaocaotuan > .tablePrintBaoCaoTuan {
    width: 100%;
    table-layout: fixed;
}

.customModalImageFullWidth {
    z-index: 99999 !important;
}

.customModalImageFullWidth .modal-dialog {
    max-width: 100%;
    margin: 0;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100vh;
    display: flex;
    position: fixed;
    z-index: 100000;
}

.customModalImageFullWidth .modal-header {
    display: inline-block;
    flex: 0;
}

.customModalImageFullWidth .modal-body {
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.itemTinhTrangDuAn {
    cursor: pointer;
    color: #fff;
    font-weight: 400;
    border-radius: 7px;

}

.itemTinhTrangDuAn .fa {
    color: black
}

/* ul.treeBBKTCT>li>ul {
	padding-left: 20px;
} */
.baocaotuan .ql-toolbar.ql-snow {
    display: none;
    position: fixed;
    z-index: 9999;
    top: 0;
    background: #fff;
    left: 45%;
    background: yellow;
}


.export_xembaocaotuan {
    padding: 0px 48px 48px 48px;
}

.export_xembaocaotuan .baocaotuan-pd {
    padding: 0 !important;
}


@media print {
    .export_xembaocaotuan {
        /* margin: 0 auto; */
        margin: 1px;
    }

    #header,
    #sidebar,
    .sidebar-bg,
    .action_xembaocaotuan,
    .headerXemBaoCaoTuan {
        display: none !important;
    }

    .content {
        margin-left: 0;
    }

    .bd_content,
    .full_baocaotuan,
    .col-sm-12 {
        padding: 0 !important;
    }

    * {
        background: transparent !important;
    }

    .tableTitle-BCT thead tr th {
        background-color: #DAE3F3 !important;
        font-size: 14px;
        font-weight: 400;
        color: #2F528F !important;
        padding: 7px !important;
        font-weight: bold;
        border: 1px solid #3965914a !important;
    }

    .baocaotuan_TitleBox {
        background: rgb(31, 78, 121) !important;
    }

    html,
    body {
        height: 100%;
        margin: 0 !important;
        padding: 0 !important;
        page-break-after: avoid !important;
        page-break-before: avoid !important;

    }

    @page {
        size: auto;
        /* margin: 48px; */

        /* margin-top: 48px;
		margin-bottom: 48px; */
    }

    /* table,
	figure {
		page-break-inside: avoid;
	} */
    .tableTitle-BCT>.customTable_LayoutFixed tr {
        page-break-inside: initial;
    }

    .table.table.table_HinhAnh_ChatLuong tr {
        page-break-inside: initial;
    }

    .xembaocaotuan .header {
        display: block !important;
        position: fixed;
        top: 0;
        left: 26px;
    }

    .xembaocaotuan .footerbaocaotuan {
        /* display: block !important;
		position: fixed;
		bottom: -50px; */
    }

    .xembaocaotuan .footer-space {
        /* display: block !important; */
    }

    .xembaocaotuan .header-space {
        display: block !important;
    }

    .pageNumber:after {
        /* content: counter(page);
		counter-increment: page;
		float: right;
		font-weight: 600 !important; */
    }
}

.xembaocaotuan .header,
.xembaocaotuan .header-space,
.xembaocaotuan .footerbaocaotuan,
.xembaocaotuan .footer-space {
    height: 100px;
    display: none;
}

.xembaocaotuan .header {
    display: none;
}

.page-footer-baocaotuan,
.page-footer-baocaotuan {
    display: none;
}

table.report-container {
    page-break-after: always !important;
}

thead.report-header {
    display: table-header-group;
    /* position: fixed;
	top: 0; */
}

tfoot.report-footer {
    display: table-footer-group;
    position: fixed;
    bottom: 0;
}

#xembaocaotuan>tbody>tr:hover {
    background: #fff !important;
}

.tablePrintBaoCaoTuan>tbody>tr:hover {
    background: #fff !important;
}

.no_Border_Bottom_BCTGroup {
    border: solid #dee2e6 !important;
    border-width: 0 1px 0 0 !important;
}

.no_Border_All_BCTGroup {
    border: solid #dee2e6 !important;
    border-width: 0px 0px 0px 0px !important;
}

.border_Bottom_BCTGroup {
    border: solid #dee2e6 !important;
    border-width: 0px 1px 1px 0px !important;
}

.border_Bottom_BBCTGroup {
    border: solid #dee2e6 !important;
    border-width: 1px 1px 1px 0px !important;
}

.no_Border_Bottom_BBCTGroup {
    border: solid #dee2e6 !important;
    border-width: 1px 1px 0px 0px !important;
}

.border_Last_BCTGroup {
    border: solid #dee2e6 !important;
    border-width: 0px 0px 1px 0px !important;
}

.custom_ActiveTabDefaultDuAn {
    cursor: pointer;
    font-size: 13px !important;
    color: #000000ab;
    border: 0.1px solid #0000005c;
    text-transform: uppercase;
    padding: 2px 10px;
    border-radius: 5px;
}


.custom_ActiveTabDefaultDuAn.custom_TabDefault_ActiveDuAn {
    color: #fff;
    border: 0.1px solid rgb(31, 78, 121);
    background-color: rgb(31, 78, 121);
    font-weight: 500;
    /* box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; */
}

.custom_ActiveTabDefault {
    cursor: pointer;
    font-size: 15px !important;
    color: rgb(31 78 121 / 87%);
    /* border: 0.1px solid #0000005c; */
    /* text-transform: uppercase; */
    /* padding: 0px 10px; */
    /* border-radius: 5px; */
    height: 30px;
    line-height: 30px;
    font-weight: bold;
}

.custom_ActiveTabDefault.custom_TabDefault_Active {
    border-bottom: 3px solid rgb(31, 78, 121);
    color: rgb(31, 78, 121);
}

.topbar-custom-itemtop {
    height: 24px;
    line-height: 24px;
    font-size: 12px !important;
    color: black;
    font-weight: bold;
    text-transform: uppercase;
}

.topbar-custom-Title {
    height: 30px;
    line-height: 39px;
    font-size: 16px !important;
    color: #3B9AE1;
    font-weight: bold;
    text-transform: uppercase;
}

.topbar-custom-itembottom {
    padding: 3px 2px;
}

.topbar-custom-itembottom-action {
    padding: 3px 2px;
}

.custom-code-bienban {
    font-size: 13px !important;
    color: black;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 31.5px;
}

.DuAnSelect .itemDuAn {
    height: 24px;
    line-height: 24px;
    font-size: 14px !important;
    text-align: right;
    color: rgb(31, 78, 121);
    font-weight: bold;
    padding-right: 10px;
}

.DuAnSelect,
.topbar-custom-box {
    /* box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px; */
    margin: .25rem !important;
    padding: 0 4px;
}

.topbar-custom-btn-back {
    display: flex;
    justify-content: center;
    align-items: center;
}

.display-flex {
    display: flex;
}

.header.navbar-default {
    position: fixed;
    left: 220px;

}

div#page-container.page-sidebar-minified div#header {
    left: 60px;
}

.content {
    margin-top: 64px;
}

.baocaohinh_TitleBox {
    color: #fff;
    background: rgb(31, 78, 121);
    font-size: 14.667px;
    line-height: 18px;
    padding: 5px 5px;
    font-weight: 700;
    margin: 5px;
    border-radius: 5px;
}

.baocaohinh_thongtin {
    margin: 5px;
    padding: 10px 10px 10px 10px;
    box-shadow: 0 10px 20px rgb(0 0 0 / 19%), 0 6px 6px rgb(0 0 0 / 23%);
    border-radius: 10px;
    background: #fff;
}

.baocaohinh_thongtin_table {
    /* width: 100%; */
}

.baocaohinh_thongtin_button {
    background: #C8DDF2;
    border-radius: 5px;
    padding: 5px;
    color: #6789B0;
    font-weight: 700;
    text-align: center;
    font-size: 14.667px;
    height: 32px;
}

.baocaohinh_thongtin_table tr:nth-child(even),
.baocaohinh_thongtin_table tr:hover {
    background: none;
}

.baocaohinh_thongtin_table tr td {
    /* width: 25%; */
    padding: 4px;
}

.baocaohinh_thongtin_table_text {
    color: black;
    font-size: 14.667px;
}

.baocaohinh__TitleBox_Child {
    color: #002060;
    margin: 5px 0 5px 0;
    font-size: 14.667px;
    font-weight: bold;
}

.table_typeImage_Item:hover .nodeTitle_Icon_Edit,
.table_typeImage_Item:hover .list-iconedit-box-typeImage {
    display: inline-block;
}

.list-iconedit-box-typeImage {
    display: none;
    font-size: 14px;
}

.table-BaoCaoHinh th {
    font-weight: bold;
    color: black;
    background: #e4e7ea;
}

.table-BaoCaoHinh th,
.table-BaoCaoHinh td {
    border: 1px solid #00000030;
}

.BaoCaoHinh_GroupAction {
    display: flex;
    /* align-items: center; */
    padding: 5px;
    border-radius: 5px;
    transition: border 0.2s;
    background-color: #fff;
    width: 200px;
    height: 32px;
    float: left;
    margin-left: 0px;
    margin-top: 5px;
}

.BaoCaoHinh_btnAction {
    color: rgb(31, 78, 121);
    font-weight: 600;
}

.custom_BaoCaoHinh_TabActive {
    border-bottom: 2px solid rgb(31, 78, 121)
}

.action_xembaocaotuan .custom_btn_addRow[disabled] {
    opacity: 0.65;
    cursor: wait;
}

/* Isolate this dialog from the legacy inline-block modal spacer and transforms. */
#modal_weeklyProjectCreate::before,
#modal_weeklyProjectCreate .modal-dialog::before {
    display: none;
    content: none;
}

#modal_weeklyProjectCreate .modal-dialog {
    display: flex;
    align-items: center;
    width: calc(100% - 32px);
    max-width: 800px;
    min-height: calc(100% - 48px);
    margin: 24px auto;
    top: 0;
    transform: none !important;
}

#modal_weeklyProjectCreate .modal-content {
    max-height: calc(100vh - 48px);
    text-align: left;
}

#modal_weeklyProjectCreate .modal-body {
    overflow-y: auto;
}

/* Source: css/qaqc_v3.css */
.defect_v3 {
    .sodo {
        border: 1px solid #aaacac;
        height: 780px !important;
    }
}
/* Source: css/qaqc-dashboard-v4.css */
.qaqc-dashboard-v4 {
    --db4-blue: #0070c0;
    --db4-teal: #008c80;
    --db4-green: #4f9f78;
    --db4-amber: #e28b17;
    --db4-red: #c00000;
    --db4-purple: #8064a2;
    --db4-ink: #002060;
    --db4-muted: #64758a;
    --db4-line: #d5dfe9;
    --db4-surface: #fff;
    min-height: calc(100vh - 110px);
    padding: 8px;
    background: #f2f2f2;
    color: var(--db4-ink);
    font-size: 13px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.qaqc-dashboard-v4 * { box-sizing: border-box; }
.db4-panel-head > div > span { margin-top: 2px; color: #52667c; font-size: 12px; font-weight: 500; }
.db4-band { margin-bottom: 8px; padding: 9px 11px; border: 1px solid var(--db4-line); background: var(--db4-surface); }
.db4-section-title { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--db4-ink); font-size: 15px; font-weight: 800; letter-spacing: 0; }
.db4-inline-link { padding: 0; border: 0; background: transparent; color: inherit; font: inherit; letter-spacing: 0; text-align: left; cursor: pointer; }
.db4-inline-link:hover, .db4-inline-link:focus { color: #0d6faa; text-decoration: underline; }
.db4-project-summary-link { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; }
.db4-project-summary-link .db4-project-code { align-self: flex-start; }
.db4-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.db4-panel-head > strong { color: var(--db4-green); font-size: 22px; }
.db4-count-pill { min-width: 32px; padding: 4px 8px; border-radius: 3px; background: #c7dbf3; color: var(--db4-ink); text-align: center; font-size: 12px; font-weight: 800; }

.db4-project-summary { display: grid; grid-template-columns: 90px 1.25fr 1fr 1fr 150px; align-items: center; gap: 0; padding: 8px 11px; }
.db4-project-image.large { width: 82px; height: 68px; object-fit: cover; border: 1px solid var(--db4-line); }
.db4-project-main, .db4-project-period, .db4-project-contact { min-height: 62px; padding: 5px 14px; border-left: 1px solid var(--db4-line); }
.db4-project-main strong, .db4-project-period strong, .db4-project-contact strong { display: block; margin: 3px 0; color: var(--db4-ink); font-size: 14px; }
.db4-project-main span, .db4-project-period small, .db4-project-contact span { display: block; color: #52667c; font-size: 12px; }
.db4-project-code { display: inline-block; padding: 2px 6px; border-radius: 3px; background: #e7f0f7; color: #145b91; font-size: 11px; font-weight: 700; }
.db4-info-label { color: #405873; font-size: 12px; font-weight: 700; }
.db4-project-progress, .db4-mini-progress { height: 5px; margin: 7px 0 4px; overflow: hidden; border-radius: 2px; background: #e5ebf0; }
.db4-project-progress span, .db4-mini-progress span { display: block; height: 100%; background: var(--db4-blue); }
.db4-health { display: flex; min-height: 64px; padding: 8px; flex-direction: column; align-items: center; justify-content: center; border-left: 3px solid var(--db4-green); background: #edf7f3; color: #26765a; text-align: center; }
.db4-health.warning { border-color: var(--db4-amber); background: #fff7e8; color: #93600f; }
.db4-health.danger { border-color: var(--db4-red); background: #fdeeee; color: #a53636; }
.db4-health i { font-size: 17px; }
.db4-health span { margin: 3px 0 1px; font-size: 9px; }
.db4-health strong { font-size: 12px; }

.db4-kpis { display: grid; margin-bottom: 8px; border: 1px solid var(--db4-line); background: #fff; }
.db4-kpis.six { grid-template-columns: repeat(6, minmax(120px, 1fr)); }
.db4-kpis.seven { grid-template-columns: repeat(7, minmax(105px, 1fr)); }
.db4-kpi { display: flex; min-height: 82px; padding: 9px 10px; align-items: flex-start; gap: 7px; border-right: 1px solid var(--db4-line); }
.db4-kpi:last-child { border-right: 0; }
.db4-kpi-icon { width: 21px; padding-top: 3px; color: var(--db4-blue); font-size: 16px; text-align: center; }
.db4-kpi-icon.green, .db4-kpi-value.green { color: var(--db4-green); }
.db4-kpi-icon.amber, .db4-kpi-value.amber { color: var(--db4-amber); }
.db4-kpi-icon.red { color: var(--db4-red); }
.db4-kpi-icon.teal, .db4-kpi-value.teal { color: var(--db4-teal); }
.db4-kpi-icon.purple, .db4-kpi-value.purple { color: var(--db4-purple); }
.db4-kpi-label { color: var(--db4-ink); font-size: 12px; line-height: 1.25; font-weight: 750; }
.db4-kpi-value { margin-top: 4px; color: var(--db4-blue); font-size: 30px; line-height: 1; font-weight: 820; }
.db4-kpi button.db4-kpi-value { display: block; }
.db4-kpi-value.alert, .db4-text-danger { color: var(--db4-red); }
.db4-kpi-value small { font-size: 14px; }
.db4-kpi > div > small { display: block; margin-top: 5px; color: #52667c; font-size: 11px; font-weight: 500; }

.db4-management-strip { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 8px; border: 1px solid #c7dbf3; border-left: 4px solid var(--db4-blue); background: #f5f9fd; }
.db4-management-strip > div { min-height: 56px; padding: 7px 11px; border-right: 1px solid #d3dee7; }
.db4-management-strip > div:last-child { border-right: 0; }
.db4-management-strip span, .db4-management-strip small { display: block; color: #52667c; font-size: 12px; }
.db4-management-strip strong { display: block; margin: 2px 0; color: var(--db4-ink); font-size: 22px; }
.db4-management-strip strong.danger { color: var(--db4-red); }
.db4-management-strip strong.warning { color: var(--db4-amber); }

.db4-chart-grid { display: grid; gap: 8px; }
.db4-chart-grid.primary, .db4-chart-grid.overview { grid-template-columns: minmax(0, 1.45fr) minmax(320px, .85fr); }
.db4-chart-grid.primary .wide, .db4-chart-grid.overview .wide { order: -1; }
.db4-chart-grid.secondary { grid-template-columns: minmax(0, 1.5fr) minmax(300px, .7fr); }
.db4-chart-grid.equal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.db4-chart-panel { min-width: 0; padding-bottom: 5px; }
.db4-chart { min-height: 240px; }
.apexcharts-canvas text { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important; }

.db4-quality-grid { display: grid; grid-template-columns: repeat(4, minmax(190px, 1fr)); gap: 8px; margin-bottom: 8px; }
.db4-quality-card { min-height: 112px; padding: 8px; border: 1px solid var(--db4-line); border-top: 3px solid var(--db4-blue); border-radius: 3px; background: #fff; }
.db4-quality-card.amber { border-top-color: var(--db4-amber); }
.db4-quality-card.teal { border-top-color: var(--db4-teal); }
.db4-quality-card.red { border-top-color: var(--db4-red); }
.db4-quality-head { display: flex; min-height: 30px; align-items: flex-start; justify-content: space-between; gap: 8px; }
.db4-quality-head > strong { color: var(--db4-blue); font-size: 15px; }
.db4-quality-rating { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.db4-quality-rating strong { color: var(--db4-ink); font-size: 15px; line-height: 1.1; white-space: nowrap; }
.db4-quality-rating strong small { font-size: 11px; }
.db4-quality-rating > span { max-width: 130px; padding: 2px 7px; border-radius: 3px; color: #fff; font-size: 11px; font-weight: 750; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.db4-quality-name { color: var(--db4-ink); font-size: 14px; font-weight: 800; }
.db4-quality-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; margin: 7px 0; }
.db4-quality-stat { padding: 3px; background: #f6f8fb; text-align: center; }
.db4-quality-stat strong { display: block; font-size: 18px; }
.db4-quality-stat span { color: #405873; font-size: 11px; font-weight: 600; }
.db4-quality-stat.success strong { color: var(--db4-green); }
.db4-quality-stat.danger strong { color: var(--db4-red); }
.db4-progress { height: 6px; overflow: hidden; border-radius: 2px; background: #e7edf2; }
.db4-progress > span { display: block; height: 100%; background: var(--db4-blue); }
.db4-quality-card.amber .db4-progress > span { background: var(--db4-amber); }
.db4-quality-card.teal .db4-progress > span { background: var(--db4-teal); }
.db4-quality-card.red .db4-progress > span { background: var(--db4-red); }
.db4-quality-foot { display: flex; justify-content: space-between; margin-top: 6px; color: #405873; font-size: 11px; font-weight: 600; }

.db4-columns { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .75fr); gap: 8px; margin-bottom: 8px; }
.db4-columns .db4-band { margin-bottom: 0; }
.db4-table-wrap { width: 100%; overflow: auto; border: 1px solid var(--db4-line); background: #fff; }
.db4-table { width: 100%; margin: 0; border-collapse: collapse; font-size: 12px; }
.db4-table th { position: sticky; top: 0; z-index: 1; padding: 6px; border-bottom: 1px solid #b9c9d8; background: #c7dbf3; color: var(--db4-ink); text-align: left; white-space: nowrap; }
.db4-table td { padding: 6px; border-bottom: 1px solid #e3e8ed; vertical-align: middle; }
.db4-table tbody tr:hover { background: #f7fafc; }
.db4-table td small { display: block; margin-top: 2px; color: var(--db4-amber); }
.db4-attention-table { max-height: 360px; }
.db4-module-dot { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: var(--db4-blue); }
.db4-module-dot.amber { background: var(--db4-amber); }
.db4-module-dot.teal { background: var(--db4-teal); }
.db4-module-dot.red { background: var(--db4-red); }
.db4-badge, .db4-health-tag { display: inline-flex; min-height: 22px; padding: 3px 7px; align-items: center; border-radius: 3px; background: #bdd7ee; color: var(--db4-ink); font-size: 11px; font-weight: 700; }
.db4-badge.danger, .db4-health-tag.danger { background: #fdeaea; color: #a72f2f; }
.db4-badge.warning, .db4-health-tag.warning { background: #fff0cf; color: #80540c; }
.db4-health-tag.success { background: #e4f4ed; color: #247155; }
.db4-empty { padding: 28px 12px; border: 1px dashed #cbd5df; background: #fff; color: var(--db4-muted); text-align: center; }

.db4-people-list { display: grid; max-height: 360px; overflow: auto; grid-template-columns: 1fr; gap: 1px; background: #e1e7ec; }
.db4-person { display: flex; min-width: 0; padding: 8px; gap: 9px; background: #fff; }
.db4-person-avatar { display: flex; width: 30px; height: 30px; flex: 0 0 30px; align-items: center; justify-content: center; border-radius: 50%; background: #dcebf6; color: #1769aa; font-weight: 700; }
.db4-person strong, .db4-person span, .db4-person small { display: block; }
.db4-person strong { color: var(--db4-ink); font-size: 13px; }
.db4-person span { color: #405873; font-size: 12px; }
.db4-person small { color: #64758a; font-size: 11px; }

.db4-gallery { display: grid; grid-template-columns: repeat(6, minmax(125px, 1fr)); gap: 8px; }
.db4-photo { position: relative; min-height: 142px; padding: 0; overflow: hidden; border: 1px solid var(--db4-line); border-radius: 4px; background: #fff; color: inherit; text-align: left; cursor: zoom-in; }
.db4-photo:hover, .db4-photo:focus { border-color: var(--db4-blue); box-shadow: 0 0 0 2px rgba(0, 112, 192, .12); outline: 0; }
.db4-photo-preview { position: relative; display: block; overflow: hidden; }
.db4-photo img { display: block; width: 100%; height: 100px; object-fit: cover; transition: transform .18s ease; }
.db4-photo:hover img, .db4-photo:focus img { transform: scale(1.025); }
.db4-photo-view { position: absolute; right: 6px; top: 6px; display: flex; width: 27px; height: 27px; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.75); border-radius: 3px; background: rgba(0,32,96,.78); color: #fff; font-size: 13px; }
.db4-photo-meta { padding: 6px 7px; }
.db4-photo-meta strong { display: block; overflow: hidden; color: var(--db4-ink); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.db4-photo-meta span { display: block; margin-top: 2px; color: #52667c; font-size: 11px; }
.db4-lg-caption { max-width: 960px; margin: 0 auto; color: #fff; text-align: left; }
.db4-lg-caption h4 { margin: 0 0 6px; color: #fff; font-size: 16px; font-weight: 700; }
.db4-lg-meta { display: flex; flex-wrap: wrap; gap: 5px 18px; font-size: 12px; }
.db4-lg-meta span { white-space: nowrap; }

.db4-filterbar { display: grid; grid-template-columns: minmax(300px, 1.4fr) minmax(260px, 1fr) 210px; align-items: start; gap: 10px; }
.db4-filter label { display: block; margin-bottom: 4px; color: var(--db4-ink); font-size: 12px; font-weight: 700; }
.db4-filter-actions { display: flex; height: 36px; align-items: stretch; gap: 6px; }
.db4-filter-action-field .db4-btn { flex: 1 1 auto; }
.db4-btn { height: 36px; padding: 0 11px; border: 1px solid var(--db4-blue); border-radius: 4px; background: var(--db4-blue); color: #fff; cursor: pointer; font-size: 12px; font-weight: 700; white-space: nowrap; }
.db4-btn.secondary { border-color: #b9c5d0; background: #fff; color: #41576b; }
.db4-filter .select2-container .select2-selection--multiple { min-height: 36px; border-color: #b9c9d8; border-radius: 4px; }
.db4-filter .select2-container--default .select2-selection--multiple .select2-selection__rendered { padding-left: 7px; text-align: left; }
.db4-filter .select2-search__field { margin-top: 6px !important; text-align: left; }
.dashboard-v4-option-check { width: 18px; color: #6d7d8b; }
.select2-results__option[aria-selected="true"] .dashboard-v4-option-check:before { content: "\f14a"; color: var(--db4-blue); }

.db4-priority-grid { display: grid; gap: 5px; margin-bottom: 8px; }
.db4-priority-item { display: grid; min-height: 56px; padding: 7px 10px; grid-template-columns: 32px minmax(240px, 1fr) minmax(210px, auto) 95px; align-items: center; gap: 10px; border: 1px solid var(--db4-line); background: #fff; }
.db4-priority-rank { color: #8794a0; font-size: 18px; font-weight: 700; text-align: center; }
.db4-priority-name strong, .db4-priority-name span { display: block; }
.db4-priority-name strong { color: var(--db4-ink); font-size: 13px; }
.db4-priority-name span { color: #435b6d; font-size: 12px; }
.db4-priority-metrics { display: flex; gap: 16px; color: #40586b; font-size: 13px; }
.db4-priority-metrics b { color: var(--db4-ink); font-size: 16px; }
.db4-projects-table { max-height: 470px; }
.db4-project-name { min-width: 205px; }
.db4-project-name .db4-inline-link, .db4-priority-name .db4-inline-link { max-width: 100%; }
.db4-project-name .db4-inline-link strong, .db4-priority-name .db4-inline-link strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.db4-attention-link { max-width: 420px; }
.db4-cell-progress { display: flex; min-width: 105px; align-items: center; gap: 6px; }
.db4-cell-progress > span { display: block; width: 68px; height: 6px; overflow: hidden; border-radius: 2px; background: #e6ebef; }
.db4-cell-progress i { display: block; height: 100%; background: var(--db4-green); }
.db4-cell-progress b { color: #35566d; font-size: 10px; }
.db4-loading { position: fixed; z-index: 1200; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.7); color: var(--db4-blue); font-size: 13px; font-weight: 700; }

.db4-module-analysis { margin: 8px 0; padding: 0; border: 0; background: transparent; }
.db4-module-analysis-head { display: flex; margin-bottom: 7px; padding: 7px 10px; align-items: flex-start; justify-content: space-between; border-left: 4px solid var(--db4-blue); background: #fff; }
.db4-module-analysis-head h2 { margin: 0; color: var(--db4-ink); font-size: 16px; font-weight: 820; letter-spacing: 0; }
.db4-module-analysis-head p { margin: 2px 0 0; color: #52667c; font-size: 12px; font-weight: 500; }
.db4-module-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.db4-module-panel { min-width: 0; overflow: visible; border: 1px solid #b9c9d8; border-top: 3px solid var(--db4-blue); background: #fff; }
.db4-module-panel.inspection { grid-column: 1 / -1; }
.db4-module-panel.amber { border-top-color: var(--db4-amber); }
.db4-module-panel.teal { border-top-color: var(--db4-teal); }
.db4-module-panel.red { border-top-color: var(--db4-red); }
.db4-module-panel > header { position: relative; display: flex; min-height: 54px; padding: 7px 9px; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #cdd8e0; background: #fff; }
.db4-module-panel.amber > header, .db4-module-panel.teal > header, .db4-module-panel.red > header { background: #fff; }
.db4-module-panel > header > div { display: flex; min-width: 0; align-items: center; gap: 7px; }
.db4-module-panel > header > div:first-child { flex: 1 1 auto; }
.db4-module-panel > header > div:first-child > span { display: flex; width: 28px; height: 28px; flex: 0 0 28px; align-items: center; justify-content: center; border-radius: 3px; background: var(--db4-blue); color: #fff; font-size: 12px; font-weight: 800; }
.db4-module-panel.amber > header > div:first-child > span { background: var(--db4-amber); }
.db4-module-panel.teal > header > div:first-child > span { background: var(--db4-teal); }
.db4-module-panel.red > header > div:first-child > span { background: var(--db4-red); }
.db4-module-panel h3 { margin: 0; color: var(--db4-ink); font-size: 15px; line-height: 1.2; font-weight: 820; letter-spacing: 0; }
.db4-module-panel > header > strong { color: var(--db4-blue); font-size: 22px; font-weight: 850; }
.db4-module-panel > header > strong small { font-size: 12px; font-weight: 750; }
.db4-module-panel.amber > header > strong { color: #915808; }
.db4-module-panel.teal > header > strong { color: #116c62; }
.db4-module-panel.red > header > strong { color: #a83232; }
.db4-module-kpis { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid #d5dee5; }
.db4-module-kpis.four { grid-template-columns: repeat(4, 1fr); }
.db4-module-kpis.five { grid-template-columns: repeat(5, 1fr); }
.db4-module-kpis > div { min-height: 58px; padding: 6px 8px; border-right: 1px solid #d5dee5; text-align: center; }
.db4-module-kpis > div:last-child { border-right: 0; }
.db4-module-kpis span, .db4-module-kpis b { display: block; }
.db4-module-kpis span { color: #405873; font-size: 12px; font-weight: 700; }
.db4-module-kpis b { margin-top: 3px; color: var(--db4-ink); font-size: 22px; }
.db4-module-visuals { display: grid; grid-template-columns: minmax(190px, .72fr) minmax(0, 1.28fr); gap: 0; }
.db4-module-visuals.three { grid-template-columns: minmax(170px, .75fr) minmax(190px, 1fr) minmax(220px, 1.1fr); }
.db4-module-visuals.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.db4-module-visuals.four > div:nth-child(4n) { border-right: 0; }
.db4-module-visuals > div { min-width: 0; padding: 7px; border-right: 1px solid #d8e0e6; }
.db4-module-visuals > div:last-child { border-right: 0; }
.db4-module-visuals h4, .db4-module-history h4 { margin: 0 0 2px; color: var(--db4-ink); font-size: 13px; font-weight: 800; text-align: center; letter-spacing: 0; }
.db4-score-summary { position: relative; display: grid !important; min-width: 205px; padding-right: 17px; flex: 0 1 245px; grid-template-columns: auto auto; align-items: center !important; justify-content: end; column-gap: 6px !important; row-gap: 2px !important; text-align: right; }
.db4-score-summary > div { display: flex; align-items: baseline; justify-content: flex-end; gap: 5px; }
.db4-score-summary strong { color: var(--db4-ink); font-size: 22px; line-height: 1; font-weight: 850; white-space: nowrap; }
.db4-score-summary small { color: #52667c; font-size: 11px; font-weight: 700; white-space: nowrap; }
.db4-score-summary em { grid-column: 1 / -1; max-width: 228px; overflow: hidden; color: #64758a; font-size: 11px; font-style: normal; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.db4-score-summary > .db4-help { position: absolute; right: 0; top: auto; bottom: 0; }
.db4-rating-badge { display: inline-flex; max-width: 130px; min-height: 22px; padding: 3px 7px; align-items: center; justify-content: center; border-radius: 3px; color: #fff; font-size: 11px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.db4-module-history { padding: 8px 10px 3px; border-top: 1px solid #d8e0e6; }
.db4-chart-tooltip { display: grid; min-width: 220px; max-width: 360px; padding: 9px 11px; gap: 4px; color: #18364c; font-size: 12px; }
.db4-chart-tooltip strong { white-space: normal; }
.db4-chart-tooltip span { display: block; }
.apexcharts-canvas text { fill: #405873; }
.apexcharts-legend-text { color: var(--db4-ink) !important; font-size: 12px !important; font-weight: 600 !important; }

.db4-help { position: relative; z-index: 20; display: inline-flex; width: 16px; height: 16px; margin-left: 2px; align-items: center; justify-content: center; color: var(--db4-blue); font-size: 12px; cursor: help; vertical-align: middle; }
.db4-help.inverse { color: currentColor; opacity: .9; }
.db4-help::after { content: attr(data-tooltip); position: absolute; z-index: 3000; left: 50%; bottom: calc(100% + 9px); display: none; width: 310px; padding: 10px 12px; border: 1px solid #0d3554; border-radius: 4px; background: #102f47; color: #fff; font-size: 13px; line-height: 1.45; font-weight: 500; text-align: left; white-space: normal; box-shadow: 0 8px 22px rgba(16, 47, 71, .28); pointer-events: none; transform: translateX(-50%); }
.db4-help:hover::after, .db4-help:focus::after { display: block; }
.db4-module-panel > header > strong .db4-help::after { right: 0; left: auto; transform: translateY(4px); }
.db4-module-panel > header > strong .db4-help:hover::after, .db4-module-panel > header > strong .db4-help:focus::after { transform: none; }
.all-project-module-analysis .db4-module-panel { min-height: 0; }
.all-project-module-analysis .db4-module-visuals { grid-template-columns: 1.25fr .75fr; }
.all-project-module-analysis .db4-module-panel.inspection .db4-module-visuals.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1360px) {
    .db4-project-summary { grid-template-columns: 90px 1.2fr 1fr 1fr; }
    .db4-health { grid-column: 1 / -1; min-height: 42px; flex-direction: row; gap: 8px; border-left-width: 3px; }
    .db4-module-visuals.three { grid-template-columns: 1fr 1fr; }
    .db4-module-visuals.three > div:last-child { grid-column: 1 / -1; border-top: 1px solid #d8e0e6; }
    .db4-module-visuals.four, .all-project-module-analysis .db4-module-panel.inspection .db4-module-visuals.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .db4-module-visuals.four > div:nth-child(n+3) { border-top: 1px solid #d8e0e6; }
    .db4-module-visuals.four > div:nth-child(2n) { border-right: 0; }
}

@media (max-width: 1050px) {
    .db4-kpis.seven { grid-template-columns: repeat(4, 1fr); }
    .db4-kpis.six { grid-template-columns: repeat(3, 1fr); }
    .db4-kpi { border-bottom: 1px solid var(--db4-line); }
    .db4-chart-grid.primary, .db4-chart-grid.secondary, .db4-chart-grid.overview, .db4-chart-grid.equal, .db4-columns { grid-template-columns: 1fr; }
    .db4-quality-grid { grid-template-columns: repeat(2, 1fr); }
    .db4-gallery { grid-template-columns: repeat(4, 1fr); }
    .db4-module-grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .qaqc-dashboard-v4 { padding: 8px; }
    .db4-filterbar, .db4-project-summary, .db4-management-strip, .db4-kpis.six, .db4-kpis.seven { grid-template-columns: 1fr; }
    .db4-project-main, .db4-project-period, .db4-project-contact { border-top: 1px solid var(--db4-line); border-left: 0; }
    .db4-quality-grid { grid-template-columns: 1fr; }
    .db4-gallery { grid-template-columns: repeat(2, 1fr); }
    .db4-priority-item { grid-template-columns: 28px 1fr; }
    .db4-priority-metrics, .db4-priority-item .db4-health-tag { grid-column: 2; }
}

/* Source: css/qaqc-user-guide.css */
/* Same palette and spacing as the existing web modules. Only the two bodies scroll. */
body.qaqc-guide-open{height:auto;overflow:hidden}
.qaqc-guide-page{color:#263238;width:100%;margin:0;padding:0;height:var(--qaqc-guide-height,calc(100vh - 94px));height:var(--qaqc-guide-height,calc(100dvh - 94px));display:flex;flex-direction:column;min-height:0;overflow:hidden;box-sizing:border-box}
.qaqc-guide-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:12px;flex:1;min-height:0;overflow:hidden}
.qaqc-guide-sidebar,.qaqc-guide-reader{border:1px solid #dfe3e8;border-radius:6px;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;background:#fff}
.qaqc-guide-sidebar{background:#f7f8fa}
.qaqc-guide-sidebar-header{padding:12px 12px 0;flex-shrink:0}
.qaqc-guide-sidebar label{font-size:13px;font-weight:600;color:#455a64}
.qaqc-guide-search{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #d6dbe0;border-radius:4px;padding:6px 8px}
.qaqc-guide-search input{width:100%;min-width:0;border:0;background:transparent;font-size:13px;line-height:1.6;color:#263238}
.qaqc-guide-search button{background:none;border:0;color:#607d8b}
.qaqc-guide-list-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0}
.qaqc-guide-count{font-size:13px;color:#607d8b;margin:0}
.qaqc-guide-list-scroll,.qaqc-guide-body{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch}
.qaqc-guide-list-scroll{padding:0 12px 12px}
.qaqc-guide-item{display:block;text-align:left;width:100%;border:0;border-left:3px solid transparent;background:#fff;padding:9px 8px;border-radius:4px;margin-bottom:4px;color:#263238;cursor:pointer}
.qaqc-guide-item strong{display:block;font-size:13px;line-height:1.5;font-weight:600;overflow-wrap:anywhere}
.qaqc-guide-item span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.5;color:#607d8b;margin-top:3px}
.qaqc-guide-item:hover{background:#edf3f9}
.qaqc-guide-item.active{background:#e8f0fa;border-left-color:#1e518e;color:#0c3f70}
.qaqc-guide-node{display:flex;align-items:flex-start;min-width:0}
.qaqc-guide-node .qaqc-guide-item{flex:1;min-width:0}
.qaqc-guide-toggle{flex:0 0 24px;border:0;background:transparent;color:#0c3f70;cursor:pointer;padding:10px 3px;font-size:16px}
.qaqc-guide-group{background:#edf3f9}
.qaqc-guide-reader{outline:none}
.qaqc-guide-title{flex-shrink:0;border-bottom:1px solid #e1e8eb;padding:12px 16px;background:#fff}
.qaqc-guide-title h2{font-size:20px;color:#0c3f70;font-weight:600;margin:0;line-height:1.4}
.qaqc-guide-title p{font-size:13px;color:#607d8b;margin:6px 0 0;line-height:1.6}
.qaqc-guide-body{padding:0 16px 16px}
.qaqc-guide-body-slides{padding:0;display:flex;flex-direction:column;overflow:hidden}
.qaqc-slide-stage{flex:1;min-height:0;display:flex;flex-direction:column;background:#e8eef2}
.qaqc-slide-frame{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:4px;background:#0e2430}
.qaqc-slide-frame img,.qaqc-slide-frame video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;background:#fff;cursor:zoom-in}
.qaqc-slide-bar{flex-shrink:0;display:flex;align-items:center;justify-content:center;gap:14px;padding:8px 12px;background:#fff;border-top:1px solid #e1e8eb;font-size:13px;color:#0c3f70}
.qaqc-guide-content{font-size:14px;line-height:1.7;overflow-wrap:anywhere}
.qaqc-guide-content h2{font-size:18px;font-weight:600;line-height:1.45;color:#0c3f70;margin:18px 0 10px}
.qaqc-guide-content h3{font-size:16px;font-weight:600;line-height:1.5;color:#0c3f70;margin:16px 0 8px}
.qaqc-guide-content p{margin-bottom:10px}.qaqc-guide-content li{margin-bottom:6px}
.qaqc-guide-content img{max-width:100%!important;height:auto!important;display:block;margin:16px 0;border-radius:6px;cursor:zoom-in}
.qaqc-guide-content table{max-width:100%;width:100%;border-collapse:collapse;font-size:14px}
.qaqc-guide-content th,.qaqc-guide-content td{border:1px solid #dce5e8;padding:8px;overflow-wrap:anywhere}
.qaqc-guide-content iframe,.qaqc-guide-video video{max-width:100%;width:100%;border-radius:6px}
.qaqc-guide-video{margin-bottom:20px}.qaqc-guide-video a{display:inline-block;margin-top:8px}
.qaqc-guide-button{background:#fff;border:1px solid #d6dbe0;border-radius:4px;padding:6px 10px;font-size:13px;color:#0c3f70;cursor:pointer}
.qaqc-guide-button:disabled{opacity:.6;cursor:wait}
.qaqc-guide-button:focus-visible,.qaqc-guide-item:focus-visible,.qaqc-guide-search input:focus-visible,.qaqc-guide-list-scroll:focus-visible,.qaqc-guide-body:focus-visible{outline:2px solid #1e518e;outline-offset:-2px}
.qaqc-guide-alert{flex-shrink:0;padding:8px 12px;background:#fff4df;border:1px solid #f1d299;border-radius:4px;margin-bottom:8px;font-size:13px}
.qaqc-guide-empty,.qaqc-guide-loading{padding:20px 8px;color:#607d8b;font-size:14px;line-height:1.6}
.qaqc-guide-back{display:none}
.qaqc-guide-lightbox{position:fixed;inset:0;z-index:2000;background:rgba(9,27,34,.96);overflow:hidden;display:flex;align-items:center;justify-content:center;padding:52px 76px 56px}
.qaqc-guide-lightbox>img{width:min(calc(100vw - 152px),calc((100vh - 108px) * 16 / 9));height:auto;max-width:calc(100vw - 152px);max-height:calc(100vh - 108px);object-fit:contain;background:#fff}
.qaqc-guide-lightbox>#qaqc-guide-image-close{position:fixed;top:12px;right:16px;border:1px solid #fff;border-radius:4px;background:#fff;color:#0c3f70;padding:9px 16px;cursor:pointer;font-size:14px;z-index:2002}
.qaqc-guide-lightbox>.qaqc-guide-zoom-nav{position:fixed;top:50%;right:auto;left:auto;transform:translateY(-50%);z-index:2002;width:52px;height:84px;border:0;border-radius:6px;background:rgba(255,255,255,.94);color:#0c3f70;font-size:28px;cursor:pointer}
.qaqc-guide-lightbox>.qaqc-guide-zoom-nav.prev{left:12px}
.qaqc-guide-lightbox>.qaqc-guide-zoom-nav.next{right:12px}
.qaqc-guide-zoom-nav:disabled{opacity:.35;cursor:default}
.qaqc-guide-zoom-bar{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:2002;color:#fff;font-size:15px;background:rgba(0,0,0,.45);border-radius:4px;padding:6px 16px}
@media(max-width:1000px){.qaqc-guide-layout{grid-template-columns:250px minmax(0,1fr)}}
@media(max-width:700px){.qaqc-guide-page{height:var(--qaqc-guide-height,calc(100dvh - 156px))}.qaqc-guide-layout{display:flex}.qaqc-guide-sidebar{flex:1}.qaqc-guide-reader{display:none;flex:1}.qaqc-guide-reading .qaqc-guide-sidebar{display:none}.qaqc-guide-reading .qaqc-guide-reader{display:flex}.qaqc-guide-title{padding:12px}.qaqc-guide-title h2{font-size:18px}.qaqc-guide-body{padding:0 12px 12px}.qaqc-guide-back{display:inline-block;margin-bottom:10px}}

/* Source: css/listform-readonly.css */
.listform-readonly-field{padding:12px 15px;border-bottom:1px solid #e7ebef;min-width:0}
.listform-readonly-field dt{color:#607d8b;font-size:13px;font-weight:500;margin-bottom:6px}
.listform-readonly-field dd{color:#263238;font-size:14px;line-height:1.6;margin:0;overflow-wrap:anywhere}
.listform-readonly-text{white-space:pre-wrap}
.listform-readonly-html img{max-width:100%;height:auto}
.listform-readonly-html table{max-width:100%}
.listform-readonly-html{overflow:auto}
.listform-readonly-images{display:flex;gap:8px;flex-wrap:wrap}
.listform-readonly-images img{max-width:180px;max-height:180px;object-fit:contain;border-radius:4px}

/* Source: css/qaqc-topbar-tools.css */
.qaqc-topbar {
    align-items: stretch;
    background: #fff;
    border-bottom: 1px solid #dfe5ea;
    box-shadow: 0 1px 4px rgba(27, 47, 65, .08);
    display: flex;
    height: 64px;
    justify-content: space-between;
    overflow: visible;
    padding: 0;
    z-index: 1020;
}

.qaqc-topbar.qaqc-topbar-panel-open {
    z-index: 1045;
}

.qaqc-topbar-breadcrumb {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    padding-left: 14px;
    position: relative;
}

.qaqc-topbar-accent {
    align-self: stretch;
    background: #1e518e;
    display: block;
    flex: 0 0 8px;
    margin-right: 14px;
}

.qaqc-topbar-breadcrumb .breadcrumb {
    background: transparent;
    flex-wrap: nowrap;
    margin: 0;
    min-width: 0;
    overflow: hidden;
    padding: 0;
}

.qaqc-topbar-breadcrumb .breadcrumb-item {
    line-height: 1.3;
    min-width: 0;
    padding: 0;
}

.qaqc-topbar-breadcrumb .breadcrumb-item a {
    color: #0c3f70;
    display: block;
    font-family: Roboto, Arial, sans-serif;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.qaqc-topbar-actions {
    align-items: stretch;
    display: flex;
    flex: 0 0 auto;
    height: 64px;
    margin: 0;
    overflow: visible;
    position: relative;
    z-index: auto;
}

.qaqc-topbar-tool {
    align-items: center;
    display: flex;
    overflow: visible;
    position: relative;
}

.qaqc-topbar-icon {
    align-items: center;
    background: transparent;
    border: 0;
    border-left: 1px solid #edf0f2;
    color: #31536d;
    display: inline-flex;
    font-size: 18px;
    height: 64px;
    justify-content: center;
    min-width: 48px;
    padding: 0;
    position: relative;
}

.qaqc-topbar-icon:hover,
.qaqc-topbar-icon:focus,
.qaqc-topbar-icon.active {
    background: #eef5fa;
    color: #116aa5;
    outline: 0;
}

.qaqc-notification-badge {
    align-items: center;
    background: #d94b45;
    border: 2px solid #fff;
    border-radius: 10px;
    color: #fff;
    display: flex;
    font-size: 10px;
    font-weight: 700;
    height: 19px;
    justify-content: center;
    line-height: 1;
    min-width: 19px;
    padding: 0 4px;
    position: absolute;
    right: 5px;
    top: 10px;
}

.qaqc-project-switcher {
    align-items: flex-end;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    min-width: 210px;
    padding: 4px 10px !important;
}

.qaqc-project-switcher .itemDuAn {
    background: transparent;
    border: 0;
    color: #163c5b;
    font-size: 14px;
    font-weight: 700;
    max-width: 310px;
    overflow: hidden;
    padding: 0;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qaqc-project-switcher .itemDuAn i {
    margin-left: 5px;
}

.qaqc-project-switcher .topbar-custom-itembottom {
    gap: 6px;
    justify-content: flex-end;
    margin-top: 5px;
    max-width: 360px;
    overflow: visible;
    padding: 0;
}

.qaqc-project-switcher .custom_ActiveTabDefaultDuAn {
    background: #edf2f5;
    border: 0;
    border-radius: 3px;
    color: #31536d;
    font-size: 10px !important;
    font-weight: 700;
    height: 22px;
    line-height: 22px;
    max-width: none;
    overflow: hidden;
    padding: 0 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qaqc-project-switcher .custom_TabDefault_ActiveDuAn {
    background: #173f61;
    color: #fff;
}

.qaqc-topbar-panel {
    background: #fff;
    border: 1px solid #cdd8e0;
    box-shadow: 0 12px 28px rgba(31, 52, 70, .2);
    position: absolute;
    right: 0;
    top: 64px;
    width: 420px;
    z-index: 1004;
}

.qaqc-topbar-panel header {
    align-items: center;
    border-bottom: 1px solid #dfe5ea;
    display: flex;
    justify-content: space-between;
    min-height: 50px;
    padding: 9px 12px;
}

.qaqc-topbar-panel header strong {
    color: #173f61;
    display: block;
    font-size: 15px;
}

.qaqc-topbar-panel header small {
    color: #677d8e;
    display: block;
    font-size: 12px;
    font-weight: 400;
    margin-top: 2px;
}

.qaqc-panel-close,
.qaqc-panel-actions button {
    align-items: center;
    background: transparent;
    border: 0;
    color: #527085;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    padding: 0;
    width: 32px;
}

.qaqc-panel-actions {
    display: flex;
    gap: 2px;
}

.qaqc-panel-actions button:hover,
.qaqc-panel-actions button:focus,
.qaqc-panel-close:hover,
.qaqc-panel-close:focus {
    background: #edf4f8;
    color: #116aa5;
    outline: 0;
}

.qaqc-panel-actions button:disabled {
    color: #afbbc3;
    cursor: default;
}

.qaqc-search-input {
    align-items: center;
    border-bottom: 1px solid #e2e8ec;
    display: flex;
    padding: 10px 12px;
}

.qaqc-search-input i {
    color: #7890a1;
    margin-right: 9px;
}

.qaqc-search-input input {
    border: 0;
    color: #173f61;
    flex: 1 1 auto;
    font-size: 14px;
    height: 32px;
    outline: 0;
}

.qaqc-panel-list {
    max-height: 430px;
    overflow-y: auto;
}

.qaqc-panel-list > button {
    align-items: center;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #edf0f2;
    color: #27465d;
    display: flex;
    min-height: 60px;
    padding: 10px 12px;
    text-align: left;
    width: 100%;
}

.qaqc-panel-list > button:hover,
.qaqc-panel-list > button:focus,
.qaqc-panel-list > button.active {
    background: #edf6fb;
    outline: 0;
}

.qaqc-result-icon {
    align-items: center;
    background: #e7f0f6;
    color: #216d9d;
    display: flex;
    flex: 0 0 34px;
    height: 34px;
    justify-content: center;
    margin-right: 10px;
}

.qaqc-result-copy {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
}

.qaqc-result-copy strong {
    color: #173f61;
    display: block;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
}

.qaqc-result-copy small,
.qaqc-result-copy em {
    color: #698092;
    display: block;
    font-size: 11px;
    font-style: normal;
    line-height: 1.4;
    margin-top: 3px;
}

.qaqc-notification-panel {
    right: -49px;
    width: 450px;
}

.qaqc-notification-list > button {
    align-items: flex-start;
    min-height: 76px;
}

.qaqc-notification-list > button.unread {
    background: #f1f7fb;
}

.qaqc-notification-list > button.unread .qaqc-result-copy strong {
    color: #075f98;
}

.qaqc-notification-dot {
    border-radius: 50%;
    display: block;
    flex: 0 0 9px;
    height: 9px;
    margin: 5px 10px 0 0;
}

.qaqc-panel-empty {
    color: #6b7f8d;
    font-size: 13px;
    padding: 34px 16px;
    text-align: center;
}

.qaqc-panel-empty.error {
    color: #a54c45;
}

.qaqc-topbar-backdrop {
    background: transparent;
    border: 0;
    bottom: 0;
    left: 0;
    padding: 0;
    position: fixed;
    right: 0;
    top: 64px;
    z-index: 1001;
}

@media (max-width: 991.98px) {
    .qaqc-project-switcher {
        min-width: 170px;
    }

    .qaqc-project-switcher .itemDuAn {
        max-width: 210px;
    }

    .qaqc-topbar-breadcrumb .breadcrumb-item a {
        font-size: 15px;
    }
}

@media (max-width: 767.98px) {
    .qaqc-topbar {
        flex-wrap: wrap;
        height: 126px;
    }

    .qaqc-topbar-breadcrumb,
    .qaqc-topbar-actions {
        flex: 0 0 100%;
        height: 63px;
    }

    .qaqc-topbar-actions {
        border-top: 1px solid #e4e9ed;
        justify-content: flex-end;
    }

    .qaqc-topbar-icon {
        height: 62px;
    }

    .qaqc-project-switcher {
        flex: 1 1 auto;
        min-width: 0;
    }

    .qaqc-topbar-panel {
        position: fixed;
        right: 8px;
        top: 122px;
        width: calc(100vw - 16px);
    }
}

/* Source: css/qaqc-weekly-report-dashboard.css */
.weekly-dashboard {
    background: #edf1f4;
    color: #203d52;
    font-family: Roboto, Arial, sans-serif;
    min-height: calc(100vh - 64px);
    padding: 12px;
    position: relative;
}

.weekly-filter-band {
    align-items: flex-end;
    background: #fff;
    border: 1px solid #cfd9e0;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(170px, 1.15fr) minmax(170px, 1.15fr) minmax(145px, .85fr) minmax(145px, .85fr) minmax(180px, 1fr) auto;
    padding: 12px;
    position: relative;
    z-index: 12;
}

.weekly-filter-field,
.weekly-filter-search {
    min-width: 0;
    position: relative;
}

.weekly-filter-field label,
.weekly-filter-search label {
    color: #27495f;
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin: 0 0 5px;
}

.weekly-filter-button,
.weekly-filter-search > div {
    align-items: center;
    background: #fff;
    border: 1px solid #bccbd5;
    display: flex;
    height: 38px;
    min-width: 0;
    width: 100%;
}

.weekly-filter-button {
    color: #29485e;
    justify-content: space-between;
    padding: 0 10px;
    text-align: left;
}

.weekly-filter-button:hover,
.weekly-filter-button:focus {
    border-color: #3182b6;
    box-shadow: 0 0 0 2px rgba(49, 130, 182, .12);
    outline: 0;
}

.weekly-filter-button span {
    display: block;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.weekly-filter-button i {
    flex: 0 0 auto;
    margin-left: 8px;
}

.weekly-filter-menu {
    background: #fff;
    border: 1px solid #b9c8d2;
    box-shadow: 0 10px 24px rgba(35, 57, 73, .18);
    left: 0;
    max-height: 330px;
    min-width: 260px;
    overflow-y: auto;
    position: absolute;
    top: 64px;
    width: 100%;
    z-index: 30;
}

.weekly-filter-menu.right {
    left: auto;
    right: 0;
}

.weekly-filter-menu-head {
    align-items: center;
    background: #edf4f8;
    border-bottom: 1px solid #d7e0e6;
    display: flex;
    justify-content: space-between;
    min-height: 38px;
    padding: 7px 10px;
    position: sticky;
    top: 0;
    z-index: 2;
}

.weekly-filter-menu-head strong {
    color: #20465f;
    font-size: 12px;
}

.weekly-filter-menu-head button {
    background: transparent;
    border: 0;
    color: #12699e;
    font-size: 11px;
    font-weight: 700;
    padding: 2px;
}

.weekly-filter-option {
    align-items: center;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #edf0f2;
    color: #2d4a5f;
    display: flex;
    font-size: 13px;
    min-height: 37px;
    padding: 7px 10px;
    text-align: left;
    width: 100%;
}

.weekly-filter-option:hover,
.weekly-filter-option:focus {
    background: #eef6fa;
    outline: 0;
}

.weekly-filter-option i {
    color: #1976b1;
    flex: 0 0 18px;
    font-size: 16px;
    margin-right: 7px;
}

.weekly-filter-option span {
    line-height: 1.35;
}

.weekly-filter-empty {
    color: #6b7e8c;
    font-size: 12px;
    padding: 18px 10px;
    text-align: center;
}

.weekly-filter-search > div {
    padding: 0 9px;
}

.weekly-filter-search i {
    color: #6d8798;
    margin-right: 8px;
}

.weekly-filter-search input {
    border: 0;
    color: #203d52;
    flex: 1 1 auto;
    font-size: 13px;
    min-width: 0;
    outline: 0;
    width: 100%;
}

.weekly-filter-actions {
    display: flex;
    gap: 6px;
}

.weekly-button {
    align-items: center;
    border: 1px solid transparent;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    gap: 6px;
    height: 38px;
    justify-content: center;
    padding: 0 12px;
    white-space: nowrap;
}

.weekly-button.primary {
    background: #176fa7;
    color: #fff;
}

.weekly-button.secondary {
    background: #fff;
    border-color: #b9c8d2;
    color: #31566f;
}

.weekly-button.icon-only {
    background: #eef3f6;
    border-color: #d0dae1;
    color: #31566f;
    padding: 0;
    width: 38px;
}

.weekly-button:hover,
.weekly-button:focus {
    filter: brightness(.96);
    outline: 0;
}

.weekly-error {
    background: #fff0ef;
    border: 1px solid #e8b6b3;
    color: #a03f3a;
    font-size: 13px;
    margin-top: 10px;
    padding: 10px 12px;
}

.weekly-kpi-strip {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(5, minmax(150px, 1fr));
    margin-top: 10px;
}

.weekly-kpi {
    background: #fff;
    border: 1px solid #cfd9e0;
    border-top: 4px solid #315f83;
    min-height: 118px;
    padding: 12px 14px;
}

.weekly-kpi.green { border-top-color: #2b956e; }
.weekly-kpi.amber { border-top-color: #df982c; }
.weekly-kpi.teal { border-top-color: #187d80; }
.weekly-kpi.red { border-top-color: #c94f55; }

.weekly-kpi-label {
    align-items: center;
    color: #415d70;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    justify-content: space-between;
}

.weekly-kpi strong {
    color: #173d58;
    display: block;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.15;
    margin-top: 9px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.weekly-kpi small {
    color: #687f8f;
    display: block;
    font-size: 12px;
    margin-top: 5px;
}

.weekly-help {
    color: #1775ad;
    cursor: help;
    display: inline-flex;
    position: relative;
}

.weekly-help::after {
    background: #153b55;
    bottom: calc(100% + 7px);
    color: #fff;
    content: attr(data-tooltip);
    display: none;
    font-size: 12px;
    font-weight: 400;
    left: 50%;
    line-height: 1.45;
    padding: 8px 10px;
    position: absolute;
    transform: translateX(-50%);
    width: 265px;
    z-index: 50;
}

.weekly-help:hover::after,
.weekly-help:focus::after {
    display: block;
}

.weekly-chart-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 10px;
}

.weekly-band {
    background: #fff;
    border: 1px solid #cfd9e0;
    margin-top: 10px;
    min-width: 0;
}

.weekly-chart-grid .weekly-band {
    grid-column: span 1;
    margin-top: 0;
}

.weekly-chart-grid .weekly-chart-wide {
    grid-column: span 2;
}

.weekly-section-head {
    border-bottom: 1px solid #dfe6eb;
    min-height: 64px;
    padding: 11px 14px;
}

.weekly-section-head.split {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.weekly-section-head h2 {
    color: #173f5d;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0;
}

.weekly-section-head p {
    color: #6b7f8e;
    font-size: 12px;
    line-height: 1.4;
    margin: 4px 0 0;
}

.weekly-count {
    background: #e9f1f6;
    color: #245c80;
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 700;
    margin-left: 14px;
    padding: 6px 9px;
}

.weekly-chart {
    min-height: 285px;
    padding: 2px 8px 6px;
}

.weekly-table-wrap {
    overflow-x: auto;
    width: 100%;
}

.weekly-table {
    border-collapse: collapse;
    color: #2c475b;
    font-size: 13px;
    table-layout: fixed;
    width: 100%;
}

.weekly-table th {
    background: #e9f0f5;
    border: 1px solid #c6d3dd;
    color: #24475f;
    font-size: 12px;
    font-weight: 700;
    height: 40px;
    padding: 7px 9px;
    vertical-align: middle;
}

.weekly-table td {
    background: #fff;
    border: 1px solid #d4dee5;
    height: 45px;
    overflow-wrap: break-word;
    padding: 7px 9px;
    vertical-align: middle;
}

.weekly-table tbody tr:hover td {
    background: #f4f8fa;
}

.weekly-table .number {
    text-align: center;
    width: 54px;
}

.weekly-table .status {
    text-align: center;
    width: 125px;
}

.weekly-table .action {
    text-align: center;
    width: 62px;
}

.weekly-table .action button {
    align-items: center;
    background: #e7f1f7;
    border: 0;
    color: #176fa7;
    display: inline-flex;
    height: 30px;
    justify-content: center;
    padding: 0;
    width: 30px;
}

.weekly-table .action button:hover,
.weekly-table .action button:focus {
    background: #176fa7;
    color: #fff;
    outline: 0;
}

.weekly-table.reports th:nth-child(2) { width: 145px; }
.weekly-table.reports th:nth-child(3) { width: 125px; }
.weekly-table.reports th:nth-child(4) { width: 165px; }
.weekly-table.reports th:nth-child(5) { width: 145px; }
.weekly-table.reports th:nth-child(6) { width: 125px; }
.weekly-table.reports th:nth-child(7) { width: 110px; }
.weekly-table.reports th:nth-child(8) { width: 130px; }

.weekly-status,
.weekly-type {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.3;
    max-width: 100%;
    padding: 4px 7px;
    white-space: normal;
}

.weekly-status-sent {
    background: #dff2e9;
    color: #19724f;
}

.weekly-status-draft {
    background: #fff0d4;
    color: #98620b;
}

.weekly-status-missing {
    background: #f9dddd;
    color: #a73c42;
}

.weekly-type-1 {
    background: #e3eef8;
    color: #286b9d;
}

.weekly-type-2 {
    background: #daf1e8;
    color: #28765d;
}

.weekly-type-3 {
    background: #fcebcf;
    color: #98620b;
}

.weekly-empty {
    color: #6b7f8e;
    font-size: 13px;
    padding: 34px 14px;
    text-align: center;
}

.weekly-loading {
    align-items: center;
    background: rgba(255, 255, 255, .9);
    bottom: 0;
    color: #245d80;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    gap: 9px;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100;
}

@media (max-width: 1399.98px) {
    .weekly-filter-band {
        grid-template-columns: repeat(4, minmax(145px, 1fr));
    }

    .weekly-filter-search {
        grid-column: span 2;
    }

    .weekly-filter-actions {
        grid-column: span 2;
        justify-content: flex-end;
    }

    .weekly-chart-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .weekly-chart-grid .weekly-chart-wide {
        grid-column: span 2;
    }
}

@media (max-width: 991.98px) {
    .weekly-filter-band {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .weekly-kpi-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .weekly-chart-grid .weekly-band,
    .weekly-chart-grid .weekly-chart-wide {
        grid-column: span 2;
    }
}

@media (max-width: 575.98px) {
    .weekly-dashboard {
        padding: 8px;
    }

    .weekly-filter-band,
    .weekly-kpi-strip,
    .weekly-chart-grid {
        display: block;
    }

    .weekly-filter-field,
    .weekly-filter-search,
    .weekly-filter-actions,
    .weekly-kpi,
    .weekly-chart-grid .weekly-band {
        margin-bottom: 8px;
        width: 100%;
    }

    .weekly-filter-actions {
        justify-content: stretch;
    }

    .weekly-filter-actions .weekly-button:not(.icon-only) {
        flex: 1 1 auto;
    }

    .weekly-filter-menu {
        min-width: 100%;
        top: 63px;
    }

    .weekly-section-head.split {
        align-items: flex-start;
    }

    .weekly-section-head h2 {
        font-size: 16px;
    }
}

/* Source: css/qaqc-v4-operations.css */
.qops-page,
.qops-page * {
    box-sizing: border-box;
    letter-spacing: 0;
}

.qops-page {
    position: relative;
    min-height: calc(100vh - 112px);
    padding: 12px;
    background: #f3f6f8;
    color: #17364c;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 13px;
}

.qops-print-header {
    display: none;
}

.qops-filter-band,
.qops-band,
.qops-kpi-strip,
.qops-tabs {
    width: 100%;
    background: #fff;
    border: 1px solid #cbd7e0;
}

.qops-filter-band {
    position: relative;
    z-index: 30;
    padding: 11px 12px 9px;
    border-top: 3px solid #17699d;
}

.qops-filter-grid {
    display: grid;
    gap: 9px 10px;
    align-items: end;
}

.week-filter-grid {
    grid-template-columns: 128px 128px minmax(210px, 1.1fr) minmax(180px, .85fr) minmax(190px, .9fr) minmax(240px, 1.2fr) auto;
}

.lookup-filter-grid {
    grid-template-columns: minmax(280px, 1.5fr) repeat(4, minmax(185px, 1fr)) minmax(135px, .65fr);
}

.qops-field {
    display: flex;
    position: relative;
    min-width: 0;
    margin: 0;
    flex-direction: column;
    gap: 5px;
    color: #29485e;
    font-weight: 600;
}

.qops-field > span {
    height: 17px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 12px;
}

.qops-field input,
.qops-field select,
.qops-multi-trigger {
    width: 100%;
    height: 36px;
    min-width: 0;
    padding: 0 10px;
    border: 1px solid #bfcdd7;
    border-radius: 4px;
    background: #fff;
    color: #17364c;
    outline: 0;
    font-size: 13px;
    font-weight: 400;
}

.qops-field input:focus,
.qops-field select:focus,
.qops-multi-trigger:focus,
.qops-multi-trigger.open {
    border-color: #2482bd;
    box-shadow: 0 0 0 2px rgba(36, 130, 189, .13);
}

.qops-input-icon {
    position: relative;
}

.qops-input-icon > i {
    position: absolute;
    z-index: 1;
    top: 11px;
    left: 10px;
    color: #668094;
}

.qops-input-icon input {
    padding-left: 31px;
}

.qops-multi-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    text-align: left;
}

.qops-multi-trigger > span {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.qops-multi-trigger > i {
    margin-left: 8px;
    color: #49677c;
}

.qops-multi-menu {
    position: absolute;
    z-index: 1300;
    top: calc(100% + 5px);
    left: 0;
    width: max(100%, 330px);
    min-width: 260px;
    max-width: min(440px, 88vw);
    padding: 7px;
    border: 1px solid #aebfcb;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(29, 54, 72, .2);
}

.qops-multi-menu.align-right {
    right: 0;
    left: auto;
}

.qops-check-all {
    width: 100%;
    height: 33px;
    margin-bottom: 4px;
    padding: 0 9px;
    border: 0;
    border-bottom: 1px solid #d8e1e7;
    background: #f4f7f9;
    color: #17699d;
    cursor: pointer;
    text-align: left;
    font-size: 12px;
    font-weight: 700;
}

.qops-option-list {
    max-height: 300px;
    overflow-x: hidden;
    overflow-y: auto;
}

.qops-option-list.compact {
    max-height: 230px;
}

.qops-option-list label {
    display: flex;
    width: 100%;
    min-height: 34px;
    margin: 0;
    padding: 7px 8px;
    align-items: flex-start;
    gap: 8px;
    border-bottom: 1px solid #edf1f4;
    color: #29485e;
    cursor: pointer;
    line-height: 19px;
    font-size: 13px;
    font-weight: 500;
}

.qops-option-list label:hover {
    background: #edf5fa;
}

.qops-option-list input[type="checkbox"] {
    width: 17px;
    height: 17px;
    margin: 1px 0 0;
    flex: 0 0 17px;
    accent-color: #17699d;
}

.qops-option-list .option-icon {
    width: 16px;
    margin-top: 2px;
    color: #56758a;
    text-align: center;
}

.qops-color-dot {
    width: 9px;
    height: 9px;
    margin-top: 5px;
    flex: 0 0 9px;
    border-radius: 50%;
    background: #708494;
}

.qops-filter-actions,
.qops-report-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.qops-filter-actions {
    height: 36px;
    white-space: nowrap;
}

.lookup-actions {
    grid-column: span 2;
}

.qops-report-actions {
    margin-top: 9px;
    padding-top: 9px;
    border-top: 1px solid #dce4ea;
}

.qops-button,
.qops-icon-button {
    height: 36px;
    border: 1px solid #b9c8d3;
    border-radius: 4px;
    background: #fff;
    color: #28475c;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
}

.qops-button {
    padding: 0 13px;
}

.qops-button i {
    margin-right: 5px;
}

.qops-icon-button {
    width: 36px;
    flex: 0 0 36px;
    padding: 0;
}

.qops-button:hover,
.qops-icon-button:hover {
    border-color: #6d8da3;
    background: #edf4f8;
}

.qops-button.primary {
    border-color: #17699d;
    background: #17699d;
    color: #fff;
}

.qops-button.success {
    border-color: #27825f;
    background: #27825f;
    color: #fff;
}

.qops-button.secondary {
    border-color: #9fb1bd;
    background: #f5f7f9;
}

.qops-button:disabled,
.qops-icon-button:disabled {
    opacity: .48;
    cursor: default;
}

.qops-alert {
    margin-top: 10px;
    padding: 10px 12px;
    border-left: 4px solid #c24f4f;
    background: #fff0f0;
    color: #8b3030;
    font-weight: 600;
}

.qops-kpi-strip {
    display: grid;
    margin-top: 10px;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
}

.qops-kpi-strip article {
    min-width: 0;
    min-height: 82px;
    padding: 13px 16px;
    border-right: 1px solid #d8e1e7;
}

.qops-kpi-strip article:last-child {
    border-right: 0;
}

.qops-kpi-strip span {
    display: block;
    color: #4a667a;
    font-size: 12px;
    font-weight: 700;
}

.qops-kpi-strip span i {
    margin-left: 3px;
    color: #17699d;
}

.qops-kpi-strip strong {
    display: block;
    margin-top: 5px;
    color: #143a55;
    line-height: 34px;
    font-size: 29px;
}

.qops-module-grid {
    display: grid;
    margin-top: 10px;
    gap: 8px;
    grid-template-columns: repeat(5, minmax(205px, 1fr));
}

.qops-module-card {
    min-width: 0;
    min-height: 124px;
    padding: 12px;
    border: 1px solid #c7d3dc;
    border-top: 4px solid #526b7d;
    border-radius: 4px;
    background: #fff;
}

.qops-module-head {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
}

.qops-module-head strong,
.qops-link-text {
    min-width: 0;
    overflow: hidden;
    color: #183b54;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 13px;
    font-weight: 700;
}

.qops-link-text,
.qops-project-link {
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
}

.qops-link-text {
    cursor: pointer;
}

.qops-link-text:hover,
.qops-link-text:focus,
.qops-project-link:hover strong,
.qops-project-link:focus strong {
    color: #0872b9;
    text-decoration: underline;
}

.qops-sync-label {
    display: inline-flex;
    margin-top: 4px;
    align-items: center;
    gap: 5px;
    color: #647c8d;
    font-size: 10px;
    font-weight: 600;
}

.qops-module-icon {
    display: inline-flex;
    width: 29px;
    height: 29px;
    flex: 0 0 29px;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: #526b7d;
    color: #fff;
    font-size: 14px;
}

.qops-module-value {
    margin-top: 7px;
    color: #173d57;
    line-height: 34px;
    font-size: 27px;
    font-weight: 700;
}

.qops-module-metrics {
    display: flex;
    min-width: 0;
    gap: 11px;
    color: #607789;
    font-size: 11px;
    white-space: nowrap;
}

.qops-module-metrics b {
    color: #203f55;
    font-size: 12px;
}

.module-image { border-top-color: #2878ad; }
.module-image .qops-module-icon { background: #2878ad; }
.module-approval { border-top-color: #536f91; }
.module-approval .qops-module-icon { background: #536f91; }
.module-accept-work { border-top-color: #2a8f72; }
.module-accept-work .qops-module-icon { background: #2a8f72; }
.module-accept-material { border-top-color: #6e8d3c; }
.module-accept-material .qops-module-icon { background: #6e8d3c; }
.module-hscl { border-top-color: #1d6fa5; }
.module-hscl .qops-module-icon { background: #1d6fa5; }
.module-risk { border-top-color: #d08927; }
.module-risk .qops-module-icon { background: #d08927; }
.module-bb-hoso { border-top-color: #16867f; }
.module-bb-hoso .qops-module-icon { background: #16867f; }
.module-bb-hientruong { border-top-color: #bd4a4a; }
.module-bb-hientruong .qops-module-icon { background: #bd4a4a; }
.module-defect { border-top-color: #805f91; }
.module-defect .qops-module-icon { background: #805f91; }

.qops-chart-grid {
    display: grid;
    margin-top: 10px;
    gap: 10px;
    grid-template-columns: 1fr 1fr;
}

.qops-band {
    margin-top: 10px;
}

.qops-chart-grid .qops-band {
    min-width: 0;
    margin-top: 0;
}

.qops-section-head {
    display: flex;
    min-height: 48px;
    padding: 10px 13px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #d5dfe6;
    background: #f8fafb;
}

.qops-section-head h2 {
    margin: 0;
    color: #173c55;
    line-height: 22px;
    font-size: 16px;
    font-weight: 700;
}

.qops-section-head > div > small {
    display: block;
    margin-top: 2px;
    color: #61798b;
    font-size: 11px;
}

.qops-section-head > span {
    flex: 0 0 auto;
    color: #5f788b;
    font-size: 12px;
    font-weight: 600;
}

.qops-chart {
    min-height: 310px;
    padding: 4px 8px 0;
}

.qops-table-wrap {
    width: 100%;
    overflow: auto;
    background: #fff;
}

.qops-table {
    width: 100%;
    border-collapse: collapse;
    color: #1f3d52;
    table-layout: auto;
    font-size: 12px;
}

.qops-table th,
.qops-table td {
    min-height: 38px;
    padding: 8px 9px;
    border-right: 1px solid #d4dee5;
    border-bottom: 1px solid #d4dee5;
    vertical-align: middle;
}

.qops-table th:last-child,
.qops-table td:last-child {
    border-right: 0;
}

.qops-table thead th {
    position: sticky;
    z-index: 3;
    top: 0;
    background: #286a9f;
    color: #fff;
    white-space: nowrap;
    text-align: left;
    font-size: 12px;
    font-weight: 700;
}

.qops-table tbody tr:nth-child(even) {
    background: #f6f8fa;
}

.qops-table tbody tr:hover {
    background: #edf5fa;
}

.qops-table td strong,
.qops-table td small {
    display: block;
}

.qops-table td small {
    margin-top: 2px;
    color: #647d90;
    line-height: 16px;
}

.qops-table .numeric {
    text-align: center;
}

.qops-table .index-col {
    width: 52px;
    min-width: 52px;
    text-align: center;
}

.qops-table .date-col {
    width: 122px;
    min-width: 122px;
    white-space: nowrap;
}

.qops-table .action-col {
    width: 55px;
    min-width: 55px;
    text-align: center;
}

.qops-table .wide-col {
    min-width: 260px;
}

.qops-table .title-cell {
    min-width: 250px;
    max-width: 440px;
}

.qops-table .total-col {
    background: #edf4f8;
}

.quality-table {
    min-width: 1320px;
}

.project-matrix {
    min-width: 1450px;
}

.activity-table {
    min-width: 1500px;
}

.lookup-table {
    min-width: 1940px;
}

.qops-module-pill,
.qops-event-pill,
.qops-status,
.qops-type-pill,
.audit-label {
    display: inline-flex;
    min-height: 23px;
    padding: 3px 7px;
    align-items: center;
    gap: 4px;
    border: 1px solid #9fb2bf;
    border-radius: 3px;
    background: #fff;
    color: #365468;
    line-height: 15px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.qops-module-pill.module-image { color: #2878ad; border-color: #2878ad; }
.qops-module-pill.module-approval { color: #536f91; border-color: #536f91; }
.qops-module-pill.module-accept-work { color: #2a8f72; border-color: #2a8f72; }
.qops-module-pill.module-accept-material { color: #6e8d3c; border-color: #6e8d3c; }
.qops-module-pill.module-hscl { color: #1d6fa5; border-color: #1d6fa5; }
.qops-module-pill.module-risk { color: #b2711c; border-color: #d08927; }
.qops-module-pill.module-bb-hoso { color: #16867f; border-color: #16867f; }
.qops-module-pill.module-bb-hientruong { color: #a93f3f; border-color: #bd4a4a; }
.qops-module-pill.module-defect { color: #715180; border-color: #805f91; }

.qops-pill-link {
    cursor: pointer;
}

.qops-pill-link:hover,
.qops-pill-link:focus {
    box-shadow: 0 0 0 2px rgba(23, 105, 157, .14);
}

.qops-project-link {
    display: inline-flex;
    min-width: 0;
    flex-direction: column;
    cursor: pointer;
    color: inherit;
}

.qops-project-link strong,
.qops-project-link small {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qops-event-pill.event-upload,
.qops-event-pill.event-create,
.qops-event-pill.event-submit { color: #246e9c; border-color: #70a9cc; background: #edf7fd; }
.qops-event-pill.event-response { color: #19745c; border-color: #6eb39f; background: #edf9f5; }
.qops-event-pill.event-complete { color: #287a48; border-color: #78b78e; background: #eff9f2; }
.qops-event-pill.event-index_update,
.qops-event-pill.event-workflow { color: #9a641c; border-color: #d5aa6d; background: #fff8ec; }

.qops-status.filled {
    font-weight: 700;
}

.qops-type-pill {
    color: #1b6896;
    border-color: #8fb5ce;
    background: #edf6fb;
}

.qops-type-pill.defect {
    color: #72517f;
    border-color: #b7a0c0;
    background: #f7f2f9;
}

.audit-label {
    margin-top: 4px;
    color: #a23c3c;
    border-color: #cf8585;
    background: #fff3f3;
}

.score-cell strong {
    color: #125d91;
    font-size: 16px;
}

.success-text {
    color: #23805e;
}

.danger-text {
    color: #b63d3d;
}

.qops-data-note {
    padding: 8px 12px;
    border-top: 1px solid #d6e0e7;
    background: #f7fafc;
    color: #526f83;
    font-size: 11px;
}

.qops-data-note i {
    margin-right: 4px;
    color: #17699d;
}

.qops-table .action-col button,
.report-actions button {
    width: 29px;
    height: 29px;
    margin: 1px;
    padding: 0;
    border: 1px solid #aabcc8;
    border-radius: 3px;
    background: #fff;
    color: #17699d;
    cursor: pointer;
}

.qops-table .action-col button:hover,
.report-actions button:hover {
    border-color: #17699d;
    background: #eaf4fa;
}

.report-actions {
    width: 150px;
    min-width: 150px;
    text-align: center !important;
    white-space: nowrap;
}

.qops-empty {
    min-height: 90px;
    padding: 34px 15px;
    color: #657f91;
    text-align: center;
    font-size: 13px;
}

.qops-pagination {
    display: flex;
    min-height: 49px;
    padding: 8px 12px;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #d4dee5;
    background: #f8fafb;
    color: #4f6b7f;
    font-size: 12px;
}

.qops-pagination > div {
    display: flex;
    gap: 4px;
}

.qops-pagination button {
    min-width: 31px;
    height: 31px;
    padding: 0 7px;
    border: 1px solid #b7c6d0;
    border-radius: 3px;
    background: #fff;
    color: #294b62;
    cursor: pointer;
}

.qops-pagination button.active {
    border-color: #17699d;
    background: #17699d;
    color: #fff;
}

.qops-pagination button:disabled {
    opacity: .4;
    cursor: default;
}

.qops-loading {
    display: flex;
    position: fixed;
    z-index: 2100;
    right: 24px;
    bottom: 20px;
    min-width: 235px;
    min-height: 46px;
    padding: 11px 15px;
    align-items: center;
    gap: 9px;
    border: 1px solid #8fa8b9;
    border-radius: 4px;
    background: #173f5b;
    box-shadow: 0 6px 18px rgba(24, 50, 68, .25);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

.qops-tabs {
    display: flex;
    margin-bottom: 10px;
    border-bottom: 2px solid #17699d;
}

.qops-tabs button {
    min-width: 155px;
    height: 42px;
    padding: 0 17px;
    border: 0;
    border-right: 1px solid #d5dfe6;
    background: #f7f9fa;
    color: #476276;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
}

.qops-tabs button i {
    margin-right: 5px;
}

.qops-tabs button span {
    margin-left: 5px;
    color: inherit;
}

.qops-tabs button.active {
    background: #17699d;
    color: #fff;
}

.lookup-result-band {
    margin-top: 10px;
}

@media (max-width: 1450px) {
    .week-filter-grid {
        grid-template-columns: 128px 128px repeat(3, minmax(180px, 1fr));
    }

    .week-filter-grid .keyword-field {
        grid-column: span 2;
    }

    .week-filter-grid .qops-filter-actions {
        grid-column: span 3;
    }

    .qops-module-grid {
        grid-template-columns: repeat(3, minmax(210px, 1fr));
    }

    .lookup-filter-grid {
        grid-template-columns: repeat(4, minmax(190px, 1fr));
    }
}

@media (max-width: 900px) {
    .qops-page { padding: 8px; }
    .week-filter-grid,
    .lookup-filter-grid { grid-template-columns: 1fr 1fr; }
    .week-filter-grid .keyword-field,
    .week-filter-grid .qops-filter-actions,
    .lookup-actions { grid-column: 1 / -1; }
    .qops-filter-actions { justify-content: flex-start; overflow-x: auto; }
    .qops-module-grid { grid-template-columns: 1fr 1fr; }
    .qops-chart-grid { grid-template-columns: 1fr; }
    .qops-kpi-strip { grid-template-columns: 1fr 1fr; }
    .qops-kpi-strip article:nth-child(2) { border-right: 0; }
}

@media print {
    @page { size: A4 landscape; margin: 9mm; }
    body * { visibility: hidden !important; }
    .qops-week-page,
    .qops-week-page * { visibility: visible !important; }
    .qops-week-page {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-height: 0;
        padding: 0;
        background: #fff;
        color: #000;
    }
    .qops-print-header { display: block; margin-bottom: 8px; text-align: center; }
    .qops-print-header h1 { margin: 0 0 5px; font-size: 20px; }
    .qops-no-print,
    .qops-loading { display: none !important; }
    .qops-module-grid { grid-template-columns: repeat(3, 1fr); gap: 5px; }
    .qops-module-card { min-height: 92px; break-inside: avoid; }
    .qops-module-value { font-size: 21px; }
    .qops-chart-grid { grid-template-columns: 1fr 1fr; }
    .qops-band,
    .qops-kpi-strip,
    .qops-module-grid { break-inside: avoid; }
    .qops-table-wrap { overflow: visible; }
    .qops-table { min-width: 0 !important; font-size: 8px; }
    .qops-table th,
    .qops-table td { padding: 4px; }
    .qops-section-head h2 { font-size: 13px; }
}