@charset "UTF-8";
/*  Base CSS Start */
:root{
  --primary-color: #FEF200;
  --secondary-color: #E3182C;
  --body-color: #241D24;
  --white-color: #ffffff;
  --sidebar-width: 250px;
  --bs-link-color-rgb: 0,0,0;
}
*{margin:0;padding:0;box-sizing: border-box;}
html{font-smooth: antialiased;-webkit-font-smoothing: antialiased; -webkit-font-smoothing: subpixel-antialiased;  -moz-osx-font-smoothing: grayscale;scroll-behavior: smooth;}
body::-webkit-scrollbar {width:4px;background:#f2f2f2;}
body::-webkit-scrollbar-track {background-color:#f2f2f2;}
body::-webkit-scrollbar-thumb {background:#E3182C;width:4px;border-radius:2px;}

/* Body and Heading Fonts */
body{color: var(--body-color);background:#ffffff;font-style:normal;font-weight: 400;font-size:14px;overflow-x:hidden;font-family: 'Nunito Sans', sans-serif;}
h1,h2,h3,h4,h5,h6,button,.btn,li,a{font-style:normal;}
h1,h2,h3,h4,h5,h6{font-weight:500;line-height:120%;font-family: 'Bebas Neue';letter-spacing: 2px;}
p{line-height: 150%;}
a{text-decoration:none;color: #cb2b19}
a:hover, a:focus,a:active{outline:none;text-decoration:none;}
ul, li{list-style:none;padding: 0;margin: 0;}

.navbar-brand,.navbar-brand img{height: 75px;}
.navbar-nav{--bs-nav-link-padding-y: 0;align-items: center;--bs-navbar-nav-link-padding-x: 0.5rem;--bs-nav-link-padding-x: 0.5rem;}

.avatar{width: 32px;height: 32px;border-radius: 50%;overflow: hidden;}
.avatar img{width: 100%;height: 100%;object-fit: cover;}
.avatar-lg{width: 40px;height: 40px;}
.avatar-xl{width: 64px;height: 64px;}


.navbar-nav .dropdown-menu{left: auto;right: 0;--bs-dropdown-item-padding-y: 0.5rem;}
.navbar-nav .dropdown-item{font-size: 0.85rem;}
.navbar-nav .dropdown-item p{margin-bottom: 0;}
.navbar-nav .dropdown-item small{color: #666;font-size: 0.75rem;}
.navbar-nav .dropdown-item span{margin-right: 0.25rem;vertical-align: middle;display: inline-block;}
.dropdown-toggle:before,.dropdown-toggle:after{display: none;}

.sec-a{padding: 16px;height: 100vh;}
.sec-a .row{height: 100%;}
.sec-aa{height: 100%;display: flex;flex-direction: column;justify-content: space-between;padding: 24px;color: var(--white-color);border-radius: 24px;overflow: hidden;}
.sec-aa a img{width: 8vw;}
.sec-aa h2{font-size: 3vw;}

.sec-ab{max-width: 30vw;margin: auto;}

.has-bg{position: relative;}
.has-bg > img:first-child{position: absolute;left: 0;top: 0;width: 100%;height: 100%;object-fit: cover;object-position: center;}
.has-bg > *{position: relative;}


.sidebar-content{width: var(--sidebar-width);flex-basis: var(--sidebar-width);background-color: #f5f5f5;flex-shrink: 0;min-height: 100vh;height: 100%;padding: 16px;background-color: var(--body-color);color: var(--white-color);overflow: auto;}
.dash-content{flex-grow: 1;margin-left: 1rem;margin-right: 1rem;}
.dash-content .navbar{margin-top: 1rem;}
.dash-content .navbar-nav .dropdown-menu{position: absolute;}

.side-a{text-align: center;}
.side-a .navbar-brand{height:70px;width: 100%;display: block;}
.side-a .navbar-brand img{height: 100%;object-fit: contain;}

.side-b .navbar-nav{flex-direction: column;align-items: start;--bs-nav-link-padding-y: 0.5rem;--bs-nav-link-padding-x: 0.5rem;width: 100%;}
.side-b .navbar-nav .nav-item{width: 100%;}
.side-b .navbar-nav .nav-link{color: var(--white-color);}
.side-b .navbar-nav .nav-link:hover{color: var(--primary-color);}
.side-b .navbar-nav .nav-link i{vertical-align: middle;}
.side-b .navbar-nav .nav-link span{margin-left: 0.5rem;vertical-align: middle;}

#sidebarCollapse{transition: all 300ms ease;min-width:50px;flex-shrink: 0;}


.side-b .dropdown,
.side-b .dropdown a{position: relative;}
.side-b .dropdown .drop-arrow{position: absolute;right: 0;top: 12px;transition: all 300ms ease;display: flex;}
.side-b .dropdown .show .drop-arrow{transform: rotate(180deg);}
.side-b .dropdown-menu{padding: 0;background-color: transparent;padding-left: 2.1rem;margin: 0;}
.side-b .dropdown-menu a{color: var(--white-color);padding: 0.25rem 0;display: block;font-size: 0.85rem;}

.drop-footer i{margin-right: 0.25rem;}
.drop-footer i,
.drop-footer span{display: inline-block;vertical-align: middle;}

.bg-yellow{background-color: rgba(254, 242, 0,0.5);}

.dash-inner{padding: 1rem 0;}

.lni{vertical-align: middle;}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--body-color);
  --bs-btn-border-color: var(--body-color);
  --bs-btn-hover-color: var(--body-color);
  --bs-btn-hover-bg: var(--primary-color);
  --bs-btn-hover-border-color: var(--body-color);
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primary-color);
  --bs-btn-active-border-color: var(--body-color);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--body-color);
  --bs-btn-disabled-border-color: var(--body-color);
}

.badge{background-color: var(--primary-color) !important;color: var(--body-color) !important;border: 1px solid var(--body-color);}
.badge:hover{background-color: #000 !important;color: #FFF !important;}

.mob-toggle{position: absolute;right: 100%;top: 20px;transform: translateX(50%);background-color: #ffffff;width: 32px;height: 32px;display: none;align-items: center;justify-content: center;border-radius: 50%;}
.mob-toggle span{color: #241D24;font-size: 16px;}

.desk-toggle{position: absolute;right: 100%;top: 80px;transform: translateX(50%);background-color: var(--primary-color);width: 32px;height: 32px;display:flex;align-items: center;justify-content: center;border-radius: 50%;}
.desk-toggle span{color: var(--body-color);font-size: 16px;transition:all 300ms ease;}
.show.collapse .desk-toggle span{transform: rotate(180deg);}


.table-style th{font-family: 'Bebas Neue';font-size: 18px;font-weight:400;letter-spacing:1px;}
.table-style th td{font-size: 12px;}
.staff-edit{color: var(--body-color);}
.staff-edit:hover{color: #ff0000;}
.staff-edit span{display: inline-flex;align-items: center;justify-content: center;background-color: var(--primary-color);border-radius: 0;width: 20px;height: 20px;vertical-align: middle;}
.staff-user-name{text-decoration: underline;}

table .disabled td{background-color: #E3182C44;pointer-events: none;}

.form-label {
    margin-bottom: 0.25rem;
    font-family: 'Bebas Neue';
    letter-spacing: 1px;
    line-height: 100%;
}

.staff-details{max-width: 560px;}
.form-spinner{
    position:absolute;
    right: 60px !important;
}
.auto_complete {
    position:absolute;
    top:100%;
    left:0;
    z-index: 99;
    background: #fff;
    width: 100%;
    border: 1px solid #ccc;
    padding: 16px;
    border-radius: 0 0 8px 8px;
    box-shadow: unset;
}
.auto_complete .header{display:flex;align-items:center;flex-wrap:wrap;padding-bottom:8px;}
.auto_complete .header #auto_close{margin-left:auto;}
.auto_complete .contacts li a{color: #212529;padding: 4px 0;display:block;}

.user-dropdown .dropdown-toggle:hover{color: #E3182C;}
.user-drop,.user-drop p{line-height: normal;}
.user-drop span{line-height:0;}
.user-drop small{font-size:10px}

.side-b .dropdown-menu a.active {
    color: var(--primary-color);
}

.help {
  color: #468847;
  font-size: 80%;
}

@media (min-width: 1201px) {
  #sidebarCollapse:not(.show) .dropdown-menu{display: none;}
  #sidebarCollapse{display: block;position: sticky;height: 100vh;top: 0;}
  .collapse:not(.show) .sidebar-content{--sidebar-width: 50px;padding: 0.5rem;}
  .collapse:not(.show) .sidebar-content span{display: none;}
  .layout-container{display: flex;}
}

@media (max-width: 1200px) {
  .mob-toggle{display: flex;}
  .desk-toggle{display:none;}
  #sidebarCollapse{position: fixed;top: 0;right: 0;z-index: 99999;height: 100vh;}
}

@media (max-width: 991px) {
  .sec-a{position: relative;background-color: rgba(0, 0, 0, 0.7);}
  .sec-a .row{align-items: center;align-content: center;}
  .sec-aa{height: auto;position: static;text-align: center;}
  .sec-aa > img{z-index: -1;}
  .sec-aa a img{width: 200px;margin-bottom: 24px;}
  .sec-aa h2{display: none;}
  .sec-ab{max-width: 480px;padding: 32px 24px;background-color: #fff;border-radius: 24px;}
}
@media (max-width: 767px) {
  .sec-aa a img{width: 150px;}
}
@media (max-width: 600px){
    .responsive_table{
        text-align:left;
    }
    .responsive_table th {
        display: none;    
    }
    .responsive_table td {
        display: block;
        width: 100%;
        text-align: left !important;
    }
    .responsive_table td .prepended{
        font-size: 16px;
        font-weight: 500;
        margin-right:16px;
        min-width:50% !important;
        display: inline-block;
    }
}
@media (max-width:560px) {
  .staff-details{font-size: 12px;}
}
.sidebar-content::-webkit-scrollbar {
  width: 0;
}