/* ==============
  Base Theme - Common White Label Styles - v1.0.0
  This file contains all the common styling that's shared across white-label themes
============== */

/* Critical Above-the-Fold Styles */
.accountbgwhitelabel, .accountbg {
  background-color: var(--secondary-color) !important;
}

.loginWhiteLabelSection .card, .accountbg .card {
  background-color: var(--white-color);
}

.side-menu {
    background-color: var(--primary-color);
    top: 76px;
}

/* Scrollbar Styling */
.left-menu-scroll::-webkit-scrollbar-track {
  background: var(--border-color);
}

.left-menu-scroll::-webkit-scrollbar-thumb {
    background: var(--primary-color);
    border-radius: 30px;
}

.left-menu-scroll::-webkit-scrollbar-thumb:hover {
  background: var(--primary-color);
}

/* Button Styling - Login Section */
.loginWhiteLabelSection .button-menu-mobile {
  color: var(--primary-color);
  background-color: var(--white-color);
}

.loginWhiteLabelSection .btn-primary {
    background-color: var(--primary-color);
    border: 1px solid var(--primary-color);
    box-shadow: rgb(0 0 0 / 20%) 1px 2px 2px 0px;
    height: 40px;
}

.loginWhiteLabelSection .btn-primary:hover, 
.loginWhiteLabelSection .btn-primary:focus, 
.loginWhiteLabelSection .btn-primary:active, 
.loginWhiteLabelSection .btn-primary.active, 
.loginWhiteLabelSection .btn-primary.focus, 
.loginWhiteLabelSection .open > .dropdown-toggle.btn-primary, 
.loginWhiteLabelSection .btn-outline-primary.active, 
.loginWhiteLabelSection .btn-outline-primary:active, 
.loginWhiteLabelSection .show > .btn-outline-primary.dropdown-toggle, 
.loginWhiteLabelSection .btn-outline-primary:hover, 
.loginWhiteLabelSection .show > .btn-primary.dropdown-toggle, 
.loginWhiteLabelSection .btn-primary:not(:disabled):not(.disabled).active, 
.loginWhiteLabelSection .btn-primary:not(:disabled):not(.disabled):active, 
.loginWhiteLabelSection .show > .btn-primary.dropdown-toggle {
   background-color: var(--primary-color);
    border: 1px solid var(--primary-color);
}

.loginWhiteLabelSection .welcome-pgname{
  border: 2px dashed var(--dashed-border-color, #a8571e);
  background: var(--primary-color);
  color: var(--white-color);
}

/* General Button Styling */
.btn-outline-info {   
    border-color: #d4d4d4;
}

.btn-outline-info:hover {
    background-color: var(--button-color);
    border-color: var(--button-color);
}

.btn-outline-primary {   
    border-color: var(--button-color);
}

.btn-outline-primary:hover {
   background-color: var(--button-color);
    border: 1px solid var(--button-color);
}

.btn-secondary {
    color: #000;
    background-color: var(--white-color);
    border-color: #b8c7d5;
}

.btn-primary {
    background-color: var(--button-color);
    border: 1px solid var(--button-color);
}

.btn-primary:hover, 
.btn-primary:focus, 
.btn-primary:active, 
.btn-primary.active, 
.btn-primary.focus, 
.btn-outline-primary.active, 
.btn-outline-primary:active, 
.show > .btn-outline-primary.dropdown-toggle, 
.btn-outline-primary:hover, 
.btn-primary.active, 
.btn-primary:active, 
.show > .btn-primary.dropdown-toggle, 
.btn-primary:not(:disabled):not(.disabled).active, 
.btn-primary:not(:disabled):not(.disabled):active, 
.show > .btn-primary.dropdown-toggle {
    background-color: var(--button-color);
    border: 1px solid var(--button-color);
}

.btn-primary:disabled {   
    background-color: var(--button-color) !important;
    border-color: var(--button-color) !important;
}

.btn-outline-primary:not(:disabled):not(.disabled).active, 
.btn-outline-primary:not(:disabled):not(.disabled):active, 
.show>.btn-outline-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--button-color);
    border-color: var(--button-color);
}

.btn-outline-primary:hover, .btn-primary:hover {
    color: #fff;
    background-color: var(--button-color);
    border-color: var(--button-color);
}

/* Sidebar Menu */
#sidebar-menu > ul > li > a:hover, 
#sidebar-menu > ul > li > a:focus, 
#sidebar-menu > ul > li > a:active {  
   background: var(--sidebar-hover-color, #2e1b03);
} 

.btn-outline-secondary.focus {
    background-color: var(--button-color);
    box-shadow: 0 0 0 2px rgb(240 95 95);
    color: var(--white-color);
}

/* Tables */
table thead th {  
    background: #f6f6f6;
}

.thead-light th{
    background: #f6f6f6 !important;
}

/* Navigation Tabs */
.nav-tabs-custom > li > a::after { 
    background: var(--button-color);
}

.nav-tabs-custom > li > a.active {
    color: #077db4 !important;
}

/* Background Colors */
.bg-info-1 {
    background-color: #ffffe1;
}

/* Enlarged Menu */
.enlarged #wrapper .left.side-menu #sidebar-menu > ul > li > a:hover{
    background-color: var(--button-color);
}

/* Custom Controls */
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background: var(--button-color);
}

.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: rgb(121 0 0 / 44%);
}

/* Element UI Tags */
.el-tag.el-tag--info {
    background-color: var(--button-color) !important;
    border-color: var(--button-color) !important;   
}

/* Topbar */
.topbar .topbar-left {  
    border-bottom: 1px solid var(--topbar-border-color, #f2747b) !important;
    background: var(--topbar-gradient, linear-gradient(90deg, #ffddde 50%, #fba2a6 100%));
    background: var(--topbar-gradient-moz, -moz-linear-gradient(90deg, #ffddde 50%, #fba2a6 100%));
    background: var(--topbar-gradient-webkit, -webkit-linear-gradient(90deg, #ffddde 50%, #fba2a6 100%));
    height: 76px;
    padding-top: 4px;
}

/* Logo */
.logo-45px{
   height: 65px;
}

/* Specific Components */
.bedcellsection[data-v-b9e2b458] {
    overflow-y: hidden !important;
}

.badge-info {
    background-color: var(--button-color);
}

/* Timeline */
.timeline {
    border-left: 3px solid var(--button-color);   
    background: var(--timeline-bg, rgb(252 248 240));
}

.timeline .event:after {  
    box-shadow: 0 0 0 3px var(--button-color);
    left: -31px;
}

/* Text Styling */
.login-labels{
 color: #565656 !important;
}

.text-white {
  color: #707070 !important;
}

.loginWhiteLabelSection {
  max-width: 460px !important;
  margin-top: 10%;
}

.hyper-link{
    color: #337ab7 !important;
}

.accountbg {
    background-color: #aebac0;
}

/* Page Name Background */
.bg-pg-name {
    background: var(--pg-name-gradient, linear-gradient(90deg, #142850 0%, #755d3f 100%));
    background: var(--pg-name-gradient-moz, -moz-linear-gradient(90deg, #142850 0%, #755d3f 100%));
    background: var(--pg-name-gradient-webkit, -webkit-linear-gradient(90deg, #142850 0%, #755d3f 100%));
}

.text-light-blue {
    color: var(--white-color);
}

#sidebar-menu > ul > li > a {
    color: rgb(255 233 233);
}

.menu-title {
  color: var(--menu-title-color, #ffd449);
}

/* General Styling */
label {
    color: #565656;
}

.fa {
    color: var(--primary-color) !important;
}

#sidebar-menu .fa {
    color: var(--white-color) !important;
}

.qr-code-icon {
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color) !important;
}

.button-menu-mobile {
    color: #077db4;
}