.gradient-45deg-indigo-purple {

    background-image: linear-gradient(220deg, rgba(0, 93.58, 188.11, 1), rgba(0, 48, 135, 1));

    /* background: linear-gradient(30deg, #223670, #003c95) !important; */

    /* background: linear-gradient(30deg, #003c95, #223670) !important; */

}



.sidebar-light .nav-sidebar .nav-item>.nav-link.active {

    /* background-color: #003c95 !important; */

    background-color: #4caf50 !important;

    color: #fff;

}

.sidebar-expand-lg.sidebar-main-resized.sidebar-main-unfold {

  width: 15.75rem !important;

  z-index: 1022;

  box-shadow: 0.25rem 0 1rem rgba(0, 0, 0, 0.35);

}

.sidebar-expand-lg.sidebar-component {

  display: -ms-flexbox;

  display: flex;

  width: 15.75rem !important;

  z-index: 96;

}


::-webkit-scrollbar {

    width: 5px;

    height: 5px;

}



::-webkit-scrollbar-thumb {

    background: linear-gradient(to bottom, #003c95, #223670);

    border-radius: 6px

}





.bg-limitless-blue {

    /* background-color: #003c95 !important; */

    background-color: #005EBC !important;

    color: #fff;

}





.btn-cs-green {

    background-color: #4caf50 !important;

    color: #fff;

}





.checkbox {

    position: relative;

    /* top: -0.375rem; */

    margin: 0 1rem 0 0;

    cursor: pointer;

}



.checkbox:before {

    -webkit-transition: all 0.3s ease-in-out;

    -moz-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

    content: "";

    position: absolute;

    left: 0;

    z-index: 1;

    width: 1rem;

    height: 1rem;

    border: 2px solid #808080;

}



.checkbox:checked:before {

    -webkit-transform: rotate(-45deg);

    -moz-transform: rotate(-45deg);

    -ms-transform: rotate(-45deg);

    -o-transform: rotate(-45deg);

    transform: rotate(-45deg);

    height: .5rem;

    border-color: #f50057;

    border-top-style: none;

    border-right-style: none;

}



.checkbox:after {

    content: "";

    position: absolute;

    top: -0.125rem;

    left: 0;

    width: 1.1rem;

    height: 1.1rem;

    background: #fff;

    cursor: pointer;

}



.navbar-brand {

    display: inline-block;

    padding-top: 0.75rem;

    padding-bottom: 0.75rem;

    padding-left: 1.75rem;

    margin-right: 1.25rem;

    font-size: 0;

    line-height: inherit;

    white-space: nowrap;



}



.navbar {

    position: relative;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -ms-flex-align: center;

    align-items: center;

    -ms-flex-pack: justify;

    justify-content: space-between;

    /* padding: 0 1.25rem; */

}



.navbar-brand img {

    height: 3.15rem;

}



@media only screen and (min-width: 990px) {

    .navbar-brand {

        /* background-color: #fff; */

    }

}





.content-wrapper-before {

    position: absolute;

    z-index: -1;

    /* top: 64px; */

    left: 0;

    width: 100%;

    height: 165px;

    -webkit-transition: .3s ease all;

    transition: .3s ease all;

}





@media (min-width: 576px) {

    .feedback-form {

        /* width: 29rem; */

    }

}





.vertical-modern-dashboard {

    /* margin-top: 28px; */

    margin-top: 8px;

    padding-right: 1rem;

}



#breadcrumbs-wrapper.breadcrumbs-dark .breadcrumbs-title,

#breadcrumbs-wrapper.breadcrumbs-dark a {

    color: rgba(255, 255, 255, .85);

}



#breadcrumbs-wrapper .breadcrumbs-title {

    font-size: 1.4rem;

    line-height: 1.4rem;

}





#breadcrumbs-wrapper .breadcrumbs {

    margin: 10px 0;

    padding: 0;

    list-style: none;

}



.container-cs {

    width: 100%;

    max-width: 100% !important;

    margin: 0 auto;



    padding-right: 0.625rem;

    padding-left: 0.625rem;

    margin-right: auto;

    margin-left: auto;

}





.content-cs {

    padding-left: 1.25rem;

    -ms-flex-positive: 1;

    flex-grow: 1;

}



.iti {

    position: relative;

    display: inline-block;

    width: 100%;

}



/* Off Canvas Modal */



.modal .modal-dialog-aside {

    width: 60%;

    min-width: 55%;

    max-width: 100%;

    height: 100%;

    margin: 0;

    transform: translate(0);

    transition: transform .2s;

}



@media (max-width: 600px) {

    .modal .modal-dialog-aside {

        min-width: 100%;

    }

}



.modal .modal-dialog-aside .modal-content {

    height: inherit;

    border: 0;

    border-radius: 0;

}



.modal .modal-dialog-aside .modal-content .modal-body {

    overflow-y: auto

}



.modal.fixed-left .modal-dialog-aside {

    margin-left: auto;

    transform: translateX(100%);

}



.modal.fixed-right .modal-dialog-aside {

    margin-right: auto;

    transform: translateX(-100%);

}



.modal.show .modal-dialog-aside {

    transform: translateX(0);

}



/* Responsive Stack Table */



.table-responsive-stack tr {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: horizontal;

    -webkit-box-direction: normal;

    -ms-flex-direction: row;

    flex-direction: row;

}





.table-responsive-stack td,

.table-responsive-stack th {

    display: block;

    /*      

    flex-grow | flex-shrink | flex-basis   */

    -ms-flex: 1 1 auto;

    flex: 1 1 auto;

}



.table-responsive-stack .table-responsive-stack-thead {

    font-weight: bold;

}



@media screen and (max-width: 768px) {

    .table-responsive-stack tr {

        -webkit-box-orient: vertical;

        -webkit-box-direction: normal;

        -ms-flex-direction: column;

        flex-direction: column;

        border-bottom: 3px solid #ccc;

        display: block;



    }



    /*  IE9 FIX   */

    .table-responsive-stack td {

        float: left\9;

        width: 100%;

    }

}





.paypalCard {

    background-image: linear-gradient(180deg, rgba(0, 93.58, 188.11, 1), rgba(0, 48, 135, 1));

    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.50);

}



.paypal-blue {

    background-color: #005EBC !important;

}



.CSpasswordInput {

    -webkit-text-security: disc;

    text-security: disc;

}



.CSOverflowHidden {

    overflow: hidden !important;

}



.csViewHeight {

    min-height: 80vh !important;

}



.csCustomBgContainer {

    background-image: url('../../assets/images/home_image_3.jpg') !important;

    background-size: contain;



    background-repeat: no-repeat;

}





.profile-cover-img {

    height: 15.88rem !important;

    background-size: cover !important;

}





.cs_date_text_1 {

    font-size: 1.25rem !important;

    padding: 0.5rem !important;

    margin-top: -15px !important

}



.cs_date_text_2 {



    margin-top: -20px !important

}



.cs_date_text_3 {

    font-size: xx-small;

    margin-top: -20px !important

}



.CSintltelInput {

    /* padding-left: 5rem !important; */

}



.iti__country-list {

    overflow-x: hidden !important;

    max-width: 350px !important;

}






/* New */

.loader {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: inline-block;
    border-top: 3px solid #FFF;
    border-right: 3px solid transparent;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
  }

  .navbar-dark .navbar-nav .nav-link
  {
       color: #fff !important; 
  }
.sidebar {
    width: 15.75rem;
}

.navbar-search .form-control {
    border-radius: 0.24rem;
}

.cs_nav_toggler {
    margin-left: -1.20rem !important;
    margin-top: -2.20rem !important;
    margin-bottom: 0rem !important;
}

.navbar-brand {
    padding-bottom: 0rem !important;
}

.navbar-brand img {
    margin-top: -14px !important;
    height: 2.15rem !important;
}

/* Set the initial height to 100% viewport height */
.ps-sidebar-root {
  
  min-height: 100vh !important;
  overflow-y: auto !important; /* Add vertical scroll if needed */

}
  
.ps-sidebar-container{
  background-color: #FFF !important;
  height: 100% !important;
}

.navbar-static{
  width: 100% !important;
}
  /* Adjust the height only if not in full screen */
  @media screen and (max-height: 100vh) {
    .ps-sidebar-root {
      height: auto;
      overflow-y: hidden; /* Hide vertical scroll */
    }
  }
  @media (max-width: 767px) {
    .page-content {
      overflow: scroll ;
    }
  }
  @media (min-width: 992px){
.navbar-expand-lg .navbar-brand {
    min-width: 10.5rem !important;
}}


.ShowBlock{
  display: block !important;
}

.HideBlock{
  display: none !important;
}

.ps-active {
  background-color: #049204 !important;
  color: #fff;
}

.ps-active:has(> a) > a {
  color: white !important;
}

.ps-menu-label>  a {
  color: black !important;
}

.ps-menu-button {
  color: black !important;
}

.container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.no-shaddow{
  box-shadow: none !important;
}

.ps-submenu-expand-icon{
  color: rgb(185, 185, 185) !important;
}

.table{
  width: 100% !important;
}

.hand-cursor {
  cursor: pointer;
}

div:where(.swal2-icon) .swal2-icon-content {
  display: flex;
  align-items: center;
  font-size: 0.75em !important;
}

.bg-success, .bg-info, .bg-primary, .bg-danger {
  /* background-color: #25b372 !important; */
  color: white !important;
}

.page-item.active .page-link{
  z-index: 3;
    color: #fff;
    /* background-color: #2196F3 !important; */
    background-color: #005EBC !important;
    border-color: #2196F3 !important;
}


.table th, .table td {
  padding: 0.3rem 0.3rem !important;
  vertical-align: top;
  /* border-top: 1px solid #ddd; */
}

.bg-indigo {
  /* background-color: #3F51B5 !important; */
  /* background-image: linear-gradient(220deg, rgba(0, 93.58, 188.11, 1), rgba(0, 48, 135, 1)); */
    /* background: linear-gradient(10deg, #AE275F, #EB1165) !important; pink; */
    /* background: linear-gradient(30deg, #223670, #003c95) !important; */
     background: linear-gradient(30deg, #003c95, #223670) !important;
}

.bg-limitless-blue {
  /* background-color: #003c95 !important; */
  background-color: #005EBC !important;
  color: #fff;
}

.was-validated .form-control:invalid, .form-control.is-invalid {
 
  background-position: right calc(0.39287em + 1.25rem) center !important;
 
}

@media (max-width: 991.98px){
.nav-item-dropdown-lg > .dropdown-menu {
    position: absolute;
    left: auto !important;
    right: 1.25rem !important;
}}

.cs_feedback_route_input{
  padding-left: 1.55rem !important;
 

}

.cs_feedback_route{
 
  padding-top: 3px !important;

}

.sidebar-nav {
  min-height: calc(89vh - 10px) !important; /* Set the height to 80% of viewport height minus 100px */
  /* min-height: 90vh !important; */
}

.sidebar-nav .nav-link.active{
  /* background-color: #049204 !important; */
  background-color: #005EBC  !important;
   /* background-color: #AE275F  !important; pink */
}

.sidebar {
  /* background-color: #fff !important; */
  /* color: #333 !important; */
}

.card-header {
  border-bottom:0 !important
}

.datatable-header {
  border-bottom: 0 !important;
}

::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}
::-webkit-scrollbar-button {
  width: 8px;
  height:5px;
}
::-webkit-scrollbar-track {
  background:#eee;
  border: thin solid lightgray;
  box-shadow: 0px 0px 3px #dfdfdf inset;
  border-radius:10px;
}
::-webkit-scrollbar-thumb {
  background:#999;
  border: thin solid gray;
  border-radius:10px;
}
::-webkit-scrollbar-thumb:hover {
  background:#7d7d7d;
}           

@media (max-width: 767.98px){
  .ColVis, .DTTT_container, .dataTables_filter, .dataTables_info, .dataTables_length, .dataTables_paginate {
    /* float: inline-start !important; */
    margin-left: 0;
    text-align: center;
    display: flex !important;
} 

}


.react-tel-input .form-control {
  width: 100% !important;
}



.cs_gradient-theme-1 {

  /* background-image: linear-gradient(85deg, #2196f3, #25b372); */
  /* background-image: linear-gradient(0deg, #25b372, #25b372); */
  background-image:url('../../assets/images/5322067.jpg');

  
}

.cs_gradient-theme-101 {

  /* background-image: linear-gradient(85deg, #2196f3, #25b372); */
  background-image: linear-gradient(0deg, rgb(0 94 188), rgb(0 94 188)  );
}


.cs_gradient-theme-2 {

  background-image: linear-gradient(220deg, #2196f3, #25b372);
}

.cs_gradient-theme-3 {

  background-image: linear-gradient(220deg, #25b372, #deb);
}

.nav-sidebar .nav-item:not(.nav-item-header):first-child {
    padding-top: 0rem !important; 
}

.breadcrumb-item.active {
    color: #fff !important;
}


  /* Always set the map height explicitly to define the size of the div element that contains the map. */
  #map {
    height: 50dvh;
    width: 100%;
    margin: 20px auto;
  }

  /* Optional: Makes the sample page fill the window. */
  

  #coordInput {
    margin-top: 10px;
  }
  /* HTML marker styles */
.price-tag {
background-color: #f45d42;
border-radius: 8px;
color: #FFFFFF;
font-size: 8px;
padding: 10px 15px;
position: relative;
}

.price-tag::after {
content: "";
position: absolute;
left: 50%;
top: 100%;
transform: translate(-50%, 0);
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #f45d42;
}

.map-text-tag {
  background-color: #4285F4;
  border-radius: 8px;
  color: #FFFFFF;
  font-size: 10px;
  padding: 20px 25px;
  position: relative;
  }
  
  .map-text-tag::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, 0);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #4285F4;
  }

  
.outletImg {
  display: block;
  max-width: 431.25px; /* Increased by 25% from 345px */
  max-height: 365.625px; /* Increased by 25% from 292.5px */
  width: auto;
  height: auto;
  object-fit: cover; /* This will ensure the image covers the entire container */
}

/* Small size */
.chart-small {
  width: 300px !important;
  height: 200px !important;
}

/* Medium size */
.chart-medium {
  width: 400px !important;
  height: 300px !important;
}

/* Large size */
.chart-large {
  width: 600px !important;
  height: 400px !important;
}

/* Extra large size */
.chart-xl {
  width: 800px !important;
  height: 600px !important;
}



.box {
  position: relative;
  max-width: 600px;
  width: 90%;
  height: 400px;
  background: #fff;
  box-shadow: 0 0 15px rgba(0,0,0,.1);
}

/* common */
.ribbon {
  width: 150px;
  height: 150px;
  overflow: hidden;
  position: absolute;
}
.ribbon::before,
.ribbon::after {
  position: absolute;
  z-index: -1;
  content: '';
  display: block;
  border: 5px solid #2980b9;
}
.ribbon span {
  position: absolute;
  display: block;
  width: 225px;
  padding: 15px 0;
  background-color: #3498db;
  box-shadow: 0 5px 10px rgba(0,0,0,.1);
  color: #fff;
  font: 700 18px/1 'Lato', sans-serif;
  text-shadow: 0 1px 1px rgba(0,0,0,.2);
  text-transform: uppercase;
  text-align: center;
}

/* top left*/
.ribbon-top-left {
  top: -10px;
  left: -10px;
}
.ribbon-top-left::before,
.ribbon-top-left::after {
  border-top-color: transparent;
  border-left-color: transparent;
}
.ribbon-top-left::before {
  top: 0;
  right: 0;
}
.ribbon-top-left::after {
  bottom: 0;
  left: 0;
}
.ribbon-top-left span {
  right: -25px;
  top: 30px;
  transform: rotate(-45deg);
}

/* top right*/
.ribbon-top-right {
  top: -10px;
  right: -10px;
}
.ribbon-top-right::before,
.ribbon-top-right::after {
  border-top-color: transparent;
  border-right-color: transparent;
}
.ribbon-top-right::before {
  top: 0;
  left: 0;
}
.ribbon-top-right::after {
  bottom: 0;
  right: 0;
}
.ribbon-top-right span {
  left: -25px;
  top: 30px;
  transform: rotate(45deg);
}

/* bottom left*/
.ribbon-bottom-left {
  bottom: -10px;
  left: -10px;
}
.ribbon-bottom-left::before,
.ribbon-bottom-left::after {
  border-bottom-color: transparent;
  border-left-color: transparent;
}
.ribbon-bottom-left::before {
  bottom: 0;
  right: 0;
}
.ribbon-bottom-left::after {
  top: 0;
  left: 0;
}
.ribbon-bottom-left span {
  right: -25px;
  bottom: 30px;
  transform: rotate(225deg);
}

/* bottom right*/
.ribbon-bottom-right {
  bottom: -10px;
  right: -10px;
}
.ribbon-bottom-right::before,
.ribbon-bottom-right::after {
  border-bottom-color: transparent;
  border-right-color: transparent;
}
.ribbon-bottom-right::before {
  bottom: 0;
  left: 0;
}
.ribbon-bottom-right::after {
  top: 0;
  right: 0;
}
.ribbon-bottom-right span {
  left: -25px;
  bottom: 30px;
  transform: rotate(-225deg);
}

@media only screen and (max-width: 767px) {
  .steps.clearfix {
    display: none;
  }
}


.navbar-brand-img {
  height: 1.75rem !important;
}


.wizard > .steps > ul > li.done .number {
  font-size: 0;
  background-color: #25b372;
  border-color: #25b372;
  color: #fff;
}

.wizard > .steps > ul > li.current .number {
  font-size: 0;
  border-color: #25b372;
  color: #25b372;
}

.wizard > .steps > ul > li:after, .wizard > .steps > ul > li:before {
  content: "";
  display: block;
  position: absolute;
  top: 2.375rem;
  width: 50%;
  height: 2px;
  background-color: #25b372;
  z-index: 9;
}

#cropper-container {
  width: 100%;
  max-width: 600px;
  margin: auto;
}
.min-height-80vh {
  min-height: 80vh !important;
}

.min-height-70vh {
  min-height: 70vh !important;
}

.min-height-60vh {
  min-height: 60vh !important;
}
.min-height-50vh {
  min-height: 50vh !important;
}

.image-4-3 {
  position: relative;
  width: 100%;
  padding-top: 75%; 
}

.image-4-3 img {
  /* position: absolute; */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensure the image covers the entire box */
}

.image-fixed {
  width: 200px; /* Fixed width */
  height: 150px; /* Fixed height */
  object-fit: cover; /* Ensure the image covers the entire box */
}

.thead-pos {
  height: 50px !important; /* Adjust the height as needed */
}

@media print {
  .no-print {
    visibility: hidden !important;
  }
}

.scroll_card_y {
  max-height: 60vh; /* Adjust the height as needed*/
  overflow-y: auto;
  overflow-x: hidden; /* Hide horizontal scrollbar */
}

/* Adjust the overall width of the receipt to fit within 80mm */
.print-receipt {
  width: 80mm;
  margin: 0 auto;
}

/* Style for individual items in the receipt */
.item {
  margin-bottom: 5px; /* Adjust spacing between items */
}

/* Style for item name */
.item-name {
  font-weight: bold;
}

/* Style for item details */
.item-details {
  font-size: 12px; /* Adjust font size for item details */
}

/* Style for total section */
.total-section {
  margin-top: 10px; /* Add some margin between items and total section */
}

/* Style for individual total items */
.total-item {
  display: flex;
  justify-content: space-between;
  margin-bottom: 3px; /* Adjust spacing between total items */
}

/* Style for total item label */
.total-label {
  font-weight: bold;
}

/* Style for total item value */
.total-value {
  font-weight: bold;
}

/* Style for footer section */
.footer {
  margin-top: 10px; /* Add some margin between total section and footer */
}

/* Additional styles as needed */
.pos-container {
  width: 100%; /* Make the container fill the available width */
  max-width: 80mm; /* Set a maximum width to limit expansion */
  /* margin: 0 auto; Center align the container */
  padding: auto;
}

.pos-items {
  width: 100%; /* Make the table fill the container's width */
  border-collapse: collapse;
}

.pos-items th,
.pos-items td {
  padding: 8px;
  text-align: left;
  border-bottom: 1px solid #ddd;
}

.pos-items th {
  background-color: #f2f2f2;
}

.pos-items tr:last-child td {
  border-bottom: none; /* Remove bottom border from the last row */
}

@media print {
  .pos-container {
    width: 100%; /* Make the container fill the available width */
    max-width: 110mm; /* Set a maximum width to limit expansion */
    /* margin: 5 auto; */
    padding: 10px !important;
    padding-right: 10px !important;
  }
  
  .pos-items {
    width: 100%; /* Make the table fill the container's width */
    border-collapse: collapse;
  }
  
  .pos-items th,
  .pos-items td {
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #ddd;
  }
  
  .pos-items th {
    background-color: #f2f2f2;
  }
  
  .pos-items tr:last-child td {
    border-bottom: none; /* Remove bottom border from the last row */
  }
  

}