/* Modern create-sale workspace */
body.modern-pos-page {
  --pos-blue: #075cca;
  --pos-blue-dark: #064da9;
  --pos-green: #079447;
  --pos-text: #12203a;
  --pos-muted: #6c7890;
  --pos-border: #dfe5ee;
  --pos-bg: #f5f7fa;
  background: var(--pos-bg);
  color: var(--pos-text);
  font-family: "Source Sans Pro", Arial, sans-serif;
  overflow: hidden;
}

body.modern-pos-page .main-footer,
body.modern-pos-page .content-header,
body.modern-pos-page .scale-panel,
body.modern-pos-page .legacy-sale-meta,
body.modern-pos-page .dataTables_length,
body.modern-pos-page .dataTables_filter,
body.modern-pos-page .salesTable + .dataTables_info {
  display: none !important;
}

body.modern-pos-page .wrapper {
  min-height: 100vh;
  background: var(--pos-bg);
}

body.modern-pos-page .modern-pos-wrapper {
  height: calc(100vh - 50px);
  min-height: calc(100vh - 50px) !important;
  margin-left: 230px;
  padding: 0 0 42px;
  background: var(--pos-bg);
}

body.modern-pos-page.sidebar-mini.sidebar-collapse .modern-pos-wrapper {
  margin-left: 50px !important;
}

body.modern-pos-page .modern-pos-content {
  height: calc(100vh - 92px);
  min-height: 570px;
  padding: 0 7px !important;
}

body.modern-pos-page .modern-pos-layout {
  display: grid;
  grid-template-columns: minmax(390px, 42%) minmax(0, 58%);
  gap: 12px;
  height: 100%;
  margin: 0 !important;
  padding: 0;
}

body.modern-pos-page .modern-pos-layout::before,
body.modern-pos-page .modern-pos-layout::after {
  display: none;
  content: none;
}

body.modern-pos-page .pos-receipt-column,
body.modern-pos-page .pos-catalog-column {
  float: none;
  width: auto;
  min-width: 0;
  height: 100%;
  padding: 0;
}

body.modern-pos-page .pos-panel {
  height: 100%;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--pos-border);
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(19, 43, 77, .04);
}

body.modern-pos-page .pos-panel.box-success,
body.modern-pos-page .pos-panel.box-warning {
  border-top: 1px solid var(--pos-border);
}

body.modern-pos-page .pos-panel-title {
  height: 38px;
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--pos-border) !important;
  color: #17233c;
  font-size: 15px;
  font-weight: 700;
  line-height: 17px;
}

body.modern-pos-page .pos-receipt-panel form {
  height: calc(100% - 38px);
}

body.modern-pos-page .pos-receipt-panel form > .box-body {
  height: 100%;
  padding: 0;
}

body.modern-pos-page .pos-receipt-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.modern-pos-page .pos-sale-meta {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(150px, 1fr);
  gap: 18px;
  flex: 0 0 auto;
  padding: 14px;
  border-bottom: 1px solid var(--pos-border);
}

body.modern-pos-page .pos-field label {
  display: block;
  margin: 0 0 6px;
  color: #33415c;
  font-size: 13px;
  font-weight: 600;
}

body.modern-pos-page .pos-field label span {
  color: var(--pos-muted);
  font-weight: 400;
}

body.modern-pos-page .pos-field input,
body.modern-pos-page .pos-field select {
  width: 100%;
  height: 33px;
  padding: 0 11px;
  border: 1px solid #d5dce7;
  border-radius: 5px;
  outline: none;
  background: #fff;
  color: #26344e;
  font-size: 14px;
}

body.modern-pos-page .pos-field input:focus,
body.modern-pos-page .pos-field select:focus,
body.modern-pos-page .pos-catalog-search input:focus {
  border-color: #75aaf0;
  box-shadow: 0 0 0 2px rgba(7, 92, 202, .08);
}

body.modern-pos-page .pos-input-action {
  display: flex;
}

body.modern-pos-page .pos-input-action input {
  border-radius: 5px 0 0 5px;
}

body.modern-pos-page .pos-input-action button {
  width: 34px;
  border: 1px solid #d5dce7;
  border-left: 0;
  border-radius: 0 5px 5px 0;
  background: #fff;
  color: #24344e;
}

body.modern-pos-page .pos-cart-table-header,
body.modern-pos-page .pos-cart-row {
  display: grid;
  grid-template-columns: minmax(90px, 2.1fr) 58px 35px 45px 55px 28px minmax(52px, .9fr);
  align-items: center;
  column-gap: 5px;
}

body.modern-pos-page .pos-cart-table-header {
  flex: 0 0 35px;
  padding: 0 8px;
  border-bottom: 1px solid var(--pos-border);
  background: #f9fafc;
  color: #25324a;
  font-size: 11px;
  font-weight: 700;
}

body.modern-pos-page .pos-cart-table-header span:not(:first-child) {
  text-align: center;
}

body.modern-pos-page .pos-cart-items {
  position: relative;
  flex: 1 1 auto;
  min-height: 88px;
  max-height: 285px;
  margin: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

body.modern-pos-page .pos-cart-items.is-empty {
  display: none;
}

body.modern-pos-page .pos-cart-row {
  min-height: 58px;
  padding: 7px 8px;
  border-bottom: 1px solid #e8edf3;
  background: #fff;
}

body.modern-pos-page .pos-cart-product {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
}

body.modern-pos-page .pos-cart-product img {
  width: 27px;
  height: 37px;
  flex: 0 0 27px;
  object-fit: contain;
}

body.modern-pos-page .pos-cart-product > div {
  min-width: 0;
}

body.modern-pos-page .pos-cart-product .newProductDescription {
  width: 100%;
  height: auto;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #17233c;
  font-size: 13px;
  font-weight: 700;
  line-height: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.modern-pos-page .pos-cart-product small {
  display: block;
  overflow: hidden;
  color: #708099;
  font-size: 11px;
  line-height: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.modern-pos-page .pos-cart-product small.pos-active-offer {
  color: #0a9a4a;
  font-weight: 700;
}

body.modern-pos-page .pos-cart-quantity {
  display: grid;
  grid-template-columns: 19px 1fr 19px;
  height: 30px;
  overflow: hidden;
  border: 1px solid #d9e0ea;
  border-radius: 5px;
}

body.modern-pos-page .pos-cart-quantity button {
  padding: 0;
  border: 0;
  background: #fff;
  color: #245083;
  font-weight: 700;
}

body.modern-pos-page .pos-cart-quantity input {
  width: 100%;
  min-width: 0;
  height: 28px;
  padding: 0;
  border: 0;
  border-right: 1px solid #e2e7ee;
  border-left: 1px solid #e2e7ee;
  border-radius: 0;
  box-shadow: none;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  appearance: textfield;
}

body.modern-pos-page .pos-cart-unit select,
body.modern-pos-page .pos-discount-input {
  width: 100%;
  height: 30px;
  padding: 0 5px;
  border: 1px solid #d9e0ea;
  border-radius: 5px;
  background: #fff;
  color: #344158;
  font-size: 12px;
}

body.modern-pos-page .pos-cart-unit-price,
body.modern-pos-page .pos-cart-vat {
  color: #17233c;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}

body.modern-pos-page .pos-cart-discount {
  position: relative;
}

body.modern-pos-page .pos-cart-discount:after {
  position: absolute;
  top: 8px;
  right: 5px;
  content: "%";
  color: #6c7890;
  font-size: 10px;
}

body.modern-pos-page .pos-cart-discount input {
  padding-right: 14px;
  text-align: center;
}

body.modern-pos-page .pos-cart-subtotal {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  gap: 5px;
}

body.modern-pos-page .pos-cart-subtotal .newProductPrice {
  width: 54px;
  height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #17233c;
  font-size: 12px;
  font-weight: 700;
  text-align: right;
}

body.modern-pos-page .pos-cart-subtotal .removeProduct {
  padding: 3px;
  border: 0;
  background: transparent;
  color: #ff3f43;
  font-size: 12px;
}

body.modern-pos-page .pos-cart-empty {
  display: none;
  flex: 1 1 auto;
  min-height: 88px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #8793a6;
  gap: 3px;
}

body.modern-pos-page .pos-cart-empty.visible {
  display: flex;
}

body.modern-pos-page .pos-cart-empty i {
  margin-bottom: 4px;
  color: #b3bdca;
  font-size: 25px;
}

body.modern-pos-page .pos-cart-empty strong {
  color: #536177;
  font-size: 12px;
}

body.modern-pos-page .pos-cart-empty span {
  font-size: 11px;
}

body.modern-pos-page .pos-cart-actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  flex: 0 0 47px;
  padding: 8px 14px;
  border-top: 1px solid var(--pos-border);
  border-bottom: 1px solid var(--pos-border);
}

body.modern-pos-page .pos-outline-btn {
  height: 31px;
  border: 1px solid #bcd4f4;
  border-radius: 5px;
  background: #f6faff;
  color: #0a59c5;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

body.modern-pos-page .pos-outline-btn i {
  margin-right: 7px;
}

body.modern-pos-page .pos-danger-outline {
  border-color: #ffcaca;
  background: #fff8f8;
  color: #ef3d42;
}

body.modern-pos-page .btnAddProduct {
  display: none !important;
}

body.modern-pos-page .pos-payment-box {
  flex: 0 0 auto;
  width: 100% !important;
  padding: 10px 14px 11px !important;
  background: #fff !important;
}

body.modern-pos-page .pos-sale-review {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  min-height: 112px;
  margin-bottom: 10px;
  overflow: hidden;
  border: 1px solid var(--pos-border);
  border-radius: 5px;
}

body.modern-pos-page .pos-notes {
  position: relative;
  padding: 10px;
  border-right: 1px solid var(--pos-border);
}

body.modern-pos-page .pos-notes label {
  display: block;
  margin-bottom: 7px;
  color: #344158;
  font-size: 12px;
  font-weight: 700;
}

body.modern-pos-page .pos-notes textarea {
  width: 100%;
  height: 66px;
  padding: 8px;
  resize: none;
  border: 1px solid #d9e0ea;
  border-radius: 5px;
  outline: none;
  color: #344158;
  font-size: 12px;
}

body.modern-pos-page .pos-notes > span {
  position: absolute;
  right: 16px;
  bottom: 15px;
  color: #8a96a8;
  font-size: 11px;
}

body.modern-pos-page .pos-totals-card {
  padding: 9px 13px;
}

body.modern-pos-page .pos-totals-card > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 21px;
  color: #25324a;
  font-size: 13px;
}

body.modern-pos-page .pos-totals-card strong {
  font-size: 13px;
}

body.modern-pos-page .pos-totals-card .pos-discount-row strong {
  color: #f13e42;
}

body.modern-pos-page .pos-totals-card .pos-total-row {
  min-height: 37px;
  margin-top: 4px;
  padding-top: 7px;
  border-top: 1px solid var(--pos-border);
  color: #075cca;
  font-size: 19px;
  font-weight: 700;
}

body.modern-pos-page .pos-totals-card .pos-total-row strong {
  font-size: 18px;
}

body.modern-pos-page .pos-checkout-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 74px;
  gap: 42px;
  border: 0;
  border-radius: 5px;
  background: linear-gradient(135deg, #087e39, #05a752);
  box-shadow: 0 4px 9px rgba(5, 145, 68, .17);
  color: #fff;
}

body.modern-pos-page .pos-checkout-button:hover {
  background: linear-gradient(135deg, #066f32, #079748);
}

body.modern-pos-page .pos-checkout-button > i {
  font-size: 25px;
}

body.modern-pos-page .pos-checkout-button > span {
  display: flex;
  flex-direction: column;
  font-size: 16px;
  font-weight: 700;
  line-height: 26px;
}

body.modern-pos-page .pos-checkout-button > span small {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

body.modern-pos-page .pos-checkout-button strong {
  display: block;
  font-size: 27px;
}

body.modern-pos-page .pos-payment-methods {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 9px !important;
  margin-top: 10px;
}

body.modern-pos-page .pos-payment-methods .pay-card {
  display: flex !important;
  height: 36px !important;
  min-height: 36px;
  flex-direction: row !important;
  align-items: center;
  justify-content: center;
  gap: 7px !important;
  margin: 0;
  padding: 0 5px;
  border: 1px solid #d5dce7 !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #26344e !important;
  font: inherit;
  font-size: 12px !important;
  font-weight: 700;
  text-transform: uppercase;
  transform: none !important;
}

body.modern-pos-page .pos-payment-methods .pay-card:hover {
  border-color: #8fb8ec !important;
  background: #f7fbff !important;
  opacity: 1;
}

body.modern-pos-page .pos-payment-methods .pos-pay-icon {
  color: #1f3f6b;
  font-size: 13px;
}

body.modern-pos-page .pos-payment-methods .selected-check {
  display: none !important;
}

body.modern-pos-page .pos-catalog-panel {
  display: flex;
  flex-direction: column;
}

body.modern-pos-page .pos-catalog-body {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 0 !important;
}

body.modern-pos-page .pos-catalog-search-row {
  display: grid;
  grid-template-columns: 1fr 135px;
  gap: 14px;
  padding: 13px 14px 8px;
}

body.modern-pos-page .pos-catalog-search {
  position: relative;
}

body.modern-pos-page .pos-catalog-search input {
  width: 100%;
  height: 34px;
  padding: 0 36px 0 12px;
  border: 1px solid #d6dee9;
  border-radius: 5px;
  outline: none;
  color: #344158;
  font-size: 13px;
}

body.modern-pos-page .pos-catalog-search i {
  position: absolute;
  top: 10px;
  right: 12px;
  color: #344d73;
}

body.modern-pos-page .pos-scan-button {
  height: 34px;
  border: 1px solid #b8d3f8;
  border-radius: 5px;
  background: #f7fbff;
  color: #075cca;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

body.modern-pos-page .pos-scan-button i {
  margin-right: 8px;
  font-size: 14px;
}

body.modern-pos-page .pos-category-filters {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 14px 13px;
  overflow-x: auto;
  border-bottom: 1px solid var(--pos-border);
}

body.modern-pos-page .pos-category-filters button {
  height: 31px;
  padding: 0 12px;
  white-space: nowrap;
  border: 1px solid #d8e0ea;
  border-radius: 5px;
  background: #fff;
  color: #26344e;
  font-size: 12px;
  font-weight: 600;
}

body.modern-pos-page .pos-category-filters button i {
  margin-right: 6px;
}

body.modern-pos-page .pos-category-filters button.active {
  border-color: var(--pos-blue);
  background: var(--pos-blue);
  color: #fff;
}

body.modern-pos-page .pos-catalog-body > .dataTables_wrapper {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
}

body.modern-pos-page .pos-catalog-body .dataTables_wrapper > .row {
  margin: 0;
}

body.modern-pos-page .pos-catalog-body .dataTables_wrapper > .row:nth-child(2) {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}

body.modern-pos-page .pos-catalog-body .dataTables_wrapper > .row > div {
  width: 100%;
  padding: 0;
}

body.modern-pos-page table.salesTable {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: collapse !important;
}

body.modern-pos-page table.salesTable thead th {
  height: 37px;
  padding: 7px 7px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--pos-border) !important;
  background: #f8f9fb !important;
  color: #17233c;
  font-size: 12px;
  font-weight: 700;
  vertical-align: middle;
  white-space: nowrap;
}

body.modern-pos-page table.salesTable tbody td {
  height: 56px;
  padding: 6px 7px !important;
  border: 0 !important;
  border-bottom: 1px solid #e7ebf1 !important;
  background: #fff !important;
  color: #24324b;
  font-size: 13px;
  vertical-align: middle;
}

body.modern-pos-page table.salesTable tbody tr:hover td {
  background: #fbfdff !important;
}

body.modern-pos-page .pos-product-image {
  width: 34px;
  height: 40px;
  object-fit: contain;
}

body.modern-pos-page .pos-product-name {
  display: block;
  max-width: 160px;
  overflow: hidden;
  color: #17233c;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.modern-pos-page .pos-stock {
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

body.modern-pos-page .pos-stock.good { color: #08994b; }
body.modern-pos-page .pos-stock.low { color: #f28b00; }
body.modern-pos-page .pos-stock.critical { color: #e44347; }

body.modern-pos-page .pos-price {
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

body.modern-pos-page .addProductSale,
body.modern-pos-page .recoverButton {
  width: 29px;
  height: 29px;
  padding: 0 !important;
  border: 1px solid #c8dcf8 !important;
  border-radius: 5px !important;
  background: #f3f8ff !important;
  color: #075cca !important;
  font-size: 14px;
  line-height: 27px;
}

body.modern-pos-page .dataTables_processing {
  top: 120px !important;
  border: 1px solid #dce3ec;
  background: rgba(255,255,255,.96);
  color: #4d5a70;
}

body.modern-pos-page .pos-catalog-body .dataTables_wrapper > .row:last-child {
  flex: 0 0 48px;
  padding: 7px 14px;
  border-top: 1px solid var(--pos-border);
}

body.modern-pos-page .dataTables_info {
  padding-top: 7px !important;
  color: #738097;
  font-size: 12px;
}

body.modern-pos-page .dataTables_paginate {
  padding-top: 0 !important;
}

body.modern-pos-page .pagination {
  margin: 0 !important;
}

body.modern-pos-page .pagination > li > a,
body.modern-pos-page .pagination > li > span {
  min-width: 30px;
  height: 31px;
  padding: 6px 8px;
  border-color: #dbe2eb;
  color: #536177;
  font-size: 12px;
  text-align: center;
}

body.modern-pos-page .pagination > .active > a,
body.modern-pos-page .pagination > .active > span {
  border-color: var(--pos-blue);
  background: var(--pos-blue);
  color: #fff;
}

body.modern-pos-page .pos-status-bar {
  position: fixed;
  z-index: 1030;
  right: 0;
  bottom: 0;
  left: 230px;
  display: grid;
  grid-template-columns: 1.4fr 1.4fr .8fr .8fr;
  align-items: center;
  height: 42px;
  padding: 0 18px;
  border-top: 1px solid var(--pos-border);
  background: #fff;
  color: #758197;
  font-size: 12px;
}

body.modern-pos-page.sidebar-collapse .pos-status-bar {
  left: 50px;
}

body.modern-pos-page .pos-status-bar span:nth-child(n+3) {
  text-align: right;
}

body.modern-pos-page .pos-status-bar i {
  margin-right: 7px;
  color: #26466d;
  font-size: 13px;
}

body.modern-pos-page .pos-status-bar strong {
  margin-left: 3px;
  color: #56657b;
  font-weight: 600;
}

@media (max-width: 1080px) {
  body.modern-pos-page { overflow: auto; }
  body.modern-pos-page .modern-pos-content { height: auto; }
  body.modern-pos-page .modern-pos-layout { display: block; }
  body.modern-pos-page .pos-receipt-column,
  body.modern-pos-page .pos-catalog-column { height: auto; }
  body.modern-pos-page .pos-panel {
    height: auto;
    min-height: 650px;
  }
  body.modern-pos-page .pos-status-bar { position: static; }
}

@media (max-width: 620px) {
  body.modern-pos-page .pos-sale-meta,
  body.modern-pos-page .pos-sale-review { grid-template-columns: 1fr; }
  body.modern-pos-page .pos-notes {
    border-right: 0;
    border-bottom: 1px solid var(--pos-border);
  }
  body.modern-pos-page .pos-cart-table-header { display: none; }
  body.modern-pos-page .pos-cart-row {
    grid-template-columns: 1.8fr 74px 50px;
    row-gap: 7px;
  }
  body.modern-pos-page .pos-cart-unit-price,
  body.modern-pos-page .pos-cart-discount,
  body.modern-pos-page .pos-cart-vat,
  body.modern-pos-page .pos-cart-subtotal { grid-row: 2; }
  body.modern-pos-page .pos-cart-actions,
  body.modern-pos-page .pos-payment-methods { grid-template-columns: 1fr 1fr; }
  body.modern-pos-page .pos-catalog-search-row { grid-template-columns: 1fr; }
}