/* vitepos-restaurant-pos pos.css - UI styling only */

/* Base */
.vpr-pos{padding: 12px; font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color: #111827; box-sizing: border-box;}

.vpr-pos *{box-sizing: inherit;}

/* Top: tables + categories */
.vpr-pos__top{display: grid; gap: 8px; margin-bottom: 12px;}

/* Tables grid */
.vpr-pos__tables{display: grid; grid-template-columns: repeat(8, 1fr); gap: 8px;}

@media (max-width: 900px){.vpr-pos__tables { grid-template-columns: repeat(4, 1fr);}

}
@media (max-width: 600px){.vpr-pos__tables { grid-template-columns: repeat(3, 1fr);}

}

.vpr-table-btn{position: relative;
  padding: 10px 8px;
  border-radius: 10px;
  border: 1px solid #e6e6e9;
  background: #f3f4f6; /* default greyish */
  color: #111827;
  font-weight: 600;
  cursor: pointer;
  text-align: center;}

.vpr-table-btn .vpr-table__label{display:block; font-size:14px;}

.vpr-table-btn .vpr-table__badge{position: absolute; top: 6px; right: 8px;
  background: rgba(0,0,0,0.08); color: #111827; font-size: 11px; padding: 2px 6px; border-radius: 999px;}

/* states */
.vpr-table--empty{background: #f3f4f6; color: #374151;}

/* grey/dim */
.vpr-table--occupied{background: #e6f2ff; color: #0f172a;}

/* blue-ish */
.vpr-table--active{background: #dcfce7; color: #064e3b;}

/* green */

/* categories */
.vpr-pos__categories{display: grid; grid-auto-flow: column; gap: 8px; grid-auto-columns: minmax(80px, 1fr); overflow-x:auto; padding-bottom:6px;}

.vpr-cat-btn{padding: 8px 10px; border-radius: 8px; border: 1px solid #e6e6e9; background: #fff; font-size: 13px; cursor:pointer;
  white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}

.vpr-cat-btn--active{background: #eef2ff; border-color: #c7d2fe; color: #1e3a8a;}

/* main layout */
.vpr-pos__main{display: grid; grid-template-columns: 7fr 3fr; gap: 12px; align-items:start; min-height: 56vh;}

@media (max-width: 980px){.vpr-pos__main { grid-template-columns: 1fr;}

}

/* products grid (smaller cards) */
.vpr-pos__products{display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; padding: 6px; border-radius: 10px; background: #fff; border: 1px solid #f1f5f9;}

@media (max-width:1400px){.vpr-pos__products { grid-template-columns: repeat(7, 1fr);}

}
@media (max-width:1200px){.vpr-pos__products { grid-template-columns: repeat(4, 1fr);}

}
@media (max-width:900px){.vpr-pos__products { grid-template-columns: repeat(3, 1fr);}

}
@media (max-width:600px){.vpr-pos__products { grid-template-columns: repeat(2, 1fr);}

}

.vpr-card{border: 1px solid #e6e6e9; border-radius: 10px; padding: 8px; background: #ffffff; display:flex; flex-direction:column; gap:6px; min-height:110px;}

.vpr-card__title{font-size: 15px; font-weight: 600; height:45px; overflow:hidden; align-self:Center;}

.vpr-card__price{font-size: 15px; color: #374151;}

.vpr-card__add{align-self:flex-end; padding: 5px 8px; border-radius:8px; border:1px solid #e6e6e9; background:#fff; cursor:pointer;}

/* cart style */
.vpr-pos__cart{border: 1px solid #e6e6e9; border-radius: 10px; padding: 10px; background: #fafafa; display:flex; flex-direction:column;  position:sticky; top:12px;}

.vpr-cart__header{display:flex; justify-content:space-between; align-items:center; gap:8px;}

.vpr-cart__items{display:flex; flex-direction:column; gap:8px; max-height:50vh; overflow:auto; padding-right:6px;}

.vpr-cart__item{display:flex; justify-content:space-between; align-items:center; gap:8px; padding-bottom:6px; border-bottom:1px dashed #eef2f6;}

.vpr-cart__name{font-weight:600; font-size:15px;}

.vpr-cart__qty{display:flex; align-items:center; gap:6px;}

.vpr-cart__total{display:flex; justify-content:space-between; font-weight:700; font-size:25px;}

/* buttons */
.vpr-btn{padding:8px 10px; border-radius:8px; border:1px solid #e6e6e9; background:#487a00; cursor:pointer;}

.vpr-btn--primary{background:#2563eb; color:#fff; border-color:#1e40af;}

.vpr-btn--danger{background:#ef4444; color:#fff; border-color:#b91c1c;}

/* modal */
.vpr-modal{position:fixed; inset:0; background:rgba(0,0,0,0.45); display:none; align-items:center; justify-content:center; z-index:9999;}

.vpr-modal[aria-hidden="false"]{display:flex;}

.vpr-modal__dialog{background:#fff; border-radius:10px; width:100%; max-width:420px; border:1px solid #e6e6e9; overflow:hidden;}

.vpr-modal__header, .vpr-modal__footer{padding:12px; border-bottom:1px solid #f1f5f9; display:flex; justify-content:space-between; align-items:center;}

.vpr-modal__body{padding:12px;}

.vpr-loader{position: fixed;
  inset: 0;
  background: rgba(255,255,255,0.75);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;}

.vpr-loader__inner{text-align: center;}

.vpr-loader__text{margin-top: 10px; font-size: 18px; font-weight: 600; color: #111827;}

.vpr-spinner{border: 4px solid #f3f3f3; border-top: 4px solid #111827; border-radius: 50%; width: 40px; height: 40px; animation: spin 1s linear infinite; margin: 0 auto;}

@keyframes spin{0%{transform:rotate(0deg)}

100%{transform:rotate(360deg)}

}
.vpr-loader[hidden]{display: none;}

.vpr-cart__btn.vpr-cart__btn--sm{font-size: 20px;
  padding: 2px 6px;
  margin: 0 2px;
  padding-bottom: 7px;}

.vpr-cart__btn.vpr-cart__btn--del{background: #dc3545;
  color: #fff;
  border: none;
  border-radius: 3px;}

/* Category buttons */
.vpr-cat-btn{background: #b7ccff;
  color: #333;
  border: 1px solid #ccc;
  margin: 4px;
  border-radius: 4px;
  cursor: pointer;}

.vpr-cat-btn.vpr-cat-btn--active{background: #0073aa; /* WP blue */
  color: #fff;
  border-color: #0073aa;}

/* Product "Add" button */
.vpr-card__add{background: #0d5187; /* green */
  color: #fff;
  border: none;
  padding: 6px 12px;
  margin-top: 6px;
  border-radius: 4px;
  cursor: pointer;}

.vpr-card__add:hover{background: #218838;}

/* Ensure text inside cards is visible */
.vpr-card__title, 
.vpr-card__price{color: #222;}

#vprCartTotal{font-size: 30px; color: green;}

/* Tables row */
.vpr-pos__tables{gap: 6px;
  padding-bottom: 30px;
  border-bottom: 2px solid #e0e0e0; /* ✅ horizontal separator */}

/* Actions row under price */
.vpr-card__actions{display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 6px;}

/* Stock quantity label */
.vpr-card__stock{font-size: 12px;
  color: #555;
  background: #f8f9fa;
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid #ddd;}

/* Add button (already styled, but spacing here) */
.vpr-card__add{background: #0073aa;
  color: #fff;
  border: none;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 13px;}

.vpr-card__actions{display: flex;
  justify-content: space-between;
  align-items: center;
  background: #f5f5f5;   /* light gray background */
  padding: 4px 6px;
  border-radius: 4px;
  margin-top: 6px;}

.vpr-card__stock{font-size: 13px;
  color: #333;
  font-weight: 500;}

/* highlight animation for cart rows */
@keyframes vprCartFlash{0%   { background-color: #d1ffd6;}

/* light green */
  100%{background-color: transparent;}

}

.vpr-cart__highlight{animation: vprCartFlash 0.8s ease-out;}

/* Active table styling */
.vpr-table-btn.vpr-table--active{background-color: #0073aa;   /* WP blue */
  color: #fff;
  font-weight: bold;
  border: 1px solid #005f8d;}

/* Occupied tables = gray but visible */
.vpr-table-btn.vpr-table--occupied{background-color: #639565;
  color: #fff;
  border: 1px solid darkgreen;}

/* Empty tables = lighter */
.vpr-table-btn.vpr-table--empty{background-color: #fafafa;
  color: #666;
  border: 1px solid #ddd;}

/* Product click feedback */
@keyframes vprCardPulse{0%   { transform: scale(1); box-shadow: 0 0 0 rgba(0,0,0,0);}

50%{transform: scale(1.03); box-shadow: 0 0 10px rgba(0,115,170,0.5);}

}

.vpr-card.vpr-card--pulse{animation: vprCardPulse 0.4s ease-out;}

.vpr-cart__divider{border: none;
  border-top: 2px solid #ddd;
  margin: 10px 0;}

.vpr-cart__checkout{margin-top: 10px;}

.vpr-cart__checkout .vpr-btn{width: 100%;
  padding: 12px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;}

/* Wrapper makes sure input respects cart width */
/* Received amount input wrapper */
/* Wrap the received amount input as a full-width row */

#vprReceivedAmount{display: block;
  width: 100% !important;
  max-width: 100% !important;
  margin: 10px 0;
  padding: 12px 14px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #fff;
  box-sizing: border-box;}

/* Daily Sales summary - top right corner */
.vpr-daily-sales{position: fixed;
  top: 32px;
  right: 6px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 6px 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  font-size: 14px;
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 8px;
  width: auto; /* don’t stretch full width */}

.vpr-daily-sales label{font-weight: 600;
  margin-right: 4px;}

.vpr-daily-sales input[type="date"]{font-size: 13px;
  padding: 2px 4px;}

#vprSalesTotal{font-weight: bold;
  color: #2a7;}
#vprVegNonVegSales{font-weight: bold; color: #2a7;}

/* Responsive handling for Daily Sales box */
@media (max-width: 1024px){.vpr-daily-sales {
    top: auto;
    right: auto;
    left: 0;
    width: 100%;
    border-radius: 0;
    justify-content: center;
    position: relative;
    box-shadow: none;
    border-left: none;
    border-right: none;
    margin-top: 5px;}

}
.vpr-daily-sales input[type="date"]{font-size: 13px;
  padding: 2px 4px;
  width: 98px;   /* 🔥 reduce calendar width */
  min-width: unset;}

/* --- Guest Tabs --- */
.vpr-guest-tabs{display: flex;
  gap: 6px;
  margin-bottom: 6px;
  flex-wrap: wrap;}

.vpr-guest-tab{padding: 4px 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  cursor: pointer;
  background: #f9f9f9;
  transition: background 0.2s;}

.vpr-guest-tab:hover{background: #efefef;}

.vpr-guest-tab.active{background: #0073aa;
  color: #fff;}

/* === Success Modal Backdrop === */
.vpr-modal{position: fixed;
  inset: 0; /* shorthand: top:0; right:0; bottom:0; left:0 */
  display: none;              /* hidden by default */
  align-items: center;        /* vertical center */
  justify-content: center;    /* horizontal center */
  background: rgba(0, 0, 0, 0.5); /* semi-transparent overlay */
  z-index: 9999;}

/* Show modal when aria-hidden is false */
.vpr-modal[aria-hidden="false"]{display: flex;}

/* === Modal Dialog Box === */
.vpr-modal__dialog{background: #fff;
  border-radius: 12px;
  padding: 24px 28px;
  max-width: 420px;
  width: 90%;
  box-shadow: 0 8px 28px rgba(0,0,0,0.25);
  position: relative;
  animation: vprModalFadeIn 0.25s ease-out;
  text-align: left;
  font-family: system-ui, sans-serif;}

/* === Close Button === */
/* === Success Modal Close Button Clean Style === */
.vpr-modal__close{position: absolute;
  top: 10px;
  right: 12px;
  font-size: 22px;
  font-weight: bold;
  line-height: 1;
  color: #444;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  transition: color 0.2s;}

/* Hover should only change text color, not background */
.vpr-modal__close:hover{color: red;
  background: none !important;
  box-shadow: none !important;}

/* === Success Content === */
.vpr-success-content{text-align: center;}

.vpr-success-title{font-size: 24px;
  margin-bottom: 16px;
  color: #222;}

.vpr-success-details{list-style: none;

  padding-left: 80px;
  text-align: left;}

.entry-content h6{margin-bottom:5px;}

.vpr-success-details li{margin: 6px 0;
  font-size: 26px;
  color: #333;}

.vpr-success-details strong{color: #000;
  font-size: 19px;}

/* === Animations === */
@keyframes vprModalFadeIn{from { opacity: 0; transform: scale(0.9);}

to{opacity: 1; transform: scale(1);}

}


/* === FORCE Success Modal Center === */
#vprSuccessModal{position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: none !important;
  background: rgba(0,0,0,0.5) !important;

  /* flex centering */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 99999 !important;}

#vprSuccessModal[aria-hidden="true"]{display: none !important;}

#vprSuccessModal[aria-hidden="false"]{display: flex !important;}

/* dialog box */
#vprSuccessModal .vpr-modal__dialog{background: #fff;
  border-radius: 10px;
  max-width: 420px;
  width: 90%;
  padding: 24px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.3);
  position: relative;
  text-align: center;}

/* Highlight Total in Success Modal */
.vpr-success-total{font-size: 35px;          /* bigger font */
  font-weight: bold;        /* bold */
  color: green;           /* red (pick any color you like) */}

/* ========================
   Guest Tabs in Cart
   ======================== */
.vpr-cart__guests{display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0;}

.vpr-cart__guest-btn{padding: 6px 12px;
  border: 1px solid #ccc;
  background: #f9f9f9;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.2s ease-in-out;
  color: black;}

.vpr-cart__guest-btn:hover{background: #305a6d;}

/* Active guest tab */
.vpr-cart__guest-btn.active{background: #0073aa;     /* WordPress blue */
  color: #fff;
  border-color: #0073aa;
  font-weight: bold;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);}

/* Add Guest button style */
.vpr-cart__guest-btn.add-guest{background: #gray;
  border: 1px dashed #4caf50;
  color: red;
  font-weight: 500;}

.vpr-cart__guest-btn.add-guest:hover{background: #c8e6c9;}

/* guest remove */
.vpr-cart__guest-wrap{display: inline-flex;
  align-items: center;
  margin-right: 6px;}

.vpr-cart__guest-del{margin-left: 4px;
  color: #c00;
  cursor: pointer;
  font-weight: bold;
  font-size: 14px;
  line-height: 1;}

.vpr-cart__guest-del:hover{color: #f00;}

/* Guest Overlay background */
.vpr-guest-modal{position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none; /* hidden by default */
  justify-content: center; /* center horizontally */
  align-items: center;    /* center vertically */
  background: rgba(0,0,0,0.5); /* semi-transparent black overlay */
  z-index: 9999; /* above everything */}

/* Modal content box */
.vpr-guest-modal .modal-content{background: #fff;
  padding: 20px 25px;
  border-radius: 8px;
  min-width: 280px;
  max-width: 400px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.3);
  text-align: center;
  position: relative;}

/* Close button (×) */
.vpr-guest-modal .close{position: absolute;
  top: -13px;
  right: 4px;
  font-size: 30px;
  cursor: pointer;
  color: red;}

/* Input inside modal */
.vpr-guest-modal input{width: 100%;
  padding: 8px 10px;
  margin-bottom: 12px;
  border: 2px solid #ccc;
  border-radius: 4px;}

/* Save button inside modal */
.vpr-guest-modal button#vprGuestSaveBtn{padding: 8px 16px;
  border: none;
  background-color: #28a745;
  color: #fff;
  font-weight: bold;
  border-radius: 4px;
  cursor: pointer;}

.vpr-guest-modal button#vprGuestSaveBtn:hover{background-color: #218838;}

#vprCartTitle{margin-bottom: 0px; color: #0f6b8d;}

/* Success Modal Layout Fix */
#vprSuccessModal .vpr-modal__dialog{display: flex;
  flex-direction: column;
  max-height: 90vh;      /* don't exceed screen */}

#vprSuccessModal .vpr-modal__body{flex: 1;
  overflow-y: auto;      /* scroll only body if too tall */
  margin-bottom: 0;           /* 🔥 remove bottom margin */
  padding-bottom: 0px;       /* 🔥 space so items don’t hide behind footer */}

/* Table + Guest in same line */
.vpr-success-meta{display: flex;
  justify-content: space-between;
  font-size: 15px;
  margin-bottom: 10px;}

/* Sticky footer for Success Modal */
#vprSuccessModal .vpr-modal__footer{position: sticky;
  bottom: 0;
  background: #fff;
  padding: 12px;
  border-top: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  z-index: 10;}

.vpr-success-totals{display: flex;
  flex-direction: column;
  font-size: 26px;
  line-height: 1.4;
  color: green;}

#vprSuccessModal .vpr-modal__footer button{min-width: 90px;
  font-size: 15px;
  font-weight: bold;}

/* Two-column POS layout */
.vpr-pos-layout{display: flex;
  height: 100%;}

/* Right side fixed cart */
.vpr-pos__cart{position: fixed;
  right: 0;
  top: 100px;                 /* 👈 push cart down to clear WP admin bar + floating totals */
  width: 25%;
  height: calc(100vh - 100px);/* 👈 always constant height */
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* distribute header, items, footer */
background: #f5f5f5;
  border-left: 1px solid #ddd;
  padding: 12px;
  box-sizing: border-box;
  overflow: hidden;          /* prevent height collapse */
  z-index: 1000;}

/* Cart items scroll independently */
.vpr-cart__items{flex: 1 1 auto;            /* take remaining space */
  overflow-y: auto;}

/* Keep checkout button pinned at bottom */
.vpr-cart__checkout{flex-shrink: 0;
  margin-top: 12px;}

/* Root POS container: full screen, no outer scroll */
body.admin-bar,
body.wp-admin,
body{overflow: hidden !important;   /* kill global scroll */}

.vpr-pos{display: flex;
  height: 100vh;                 /* full viewport height */
  overflow: hidden;              /* prevent page scroll */}

/* Left column setup */
.vpr-pos-main{flex: 0 0 75%;
  max-width: 75%;
  height: 100%;
  display: flex;
  flex-direction: column;
  margin-right: 25%;             /* space for cart */
 
padding-bottom:30px;  /* no scroll here */}

/* Scroll wrapper for tables + categories + products */
.vpr-left-scroll{flex: 1 1 auto;
  height: 100%;
       overflow-y: auto;}

/* Sticky tables */
.vpr-left-scroll .vpr-pos__tables{position: sticky;
  top: 0;
  z-index: 20;
  background: #f9f9f9;
  border-bottom: 1px solid #ddd;}

/* Sticky categories */
.vpr-left-scroll .vpr-pos__categories{position: sticky;
  top: var(--tablesHeight, 56px);  /* dynamic height from JS */
  z-index: 19;
  background: #f9f9f9;
  border-bottom: 1px solid #d9d5d5;}

/* Products simply fill below */
.vpr-left-scroll .vpr-pos__products{padding: 10px;}

/* === Prevent left-column centering + always use full width === */
.vpr-pos,
.vpr-pos-layout,
.vpr-pos-main,
.vpr-left-scroll,
.vpr-pos__products{width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;}

/* Make sure tables/categories stretch full width */
.vpr-pos__tables,
.vpr-pos__categories{width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;}

/* If product grid uses flex, force left alignment (no centering) */
.vpr-pos__products .product-grid,
.vpr-pos__products .products-wrapper,
.vpr-pos__products .products{display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
  width: 100% !important;}

/* Product card sizing: ensure items align left and wrap as usual */
.vpr-pos__products .product-card,
.vpr-pos__products .vpr-product-card{margin-left: 0 !important;}

/* Safety: if theme adds a centered container class inside, force it full width */
.vpr-pos__products .container,
.vpr-pos__products .wrap,
.vpr-pos-main .container,
.vpr-pos-main .wrap{width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;}

.ast-single-post.ast-page-builder-template .site-main > article, .woocommerce.ast-page-builder-template .site-main, .ast-page-builder-template .post-navigation{padding-top: 0px;}

/* Container holding all products */
.product-list-container{height: calc(100vh - 150px); /* Adjust 150px depending on table + category tabs height */
    overflow-y: auto;
    padding: 10px; /* Optional padding */}

/* Optional: keep table & category tabs always visible */
.table-tabs, .category-tabs{position: sticky;
    top: 0;
    background: #fff; /* Match your layout background */
    z-index: 10;}

/* cart horizontal line*/
.vpr-cart__item{display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0;              /* more spacing */
  border-bottom: 2px solid #e6e6e9;  /* clear solid divider */}

/* remove border from the last item */
.vpr-cart__item:last-child{border-bottom: none;}

/* ===========================================
   ✅ VitePOS Responsive + Mobile Fixes
   =========================================== */

/* === Original desktop design remains unchanged === */

/* ===============================
   ✅ Mobile + Tablet Responsive Fixes
   =============================== */

/* Tablet View (<= 980px) */
@media (max-width: 980px){.vpr-pos-layout {
    flex-direction: column;}

.vpr-pos-main{flex: 1 1 auto;
    max-width: 100%;
    margin-right: 0;}

.vpr-pos__cart{position: relative;
    top: auto;
    right: auto;
    width: 100%;
    height: auto;
    border-left: none;
    border-top: 2px solid #ddd;
    padding: 10px;
    margin-top: 10px;}

.vpr-pos__cart .vpr-cart__items{max-height: 260px;
    overflow-y: auto;}

}

/* Mobile View (<= 600px) */
@media (max-width: 600px){.vpr-pos__tables {
    grid-template-columns: repeat(3, 1fr);}

.vpr-pos__products{grid-template-columns: repeat(2, 1fr);
    gap: 6px;
    padding: 6px;}

.vpr-card{padding: 6px;
    font-size: 13px;}

.vpr-btn{font-size: 13px;
    padding: 8px;}

body,
  .vpr-pos{overflow: auto !important;
    height: auto;}

}

/* Small phones (<= 400px) */
@media (max-width: 400px){.vpr-pos__tables {
    grid-template-columns: repeat(3, 1fr);}

}

/* ===============================
   ✅ Fix product scrolling on mobile/tablet
   =============================== */

@media (max-width: 980px){body,
  .vpr-pos,
  .vpr-pos-main,
  .vpr-left-scroll {
    height: auto !important;
    overflow: visible !important;}

html, body{overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;}

.vpr-pos__products,
  .product-list-container{height: auto !important;
    overflow-y: visible !important;}

}

/* ===============================
   ✅ Mobile Cart as Floating Bubble
   =============================== */
@media (max-width: 980px){.vpr-pos__cart {
    position: fixed !important;
    bottom: 65px;
    right: 10px;
    width: 110px;
    height: 95px;
    background: #ffffff;
    color: black;
    border: none;
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
    padding: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    cursor: pointer;}
	
	.vpr-cart__total span {
  font-size: 20px;
  color: #555;       /* Style for 'Total' text */
  
}
@media (max-width: 980px) {
  #vprCartTotal {
    font-size: 20px;
    color: green;
  }
}

.vpr-pos__cart::before{content: "🛒";
    font-size: 24px;
    line-height: 1;}

.vpr-pos__cart .vpr-cart__header,
.vpr-cart__received,
.vpr-cart__guests,
  .vpr-pos__cart .vpr-cart__items,
  .vpr-pos__cart .vpr-cart__checkout{display: none;}

.vpr-pos__cart.vpr-cart--open{width: 100%;
    height: 60vh;
    bottom: auto;
    top: 0px;
    right: 0;
    left: 0;
    border-radius: 0;
    background: #fff;
    color: #111;
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    padding: 10px 12px;
    overflow-y: auto;}

.vpr-pos__cart.vpr-cart--open::before{content: "Close ✖";
    display: block;
    text-align: right;
    font-size: 16px;
    padding: 6px;
    color: #0073aa;
    background: none;}

.vpr-pos__cart.vpr-cart--open .vpr-cart__header,
  .vpr-pos__cart.vpr-cart--open .vpr-cart__items,
  .vpr-pos__cart.vpr-cart--open .vpr-cart__checkout{display: block;}

}

/* Sticky total sales at bottom */
@media (max-width: 980px){.vpr-daily-sales {
    position: fixed;       /* Fix to viewport */
    bottom: 0;             /* Stick to bottom */
    left: 0;               /* Align left */
    width: 100%;           /* Full width */
    background-color: #fff; /* White background */
    box-shadow: 0 -2px 5px rgba(0,0,0,0.2); /* Optional shadow for visibility */
    z-index: 100000;         /* Stay above other elements */
    padding: 10px;         /* Adjust height */
    display: flex;         /* Optional: layout children horizontally */
    justify-content: space-between; /* Optional: align child elements */}

/* Prevent products from being hidden under sticky total */
.pos-content{margin-bottom: 70px;  /* same height as .vpr-daily-sales */}

}
}