/* Phase H.3 — POS Mobile/Tablet Refactor */

body.pos-mode .header-nav .nav-link.nav-icon {
  white-space: nowrap;
}

body.pos-mode .sale-create-page .pagetitle {
  margin-bottom: .75rem;
}

body.pos-mode .sale-create-page .card {
  overflow: hidden;
}

body.pos-mode .sale-create-page .card-body {
  padding: 1rem;
}

body.pos-mode .sale-create-page .cash-session-alert,
body.pos-mode .sale-create-page .sale-cash-session-alert,
body.pos-mode .sale-create-page .alert-success {
  border-radius: 16px;
}

body.pos-mode .sale-create-page .cash-session-alert .btn,
body.pos-mode .sale-create-page .sale-cash-session-alert .btn,
body.pos-mode .sale-create-page .alert-success .btn {
  min-height: 42px;
}

body.pos-mode .sale-create-page #wholeproducts-container {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-content: flex-start;
}

body.pos-mode .sale-create-page #wholeproducts-container .product-container {
  margin-bottom: 0 !important;
}

body.pos-mode .sale-create-page #wholeproducts-container .card {
  border-radius: 16px;
  border: 1px solid #e8eef9;
  box-shadow: 0 4px 14px rgba(1, 41, 112, .05);
}

body.pos-mode .sale-create-page #wholeproducts-container .card-body {
  padding: .85rem;
}

body.pos-mode .sale-create-page #wholeproducts-container .card-title {
  font-size: .95rem;
  line-height: 1.35;
  min-height: 2.6em;
  margin-bottom: .5rem;
}

body.pos-mode .sale-create-page #wholeproducts-container .badge {
  font-size: .78rem;
}

body.pos-mode .sale-create-page #wholeproducts-container .card-img-top {
  height: 108px;
  padding: .75rem .75rem 0;
  object-fit: contain;
}

body.pos-mode .sale-create-page .table-responsive {
  border-radius: 14px;
  border: 1px solid #eef2fb;
}

body.pos-mode .sale-create-page .table thead th {
  font-size: .88rem;
}

body.pos-mode .sale-create-page .table tbody td {
  font-size: .9rem;
}

body.pos-mode .sale-create-page .form-control,
body.pos-mode .sale-create-page .form-select,
body.pos-mode .sale-create-page .btn {
  min-height: 46px;
}

body.pos-mode .sale-create-page .btn.w-100 {
  min-height: 50px;
  font-size: 1rem;
}

body.pos-mode .sale-create-page #category-filter {
  min-height: 46px;
  border-radius: 14px;
}

body.pos-mode .sale-create-page #sales_barcode_input {
  min-height: 48px;
}

@media (max-width: 1199.98px) {
  body.pos-mode .sale-create-page .pos-layout-row {
    row-gap: 1rem;
  }

  body.pos-mode .sale-create-page .pos-side-panel,
  body.pos-mode .sale-create-page .pos-main-panel {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
  }

  body.pos-mode .sale-create-page .pos-side-panel {
    order: 1 !important;
  }

  body.pos-mode .sale-create-page .pos-main-panel {
    order: 2 !important;
  }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
  body.pos-mode .sale-create-page .pos-side-panel {
    position: sticky;
    top: 86px;
    align-self: flex-start;
  }

  body.pos-mode .sale-create-page #wholeproducts-container .product-container {
    width: calc(33.333% - .5rem);
  }
}

@media (max-width: 767.98px) {
  body.pos-mode #header .logo span,
  body.pos-mode #header .header-nav .nav-link.nav-icon:not(.dropdown-toggle):not(.notifications-trigger) {
    font-size: 0;
  }

  body.pos-mode #header .header-nav .nav-link.nav-icon i,
  body.pos-mode #header .toggle-sidebar-btn {
    font-size: 1.35rem;
  }

  body.pos-mode #header .header-nav ul {
    gap: .2rem;
  }

  body.pos-mode #header .header-nav .nav-link.nav-icon {
    padding: .45rem .5rem;
    min-width: 38px;
    justify-content: center;
  }

  body.pos-mode .sale-create-page .pagetitle h1 {
    font-size: 1.55rem;
  }

  body.pos-mode .sale-create-page .breadcrumb {
    font-size: .85rem;
    row-gap: .25rem;
  }

  body.pos-mode .sale-create-page .cash-session-alert,
  body.pos-mode .sale-create-page .sale-cash-session-alert,
  body.pos-mode .sale-create-page .alert-success {
    display: block !important;
  }

  body.pos-mode .sale-create-page .cash-session-alert > div + div,
  body.pos-mode .sale-create-page .sale-cash-session-alert > div + div,
  body.pos-mode .sale-create-page .alert-success > div + div {
    margin-top: .75rem;
  }

  body.pos-mode .sale-create-page .cash-session-alert .btn,
  body.pos-mode .sale-create-page .sale-cash-session-alert .btn,
  body.pos-mode .sale-create-page .alert-success .btn {
    width: 100%;
  }

  body.pos-mode .sale-create-page .cash-session-alert .btn + .btn,
  body.pos-mode .sale-create-page .sale-cash-session-alert .btn + .btn,
  body.pos-mode .sale-create-page .alert-success .btn + .btn {
    margin-top: .5rem;
  }

  body.pos-mode .sale-create-page .card-body {
    padding: .9rem;
  }

  body.pos-mode .sale-create-page .form-group.mt-2,
  body.pos-mode .sale-create-page .col-md-3.mt-2,
  body.pos-mode .sale-create-page .col-md-4.mt-2,
  body.pos-mode .sale-create-page .col-md-6.mt-3 {
    margin-top: .75rem !important;
  }

  body.pos-mode .sale-create-page #wholeproducts-container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    padding: .75rem;
  }

  body.pos-mode .sale-create-page #wholeproducts-container .product-container {
    width: 100%;
  }

  body.pos-mode .sale-create-page #wholeproducts-container .card-img-top {
    height: 88px;
  }

  body.pos-mode .sale-create-page #wholeproducts-container .card-title {
    font-size: .88rem;
  }

  body.pos-mode .sale-create-page .table-responsive table {
    min-width: 720px;
  }

  body.pos-mode .sale-create-page .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.pos-mode .sale-create-page .modal-dialog {
    margin: .5rem;
  }

  body.pos-mode .sale-create-page .modal-content,
  body.pos-mode .sale-create-page .modal-content-new {
    border-radius: 16px;
  }
}

@media (max-width: 479.98px) {
  body.pos-mode .sale-create-page #wholeproducts-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem;
  }

  body.pos-mode .sale-create-page #wholeproducts-container .badge {
    font-size: .72rem;
  }

  body.pos-mode .sale-create-page .cash-session-alert strong,
  body.pos-mode .sale-create-page .sale-cash-session-alert strong {
    display: block;
    margin-bottom: .2rem;
  }
}