/* ============================================================================
   ASYONG'S POS - Custom Stylesheet
   Responsive, tablet-optimized (Android tablets & iPads), touch-friendly.
   Built on top of Bootstrap 5.
   ============================================================================ */

:root{
  --asy-primary:#d92f2f;     /* sizzling red */
  --asy-primary-dark:#b81f1f;
  --asy-accent:#f6a623;      /* tapsi gold */
  --asy-dark:#2b2b2b;
  --asy-light:#f7f5f2;
  --asy-success:#2e8b57;
  --asy-danger:#c0392b;
  --asy-muted:#8a8a8a;
}

*{ -webkit-tap-highlight-color: rgba(0,0,0,0); }

body{
  background:var(--asy-light);
  font-family:"Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  font-size:1rem;
}

/* ---------- Navbar ---------- */
.app-navbar{
  background:linear-gradient(90deg,var(--asy-primary),var(--asy-primary-dark));
  box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.app-navbar .navbar-brand{ font-size:1.15rem; letter-spacing:.3px; display:flex; align-items:center; gap:.45rem; }
.brand-logo{
  width:32px; height:32px; object-fit:contain; border-radius:.35rem;
  background:#fff; padding:2px;
}
.app-navbar .nav-link{
  font-weight:600;
  padding:.55rem 1rem !important;
  border-radius:.5rem;
  margin:0 .1rem;
  font-size:1rem;
}
.app-navbar .nav-link.active{
  background:rgba(255,255,255,.18);
}
.app-navbar .nav-link:hover{ background:rgba(255,255,255,.12); }
.role-badge{
  background:var(--asy-accent);
  color:#3a2a00;
  font-size:.7rem;
  padding:.2rem .45rem;
  border-radius:.4rem;
}

/* ---------- Layout ---------- */
.app-container{ padding:.5rem; }

/* ---------- Cards ---------- */
.card{
  border:1px solid #e6e6e6;
  border-radius:.75rem;
  box-shadow:0 1px 3px rgba(0,0,0,.05);
}
.card-header{
  background:#fff;
  border-bottom:2px solid var(--asy-primary);
  font-weight:700;
}

/* ---------- Stat cards (dashboard) ---------- */
.stat-card{
  border-radius:.85rem;
  color:#fff;
  padding:1.25rem;
  position:relative;
  overflow:hidden;
}
.stat-card .stat-icon{
  position:absolute; right:.6rem; bottom:.3rem; font-size:3rem; opacity:.25;
}
.stat-card h2{ font-weight:800; margin:.25rem 0; font-size:1.9rem; }
.stat-card .stat-label{ text-transform:uppercase; letter-spacing:1px; font-size:.75rem; opacity:.9; }
.bg-sales{ background:linear-gradient(135deg,#d92f2f,#b81f1f); }
.bg-orders{ background:linear-gradient(135deg,#2e8b57,#1f6b41); }
.bg-tables{ background:linear-gradient(135deg,#f6a623,#d68910); }
.bg-lowstock{ background:linear-gradient(135deg,#6c757d,#495057); }

/* ---------- Tables grid (POS) ---------- */
.table-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(110px,1fr));
  gap:.35rem;
  align-content:start;
  grid-auto-rows:max-content;
}
.table-header-title{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.table-header-actions{ flex-shrink:0; }
.table-header-actions .btn{ white-space:nowrap; }
.table-search-box{ width:clamp(120px, 18vw, 210px); flex:0 1 auto; }
.table-search-empty{ grid-column:1 / -1; }
.quick-order-selector-grid{
  max-height:min(52vh, 430px);
  overflow-y:auto;
  padding:.25rem;
  border:1px solid #e5e5e5;
  border-radius:.5rem;
  background:#fafafa;
}
.quick-order-selector-grid .table-actions{ display:none; }
.quick-order-service-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.quick-order-service-actions .btn{
  min-width:120px;
  font-weight:700;
}
.table-card-shell{
  min-width:0;
  position:relative;
  display:flex;
  flex-direction:column;
}
.table-card-shell.has-actions .table-card{
  height:68px;
  min-height:68px;
  max-height:68px;
  padding-top:.25rem;
  overflow:hidden;
}
.table-card{
  border:2px solid #e0e0e0;
  border-radius:.6rem;
  padding:.25rem .25rem;
  background:#fff;
  text-align:center;
  line-height:1.05;
  cursor:pointer;
  transition:transform .08s, box-shadow .15s;
  min-height:68px;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
}
.table-card:hover{ box-shadow:0 3px 10px rgba(0,0,0,.12); transform:translateY(-1px); }
.table-card:active{ transform:scale(.97); }
.table-card.selected{ box-shadow:0 0 0 3px rgba(33,37,41,.22), 0 3px 10px rgba(0,0,0,.14); transform:translateY(-1px); }
.table-card .tnum{ font-size:.95rem; font-weight:800; }
.table-card .tstat{ font-size:.62rem; margin-top:.08rem; }
.table-card.available{ border-color:#2e8b57; background:#eafaf1; color:#1f6b41; }
.table-card.occupied{ border-color:#f6a623; background:#fff7e6; color:#9c6406; }
.table-card.service-delivery{ border-color:#4d8bd8; background:#eef5ff; color:#245b9b; }
.table-card.service-pickup{ border-color:#d63384; background:#fce4ec; color:#a61e4d; }
.table-card.service-takeout{ border-color:#8b6fc4; background:#f5f0ff; color:#5d3d91; }
/* Apply the occupied palette only while a service card has an open order. */
.table-card.occupied.service-order-card{
  border-color:#f6a623;
  background:#fff7e6;
  color:#9c6406;
}
.table-card .order-no{ font-size:.52rem; color:#777; margin-top:.08rem; }
.table-card .order-summary{ font-size:.56rem; color:#6c4c0b; margin-top:.08rem; font-weight:600; }
.table-card .order-action{ font-size:.54rem; margin-top:.1rem; font-weight:800; text-decoration:underline; }
.table-actions{
  position:absolute;
  top:.3rem;
  left:.3rem;
  z-index:5;
}
.table-menu{
  display:flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  padding:0;
  border:1px solid rgba(90,90,90,.28);
  border-radius:50%;
  background:rgba(255,255,255,.88);
  color:#555;
  cursor:pointer;
}
.table-menu:hover,.table-menu[aria-expanded="true"]{ background:#fff; color:#212529; box-shadow:0 1px 4px rgba(0,0,0,.16); }
.table-menu-dropdown{
  position:absolute;
  top:calc(100% + .25rem);
  left:0;
  min-width:132px;
  padding:.25rem;
  border:1px solid #ddd;
  border-radius:.45rem;
  background:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.18);
  text-align:left;
}
.table-menu-item{
  display:flex;
  align-items:center;
  gap:.45rem;
  width:100%;
  padding:.45rem .55rem;
  border:0;
  border-radius:.3rem;
  background:#fff;
  color:#444;
  font-size:.78rem;
  text-align:left;
  cursor:pointer;
}
.table-menu-item:hover{ background:#f5f5f5; }
.table-menu-item.table-edit:hover{ color:#0d6efd; }
.table-menu-item.table-delete:hover{ color:var(--asy-danger); }
.table-menu-item.table-unoccupy:hover{ color:var(--asy-success); }
.table-menu-item.service-edit:hover{ color:#0d6efd; }
.table-menu-item.service-delete:hover{ color:var(--asy-danger); }
.table-menu-item.service-unoccupy:hover{ color:var(--asy-success); }

/* ---------- Category tabs (POS) ---------- */
.cat-tabs{
  display:flex; flex-wrap:wrap; gap:.15rem; margin-bottom:.2rem;
}
.cat-tab{
  border:1px solid var(--asy-primary);
  background:#fff; color:var(--asy-primary);
  border-radius:999px;
  padding:.14rem .45rem;
  font-weight:700; font-size:.7rem; line-height:1.15;
  cursor:pointer; transition:all .12s;
}
.cat-tab:hover{ background:var(--asy-primary); color:#fff; }
.cat-tab.active{ background:var(--asy-primary); color:#fff; }
.cat-tab.all{ border-color:var(--asy-dark); color:var(--asy-dark); }
.cat-tab.all.active{ background:var(--asy-dark); color:#fff; }

/* ---------- Product grid (POS) ---------- */
body.pos-kiosk-mode:not(.pos-normal-mode) .app-navbar{
  display:none;
}
.pos-mode-toggle{
  position:fixed;
  top:.45rem;
  right:.55rem;
  z-index:1100;
  width:32px;
  height:32px;
  padding:0;
  border:1px solid #d7d7d7;
  border-radius:.45rem;
  background:#fff;
  color:var(--asy-dark);
  box-shadow:0 2px 8px rgba(0,0,0,.18);
  font-size:1.1rem;
  line-height:1;
}
.pos-mode-toggle:hover,
.pos-mode-toggle:focus-visible{
  background:var(--asy-primary);
  border-color:var(--asy-primary);
  color:#fff;
}
.product-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(110px,1fr));
  gap:.4rem;
  align-content:start;
  grid-auto-rows:max-content;
}
.menu-header-row,
.menu-header-main,
.menu-header-tools{ min-width:0; }
.menu-header-title{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.menu-header-main{
  flex:0 1 auto;
  overflow:hidden;
}
.menu-header-tools{
  flex:1 1 auto;
  min-width:0;
}
.pos-business-actions{
  flex:0 1 auto;
  overflow:hidden;
}
.pos-business-actions .btn{
  flex:0 0 auto;
  white-space:nowrap;
  padding:.2rem .38rem;
  font-size:.72rem;
  line-height:1.15;
}
.pos-business-actions i{
  font-size:.78rem;
}
.menu-table-selector{
  display:none;
  align-items:center;
  gap:.25rem;
  color:#555;
  white-space:nowrap;
  font-size:.72rem;
  position:relative;
}
.menu-table-selector label{
  font-weight:700;
  margin:0;
}
.menu-table-selector .form-select{
  width:clamp(100px, 12vw, 145px);
  min-width:0;
  padding:.16rem 1.45rem .16rem .35rem;
  font-size:.7rem;
}
.menu-table-selector .form-select option.table-option-occupied{
  color:#b42318;
  background:#fff1f0;
  font-weight:700;
}
.menu-table-selector .form-select option.table-option-available{
  color:#1f6b41;
  background:#eafaf1;
  font-weight:700;
}
.menu-table-picker{
  display:none;
  align-items:center;
  justify-content:space-between;
  gap:.35rem;
  width:clamp(100px, 12vw, 145px);
  min-width:0;
  min-height:27px;
  padding:.16rem .35rem;
  border:1px solid #ced4da;
  border-radius:.375rem;
  background:#fff;
  color:#495057;
  font:inherit;
  font-size:.7rem;
  line-height:1.5;
  text-align:left;
  cursor:pointer;
}
.menu-table-picker > i{
  flex:0 0 auto;
  font-size:.65rem;
}
.menu-table-selector.custom-picker-ready .form-select{
  display:none;
}
.menu-table-selector.custom-picker-ready .menu-table-picker{
  display:flex;
}
.menu-table-picker.table-option-occupied{
  border-color:#f0a4a0;
  background:#fff1f0;
  color:#b42318;
  font-weight:700;
}
.menu-table-picker.table-option-available{
  border-color:#8fd1aa;
  background:#eafaf1;
  color:#1f6b41;
  font-weight:700;
}
.menu-table-picker-label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.menu-table-picker-options{
  position:absolute;
  top:calc(100% + .25rem);
  right:0;
  z-index:1080;
  width:max(100%, 180px);
  max-height:min(60vh, 320px);
  overflow-y:auto;
  padding:.25rem;
  border:1px solid #ced4da;
  border-radius:.45rem;
  background:#fff;
  box-shadow:0 5px 18px rgba(0,0,0,.2);
}
.menu-table-picker-option{
  display:flex;
  align-items:center;
  width:100%;
  min-height:32px;
  gap:.45rem;
  padding:.35rem .45rem;
  border:0;
  border-radius:.3rem;
  background:#fff;
  color:#495057;
  font:inherit;
  font-size:.72rem;
  line-height:1.25;
  text-align:left;
  cursor:pointer;
}
.menu-table-picker-option:hover,
.menu-table-picker-option:focus-visible{
  outline:0;
  background:#f2f4f6;
}
.menu-table-picker-option.table-option-occupied{
  background:#fff1f0;
  color:#b42318;
  font-weight:700;
}
.menu-table-picker-option.table-option-occupied:hover,
.menu-table-picker-option.table-option-occupied:focus-visible{
  background:#ffe1df;
}
.menu-table-picker-option.table-option-available{
  background:#eafaf1;
  color:#1f6b41;
  font-weight:700;
}
.menu-table-picker-option.table-option-available:hover,
.menu-table-picker-option.table-option-available:focus-visible{
  background:#d7f3e2;
}
.menu-table-picker-option[aria-selected="true"]{
  box-shadow:inset 0 0 0 2px currentColor;
}
.menu-table-picker-option:disabled{
  opacity:.55;
  cursor:default;
}
.menu-table-picker-status{
  flex:0 0 auto;
  width:.55rem;
  height:.55rem;
  border-radius:50%;
  background:#adb5bd;
}
.menu-table-picker-option.table-option-occupied .menu-table-picker-status{
  background:#b42318;
}
.menu-table-picker-option.table-option-available .menu-table-picker-status{
  background:#1f6b41;
}
.menu-table-picker-option-label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.pos-menu-cart-fullscreen .menu-table-selector{
  display:flex;
}
.notes-toggle{
  white-space:nowrap;
  color:#555;
  font-size:.78rem;
  cursor:pointer;
}
.notes-toggle .form-check-input{
  cursor:pointer;
  width:1.8em;
  height:1em;
}
.product-search-box{
  flex:0 1 clamp(180px, 35vw, 380px);
  width:clamp(180px, 35vw, 380px);
  min-width:180px;
}
.product-search-clear{
   width:2.15rem;
   min-width:2.15rem;
   justify-content:center;
   padding:.25rem .35rem;
   border:1px solid var(--bs-border-color);
   border-right:0;
   border-radius:.25rem 0 0 .25rem;
   background:#fff;
   color:#6c757d;
   cursor:pointer;
}
.product-search-clear:hover:not(:disabled),
.product-search-clear:focus-visible:not(:disabled){
   background:#fff5f5;
   color:#dc3545;
}
.product-search-clear:disabled{
   cursor:default;
   opacity:.55;
}
.product-card{
  border:1px solid #e6e6e6;
  border-radius:.65rem;
  padding:0 0 .3rem;
  background:#fff;
  text-align:center;
  cursor:pointer;
  transition:transform .08s, box-shadow .12s;
  display:flex; flex-direction:column; justify-content:space-between;
  min-height:96px;
}
.product-card:hover{ box-shadow:0 3px 10px rgba(0,0,0,.12); transform:translateY(-1px); }
.product-card:active{ transform:scale(.96); }
.product-card .pname,
.product-card .pprice,
.product-card .pstock{ margin-left:.55rem; margin-right:.55rem; }
.product-card .pname{ font-weight:700; font-size:.76rem; line-height:1.1; min-height:2.2em; }
.product-card .pprice{ color:var(--asy-primary); font-weight:800; font-size:.86rem; margin-top:.1rem; }
.product-card .pstock{ font-size:.58rem; color:#777; margin-top:.05rem; }
.product-card .product-photo{
  width:100%;
  height:36px;
  object-fit:cover;
  object-position:center;
  padding:0;
  border-radius:.6rem .6rem .25rem .25rem;
  background:#f0f0f0;
  margin-bottom:.12rem;
}
.product-card .product-photo-button{
  width:100%;
  display:block;
  padding:0;
  border:0;
  background:transparent;
  line-height:0;
  cursor:zoom-in;
}
.product-card .product-photo-button:focus-visible{
  outline:2px solid var(--asy-primary);
  outline-offset:2px;
  border-radius:.45rem;
}
.product-card .product-photo-empty{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#b8b8b8;
  font-size:1.7rem;
}
.product-list-photo{
  width:48px;
  height:38px;
  object-fit:contain;
  object-position:center;
  padding:1px;
  border-radius:.35rem;
  background:#f0f0f0;
}
.product-image-preview{
  min-height:30px;
}
.product-image-preview-img{
  width:120px;
  height:80px;
  object-fit:contain;
  object-position:center;
  padding:2px;
  border-radius:.45rem;
  border:1px solid #ddd;
  background:#f0f0f0;
}
.product-photo-modal-content{
  background:#fff;
  width:fit-content;
  max-width:100%;
}
.product-photo-modal-body{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:0;
  padding:0;
  background:#fff;
}
.product-photo-modal-footer{
  justify-content:space-between;
  gap:.5rem;
}
.product-photo-modal-dialog{
  width:fit-content;
  max-width:calc(100vw - 1rem);
  margin:.5rem auto;
}
.product-photo-zoom{
  display:block;
  width:auto;
  height:auto;
  max-width:calc(100vw - 1rem);
  max-height:calc(100vh - 5rem);
  object-fit:contain;
  object-position:center;
}
.product-card.out{ opacity:.55; cursor:not-allowed; background:#f5f5f5; }
.product-card.low .pstock{ color:var(--asy-danger); font-weight:700; }

/* ---------- Cart panel ---------- */
.cart-panel{
  background:#fff; border:1px solid #e6e6e6; border-radius:.75rem;
  display:flex; flex-direction:column; height:calc(100vh - 150px); min-height:480px;
}

/* ---------- Compact two-section POS workspace ---------- */
@media (min-width:992px){
  .pos-layout{
    height:calc(100vh - 1rem);
    max-height:calc(100vh - 1rem);
    align-items:stretch;
  }
  body.pos-kiosk-mode.pos-normal-mode .pos-layout{
    height:calc(100vh - 5.5rem);
    max-height:calc(100vh - 5.5rem);
  }
  .pos-left-pane{
    display:grid;
    grid-template-rows:minmax(0, 1fr) minmax(0, 1fr);
    gap:.5rem;
    height:100%;
    min-height:0;
  }
  .pos-section{
    display:flex;
    flex-direction:column;
    height:100%;
    min-height:0;
    overflow:hidden;
  }
  .pos-tables-section,
  .pos-menu-section{
    margin-bottom:0 !important;
  }
  .pos-section-body{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
  }
.pos-fullscreen-btn{
  flex:0 0 auto;
  line-height:1;
}
  .pos-cart-pane{
    display:flex;
    min-height:0;
  }
  .pos-cart-pane .cart-panel{
    width:100%;
    height:100%;
    min-height:0;
  }
}

@media (max-width:991.98px){
  .pos-section-body{
    overflow-y:visible;
  }
}

/* A section can temporarily take over the whole workspace without
   navigating away from the POS screen. Press Escape or the same button
   again to return to the two-section layout. */
body.pos-section-mode-active{
  overflow:hidden;
}
/* Keep Bootstrap dialogs usable above the in-page POS fullscreen workspace. */
body.pos-section-mode-active .modal-backdrop{
  z-index:1070;
}
body.pos-section-mode-active .modal{
  z-index:1075;
}
.pos-section-fullscreen{
  display:flex !important;
  flex-direction:column;
  position:fixed !important;
  inset:.5rem !important;
  z-index:1060;
  width:auto !important;
  height:calc(100vh - 1rem) !important;
  max-height:none !important;
  margin:0 !important;
  background:#fff;
  border-radius:.75rem;
  box-shadow:0 8px 30px rgba(0,0,0,.28);
}
.pos-section-fullscreen .pos-section-body{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
}
.pos-section-fullscreen .card-header{
  flex:0 0 auto;
}

/* Menu fullscreen keeps the cart visible beside the menu. The tables section
   is temporarily hidden so the menu and cart can use the full viewport. */
.pos-menu-cart-fullscreen{
  position:fixed !important;
  inset:.5rem !important;
  z-index:1060;
  width:auto !important;
  height:calc(100vh - 1rem) !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 .25rem !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:stretch !important;
  overflow:hidden;
}
.pos-menu-cart-fullscreen .pos-left-pane{
  display:block !important;
  flex:1 1 0 !important;
  width:auto !important;
  max-width:none !important;
  height:100%;
  min-width:0;
}
.pos-menu-cart-fullscreen .pos-tables-section{
  display:none !important;
}
.pos-menu-cart-fullscreen .pos-menu-section{
  display:flex !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
}
.pos-menu-cart-fullscreen .pos-cart-pane{
  display:flex !important;
  flex:0 0 34% !important;
  width:34% !important;
  max-width:34% !important;
  height:100%;
  min-width:0;
}
.pos-menu-cart-fullscreen .pos-cart-pane .cart-panel{
  width:100%;
  height:100%;
  min-height:0;
}

@media (max-width:767.98px){
  .pos-menu-cart-fullscreen{
    flex-direction:column !important;
    overflow-y:hidden;
  }
  .pos-menu-cart-fullscreen .pos-left-pane{
    flex:0 0 58% !important;
    width:100% !important;
    height:58%;
  }
  .pos-menu-cart-fullscreen .pos-cart-pane{
    flex:1 1 auto !important;
    width:100% !important;
    max-width:none !important;
    height:auto;
  }
}

/* Tighten the POS section chrome so more rows stay visible. */
.pos-tables-section > .card-header,
.pos-menu-section > .card-header{
  padding:.3rem .55rem !important;
}
.pos-tables-section > .pos-section-body,
.pos-menu-section > .pos-section-body{
  padding:.35rem !important;
}
.pos-menu-section .menu-header-row{
  line-height:1.1;
}
.pos-menu-section .menu-header-tools{
  gap:.3rem !important;
}
.pos-menu-section .notes-toggle{
  font-size:.7rem;
}
.cart-header{
  background:var(--asy-dark); color:#fff; border-radius:.7rem .7rem 0 0;
  padding:.7rem 1rem; font-weight:700; display:flex; justify-content:space-between; align-items:center;
}
.cart-items{ flex:1; overflow-y:auto; padding:.5rem; }
.order-discount-total{ color:var(--asy-danger); }
.cart-item{
  border-bottom:1px dashed #eee; padding:.35rem 0; display:block;
}
.cart-item-main{
  display:grid; grid-template-columns:minmax(0,1fr) auto auto auto auto;
  gap:.35rem; align-items:center; min-width:0;
}
.cart-item .ci-name{
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-weight:600; font-size:.9rem;
  cursor:pointer;
}
.cart-name-tooltip{
  position:fixed; z-index:1080; transform:translateX(-50%);
  max-width:min(82vw,360px); padding:.55rem .75rem;
  background:var(--asy-dark); color:#fff; border-radius:.45rem;
  box-shadow:0 .35rem 1rem rgba(0,0,0,.24);
  font-size:.85rem; font-weight:600; line-height:1.25;
  text-align:center; white-space:normal; overflow-wrap:anywhere;
  pointer-events:none;
}
.cart-name-tooltip::after{
  content:""; position:absolute; left:50%; bottom:-6px;
  transform:translateX(-50%); border-width:6px 6px 0;
  border-style:solid; border-color:var(--asy-dark) transparent transparent;
}
.cart-name-tooltip.is-below::after{
  top:-6px; bottom:auto; border-width:0 6px 6px;
  border-color:transparent transparent var(--asy-dark);
}
.cart-item .ci-price{ color:var(--asy-primary); font-weight:700; white-space:nowrap; font-size:.9rem; }
.item-discount-control{
  display:flex; align-items:center; gap:.2rem; min-width:0;
}
.item-discount-control .item-discount-select{
  width:116px; height:30px; padding:.15rem 1.35rem .15rem .35rem;
  font-size:.72rem; white-space:nowrap;
}
.item-discount-control .item-discount-custom{
  width:52px; height:30px; padding:.15rem .25rem; font-size:.72rem;
}
.qty-control{ display:flex; align-items:center; gap:.15rem; white-space:nowrap; }
.qty-btn{
  width:30px; height:30px; border-radius:.35rem; border:none;
  background:var(--asy-primary); color:#fff; font-size:1.1rem; font-weight:700;
  cursor:pointer; line-height:1;
}
.qty-btn.minus{ background:#888; }
.cart-qty-input{
  width:42px; height:30px; padding:.15rem .2rem;
  border:1px solid #ced4da; border-radius:.35rem;
  text-align:center; font-weight:700; font-size:.85rem;
}
.cart-qty-input::-webkit-outer-spin-button,
.cart-qty-input::-webkit-inner-spin-button{
  margin:0; -webkit-appearance:none;
}
.cart-qty-input[type="number"]{ -moz-appearance:textfield; }
.cart-item-remove{ font-size:.9rem; }
.cart-footer{ padding:.8rem; border-top:2px solid #eee; background:#fafafa; border-radius:0 0 .7rem .7rem; }
.total-row{ display:flex; justify-content:space-between; font-size:1.1rem; font-weight:700; margin-bottom:.5rem; }
.total-row.grand{ font-size:1.5rem; color:var(--asy-primary); }

/* ---------- Big touch buttons ---------- */
.btn-touch{
  padding:.8rem 1.5rem; font-size:1.1rem; font-weight:700; border-radius:.6rem;
}
.btn-pay{
  background:var(--asy-success); color:#fff; border:none;
  width:100%; padding:1rem; font-size:1.3rem; font-weight:800; border-radius:.6rem;
}
.btn-pay:hover{ background:#267a4d; color:#fff; }
.btn-pay:disabled{ background:#aaa; }
.btn-void{ background:var(--asy-danger); color:#fff; }
.btn-add{ background:var(--asy-primary); color:#fff; }

/* ---------- Low stock badge ---------- */
.badge-lowstock{ background:var(--asy-danger); color:#fff; }
.badge-ok{ background:var(--asy-success); color:#fff; }
.badge-out{ background:#aaa; color:#fff; }
.badge-stock-in{ background:#198754; color:#fff; }
.badge-stock-out{ background:#e76f00; color:#fff; }

/* ---------- Reports ---------- */
.reports-container{
  width:100%;
  max-width:1600px;
  margin:0 auto;
}
.report-tab-toolbar{
  border-color:#e1e1e1;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.report-tab-toolbar .card-body{
  padding:.8rem;
}
.report-toolbar-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  margin-bottom:.75rem;
}
.report-toolbar-title{
  color:var(--asy-dark);
  font-weight:800;
}
.report-quick-links{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:.35rem;
}
.report-quick-links-label{
  color:#777;
  font-size:.75rem;
  font-weight:700;
  margin-right:.15rem;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.report-quick-links .btn{
  white-space:nowrap;
}
.report-toolbar-form{
  border-top:1px solid #eee;
  padding-top:.75rem;
}
.report-tabs{
  border-bottom:2px solid var(--asy-primary);
}
.report-tabs .nav-link{
  color:var(--asy-dark);
  font-weight:700;
  border:0;
  border-radius:.55rem .55rem 0 0;
  padding:.75rem 1.15rem;
}
.report-tabs .nav-link:hover{
  color:var(--asy-primary);
  background:#fff;
}
.report-tabs .nav-link.active{
  color:#fff;
  background:var(--asy-primary);
}
@media (max-width:767.98px){
  .report-toolbar-heading{
    align-items:flex-start;
    flex-direction:column;
  }
  .report-quick-links{
    justify-content:flex-start;
  }
  .report-quick-links-label{
    width:100%;
  }
}
.inventory-report-table{
  min-width:980px;
}
.inventory-report-table th{
  white-space:nowrap;
  font-size:.82rem;
}
.inventory-report-table td{
  white-space:nowrap;
}

/* ---------- Login ---------- */
.login-wrapper{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--asy-primary),var(--asy-primary-dark));
  padding:1rem;
}
.login-card{
  background:#fff; border-radius:1rem; padding:2.25rem; width:100%; max-width:420px;
  box-shadow:0 10px 40px rgba(0,0,0,.3);
}
.login-logo{
  text-align:center; font-size:2.6rem; color:var(--asy-primary); margin-bottom:.2rem;
}
.login-logo-image{
  display:block; width:70px; height:70px; object-fit:contain;
  border-radius:50%; background:#fff; padding:5px; margin:0 auto;
}
.login-logo + h3{ text-align:center; font-weight:800; }

.settings-logo-preview,
.settings-logo-placeholder{
  width:84px; height:84px; object-fit:contain; border-radius:.65rem;
  border:1px solid #dee2e6; background:#fff; padding:6px;
}
.settings-logo-placeholder{
  display:flex; align-items:center; justify-content:center;
  color:#adb5bd; font-size:2rem;
}

/* ---------- Permission matrix ---------- */
.perm-matrix th, .perm-matrix td{ text-align:center; vertical-align:middle; }
.perm-allow{ color:var(--asy-success); }
.perm-deny{ color:var(--asy-danger); }
.perm-none{ color:#bbb; }
.form-switch.form-switch-lg .form-check-input{ width:2.6em; height:1.4em; cursor:pointer; }

/* ---------- Receipt ---------- */
.receipt-paper{
  width:80mm; background:#fff; color:#000; padding:6px 8px;
  font-family:"Courier New", monospace; font-size:11px; line-height:1.35;
}
.receipt-paper.w58{ width:58mm; font-size:10px; }
.receipt-paper .center{ text-align:center; }
.receipt-paper .right{ text-align:right; }
.receipt-paper hr{ border:none; border-top:1px dashed #000; margin:4px 0; }
.receipt-paper h3{ font-size:14px; margin:2px 0; font-weight:800; }
.receipt-paper table{ width:100%; border-collapse:collapse; }
.receipt-paper td{ padding:1px 0; vertical-align:top; }
@media print{
  /*
   * Reports are printed on legal/folio paper. Keep the screen layout
   * untouched, but use a denser print layout so long lists stay readable
   * and fit more rows on each sheet.
   */
  @page{
    margin:0;
  }
  @page report-portrait{
    size:8.5in 13in;
    margin:.25in;
  }
  @page report-landscape{
    size:13in 8.5in;
    margin:.25in;
  }

  body.receipt-print-page *{ visibility:hidden; }
  body.receipt-print-page #receipt-area,
  body.receipt-print-page #receipt-area *{ visibility:visible; }
  body.receipt-print-page #receipt-area{ position:absolute; left:0; top:0; }

  body.report-page *{ visibility:hidden; }
  body.report-page #report-area,
  body.report-page #report-area *{ visibility:visible; }
  body.report-page #report-area.report-print-area{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
  }
  body.report-page #report-area.report-print-sales{
    page:report-portrait;
  }
  body.report-page #report-area.report-print-inventory{
    page:report-landscape;
  }
  body.report-page #report-area .d-print-none,
  body.report-page #report-area .pagination,
  body.report-page #report-area .report-tabs,
  body.report-page #report-area .report-subtabs,
  body.report-page #report-area .btn{
    display:none !important;
  }

  body.report-page #report-area .row{
    --bs-gutter-x:.45rem;
    --bs-gutter-y:.35rem;
  }
  body.report-page #report-area .card{
    margin-bottom:6px !important;
    border:1px solid #888;
    border-radius:0;
    box-shadow:none;
    break-inside:auto;
    page-break-inside:auto;
  }
  body.report-page #report-area .card-header{
    padding:3px 5px;
    border-bottom:1px solid #888;
    font-size:9pt;
    line-height:1.15;
  }
  body.report-page #report-area .card-body{
    padding:4px 5px;
  }
  body.report-page #report-area .table-responsive{
    overflow:visible !important;
  }
  body.report-page #report-area .table{
    width:100%;
    margin-bottom:0;
    font-size:7.5pt;
    line-height:1.1;
  }
  body.report-page #report-area .table > :not(caption) > * > *{
    padding:2px 3px;
    line-height:1.1;
  }
  body.report-page #report-area .table thead{
    display:table-header-group;
  }
  body.report-page #report-area .table tbody tr{
    break-inside:avoid;
    page-break-inside:avoid;
  }
  body.report-page #report-area .badge{
    padding:.18em .35em;
    font-size:7pt;
    line-height:1.05;
  }
  body.report-page #report-area .small{
    font-size:7pt !important;
  }
  body.report-page #report-area .stat-card{
    min-height:0;
    padding:5px 6px;
    border-radius:0;
  }
  body.report-page #report-area .stat-card h2{
    margin:1px 0;
    font-size:13pt;
    line-height:1.05;
  }
  body.report-page #report-area .stat-card .stat-label{
    font-size:6.5pt;
    letter-spacing:.5px;
  }
  body.report-page #report-area .stat-card > div:not(.stat-label){
    font-size:7pt;
    line-height:1.05;
  }
  body.report-page #report-area .stat-card .stat-icon{
    display:none;
  }
  body.report-page #report-area .inventory-report-table{
    min-width:0;
    table-layout:auto;
  }
  body.report-page #report-area .inventory-report-table th,
  body.report-page #report-area .inventory-report-table td{
    white-space:normal;
    font-size:7pt;
    padding:2px;
  }
  body.report-page #report-area h1,
  body.report-page #report-area h2,
  body.report-page #report-area h3,
  body.report-page #report-area h4{
    margin-top:3px;
    margin-bottom:3px;
  }
  body.report-page #report-area .mt-3{
    margin-top:5px !important;
  }
  body.report-page .d-print-none{ display:none !important; }

  body.report-page .page-break-before{
    break-before:page;
    page-break-before:always;
  }
}

/* ---------- Misc ---------- */
.cursor-pointer{ cursor:pointer; }
.table th{ background:#fafafa; }
.text-money{ font-variant-numeric:tabular-nums; }
.search-box{ border-radius:999px; }

/* Larger tap targets on tablets */
@media (min-width:768px){
  .btn-lg-touch{ padding:1rem 1.8rem; font-size:1.15rem; }
}

@media (max-width:575.98px){
  .cart-panel{ height:auto; min-height:380px; }
  .product-grid{ grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); }
  .table-grid{ grid-template-columns:repeat(auto-fill,minmax(100px,1fr)); }
  .table-search-box{ width:100px; }
  .table-header-actions .btn{ padding:.25rem .35rem; font-size:.75rem; }
  .product-search-box{
    flex:0 0 125px;
    width:125px;
    min-width:125px;
  }
  .notes-toggle span{ display:none; }
}

/* Keep the menu header on one compact line beside the shortcut buttons.
   On tablet widths the icons preserve the actions without taking a second row. */
@media (max-width:1199.98px){
  .menu-header-row{ gap:.35rem !important; }
  .menu-header-main{ gap:.35rem !important; }
  .menu-header-tools{ gap:.35rem !important; }
  .pos-business-actions{ gap:.2rem !important; }
  .pos-action-label{ display:none; }
  .pos-business-actions .btn{
    width:29px;
    height:28px;
    padding:.15rem 0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .pos-business-actions i{ font-size:.85rem; }
}

/* Fullscreen menu: keep the shortcut labels on one short line instead of
   stacking an icon above each label. */
.pos-menu-cart-fullscreen .menu-header-title > i,
.pos-menu-cart-fullscreen .pos-business-actions i{
  display:none;
}
.pos-menu-cart-fullscreen .pos-action-label{
  display:inline !important;
}
.pos-menu-cart-fullscreen .pos-business-actions .btn{
  width:auto;
  height:28px;
  min-width:0;
  padding:.12rem .38rem;
  line-height:1;
}