:root {
    /* --im-font-primary-font-family: 'Poppins', sans-serif; */
    --im-font-primary-font-family: 'Questrial', sans-serif;
    --im-body-font-size: 0.875rem;
    --im-body-font-weight: 400;
    --im-body-line-height: 1.5;
    --im-body-color: #000000;
    --im-body-bg: #FFFFFF;
    --im-bg-primary: #F4F4F4;
    --im-bg-secondary: #00b5e2;
    --im-primary-color: #00b5e2;
    --im-secondary-color: #00B5E2;
    --im-hover-primary-color: #000000;
    --im-hover-secondary-color: #00B5E2;
    --im-secondary-border-color: #b4b4b4;
    --comse-dark-color: #004640;
    --comse-success-color: #089A8E;
    --comse-danger-color: #D1512D;
    --comse-danger-bg: #D1512D;
    --comse-light-color: #f2f2f2;
}
.bg-comse-dark{
    background: var(--comse-dark-color);
}
.bottom-nav a{
    color: #ffffff !important;
}
.bottom-nav div.active{
    background: var(--comse-success-color);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.btn-comse-danger{
    background: var(--comse-danger-color) !important;
}
.btn-comse-dark{
    background: var(--comse-dark-color) !important;
}
.bg-comse-light{
    background: var(--comse-light-color) !important;
}
body {
    /* color: var(--im-primary-color) !important; */
    background: var(--im-body-bg);
    font-family: var(--im-font-primary-font-family);
    font-weight: var(--im-body-font-weight);
    font-size: var(--im-body-font-size);
    line-height: var(--im-body-line-height);
}

a {
    color: #000000 !important;
    text-decoration: none;
    cursor: pointer;

}
a:hover {
    /* color: var(--im-primary-color) !important; */
    text-decoration: none;
}
ul li{
    list-style: none;
}
.border-top-left-25{
    border-top-left-radius: 25px;
}
.border-bottom-left-25{
    border-bottom-left-radius: 25px;
}
.bg-comse-danger{
    background-color: var(--im-bg-primary)!important;
}
.bg-primary{
    background-color: var(--im-bg-primary)!important;
}
.primary-color{
    color: var(--im-primary-color)!important;
}
.btn-primary{
    background-color: var(--im-bg-primary)!important;
    border: var(--im-bg-primary)!important;
}
.btn-secondary{
    background-color: var(--im-bg-secondary) !important;
    border: var(--im-bg-secondary)!important;
}
.bg-primary{
    background-color: var(--im-bg-primary)!important;
}
.bg-grey{
    background-color: #6c757d !important;
}
.bg-primary-b{
background-color: #0d6efd !important;
}
.primary-color{
    color: var(--im-primary-color)!important;
}
.bg-secondary{
    background-color: var(--im-bg-secondary) !important;
}

.bg-cat{
    background-color: #6b6c71 !important;
}
.nav-link {
    display: block;
    color: rgba(0, 0, 0, 0.9) !important;
    text-decoration: none;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}
.navbar-nav {
    display: flex;
    flex-direction: row !important;

}
.navbar-nav .nav-link {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
}

.serach-box{
    height: 46px;
}
.serach-box input{
    height: 30px;
}
.welcome img{
    width: 28px;
}
.cat-card{
  width: 10rem;
}
.font-50{
    font-size: 50px;
}
.mt-n2{
    margin-top: -2px !important;
}
.plr-10{
    padding-left: 10px !important;
    padding-right: 10px !important;
}
.edit-section{
    display:none
}
.cat-card:hover .edit-section{
    display:block;
    margin-bottom: 10px!important;
}
.hr-sect,.hr-sect2{
    display:flex;
    flex-basis:100%;
    align-items:center;
    color:rgba(0,0,0,.35);
    margin:8px 0
}
.hr-sect:after,.hr-sect:before{
    content:"";
    flex-grow:1;
    background:#ddd;
    height:1px;
    font-size:0px;
    line-height:0;
    margin:0 8px
}
.theme-box-shadow{
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}
.height-70{
    height:70px;
}
.height-86{
    height:86px;
}
.customer-circle{
    width:45px;
    height:45px;
    border-radius:50%;
    background-color:#f4f4f4;
}
.set-scroll{
    overflow-y: auto !important;
    max-height: 350px;
}
.cursor-pointer{
    cursor: pointer;
}
.keypad-section .btn-keypad:hover{
    background-color: #F8F9FA;
}
.overflow-x-overlay{
    overflow-x: auto;
}
.overflow-y-overlay{
    overflow-y: scroll;
}
.new-customer{
    display: none;
}
.height-110{
    height:110px;
}
.height-126{
    height:126px;
}
.height-183{
    height:183px;
}
.bg-card{
    background-color: #F7F7F7;
}
.mt-60{
    margin-top: 60px;
}
.mb-60{
    margin-bottom: 60px;
}
.mb-100{
    margin-bottom: 100px;
}
.w-wekit{
    width: -webkit-fill-available;
    width: -moz-available;
}
.qty-container{
    display: flex;
  }
  .qty-container .input-qty{
    text-align: center;
    padding: 6px 10px;
    border: 1px solid #d4d4d4;
  }
  .qty-container .qty-btn-minus,
  .qty-container .qty-btn-plus{
    border: 1px solid #d4d4d4;
    padding: 10px 13px;
    font-size: 10px;
    height: 38px;
    width: 38px;
    transition: 0.3s;
  }
  .qty-container .qty-btn-plus{
    margin-left: -1px;
  }
  .qty-container .qty-btn-minus{
    margin-right: -1px;
  }
  /* fonts variable */
  .font-12{
    font-size: 12px !important;
  }
  .font-14{
    font-size: 14px !important;
  }
  .font-16{
    font-size: 16px !important;
  }
  .font-18{
    font-size: 18px !important;
  }
  .font-20{
    font-size: 20px !important;
  }
  .font-22{
    font-size: 22px !important;
  }
  .font-24{
    font-size: 24px !important;
  }
  .font-26{
    font-size: 26px !important;
  }
  .font-28{
    font-size: 28px !important;
  }
  .font-30{
    font-size: 30px !important;
  }
  .font-32{
    font-size: 32px !important;
  }
  .font-34{
    font-size: 34px !important;
  }
  .font-36{
    font-size: 36px !important;
  }

  /* width variable */
  .w-10{
   width: 10% !important;
  }
.w-20{
width: 20% !important;
}
.w-30{
width: 30% !important;
}
.w-40{
width: 40% !important;
}
.w-50{
width: 50% !important;
}
.w-60{
width: 60% !important;
}
.w-70{
width: 70% !important;
}
.w-80{
width: 80% !important;
}
.w-90{
width: 90% !important;
}
.transaction-list:hover{
    background-color: #FFFFFF;
}
.transaction .active{
    background-color: #FFFFFF;
}
.mh-400{
    max-height: 450px;
}
.dropdown-item.active, .dropdown-item:active {
    color: var(--bs-dropdown-link-active-color);
    text-decoration: none;
    background-color: #e1e3e6;
}
.r-tab .nav-tabs .nav-link.active {
    background-color:#3c454c;
    color:#ffffff !important;
}
.height-70vh{
    height:70vh;
}
.font-150{
    font-size:150px;
}