﻿#table-mucluc { position: fixed; top: 70px; right: 0; width: 300px; z-index: 10000; background-color: #fff; height: calc(100% - 110px); overflow-y: auto; display: none; border: 1px solid rgba(0,0,0,.125); padding-left: 5px; }

.mucluc-item { position: relative; display: block; padding: .75rem 1.25rem; background-color: #fff; border: 1px solid rgba(0,0,0,.125) !important; color: #495057; text-align: inherit; margin-bottom: 2px; }

.tree, .tree ul { margin: 0; padding: 0; list-style: none }

    .tree ul { margin-left: 1em; position: relative }

        .tree ul ul { margin-left: .5em }

        .tree ul:before { content: ""; display: block; width: 0; position: absolute; top: 0; bottom: 0; left: 0; border-left: 1px solid }

    .tree li { margin: 0; padding: 0 1em; line-height: 2em; color: #369; font-weight: 700; position: relative }

        .tree li a:hover, .tree li:hover { color: red; }

    .tree ul li:before { content: ""; display: block; width: 10px; height: 0; border-top: 1px solid; margin-top: -1px; position: absolute; top: 1em; left: 0 }

    .tree ul li:last-child:before { background: #fff; height: auto; top: 1em; bottom: 0 }

.indicator { margin-right: 5px; }

.tree li a { text-decoration: none; color: #369; }

.tree li button, .tree li button:active, .tree li button:focus { text-decoration: none; color: #369; border: none; background: transparent; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; outline: 0; }

#content { margin-bottom: 200px; }

.col-chitieu,
.col-lanhdao { min-width: 300px; max-width: 350px; }

.col-chitieuchitiet,
.col-phancong { min-width: 500px; max-width: 550px; }

.box-chitieu { width: 100% !important; height: 76vh; overflow: auto; }

.table-in { margin-bottom: 0px !important; }

    .table-in tr td:first-child,
    .table-in tr th:first-child { /*width: 300px !important;*/ }

    .table-in .col { width: 70px !important; text-align: center; }

.document-editor .ck-editor p { margin-bottom: 0 !important; }

/*.document-editor .ck-editor .ck-content {
    height: 500px!important;
}*/

p { margin: 0; }

.text-ghichu { font-size: 14px; font-style: italic; }

.box-table .qnp-col { min-width: 300px; }

.box-table .qnp-col-bc { min-width: 350px; }

.qnp-col-stt { max-width: 50px !important; min-width: 50px !important; text-align: center; }

.qnp-col-70 { max-width: 70px !important; min-width: 70px !important; }

.qnp-col-100 { max-width: 100px !important; min-width: 100px !important; }

.qnp-col-120 { max-width: 120px !important; min-width: 120px !important; }

.qnp-col-130 { max-width: 130px !important; min-width: 130px !important; }

.qnp-col-150 { max-width: 150px !important; min-width: 150px !important; }

.qnp-col-200 { max-width: 200px !important; min-width: 200px !important; }

.qnp-col-300 { max-width: 300px !important; min-width: 300px !important; }

.qnp-col-min-200 { min-width: 150px !important; }



.box-table { width: 100%; overflow: auto; }

.qnp-img { width: 100%; }

.qnp-word-break { word-break: break-all; }

.qnp-cbvc { background-color: #ffffbe; }

div.online-ueh { background: #005f69; color: #fff; font-size: 13px; padding: 5px; border-radius: 3px; border: 1px solid #a3a3a3; }

div.online-tuxa { background: #f26f33; color: #fff; font-size: 13px; padding: 5px; border-radius: 3px; border: 1px solid #a3a3a3; }

.bg { background-image: url(/images/bg.jpg); background-repeat: no-repeat; background-position: center; }

.login-btn { background: #005f69; color: #fff; padding: 10px 0; }

    .login-btn:hover { background: #f26f33; color: #fff; }

.text-small { font-size: 0.8rem; }
    .text-small a, .text-small label { cursor: pointer; }

    .text-small a { float: right; color: #212529; text-decoration: none; }
        .text-small a:hover, .text-small label:hover { color: #f26f33 !important; }
#qr { position: relative; }
.qnp-qrcode img { border: 1px solid #808080; padding: 10px; border-radius: 10px; margin: auto; }

.box-refresh-token { position: absolute; top: 35%; left: 35%; z-index: 1000; display: none; }

.token-expired .box-refresh-token { display: block; }

.token-expired .qnp-qrcode img { opacity: 0.3; }

.row .form-floating > label { margin-left: .75rem; }

.w-200px { width: 200px; }

.w-300px { width: 300px; }

.dulieu-donvi th { text-align: start; width: 300px; }

.white-space { white-space: break-spaces; }

.list-group-item.active { background-color: #0a626b; border-color: #0a626b; }

.box-info { height: 500px; overflow-y: auto; }

.required { color: red; font-style: italic; font-size: 0.9rem }
.width-15 { width: 15%; }
.width-20 { width: 20%; }
.width-30 { width: 30%; }
.width-40 { width: 40%; }
.width-50 { width: 50%; }
.width-60 { width: 60%; }

.img-result { width: 100px; max-height: 100px; }
.img-result-other { padding-right: 5px; }
.msg-files .msg-image { display: inline-flex; cursor: pointer; border: 1px solid #d2d0d0; position: relative }
    .msg-files .msg-image img { padding-right: 3px; height: 64px; }

.message ul { list-style-type: none; }
.grid { display: grid; grid-gap: 10px; align-items: stretch; }
.msg-files { padding-left: 0px !important; }
    .msg-files li.msg-file { background: rgba(3, 160, 222, 0.14); padding: 5px; border-radius: 3px !important; word-break: break-word; border-bottom: 2px solid white; }
    .msg-files li.msg-image img:hover { transform: scale(1.05); }
.remove-image { position: absolute; right: 0; color: red; visibility: hidden; right: 5px; cursor: pointer }
.msg-files li.msg-image:hover .remove-image, .msg-files li.msg-image img:hover .remove-image, .photo-gallery .item:hover .remove-image { visibility: visible; transition: visibility 0.5s, opacity 0.5s linear; }
.font-weight-500 { font-weight: 500 }
.select2-search__field { width: 100% !important }
.dataTable thead th { text-align: center !important; }
.table span.history-info { display: flex; font-style: italic; font-size: 13px; }
.violation .badge { font-weight: 400 !important; word-wrap: break-word; display: inline-block; white-space: break-spaces !important; }
.mr-5 { margin-right: 5px; }
.text-right { text-align: right }
.tbl-logs td ul { list-style-type: decimal; padding-left: 20px }
    .tbl-logs td ul li { word-break: break-word; }