@font-face {
   font-family: 'Roboto-Bold';
   src: url('../fonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Bold.woff') format('woff'), url('../fonts/Roboto-Bold.ttf') format('truetype'), url('../fonts/Roboto-Bold.svg#Roboto-Bold') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: 'Roboto-Light';
   src: url('../fonts/Roboto-Light.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Light.woff') format('woff'), url('../fonts/Roboto-Light.ttf') format('truetype'), url('../fonts/Roboto-Light.svg#Roboto-Light') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: 'Roboto-Medium';
   src: url('../fonts/Roboto-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Medium.woff') format('woff'), url('../fonts/Roboto-Medium.ttf') format('truetype'), url('../fonts/Roboto-Medium.svg#Roboto-Medium') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: 'Roboto-Regular';
   src: url('../fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Regular.woff') format('woff'), url('../fonts/Roboto-Regular.ttf') format('truetype'), url('../fonts/Roboto-Regular.svg#Roboto-Regular') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: 'Roboto-Thin';
   src: url('../fonts/Roboto-Thin.eot?#iefix') format('embedded-opentype'), url('../fonts/Roboto-Thin.woff') format('woff'), url('../fonts/Roboto-Thin.ttf') format('truetype'), url('../fonts/Roboto-Thin.svg#Roboto-Thin') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: 'sansationbold';
   src: url('../fonts/sansationbold.eot?#iefix') format('embedded-opentype'), url('../fonts/sansationbold.woff') format('woff'), url('../fonts/sansationbold.ttf') format('truetype'), url('../fonts/sansationbold.svg#sansationbold') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: 'sansationlight';
   src: url('../fonts/sansationlight.eot?#iefix') format('embedded-opentype'), url('../fonts/sansationlight.woff') format('woff'), url('../fonts/sansationlight.ttf') format('truetype'), url('../fonts/sansationlight.svg#sansationlight') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: 'sansationregular';
   src: url('../fonts/sansationregular.eot?#iefix') format('embedded-opentype'), url('../fonts/sansationregular.woff') format('woff'), url('../fonts/sansationregular.ttf') format('truetype'), url('../fonts/sansationregular.svg#sansationregular') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: swap;
}

:root {
   --f-reg: 'Roboto-Regular', sans-serif;
   --f-thin: 'Roboto-Thin', sans-serif;
   --f-medium: 'Roboto-Medium', sans-serif;
   --f-bold: 'Roboto-Bold', sans-serif;
   --f-light: 'Roboto-Light', sans-serif;
}

body {
   font-family: var(--f-reg);
   overflow-x: hidden;
}

* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
}

a {
   color: inherit;
   text-decoration: none;
}

a {
   /*color: #2f0802;*/
}

h1,
h2,
h3,
h4 {
   color: #000000;
}

*:focus {
   outline: none !important;
   box-shadow: none !important;
}

button:focus {
   outline: none;
}

button {
   border: 0;
}

ol,
ul {
   padding-left: 0;
}

ol,
ul,
dl {
   margin-top: 0;
   margin-bottom: 0;
}

ul li {
   list-style: none;
   color: inherit;
}

img {
   max-width: 100%;
}
a:hover {
   -webkit-transition: all .3s ease 0s;
   -moz-transition: all .3s ease 0s;
   -ms-transition: all .3s ease 0s;
   -o-transition: all .3s ease 0s;
   text-decoration: none;
}
.container {
   width: 1200px;
   margin: auto;
}
/*================================MOBILE MENU START================================*/

.c-hamburger--htx,
.c-hamburger--htx.is-active,
.c-hamburger--htx.is-active span {
   background: none;
}
.bg-color {
   background-color: #22376a;
   color: #fff;
}
.c-hamburger span {
   display: block;
   position: absolute;
   top: 15px;
   left: 0;
   right: 0;
   height: 1px;
   background: #001355;
}
.c-hamburger--htx span {
   -webkit-transition: background 0s .3s;
   transition: background 0s .3s;
}
.c-hamburger span::after,
.c-hamburger span::before {
   position: absolute;
   display: block;
   left: 0;
   width: 100%;
   height: 1px;
   background-color: #001355;
   content: "";
}
.c-hamburger span::before {
   top: -8px;
}
.menu-icon {
   position: relative;
   width: 29px;
       z-index: 99999;
   left: 0;
   top: -15px;
}
.c-hamburger--htx span::after,
.c-hamburger--htx span::before {
   -webkit-transition-duration: .3s, .3s;
   transition-duration: .3s, .3s;
   -webkit-transition-delay: .3s, 0s;
   transition-delay: .3s, 0s;
}
.c-hamburger--htx span::before {
   -webkit-transition-property: top, -webkit-transform;
   transition-property: top, transform;
}
.c-hamburger span::after {
   bottom: -8px;
}
.c-hamburger--htx span::after {
   -webkit-transition-property: bottom, -webkit-transform;
   transition-property: bottom, transform;
}
header.transparent-header .c-hamburger--htx.is-active span {
   background: 0 0;
}
.c-hamburger--htx.is-active span::before {
   top: 0;
   -webkit-transform: rotate(45deg);
   -moz-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
}
.c-hamburger--htx.is-active span::after,
.c-hamburger--htx.is-active span::before {
   -webkit-transition-delay: 0s, .3s;
   -moz-transition-delay: 0s, .3s;
   -ms-transition-delay: 0s, .3s;
   transition-delay: 0s, .3s;
}
header.transparent-header .c-hamburger span,
header.transparent-header .c-hamburger span::after,
header.transparent-header .c-hamburger span::before {
   background: #fff;
}
.c-hamburger.c-hamburger--htx.is-active span::after {
   bottom: 0;
}
.c-hamburger--htx.is-active span::after {
   bottom: 0;
   -webkit-transform: rotate(-45deg);
   -moz-transform: rotate(-45deg);
   -ms-transform: rotate(-45deg);
   transform: rotate(-45deg);
}
.menu-icon {
   display: none;
}
@media only screen and (max-width: 900px) {
   .c-hamburger {
      display: block;
   }
}
.content-wrapper {
    transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
    /*-webkit-transform: translate(0%, 0);*/
    /*transform: translate(0%, 0);*/
    /*-webkit-transform: translateX(0%);*/
    /*transform: translateX(0%);*/
}
.navigation {
   color: #fff;
   position: fixed;
   width: 80%;
   height: 100%;
   display: block;
   position: fixed;
   position: absolute;
   top: 0;
   left: -83%;
   top: 0px;
   margin: 0;
   border: 0;
   border-radius: 0;
   overflow-y: auto;
   overflow-x: hidden;
   height: 100%;
   padding: 55px;
   background-color: #001355;
   visibility: visible;
   transition: all 0.5s ease 0s;
   -webkit-transition: all 0.5s ease 0s;
   box-shadow: 0 0 10px 0 rgb(50 50 50 / 75%);
   z-index: 999;
   padding: 15px 15px 35px;
}
@media (max-width: 900px) {
   .content-wrapper {
      z-index: 800;
      position: relative;
      width: 100%;
      height: 100%;
      overflow-y: auto;
      overflow-x: hidden !important;
   }
   .sticky-header {
      top: -1px;
   }
}
.navigation.visible {
   left: 0;
}
.opacity {
   position: fixed;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   transition: all 0.5s ease 0s;
   -webkit-transition: all 0.5s ease 0s;
   -webkit-transform: translate(80%, 0);
   transform: translate(80%, 0);
}
.menu-header ul li,
.menu-header ul li a {
   display: block;
   color: #ffffff;
   /*font-family: 'NeueHaasDisplay-Light';*/
   font-size: 14px;
   font-family: 'Roboto-Bold', sans-serif;
   line-height: 36px;
   text-align: left;
   text-transform: capitalize;
   margin-right: 30px;
   position: relative;
   width: 100%;
   letter-spacing: 1px;
}
span.ion-ios-close-empty {
   color: #fff;
   font-size: 40px;
}
span.title-mo-menu {
   display: block;
   color: #ffffff;
   font-size: 24px;
   font-weight: 600;
   line-height: 36px;
   text-align: left;
   text-transform: uppercase;
   margin-right: 30px;
   position: relative;
   width: 100%;
   margin-bottom: 18px;
   margin-top: 15px;
}
/*.menu-header>ul>li>a:not(:only-child):after {
   content: '\f3d3';
   font-family: 'Ionicons';
   font-size: 20px;
   margin-left: 9px;
   font-weight: bold;
   float: right;
}*/
.menu-header ul li a:hover {
   color: #f1aa28;
}
.menu-header ul.sub-menu {
   position: relative;
   left: 0;
   right: 0;
   transform: none;
   width: 100%;
   transition: 0s ease out;
   margin-bottom: 15px;
   box-shadow: none;
   display: none;
}
li.active a::after {
   transform: rotate(90deg);
}
.menu-header ul.sub-menu li a {
   padding: 5px 15px;
   font-size: 17px;
   border-left: 1px solid;
}
.menu-header>ul>li>a.active:after {
   transform: rotate(90deg);
}
.mobile-menu {
   position: absolute;
   right: 16px;
   font-size: 48px;
   top: 10px;
}
.lock-scroll {
   position: fixed;
   overflow: hidden;
}
/*================================MOBILE MENU END================================*/

.pos-menu {
    background: #fff;
    border-bottom: 1px solid #EDEDED;
    box-sizing: border-box;
}
.pos-menu ul li {
    margin-left: 40px;
}
.pos-menu ul li:first-child {
    font-size: 14px;
    line-height: 16px;
    /*color: #494949;*/
    color: #001355;
}
.pos-menu ul li:not(:first-child) {
    font-size: 14px;
    line-height: 16px;
    /*color: #000000;*/
    color: #ffffff;
}
.pos-menu ul li:not(:first-child) a:first-child::after {content: ' | ';position: relative;display: inline-block;padding: 0 10px;color: #000;}
body.pos-idx {
    background: #F8F8F8;
}
.dropdown-menu.show {
    width: 100% !important;
}
.pos-lft h1, .pos-lft h2 {
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #000000;
    font-family: 'Roboto-Medium', sans-serif;
   margin-bottom: 10px;
}
.pos-info {
    box-shadow: 0px 4px 11px 0px #5178ff21;
    background: #fff;
    border-radius: 5px;
}
.mb-30{margin-bottom: 30px !important;}
.border-rd-5{
   border-radius: 5px;
}
.pos-select-info label {
    /*font-weight: 600;*/
    font-family: 'Roboto-Medium', sans-serif;
    font-size: 13px;
    line-height: 16px;
    color: #6B7A99;
    margin-top: 5px;
}
.pos-select-info label span {
    font-size: 12px;
    line-height: 16px;
    color: #194DFF;
}
.pos-select-info .bootstrap-select > .dropdown-toggle {
    border: 1px solid #E7E7E8;
    box-sizing: border-box;
    border-radius: 5px;
    font-size: 13px !important;
    line-height: 16px;
    /*color: #05051F;*/
    background: #fff;
    padding: 7px 10px;
}
.new-customer-main > div label > span {
    color: #FF0000;
}
.pos-select-search input {
    background: #FFFFFF;
    border: 1px solid #DBDBDB;
    box-sizing: border-box;
    border-radius: 5px;
    font-size: 13px;
    line-height: 16px;
    color: #7E7E7E;
    padding: 12px 40px;
    position: relative;
        margin-bottom: 15px;
}
.has-search .form-control {
    padding-left: 2.375rem;
}
.pos-select-search {
    position: relative;
}
.pos-select-search span {
    position: absolute;
    z-index: 99;
    top: 10px;
    left: 30px;
    font-size: 16px;
}
.search-drop button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: transparent;
    color: #000;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    font-family: 'Roboto-Medium', sans-serif;
    padding-top: 9px;
    padding-bottom: 9px;
}
.search-drop button i {
    margin-right: 10px;
}
.search-drop .dropdown:nth-child(1) button {
    color: #194DFF;
    border-color: #194DFF;
}
.search-drop .dropdown:nth-child(1) button:hover,
.search-drop .dropdown.show:nth-child(1) button {
   background: #194DFF;
}
.search-drop .dropdown:nth-child(2) button {
    color: #8833FF;
    border-color: #8833FF;
}
.search-drop .dropdown:nth-child(2) button:hover,
.search-drop .dropdown.show:nth-child(2) button  {
   background: #8833FF;
}
.search-drop .dropdown:nth-child(3) button {
    color: #33BFFF;
    border-color: #33BFFF;
}
.search-drop .dropdown:nth-child(3) button:hover,
.search-drop .dropdown.show:nth-child(3) button  {
   background: #33BFFF;
}
.search-drop .dropdown:nth-child(4) button {
    color: #F98133;
    border-color: #F98133;
}
.search-drop .dropdown:nth-child(4) button:hover,
.search-drop .dropdown.show:nth-child(4) button  {
   background: #F98133;
}
.pagination-pos a {
    font-size: 11px;
    line-height: 16px;
    color: #8b8b8b;
    padding: 4px 5px;
    background: #e6eaff;
    border-radius: 4px;
}
.search-drop button {
    color: #29CC39;
    border-color: #29CC39;
}
.search-drop button:hover , .search-drop .dropdown.show button{
    color: #fff !important;
}
.search-drop button:hover{
   background: #29CC39;
   border-color: inherit;
}
.search-drop .dropdown-menu.show a {
    /*font-weight: 500;*/
    font-size: 13px;
    font-family: 'Roboto-Medium', sans-serif;
    padding: 5px 10px;
}
.search-drop .dropdown-menu.show {
    width: 91% !important;
    box-sizing: border-box !important;
    min-width: 91%;
}
.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
    outline: none !important;
    outline-offset: 0px;
}
.pos-prd-table table tr th {
    font-size: 12px;
    line-height: 16px;
    color: #8EA6C1;
    vertical-align: middle;
    font-family: 'Roboto-Regular', sans-serif;
}
.pos-prd-table table tr td {
    font-size: 12px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
    vertical-align: middle;
        padding: 8px;
}
.pos-prd-table table tr.empty td{
    font-size: 24px !important;
    line-height: 30px !important;
    letter-spacing: 4px !important;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
    vertical-align: middle;
    padding: 8px;
    opacity: 0.7 !important;
}
.pos-prd-table table button.btn.dropdown-toggle.btn-light {
    padding: 0px;
    font-size: 12px;
    line-height: 16px;
    color: #43588F;
    background: transparent;
    border: 0px;
}
.pos-prd-table table i {
    color: #194DFF;
    font-size: 16px;
        margin: 0 5px;
}
.pos-prd-table table input, .pos-prd-table table input::placeholder {
    padding: 0px;
    border: 0px;
    border-bottom: 1px solid #E9E9E9;
    border-radius: 0px;
    font-size: 12px;
    line-height: 16px;
    text-align: center !important;
    color: #43588F;
    padding: 6px 0px;
        background: transparent;
}
.pos-prd-table table tr th {
    padding: 20px 8px;
}
.bootstrap-select .dropdown-menu li a {
    font-size: 12px;
    font-family:'Roboto-Medium', sans-serif;
    padding: 0.5rem 0.9rem;
}
.pos-prd-table .dropdown-menu.show {
    width: auto !important;
}
.pos-prd-table .table thead th, .pos-prd-table  .table tbody td {
  border-bottom: 1px solid #F3F3F3!important;
  border-top: 0px !important;
}
.pos-prd-table .table-hover tbody tr:hover {
    background-color: #F9FAFF;
}
.pagination-pos p {
    margin-bottom: 0px;
    font-size: 11px;
    line-height: 16px;
    color: #7E7E7E;
}
.pagination-pos a {
    font-size: 11px;
    line-height: 16px;
    color: #ADADAD;
}
.pagination-pos div a.active, .pagination-pos div a:hover {
    color: #000000;
}
.pagination-pos div span {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: #F5F5F5;
    font-size: 11px;
    line-height: 16px;
    color: #6B7A99;
    align-items: center;
    vertical-align: middle;
    padding: 2px 6px;
    margin: 0 10px;
    font-weight: bold;
}
.customer-info-pos .nav-tabs a.active {
    color: #194DFF;
        text-align: left;
    border: 0px;
    background: transparent;
}
.customer-info-pos .nav-tabs a {
    font-weight: 500;
    font-size: 14px;
    line-height: 0px;
    color: #7E7E7E;
    font-family: 'Roboto-Medium', sans-serif;
}
.customer-info-pos .nav-tabs{
    margin-bottom: 10px;
    display: inline-flex;
}
.customer-info-pos .nav-tabs a {
    text-align: left;
    border: 0px;
    background: transparent;
    padding: 0px;
    margin-right: 40px;
}
.customer-info-pos .nav-tabs {
    border-bottom: 0px solid #dee2e6;
}
table.table.pos-total-table, .pos-customer-table,
.pos-payment-dtl {
    border: 0px;
    padding: 0px;
    margin: 0px;
}
table.table.pos-total-table tr td, table.table.pos-total-table tr th , .pos-customer-table tr td, .pos-customer-table tr th, .pos-payment-dtl tr td{
    padding: 5px;
    border: 0px;
}
table.table.pos-total-table tr th {
    font-size: 12px;
    line-height: 16px;
    color: #849AA9;
    border-bottom: 1px solid #E3E3E3;
}
table.table.pos-total-table tr td {
    font-size: 12px;
    line-height: 16px;
    color: #6B7A99;
}
table.table.pos-total-table tr.catagory-title td {
    font-size: 13px;
    line-height: 16px;
    color: #59A7FF;
    padding-bottom: 5px !important;
    font-family: 'Roboto-Medium', sans-serif;
}
tr.qty-pos {
    border-top: 1px solid #F2F2F2;
    padding-bottom: 0;
    margin-bottom: 10px !important;
}
table.table.pos-total-table tr.qty-pos td {
    color: #494949;
}
.pos-customer-table tr th {
    font-weight: 100;
    font-size: 12px;
    line-height: 16px;
    color: #6B7A99;
    font-family: 'Roboto-Medium', sans-serif;
    padding: 5px;
}
.pos-customer-table tr td{
   font-weight: 600;
   font-size: 12px;
   line-height: 16px;
    font-family: Roboto-Bold;
   color: #43588F;
   padding: 5px;
}
.pos-payment-dtl tr td:last-child{
   text-align: right;
}
.pos-payment-dtl tr td{
   font-weight: 500;
   font-size: 14px;
   line-height: 16px;
   color: #595959;
   font-family: Roboto-Medium;
}
.pos-payment-dtl tr td:not(:last-child){
   font-size: 14px;
   line-height: 16px;
   color: #595959;
   font-family: Roboto-Regular;
}
.pos-payment-dtl 
 tr.total-payment {
    border-top: 1px solid #F1F1F1;
}
.pos-payment-dtl tr.total-payment td {
    padding: 10px 0;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #000000;
    font-family: 'Roboto-Medium', sans-serif;
}
a.payment-btn {
    background: #194DFF;
    border-radius: 10px;
    width: 100%;
    display: block;
    text-align: center;
    padding: 10px;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
    color: #FFFFFF;
    font-family: 'Roboto-Bold', sans-serif;
    letter-spacing: 0px;
}
a.payment-btn:hover {
    background: #123fd9;
}
.pos-slide-menu {
    background: #001355;
    height: calc(100vh - 80px);
    color: #fff;
    padding: 8px 0px;
}
.pos-slide-menu h3 {
    font-size: 12px;
    line-height: 16px;
    text-align: left;
    letter-spacing: 0.01em;
    color: #8EA6C1;
    font-family: 'Roboto-Medium', sans-serif;
        margin: 10px 0;
        padding: 0 20px;
}
.pos-slide-menu a {
    display: block;
    border-radius: 10px;
    margin: 10px 0;
    font-weight: 500;
    font-size: 15px;
    line-height: 16px;
    text-align: center;
    letter-spacing: 0.01em;
    color: #FFFFFF;
    font-family: 'Roboto-Medium', sans-serif;
    padding: 10px;
    width: 100%;
}
.pos-slide-menu {
    position: fixed;
    top: 79px;
    right: 0;
    width: 220px;
    z-index: 999;
}
.pos-side-scroll-btm {
    height: calc(100vh - 460px);
    overflow: overlay;
}
.pos-side-scroll-btm {
  scrollbar-width: thin;
  scrollbar-color: #dddddd #001355;
}
.pos-side-scroll-btm::-webkit-scrollbar {
  width: 2px;
}
.pos-side-scroll-btm::-webkit-scrollbar-track {
  background: #001355;
}
.pos-side-scroll-btm::-webkit-scrollbar-thumb {
  background-color: #dddddd;
  border-radius: 20px;
}
.pos-side-scroll-top, .pos-side-scroll-btm{
   padding: 0 20px;
}
.pos-side-scroll-top {
    margin-bottom: 20px;
}
.pos-slide-menu a:hover {
    background: transparent !important;
    box-shadow: 0 0 5px white;
}
.pos-menu {
    position: fixed;
    top: 0px;
    width: 100%;
    left: 0;
    right: 0;
    /*background: #fff;*/
    background: #001355;
    z-index: 999;
}
.pos-idx {
    padding-top: 81px;
}
/* Popup Box */

/* The Modal (background) */
.modal {
    /*display: none;*/
    display: unset;
    position: fixed;
    z-index: 8888;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
        overflow: auto;
    background-color: rgba(0, 19, 85, 0.58);
    background-color: rgba(0, 19, 85, 0.58); 
}
/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 10vh auto;
    padding: 20px;
    border: 1px solid #888;
    width: 90%;
    
}
.modal{
    opacity: 0;
    -webkit-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    visibility: hidden;
}
.modal-content{
    -webkit-transform: translate(0,-25%);
    -ms-transform: translate(0,-25%);
    -o-transform: translate(0,-25%);
    transform: translate(0,-25%);
    -webkit-transition: -webkit-transform .5s ease-in-out;
    -o-transition: -o-transform .5s ease-in-out;
    transition: -webkit-transform .5s ease-in-out;
    transition: transform .5s ease-in-out;
    transition: transform .5s ease-in-out,
    -webkit-transform .5s ease-in-out,
    -o-transform .5s ease-in-out;
    opacity: 0;
    visibility: hidden;
}
.add-modal .modal-content{
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    -o-transform: translate(0,0);
    transform: translate(0,0);
    opacity: 1;
    visibility: visible;
}
.add-modal{
    opacity: 1;
    visibility: visible;
}
@media (min-width: 1366px) {
  .modal-content {
    background-color: #fefefe;
    margin: 10vh auto;
    padding: 20px;
    border: 1px solid #888;
    width: 30%;
    }
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 23px;
    font-weight: bold;
}
.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

button.button {
    background:none;
  border-top:none;
  border-right:none;
  border-left:none;
  border-bottom:#02274a 1px solid;
  padding:0 0 3px 0;
  font-size:16px;
}
button.button:hover {
  border-bottom:#a99567 1px solid;
  color:#a99567;
}
/*model end*/

textarea{resize: none;}

/*payment model*/
.payment-model .modal-content {
    right: 0px !important;
    top: 0px;
    margin-right: 0;
    margin-top: 0px;
    border-radius: 0px;
    padding: 30px 24px;
    width: 650px;
    height: 100vh;
    background: #fff;
    overflow-y: scroll;
    float:right !important;
}
.payment-model h2 {
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0.03em;
    color: #000000;
    font-family: 'Roboto-Medium', sans-serif;
    margin-bottom: 38px;
}
.payment-model div {
    width: 100%;
    position: relative;
    display: inline-block;
    margin-bottom: 30px;
}
.payment-model div.payment-name {
    display: inline-flex;
    justify-content: space-between;
}
.payment-model div.payment-name > div {
    width: 48%;
    border: 1px solid #D9E5F2;
    border-radius: 5px;
    padding: 8px 10px;
    box-sizing: border-box;
}


/** New CSS Added Starts **/
.payment-model div.payment-name > div, .payment-model div.payment-sale > div {margin-bottom: 0px;}
.payment-model div.payment-gift-card > div {position: relative;display: inline-block;width: auto;margin: 0px;}
.payment-model div.payment-gift-card > div.gift-card-section > div {width: auto;display: inline-block;margin: 0px;}
.payment-model div.payment-gift-card a.ion-ios-close-empty {background: rgba(25, 77, 255, 0.62);border-radius: 5px;color: #fff;line-height: 27px;}
.payment-model div.payment-gift-card  a {font-size: 23px;width: 25px;height: 25px;display: inline-block;text-align: center;vertical-align: middle;margin: 0 0 0 7px;}
.payment-model div.payment-offline > div {margin-bottom: 0px;}
.payment-model div.payment-offline > div > div {margin-bottom: 0px;}
.payment-model div.payment-bycash input {background: transparent;}
.payment-model div.payment-msg textarea {padding: 0px;}
.payment-model .modal-content {left: unset !important; right: 0;}
.offline-card-inner{  margin-bottom: 15px !important;}

table.table.bank-transfer-container {width: 100%;margin: auto;padding: 0px;max-width: unset;box-sizing: border-box;margin-top: 10px;}
table.table.bank-transfer-container tr.row {margin: 0px;vertical-align: middle;display: block;width: 100%;}
table.table.bank-transfer-container tr td {padding: 10px;border-color: #F3F3F3!important;font-size: 12px;line-height: 16px;font-family: 'Roboto-Medium', sans-serif;vertical-align: middle !important;padding: 8px;border-bottom: 1px solid;border-top: 0px;font-size: 12px;line-height: 16px;color: #6B7A99;}
/*table.table.bank-transfer-container tr:last-child td {border: 0px;font-weight: 800;color: #587182;}*/
table.table.bank-transfer-container tr td a.btn.btn-sm.btn-danger {color: #ffff;margin: 0px !important;padding: 4px !important;display: inline-flex;align-items: center;border-radius: 5px;justify-content: center;background-color: #7091ff;}
table.table.bank-transfer-container tr td input {font-size: 12px;background: #F8F8F8;border-radius: 5px;border: 0px;font-size: 13px;line-height: 16px;color: #43588F;padding: 7px 10px; font-family: 'Roboto-Medium', sans-serif;font-weight: 100;font-family: 'Roboto-Medium', sans-serif;}
table.table.bank-transfer-container tr td input::placeholder {color: #43588F;font-family: 'Roboto-Regular', sans-serif;color: #949db8;}
table.table.bank-transfer-container tr td:nth-child(1) {width: calc(100% / 10);max-width: fit-content;}

/** New CSS Added Ends **/

.payment-model div.payment-name > div label, 
.payment-model div.payment-sale > div label, .payment-model div.payment-gift-card label, .payment-model div.payment-acount label,  .payment-model div.payment-msg label {
    font-size: 12px;
    line-height: 16px;
    color: #6B7A99;
    margin-bottom: 10px;
    width: 100%;
}
.payment-model div.payment-name > div p, .payment-model div.payment-sale > div p {
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Bold', sans-serif;
    margin-bottom: 5px;
}
.payment-model div.payment-sale {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
}
.payment-model div.payment-sale > div {
    border-radius: 5px;
    padding: 8px 10px;
    box-sizing: border-box;
    width: calc(100% / 4 - 25px);
    border: 1px solid #D9E5F2;
    border-radius: 5px;
}
.payment-model div.payment-gift-card, .payment-model div.payment-acount, .payment-model div.payment-bycash, .payment-model div.payment-banktrans, .payment-model div.payment-offline,  .payment-model div.payment-msg {
    border: 1px solid #D9E5F2;
    border-radius: 5px;
    padding: 8px 10px;

}
.payment-model div.payment-gift-card > div {
    position: relative;
    display: inline-block;
}
.payment-model div.payment-gift-card > div input {
    width: 200px;
    background: #F8F8F8;
    border-radius: 5px;
    border: 0px;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
    padding: 7px 10px;
    font-family: 'Roboto-Medium', sans-serif;
}
.payment-model div.payment-gift-card > div i {
    position: absolute;
    right: 11px;
    color: #29CC39;
    font-size: 34px;
    top: -8px;
}
.payment-model div.payment-gift-card > a {
    font-size: 23px;
    width: 25px;
    height: 25px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    line-height: 0;
    margin: 0 0 0 7px;
}
.payment-model div.payment-gift-card > a.ion-ios-close-empty {background: rgba(25, 77, 255, 0.62);border-radius: 5px;color: #fff;line-height: 27px;}

.payment-model div.payment-gift-card > a.ion-ios-plus-empty {
    background: rgba(136, 51, 255, 0.59);
    border-radius: 5px;
    color: #fff;
    line-height: 27px;
}
.payment-model div.payment-gift-card > div input::placeholder {
    font-family: 'Roboto-Regular', sans-serif;
    font-size: 12px;
    line-height: 16px;
    color: #6B7A99;
}
.payment-model div.payment-acount p {
    font-weight: 600;
    font-size: 20px;
    line-height: 16px;
    margin-bottom: 10px;
    color: #43588F;
}
.payment-model div.payment-bycash label, .payment-model div.payment-banktrans label, .payment-model div.payment-offline label {
    font-weight: 600;
    font-size: 18px;
    line-height: 16px;
    color: #43588F;
    width: 50%;
    margin-bottom: 0px;
}
.payment-model div.payment-bycash input {
    width: 49%;
    text-align: right;
    border: 0px;
    font-weight: 600;
    font-size: 20px;
    line-height: 16px;
    color: #43588F;
}
.payment-model div.payment-bycash, .payment-model div.payment-banktrans, .payment-model div.payment-offline {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.payment-model div.payment-bycash input::placeholder {
    font-size: 15px;
    line-height: 16px;
    color: #849AA9;
}
.payment-model div.payment-banktrans a, .payment-model div.payment-offline a {
    font-size: 14px;
    line-height: 16px;
    color: #194DFF;
    padding: 5px 0;
    font-family: 'Roboto-Medium', sans-serif;
}
.payment-model div.payment-offline > div {
    justify-content: space-between;
    width: 100%;
    margin-top: 11px;
 /*   display: flex;*/
    align-items: center;
}
/*.payment-model div.payment-offline > div input {
    width: 30%;
}
.payment-model div.payment-offline > div .dropdown.bootstrap-select.form-select {
    width: 30% !important;
}*/
.payment-model div.payment-offline > div .dropdown.bootstrap-select.form-select bs-placeholder, .payment-model div.payment-offline > div input {
    padding: 6px 10px;
    border: 1px solid #D9E5F2;
    border-radius: 5px;
    background: transparent;
    font-size: 14px;
    font-family: 'Roboto-Medium', sans-serif;
    color: #43588F;
    line-height: 0px;
    height: auto;
}


.payment-model div.payment-offline > div input::placeholder {
    font-size: 12px;
    line-height: 16px;
    color: #6B7A99;
    font-family: 'Roboto-Regular', sans-serif;
}
.payment-model div.payment-offline > div a.ion-ios-close-empty {
    background: rgba(25, 77, 255, 0.62);
    border-radius: 5px;
    width: 28px;
    height: 28px;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    font-size: 23px;
    display: inline-block;
}
.payment-model div.payment-offline > div a.ion-ios-close-empty:before {
    line-height: 20px;
}
.payment-offline .bootstrap-select .dropdown-toggle .filter-option {
    background: #ffffff00;
    border: 1px solid #D9E5F2;
    border-radius: 5px;
    font-size: 12px;
    line-height: 22px;
    color: #6B7A99;
    margin: 0px;
}
.payment-model div.payment-msg textarea {
    width: 100%;
    border: 0px;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
    height: 55px;
}
.payment-model div.payment-msg textarea::placeholder {
    font-weight: 300;
    font-size: 12px;
    line-height: 16px;
    color: #849AA9;
    font-family: 'Roboto-Regular', sans-serif;
}
.payment-final-transaction {
    width: 100% !important;
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    border-top: 1px solid #F5F5F5 !important;
    padding: 31px 0 0 !important;
    display: inline-flex !important;
    justify-content: space-between;
}
.payment-final-transaction a#cancle-btn {
    font-weight: 500;
    font-size: 16px;
    line-height: 16px;
    color: #FF5388;
    font-family: 'Roboto-Medium', sans-serif;
    background: #FFEAEE;
    border-radius: 5px;
    display: inline-block;
    align-items: center;
    vertical-align: middle;
    padding: 12px 50px;
    line-height: 24px;
    opacity: 1;
}
.cashup-model form div.payment-final-transaction {
    border-width: 1px 0px 0px 0px;
}
.payment-final-transaction a.complete-transaction {
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.13));
    background: #194DFF;
    border-radius: 5px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    display: inline-block;
    padding: 12px 17px;
}
.payment-model div.payment-gift-card > a.ion-ios-close-empty:hover ,
.payment-model div.payment-offline > div a.ion-ios-close-empty:hover{
    background: #194DFF;
}
.payment-model div.payment-gift-card > a.ion-ios-plus-empty:hover{
    background: #8833FF;
}
.payment-final-transaction a#cancle-btn:hover {
    background: #FF5388;
    color: #fff;
}
.payment-model div .btn-light{
    background: #fff;
        padding: 3px 10px;
}
.payment-model div .bs-searchbox input.form-control {
    width: 100% !important;
}
.payment-model div ul.dropdown-menu.inner.show a.dropdown-item.disabled {
    font-size: 12px;
    line-height: 16px;
    color: #606060;
    padding: 2px 11px;
    font-family: 'Roboto-Regular', sans-serif;
}
.payment-model div .dropdown-toggle::after {
    vertical-align: 2px;
}
*::-webkit-scrollbar {
  width: 4px;
  height: 3px;
}
*::-webkit-scrollbar-track {
  background: #dddddd;
}
*::-webkit-scrollbar-thumb {
  background: #3D67EF;
  border-radius: 20px;
}
.help-menu h2 {
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0.03em;
    color: #000000;
    font-family: 'Roboto-Medium', sans-serif;
    margin-bottom: 35px;
}
.help-menu ul li {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}
.help-menu ul li p {
    font-size: 14px;
    line-height: 16px;
    color: #000000;
    font-family: 'Roboto-Regular', sans-serif;
    margin-bottom: 0px;
}
.help-menu .contact-form > span {
    font-size: 15px;
    line-height: 18px;
    color: #7E7E7E;
    display: block;
    margin-bottom: 18px;
}
.help-menu ul li p span {
    font-size: 12px;
    line-height: 14px;
    color: #000000;
    border: 1px solid #E3E3E3;
    box-sizing: border-box;
    border-radius: 3px;
    padding: 6px;
    min-width: 25px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    margin-left: 5px;
}
.help-menu .modal-content {
    width: 400px;
}
.sales-payment h2 {
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0.03em;
    color: #000000;
    font-family: 'Roboto-Medium', sans-serif;
    margin-bottom: 25px;
}
.sales-payment form > div {
    width: 70%;
    display: inline-flex;
    border: 1px solid #D9E5F2;
    border-radius: 3px;
    justify-content: space-between;
}
.sales-payment form > div input {
    border: 0px;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #43588F;
    font-family: 'Roboto-Regular', sans-serif;
}
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}
.sales-payment form > div input {
    padding: 0px;
}
.sales-payment form > div input {
    padding: 12px 10px;
    color: #43588F;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.03em !important;
}
.sales-payment form > div input:last-child {
    border-left: 1px solid #D9E5F2;
}
.sales-payment form a {
    background: #194DFF;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0.03em;
    color: #FFFFFF;
    font-family: 'Roboto-Bold', sans-serif;
    display: inline-block;
    padding: 12px 30px;
    border-radius: 5px;
    box-sizing: border-box;
    margin-left: 10px;
}
.sales-payment form a i {
    margin-right: 8px;
}
.sales-payment form {
    display: inline-flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 30px;
}
.sales-payment .modal-content {
    width: 600px;
}
.sales-payment form > div > div span {
    position: absolute;
    left: 13px;
    top: 9px;
    bottom: 0;
    color: #6B7A99;
}
.sales-payment form > div > div {
    position: relative;
    width: 50%;
}
.sales-payment ul.sales-dtl {
    width: 100%;
    position: relative;
    display: inline-flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.sales-payment ul.sales-dtl li {
    width: calc(100% / 2 - 10px);
    border: 1px solid #D9E5F2;
    border-radius: 5px;
    margin-bottom: 15px;
    padding: 10px;
}
.sales-payment ul.sales-dtl li span {
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #6B7A99;
    font-family: 'Roboto-Regular', sans-serif;
    margin-bottom: 8px;
    display: block;
    width: 100%;
}
.sales-payment ul.sales-dtl li p {
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
    margin-bottom: 0px;
}
.cashup-model h2 ,
.modal h2{
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0.03em;
    color: #000000;
    font-family: 'Roboto-Medium', sans-serif;
    margin-bottom: 25px;
}
.cashup-model form div {
    border: 1px solid #D9E5F2;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 20px;
}
.cashup-model form div label {
    font-size: 13px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #6B7A99;
    font-family: 'Roboto-Regular', sans-serif;
    display: inline-block;
    margin-bottom: 8px;
    width: 100%;
}
.cashup-model form div input {
    font-size: 14px;
    line-height: 16px;
    width: 100%;
    padding: 0px;
    border: 0px;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
}
.cashup-model form div input::placeholder {
    color: #CACACA;
    font-family: 'Roboto-Regular', sans-serif;
}
/*alert style*/
.alert{
    display: none;
    position: absolute;
    top: 80px;
    z-index: 99999;
    right: 0;
    left: 0;
}
.sell-alt {
    min-width: 441px;
    width: 441px;
    background: linear-gradient(0deg, #8833FF, #8833FF);
    box-shadow: 0px 4px 4px rgb(0 0 0 / 25%);
    border-radius: 3px;
    margin: auto;
    max-width: 100%;
    font-weight: 600;
    font-size: 16px;
    line-height: 28px;
    color: #FFFFFF;
    font-family: 'Roboto-Bold', sans-serif;
}
.sell-alt i {
    color: #01FF1A;
    margin-right: 13px;
}
.alert button {
    color: #FFFFFF;
    opacity: 1;
    font-size: 21px;
}
.alert button:hover {
    color: ghostwhite;
}
.payment-model {
    overflow: hidden;
}
tr.showhide{display:none}
.convert-quotes-model h2 {
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    letter-spacing: 0.03em;
    color: #000000;
    font-family: 'Roboto-Medium', sans-serif;
    margin-bottom: 25px;
}
.convert-quotes-model .modal-content {
    width: 1024px;
}
.data-pagination {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 40px;
}
.data-pagination div {
    width: 50%;
    display: inline-flex;
    align-items: center;
}
.data-pagination div label {
    font-size: 13px;
    line-height: 16px;
    color: #7E7E7E;
    margin: 0px;
    padding: 0px;
}
.data-pagination div label:first-child {
    margin-right: 12px;
}
.data-pagination div label:last-child {
    margin-left: 13px;
}
.data-pagination div select {
    background: #F4F4F4;
    border: 0px;
    padding: 5px 10px;
    width: auto;
    font-size: 13px;
    line-height: 16px;
    color: #4B4B4B;
}
.data-pagination div input {
    width: 170px;
    padding: 4px 10px;
}
.data-pagination div input::placeholder {
    font-size: 12px;
    line-height: 16px;
    color: #A4A4A4;
}
.data-pagination div:last-child {
    justify-content: end;
}
table {
    width: 100%;
}
.sales-table table tr th {
    font-size: 13px;
    line-height: 16px;
    color: #8EA6C1;
    font-family: 'Roboto-Bold', sans-serif;
    letter-spacing: 0.5px;
    padding: 10px 5px;
    font-style: normal;
    white-space: nowrap;
    word-break: keep-all;
}
.sales-table table thead tr {
    border-bottom: 1px solid #D9E5F2;
}
.sales-table table tr td {
    padding: 10px 5px;
    vertical-align: middle;
    white-space: nowrap;
    word-break: keep-all;
}
.sales-table table tr td.sale-dtl {
    text-align: center;
}
.sales-table table tr td.sale-dtl i {
    background: #F4F7FF;
    border-radius: 5px;
    color: #A9BCD4;
    font-size: 19px;
    padding: 0px 8px;
    display: inline-block;
    cursor: pointer;
}
.sales-table table tr td p, .sales-table table tr td{
    font-size: 12px;
    line-height: 16px;
    color: #43588F;
    margin-bottom: 0px;
    font-family: 'Roboto-Medium', sans-serif;
    font-style: normal;
    font-weight: normal;
}
.sales-table table tr td span {
    font-size: 11px;
    line-height: 16px;
    color: #59A7FF;
    font-family: 'Roboto-Regular', sans-serif;
    display: block;
}
.sales-table table > tr > td:last-child {
    text-align: center;
}
.sales-table table tr td a.add-btn {
    background: #194DFF;
    border-radius: 3px;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    color: #FFFFFF;
    font-family: 'Roboto-Medium', sans-serif;
    padding: 6px 20px;
}
.sales-table table tr td a.add-btn:hover {
    background: #00249F;
}
.sales-table table tr td.sale-dtl i.active {
    background: #8833FF;
    color: #fff;
    transition: 0.5s all ease-in-out;
}
.sales-table table tr td.sale-dtl i.active:before {content: '\f3d8';}
.sales-table table tr:not(:last-child) {
    border-bottom: 1px solid #F3F3F3;
}
.sales-table table tr.showhide {
    background: linear-gradient(0deg, #FFFFFF, #FFFFFF);
    box-shadow: 0px 4px 11px rgb(81 120 255 / 13%);
    padding: 15px 0;
}
.sales-table table tr.sale-table:hover {
    background-color: #F9FAFF;
}
.sales-table table tr.showhide table tr {
    text-align: left;
}
.sales-table table tr.showhide > td {
    padding: 15px;
}
.sales-table table tr.showhide > td table tr th {
    font-size: 12px;
    line-height: 16px;
    color: #6B7A99;
    font-family: 'Roboto-Regular', sans-serif;
    font-weight: normal;
}
.sales-table table tr.showhide > td table tr td {
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
}
.sales-table table tr.showhide > td table tr:not(:last-child) {
    border-bottom: 1px solid #F3F3F3;
}
.discount-model .modal-content {
    width: 500px;
}
.discount-model  span {font-style: normal;font-weight: normal;font-size: 13px;line-height: 16px;color: #A9A9A9;display: block;margin-bottom: 20px;}

.discount-model form {
    margin-top: 7px;
    width: 100%;
    position: relative;
}
.discount-model form div {
    border: 1px solid #D9E5F2;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 20px;
}
.discount-model form div label {
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #6B7A99;
    display: block;
    margin-bottom: 5px;
    font-family: 'Roboto-Medium', sans-serif;
}
.discount-model form div label span {
    display: inline-block;
    color: #FF0000;
    margin-bottom: 0px;
}
.discount-model form div input {
    width: 100%;
    padding: 0px;
    border: 0px;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
        font-family: 'Roboto-Bold', sans-serif;
}
.discount-model form div input::placeholder {
    color: #CACACA;
}
div.submit-btn ,
div.submit-btn{
    border-width: 1px 0px 0px 0px !important;
    border-color: #F5F5F5 !important;
    padding: 0px !important;
    border-radius: 0px !important;
}
div.submit-btn a.main-btn ,
div.submit-btn a.main-btn{
    margin-top: 25px;
    display: inline-block;
    background: #194DFF;
    border-radius: 5px;
    color: #ffffff;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    font-family: 'Roboto-Medium', sans-serif;
    padding: 10px 24px;
    text-align: center;
}
/*pos mobile side menu end start*/
.pos-slide-menu span.mob-slide-bar {
    width: 30px;
    display: block;
    height: 30px;
    text-align: center;
    vertical-align: middle;
    border-radius: 5px;
    position: absolute;
    left: -27px;
    background: #001355;
    top: 0px;
    display: none;
}
.pos-slide-menu.new {
    transform: translate3d(0px, 0px, 0px);
}
.pos-slide-menu span.mob-slide-bar {
    transform: rotate(
-90deg);
    width: auto;
    height: auto;
    left: 14px;
    top: 1px;
    top: 54px;
    left: -84px;
    font-size: 15px;
    padding: 5px 22px 5px 37px;
    font-family: 'Roboto-Regular', sans-serif;
}
span.mob-slide-bar.active:before {
    content: "\f404";
    font-family: 'Ionicons';
    font-size: 21px;
    position: absolute;
    left: 17px;
    top: 2px;
}
span.mob-slide-bar:before {
    content: "\f3d0";
    font-family: 'Ionicons';
    font-size: 17px;
    position: absolute;
    left: 15px;
    top: 4px;
}
/*pos mobile side menu end*/
.stock-available-modal .modal-content {
    width: 600px;
}
.stock-available-modal .modal-content form > div {
    /*width: 100%;*/
    margin-bottom: 20px;
}
.stock-available-modal .modal-content form > div label {
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #6B7A99;
    font-family: 'Roboto-Regular', sans-serif;
    margin-bottom: 0px;
}
.stock-available-modal .modal-content form > div .form-check.col {
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
}
.stock-available-modal .modal-content form > div > div > label {
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
}
.stock-available-modal .modal-content form .form-check-input {
    line-height: 0;
    margin-top: 0px;
    cursor: pointer;
}
.stock-available-modal .bootstrap-select > .dropdown-toggle,
.modal-select .dropdown-toggle {
    border: 1px solid #E7E7E8;
    box-sizing: border-box;
    border-radius: 5px;
    font-size: 13px !important;
    line-height: 16px;
    background: #fff;
    padding: 7px 10px;
}
.stock-available-modal .modal-content {width: 800px;}

.stock-available-modal .modal-content form {
    margin-bottom: 40px;
}
.stock-available-modal .modal-content ul {
    border: 1px solid #D9E5F2;
    margin: 0px;
    margin-bottom: 15px;
    border-radius: 5px;
}
.stock-available-modal .modal-content ul li {
    padding: 9px;
    border: 0px;
    border-bottom: 0px;
    font-weight: normal;
    font-size: 12px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Regular', sans-serif;
}
.stock-available-modal .modal-content ul li:not(:first-child) {
    border-left: 1px solid #D9E5F2;
}
.modal-table table tr th {
    border-top: 0px;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 16px;
    color: #8EA6C1;
    padding: 10px 5px;
    border-bottom: 1px solid #D9E5F2;
    font-family: 'Roboto-Medium', sans-serif;
    white-space: nowrap;
    word-break: keep-all;
    vertical-align: middle;
}
.modal-table table tr:last-child {
    border-bottom: 1px solid #F3F3F3;
}
.modal-table table tr td {
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
    padding: 10px 5px;
    border-color: #F3F3F3;
    white-space: nowrap;
    word-break: keep-all;
    vertical-align: middle;
}
.modal-table {
    margin-bottom: 20px;
    width: 100%;
}
.modal-table .table {
    width: 100%;
    overflow-x: auto;
}
.modal-table .table-hover tbody tr:hover {
    background-color: #F9FAFF;
}
.item-code-table > div:first-child {
    width: 100px;
    display: inline-block;
}
.item-code-table div:not(:first-child) {
    width: calc(100% - 100px);
}
.item-code-table {
    display: inline-flex;
    flex-wrap: wrap;
    width: 100%;
}
.item-code-table > div:first-child table tr {
    border-right: 1px solid #D9E5F2;
    border-left: 1px solid #D9E5F2;
}
.item-code-table div:not(:first-child) table tr {
    border-bottom: 1px solid #D9E5F2;
    text-align: center;
}
.item-code-table div:not(:first-child) table td, .item-code-table div:not(:first-child) table th {
    border-right: 1px solid #F3F3F3;
}
.item-code-table div table th {
    border-top: 1px solid #F3F3F3;
    color: #43588F;
    font-family: 'Roboto-Bold', sans-serif;
}
.all-laybyes-modal .modal-content, 
.srch-trans-modal .modal-content,
.recall-modal .modal-content,
.ibt-transfer-modal .modal-content,
.history-view-modal .modal-content {
    width: 1024px;
}
.all-laybyes-modal .modal-table table tr td, .all-laybyes-modal .modal-table table tr th {
    white-space: unset;
    word-break: unset;
}
.pagination-pos div b {
    font-size: 11px;
    margin-right: 8px;
    font-weight: lighter;
    color: #000000;
    margin-left: -5px;
}
.receipt-btn, .gift-receipt-btn, .email-receipt-btn, .a4-receipt-btn {
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    font-family: 'Roboto-Regular', sans-serif;
    text-align: center;
    display: block;
    padding: 8px 10px;
    border-radius: 5px;
    color: #fff;
    border: 1px solid;
}
.mb-20{margin-bottom: 20px !important;}
.mb-50{margin-bottom: 50px !important;}
.receipt-btn {
    background: #194DFF;
    border-color: #194DFF;
}
.receipt-btn:hover {background: #194DFF;color: #fff;}
.gift-receipt-btn {
    background: #8833FF;
    border-color: #8833FF;
}
.gift-receipt-btn:hover{background: #8833FF;color: #fff;}
.a4-receipt-btn {
    background: #33BFFF;
    border-color: #33BFFF;
}
.a4-receipt-btn:hover{background: #33BFFF;color: #fff;}
.email-receipt-btn:hover{background: #F98133;color: #fff;}
.email-receipt-btn {
    background: #F98133;
    border-color: #F98133;
}
.email-receipt-btn i,
.receipt-btn i,
.gift-receipt-btn i,
.a4-receipt-btn i{
    margin-right: 5px;
}
.srch-trans-modal .modal-data-info {
    margin: 0px -7px;
}
.modal-data-info > div {
    border: 1px solid #D9E5F2;
    border-radius: 5px;
    padding: 10px;
    margin: 7px;
    margin-bottom: 10px;
}
.srch-trans-modal .modal-data-info > div {
    width: calc(100% / 3 - 14px);
    max-width: unset;
    flex: unset;
}
.modal-data-info > div span {
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #6B7A99;
    margin-bottom: 8px;
    display: block;
}
.srch-trans-modal .modal-data-info > div span,
.srch-trans-modal .modal-data-info > div p{
    font-size: 12px;
}
.modal-data-info > div p {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
    font-family: 'Roboto-Medium', sans-serif;
    margin-bottom: 0px;
}
.srch-trans-modal .modal-table table tr td span {
    display: inline-block;
    padding: 2px 8px;
    background: #4caf50;
    border-radius: 5px;
    margin-top: 4px;
    font-size: 10px;
    text-align: center;
    width: auto;
    color: #fff;
}
.srch-trans-modal .modal-select .dropdown-toggle {
    color: #001355;
}
.srch-result-dtl {
    background: #F9FAFF;
    border-radius: 5px;
    padding: 10px;
    font-size: 12px;
    font-family: 'Roboto-Regular', sans-serif;
    width: 100%;
    margin: auto;
    line-height: 24px;
}
.srch-result-dtl table th {
    color: #6B7A99;
    font-weight: lighter;
    font-family: 'Roboto-Bold', sans-serif;
    padding: 5px;
}
.srch-result-dtl table td {
    color: #43588F;
    font-family: 'Roboto-Regular', sans-serif;
    padding: 5px;
}
.void-item-modal h3 {
    display: block;
    width: 100%;
    text-align: center;
    padding: 30px 25px;
    color: #000;
    font-size: 20px;
    line-height: 35px;
    padding-top: 20px;
}
.void-item-modal .contact-form {
    text-align: center;
}
.void-item-modal a {
    display: inline-block !important;
    text-align: center !important;
    border-radius: 5px;
    padding: 6px 20px;
    color: #fff;
    font-size: 13px;
    margin: 0 5px;
    min-width: 85px;
}
.void-item-modal a.ok-btn {
    background: #194DFF;
}
.void-item-modal a.close {
    display: inline-block;
    position: relative;
    background: #dddddd;
    color: black;
    float: inherit;
    font-size: 13px;
    line-height: 19px;
    opacity: 1;
    text-shadow: unset;
    font-weight: 500;
    margin: 0 5px;
}
.void-item-modal a.ok-btn {
    background: #194DFF;
}
.void-item-modal .contact-form {
    text-align: center;
    margin-top: 15px;
    margin-bottom: 30px;
}
.void-item-modal .contact-form i {
    font-size: 30px;
    color: #8bc34a;
}
.delete-btn {
    color: #FF5388;
    background: #FFEAEE;
    border-radius: 3px;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    font-family: 'Roboto-Medium', sans-serif;
    padding: 6px 20px;
}
.delete-btn i {
    margin-right: 5px;
}
.select-basic.form-select {
    display: block;
    width: 100%;
    padding: 0.375rem 2.25rem 0.375rem 0.75rem;
    -moz-padding-start: calc(0.75rem - 3px);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
.ibt-transfer-modal label,
.final-prz-sale-modal label {
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 16px;
    color: #6B7A99;
    font-family: 'Roboto-Regular', sans-serif;
    display: block;
}
.select-basic.form-select {
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #7E7E7E;
    font-family: 'Roboto-Regular', sans-serif;
    border: 1px solid #E7E7E8;
    border-radius: 5px;
    padding: 7px 10px;
}
.empty-cell {
    text-align: center;
    color: #a5a5a5 !important;
    letter-spacing: 0.5px;
}
.modal-table textatrea {
    padding: 7px 10px;
}
.modal-table table textarea, .modal-table table input, .ibt-transfer-modal textarea {
    padding: 7px;
    border: 1px solid #E7E7E8;
    box-sizing: border-box;
    border-radius: 5px;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 16px;
    color: #43588F;
    width: 100%;
}

.modal-table table textarea::placeholder, .modal-table table input::placeholder , .ibt-transfer-modal textarea::placeholder{
    font-size: 13px;
    line-height: 16px;
    color: #7E7E7E;
    font-style: normal;
    font-weight: normal;
    font-family: 'Roboto-Regular', sans-serif;
}
.ibt-transfer-modal .modal-table table tr:not(:last-child) td:last-child {
    text-align: center;
}
.ibt-transfer-modal .modal-table table tr:not(:last-child) td:last-child .delete-btn i {
    margin: 0;
    font-size: 13px;
}
.custom-file input, .custom-file label {
    font-size: 13px !important;
    line-height: 16px !important;
    color: #7E7E7E !important;
    font-family: 'Roboto-Regular' !important;
    font-style: normal;
    font-weight: normal;
    padding: 7px 10px;
    height: auto;
}
.custom-file-label::after {
    height: auto;
}
.add-new-customer-modal .modal-content {
    width: 800px;
}
.new-customer-main > div, .new-customer-main > div.blk-2 > div, .new-customer-main > div.blk-25 > div, .new-customer-main > div.show-block > div > div > div {
    border: 1px solid #D9E5F2;
    box-sizing: border-box;
    border-radius: 5px;
    margin-bottom: 15px;
    padding: 5px 10px;
}
a.hide-show:after {
    content: 'show more';
    position: relative;
    text-transform: capitalize;
}
a.hide-show.active:after {
    content: 'show less';
}
a.hide-show.active i:before {
    content: '\f464';
    font-family: 'Ionicons';
}
.new-customer-main > div.blk-2,
.new-customer-main > div.show-block ,
.new-customer-main > div.show-block > div ,
.new-customer-main > div.blk-25 {
    border: 0px;
    padding: 0px;
    margin: 0px;
}
.new-customer-main > div label {
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #6B7A99;
    margin-bottom: 8px;
    display: block;
    font-family: 'Roboto-Medium', sans-serif;
}
.new-customer-main > div input,
.new-customer-main > div textarea{
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    color: #43588F;
    border: 0px;
    padding: 0px;
    font-family: 'Roboto-Bold', sans-serif;
}
.new-customer-main > div input::placeholder ,
.new-customer-main > div textarea::placeholder {
    font-size: 12px;
    line-height: 16px;
    font-family: 'Roboto-Regular', sans-serif;
    color: #6B7A99;
}
.new-customer-main > div .form-check {
    display: inline-block;
}
.new-customer-main > div .form-check {
    font-size: 14px;
    color: #43588F;
    font-family: 'Roboto-Bold', sans-serif;
}
.new-customer-main > div .form-check {
    font-size: 14px;
    color: #43588F;
    font-family: 'Roboto-Bold', sans-serif;
    margin-right: 15px;
}
.blk-2, .blk-25 {
    display: inline-flex;
    width: 100%;
    column-gap: 15px;
}
.blk-2 > div {
    width: calc(100% / 2);
}
.blk-25 > div:first-child {
    width: 100px;
}
.blk-25 > div {
    width: calc(50% - 126px);
    width: 100%;
}
.blk-25 > div:first-child input {
    text-align: center;
    padding: 6px 0;
}
.show-block > div > div {
    width: 100%;
    display: inline-flex;
    flex-wrap: wrap;
    column-gap: 15px;
    margin: 20px 0 0 !important;
}
.show-block > div.show-block-sub {
    display: none;
}
a.hide-show i {
    margin: 0 5px 0 0;
}
.show-block > div.add{
    display: inline-flex;
}
.show-block > div > div > div{
    width: calc(100% / 3 - 10px);
}
.show-block {
    margin-top: 25px !important;
    margin-bottom: 20px !important;
}
a.hide-show {
    font-size: 14px;
    line-height: 16px;
    color: #194DFF;
    font-family: 'Roboto-Medium', sans-serif;
    text-align: right;
    display: flex;
    align-items: end;
    justify-content: end;
}
.show-block .dropdown-menu.show .bs-searchbox input.form-control {
    border: 1px solid #ced4da !important;
    padding: 0.375rem 0.75rem;
}
input[type=checkbox], input[type=radio]{cursor: pointer;}
.new-mail-add {
    display: inline-flex;
    width: 100%;
    padding: 10px !important;
    align-items: center;
    /*flex-wrap: wrap;*/
}
.new-mail-add > div:not(:last-child) {
    width: calc(100% /2 - 60px);
    margin-right: 30px;
}
.new-customer-main button.btn.dropdown-toggle.bs-placeholder.btn-light {
    border: 0px;
    padding: 0;
}
.new-customer-main .btn-light:not(:disabled):not(.disabled).active, 
.new-customer-main .btn-light:not(:disabled):not(.disabled):active, 
.new-customer-main .show>.btn-light.dropdown-toggle {
    background: transparent;
}
.new-mail-add > div > a {
    display: inline-block;
    width: 25px;
    height: 25px;
    background: #FFEAEE;
    text-align: center;
    border-radius: 3px;
    color: #FF5388;
    margin: 0 15px;
}
.cell-add-new {
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 16px;
    color: #194DFF;
    font-family: 'Roboto-Medium', sans-serif;
    float: right;
}
.new-customer-main > .payment-final-transaction {
    border-width: 1px 0px 0px 0px;
}
.customer-dtl-action {
    margin-top: 40px;
    width: 100%;
}
.customer-dtl-action a {
    width: 100%;
    display: block;
    margin: 8px 0;
    font-size: 12px;
    line-height: 16px;
    font-family: 'Roboto-Medium', sans-serif;
    text-align: center;
    padding: 4px;
    border-radius: 5px;
}
.customer-dtl-action a i {
    margin-right: 5px;
}
.edit-dtl-btn {
    color: #595959;
    border: 1px solid #595959;
}
.edit-dtl-btn:hover{
    background: #595959;
    color: #fff;
}
.view-history:hover {
    background: #43588F;
    color: #fff;
}
.view-history {
    color: #43588F;
    border: 1px solid #43588F;
}
.history-view-modal .data-pagination {
    flex-wrap: wrap;
}
.history-view-modal h2 span {
    color: #194DFF;
}
.history-filter {
    width: 100%;
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 30px;
    justify-content: space-between;
}
.history-filter {
    margin: 15px 0 50px;
}
.history-filter select {
    width: auto;
    margin-right: 8px;
}
.history-filter .dropdown.bootstrap-select.form-select.modal-select {
    width: 200px !important;
    margin-right: 8px !important;
}
.history-filter div#date-range {
    position: relative;
    width: auto;
    margin-right: 8px;
}
.history-filter .input-daterange > div {
    position: relative;
}
.history-filter .input-daterange > div span {
    position: absolute;
    top: 5px;
    left: 8px;
    color: #495057;
}
.history-filter .input-daterange input {
    padding: 7px;
    font-size: 12px;
    line-height: 16px;
    border-radius: 3px;
}
.history-filter a.submit-btn {
    color: #fff;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 16px;
    letter-spacing: 0.03em;
    background: #194DFF;
    padding: 8px 10px;
    border-radius: 3px;
    font-family: 'Roboto-Bold', sans-serif;
    margin-right: 8px;
}
.history-filter a.clear-btn {
    color: #fff;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 16px;
    letter-spacing: 0.03em;
    background: #FF5388;
    padding: 8px 10px;
    border-radius: 3px;
    font-family: 'Roboto-Bold', sans-serif;
    margin-right: 8px;
}
p.info {
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 18px;
    color: #7E7E7E;
}
.history-view-modal .dropdown-menu.show {
    width: auto !important;
}
.history-view-modal button.btn.w-100.dropdown-toggle {
    font-size: 12px;
    font-family: 'Roboto-Medium', sans-serif;
    color: #43588F;
}
.history-view-modal .dropdown-menu.show {
    width: auto !important;
    font-size: 12px;
    padding: 4px;
    text-align: center;
}
.history-view-modal .dropdown-item{
    color: #43588F;
}
.pos-bord > div {
    height: calc(100vh - 82px);
    overflow-y: scroll;
}
.delete-btn:hover {
    color: #FFEAEE;
    background: #FF5388;
}


/*dashbord*/
.dashbord-pg {
    margin: 0px!important;
    height: 100vh;
    width: 100vw;
    overflow: hidden;
}
.left-side-pannel {
    color: #fff;
    background: #001355;
    height: 100vh;
    /*overflow-y: scroll;*/
        padding: 0px;
}
.dash-logo {
    width: 100%;
    text-align: center;
}
.mb-70{margin-bottom: 70px;}
.left-side-pannel p {
    font-family: sansationbold;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.01em;
    color: #43588F;
    margin-bottom: 30px;
    padding: 0 40px;
}
.left-side-pannel nav ul li a {
    display: block;
    padding: 10px 15px;
    color: #fff;
    text-decoration: none;
    -webkit-transition: 0.2s linear;
    -moz-transition: 0.2s linear;
    -ms-transition: 0.2s linear;
    -o-transition: 0.2s linear;
    transition: 0.2s linear;
}
.dash-logo {
    display: block;
    padding-top: 40px;
    padding-bottom: 70px;
}
.left-side-pannel nav {
    height: calc(100vh - 200px);
    overflow: auto;
    padding: 0 30px;
}
.left-side-pannel nav ul li, .left-side-pannel nav ul li a {
    display: block;
    position: relative;
    width: 100%;
}
.left-side-pannel nav ul li a i:nth-of-type(2) ,
.menu-header ul li a i:nth-of-type(2) {
    float: right;
    margin-right: 0px;
    position: absolute;
    right: 0;
    top: 12px;
}
.left-side-pannel nav ul li a:hover,
.menu-header ul li a:hover {
    color: #74D3FF;
}
.left-side-pannel nav ul li a, .menu-header ul li a {
    padding: 10px 12px;
    border-radius: 10px;
    display: inline-flex;
    width: 100%;
    align-items: baseline;
}
.left-side-pannel nav ul li > ul > li > a:before ,
.menu-header ul li > ul > li > a:before {
    content: '';
    position: absolute;
    font-size: 5px;
    width: 4px;
    height: 4px;
    background: #fff;
    border-radius: 50%;
    margin-right: 12px;
    top: 15px;
    left: 16px;
}
.left-side-pannel nav ul li > ul > li > a,
.menu-header ul li > ul > li > a {
    font-weight: 500;
    font-size: 13px;
    line-height: 15px;
    letter-spacing: 0.01em;
    color: #FFFFFF;
    font-family: 'Roboto-Medium', sans-serif;
    padding: 10px 12px 10px 30px;
    display: inline-flex;
    justify-content: space-between;
}
.left-side-pannel nav ul li a i,
.menu-header ul li a i {
    margin-right: 11px;
}
.left-side-pannel nav ul li,
.menu-header ul li  {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.01em;
    color: #FFFFFF;
    font-family: 'Roboto-Medium', sans-serif;
}
.left-side-pannel nav ul li a i, .menu-header ul li a i {
    margin-right: 11px;
    font-size: 19px;
    top: 2px;
    position: relative;
    line-height: 0;
}
.left-side-pannel nav ul li > ul,
.menu-header ul li > ul {
    margin: 14px 0;
    background: #001971;
    border-radius: 5px;
    padding: 10px 0px 10px 0px;
    list-style: circle;
    display: none;
}
.left-side-pannel nav ul li > ul > li,
.menu-header ul li > ul > li {
    position: relative;
}
.left-side-pannel nav ul li > ul > li > a span,
.menu-header ul li > ul > li > a span {
    display: inline-block;
    font-weight: 500;
    font-size: 13px;
    line-height: 17px;
    letter-spacing: 0.01em;
    color: #FFFFFF;
    padding: 1px 10px;
    border-radius: 20px;
    margin-left: 5px;
}
.menu-header ul li a {
    padding: 0 5px;
}
.style1{background: #645DF6;}
.style2{background: #F98133;}
.left-side-pannel nav ul li a{    transition: 0.5s all ease-in-out;}
.left-side-pannel nav ul li a.active:not(:only-child),
.menu-header ul li a.active:not(:only-child)  {
    color: #74D3FF;
    /*display: inline-block;*/
    transition: 0.5s all ease-in-out;
}
.left-side-pannel nav ul li a.active:not(:only-child) >i.ion-ios-arrow-forward:before,
.menu-header ul li a .active:not(:only-child) >i.ion-ios-arrow-forward:before{
    /* content: '\f3d0'; */
    transition: 0.5s all ease-in-out;
    transform: rotate(90deg);
}
.ion-ios-arrow-forward:before {
    transform: rotate(0deg);
}
.left-side-pannel > nav > ul > li > a.active,
.menu-header > ul > li > a.active  {
    /*background: rgba(255, 255, 255, 0.26);*/
    /*border-radius: 10px;*/
    color: #77D6FF;
}
.left-side-pannel > nav > ul > li > a.active:before {
    content: '';
    width: 110%;
    position: absolute;
    left: -2%;
    top: 0;
    background: rgba(255, 255, 255, 0.26);
    height: 100%;
    border-radius: 10px;
}
.left-side-pannel > nav > ul > li {
    margin: 10px 0;
}
.right-side-pannel {
    padding: 0px;
    height: 100vh;
    /* background: #F8F8F8; */
}
.header-main {
    padding: 20px 25px;
    background: #fff;
    border-bottom: 1px solid #EDEDED;
}
.header-main > div h1,
.mob-visible h1 {
    font-style: normal;
    font-weight: normal;
    font-size: 25px;
    line-height: 28px;
    color: #000000;
    font-family: sansationregular;
    margin-bottom: 0px;
}
.header-main > div > div > span, .mob-visible span {
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
    color: rgba(0, 0, 0, 0.38);
    display: block;
    margin-top: 10px;
    display: block;
}
.main-info-menu{
    display: inline-flex;
    align-items: center;
    width: 100%;
    justify-content: end;
}
.birthday-btn {
    background: #194DFF;
    border-radius: 12px;
    box-shadow: 1px 1px 25px 0px #0000001c;
    padding: 10px 15px;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #FFFFFF;
    font-family: 'Roboto-Regular', sans-serif;
    position: relative;
    display: block;
}
.birthday-btn i {
    margin-right: 11px;
}
.birthday-btn i.ion-android-calendar:before {
    content: url(../img/cake.png);
}
ul.main-info-menu li:not(:last-child) {
    margin-right: 35px;
}
.sync-btn {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #494949;
    font-family: 'Roboto-Regular', sans-serif;
}
.user-menu {
    display: inline-flex;
    align-items: center;
}
a.user-menu > div {
    width: 30px;
    height: 30px;
    position: relative;
    overflow: hidden;
    margin-right: 18px;
    background: #e6ebf8;
    border-radius: 50%;
}

a.user-menu > div img {width: 100%;height: 100%;}

.user-menu > span {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #000000;
    font-family: 'Roboto-Regular', sans-serif;
    margin-right: 12px;
}
ul.main-info-menu li.sub-menu > ul {
    position: absolute;
    background: #fff;
    border-radius: 5px;
    box-shadow: 1px 1px 25px 0px #0000001c;
    padding: 15px;
    width: 200px;
    right: 0;
    margin-top: 8px;
    display: none;
    z-index: 99;
}
ul.main-info-menu li.sub-menu {
    padding: 12px 0;
}
/*ul.main-info-menu li.sub-menu:hover > ul {
    display: block !important;
}*/
ul.main-info-menu li.sub-menu > ul > li {
    font-size: 14px;
    color: #838383;
    padding: 5px;
    width: 100%;
}
ul.main-info-menu li.sub-menu > ul > li a {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #000000;
    padding: 5px 0;
    display: inline-flex;
    align-items: center;
}
ul.main-info-menu li.sub-menu > ul > li a i {
    margin-right: 10px;
}
ul.main-info-menu li.sub-menu > ul > li a:hover {
    color: #194dff;
}
.birthday-btn:after {
    content: '';
    width: 8px;
    height: 8px;
    background: #FF0000;
    position: absolute;
    border-radius: 50%;
    top: -1px;
    right: -1px;
}
.content-pannel {
    height: calc(100vh - 95px);
    overflow-y: auto;
    position: relative;
    z-index: 1;
}
.breadcrumb-dashbord {
    width: 100%;
    display: inline-flex;
    justify-content: end;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.breadcrumb-dashbord ul {
    display: inline-flex;
    align-items: center;
}
.breadcrumb-dashbord ul li {
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 17px;
    letter-spacing: 0.01em;
    color: #4B4B4B;
    font-family: 'Roboto-Regular', sans-serif;
}
.breadcrumb-dashbord ul li:not(:last-child):after {content: ' | ';position: relative;margin: 0 5px;}
.breadcrumb-dashbord ul li a:hover {
    color: #194dff;
}
.dash-dwn-btn {
    background: #8833FF;
    padding: 10px 22px;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #FFFFFF;
    font-family: 'Roboto-Medium', sans-serif;
    box-shadow: 1px 1px 25px 0px #0000001C;
    border-radius: 10px;
    display: inline-block;
    margin-bottom: 10px;
}

.dash-dwn-btn i {
    margin-right: 10px;
    font-size: 17px;
}
.dash-dwn-btn:hover{
    background: #6314d1;
    color: #fff;
}
a:hover{
    transition: 0.5s all ease-in-out;
}
.birthday-btn:hover{
    background: #052fbf;
    color: #fff;
}
.reports-info h2 {
    font-style: normal;
    font-weight: 600;
    font-size: 25px;
    line-height: 29px;
    color: #000000;
    margin-bottom: 15px;
}
.reports-info {
    border-bottom: 1px solid #0000000A;
    padding: 0;
    margin: 0;
}
.reports-info > div {
    padding: 0px;
}
.dash-reports .nav-fill .nav-item {
    width: auto;
    flex: unset;
    background: transparent;
    border: 0px;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
    color: #7E7E7E;
    text-transform: uppercase;
    margin: 0 15px !important;
    padding: 0px;
}
.dash-reports > div {
    display: inline-flex;
    justify-content: end;
    width: 100%;
    border: 0px;
}
.dash-reports > div > a {
    display: inline-flex;
    align-items: center;
    width: auto;
    float: unset;
    padding: 0 15px;
}
.dash-reports .nav-fill .nav-item:last-child {
    margin-right: 0px !important;
}
.dash-reports .nav-fill .nav-item.active {
    color: #194DFF;
}
.report-dtl2 h2 {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: #494949;
    font-family: 'Roboto-Medium', sans-serif;
    margin-bottom: 15px;
    display: inline-flex;
    align-items: center;
}
.report-dtl2 h2 i {
    width: 18px;
    height: 16px;
    display: inline-block;
    background: #8833FF;
    text-align: center;
    border-radius: 5px;
    color: #fff;
    font-size: 9px;
    margin-right: 9px;
}
.report-dtl-sub > div {
    width: 100%;
    display: inline-flex;
    align-items: baseline;
    box-shadow: 0px 5px 4px 0px #194DFF0F;
    border-radius: 5px;
    background: #ffffff;
    padding: 16px 14px;
    flex-wrap: wrap;
    text-align: center;
}

.report-dtl-sub > div > div {
    width: calc(100% / 2);
}

.report-dtl-sub > div > div:not(:last-child) {
    border-right: 1px solid #00000014;
}

.report-dtl-sub > div h3 {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 16px;
    color: #000000;
    font-family: 'Roboto-Regular', sans-serif;
    margin-bottom: 15px;
    width: 100%;
}

.report-dtl-sub > div p {
    width: 100%;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #7E7E7E;
    font-family: 'Roboto-Regular';
    margin-bottom: 0px;
}

.report-dtl-sub {
    margin-bottom: 40px;
}
/*color code*/
.bg-orange{background: #FF6633 !important;}
.bg-blue{background: #194DFF !important;}
.bg-lightblue{background: #33BFFF !important;}
.bg-purple{background: #8833FF !important;}


.report-dtl1 > div {
    background: #FFFFFF;
    box-shadow: 0px 4px 11px rgb(81 120 255 / 13%);
    border-radius: 8px;
    padding: 17px 25px;
    margin-top: 5px;
}
.report-dtl1 > div h3 {
    font-size: 15px;
    line-height: 16px;
    letter-spacing: 0.03em;
    color: #000000;
    font-family: 'Roboto-Regular';
    display: inline-flex;
    align-items: center;
    margin-bottom: 20px;
}
.report-dtl1 > div h3 span {
    display: inline-block;
    width: 13px;
    height: 13px;
    margin: 0 5px;
}
/*amchart*/
#chartdiv {
  width: 100%;
  height: 200px;
  max-width: 100%;
}
.dashbord-pg:after {
    content: url(../img/bg-wave.svg);
    z-index: -1;
    position: absolute;
    bottom: 0;
    right: 0;
}

.dashbord-main {
    background: #F8F8F8;
}
.dashbord-main {
    background: #F8F8F8;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

.mob-visible{display: none;}

/*************************6 - 10 -2023**************************/
.dash-table tr td b, .dash-table tr td strong, .dash-table tr td {white-space: nowrap;}
table.dataTable.no-footer {margin: unset !important;}
/*.dash-table tr td:first-child {padding: 10px 0px !important;}*/
/*.dash-table tr td:not(:first-child), .dash-table tr th:not(:first-child),.dash-table thead tr:nth-child(2) th {text-align: center;}*/
.pos-slide-menu span.mob-slide-bar{top: 90px;z-index: 999999;}
.all-laybyes-modal .modal-table table tr th {white-space: nowrap; padding-right: 22px;}
select.form-control {font-size: 12px; padding: 8px; height: auto !important;min-height: 30px;}
.search-drop .dropdown-menu.show a {width: 100%; white-space: break-spaces;}
.all-laybyes-modal .modal-table table tr th {white-space: nowrap; word-break: normal;  padding-right: 20px;}
.contact-form form {margin-bottom: 10px;}
/*table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before{margin-top:0px !important;margin-right: 15px;position: relative !important;}*/
/*table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control{align-items: center;display: inline-flex;}*/
/*.dash-form button{padding-left: 35px !important;}*/
table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before { margin: 0px !important;top: 50% !important; transform: translateY(-50%);}
.convert-quotes-model .sales-table table tr th, .sales-table table tr th,.modal-table table tr th,
.dash-table tr th{padding-right: 20px;white-space: nowrap !important;}
.payment-model div.payment-name > div p, .payment-model div.payment-sale > div p { word-break: break-word;}
table.dataTable.no-footer {width: 100% !important;}
.payment-gift-card {position: relative;}
.payment-model div.payment-sale{align-items: unset;}
.payment-model div.payment-gift-card > a { position: absolute; top: 10px;right: 10px;}
.gift-card-input-group {margin: 0px !important;}
#id-products_wrapper tbody tr td:first-child {/*padding-left: 10px;*/ min-width: 50px;}
/*#id-products_wrapper tbody tr td:first-child img { width: calc(100% - 28px) !important;}*/
/*table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control {padding-left: 10px !important;}*/
.btn-default.main-color:hover { background-color: #3240FF;}
.srch-result-dtl table th{white-space: nowrap;}
.payment-model div.payment-gift-card > div.gift-card-section > div:not(:only-child) { margin-bottom: 10px;}
.w-30 { width: 30% !important;}
.w-40 { width: 40% !important;}
.w-65 { width: 65% !important;}
.w-80 { width: 80% !important;}
.dash-modal h2 span, .dtl-modal li p.dtl-data {word-break: break-word;}
.dataTables_wrapper .dataTables_filter input { margin-left: 0px !important;}
.dash-table { width: 100% !important; overflow-x: auto;}
ul.drop-down li a, .drop-custom ul li a{white-space: initial !important;}
.mb-0 { margin-bottom: 0px !important;}
.main-gift-card .form-group {margin-bottom: 0px !important;}
/************7-10-23******************/
table.dataTable>tbody>tr.child ul.dtr-details>li span.dtr-data {max-width: calc(100% - 70px)!important;display: inline-block;white-space: initial;}
table.dataTable>tbody>tr.child ul.dtr-details>li{display: flex;align-items: center;}
.btnOnly { padding: 8px 10px !important;}
div#date-range input#from_date, div#date-range input#to_date { font-size: 13px;}
.just-end{-ms-flex-pack: end!important; justify-content: flex-end!important}
.pagination-pos p{text-align: left;}
.history-filter .input-daterange > div span { top: 10px;}
.add-email-block .form-group .delete-btn{display: inline-block;}
.custom-progress .progress .progress-value{right: -27px !important}
.dash-form div input, .dash-form div textarea, .table-form input, .table-form textarea{min-width: 40px !important;}


@media (max-width: 1100px){
        div#date-range{margin-bottom: 0px;}
        .sales-payment form a { white-space: nowrap;}
        .convert-quotes-model .modal-content {width: 90%;}
}
@media (max-width: 1024px){
    .w-30, .w-65, .w-40, .w-80 {width: 90% !important;}
    .all-laybyes-modal .modal-table table tr td, .all-laybyes-modal .modal-table table tr th{padding-right: 20px;}
    .PrdImgChk{text-align:center;}
    .PrdImgChk a{font-size: unset !important;    text-align: center !important;    display: inline-block;    margin: auto !important;    float: unset !important;}
    .PrdImgChk button {margin-bottom: 20px;}
    .mobTxtLft {text-align: left !important;}
}
@media (max-width: 800px){
    .sales-payment form > div{border:unset;}
    .dataTables_wrapper .dataTables_length select { margin: 0px;}
    .payment-gift-card {margin-top: 10px;}
    #modalx_1176 .px-3 table.table.table-drop.table-hover.responsive {margin-bottom: 0px !important;padding-bottom: 50px !important;}
    #modalx_1176  .col-md-12.outer-block { margin-top: 20px !important;}
    ul.row.dtl-modal.mb-40, ul.row.dtl-modal.mb-40 {margin-bottom: 20px !important;}
    .pos-menu ul li:first-child { white-space: nowrap;}
    a#btn-shutdown, a#btn-logoff, .pos-menu ul li a {font-size: 11px;padding: 0px 0px;}
    .pos-menu ul li:not(:first-child), .pos-menu ul li:first-child {margin-right: 10px;}
    a#btn-logoff:after {display: none;}
    .pos-menu ul li:last-child {display: flex; gap: 10px; align-items: center;}
    .customer-info-pos.dash-tabing {margin-top: 20px;}
    div#modalx_32409 .dash-table.px-3 { margin-bottom: 20px;}
    .mt-40 {margin-top: 20px !important;}
    .mt-30 {margin-top: 15px !important;}


}
@media (max-width: 600px){
    .btn-custom { margin-bottom: 0px !important;}
    .ManagePrdAddTable tbody td { min-width: 258px; vertical-align: baseline;}
    a.btn-custom.steelblue-btn.pull-right { float: unset;}
    .col-md-2.form-group.mb-0.mt-40 { margin-top: 20px !important;}
    .col-md-12.form-group.mb-0.mt-40 { margin-top: 20px !important;}
    .row.custom-row.mb-70.mt-40 {margin-bottom: 40px !important;    margin-top: 20px !important;}
    h2.dash-title {font-size: 17px; display: block;}
    .h3, h3 { font-size: 1rem;}
    .purchase-order-item {gap: 30px;}
    h2.dash-title {font-size: 18px;}
    .mobLeft {right: unset; left: 0;}
    /*Home > Website > Promotions Web*/
    .btn-custom, .drop-main { margin-bottom: 10px !important;}
    .drop-main {text-align: left !important;}
    label.lbl-mob-submit { display: none !important;}
    /*table.dataTable>tbody>tr.child ul.dtr-details>li a.btn-custom.limegreen-btn {margin-bottom: 0px !important;}*/
    .dash-reports > div { gap: 5px; justify-content: space-evenly !important; row-gap: 8px;margin-bottom: 13px;}
    .dash-reports .nav-fill .nav-item { margin: 0px !important;display: block; text-align: start; width: calc(100% / 3 - 4px);}
    div#date-range > div { width: 100% !important;margin-top: 10px !important;margin-bottom: 2px !important;}
    .btn-custom, .drop-main{    white-space: nowrap;}
    .mt-30 {margin-top: 10px !important;}
    .preview-dtl h2 { font-size: 15px;}
    .row.reports-main.py-5 {padding-top: 0px !important;}
    .col-md-12.reports-content.pt-5 { padding-top: 15px !important;}
    .report-dtl1 { margin-bottom: 30px;}
    .report-dtl-sub { margin-bottom: 25px;}
    .pos-prd-table table tr.empty td {font-size: 16px !important; letter-spacing: 1px !important;}
    .payment-model div.payment-bycash label, .payment-model div.payment-banktrans label, .payment-model div.payment-offline label { font-size: 15px;}
    .dash-tabing .nav-tabs a {width: 100%;}
    .add-email-block .form-group .delete-btn{padding: 6px 9px; font-size: 15px;}

}
@media (max-width: 465px){
    .pos-slide-menu, .pos-menu {z-index: 99999999999999;}
    /*.pos-idx { padding-top: 103px;}*/
    .lb-detail-text {padding-top: 0px !important;}
    
}

@media (max-width: 405px){
    .pos-slide-menu {z-index: 9999999999999;}
}
@media (max-width: 400px){
    li.first-btn, li.last-btn {position: unset !important;right: unset;}
}


/*13 Oct 2023*/
 .dark-blue-pagination .btn-group a {background-color: transparent;color:#7E7E7E;border-radius: 0px;font-size: 12px;margin-left: 10px;padding: 0.3em 1em;box-sizing: border-box;display: inline-block;min-width: 1em;font-family: 'Roboto-Regular', sans-serif;}
.dark-blue-pagination .btn-group a.btn-active-page {color: #6B7A99 !important;background: #dae0e5;}
.dark-blue-pagination .btn-group a:hover { background: linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%);box-shadow: inset 0 0 3px #111;color: #ffffff !important;border: 1px solid #F4F4F4;}
.dark-blue-pagination .btn-group{background-color: transparent;border-radius: 0px;gap: 6px;display: inline-flex;flex-wrap: wrap;}
.dash-form > .dark-blue-pagination { margin-bottom: 0px !important;}
@media screen and (max-width: 767px){
    .dark-blue-pagination .btn-group a { padding: 0.1em 0.7em; margin: 0 0 5px 0;}
}
.AccordianMain {display: flex;flex-direction: column;gap: 15px;border: 0px;}
.AccordianMain .card.outer-block {padding: 0px !important;border: 0px;border-radius: 5px !important;overflow: hidden;}
.AccordianMain .card.outer-block .card-header {padding: 0px !important;background-color: #ffffff;border: 0px;}
.AccordianMain .card.outer-block button.btn.btn-link {padding: 0px;font-size: 16px;line-height: 16px;color: #0E293E;font-family: 'Roboto-Regular', sans-serif;margin: 0px;width: 100%;text-align: left;padding: 20px;border: 0px;border-radius: 0px;}
.AccordianMain .card.outer-block button.btn.btn-link.collapsed {border-bottom: 0px;}
.AccordianMain .card.outer-block button.btn.btn-link {border-bottom: 1px solid #D9E5F2;}
.get-detail-by-final-item-code{
  cursor: pointer !important ; 
}