@charset "UTF-8";
@font-face {
    font-family:'barmeno-medium';
    src:url('../fonts/barmeno-webfont.ttf') format("truetype"),url('../fonts/barmeno-webfont.woff') format('woff');
    font: weight 200px;
    font-style: normal
}
@font-face {
  font-family:'barmeno-bold';
  src:url('../fonts/barmeno-bold-webfont.ttf') format("truetype"),url('../fonts/barmeno-bold-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal
}
body {
    font-family:'barmeno-medium';
    font-size:16px;
    padding:0;
    letter-spacing:0px
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family:'barmeno-bold';
  font-size:18px;
  padding:0;
  letter-spacing:0.5px
}
/* Custom scroll bar start*/
::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
  background-color: #393939 !important;
}

::-webkit-scrollbar-track {
  border-radius: 8px !important;
  background-color: #393939 !important;
}

::-webkit-scrollbar-thumb {
  border-radius: 8px !important;
  background-color: #606060 !important;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #868686 !important;
}

/* Custom scroll bar end*/
/* Border Colour*/
table,
th,
tr,
td,
span,
ul,
li {
  border-color: #edecec !important;
}

.text-primary,
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000000 !important;
}

.bg-info,
.bg-light-blue,
.bg-blue,
.bg-maroon,
.bg-aqua,
.bg-purple,
.bg-yellow,
.bg-red,
.bg-light-green,
.bg-green,
.bg-navy,
.bg-white,
.datepicker table tr td.today,
.datepicker table tr td.selected,
.datepicker table tr td.active,
.daterangepicker td.in-range,
.daterangepicker td.active,
.daterangepicker td.active:hover,
.btn-danger,
.btn-default,
.btn-info,
.btn-primary,
.btn-success,
.btn-warning,
.btn.btn-flat,
.form-group input[type=file],
.buttons-collection,
.buttons-csv,
.buttons-excel,
.buttons-pdf,
.buttons-print,
.tox .tox-button,
.tox .tox-mbtn .bg-info:enabled,
.bg-light-blue:enabled,
.bg-blue:enabled,
.bg-maroon:enabled,
.bg-aqua:enabled,
.bg-purple:enabled,
.bg-yellow:enabled,
.bg-red:enabled,
.bg-light-green:enabled,
.bg-green:enabled,
.bg-navy:enabled,
.bg-white:enabled,
.btn-danger:enabled,
.btn-default:enabled,
.btn-info:disabled,
.btn-primary:enabled,
.btn-success:enabled,
.btn-warning:enabled,
.buttons-collection:enabled,
.buttons-csv:enabled,
.buttons-excel:enabled,
.buttons-pdf:enabled,
.buttons-print:enabled,
.pagination>.enabled>a,
.pagination>.enabled>a:hover,
.tox .tox-button:enabled,
.tox .tox-mbtn:enabled {
  background: #692cf3 !important;
  color: #ffffff !important;
}

.bg-purple,
.datepicker table tr td.selected,
.btn-info,
.btn-default,
.buttons-csv,
.pagination>.active>a {
  background: #692cf3 !important;
  color: #ffffff !important;
}

.bg-purple:active,
.bg-purple:hover,
.btn-info:active,
.btn-info:hover,
.btn-default:active,
.btn-default:hover,
.buttons-csv:active,
.buttons-csv:hover,
.fc-button.hover,
.fc-button:active,
.fc-button:hover,
.fc-unthemed td.fc-today,
.nav-tabs-custom>.nav-tabs>li.active>a,
.nav-tabs-custom>.nav-tabs>li>a:hover,
.pagination>.active>a:hover,
.pagination>li>a:hover,
.select2-container--default .select2-selection--multiple .select2-selection__choice,
.tox .tox-collection--list .tox-collection__item--active,
.tox .tox-collection--toolbar .tox-collection__item--active,
.tox .tox-mbtn--active,
.tox .tox-mbtn:active,
.tox .tox-mbtn:hover,
.tox .tox-tbtn--enabled,
.tox .tox-tbtn--enabled:hover,
.tox .tox-tbtn:hover,
.tox-mbtn .tox-mbtn--select .tox-mbtn--active {
  background: #692cf3 !important;
  box-shadow: #692cf3 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}

.bg-info,
.bg-aqua,
.daterangepicker td.in-range {
  background: #17a2b8 !important;
  color: #ffffff !important;
}

.bg-info:active,
.bg-info:hover,
.bg-auqa:active,
.bg-aqua:hover {
  background: #17a2b8 !important;
  box-shadow: #17a2b8 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}

.add_new_supplier,
.add_new_customer,
.bg-light-green,
.bg-green,
.bg-white,
.btn-success,
.buttons-excel {
  background: #692cf3 !important;
  color: #ffffff !important;
}

.add_new_supplier:active,
.add_new_supplier:hover,
.add_new_customer:active,
.add_new_customer:hover,
.bg-light-green:active,
.bg-light-green:hover,
.bg-green:active,
.bg-green:hover,
.bg-white:active,
.bg-white:hover,
.btn-success:active,
.btn-success:hover,
.buttons-excel:active,
.buttons-excel:hover
{
  background: #692cf3 !important;
  box-shadow: #692cf3 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}

.bg-yellow,
.datepicker table tr td.today,
.btn-warning,
.buttons-print {
  background: #ffc107 !important;
  color: #ffffff !important;
}

.bg-yellow:active,
.bg-yellow:hover,
.btn-warning:active,
.btn-warning:hover,
.buttons-print:active,
.buttons-print:hover {
  background: #ffc107 !important;
  box-shadow: #ffc107 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}

.bg-red,
.btn-danger,
.buttons-pdf,
.modal-footer .btn-default {
  background: #dc3545 !important;
  color: #ffffff !important;
}

.bg-red:active,
.bg-red:hover,
.btn-danger:active,
.btn-danger:hover,
.buttons-pdf:active,
.buttons-pdf:hover,
.modal-footer .btn-default:active,
.modal-footer .btn-default:hover {
  background: #dc3545 !important;
  box-shadow: #dc3545 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}

.bg-navy,
.buttons-collection {
  background: #00cfe8 !important;
  color: #ffffff !important;
}

.bg-navy:active,
.bg-navy:hover,
.buttons-collection:active,
.buttons-collection:hover {
  background: #00cfe8 !important;
  box-shadow: #00cfe8 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}

.bg-light-blue,
.bg-blue,
.datepicker table tr td.active,
.daterangepicker td.active,
.daterangepicker td.active:hover,
.btn-primary,
.form-group input[type=file],
.tox .tox-button {
  background: #692cf3 !important;
  color: #ffffff !important;
}

.bg-light-blue:active,
.bg-light-blue:hover,
.bg-blue:active,
.bg-blue:hover,
.btn-primary:active,
.btn-primary:hover,
.form-group input[type=file]:active,
.form-group input[type=file]:hover,
.tox .tox-button:active,
.tox .tox-button:hover {
  background: #692cf3 !important;
  box-shadow: #692cf3 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}

.bg-maroon {
  background: #d81b60 !important;
  color: #ffffff !important;
}

.bg-maroon:active,
.bg-maroon:hover {
  background: #d81b60 !important;
  box-shadow: #d81b60 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}

.skin-blue-light .main-header {
  background: linear-gradient(180deg, #692cf3be, slateblue) !important;
  transition: background-size 350ms;
  box-shadow: #5e5df0 0 1px 10px 5px !important;
}
.skin-blue-light .text-white {
  color: #000 !important;
}
.skin-blue-light .box-title a {
  color: #fff !important;
}
/** End Custom Css **/

@media (max-width: 767px) {
  .main-header .navbar-custom-menu {
      float: none !important;
      display: block !important;
  }

  .main-header .navbar-custom-menu .dropdown-menu {
      left: auto !important;
  }

  .skin-blue-light .main-header .navbar .dropdown-menu li a {
      color: #777;
  }

  .main-header .navbar {
      height: auto;
  }
}

/**.navbar-default .navbar-nav>li>a {
  color: #fff !important;
}**/
a.navbar-brand {
  color: #000 !important;
}

.bg-danger {
  background-color: #f2dede !important;
}

.btn-big {
  padding: 10px 30px;
  font-size: 18px;
  line-height: 1.3333333;
}

.of-visible {
  overflow: visible !important;
}

#online_indicator {
  font-size: 8px;
  vertical-align: middle;
}

.pt-0 {
  padding-top: 0px;
}

.f-right {
  float: right;
}

.mb-10 {
  margin-bottom: 10px;
}

.discount-badge {
  position: absolute;
  top: 6px;
  right: 10px;
  font-size: 18px;
  padding: 7px;
}

.discount-badge-small {
  position: absolute;
  top: -2px;
  left: 10px;
  font-size: 12px;
  padding: 6px;
}

.product-info-table td,
.product-info-table th {
  font-size: 12px;
}

.catalogue {
  max-height: 127px;
  margin: auto;
  margin-bottom: 18px;
}

.catalogue-title {
  display: inline-block;
  font-size: 18px;
  margin: 0;
  line-height: 1;
  margin-bottom: 10px;
}

.bg-light-gray {
  background-color: #f8f8f8 !important;
}

.p-5-5 {
  padding: 5px 5px !important;
}

.m-4 {
  margin: 4px;
}

.mt-0 {
  margin-top: 0 !important;
}

.table-pdf thead tr {
  background-color: #357ca5 !important;
  color: #fff;
}

.table-pdf thead tr th {
  color: #fff !important;
}

.blue-heading {
  background-color: #357ca5;
  color: #fff;
}

.table-pdf .odd {
  background-color: #DCE6F1;
}

.p-4 {
  padding: 4px;
}

.p-10 {
  padding: 10px !important;
}

.jquery-top-scrollbar {
  height: 6px !important;
}

.jquery-top-scrollbar div {
  height: 6px !important;
}

.scroll-top-bottom {
  width: 100%;
  overflow: scroll;
}

.scroll-top-bottom::-webkit-scrollbar {
  height: 6px;
}

.scrolltop {
  display: none;
  width: 100%;
  margin: 0 auto;
  position: fixed;
  bottom: 20px;
  right: 10px;
}

.scroll {
  position: absolute;
  right: 20px;
  bottom: 20px;
  background: #5d5df042;
  padding: 7px;
  text-align: center;
  margin: 0 0 0 0;
  cursor: pointer;
  -o-transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  border-radius: 6px;
}

.scroll:hover {
  background: #682cf394;
  -o-transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.scroll:hover .fas {
  padding-top: -10px;
}

.scroll .fas {
  font-size: 25px;
  margin-top: -5px;
  margin-left: 1px;
  -o-transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.f-left {
  float: left;
}

.align-left {
  text-align: left;
}

.align-right {
  text-align: right;
}

.table-pdf {
  border-collapse: collapse;
  width: 100%;
  border-spacing: 8px 10px;
}

.td-border td,
.td-border th {
  border-bottom: 1px solid lightgrey;
  padding: 8px 5px;
}

.ws-nowrap {
  white-space: nowrap;
}

.btn-app>.fas,
.btn-app>.fab {
  font-size: 20px;
  display: block;
}

.dropdown-menu>li>a>.fas {
  margin-right: 6px;
}

.mt-5 {
  margin-top: 5px !important;
}

.pos-form-actions {
  height: auto;
  padding-top: 12px;
  padding-bottom: 20px;
  position: fixed;
  bottom: 0px;
  background-color: #D1D5DC;
  width: 100%;
  z-index: 1000;
}

.mb-12 {
  margin-bottom: 12px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.pr-12 {
  padding-right: 12px !important;
}

.main-header .sidebar-toggle:before {
  content: "" !important;
}

.side-bar a {
  /*color: #000;?*/
  background: linear-gradient(0deg, #692cf3be, slateblue) no-repeat right bottom / 0 var(--bg-h);
  transition: background-size 350ms;
  --bg-h: 100%;
  padding: 8px 15px 8px 0px;
}
.side-bar a:where(:hover, :focus-visible) {
  background-size: 100% var(--bg-h);
  background-position-x: left;
  padding: 8px 15px;
  background: #b7b7b9;
  border-radius: 5px;
}
.ui-autocomplete {
  max-height: 300px;
  overflow-y: auto;
  /* prevent horizontal scrollbar */
  overflow-x: hidden;
}

.margin-bottom-20 {
  margin-bottom: 20px !important;
}

.text-white {
  color: #fff;
}

.wizard>.steps>ul>li {
  width: 33.33% !important;
}

.wizard>.content {
  background: #445867 !important;
}

legend {
  color: #fff;
  margin-bottom: 6px;
  border-bottom: none;
}

.left-col {
  background: linear-gradient(150deg, #673de6 5%, rgba(0, 0, 0, 0) 30%), url(../img/home-bg.jpg);
  text-align: center;
  background-size: cover;
  background-position: center;
}

.left-col-content {
  color: #692cf3;
  width: 100%;
}

.login-header {
  font-size: 27px;
  font-weight: 600;
}

.form-header {
  font-size: 18px;
  margin: 16px 0;
  font-weight: 600;
}

.btn-login {
  padding: 6px 40px !important;
}

/* Home, Login & Register Background  */
.right-col {
  background: linear-gradient(-150deg, #692cf3 20%, rgba(0, 0, 0, 0) 70%), url('../uploads/account.jpg');
  background-size: cover;
  background-position: center;
  height: 100%;
  min-height: 100vh;
  color: #692cf3;
}

.right-col label {
  color: #ae8bfe;
}

.right-col a,
.text-white a {
  /*color: #fff;*/
  font-weight: 600;
  font-size: 15px
}

.right-col a:hover,
.text-white a:hover {
  color: #692cf3;
}

.right-col-content {
  padding: 10% 16%;
  padding-bottom: 3%;
}

.right-col-content-register {
  padding: 2% 8%;
}

.input[type=text] {
  padding:10px;
  border:0;
  box-shadow:0 0 25px 5px #692cf3(0,0,0,0.6);
}

.input_inline {
  width: 100%;
  display: inline-flex;
}

.input_inline input,
.input_inline span {
  width: 50%;
}

.img-thumbnail {
  position: relative;
  width: 70px;
  height: 70px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 2px;
  transition: border .2s ease-in-out;
  padding: 4px;
  margin: 3px;
  text-align: center;
}

.img-thumbnail>.badge {
  position: absolute;
  top: -5px;
  right: -7px;
  font-size: 9px;
  font-weight: 400;
  cursor: pointer;
}

.navbar-nav>.notifications-menu>.dropdown-menu>li .menu {
  max-height: 350px;
}

.bg-aqua-lite {
  background-color: #7FFFD4;
}

.navbar-nav>.notifications-menu>.dropdown-menu>li .menu>li>a {
  white-space: normal;
}

.spacer {
  margin-top: 20px;
}

#product_list_body {
  max-height: 485px;
  overflow-y: scroll;
  overflow-x: hidden;
}

.div-overlay {
  cursor: not-allowed;
  background: #e9e9e9;
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.5;
}

.d-inline-table {
  display: inline-table;
}

.label-round {
  font-size: 8px;
  border-radius: 44%;
}

.table>tbody+tbody {
  border-top: 0;
}

.table-pl-12 td,
.table-pl-12 th {
  padding-left: 12px !important;
}

table tbody td.pl-20-td {
  padding-left: 20px !important;
}

table.table-border-center>tbody>tr>td:first-child,
table.table-border-center>thead>tr>th:first-child,
table.table-border-center>tfoot>tr>td:first-child {
  border-right: 1px solid darkgray;
}

table.table-border-center-col>tbody>tr>td:nth-child(2),
table.table-border-center-col>thead>tr>th:nth-child(2),
table.table-border-center-col>tfoot>tr>td:nth-child(2) {
  border-right: 1px solid darkgray;
  border-left: 1px solid darkgray;
}

.bg-transparent {
  background-color: transparent !important;
}

.mb-0 {
  margin-bottom: 0;
}

.nav-tabs>li>a {
  font-size: 18px;
  font-weight: 600;
}

.table-transparent,
.table-transparent th {
  background-color: transparent !important;
  color: #000 !important;
}

.td-full-width {
  white-space: nowrap;
}

.font-17 {
  font-size: 17px !important;
}

table.dataTable tbody>tr.selected {
  background-color: #B0BED9;
}

tr.footer-total>td {
  vertical-align: middle !important;
}

.error {
  color: red !important;
}

/*  pos tab */
div.pos-tab-container {
  z-index: 10;
  background-color: #ffffff;
  padding: 0 !important;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #692cf3;
  margin-bottom: 28px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  background-clip: padding-box;
}

div.pos-tab-menu {
  padding-right: 0;
  padding-left: 0;
  padding-bottom: 0;
}

div.pos-tab-menu div.list-group {
  margin-bottom: 0;
}

div.pos-tab-menu div.list-group>a {
  margin-bottom: 0;
}

div.pos-tab-menu div.list-group>a:first-child {
  -moz-border-top-right-radius: 0;
  border-top-right-radius: 0;
}

div.pos-tab-menu div.list-group>a:last-child {
  -moz-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

div.pos-tab-menu div.list-group>a.active,
div.pos-tab-menu div.list-group>a.active .glyphicon,
div.pos-tab-menu div.list-group>a.active .fa {
  background-color: #3c8dbc;
  color: #ffffff;
  border-color: #3c8dbc;
}

div.pos-tab-menu div.list-group>a.active:after {
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  margin-top: -13px;
  border-left: 0;
  border-bottom: 13px solid transparent;
  border-top: 13px solid transparent;
  border-left: 10px solid #3c8dbc;
}

div.pos-tab-content {
  background-color: #ffffff;
  /* border: 1px solid #eeeeee; */
  padding-left: 20px;
  padding-top: 20px;
}

div.pos-tab div.pos-tab-content:not(.active) {
  display: none;
}

.add-product-price-table th {
  background-color: #5cb85c;
  color: white;
}

.blue-header th {
  background-color: #3c8dbc;
  color: white;
}

.table-th-green th {
  background-color: #5cb85c;
  color: white;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
}

.active-cell {
  border: 2px dotted #3c8dbc !important;
}

.cursor-pointer {
  cursor: pointer !important;
}

.pos_product_div {
  min-height: 47vh;
  max-height: 57vh;
  overflow-y: auto;
  margin-bottom: 20px;
}

.bg-lightgray {
  background-color: #F0EDED !important;
}

.balance_due_box>li {
  padding: 11px 5px 0px 5px;
}


.margin-left-10 {
  margin-left: 10px;
}

.margin-bottom-12 {
  margin-bottom: 12px;
}

.bg-info {
  background-color: #00c0ef !important;
}

.bg-info>a {
  color: #FFFFFF !important;
}

.bg-info>a:hover {
  background-color: #337ab7 !important;
}

ul.dt-button-collection {
  background-color: #00c0ef;
}

td.details-control {
  background: url('/img/details_open.png') no-repeat center center;
  cursor: pointer;
}

tr.details td.details-control {
  background: url('/img/details_close.png') no-repeat center center;
}

.icheckbox_square-blue,
.iradio_square-blue {
  margin-right: 10px;
}

.header-right-div {
  right: 10px;
  float: right;
  position: absolute;
  top: 15px;
}

.header-left-div {
  margin-top: 15px;
  display: inline-flex;
}

.m-8 {
  margin: 8px;
}

.mt-10 {
  margin-top: 10px;
}

.mt-15 {
  margin-top: 15px;
}

.m-5 {
  margin: 5px;
}

.icon-link {
  text-align: center;
  display: block;
  margin-bottom: 18px;
}

.icon-link>a {
  display: grid;
}

.icon-link>.badge {
  position: absolute;
  top: 20px;
  right: 67px;
}

.link-des {
  display: inline-block;
  text-align: left;
}

.navbar-nav>.user-menu>.dropdown-menu>li.user-header>img {
  border: none;
  height: auto;
  width: 100%;
  max-height: 120px;
}

.bg-light-green {
  background-color: #98D973 !important;
  color: #fff !important
}

.hover-q {
  font-size: 16px;
  margin-left: 3px;
  cursor: help;
}

.input-group-addon .hover-q {
  margin-left: 0px;
}

.text-bold {
  font-weight: bold;
}

.tour .popover-content {
  padding: 18px 14px;
}

.table-slim>tbody>tr>td,
.table-slim>tbody>tr>th,
.table-slim>tfoot>tr>td,
.table-slim>tfoot>tr>th,
.table-slim>thead>tr>td,
.table-slim>thead>tr>th {
  padding: 1px;
}

/* Custom scroll bar start*/

/* width */
::-webkit-scrollbar {
  width: 7px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* Custom scroll bar end*/

.product_cell {
  height: 100px;
  padding: 1%;
}

.product_cell_div {
  height: 100% !important;
  width: 100% !important;
  text-align: center;
  vertical-align: middle;
  padding-top: 5px;
  cursor: pointer;
  overflow: hidden;
}

/*CSS to print receipts*/
.print_section {
  display: none;
}

@media print {
  .print_section {
      display: inline !important;
  }

  .modal-xl {
      width: 100% !important;
  }

  ::-webkit-scrollbar {
      display: none !important;
  }

  #toast-container {
      display: none;
  }
}

.input-number .btn-default {
  background-color: white;
  padding: 6px 9px;
}

.width-50 {
  width: 50% !important;
}

.width-40 {
  width: 40% !important;
}

.width-60 {
  width: 60% !important;
}

.width-100 {
  width: 100% !important;
}

.font-30 {
  font-size: 30px !important;
}

.font-23 {
  font-size: 23px !important;
}

.padding-5 {
  padding: 5px !important;
}

.padding-10 {
  padding: 10px !important;
}
/*
.padding-side-15 {
  /*padding-left: 15px !important;
  padding-right: 15px !important;
}
*/
.text-muted-imp {
  color: #A3A3A3 !important;
}

.table-no-top-cell-border td {
  border-top: 0px !important;
  border-bottom: 0px !important;
}

.table-no-top-cell-border th {
  border-top: 0px !important;
  border-bottom: 0px !important;
}

.table-no-side-cell-border td {
  border-left: 0px !important;
  border-right: 0px !important;
}

.table-no-side-cell-border th {
  border-left: 0px !important;
  border-right: 0px !important;
}

.color-555 {
  color: #555555 !important;
}

.color-555 * {
  color: #555555 !important;
}

.color-white {
  color: white !important;
}

.col-no-padding {
  padding-left: 0px;
  padding-right: 0px;
}

.col-2px-padding {
  padding: 2px;
}

.pos-express-btn {
  font-size: 23px !important;
  overflow: hidden !important;
  height: 73px !important;
  white-space: normal;
}

.word-wrap {
  word-wrap: break-word !important;
}

.modal-xl {
  width: 90%;
  /* respsonsive width */
  margin-left: auto !important;
  margin-right: auto !important;
}

table.ajax_view tbody tr {
  cursor: pointer;
}

.bg-white {
  background-color: #fff;
}

.product-thumbnail-small {
  height: 50px;
  width: 50px;
}

table.table-text-center td,
table.table-text-center th {
  vertical-align: middle !important;
}

.product_list {
  padding-left: 8px;
  padding-right: 8px;
}

.product_box {
  width: 100%;
  /*padding-top: 5px;
padding-bottom: 2px;*/
  margin-bottom: 10px;
  text-align: center;
  cursor: pointer;
  /*border: 1px solid darkgray;*/
  font-weight: 600;
  background-color: #fff;
  border-radius: 2px;
  padding-top: 3px;
}

.product_box .image-container {
  /*width: 95%;*/
  height: 55px;
  margin: auto;
  /*padding-top: 5px;*/

}

.product_box .image-container img {
  height: 45px;
  /*width: 45px*/
}

.eq-height-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
}

.eq-height-col {
  display: flex;
}

.product_box .text_div {
  margin-top: 3px;
}

.product_box .text {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  /* number of lines to show */
  line-height: 14px;
  /* fallback */
  max-height: 14px;
  /* fallback */
}

.small-box.bg-gray:hover {
  color: #000;
  text-decoration: none;
}

#calendar table tbody td {
  cursor: pointer;
}

.min-height-90hv {
  min-height: 90vh !important;
}

/* Grow Shadow */
.hvr-grow-shadow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: box-shadow, transform;
  transition-property: box-shadow, transform;
}

.hvr-grow-shadow:hover,
.hvr-grow-shadow:focus,
.hvr-grow-shadow:active {
  box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.text-link {
  cursor: pointer;
}

.text-link:hover {
  text-decoration: underline;
}

.v-center {
  vertical-align: middle !important;
}

/*.box, .info-box, .nav-tabs-custom, .external-event{
box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2) !important;
}*/

.user_avatar {
  border-radius: 50%;
  width: 25px;
  height: 25px;
  margin: 1px;
}

.fs-10 {
  font-size: 10px;
}

.timeline-lode-more-btn {
  margin-left: 50px;
  margin-top: 25px;
  padding-right: 12px;
  padding-left: 12px;
}

.pa-0 {
  padding: 0px !important;
}

.mt-56 {
  margin-top: 56px !important;
}

.m-2 {
  margin: 2px !important;
}

.treeview-menu i {
  display: inline-block !important;
  padding-left: 5px !important;
  font-size: 95% !important;
}

.treeview-menu a{
padding-left: -5px !important;
font-size: 95% !important;
}

/* For Remove Icon in Tree View */
/*
.treeview-menu a::before{
content: "\2192 ";
}
*/


@media only screen and (max-width: 600px) {
  .pos-form-actions {
      position: absolute;
  }
}

.mr-8 {
  margin-right: 8px !important;
}

@media (max-width: 1024px) {
  .pos_form_totals {
      margin-bottom: 40px;
  }
}

.swal-modal .swal-text {
  text-align: center;
}

.pos-total {
  display: inline-block;
  padding: 8px 10px;
  vertical-align: middle;
  margin-left: 5px;
  margin-right: 5px;
}

.pos-total span.number {
  font-size: 26px;
  vertical-align: middle;
  font-weight: bolder;
}

.pos-total span.text {
  font-weight: bolder;
  display: inline-block;
  width: 60px;
  vertical-align: middle;
}

.mb-40 {
  margin-bottom: 40px !important;
}

@media print {
  a:after {
      content: '';
  }

  a[href]:after {
      content: none !important;
  }
}


/* Box Header */
.box-header>.box-title {
  color: #007bff;
}

.box-header .box-title,
.box-header>.fa,
.box-header>.glyphicon,
.box-header>.ion {
  display: inline-block;
  font-size: 14px;
  margin: 0;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 700;
}

/* Box Header */
/* 
.box-header {
color: #444;
display: block;
padding: 10px;
position: relative;
background-color: #4784ff;
}

.box.box-primary {
border-top-color: #f9fafc;
}

.btn {
border-radius: 3px;
-webkit-box-shadow: none;
box-shadow: none;
border: 1px solid #6158589e !important;
background-color: #ddd0;
color:#333;
}

.btn-primary {
border-radius: 3px;
-webkit-box-shadow: none;
box-shadow: none;
border: 1px solid #6158589e !important;
background-color: #ddd0;
color:#333;
}

.btn-primary:hover {
background: #dadada;
border-color: #115bb9;
color: #333;
}

.btn-info.active, .btn-info:active, .open>.dropdown-toggle.btn-info {
color: #fff;
background-color: #000000;
border-color: #269abc;
}

.btn-info:hover {
background: #d6d5d5;
border-color: #0da5c0;
color: #333;
}
*/
.btn-info.active.focus,
.btn-info.active:focus,
.btn-info.active:hover,
.btn-info:active.focus,
.btn-info:active:focus,
.btn-info:active:hover,
.open>.dropdown-toggle.btn-info.focus,
.open>.dropdown-toggle.btn-info:focus,
.open>.dropdown-toggle.btn-info:hover {
  color: #fff;
  background-color: #000000;

}

/* Main Header */
.content-header>h1 {
  margin: 0;
  font-size: 15px;
  border: 1px solid #ddd;
  padding: 13px 10px;
  background-color: #692cf3;
  text-transform: uppercase;
  color: white;
  font-weight: 700;
  /* text-align: center; */
  border-radius: 6px;
}


/* .thetop{
padding: 1%;
}
*/
.pos_sale_header {
  padding: 0.6%;
  background-color: white;
  border-radius: 5px;
  margin-bottom: 1.3%;
}

.bg-green {
  background-color: #000000 !important;
}

tr.bg-white {
  background: #000000;
  color: white;
}

.thumbnail {
  display: block;
  padding: 4px;
  margin-bottom: 20px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  margin-left: 5px;
  margin-top: 5px;
  -webkit-transition: border .2s ease-in-out;
  -o-transition: border .2s ease-in-out;
  transition: border .2s ease-in-out;
}


.btn[class*=bg-]:hover {
  color: #ffff !important;
}


/* table#purchase_entry_table {
background: rgba(0,51,92,1);
} */

table#purchase_entry_table {
  background: grey;
}

#purchase_entry_table>tbody>tr>th,
#purchase_entry_table>tfoot>tr>th,
#purchase_entry_table>thead>tr>th {
  color: white;
}


.navbar-custom-menu>.btn-flat {
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border-width: 1px;
  border: 1px solid white !important;
  color: white;
}
/*strat skin Default*/
.skin-blue-light .side-bar a {
  color: #000;
}
.skin-blue-light .box-header
{
  background: linear-gradient(to top, #682cf3b3 3%, #c471f5 100%) !important;
}
.skin-blue-light .main-header .navbar,
.skin-blue .main-header .navbar,
.skin-blue-light .main-header .logo,
.skin-blue-light .right-side
{
  background: linear-gradient(-360deg, #682cf3b3 3%, #c471f5 100%) !important;
}

.skin-blue-light .box-header,
.skin-blue-light .form-group,
.skin-blue-light .select2-selection__choice,
.skin-blue-light .input-number,
.skin-blue-light .select2-dropdown,
.skin-blue-light .dropdown-menu,
.skin-blue-light .input-group,
.skin-blue-light .tox .tox-menu,
.skin-blue-light .tox-edit-area,
.skin-blue-light .alert-warning,
.skin-blue-light .box,
.skin-blue-light .box-body,
.skin-blue-light .box-footer,
.skin-blue-light .datepicker,
.skin-blue-light .even,
.skin-blue-light .modal-body,
.skin-blue-light .modal-footer,
.skin-blue-light .well {
  border-color: #692cf3 !important;
}

.skin-blue-light .user-header,
.skin-blue-light .user-footer,
.skin-blue-light .user-body
{
  background: #eae0ff !important;
  color: #000000 !important;
}

.skin-blue-light .info-box {
  color: #000000 !important;
}
.skin-blue-light .content {
  min-height: 250px;
  padding: 15px;
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
}
/*.skin-blue-light a,
.skin-blue-light a:active,
.skin-blue-light a:focus,
.skin-blue-light a:hover {
  color: #000000;
}
.skin-blue-light .dropdown-toggle {
  color: #ffffff !important;
}*/

.skin-blue-light .main-header .navbar .sidebar-toggle {
  background: transparent !important;
}

.skin-blue-light .content-wrapper {
  background: #eae1ff;
  padding: 15px 15px 200px;
}
.skin-blue .content-wrapper .content-header-custom,
.skin-blue-light .content-wrapper .content-header-custom {
  background: #eae0ff;
  color: #fff !important;
  padding: 15px 15px 200px;
}

.skin-blue-light div.pos-tab-menu div.list-group>a.active,
.skin-blue-light div.pos-tab-menu div.list-group>a.active .glyphicon,
.skin-blue-light div.pos-tab-menu div.list-group>a.active {
  background-color: #682cf3be;
  color: #ffffff;
  border-color: #682cf3be;
}

.skin-blue-light div.pos-tab-menu div.list-group>a.active:after {
  border-left: 10px solid #682cf3be;
}

.skin-blue-light .side-bar,
.skin-green-light .side-bar,
.skin-red-light .side-bar, 
.skin-yellow-light .side-bar {
  background: -moz-linear-gradient(-360deg, rgba(104, 44, 243, 0.702) 33%, rgba(104, 44, 243, 1) 100%) !important;
  background: -webkit-linear-gradient(-360deg, rgba(104, 44, 243, 0.702) 33%, rgba(104, 44, 243, 1) 100%) !important;
  width: 240px;
}

.skin-blue-light .sidebar-menu>li>a {
  color: rgb(0, 0, 0);
  transition: 0.4s;
}


.skin-blue-light .sidebar-menu>li.menu-open>a,
.skin-blue-light .sidebar-menu>li:hover>a,
.skin-yellow-light .sidebar-menu>li:hover>a {
  background: linear-gradient(to left, #c471f5 3%, #682cf3b3 100%) !important;
  color: rgb(255, 255, 255);
  width: 240px;
}

.skin-blue-light .sidebar-menu>li>.treeview-menu {
  background: linear-gradient(to left, #753ff4 3%, #c471f5 100%) !important;
  width: 240px;
}

.skin-blue-light .sidebar-menu .treeview-menu>li.active>a {
  font-weight: 300;
  color: #000000;
}

.skin-blue-light .sidebar-menu .treeview-menu>li.active>a,
.skin-blue-light .sidebar-menu .treeview-menu>li>a:hover {
  color: rgb(255, 255, 255);
}

.skin-blue-light .sidebar-menu .treeview-menu>li>a {
  color: rgb(0, 0, 0);
}

.skin-blue-light .sidebar-menu>li.active {
  border-left-color: rgb(255, 255, 255);
}
/*end default skin*/

/*Start dark skin*/
.skin-black h1,
.skin-black h2,
.skin-black h3,
.skin-black h4,
.skin-black strong,
.skin-black b,
.skin-black a.navbar-brand,
.skin-black .tw-text-gray-500,
.skin-black .tw-text-gray-900 {
  color: #ffffff !important;
}
.skin-black .tw-bg-gray-200 {
  background-color: #939393 !important;
}
.skin-black .tw-flex.thetop,
.skin-black .tw-px-5,
.skin-black .tw-py-3,
.skin-black .tw-flex-1,
.skin-black .tw-overflow-y-auto,
.skin-black .tw-h-screen,
.skin-black .tw-p-2,
.skin-black .tw-bg-white,
.skin-black .\!tw-bg-white,
.skin-black .tw-bg-gray-50,
.skin-black .content,
.skin-black .content-wrapper,
.skin-black .main-footer,
.skin-black .odd,
.skin-black .tox-menubar,
.skin-black .tox-sidebar-wrap,
.skin-black .tox-statusbar,
.skin-black .tox-toolbar-overlord,
.skin-black .tox-toolbar__primary,
.skin-black .wrapper {
  background: #141b2e !important;
  color: #d0d2d6 !important;
}
.skin-black input {
    background: #ffffff;
}
.skin-black .bg-info:enabled,
.skin-black .bg-light-blue:enabled,
.skin-black .bg-blue:enabled,
.skin-black .bg-maroon:enabled,
.skin-black .bg-aqua:enabled,
.skin-black .bg-purple:enabled,
.skin-black .bg-yellow:enabled,
.skin-black .bg-red:enabled,
.skin-black .bg-light-green:enabled,
.skin-black .bg-green:enabled,
.skin-black .bg-navy:enabled,
.skin-black .bg-white:enabled,
.skin-black .btn-danger:enabled,
.skin-black .btn-default:enabled,
.skin-black .btn-info:disabled,
.skin-black .btn-primary:enabled,
.skin-black .btn-success:enabled,
.skin-black .btn-warning:enabled,
.skin-black .buttons-collection:enabled,
.skin-black .buttons-csv:enabled,
.skin-black .buttons-excel:enabled,
.skin-black .buttons-pdf:enabled,
.skin-black .buttons-print:enabled,
.skin-black .pagination > .enabled > a,
.skin-black .pagination > .enabled > a:hover,
.skin-black .tox .tox-button:enabled,
.skin-black .tox .tox-mbtn:enabled {
  background: #393f54 !important;
  color: #ffffff !important;
}
.skin-black .form-control,
.skin-black .form-control[disabled],
.skin-black .form-control[readonly],
.skin-black .input-sm,
.skin-black .select2-container--default .select2-selection--single,
.skin-black .select2-selection .select2-selection--single,
.skin-black .select2-selection__rendered,
.skin-black .select2-search__field,
.skin-black fieldset[disabled] .form-control {
  border-color: #1e2538 !important;
  background: #393f54 !important;
  color: #d0d2d6 !important;
  width: 100%;
  margin: 0 auto;
  border-radius: 6px !important;
}
.skin-black .select2-container--default .select2-results > .select2-results__options,
.skin-black .select2-container--default .select2-results__option[aria-selected="true"],
.skin-black .select2-container--default .select2-selection--multiple,
.skin-black .select2-search {
  background: #393f54 !important;
  color: #d0d2d6 !important;
  border-color: #1e2538 !important;
}
.skin-black .tox .tox-collection--list .tox-collection__group,
.skin-black .tox .tox-collection--list .tox-collection__item,
.skin-black .tox .tox-collection--list .tox-collection__item--enabled,
.skin-black .table-bordered > tfoot > tr > td,
.skin-black .table > tfoot > tr > td,
.skin-black .table-condensed > tbody > tr > td,
.skin-black .table > tbody > tr > th,
.skin-black .table > thead:first-child > tr:first-child > th {
  background: #202635 !important;
  color: #e9e9e9 !important;
}
.skin-black .select2-container--default .select2-results > .select2-results__options,
.skin-black .select2-container--default .select2-results__option[aria-selected="true"],
.skin-black .select2-container--default .select2-selection--multiple,
.skin-black .select2-search {
  border-color: #0a0a0a !important;
  background: #000000 !important;
  color: #d0d2d6 !important;
}
.skin-black .dropdown-menu > li > a:hover,
.skin-black .select2-container--default
.skin-black .select2-results__option--highlighted[aria-selected],
.skin-black .tox .tox-collection--list .tox-collection__item--active {
  background: #5e5df0 !important;
  color: #d0d2d6 !important;
  border-color: #343d54 !important;
}
.skin-black .fc-state-default,
.skin-black .paginate_button .next,
.skin-black .paginate_button .previous,
.skin-black .pagination > li > a {
  background: #393f54 !important;
  color: #d0d2d6 !important;
  border-color: #343d54 !important;
}
.skin-black .alert-warning,
.skin-black .box,
.skin-black .box-body,
.skin-black .box-footer,
.skin-black .box-header,
.skin-black .box-title,
.skin-black .datepicker,
.skin-black .dropdown-menu,
.skin-black .even,
.skin-black .fc-widget-header,
.skin-black .info-box,
.skin-black .input-group .input-group-addon,
.skin-black .list-group-item,
.skin-black .user-header,
.skin-black .user-footer,
.skin-black .modal-body,
.skin-black .modal-footer,
.skin-black .modal-header,
.skin-black .nav-tabs-custom,
.skin-black .nav-tabs-custom > .nav-tabs,
.skin-black .nav-tabs-custom > .nav-tabs > li > a,
.skin-black .pos-tab-container,
.skin-black .pos-tab-content,
.skin-black .pos-tab-content active,
.skin-black .main-header .logo,
.skin-black .main-header .navbar,
.skin-black .side-bar,
.skin-black .tab-content,
.skin-black .table-bordered > tbody > tr > td,
.skin-black .table > tbody > tr > td,
.skin-black .tox .tox-menu,
.skin-black .tox-edit-area,
.skin-black .well,
.skin-black .popover,
.skin-black .popover-title {
  background: #283046 !important;
  color: #ebebeb !important;
  border-color: #343d54 !important;
}
.skin-black .box-header,
.skin-black .nav-tabs-custom,
.skin-black .nav-tabs-custom > .nav-tabs,
.skin-black .nav-tabs-custom > .nav-tabs > li > a {
  border-radius: 12px;
}
.skin-black .sidebar-menu > li.menu-open > a,
.skin-black .sidebar-menu > li > .treeview-menu {
  background: 0 0 !important;
  color: #d0d2d6 !important;
  border-color: #343d54 !important;
}
.skin-black .content-wrapper .content-header-custom {
  background: #3c3c4e;
  color: #fff !important;
  padding: 15px 15px 200px;
}
.skin-black .sidebar-menu>li:hover>a,
.skin-black .main-header .navbar .sidebar-toggle:hover,
.skin-black .main-header .navbar .nav>li>a:active,
.skin-black .main-header .navbar .nav>li>a:focus,
.skin-black .main-header .navbar .nav>li>a:hover {
  background: #4f4f50 !important;
  box-shadow: #68676b 0 1px 10px 5px !important;
  transition-duration: 0.1s;
  color: #ffffff !important;
}
.skin-black .main-header {
  color: #ffffff !important;
}
.skin-black .main-header .navbar .nav .open>a {
  color: #d1d1d1 !important;
}
.skin-black .main-header .navbar .nav>li>a:hover {
  color: #d1d1d1 !important;
}
.skin-black .main-header .navbar>.sidebar-toggle:hover {
  color: #d1d1d1 !important;
}
.skin-black .sidebar-menu>li.menu-open>a,
.skin-black .sidebar-menu>li:hover>a {
  background: #000000  !important;
  color: rgb(255, 255, 255);
}
.skin-black .sidebar-menu>li>.treeview-menu {
  background:  #353434 !important;
  width: 240px;
}
.skin-black-light .main-header {
  color: #ffffff !important;
}
.skin-black-light .sidebar-menu>li>.treeview-menu {
  background:  #7a7a7a !important;
  width: 240px;
}
.skin-black-light .main-header .navbar .nav>li>a {
  color: black;
}
.skin-black-light .sidebar-menu>li.menu-open>a,
.skin-black-light .sidebar-menu>li:hover>a {
  background: #797979  !important;
  color: rgb(255, 255, 255);
}
.skin-black-light .content-wrapper .content-header-custom {
  background: #3c3c4e;
  color: #fff !important;
  padding: 15px 15px 200px;
}
.skin-black-light .side-bar {
  background: -moz-linear-gradient(180deg, rgb(144, 144, 144) 63%, rgb(82, 82, 82) 100%) !important;
  background: -webkit-linear-gradient(180deg, rgb(144, 144, 144) 63%, rgb(82, 82, 82) 100%) !important;
  background: linear-gradient(180deg, rgb(144, 144, 144) 63%, rgb(82, 82, 82) 100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#909090", endColorstr="#525252", GradientType=1) !important;
  width: 240px;
}
/*end dark skin*/


/*start light skin*/
.skin-purple-light .box-header,
.skin-purple-light .form-group,
.skin-purple-light .select2-selection__choice,
.skin-purple-light .input-number,
.skin-purple-light .select2-dropdown,
.skin-purple-light .dropdown-menu,
.skin-purple-light .input-group,
.skin-purple-light .tox .tox-menu,
.skin-purple-light .tox-edit-area,
.skin-purple-light .alert-warning,
.skin-purple-light .box,
.skin-purple-light .box-body,
.skin-purple-light .box-footer,
.skin-purple-light .datepicker,
.skin-purple-light .even,
.skin-purple-light .modal-body,
.skin-purple-light .modal-footer,
.skin-purple-light .well {
  border-color: #000000 !important;
}

.skin-purple-light .user-header,
.skin-purple-light .user-footer,
.skin-purple-light .user-body
{
  background: #dbdbdb !important;
  color: #ffffff !important;
}
.skin-purple-light .info-box {
  color: #000000 !important;
}
.skin-purple-light .content {
  min-height: 250px;
  padding: 15px;
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
}
.skin-purple-light a,
.skin-purple-light a:active,
.skin-purple-light a:focus,
.skin-purple-light a:hover {
  color: #000000;
}
.skin-purple-light .dropdown-toggle {
  color: #ffffff !important;
}

.skin-purple-light .main-header .navbar .sidebar-toggle {
  background: transparent !important;
}

.skin-purple-light .content-wrapper {
  background: #f4f4f4;
  padding: 15px 15px 200px;
}
.skin-blue .content-wrapper .content-header-custom,
.skin-purple-light .content-wrapper .content-header-custom {
  background: #f7f7f7;
  color: rgb(0, 0, 0) !important;
  padding: 15px 15px 200px;
}

.skin-purple-light div.pos-tab-menu div.list-group>a.active,
.skin-purple-light div.pos-tab-menu div.list-group>a.active .glyphicon,
.skin-purple-light div.pos-tab-menu div.list-group>a.active {
  background-color: #8c8c8c;
  color: #000000;
  border-color: #8c8c8c;
}

.skin-purple-light div.pos-tab-menu div.list-group>a.active:after {
  border-left: 10px solid #6d6d6d;
}

.skin-purple-light .side-bar {
  background: white !important;
  width: 240px;
}

.skin-purple-light .sidebar-menu>li>a {
  color: rgb(0, 0, 0);
  transition: 0.4s;
}
.skin-purple-light .sidebar-menu>li.active>a {
  background: linear-gradient(to left, #b9b9b9b2 3%, #e1e1e1b3 100%) !important;
  color: rgb(0, 0, 0);
  width: 50px;
}
.skin-purple-light .sidebar-menu>li.menu-open>a,
.skin-purple-light .sidebar-menu>li:hover>a,
.skin-purple-light .sidebar-menu>li:hover>a {
  background: linear-gradient(to left, #b9b9b9b2 3%, #e1e1e1b3 100%) !important;
  color: rgb(0, 0, 0);
  width: 240px;
}
.skin-purple-light .sidebar-menu>.active>a {
background: linear-gradient(to left, #b9b9b9b2 3%, #e1e1e1b3 100%) !important;
}
.skin-purple-light .sidebar-menu>li>.treeview-menu {
  background: linear-gradient(to left, #e1e1e1b3 73%, #b9b9b9b2 100%) !important;
  width: 240px;
}

.skin-purple-light .sidebar-menu .treeview-menu>li.active>a {
  font-weight: 600;
  color: #000e1a;
}

.skin-purple-light.sidebar-menu .treeview-menu>li.active>a,
.skin-purple-light .sidebar-menu .treeview-menu>li>a:hover {
  color: rgb(0, 0, 0);
  font-weight: 600;
}

.skin-purple-light .sidebar-menu .treeview-menu>li>a {
  color: rgb(0, 0, 0);
}

.skin-purple-light .sidebar-menu>li.active {
  border-left-color: rgba(37, 35, 35, 0.832);
}
/*end light skin*/

.skin-green-light .sidebar-menu>li.active>a,
.skin-green-light .sidebar-menu>li.menu-open>a,
.skin-green-light .sidebar-menu>li:hover>a,
.skin-red-light .sidebar-menu>li.active>a,
.skin-red-light .sidebar-menu>li.menu-open>a,
.skin-red-light .sidebar-menu>li:hover>a,
.skin-yellow-light .sidebar-menu>li.active>a,
.skin-yellow-light .sidebar-menu>li.menu-open>a,
.skin-yellow-light .sidebar-menu>li:hover>a {
  background: #0082e6  !important;
  color: white;
  width: 240px;
}

.skin-green-light .sidebar-menu>li>.treeview-menu,
.skin-red-light .sidebar-menu>li>.treeview-menu,
.skin-yellow-light .sidebar-menu>li>.treeview-menu {
  background:  #b3deff !important;
  width: 240px;
}


.content-header>h1>small {
  font-size: 15px;
  display: inline-block;
  padding-left: 4px;
  font-weight: 300;
  color: rgb(255, 255, 255);
}


.sidebar-menu li.active>a {
  font-weight: 700 !important;
}

.font-settings.btn-group.pull-right {
  bottom: 2px;
  position: fixed;
  left: 36px;
  z-index: 1001;
  background: white;
  border-radius: 7px;
}

/*.table-bordered>tbody>tr>td,
.table-bordered>tfoot>tr>td,
.table-bordered>thead>tr>td {
  color: black;
}

.table-bordered>tbody>tr>th,
.table-bordered>tfoot>tr>th,
.table-bordered>thead>tr>th {
  color: #004480;
}*/

#pos_table>tbody>tr>th,
#pos_table>tfoot>tr>th,
#pos_table>thead>tr>th {
  color: black;
}

#settings-btn {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
}

#full_screen_div {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 1300px;
  background: rgb(217, 217, 217, 0.5);
  z-index: 99;
  display: none;
}

.file-drop-zone,
.krajee-default .file-preview-audio audio,
.krajee-default .file-preview-image,
.krajee-default .file-preview-other {
  width: 200px !important;
}

.select2-selection:focus {
  border: 1px solid black;
}

@media (max-width: 576px) {
  .breadcrumb {
    flex-direction: column;
    align-items: flex-start;
  }

  .breadcrumb ul li:first-child {
    padding-left: 0;
  }
}

html [type="button"],
.btn[type="button"] {
  -o-webkit-appearance: none !important;
}

.btn {
  padding: .25rem .5rem;
}

.btn.btn-xl {
  padding: .5rem 2rem;
  font-size: .5rem;
}

.btn:focus {
  box-shadow: none;
}

.btn-secondary,
.btn-raised-secondary {
  color: #111827 !important;
  background-color: #fff !important;
}

.btn-icon [class^="i-"],
.btn-icon .icon {
  vertical-align: middle;
  margin: .5px;
  -webkit-font-smoothing: subpixel-antialiased;
}

.btn-icon.rounded-circle {
  width: 22px;
  height: 22px;
  padding: 0;
}

.btn-icon-text [class^="i-"],
.btn-icon-text .icon {
  vertical-align: middle;
  margin: 0 2px;
  -webkit-font-smoothing: subpixel-antialiased;
}

.btn-outline-email {
  background: rgba(229, 231, 235, 0.6);
}

.btn-spinner {
  width: 1em;
  height: 1em;
  background: transparent;
  border-radius: 50%;
  margin: 0 16px 0 0;
  border: 2px solid transparent;
}

.btn-checkbox .checkbox,
.btn-checkbox .radio {
  display: inline;
}


.btn.btn-outline-light.btn-svg.active,
.btn.btn-outline-light.btn-svg:hover {
  background: #8b5cf6;
}

.btn.btn-outline-light.btn-svg.active svg,
.btn.btn-outline-light.btn-svg:hover svg {
  fill: #ffffff;
}

.btn.btn-outline-light.btn-svg:focus {
  box-shadow: none !important;
}

.btn-raised {
  color: #fff;
}

.btn-primary .btn-spinner,
.btn-outline-primary .btn-spinner {
  -webkit-animation: btn-glow-primary 1s ease infinite;
          animation: btn-glow-primary 1s ease infinite;
}

.btn-primary:hover,
.btn-outline-primary:hover {
  background: #8b5cf6;
  box-shadow: 0 8px 25px -8px #8b5cf6;
}

.btn-primary:focus,
.btn-outline-primary:focus {
  box-shadow: none;
  box-shadow: 0 8px 25px -8px #8b5cf6;
}

.btn-raised.btn-raised-primary {
  background: #8b5cf6;
  box-shadow: 0 4px 6px rgba(139, 92, 246, 0.11), 0 1px 3px rgba(139, 92, 246, 0.08);
}

@-webkit-keyframes btn-glow-primary {
  0% {
    box-shadow: 0 0 0 0.4em #692cf3, 0 0 0 0.1em #692cf3;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #692cf3, 0 0 0 3.6em transparent;
  }
}

@keyframes btn-glow-primary {
  0% {
    box-shadow: 0 0 0 0.4em #692cf3, 0 0 0 0.1em #692cf3;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #692cf3, 0 0 0 3.6em transparent;
  }
}

.btn-secondary .btn-spinner,
.btn-outline-secondary .btn-spinner {
  -webkit-animation: btn-glow-secondary 1s ease infinite;
          animation: btn-glow-secondary 1s ease infinite;
}

.btn-secondary:hover,
.btn-outline-secondary:hover {
  background: #1F2937;
  box-shadow: 0 8px 25px -8px #1F2937;
}

.btn-secondary:focus,
.btn-outline-secondary:focus {
  box-shadow: none;
  box-shadow: 0 8px 25px -8px #1F2937;
}

.btn-raised.btn-raised-secondary {
  background: #1F2937;
  box-shadow: 0 4px 6px rgba(31, 41, 55, 0.11), 0 1px 3px rgba(31, 41, 55, 0.08);
}

@-webkit-keyframes btn-glow-secondary {
  0% {
    box-shadow: 0 0 0 0.4em #0d1116, 0 0 0 0.1em #0d1116;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #0d1116, 0 0 0 3.6em transparent;
  }
}

@keyframes btn-glow-secondary {
  0% {
    box-shadow: 0 0 0 0.4em #0d1116, 0 0 0 0.1em #0d1116;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #0d1116, 0 0 0 3.6em transparent;
  }
}

.btn-success .btn-spinner,
.btn-outline-success .btn-spinner {
  -webkit-animation: btn-glow-success 1s ease infinite;
          animation: btn-glow-success 1s ease infinite;
}

.btn-success:hover,
.btn-outline-success:hover {
  background: #10b981;
  box-shadow: 0 8px 25px -8px #10b981;
}

.btn-success:focus,
.btn-outline-success:focus {
  box-shadow: none;
  box-shadow: 0 8px 25px -8px #10b981;
}

.btn-raised.btn-raised-success {
  background: #10b981;
  box-shadow: 0 4px 6px rgba(16, 185, 129, 0.11), 0 1px 3px rgba(16, 185, 129, 0.08);
}

@-webkit-keyframes btn-glow-success {
  0% {
    box-shadow: 0 0 0 0.4em #0c8a60, 0 0 0 0.1em #0c8a60;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #0c8a60, 0 0 0 3.6em transparent;
  }
}

@keyframes btn-glow-success {
  0% {
    box-shadow: 0 0 0 0.4em #0c8a60, 0 0 0 0.1em #0c8a60;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #0c8a60, 0 0 0 3.6em transparent;
  }
}

.btn-info .btn-spinner,
.btn-outline-info .btn-spinner {
  -webkit-animation: btn-glow-info 1s ease infinite;
          animation: btn-glow-info 1s ease infinite;
}

.btn-info:hover,
.btn-outline-info:hover {
  background: #3b82f6;
  box-shadow: 0 8px 25px -8px #3b82f6;
}

.btn-info:focus,
.btn-outline-info:focus {
  box-shadow: none;
  box-shadow: 0 8px 25px -8px #3b82f6;
}

.btn-raised.btn-raised-info {
  background: #3b82f6;
  box-shadow: 0 4px 6px rgba(59, 130, 246, 0.11), 0 1px 3px rgba(59, 130, 246, 0.08);
}

@-webkit-keyframes btn-glow-info {
  0% {
    box-shadow: 0 0 0 0.4em #0b63f3, 0 0 0 0.1em #0b63f3;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #0b63f3, 0 0 0 3.6em transparent;
  }
}

@keyframes btn-glow-info {
  0% {
    box-shadow: 0 0 0 0.4em #0b63f3, 0 0 0 0.1em #0b63f3;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #0b63f3, 0 0 0 3.6em transparent;
  }
}

.btn-warning .btn-spinner,
.btn-outline-warning .btn-spinner {
  -webkit-animation: btn-glow-warning 1s ease infinite;
          animation: btn-glow-warning 1s ease infinite;
}

.btn-warning:hover,
.btn-outline-warning:hover {
  background: #f59e0b;
  box-shadow: 0 8px 25px -8px #f59e0b;
}

.btn-warning:focus,
.btn-outline-warning:focus {
  box-shadow: none;
  box-shadow: 0 8px 25px -8px #f59e0b;
}

.btn-raised.btn-raised-warning {
  background: #f59e0b;
  box-shadow: 0 4px 6px rgba(245, 158, 11, 0.11), 0 1px 3px rgba(245, 158, 11, 0.08);
}

@-webkit-keyframes btn-glow-warning {
  0% {
    box-shadow: 0 0 0 0.4em #c57f08, 0 0 0 0.1em #c57f08;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #c57f08, 0 0 0 3.6em transparent;
  }
}

@keyframes btn-glow-warning {
  0% {
    box-shadow: 0 0 0 0.4em #c57f08, 0 0 0 0.1em #c57f08;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #c57f08, 0 0 0 3.6em transparent;
  }
}

.btn-danger .btn-spinner,
.btn-outline-danger .btn-spinner {
  -webkit-animation: btn-glow-danger 1s ease infinite;
          animation: btn-glow-danger 1s ease infinite;
}

.btn-danger:hover {
  background: #ef4444;
  box-shadow: 0 8px 25px -8px #ef4444;
}

.btn-danger:focus {
  box-shadow: none;
  box-shadow: 0 8px 25px -8px #ef4444;
}

.btn-raised.btn-raised-danger {
  background: #ef4444;
  box-shadow: 0 4px 6px rgba(239, 68, 68, 0.11), 0 1px 3px rgba(239, 68, 68, 0.08);
}

@-webkit-keyframes btn-glow-danger {
  0% {
    box-shadow: 0 0 0 0.4em #eb1515, 0 0 0 0.1em #eb1515;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #eb1515, 0 0 0 3.6em transparent;
  }
}

@keyframes btn-glow-danger {
  0% {
    box-shadow: 0 0 0 0.4em #eb1515, 0 0 0 0.1em #eb1515;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #eb1515, 0 0 0 3.6em transparent;
  }
}

.btn-raised.btn-raised-light {
  background: #6B7280;
  box-shadow: 0 4px 6px rgba(107, 114, 128, 0.11), 0 1px 3px rgba(107, 114, 128, 0.08);
}

@-webkit-keyframes btn-glow-light {
  0% {
    box-shadow: 0 0 0 0.4em #545964, 0 0 0 0.1em #545964;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #545964, 0 0 0 3.6em transparent;
  }
}

@keyframes btn-glow-light {
  0% {
    box-shadow: 0 0 0 0.4em #545964, 0 0 0 0.1em #545964;
    transform: rotate(360deg);
  }

  50% {
    border-top-color: #ffffff;
  }

  100% {
    box-shadow: 0 0 0 0.4em #545964, 0 0 0 3.6em transparent;
  }
}

.btn-raised.btn-raised-dark {
  background: #111827;
  box-shadow: 0 4px 6px rgba(17, 24, 39, 0.11), 0 1px 3px rgba(17, 24, 39, 0.08);
}

.btn-facebook {
  color: #fff;
  background-color: #3765c9;
}

.btn-facebook:hover {
  background-color: #3765c9;
}

.btn-google {
  color: #fff;
  background-color: #ec412c;
}

.btn-twitter {
  color: #fff;
  background-color: #039ff5;
}

.btn-instagram {
  color: #fff;
  background-color: #c13584;
}

.btn-linkedin {
  color: #fff;
  background-color: #0077b5;
}

.btn-dribble {
  color: #fff;
  background-color: #ea4c89;
}

.btn-youtube {
  color: #fff;
  background-color: #c4302b;
}


@media screen and (prefers-reduced-motion: reduce) {
  .form-control {
    transition: none;
  }
}

.form-control::-ms-expand {
  background-color: transparent;
  border: 0;
}

.form-control:focus {
  color: #374151;
  background-color: #fff;
  border-color: #b698fa;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(139, 92, 246, 0.25);
}

.inputs {
  text-align: left;
  margin-top: 30px;
}

input::placeholder {
  color: gray;
}

input
{
  background: #ecf0f3;
  padding: 10px;
  padding-left: 40px;
  font-size: 14px;
  border-radius: 9px;
  /*box-shadow: inset 0px 2px 6px #8c5aff, inset -3px -6px 6px whitesmoke;*/
}

@media screen and (prefers-reduced-motion: reduce) {
  .collapsing {
    transition: none;
  }
}

.dropup,
.dropright,
.dropdown,
.dropleft {
  position: relative;
}

.dropdown-toggle::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
}

.dropdown-toggle:empty::after {
  margin-left: 0;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  padding: 0.5rem 0;
  margin: 0.0125rem 0 0;
  /*font-size: 1.3rem;*/
  color: #111827;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(10, 2, 30, 0.15);
  border-radius: 0.25rem;
}

/* styles for home menu */
.hm {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: 1fr;
  /*height: 80vh; */
  background: linear-gradient(150deg, #673de6 5%, rgba(0, 0, 0, 0) 30%), url(../img/home-bg.jpg);
  background-color: #1515157b;
  background-size: cover;
  background-position: center
  
}
.background-one {
  background-color: #1515157b;
}
.background-two {
  background-color: #1515157b;
}
.background-three {
  background-color: #1515157b;
}
.link-container {
  display: flex;
  font-size: 2.5rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  position: relative;
  z-index: 0;
}
@media (max-width: 768px) {
  .link-container {
    padding-right: 15px;
    padding-left: 15px;
    overflow-x: visible;
    border-top: 1px solid transparent;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    font-size: 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 60px;
    width: 400px;
    position: relative;
    z-index: 0;
  }
  .hm {
  
    display: table-row-group;
    background: linear-gradient(150deg, #673de6 5%, rgba(0, 0, 0, 0) 30%), url(../img/home-bg.jpg);
    text-align: center;
    background-size: cover;
    background-position: center;
  }
  }



.link-one {
  color: #53d9d1;
    transition: color 1s cubic-bezier(0.32, 0, 0.67, 0);
    line-height: 1em;
    }
    .link-one:hover {
      color: #111;
      transition: color 1s cubic-bezier(0.33, 1, 0.68, 1);
      }
      .link-one::before {
          content: "";
          position: absolute;
          z-index: -1;
          width: 100%;
          height: 100%;
          top: 0;
          right: 0;
          background-color: #53d9d1;
          clip-path: circle(0% at 50% calc(50%));
          transition: clip-path 1s cubic-bezier(0.65, 0, 0.35, 1);
          }
      .link-one:hover::before {
          clip-path: circle(100% at 50% 50%);
      }
      .link-one::after {
          content: "";
          position: absolute;
          z-index: -1;
          width: 100%;
          height: 100%;
          top: 0;
          right: 0;
          background-color: #151515;
          clip-path: polygon(40% 0%, 60% 0%, 60% 0%, 40% 0%, 40% 100%, 60% 100%, 60% 100%, 40% 100%);
          transition: clip-path 1s cubic-bezier(0.65, 0, 0.35, 1);
          }
      .link-one:hover::after {
          clip-path: polygon(40% 10%, 60% 10%, 60% 35%, 40% 35%, 40% 90%, 60% 90%, 60% 65%, 40% 65%);
          }
.link-two {
  color: #f27b9b;
  transition: color 1s cubic-bezier(0.32, 0, 0.67, 0);
  }
  .link-two:hover {
      color: #111;
      transition: color 1s cubic-bezier(0.33, 1, 0.68, 1);
  }
  .link-two::before {
      content: "";
      position: absolute;
      z-index: -2;
      width: 100%;
      height: 100%;
      top: 0;
      right: 0;
      clip-path: polygon(0% -20%, 100% -30%, 100% -10%, 0% 0%, 0% 130%, 100% 120%, 100% 100%, 0% 110%);
      background-color: #f27b9b;
      transition: clip-path 1s cubic-bezier(0.25, 1, 0.5, 1);
      }
      .link-two:hover::before {
            clip-path: polygon(0% 10%, 100% 0%, 100% 20%, 0% 30%, 0% 100%, 100% 90%,    100% 70%, 0% 80%);
            }
  .link-two::after {
      content: "";
      position: absolute;
      z-index: -1;
      width: 5ch;
      height: 5ch;
      top: 50%;
      right: 50%;
      transform: translate(50%, -50%) rotate(0deg) scale(0);
      transition: transform 1s ease;
      background-color: #f27b9b;
      }
  .link-two:hover::after {
      transform: translate(50%, -50%) rotate(135deg) scale(1);
}
.link-three {
  color: #eb7132;
  }
  .link-three::after {
      content: "";
      position: absolute;
      z-index: 2;
      width: 50%;
      height: 100%;
      top: 0%;
      left: 0%;
      transform: translate(0, -50%) scaleY(0);
      transition: transform 1s ease;
      mix-blend-mode: difference;
      clip-path: polygon(20% 60%, 100% 60%, 100% 40%, 20% 40%, 20% 0%, 60% 0%, 60% 20%,   20% 20%);
      background-color: #eb7132;
      }
  .link-three:hover::after {
      transform: translate(0, 0%) scaleY(1);
      }
  .link-three::before {
      content: "";
      position: absolute;
      z-index: 2;
      width: 50%;
      height: 100%;
      bottom: 0%;
      right: 0%;
      transform: translate(0, 50%) scaleY(0);
      transition: transform 1s ease;
      mix-blend-mode: difference;
      clip-path: polygon(
          80% 40%, 0% 40%, 0% 60%, 80% 60%, 80% 100%, 40% 100%, 40% 80%, 80% 80%);
          background-color: #eb7132;
      }
  .link-three:hover::before {
      transform: translate(0%, 0%) scaleY(1);
  }
  /* styles for home menu */

  /* Enhanced Color Scheme */


/* Base Styles */
body {
  background-color: var(--background);
  color: var(--text);
  line-height: 1.6;
  letter-spacing: 0.025rem;
}

/* Modern Gradient Headers */
.skin-blue-light .main-header {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%) !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

/* Enhanced Buttons (Size Unchanged) */
.btn {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: 6px; /* Slightly rounded */
  font-weight: 500;
  letter-spacing: 0.025em;
  padding: 0.375rem 0.75rem; /* Original size */
  border: none;
}

.btn-primary {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
  box-shadow: 0 2px 4px -1px rgba(124, 58, 237, 0.2);
}

.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 6px -1px rgba(124, 58, 237, 0.3);
}

/* Modern Form Elements */
.form-control {
  border-radius: 6px;
  border: 1px solid #E2E8F0;
  padding: 0.375rem 0.75rem; /* Original size */
  transition: border-color 0.3s ease;
}

.form-control:focus {
  border-color: var(--primary-light);
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1);
}

/* Enhanced Cards */
.box {
  border-radius: 8px;
  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.05);
  border: none;
  overflow: hidden;
}

.box-header {
  padding: 0.75rem 1rem; /* Original size */
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
}

.box-title {
  color: white;
  font-weight: 600;
  letter-spacing: 0.025em;
}

/* Modern Navigation */
.sidebar-menu > li > a {
  padding: 0.5rem 1rem; /* Original size */
  border-radius: 6px;
  margin: 0.125rem 0.5rem;
  transition: all 0.3s ease;
}

.sidebar-menu > li:hover > a {
  background: rgba(255, 255, 255, 0.1);
  transform: translateX(4px);
}

/* Hover Effects */
.hover-scale {
  transition: transform 0.3s ease;
}

.hover-scale:hover {
  transform: scale(1.02);
}

/* Modern Scrollbar */
::-webkit-scrollbar {
  width: 6px; /* Slimmer scrollbar */
  background: #F1F5F9;
}

::-webkit-scrollbar-thumb {
  background: var(--primary-light);
  border-radius: 3px;
}

/* Gradient Text */
.gradient-text {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Animated Loader */
@keyframes spin {
  to { transform: rotate(360deg); }
}

.loader {
  width: 1.5rem; /* Smaller loader */
  height: 1.5rem;
  border: 2px solid #E2E8F0;
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* Responsive Improvements */
@media (max-width: 768px) {
  .content-wrapper {
    padding: 0.75rem;
  }
  
  .box {
    margin-bottom: 1rem;
  }
  
  .btn {
    width: auto; /* Keep original width */
    margin-bottom: 0.25rem;
  }
}

/* Modern Shadow System */
.shadow-sm { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) }
.shadow-md { box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.08) }
.shadow-lg { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) }

/* Transition Mixins */
.transition-all {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.product_box:hover {
  border-color: var(--primary-light);
  box-shadow: 0 2px 4px -1px rgba(124, 58, 237, 0.1);
}

.daterangepicker select.monthselect, .daterangepicker select.yearselect {
  background: #fff;
}