@charset "UTF-8";
/**
 * Voffice 2.0 Home theme
 * @author TruongTX5
 * @license Viettel Group
 */
/*****************************Variables**************************** */
/**
 * Voffice 2.0 Variables
 * @author TruongTX5
 * @license Viettel Group
 */
/*****************************Variables**************************** */
/*****************************Mix-ins**************************** */
/**
 * Voffice 2.0 Mix-ins
 * @author TruongTX5
 * @license Viettel Group
 */
/**
 * Voffice 2.0 Variables
 * @author TruongTX5
 * @license Viettel Group
 */
/*****************************Variables**************************** */
/*****************************Mix-ins**************************** */
/*****************************Theme**************************** */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

*::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

*::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

/*-----------------------------------Body------------------------------------- */
body {
  padding: 0;
  margin: 0;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

body,
.z-label {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  line-height: 20px;
  color: #262626; }

*::-webkit-input-placeholder {
  font-style: italic; }

*:-moz-placeholder {
  font-style: italic; }

*::-moz-placeholder {
  font-style: italic; }

*:-ms-input-placeholder {
  font-style: italic; }

/*-----------------------------------Border layout------------------------------------- */
.z-borderlayout {
  background-color: #f3f3f3; }

.z-borderlayout-icon.z-west-exp, .z-borderlayout-icon.z-east-exp {
  background-image: none; }

.z-west-splt, .z-east-splt {
  background-color: #ccc;
  background-image: none;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-west-splt:hover, .z-east-splt:hover {
  opacity: 0.8; }

.z-west-splt-btn, .z-east-splt-btn {
  background: none;
  font-size: 32px;
  vertical-align: middle;
  line-height: 50px;
  text-align: center;
  opacity: 1;
  color: #fff;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background-color: #44494D;
  width: 30px;
  height: 50px;
  position: relative; }

.z-west-splt-btn {
  left: -24px; }
  .z-west-splt-btn:hover {
    left: -4px; }
  .z-west-splt-btn:before {
    content: "";
    position: relative;
    top: -2px; }

.z-east-splt-btn {
  left: -6px; }
  .z-east-splt-btn:hover {
    left: -26px; }
  .z-east-splt-btn:before {
    content: "";
    position: relative;
    top: -2px; }

.z-west-exp, .z-east-exp {
  background: none;
  font-size: 32px;
  vertical-align: middle;
  line-height: 50px;
  text-align: center;
  opacity: 1;
  color: #fff;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background-color: #44494D;
  width: 30px;
  height: 50px;
  position: relative;
  top: calc(50% - 25px); }

.z-west-exp {
  left: -23px; }
  .z-west-exp:hover {
    left: -1px; }
  .z-west-exp:before {
    content: "";
    position: relative;
    top: -2px; }

.z-east-exp {
  left: -1px; }
  .z-east-exp:hover {
    left: -23px; }
  .z-east-exp:before {
    content: "";
    position: relative;
    top: -2px; }

.z-west-splt-btn, .z-west-exp, .z-east-splt-btn, .z-east-exp {
  font-family: "FontAwesome";
  font-style: normal;
  font-weight: normal;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-west-colpsd, .z-east-colpsd {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  overflow: visible; }

.z-west-colpsd {
  left: 0 !important;
  width: 8px !important;
  background-color: #ccc; }
  .z-west-colpsd:hover {
    opacity: 0.8; }

.z-east-colpsd {
  right: 0 !important;
  left: auto !important; }

/*-----------------------------------Window------------------------------------- */
.z-window-modal-header, .z-window-popup-header, .z-window-highlighted-header, .z-window-overlapped-header, .z-window-embedded-header {
  font-family: Inter;
  color: #262626;
  padding: 0;
  /*border-bottom: 1px solid #d5d5d5;*/
  font-weight: 600;
  margin: 0px 12px 0px;
  /*padding-bottom: 12px;*/
  font-size: 16px;
  vertical-align: middle;
  line-height: 24px; }

.z-window-modal-header .z-caption .z-caption-l, .z-window-popup-header .z-caption .z-caption-l, .z-window-highlighted-header .z-caption .z-caption-l, .z-window-overlapped-header .z-caption .z-caption-l, .z-window-embedded-header .z-caption .z-caption-l {
  font-size: 18px;
  font-weight: 600;
  color: #262626; }

.z-window-modal-header .z-caption .z-caption-r, .z-window-popup-header .z-caption .z-caption-r, .z-window-highlighted-header .z-caption .z-caption-r, .z-window-overlapped-header .z-caption .z-caption-r, .z-window-embedded-header .z-caption .z-caption-r {
  font-size: 16px; }

.z-window-modal-shadow, .z-window-overlapped-shadow, .z-window-popup-shadow, .z-window-embedded-shadow, .z-window-highlighted-shadow {
  border-radius: 3px; }

.z-window-embedded-hl, .z-window-modal-hl, .z-window-highlighted-hl, .z-window-overlapped-hl, .z-window-popup-hl {
  background: #fff;
  padding-top: 5px;
  padding-bottom: 10px !important;
  padding-left: 8px; }

.z-window-modal-header > table {
  height: 46px;
} 

.z-window-embedded-hr, .z-window-modal-hr, .z-window-highlighted-hr, .z-window-overlapped-hr, .z-window-popup-hr {
  background: #fff;
  padding-right: 8px; }

.z-window-embedded-hm, .z-window-modal-hm, .z-window-highlighted-hm, .z-window-overlapped-hm, .z-window-popup-hm {
  background: #fff; }

.z-window-embedded-tr, .z-window-modal-tr, .z-window-highlighted-tr, .z-window-overlapped-tr, .z-window-popup-tr {
  background: #fff; }

.z-window-modal-cl, .z-window-highlighted-cl, .z-window-overlapped-cl {
  padding: 0; }

.z-window-modal-cr, .z-window-highlighted-cr, .z-window-overlapped-cr {
  padding: 0; }

.z-window-modal-bl, .z-window-highlighted-bl, .z-window-overlapped-bl {
  height: 0; }

.z-window-modal-br, .z-window-highlighted-br, .z-window-overlapped-br {
  height: 0; }

.z-window-modal-cm, .z-window-highlighted-cm, .z-window-overlapped-cm {
  border: solid transparent;
  border-width: 3px;
  border-top: 1px solid #dddddd;}

.z-window-embedded-icon, .z-window-popup-icon, .z-window-modal-icon, .z-window-overlapped-icon, .z-window-highlighted-icon {
  margin: 0;
  background-color: transparent;
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 17px;
  line-height: 24px;
  text-align: center;
  color: #606060;
  height: 24px;
  width: 24px;
  vertical-align: middle;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%; }

.z-window-embedded-icon:hover, .z-window-popup-icon:hover, .z-window-modal-icon:hover, .z-window-overlapped-icon:hover, .z-window-highlighted-icon:hover {
  background-color: #fff;
  color: #44494D;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-window-embedded-close, .z-window-modal-close, .z-window-overlapped-close, .z-window-popup-close, .z-window-highlighted-close {
  background-image: none; }

.z-window-embedded-close:before, .z-window-modal-close:before, .z-window-overlapped-close:before, .z-window-popup-close:before, .z-window-highlighted-close:before {
  content: ""; }

.z-window-embedded-max, .z-window-modal-max, .z-window-overlapped-max, .z-window-popup-max, .z-window-highlighted-max {
  background-image: none; }

.z-window-embedded-max:before, .z-window-modal-max:before, .z-window-overlapped-max:before, .z-window-popup-max:before, .z-window-highlighted-max:before {
  content: ""; }

.z-window-embedded-max.z-window-embedded-maxd:before, .z-window-modal-max.z-window-modal-maxd:before, .z-window-overlapped-max.z-window-overlapped-maxd:before, .z-window-popup-max.z-window-popup-maxd:before, .z-window-highlighted-max.z-window-highlighted-maxd:before {
  content: ""; }

.z-window-modal-cnt, .z-window-highlighted-cnt, .z-window-modal-cnt-noborder, .z-window-highlighted-cnt-noborder, .z-window-overlapped-cnt-noborder {
  padding: 0;
  padding-bottom: 5px;
}

.z-window-modal-shadow, .z-window-highlighted-shadow {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none; }

/*-----------------------------------Panel------------------------------------- */
.notification-panel .select-theme-panel {
    padding: 5px 2px 2px 2px;
}

.notification-panel .z-panel-header {
    font-family: Inter;
    font-size: 16px !important;
    color: #fff !important;
}

.notification-panel .z-listbox {
    border-width: 0px;
}

.z-panel-hm, .z-panel-hl, .z-panel-hr {
  background: transparent;
  border: none; }

.z-panel-tl, .z-panel-tr {
  height: 0px; }

.z-panel-hr {
  padding-right: 0; }

.z-panel-hm .z-panel-header, .z-panel-header {
  font-family: Inter;
  font-size: 16px;
  color: #262626;
  font-weight: 600; }

.z-caption {
  table-layout: auto; }
  .z-caption .z-caption-l {
    font-family: Inter;
    font-size: 16px;
    color: #262626;
    width: 1%;
    white-space: nowrap; }


.lookup-caption.z-caption .z-caption-l {
      font-family: Inter;
      font-size: 16px;
      color: #262626;
      width: 100%;
      display: -webkit-box;
      -webkit-line-clamp: 2; /* Số dòng muốn hiển thị */
      -webkit-box-orient: vertical;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: normal; }

.lookup-caption.z-caption input, .lookup-caption.z-caption td {
    width: 28px;
  }

.lookup-caption-container{
    display: block;
}

.lookup-caption-title{
    font-family: Inter;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
    line-height: 1.4;
    font-size: 16px;
}

.lookup-caption-icon{
    display: block;
    margin-top: 4px;
    width: fit-content;
    cursor: pointer;
}

.lookup-caption.z-caption td.z-caption-r {
    text-align: left !important;
    width: 100%;
}

.lookup-caption.z-caption td.z-caption-l {
    width: 0px !important;
    display: none !important;
}

.lookup-caption.z-caption td[width="16"] {
    width: 16px !important;
    text-align: center !important;
}

.lookup-caption-container {
    display: inline-flex !important;
    white-space: nowrap;
}

.panel-input {
  border-radius: 4px;
  border: 1px solid #d9dddf;
  padding: 8px 12px;
  margin-bottom: 16px;
  background: #fff; }

.panel-input.panel-input-sign-digital {
  border-radius: 0px;
  border: 0px solid #d9dddf;
  border-top: 1px solid #d9dddf;
  padding: 8px 0px;
  margin-left: 12px;
  margin-right: 12px;
  margin-bottom: 16px;
  background: #fff; }

.panel-input.sign-digital-container {
  padding: 12px 12px; }


.panel-input-sign-digital .z-panel-hm .z-panel-header,.panel-input-sign-digital .z-panel-header {
  font-family: Inter;
  font-size: 14px;
  color: #262626;
  font-weight: 600;
}

.badge span {
  font-weight: 500;
  font-size: 13px;
}
.badge {
  display: inline-block;
  border-radius: 6px;
  padding: 2px 8px;
}
.badge-success {
  border: 1px solid #BBF7D0;
  background-color: #F0FDF4;
  color: #15803D;
  font-weight: 600;
}

.badge-success span {
  color: #15803D;
}

.badge-warning {
  border: 1px solid #FDE68A;
  background-color: #FFFBEB;
  color: #B45309;
  font-weight: 600;
}

.badge-warning span {
  color: #B45309;
}

.badge-danger {
  border: 1px solid #FECACA;
  background-color: #FEF2F2;
  color: #B91C1C;
  font-weight: 600;
}

.badge-danger span {
  color: #B91C1C;
}

.badge-info {
  border: 1px solid #BAE6FD;
  background-color: #F0F9FF;
  color: #0369A1;
  font-weight: 600;
}

.badge-info span {
  color: #0369A1;
}

.badge-purple {
  border: 1px solid #F5D0FE;
  background-color: #FDF4FF;
  color: #A21CAF;
  font-weight: 600;
}

.badge-purple span {
  color: #A21CAF;
}

.badge-normal {
  border: 1px solid #E5E7EB;
  background-color: #F9FAFB;
  color: #374151;
  font-weight: 600;
}

.badge-normal span {
  color: #374151;
}

  .panel-input .panel-caption {
    width: 100%;
    display: table; }
    .panel-input .panel-caption > div {
      display: table-cell; }
    .panel-input .panel-caption a, .panel-input .panel-caption a:visited {
      color: #44494D;
      text-decoration: none;
      font-size: 14px; }
    .panel-input .panel-caption a:hover {
      text-decoration: underline; }
  .panel-input .z-panel-hm .z-panel-header, .panel-input .z-panel-header {
    border-bottom: 0px solid #d9dddf;
    padding-bottom: 3px; }
  .panel-input .z-panel-hl {
    padding: 0; }
  .panel-input .z-panelchildren {
    padding: 10px 0 0 0; }
  .panel-input .z-panel-icon {
    margin-top: 0;
    margin-right: 0;
    background: none;
    width: 16px;
    height: 16px;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    text-align: center;
    color: #a7a8aa; }
  .panel-input .z-panel-icon:before {
    font-family: "FontAwesome";
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    vertical-align: middle;
    line-height: 16px; }
  .panel-input .z-panel-icon.z-panel-icon-over {
    color: #44494D; }
  .panel-input .z-panel-icon.z-panel-exp:before {
    content: ""; }
  .panel-input.z-panel.z-panel-colpsd .z-panel-icon {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg); }

.panel-input-doc {
  background: #d9dddf; }
  .panel-input-doc .panel-caption {
    width: 100%;
    display: table; }
    .panel-input-doc .panel-caption > div {
      display: table-cell; }
    .panel-input-doc .panel-caption a, .panel-input .panel-caption a:visited {
      color: #44494D;
      text-decoration: none;
      font-size: 14px; }
    .panel-input-doc .panel-caption a:hover {
      text-decoration: underline; }
  .panel-input-doc .z-panel-hl {
    padding: 0; }
  .panel-input-doc .z-panelchildren {
    padding: 10px 0 0 0; }
  .panel-input-doc .z-panel-icon {
    float: left;
    margin-left: 7px;
    margin-top: 0;
    margin-right: 7px;
    background: none;
    width: 16px;
    height: 16px;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    text-align: center;
    color: #44494D; }
  .panel-input-doc .z-panel-icon:before {
    font-family: "FontAwesome";
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    vertical-align: middle;
    line-height: 16px; }
  .panel-input-doc .z-panel-icon.z-panel-icon-over {
    color: #44494D; }
  .panel-input-doc .z-panel-icon.z-panel-exp:before {
    content: ""; }
  .panel-input-doc.z-panel.z-panel-colpsd .z-panel-icon {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg); }

.z-tabpanel-cnt {
  background: #fff; }

.content-panel .z-tabpanels {
  height: calc(100% - 32px); }
.content-panel .z-tabpanel {
  height: 100% !important; }
.content-panel .z-tabs, .content-panel .z-tabs-header {
  width: 100% !important; }
.content-panel .z-tabs-header.z-tabs-header-scroll {
  width: calc(100% - 30px) !important; }

.z-tabs-header-scroll {
  margin-left: 30px;
  margin-right: 30px; }

.content-panel-layout > div > .z-center {
  background-color: #fff; }

.content-panel-layout-center {
  overflow: auto;
  padding: 16px;
  background: #fff;
  height: 100%;
  max-height: 100%;
}

.content-panel-layout .z-south {
  border: 0;
  background: #f3f3f3; }

/*-----------------------------------Tree------------------------------------- */
div.z-tree {
  background-image: none;
  background-color: #fff;
  overflow: hidden;
  border: 0px solid #fff; }

div.z-tree-body {
  width: 100% !important; }

div.z-treefooter-cnt, div.z-treecell-cnt, div.z-treecol-cnt {
  font-family: Inter;
  font-size: 14px; }

.z-tree-body .z-tree-cell-cnt, .z-tree-body .z-treecell-cnt, .z-dottree-body .z-tree-cell-cnt, .z-dottree-body .z-treecell-cnt, .z-filetree-body .z-tree-cell-cnt, .z-filetree-body .z-treecell-cnt, .z-vfiletree-body .z-tree-cell-cnt, .z-vfiletree-body .z-treecell-cnt {
  color: #262626; }

.z-tree-body .z-tree-row-over, .z-tree-body .z-treerow-over, .z-dottree-body .z-tree-row-over, .z-dottree-body .z-treerow-over, .z-filetree-body .z-tree-row-over, .z-filetree-body .z-treerow-over, .z-vfiletree-body .z-tree-row-over, .z-vfiletree-body .z-treerow-over {
  background: #f2f2f2;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

tr.z-treerow-over > td.z-treecell {
  border-color: #f2f2f2; }

.z-tree-body table, .z-dottree-body table, .z-filetree-body table, .z-vfiletree-body table {
  background-color: #fff; }

div.z-tree-body, div.z-dottree-body, div.z-filetree-body, div.z-vfiletree-body {
  background: #fff; }

td.z-treecell {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

tr.z-treerow-seld {
  background-image: none;
  background-color: #eaeaea; }

tr.z-treerow-seld td.z-treecell {
  border-color: #eaeaea; }

tr.z-treerow-seld .z-treecell-cnt {
  color: #44494D; }

.z-treecell-cnt {
  line-height: 22px; }

span.checkmark-spacer {
  width: 24px; }

span.z-tree-root-open, span.z-tree-tee-open, span.z-tree-last-open, span.z-tree-root-close, span.z-tree-tee-close, span.z-tree-last-close {
  background: none;
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  text-align: center; }

span.z-tree-root-open:before, span.z-tree-tee-open:before, span.z-tree-last-open:before {
  content: "";
  color: #44494D; }

span.z-tree-root-close:before, span.z-tree-tee-close:before, span.z-tree-last-close:before {
  content: "";
  color: #44494D; }

span.z-tree-root-open:before, span.z-tree-tee-open:before, span.z-tree-last-open:before, span.z-tree-root-close:before, span.z-tree-tee-close:before, span.z-tree-last-close:before {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  position: relative;
  left: 0px; }

span.z-tree-root-open:hover:before, span.z-tree-tee-open:hover:before, span.z-tree-last-open:hover:before, span.z-tree-root-close:hover:before, span.z-tree-tee-close:hover:before, span.z-tree-last-close:hover:before {
  position: relative;
  left: 3px; }

span.z-tree-line.z-tree-tee, span.z-tree-line.z-tree-last, span.z-tree-ico.z-tree-firstspacer {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  text-align: center; }

span.z-tree-line.z-tree-tee:BEFORE, span.z-tree-line.z-tree-last:BEFORE, span.z-tree-ico.z-tree-firstspacer:BEFORE {
  content: "";
  color: #44494D; }

.z-listheader-img, .z-listitem-img, .z-treerow-img {
  background-image: none;
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  color: #555555;
  line-height: 18px;
  height: 18px;
  width: 18px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-listheader-img:before, .z-listitem .z-listitem-img-checkbox:before, .z-treerow .z-treerow-img-checkbox:before {
  content: "";
  font-size: 18px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-listheader-img-over:before, .z-listitem-over .z-listitem-img-checkbox:before, .z-treerow-over .z-treerow-img-checkbox:before {
  content: "";
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-listheader-img-seld:before, .z-listitem-seld .z-listitem-img-checkbox:before, .z-treerow-seld .z-treerow-img-checkbox:before {
  content: "";
  font-size: 18px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-listheader-img-over-seld:before, .z-listitem-over-seld .z-listitem-img-checkbox:before, .z-treerow-over-seld .z-treerow-img-checkbox:before {
  content: "";
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

/*-----------------------------------Loading indicator------------------------------------- */
:not(.z-temp) > .z-loading {
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: 30px;
  width: 140px; }

.z-temp {
  opacity: 0.6 !important;
  background: transparent !important;
}

.z-temp > .z-loading {
  background: none;
}

.z-apply-loading {
  margin: auto;
  top: 0 !important;
  left: 0 !important;
  bottom: 0;
  right: 0;
  height: 30px;
  width: 140px; }
  
.z-apply-loading-indicator {
    padding: 6px !important;
    font: normal 12px Inter;
}

.z-loading, .z-apply-loading {
    position: absolute;
    cursor: wait;
    white-space: nowrap;
    padding: 3px;
    width: 140px !important;
    height: 44px !important;
}

.z-loading-indicator, .z-apply-loading-indicator {
  font-family: Inter;
  font-size: 14px;
  color: #eaeaea;
  background-color: rgba(0, 0, 0, 0.6);
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  -ms-border-radius: 25px;
  border-radius: 25px;
  border: none;
  line-height: 28px; }

.z-loading, .z-apply-loading {
  background: none;
  border: none; }

/*-----------------------------------Error box------------------------------------- */
.z-errbox {
  z-index: 10000 !important; }

.z-errbox-center {
  font-family: Inter;
  font-weight: normal; }

/*-----------------------------------Form Layout------------------------------------- */
.form-required:after {
  content: "";
  color: #d50000;
  margin-left: 4px;
  cursor: default;
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 6px;
  vertical-align: top;
  line-height: 1em;
  width: 0; }

div.z-grid {
  border: none;
  background-image: none; }

.z-grid-header-bg {
  background: none; }

tr.z-grid-odd > td.z-row-inner, tr.z-grid-odd > .z-cell, tr.z-grid-odd {
  background: #fff;
  border-bottom: 1px solid #fff;
  border-top: 1px solid #fff; }

tr.z-row td.z-row-inner, tr.z-row td.z-cell, tr.z-group td.z-group-inner, tr.z-groupfoot td.z-groupfoot-inner {
  padding: 0; }

tr.z-row td.z-row-inner {
  padding: 9px 4px 9px 6px;
  overflow: hidden; }

tr.z-row-over > td.z-row-inner {
  border-bottom: 1px solid #fff;
  border-top: 1px solid #fff; }

tr.z-row.row-input > td {
  padding-top: 4px;
  padding-bottom: 4px; }

tr.z-row-over > td.z-row-inner, tr.z-row-over > .z-cell {
  background-image: none;
  border-bottom: 1px solid #fff;
  border-top: 1px solid #fff; }

tr.z-row td.z-row-inner, tr.z-row .z-cell {
  border-width: 0; }

tr.z-row td.z-cell.cell-input {
  padding-right: 0; }

tr.z-row td.z-cell.cell-label {
  padding: 1px 4px 4px 0px;
  color: #262626; }

.z-caption input {
  min-height: 32px;
}

.cell-label.cell-label-detail, .cell-label.cell-label-detail .z-label {
  font-weight: 600; }

tr.z-row td.z-cell.cell-label.cell-label-top {
  padding: 6px 4px 1px 0px; }

tr.z-row td.z-cell.cell-input-date {
  padding-right: 32px !important; }

tr.z-row td.z-cell.cell-input-date .z-datebox .z-datebox-inp {
  width: 100% !important; }

tr.z-row td.z-cell.cell-input-combobox {
  padding-right: 32px !important; }

tr.z-row td.z-cell.cell-input-combobox.no-padding-right {
  padding-right: 0px !important; }

tr.z-row td.z-cell.cell-input-combobox .z-combobox .z-combobox-inp {
  width: 100% !important; }

.z-bandpopup {
    width: 100% !important;
}

tr.z-row td.z-cell.cell-input-bandbox {
  padding-right: 32px !important; }

tr.z-row td.z-cell.cell-input-bandbox .z-bandbox .z-bandbox-inp {
  width: 100% !important; }

tr.z-row td.z-cell.cell-input-spinner {
  padding-right: 4px !important; }

.z-calendar-title-over {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0; }

.cell-button-os .z-button-os {
  padding: 0;
  height: 24px; }

.cell-button-listbox .z-hlayout {
  white-space: normal; }

/*-----------------------------------Form Control Input------------------------------------- */
.z-loading, div.z-list-cell-cnt, .z-listheader-cnt, .z-toolbarbutton-cnt, .z-panel-header, .z-tab-text {
  font-family: Inter;
  font-size: 14px;
  font-weight: normal;
  color: #555;
  line-height: 18px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-radio-cnt, .z-checkbox-cnt, .z-textbox, .z-decimalbox, .z-intbox, .z-longbox, .z-doublebox, .z-comboitem-text, .z-combobox .z-combobox-inp, .z-datebox .z-datebox-inp, .z-spinner .z-spinner-inp, .z-timebox .z-timebox-inp, .z-bandbox .z-bandbox-inp {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626;
  line-height: 28px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-comboitem .z-comboitem-text {
  font-size: 14px;
  max-width: 597px;
  word-break: break-all;
}

.z-textbox, .z-decimalbox, .z-intbox, .z-longbox, .z-doublebox {
  border: 1px solid #C9CDD4;
  border-radius: 3px 3px 3px 3px;
  padding: 1px 2px 1px 10px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-doublebox {
  border-radius: 3px 0px 0px 3px;}

.z-doublespinner-inp {
  width: 60%; }

.z-combobox-rounded-inp, .z-bandbox-rounded-inp, .z-datebox-rounded-inp, .z-timebox-rounded-inp, .z-spinner-rounded-inp, .z-doublespinner-rounded-inp, .z-combobox-inp, .z-bandbox-inp, .z-datebox-inp, .z-timebox .z-timebox-inp, .z-spinner-inp, .z-doublespinner-inp {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  height: 24px; }

.z-combobox-rounded .z-combobox-rounded-btn, .z-bandbox-rounded .z-bandbox-rounded-btn, .z-datebox-rounded .z-datebox-rounded-btn, .z-timebox-rounded .z-timebox-rounded-btn, .z-spinner-rounded .z-spinner-rounded-btn, .z-doublespinner-rounded .z-doublespinner-rounded-btn, .z-combobox .z-combobox-btn, .z-bandbox .z-bandbox-btn, .z-datebox .z-datebox-btn, .z-timebox .z-timebox-btn, .z-spinner .z-spinner-btn, .z-doublespinner .z-doublespinner-btn {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  height: 32px; }

.z-textbox-text-invalid, .z-decimalbox-text-invalid, .z-intbox-text-invalid, .z-longbox-text-invalid, .z-doublebox-text-invalid {
  border: 1px solid #990000; }

.z-textbox-focus, .z-datebox-focus .z-datebox-inp, .z-combobox-focus .z-combobox-inp, .z-spinner-focus .z-spinner-inp, .z-timebox-focus .z-timebox-inp, .z-bandbox-focus .z-bandbox-inp {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  color: #000; }

.z-combobox-rounded-shadow, .z-bandbox-rounded-shadow, .z-datebox-rounded-shadow, .z-combobox-shadow, .z-bandbox-shadow, .z-datebox-shadow {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none; }

/* Datebox */
.z-datebox-rounded-pp, .z-datebox-pp {
  width: auto !important;
  text-align: center;
  border-radius: 4px;
}

.z-datebox .z-datebox-inp {
  border-style: solid;
  border-color: #C9CDD4;
  border-radius: 3px 0 0 3px;
  border-width: 1px 1px 1px 1px;
  padding: 1px 2px 1px 10px;
  height: 32px; }

.z-datebox .z-datebox-btn {
  border-style: solid;
  border-width: 1px;
  border-left: 0;
  border-radius: 0 3px 3px 0;
  border-color: #C9CDD4;
  background: none;
  width: 32px;
  color: #44494D;
  text-align: center;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-datebox .z-datebox-btn:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  content: "";
  line-height: 30px; }

.z-datebox .z-datebox-btn.z-datebox-btn-over {
  border-color: #44494D;
  background-image: none;
  background-color: #44494D;
  color: #fff;
  margin: 0; }

/* Chonsenbox */
.z-chosenbox {
  padding: 3px;
  padding-right: 32px;
  min-height: 32px;
    border-radius: 3px;
    border: 1px solid #C9CDD4; 
    background-color: #fafafa; }

.z-chosenbox {
  position: relative; /* Needed for absolute positioning of ::after */
}

.z-chosenbox::after {
  font-family: "FontAwesome";
  content: "";
  position: absolute;
  right: 13px;
  top: 50%;
  transform: translateY(-50%) rotate(-4deg);
  font-size: 19px;
  pointer-events: none;
  color: #767a76;
}


.z-chosenbox-sel-item-cnt {
  display: inline-flex;
  align-items: center;
  float: left;
  /* padding: 7px 5px 0px 8px; */
  padding: 0 4px;
  height: 22px;
  font-size: 14px;
  font-family: arial, sans-serif;
}

.z-chosenbox-option {
  cursor: pointer;
  padding: 1px 5px;
  font-size: 14px;
  line-height: 24px;
}

.z-chosenbox-sel-item {
  /* margin-left: 2px; */
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  white-space: nowrap;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  margin: 0px;
  margin-top: 0px;
  background: #e6eef2;
  border: 1px solid #b2b2b2;
  color: #333;
  font-size: 12px;
  font-family: arial, sans-serif;
  font-style: normal;
  cursor: pointer;
}

.z-chosenbox .z-chosenbox-inp {
    padding: 1px 2px 1px 10px;
    height: 20px;
    width: 10px !important;
    font-size: 14px;
    font-family: Inter;
    font-style: italic;
    color: #9A9A9A; }

.z-chosenbox {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

.z-chosenbox input.z-chosenbox-inp {
  width: 100% !important;
  flex: 1 1;
  margin-top: 2px;
  padding-left: 5px;
}

/* Combobox */
.z-combobox .z-combobox-inp {
  border-style: solid;
  border-color: #C9CDD4;
  border-radius: 3px 0 0 3px;
  border-width: 1px;
  padding: 1px 2px 1px 10px;
  height: 32px; }

.z-combobox .z-combobox-btn {
  border-style: solid;
  border-width: 1px;
  border-color: #C9CDD4;
  border-radius: 0 3px 3px 0;
  border-left: 0;
  background: none;
  width: 32px;
  color: #44494D;
  text-align: center;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-combobox .z-combobox-btn:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 19px;
  content: "";
  line-height: 30px; }

.z-combobox .z-combobox-btn.z-combobox-btn-over {
  border-color: #44494D;
  background-image: none;
  background-color: #44494D;
  color: #fff;
  margin: 0; }

.z-combobox-rounded-pp .z-comboitem-over, .z-combobox-pp .z-comboitem-over {
  background: none repeat scroll 0 0 #f2f2f2; }

.z-combobox-rounded-pp .z-comboitem-seld, .z-combobox-pp .z-comboitem-seld {
  background: none repeat scroll 0 0 #f2f2f2; }

.z-combobox-rounded-pp, .z-combobox-pp {
  padding: 2px 0;
  max-height: 150px;
  width: auto;
}

.z-combobox-shadow {
  border-radius: 4px; }

.z-comboitem .z-comboitem-text {
  font-size: 14px; }

/* Bandbox */
.z-bandbox .z-bandbox-inp {
  border-style: solid;
  border-radius: 3px 0 0 3px;
  border-color: #C9CDD4;
  border-width: 1px 0 1px 1px;
  padding: 1px 2px 1px 10px;
  height: 32px; }

.z-bandbox .z-bandbox-btn {
  border-radius: 0 3px 3px 0;
  border-style: solid;
  border-width: 1px;
  border-color: #C9CDD4;
  background: none;
  width: 32px;
  color: #44494D;
  text-align: center;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-bandbox .z-bandbox-btn:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  content: "";
  line-height: 30px; }

.z-bandbox .z-bandbox-btn.z-bandbox-btn-over {
  border-color: #44494D;
  background-image: none;
  background-color: #44494D;
  color: #fff;
  margin: 0; }

.z-bandbox-shadow {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0; }

/* Spinner */
.z-spinner .z-spinner-inp {
  border-style: solid;
  border-color: #0000001a;
  border-width: 1px 0 1px 1px;
  padding: 1px 2px 1px 10px;
  height: 24px;
  width: calc(100% - 20px) !important; }

.z-spinner .z-spinner-btn, .z-spinner .z-spinner-btn.z-spinner-btn-over {
  border: 0; }

.z-spinner .z-spinner-btn-upper, .z-spinner .z-spinner-btn-lower {
  background: none;
  border-style: solid;
  border-color: #0000001a;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  height: 12px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  text-align: center;
  color: #44494D;
  width: 24px;
  margin: 0; }

.z-spinner .z-spinner-btn-upper {
  border-width: 1px 1px 0 1px; }

.z-spinner .z-spinner-btn-lower {
  border-width: 0 1px 1px 1px; }

.z-spinner .z-spinner-btn.z-spinner-btn-over .z-spinner-btn-upper:not(:hover), .z-spinner .z-spinner-btn.z-spinner-btn-over .z-spinner-btn-lower:not(:hover) {
  background: none;
  margin: 0;
  border-color: #0000001a; }

.z-spinner .z-spinner-btn.z-spinner-btn-over .z-spinner-btn-upper:hover, .z-spinner .z-spinner-btn.z-spinner-btn-over .z-spinner-btn-upper:not(:hover) {
  border-width: 1px 1px 0 1px !important; }

.z-spinner .z-spinner-btn.z-spinner-btn-over .z-spinner-btn-lower:hover, .z-spinner .z-spinner-btn.z-spinner-btn-over .z-spinner-btn-lower:not(:hover) {
  border-width: 0 1px 1px 1px !important; }

.z-spinner .z-spinner-btn.z-spinner-btn-over .z-spinner-btn-upper:hover, .z-spinner .z-spinner-btn.z-spinner-btn-over .z-spinner-btn-lower:hover {
  background-image: none;
  border-color: #44494D;
  background-color: #44494D;
  color: #fff;
  margin: 0; }

.z-spinner .z-spinner-btn-upper:before, .z-spinner .z-spinner-btn-lower:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 10px; }

.z-spinner .z-spinner-btn-upper:before {
  content: ""; }

.z-spinner .z-spinner-btn-lower:before {
  content: ""; }

/* Cell button */
.cell-button {
  display: table; }

.cell-button > .z-hlayout-inner {
  display: table-cell;
  vertical-align: middle;
  padding-right: 0 !important; }

.cell-button > .z-hlayout-inner:first-child {
  width: auto; }

.cell-button.cell-button-align-top > .z-hlayout-inner, .cell-button.cell-button-align-top > .z-vlayout-inner {
  vertical-align: top; }

.cell-button > .z-hlayout-inner, .cell-button .cell-button-btn, .cell-button .cell-button-btn > .z-vlayout-inner, .cell-button .cell-button-btn .font-icon:BEFORE {
  width: 22px; }

.cell-button .cell-button-btn {
  height: 32px;
  width: 32px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  border-width: 1px 1px 1px 0;
  border-style: solid;
  border-color: #C9CDD4;
  display: table;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }


.cell-button .cell-button-btn:not(.cell-button-btn-disabled):hover {
  background-color: #44494D;
  border-color: #44494D;
  cursor: pointer; }

.cell-button .cell-button-btn > .z-vlayout-inner {
  display: table-cell;
  vertical-align: middle;
  padding-bottom: 0 !important; }

.cell-button .cell-button-btn.cell-button-btn-disabled .font-icon {
  color: #959595; }

.cell-button .cell-button-btn .font-icon {
  color: #44494D;
  text-align: center;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.cell-button .cell-button-btn:not(.cell-button-btn-disabled):hover .font-icon:before {
  color: #fff; }

.cell-button .cell-button-btn .font-icon:before {
  font-size: 14px;
  line-height: 22px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

/*-----------------------------------Grid List------------------------------------- */
div.z-grid.grid-list {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background: none;
  border: 1px #0000001a solid; }

div.z-grid.grid-list .z-rows {
  border: 1px #0000001a solid; }

div.z-grid.grid-list div.z-grid-header {
  width: 100% !important; }

div.z-grid.grid-list div.z-grid-header tr.z-columns {
  background: #e6e6e6; }

div.z-grid.grid-list div.z-grid-header th.z-column {
  border-color: #e6e6e6;
  border-bottom: 0; }

div.z-grid.grid-list div.z-grid-header th.z-column-over {
  background-image: none;
  background-color: #badafa;
  border-color: #badafa; }

div.z-grid.grid-list div.z-column-cnt {
  font-family: Inter;
  font-size: 14px;
  font-weight: 700;
  font-style: normal;
  color: #262626;
  text-overflow: ellipsis;
  padding: 5px; }

div.z-grid.grid-list .wrapped-header div.z-column-cnt {
  white-space: normal; }

div.z-grid.grid-list .z-column-cnt {
  position: unset; }

div.z-grid.grid-list .z-column-btn {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background: url("");
  right: 2px;
  width: 16px; }

div.z-grid.grid-list .z-column-btn:after {
  content: "";
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 30px;
  position: relative;
  top: calc(50% - 16px); }

div.z-grid.grid-list .z-column-btn:hover {
  background-color: rgba(255, 255, 255, 0.6);
  color: #44494D; }

div.z-grid.grid-list a.z-column-btn {
  color: #262626;
  top: 0; }

div.z-grid.grid-list tr.z-group {
  background-image: none; }

div.z-grid.grid-list td.z-group-inner {
  border: 1px #0000001a solid;
  border-width: 1px 0 0 0; }

div.z-grid.grid-list .z-group-inner .z-group-cnt .z-label, div.z-grid.grid-list .z-group-inner .z-group-cnt {
  color: #262626;
  font-family: unset;
  font-size: 14px;
  font-weight: normal;
  text-align: left;
  padding: 5px;
  background-color: #e6e6e6; }

div.z-grid.grid-list .z-group-img {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background-image: none;
  color: #959595;
  text-align: center; }

div.z-grid.grid-list .z-group-img:hover {
  color: #44494D; }

div.z-grid.grid-list .z-group-img:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 18px;
  vertical-align: middle; }

div.z-grid.grid-list .z-group-img-open:before {
  content: ""; }

div.z-grid.grid-list .z-group-img-close:before {
  content: ""; }

div.z-grid.grid-list tr.z-grid-odd {
  background-color: #f1f3f5; }

div.z-grid.grid-list tr.z-row > td, div.z-grid.grid-list tr.z-grid-odd > td {
  border-top: 1px #0000001a solid;
  border-right: 1px #0000001a solid; }

div.z-grid.grid-list tr.z-row > td:last-child, div.z-grid.grid-list tr.z-grid-odd > td:last-child {
  border-right: 0; }

div.z-grid.grid-list tr.z-row td.z-cell {
  padding: 5px; }

/*-----------------------------------Listbox------------------------------------- */
div.z-listbox {
  border-radius: 3px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background: none;
  border-width: 1px;
  border-color: #0000001a; }

div.z-listbox-header, div.z-listbox-header tr, div.z-listbox-footer {
  width: 100% !important; }

div.z-listbox-header tr.z-listhead, div.z-listbox-header tr.z-auxhead {
  background: #f3f3f3; }

div.z-listbox-header th.z-listheader, div.z-listbox-header th.z-auxheader {
  border-color: #0000001a; }

div.z-listbox-header th.z-listheader-sort-over {
  background-color: #e6e6e6; }

.z-listbox-header-bg {
  height: 1px;
  background-image: none;
  background-color: #00000000; }

div.z-listfooter-cnt, div.z-listheader-cnt, div.z-listheader-cnt .z-hlayout .z-label, div.z-listheader-cnt .z-hbox .z-label {
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  color: #262626;
  text-overflow: ellipsis;
  padding: 5px;
  font-weight: 600; }

.wrapped-header div.z-listheader-cnt, div.z-listheader-cnt .z-hlayout .z-label, div.z-listheader-cnt .z-hbox .z-label {
  white-space: normal; }

div.z-listheader-cnt .listbox-action.z-label {
  font-size: 18px !important;
  line-height: 26px !important;
  text-align: center ;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  border-radius: 16px;
  color: #3C66A0;
  padding: 0px;
  background: none; }

.z-listheader .z-listheader-cnt {
  position: unset; }

.z-listheader-btn {
  background: url("");
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  right: 2px;
  width: 16px; }

.z-listheader-btn:after {
  content: "";
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 30px;
  position: relative;
  top: calc(50% - 16px); }

.z-listheader-btn:hover {
  background-color: rgba(255, 255, 255, 0.6);
  color: #44494D; }

a.z-listheader-btn {
  color: #262626;
  top: 0; }

div.z-listbox-body {
  width: 100% !important; }

tbody.z-listbox-empty-body td, tbody.z-grid-empty-body td {
  line-height: 28px;
  font-family: Inter;
  font-size: 14px;
  color: #EE0033; }

tr.z-listbox-odd {
  background-color: #ffffff; }

div.z-listcell-cnt {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626;
  text-overflow: ellipsis; }

div.z-listfooter-cnt, div.z-listheader-cnt {
  line-height: 22px; }

.z-listbox tr.z-listitem td.z-listcell, .z-listbox tr.z-listitem-over td.z-listcell {
  border-width: 0 1px 1px 0;
  border-color: #0000001a; }

.z-listbox tr.z-listitem td.z-listcell:LAST-CHILD, .z-listbox tr.z-listitem-over td.z-listcell:LAST-CHILD {
  border-width: 0 0 1px 0;
  border-color: #0000001a; }

.z-listbox tr.z-listitem:LAST-CHILD td.z-listcell, .z-listbox tr.z-listitem-over:LAST-CHILD td.z-listcell {
  border-width: 0 1px 0 0;
  border-color: #0000001a; }

.z-listbox tr.z-listitem:LAST-CHILD td.z-listcell:LAST-CHILD, .z-listbox tr.z-listitem-over:LAST-CHILD td.z-listcell:LAST-CHILD {
  border-width: 0 0 0 0;
  border-color: #0000001a; }

tr.z-listitem {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

tr.z-listitem-over-seld {
  background: #e6e6e6 !important;
  border-color: transparent; }

tr.z-listitem-over {
  background: #e6e6e6 !important;
  border-color: transparent; }

 tr.z-listitem-seld {
  background-image: url(); }

tr.z-listitem-seld div.z-listcell-cnt {
  color: #44494D; }

.z-listbox.listbox-no-selectable div.z-listbox-body .z-listcell {
  cursor: default; }

.z-paging {
  border: none;
  background: none;
  padding: 5px 0; }

.z-paging-inp, .z-paging input.z-paging-inp {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  border: 1px solid #DBDEE0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 4px;
  padding: 1px 2px 1px 10px;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626;
  line-height: 18px;
  height: 24px;
  color: #555; }

.z-paging-inp:focus, .z-paging input.z-paging-inp:focus {
  background: none;
  color: #000; }

.z-paging td, .z-paging span, .z-paging input, .z-paging div, .z-paging button {
  line-height: 18px;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626; }

.z-paging-info, .z-paging div.z-paging-info {
  position: absolute;
  right: 0px;
  top: 10px;
  line-height: 18px;
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626; }

.z-paging .z-paging-btn {
  background: url("") transparent;
  margin: 0; }

.z-paging > table > tbody > tr > td {
  padding: 0 5px 0 0; }

.z-paging > table > tbody > tr > td:nth-child(3), .z-paging > table > tbody > tr > td:nth-child(4), .z-paging > table > tbody > tr > td:nth-child(7) {
  display: none; }

.z-paging > table > tbody > tr > td:nth-child(5), .z-paging > table > tbody > tr > td:last-child {
  padding: 0; }

.z-paging-btn .z-paging-first, .z-paging-btn .z-paging-prev, .z-paging-btn .z-paging-next, .z-paging-btn .z-paging-last {
  background-color: #fff;
  background-image: none;
  border: 1px solid #DBDEE0;
  border-radius: 4px;
  text-align: center;
  color: #44494D;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-paging-btn.z-paging-btn-over .z-paging-first, .z-paging-btn.z-paging-btn-over .z-paging-prev, .z-paging-btn.z-paging-btn-over .z-paging-next, .z-paging-btn.z-paging-btn-over .z-paging-last {
  background-color: #44494D;
  border: 1px solid #44494D;
  text-align: center;
  color: #fff; }

.z-paging-btn .z-paging-first:before, .z-paging-btn .z-paging-prev:before, .z-paging-btn .z-paging-next:before, .z-paging-btn .z-paging-last:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 18px; }

.z-paging-btn .z-paging-first:before {
  content: ""; }

.z-paging-btn .z-paging-prev:before {
  content: ""; }

.z-paging-btn .z-paging-next:before {
  content: ""; }

.z-paging-btn .z-paging-last:before {
  content: ""; }

.z-paging-btn.z-paging-btn-disd {
  opacity: 0.6; }

/*-----------------------------------Menupopup------------------------------------- */
.z-menupopup {
  background-color: #fff;
  border: none;
  padding: 0; }

.z-menupopup .z-menupopup-cnt {
  background-image: none;
  border: none;
  background-color: #fff;
  padding: 0; }

.z-menupopup-shadow {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  -webkit-border: 1px solid #0000001a;
  -moz-border: 1px solid #0000001a;
  -ms-border: 1px solid #0000001a;
  -o-border: 1px solid #0000001a;
  border: 1px solid #0000001a; }

.z-menupopup-cnt .z-menu a.z-menu-cnt, .z-menupopup-cnt .z-menuitem a.z-menuitem-cnt {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626;
  padding: 6px 21px 6px 3px; }

.z-menupopup-cnt li.z-menuitem {
  padding-left: 0px;
  padding-right: 0px; }

.z-menupopup-cnt .z-menuitem-over .z-menuitem-cl, .z-menupopup-cnt .z-menuitem-over .z-menuitem-cr, .z-menupopup-cnt .z-menuitem-over .z-menuitem-cm, .z-menupopup-cnt .z-menu-over .z-menu-cl, .z-menupopup-cnt .z-menu-over .z-menu-cr, .z-menupopup-cnt .z-menu-over .z-menu-cm {
  background-image: none;
  background-color: #f2f2f2; }

.z-menupopup-cnt .z-menuitem-cnt-ck .z-menuitem-img, .z-menupopup-cnt .z-menuitem-cnt-unck .z-menuitem-img {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  background-image: none; }

.z-menupopup-cnt .z-menuitem-cnt-ck .z-menuitem-img:before {
  content: ""; }

.z-menupopup-cnt .z-menuitem-cnt-unck .z-menuitem-img:before {
  content: ""; }

.z-menupopup-cnt .z-menuitem-over .z-menuitem-cl {
  padding-left: 10px; }

.z-menupopup-cnt .z-menuitem .z-menuitem-cl, .z-menupopup-cnt .z-menu .z-menu-cl {
  padding-left: 10px; }

/*-----------------------------------Form Control Button------------------------------------- */
/* Button Trendy */
span.z-button .z-button-tl, span.z-button .z-button-tr {
  height: 0; }

span.z-button .z-button-tm {
  height: 0; }

span.z-button .z-button-bl, span.z-button .z-button-br {
  height: 0; }

.z-button .z-button-bm {
  height: 0; }
  
button.z-button {
  height: 0px!important;
}

span.z-button .z-button-cl, span.z-button .z-button-cr {
  background-image: none; }

.z-button .z-button-cr * {
  width: 0px !important;}

span.z-button .z-button-cm {
  background-image: none;
  color: #374151;
  font-weight: 600;
  font-family: Inter;
  font-size: 1.2em;
  padding: 7px 4px 7px 22px;
  vertical-align: middle; }

span.z-button .z-button-over, span.z-button .z-button-focus {
/*   background-color: #00afaa; */
  background-image: none;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  border-radius: 4px; }

span.z-button {
/*   background-color: #00918d; */
   border: 1px solid #C1C5CA; 
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; 
  webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius:4px; 
}

span.z-button:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 1.5em;
  color: #374151;
  position: absolute;
  margin: 6px 0 0 6px; }

span.z-button, span.z-button tr td {
  font-family: Inter;
  font-size: 12px; }

/* Button OS */
.z-button-os {
  min-height: 32px;
  border: 0px solid #44494D;
  color: #fff;
  font-family: Inter;
  font-size: 14px;
  vertical-align: middle;
  margin: 5px;
  margin-right: 0px;
  margin-left: 8px;
  padding: 5px 12px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; 
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
}

.z-button-os:hover, .z-button-os:active, .z-button-os:focus {
  background-image: none;
  cursor: pointer;
  color: #fff;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-button-os:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 1.3em;
  margin-right: 7px; }

.z-button-os.no-btn-text:before {
  margin: 0; }

.z-button-os[disabled] {
  border: 1px solid #C1C5CA;
  color: #B1B1B1 !important;
  background-color: #fff !important;
  cursor: default; }

.button-group {
  margin: 0 10px;
  display: inline-block; }

.button-group .z-button-os {
  width: 40px; }

/* Link */
.z-a {
  font-family: Inter;
  color: #262626;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  text-decoration: none;
  font-size: 14px }

.z-a:hover {
  color: #EE0033;
  text-decoration: underline;
  cursor: pointer; }

/* Radio */
.z-radio > input {
  vertical-align: top;
  width: 15px;
  height: 22px; }

.z-checkbox > input {
  vertical-align: top;
  width: 15px;
  height: 15px; }

/*-----------------------------------Popup DIV------------------------------------- */
.popup-form-container {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.popup-form {
  background-color: #fff;
  position: absolute;
  right: 0;
  z-index: 1500; }

.popup-form-mask {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #000;
  z-index: 1499;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.popup-form-header {
  width: 100%;
  background: #44494D;
  display: table;
  text-align: left; }

.popup-form-header-title, .popup-form-header-btn {
  display: table-cell;
  vertical-align: middle;
  padding-top: 5px;
  padding-bottom: 5px; }

.popup-form-header-title {
  padding-left: 10px; }

.popup-form-header-title span {
  font-family: Inter;
  color: #fff;
  font-size: 14px; }

.popup-form-header-btn {
  width: 35px;
  text-align: center;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.popup-form-header-btn div {
  background: transparent;
  border-radius: 50%;
  color: #fff;
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 1.6em;
  height: 24px;
  width: 24px;
  line-height: 24px;
  text-align: center; }

.popup-form-header-btn div:hover {
  color: #44494D;
  background: #fff;
  cursor: pointer; }

/*-----------------------------------Popup Top Arrow------------------------------------- */
.popup-top-arrow.z-popup {
  background-color: transparent;
  border: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  overflow: visible;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none; }

.popup-top-arrow.z-popup .z-popup-cl {
  background: none;
  border: none;
  padding: 0; }

.popup-top-arrow.z-popup .z-popup-cnt {
  margin: 0;
  padding: 0;
  line-height: normal; }

.popup-top-arrow.z-popup > div:first-child {
  background-color: #fff;
  border: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  overflow: visible;
  margin-top: 10px; }

.popup-top-arrow.z-popup > div:first-child:after {
  top: -10px;
  right: 30px;
  border: 0 solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-bottom-color: #44494D;
  border-width: 10px;
  margin-left: -10px; }

.popup-top-arrow:after {
  bottom: 100%;
  border: 0 solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(136, 183, 213, 0);
  border-bottom-color: #44494D;
  border-width: 10px;
  margin-left: -10px; }

.z-popup {
  background: #fff;
  font-family: Inter;
}

/*-----------------------------------Dialog tree------------------------------------- */
.dialog-tree .z-west {
  -webkit-box-shadow: -3px 0px 6px 1px rgba(0, 0, 0, 0.8);
  -moz-box-shadow: -3px 0px 6px 1px rgba(0, 0, 0, 0.8);
  -o-box-shadow: -3px 0px 6px 1px rgba(0, 0, 0, 0.8);
  box-shadow: -3px 0px 6px 1px rgba(0, 0, 0, 0.8); }

/*-----------------------------------Message box------------------------------------- */
.z-msgbox {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 40px !important;
  line-height: 40px;
  text-align: center;
  color: #262626;
  cursor: default; }

.z-msgbox-question, .z-msgbox-error, .z-msgbox-information {
  background-image: none; }

.z-msgbox-question:before {
  content: "";
  color: #44494D; }

.z-msgbox-error:before {
  content: "";
  color: #be0005; }

.z-msgbox-information:before {
  content: "";
  color: #219ba6; }

.z-messagebox .z-label {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626; }

.z-messagebox-btn {
  width: auto; }

/*-----------------------------------Notification------------------------------------- */
.z-notification .z-notification-cl {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0; }

.z-notification .z-notification-cnt {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626; }

.z-notification-info .z-notification-cl {
  background-color: rgba(26, 117, 187, 0.88); }

.z-notification-warning .z-notification-cl {
  width: 200px;
  height: auto;
  background-color: rgba(234, 67, 23, 0.88); }

.z-notification-error .z-notification-cl {
  background-color: rgba(190, 0, 5, 0.88); }

.z-notification .z-notification-cl, .z-notification .z-notification-cnt {
  overflow: auto; }

/*-----------------------------------Calendar------------------------------------- */
.z-calendar-title, .z-calendar-calctrl .z-calendar-ctrler {
  font-family: Inter;
  font-size: 14px; }

.z-calendar-caldow .z-calendar-wkend, .z-calendar-caldow .z-calendar-wkday, .z-calendar-caldow .z-calendar-woy {
  font-family: Inter;
  font-size: 14px; }

.z-calendar-calyear td, .z-calendar-calmon td, .z-calendar-caldayrow td {
  font-size: 14px; }

.z-calendar {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  font-family: Inter;
  font-size: 14px;
  padding: 0;
  width: 300px;
}

.z-datebox-rounded-shadow, .z-datebox-shadow {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -ms-border-radius: 0px;
  border-radius: 4px;
  padding: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none; }

.z-calendar-calyear td.z-calendar-seld, .z-calendar-calmon td.z-calendar-seld, .z-calendar-calday td.z-calendar-seld {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -ms-border-radius: 0px;
  border-radius: 0px; }

.z-calendar-calyear .z-calendar-over, .z-calendar-calmon .z-calendar-over, .z-calendar-caldayrow .z-calendar-over {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -ms-border-radius: 0px;
  border-radius: 0px; }

/*-----------------------------------Attachment------------------------------------- */
.attachment .z-label {
  color: #262626; }

.attachment-file-type .z-hlayout-inner {
  overflow: hidden;
  text-overflow: ellipsis; }

.attachment .font-icon {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  cursor: pointer;
  color: #44494D;
  text-align: center;
  height: 22px;
  width: 22px;
  display: table; }

.attachment .font-icon:before {
  font-size: 18px;
  line-height: 22px; }

.attachment .font-icon:hover {
  background-color: #44494D;
  color: #fff; }

/*-----------------------------------Common------------------------------------- */
.font-icon-disabled {
  color: #959595!important;
  opacity: 0.5;
  cursor: default; }

.icon-btn {
  cursor: pointer;
  text-align: center;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  color: #44494D; }

.icon-btn:before {
  font-size: 14px;
  line-height: 22px;
  height: 22px;
  width: 22px; }

.icon-btn:hover {
  color: #fff;
  background-color: #44494D; }

.icon-info:before {
  font-size: 14px;
  line-height: 18px;
  height: 18px;
  width: 18px; }

.function-title, .function-sub-title {
  color: #fff;
  background: #0e5593;
  margin: 0;
  padding: 5px 0 5px 15px;
  min-height: 17px; }

.function-title .z-label {
  font-family: Inter; }

.function-sub-title {
  color: #44494D;
  background: #e6e6e6;
  margin: 0;
  padding: 5px 0 5px 15px;
  min-height: 17px; }

.function-sub-title .z-label {
  font-family: Inter; }

.function-message {
  text-align: center;
  padding: 10px; }

.no-result, .more-results {
  font-family: Inter;
  color: #262626; }

.text-link:HOVER {
  cursor: pointer;
  text-decoration: underline;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.black-bold, .black-bold .z-label {
  font-family: roboto-bold;
  color: #59595b; }

.black-regular, .black-regular .z-label {
  font-family: Inter;
  color: #59595b; }

.gray-bold, .gray-bold .z-label {
  font-family: roboto-bold;
  color: #9b9b9b; }

.gray-regular, .gray-regular .z-label {
  font-family: Inter;
  color: #9b9b9b; }

.btn-icon {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  text-align: center;
  color: #44494D; }

.btn-icon .font-icon {
  line-height: 22px; }

.btn-icon .z-label {
  font-size: 14px; }

.btn-icon:hover {
  background-color: #44494D;
  color: #fff;
  cursor: pointer; }

.btn-icon-label {
  padding-left: 5px;
  color: #44494D; }

.label-detail {
  color: #262626;
  font-weight: 600; }

/*-----------------------------------Tab Header------------------------------------- */
.z-tab-hl, .z-tab-hr, .z-tab-hm {
  background: none;
  padding: 0;
  height: 100%; }

.z-tab-hl {
  padding-left: 10px; }

.z-tabs {
  border: 1px solid #e3e3e3; }

.z-tabs .z-tabs-cnt {
  border: none;
  background-color: #f3f3f3; }

.z-tab .z-tab-text {
  font-size: 14px; }

.z-tab .z-tab-hl:hover .z-tab-text {
  color: #44494D;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-tab:hover:before {
  color: #44494D;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-tabs-cnt li {
  text-align: center;
  color: #959595;
  min-width: 30px;
  max-width: 300px;
  margin: 0;
  height: 30px;
  border-right: 1px solid #0000001A;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-tabs-header.z-tabs-header-scroll .z-tabs-cnt li:first-child {
  border-left: 1px solid #cccccc; }

.z-tabs-cnt li .z-tab-text {
  color: #241D1E;
  font-family: Inter;
  padding: 0;
  line-height: 28px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-tabs-cnt li:before {
  content: "";
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 17px;
  line-height: 30px;
  position: absolute;
  left: 7px; }
.z-tabs-cnt li.fa-home:before {
  content: "\f015";
  
}
.z-tabs-cnt li.z-tab-seld {
  color: #44494D;
  background-color: #fff; }

.z-tabs-cnt li.z-tab-seld .z-tab-text {
  color: #241D1E;
  font-family: Inter;
  font-weight: 400; }

.z-tab-hm-close {
  margin-right: 28px; }

.z-tab-close {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  width: 20px;
  height: 20px;
  text-align: center;
  background-image: none;
  background-color: transparent;
  top: 5px;
  right: 4px;
  margin: 0;
  color: #6B7280; }

.z-tab-close:hover {
  color: #44494D; }

.z-tab-close:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 10px;
  content: "\e900";
  line-height: 20px;
  vertical-align: middle; }

.z-tabs-scroll .z-tabs-right-scroll, .z-tabs-scroll .z-tabs-left-scroll {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background: #f3f3f3;
  border: 0;
  margin: 0;
  text-align: center;
  height: unset;
  color: #959595; }

.z-tabs-scroll .z-tabs-right-scroll {
  border-left: 1px #ccc solid; }

.z-tabs-scroll .z-tabs-left-scroll {
  border-right: 1px #ccc solid; }

.z-tabs-scroll .z-tabs-right-scroll:hover, .z-tabs-scroll .z-tabs-left-scroll:hover {
  color: #44494D; }

.z-tabs-scroll .z-tabs-right-scroll:before, .z-tabs-scroll .z-tabs-left-scroll:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 30px;
  vertical-align: middle; }

.z-tabs-scroll .z-tabs-right-scroll:before {
  content: ""; }

.z-tabs-scroll .z-tabs-left-scroll:before {
  content: ""; }

.z-vtab .z-tab-hm {
    margin-right: 20px !important;
}
/*-----------------------------------Tabpanel, Tab Menu Path------------------------------------- */
.z-tabpanel, .z-tabbox-ver .z-tabpanel-ver {
  padding: 0;
  border: 1px solid #cccccc;
  border-top: 0; }

.faTabMenuPath {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 18px !important;
  text-align: center;
  margin: 0 5px; }

.tabMenuPath .z-label {
  font-size: 14px; }
  
.tabMenuPath .tabMenuPath-active.z-label {
  font-weight: 600; }
  
.tabpanelNorth {
  padding: 5px 0;
  border-bottom: 1px solid #0000001A; }

.tabpanelLabel {
  display: table;
  width: 100%;
  height: 100%;
  border-spacing: 0; }

.tabpanelLabel .leftTabpanelLabel {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  padding-left: 16px;
  border-spacing: 0; 
  padding-bottom: 10px }

.tabpanelLabel .leftTabpanelLabel .z-include {
  display: flex;
  align-items: center;
}

.tabpanelLabel .rightTabpanelLabel {
  display: table-cell;
  vertical-align: middle;
  text-align: right;
  width: auto;
  float: right;
  border-spacing: 0;
  padding-right: 16px; }

.z-toolbar {
  padding: 0;
  margin: 0;
  background: none;
  border: 0; }

.z-toolbarbutton {
  width: 32px;
  height: 32px;
  line-height: 32px;
  border: 0px solid #408EBD;
  padding: 0;
  margin: 2px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  text-align: center; 
  border-radius: 4px;
  }
  
.listbox-action.z-toolbarbutton {
  width: auto;
  height: auto;
  margin: 0px 5px;
 } 

.z-toolbarbutton-cnt {
  padding: 0;
  font-family: Inter;
  font-size: 14px;
  color: #1d549b;
  font-weight: 600; }

.z-toolbarbutton-over {
  background-image: none;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-toolbarbutton-over .z-toolbarbutton-cnt {
  background-image: none; }

.faToolbarButton {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.faToolbarButton:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 32px;
  color: #fff;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;}

.faToolbarButton.z-toolbarbutton-over {
  color: #fff; }

.z-toolbarbutton-disd {
  background-color: #DDDDDD; }

.z-toolbarbutton-disd.faToolbarButton:before {
  color: #949595;
}

.mtm-12 {
  margin-top: -12px;
}

.z-toolbarbutton.z-toolbarbutton-disd {
  cursor: default; }

.faTextboxSearch {
  vertical-align: middle;
  height: 32px; }

/*-----------------------------------Menu Horizontal-------------------------------------- */
.menu-horizontal .z-menubar-hor {
  max-width: 700px;
  background: none;
  padding: 0;
  border: none;
  background-color: #44494D;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.menu-horizontal .z-menu-body .z-menu-inner-m div, .menu-horizontal .z-menubar-hor .z-menu-body-clk .z-menu-inner-m div {
  height: 40px;
  background: none;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.menu-horizontal .z-menu-body-seld .z-menu-inner-m, .menu-horizontal .z-menu-body-seld .z-menu-inner-l, .menu-horizontal .z-menu-body-seld .z-menu-inner-r {
  background: none;
  background-color: #4584db;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.menu-horizontal .z-menubar-hor .z-menu, .menu-horizontal .z-menubar-hor .z-menuitem, .menu-horizontal .z-menubar-hor .z-menu-btn, .menu-horizontal .z-menubar-hor .z-menuitem-btn, .menu-horizontal .z-menubar-hor span, .menu-horizontal .z-menubar-hor a, .menu-horizontal .z-menubar-hor div {
  font-family: Inter;
  color: #fff; }

@media (max-width: 1024px) {
  .menu-horizontal .z-menubar-hor {
    max-width: 700px; } }
@media (min-width: 1025px) and (max-width: 1366px) {
  .menu-horizontal .z-menubar-hor {
    max-width: 800px; } }
@media (min-width: 1367px) and (max-width: 1600px) {
  .menu-horizontal .z-menubar-hor {
    max-width: 900px; } }
@media (min-width: 1601px) {
  .menu-horizontal .z-menubar-hor {
    max-width: 1000px; } }
/*-----------------------------------Button-------------------------------------- */
.btn-color-close {
  background-color: #EE0033;
  color: #fff; }

.btn-color-close:hover {
  background-color: #44494D; }

.listbox-action {
  font-size: 18px !important;
  line-height: 26px !important;
  text-align: center ;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  border-radius: 16px;
  color: #3C66A0;
  }

.listbox-action:before {
  width: 26px !important;
  height: 26px !important;
 }

.listbox-action:not(.font-icon-disabled):hover {
  cursor: pointer;
  color: #fff !important;
  background-color: #3C66A0 !important;
  border-color: #3C66A0 !important;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

.z-caption button, .z-caption .z-button .z-button-btn {
  font-size: 14px;
  padding: 4px 5px; }

/*-----------------------------------Calendars-------------------------------------- */
.z-calendars *, .z-calendars *::after, .z-calendars *::before {
  box-sizing: padding-box; }

.z-calendars-timezone.z-calendars-timezone-end {
  vertical-align: top;
  padding-top: 0; }

.z-calendars-hour-of-day {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626; }

.z-calendars-fl, .z-calendars-fr, .z-calendars-fm {
  background: none;
  display: none; }

.z-calendars-t2, .z-calendars-t3 {
  background: none;
  display: none; }

.z-calendars-t1 {
  margin: 0;
  background: #0000001a; }

.z-calendars-b2, .z-calendars-b3 {
  background: none;
  display: none; }

.z-calendars-b1 {
  margin: 0;
  background: #0000001a; }

.z-calendars-body {
  background: none; }

.z-calendars-inner {
  padding: 0;
  margin: 0;
  background: #e7f1ff;
  border-left: 1px solid #0000001a;
  border-right: 1px solid #0000001a; }

.z-calendars-week-header {
  font-family: Inter;
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
  color: #262626; }

.z-calendars-day-of-week-inner {
  color: #262626;
  margin: 0; }

.z-calendars-day-of-week-inner.z-calendars-week-today {
  border: none;
  color: unset;
  height: 40px;
  line-height: 40px;
  padding: 0;
  background: #fffde0; }

.z-calendars-day-header {
  height: 40px; }

.z-calendars-week-header-arrow {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  border: none;
  font-size: 22px;
  width: 15px;
  height: 15px;
  line-height: unset;
  left: 60px !important;
  top: 25px; }

.z-calendars-week-header-arrow-close {
  top: 25px; }

.z-calendars-week-header-arrow:before {
  font-family: "FontAwesome";
  font-style: normal;
  font-weight: normal; }

.z-calendars-week-header-arrow:not(.z-calendars-week-header-arrow-close):before {
  content: ""; }

.z-calendars-week-header-arrow:before {
  content: ""; }

.z-calendars-week-cnt {
  background: #fff; }

.z-calendars-week-cnt .z-calendars-timezone {
  background: #fff; }

.z-calendars-week-body {
  border-width: 1px 0 0 0;
  border-color: #0000001a; }

.z-calendars-week-day {
  border-left: 1px solid #0000001a; }

.z-calendars-week-day.z-calendars-week-today {
  background: #fffde0; }

.z-calendars-daylong-evt {
  border-left: 1px solid #0000001a; }

.z-calendars-daylong-body {
  background: #fff;
  border-color: #0000001a; }

.z-calendars-day-of-week-inner.z-calendars-week-today, .z-calendars-week-day.z-calendars-week-today {
  background: #fff899; }

.z-calevent-t1, .z-calevent-t2, .z-calevent-b1, .z-calevent-b2 {
  margin: 0; }

.z-calevent-header, .z-calevent-inner .z-calevent-cnt {
  font-family: Inter;
  font-size: 12px;
  font-weight: normal;
  line-height: 18px;
  padding: 0 5px !important; }
  
  
<%-- Drag-Drop --%>
div.z-drop-ghost {
    border:1px solid #ccc
}

div.z-drop-cnt {
    background:none no-repeat scroll 0 0 #fff;
    width:auto;
    height:20px;
    padding:3px;
    font-size:12px;
    font-weight:normal;
    font-family:Inter;
}

div.z-drop-allow {
    border:1px solid #9c9
}

div.z-drop-disallow {
    border:1px solid #c66
}

div.z-drop-allow div.z-drop-cnt,span.z-drop-allow {
    background:none no-repeat scroll 0 0 #efe
}

span.z-drop-allow {
    background-image:url(/app-view/zkau/web/c72f07e4/zul/img/misc/drag-allow.png)
}

div.z-drop-disallow div.z-drop-cnt,span.z-drop-disallow {
    background:none no-repeat scroll 0 0 #fee
}

span.z-drop-disallow {
    background-image:url(/app-view/zkau/web/c72f07e4/zul/img/misc/drag-disallow.png)
}

.z-drag-ghost {
    list-style:none
}

/*-----------------------------------Mission Rating List------------------------------------- */
div.z-grid.mission-rating div.z-grid-header-bg {
  height: 0px;
}
div.z-grid.mission-rating tr.z-grid-odd {
  background-color: #ffffff; 
}
/*-----------------------------------201812-Pitagon-------------------------------------------*/
.btn-icon-only:before{
    margin-right: 0px !important;
}
.btn-icon-only {
    width: 25px;
    height: 25px;
    border-radius: 0px;
}

.tabpanelLabel .leftMarkTabpanelLabel {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
  padding-left: 10px;
  border-spacing: 0;
}

/* Double Spinner */
.z-doublespinner .z-doublespinner-inp {
  border-style: solid;
  border-color: #0000001a;
  border-width: 1px 0 1px 1px;
  padding: 1px 2px 1px 10px;
  height: 24px;
  width: calc(100% - 20px) !important; }

.z-doublespinner .z-doublespinner-btn, .z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over {
  border: 0; }

.z-doublespinner .z-doublespinner-btn-upper, .z-doublespinner .z-doublespinner-btn-lower {
  background: none;
  border-style: solid;
  border-color: #0000001a;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  height: 12px;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  text-align: center;
  color: #44494D;
  width: 24px;
  margin: 0; }

.z-doublespinner .z-doublespinner-btn-upper {
  border-width: 1px 1px 0 1px; }

.z-doublespinner .z-doublespinner-btn-lower {
  border-width: 0 1px 1px 1px; }

.z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over .z-doublespinner-btn-upper:not(:hover), .z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over .z-doublespinner-btn-lower:not(:hover) {
  background: none;
  margin: 0;
  border-color: #0000001a; }

.z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over .z-doublespinner-btn-upper:hover, .z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over .z-doublespinner-btn-upper:not(:hover) {
  border-width: 1px 1px 0 1px !important; }

.z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over .z-doublespinner-btn-lower:hover, .z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over .z-doublespinner-btn-lower:not(:hover) {
  border-width: 0 1px 1px 1px !important; }

.z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over .z-doublespinner-btn-upper:hover, .z-doublespinner .z-doublespinner-btn.z-doublespinner-btn-over .z-doublespinner-btn-lower:hover {
  background-image: none;
  border-color: #44494D;
  background-color: #44494D;
  color: #fff;
  margin: 0; }

.z-doublespinner .z-doublespinner-btn-upper:before, .z-doublespinner .z-doublespinner-btn-lower:before {
  font-family: "FontAwesome";
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 10px; }

.z-doublespinner .z-doublespinner-btn-upper:before {
  content: ""; }

.z-doublespinner .z-doublespinner-btn-lower:before {
  content: ""; }

.z-auxheader-cnt {
  font-family: Inter;
  font-size: 14px;
  color: #262626; }

.z-auxheader-cnt .z-label {
  font-weight: 700 }

div.z-grid-header th.z-auxheader {
  border: 0px;}

div.z-grid-header tr.z-auxhead, tr.z-row .z-detail-outer {
  background-color: #e6e6e6; }

table.hbox-header.z-hbox > tbody > tr > td > table {
  text-align: center !important; }
    
input[type="radio"]:checked {
  accent-color: #44494D; }
    
input[type="checkbox"]:checked{
  accent-color: #44494D; }
  
.listbox-nohover .z-listitem {
    background: #ffffff; }
    
.listbox-nohover .z-listitem .z-listcell, .listbox-nohover.z-listbox {
    border: none; }

table {
  border-collapse: collapse;
}

div.z-listcell-cnt {
  line-height: 20px;
}

.z-button-os{
  font-weight: 600;
  background-color: #f5f5f5;
  color: #374151;
  border: 1px solid #C1C5CA;
}

.z-button-os:hover{
  color: #374151;
  background-color: #EEEEEE; }

.z-button-os:active, .z-button-os:focus {
  color: #374151;
  background-color: #DDDDDD;
}


.fa-file-circle-check:before {
  content: url(../images/iconp-tw/icon/file-circle-check.svg);
}

.fa-file-circle-check1:before {
  content: url(../images/iconp-tw/icon/file-history.svg);
  /*content: url(../images/iconp-tw/icon/file-circle-check.svg);*/
}

.fa-file-history:before {
  content: url(../images/iconp-tw/icon/file-history.svg);
}

.z-temp, .z-modal-mask {
  filter: unset;
   opacity: 1; 
  background: #00000099;
}




.tab-vbbh {
  position: relative;
}

.tab-vbbh > .z-tabs.z-tabs-scroll {
  position: absolute;
  width: fit-content !important;
  z-index: 9;
  top: 50px;
  left: 16px;
}

.tab-vbbh > .z-tabs.z-tabs-scroll .z-tabs-edge {
  display: none;
}

.tab-vbbh > .z-tabs.z-tabs-scroll .z-tabs-left-scroll {
  display: none;
}

.tab-vbbh > .z-tabs.z-tabs-scroll .z-tabs-right-scroll {
  display: none;
}


.tab-vbbh > .z-tabs.z-tabs-scroll .z-tabs-header > ul{
  padding: 2px;
  background-color: #E6E6E6;
  width: unset !important;
  border-radius: 4px;
}

.tab-vbbh-container .tab-vbbh .z-tabpanel{
  
  border: 0px solid #cccccc;

}

.tab-vbbh > .z-tabs .z-tabs-cnt li.z-tab-seld .z-tab-text {
  color: #EE0033;
  font-weight: 600;
}

.tab-vbbh > .z-tabs .z-tabs-cnt li.z-tab-seld {
  border-radius: 4px;
}

.tab-vbbh > .z-tabs {
  border: 0;
}

.tab-vbbh .z-vtab .z-tab-hm {
  margin-right: 111px !important;
}
.tab-vbbh > .z-tabs.z-tabs-scroll .z-tabs-header > ul{
  width: 500px !important;
  display: none;
  justify-content: space-between;
  padding-left: 12px;
  
}

.tab-vbbh-container div:has(> .mtm-12) {
  min-height: 28px;
}

.tab-vbbh-container .z-tabs-header-scroll {
  margin: 0px !important;
}

.tab-vbbh-container .z-tabs-cnt li {
  border-right: 0;
}

.position-sticky {
  position: sticky !important;
}

.div-paging{
  display: flex;
  flex-direction: row;
  column-gap: 6px;
  padding-top: 5px;
  align-items: center;
  width: 100%;
  .z-combobox-inp{
    height: 24px !important;

  }
  .z-combobox-btn{
    height: 24px !important;
  }
  .z-combobox-btn::before{
    line-height: 24px !important;
  }
  input{
    padding: 0 !important;
    text-align: center !important;
  }

}

.saveHeader .z-toolbarbutton-cnt {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100%;
    height: 100%;
}

.saveHeader .z-toolbarbutton-cnt img {
    width: 30px;
    height: 30px;
    margin: auto;
}

.saveHeader .z-toolbarbutton-cnt {
    padding: 0;
    margin: 0;
}
.saveHeader.z-toolbarbutton-over .z-toolbarbutton-body{
    border:none !important;
}
.send-to-badge {
  font-size: 12px; margin-right: 8px; padding: 2px 4px; width: fit-content !important;
}

* {
  scrollbar-color: #0000001a transparent;
}

/*.z-listbox-body {*/
/*  scrollbar-color: transparent transparent;*/
/*}*/

/*.z-listbox-body:hover {*/
/*  scrollbar-color: #0000001a transparent;*/
/*}*/
