/**
 * Voffice 2.0 Theme
 * @author TuanTM30
 * @license Viettel Group
 */
/*****************************Variables**************************** */
/* -------------------------THEME RED GRAY----------------------------------- */
/**
 * Voffice 2.0 Theme customizable components
 * @author TruongTX5
 * @license Viettel Group
 */
/* -------------------------Header----------------------------------- */
.main-header {
  background-color: #FFFFFF; }

/* -------------------------Popup user info----------------------------------- */
.popup-user-info.top-arrow:after {
  border-color: rgba(136, 183, 213, 0);
  border-bottom-color: #1F2937; }

.user-info-panel {
  background-color: #1F2937; }

.user-info-panel-row:hover {
  background-color: #44494D; }

/* -------------------------Popup select theme----------------------------------- */
.popup-select-theme.top-arrow:after {
  border-color: rgba(136, 183, 213, 0);
  border-bottom-color: #1F2937; }

.select-theme-panel {
  background-color: #1F2937; }

/* -------------------------Menu----------------------------------- */
.main-left {
  background-color: #1F2937; }

.collapse-menu-container {
  background: #1F2937; }

.collapse-menu-name {
  background: #1F2937; }

.collapse-menu-container.left-arrow:after {
  border-color: rgba(136, 183, 213, 0) #1F2937 rgba(136, 183, 213, 0) rgba(136, 183, 213, 0); }

/* -------------------------Button----------------------------------- */
.z-button-os.primary  {
  border: 0px;
  color: #fff;
  background-color: #B9000E; }

.z-button-os.primary:hover{
  color: #fff;
  background-color: #DC2626; }

.z-button-os.primary:active, .z-button-os.primary:focus {
  color: #fff;
  background-color: #A3000C;
}


.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;
}

.faToolbarButton {
  background-color: #B9000E; }

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

.faToolbarButton.z-toolbarbutton-over:active {
    background-color: #A3000C;
}

span.z-button {
  background-color: #f5f5f5; }

span.z-button .z-button-over {
  background-color: #EEEEEE; }

/* -------------------------Form control----------------------------------- */
.z-textbox.z-textbox-focus,
.z-intbox.z-intbox-focus,
.z-datebox.z-datebox-focus .z-datebox-inp,
.z-combobox.z-combobox-focus .z-combobox-inp,
.z-spinner.z-spinner-focus .z-spinner-inp,
.z-timebox.z-timebox-focus .z-timebox-inp,
.z-bandbox.z-bandbox-focus .z-bandbox-inp {
  border-color: #44494D; }

.z-combobox-shadow {
  border-color: #44494D; }

.z-bandbox-shadow {
  border-color: #44494D; }

.z-paging-inp:focus, .z-paging input.z-paging-inp:focus {
  border-color: #44494D; }
  
  
/*---tridv--*/
/*-----------------------------------Left Menu Expand-------------------------------------- */
.expand-menu-item {
 background-color: #1F2937; }

.expand-menu-item.menu-active {
  background-color: #1F2937; } 

.expand-menu-name {
  color: #FFFFFF; }   

.expand-menu-name-text.z-label {
  color: #FFFFFF; } 
  
.expand-menu-item.menu-active .expand-menu-name {
  color: #fff; 
  background-color: #1F2937; }

.expand-sub-menu-name {
  color: #FFFFFF; }  

.expand-sub-menu-name-text.z-label {
  color: #FFFFFF; }

.expand-menu-name:hover {
  color: #fff;
  background-color: #B9000E; }
  
.expand-sub-menu-name:hover {
  color: #fff;
  background-color: #B9000E; }

.expand-sub-menu-item.menu-active .expand-sub-menu-name {
  color: #fff; }

.expand-menu-item.menu-active .expand-menu-name:hover {
  color: #fff;
  background-color: #B9000E; }

/*-----------------------------------Left Menu Collapse-------------------------------------- */
.collapse-menu-item:hover .collapse-menu-icon, .collapse-menu-item.menu-active .collapse-menu-icon {
  color: #FFFFFF; 
  background-color: #B9000E;
  border-radius: 8px;
  width: 44px;
  height: 44px;
  transform: translate(6px);
  }

.collapse-menu-icon {
  color: #FFFFFF; }

.collapse-menu-name-text.z-label {
  color: #FFFFFF; }
  
.collapse-sub-menu-item {
  color: #FFFFFF; }

.collapse-sub-menu-name {
  color: #FFFFFF; }  
    
.collapse-sub-menu-name:hover {
  color: #FFFFFF;
  background-color: #B9000E; }

.collapse-sub-menu-item.menu-active .collapse-sub-menu-name {
  color: #FFFFFF; }

.collapse-sub-menu-name-text.z-label {
  color: #FFFFFF; }