@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700;800;900&family=Open+Sans:wght@400;600;700;800&display=swap');
*{box-sizing:border-box}
:root{--green:#0b6b3a;--dark:#083822;--soft:#eef7f1;--line:#d8eadf;--danger:#a92929}
body{margin:0;font-family:"Open Sans",Arial,Helvetica,sans-serif;background:var(--soft);color:#12392a;overflow-x:hidden}
.hidden{display:none!important}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:18px;background:radial-gradient(circle at top left,rgba(0,126,70,.18),transparent 35%),linear-gradient(135deg,#f5fff7,#e3efe8)}
.login-card{width:min(420px,100%);padding:28px;border-radius:24px;background:#fff;box-shadow:0 20px 50px rgba(10,64,38,.16);border:1px solid rgba(10,96,54,.12)}
.brand-mark{width:62px;height:62px;border-radius:18px;display:grid;place-items:center;background:var(--green);color:white;font-size:25px;font-weight:900;margin-bottom:14px}
h1,h2,h3{margin:0 0 10px}.muted{color:#6d8277;margin-top:0}.small{font-size:13px}
label{display:block;margin:12px 0 6px;font-weight:800}
input,select{width:100%;padding:12px;border:1px solid #bdd6c7;border-radius:12px;font-size:15px;background:white}
button{border:none;border-radius:13px;padding:11px 16px;cursor:pointer;font-weight:900;background:var(--green);color:white}
button.secondary{background:#dcece3;color:#153f2d}button.danger{background:var(--danger)}button.checkout{width:100%;padding:14px;margin-top:12px;font-size:16px}.wide{width:100%;margin-top:8px}
.message{min-height:20px;font-weight:800;color:var(--danger)}
.api-box{margin-top:18px;padding:13px;border-radius:14px;background:#f1f8f4;color:#315c48;overflow-wrap:anywhere}
.topbar{position:sticky;top:0;z-index:5;padding:12px 18px;background:white;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(260px,1fr) auto;gap:12px;align-items:center}
nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.tab{background:#e3eee8;color:#174832}.tab.active{background:var(--green);color:white}
.sync-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:10px 12px;font-weight:900;font-size:13px;white-space:nowrap}.sync-badge.ok{background:#e4f3e9;color:#0b6b3a}.sync-badge.pending{background:#fff4d6;color:#8a5b00}
.tab-content{padding:18px}.layout{display:grid;grid-template-columns:minmax(0,1fr) clamp(310px,27vw,390px);gap:18px;align-items:start}.inventory-layout{display:grid;grid-template-columns:minmax(320px,420px) minmax(0,1fr);gap:18px;align-items:start}
.panel{background:white;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:0 12px 28px rgba(10,64,38,.08);min-width:0}
.cart-panel{position:sticky;top:92px}.panel-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.scan-box{background:#f3faf6;border:1px solid #d5e7dd;border-radius:16px;padding:13px;margin-bottom:12px}
.category-bar{display:flex;gap:8px;overflow-x:auto;padding:8px 0 14px}.category-btn{flex:0 0 auto;background:#e3eee8;color:#174832}.category-btn.active{background:var(--green);color:white}
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.product-card{border:1px solid var(--line);border-radius:16px;padding:13px;background:#fbfffc;cursor:pointer;min-height:125px;display:flex;flex-direction:column;justify-content:space-between}.product-card:hover{outline:3px solid rgba(11,107,58,.18)}.product-card strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product-card span{font-weight:900;color:var(--green);font-size:18px}.product-card small{color:#496658;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-card code{font-size:11px;color:#64786d}
.cart-list{min-height:155px;max-height:260px;overflow:auto;border:1px dashed #bdd5c6;border-radius:14px;padding:10px;background:#fbfffc}.cart-row{display:grid;grid-template-columns:1fr auto auto;gap:8px;padding:9px 0;border-bottom:1px solid #e7f0ea}.cart-row:last-child{border-bottom:0}.cart-row button{padding:6px 10px}
.totals{margin-top:12px;padding:12px;border-radius:14px;background:#f4faf6}.totals div{display:flex;justify-content:space-between;align-items:center;margin:7px 0;gap:12px}.totals input{max-width:130px}
.inline{display:grid;grid-template-columns:1fr auto;gap:8px}.check-line{display:flex;align-items:center;gap:10px;background:#f2faf5;padding:12px;border-radius:13px;margin-top:10px}.check-line input{width:auto}.check-line label{margin:0}
.table-wrap{width:100%;overflow-x:auto}.table{width:100%;border-collapse:collapse;min-width:720px;margin-top:12px}.table th,.table td{padding:10px;border-bottom:1px solid #e2eee7;text-align:left;vertical-align:top}.badge-ok{color:var(--green);font-weight:900}.badge-muted{color:var(--danger);font-weight:900}
.report-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.report-card{background:#f2faf5;border:1px solid var(--line);border-radius:16px;padding:16px}.report-card b{font-size:28px;color:var(--green)}
.receipt-modal{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:50;display:grid;place-items:center;padding:18px}.receipt-shell{width:min(420px,100%);max-height:95vh;overflow:auto}.receipt-actions{display:flex;gap:8px;justify-content:flex-end;margin-bottom:10px}.receipt-paper{width:80mm;max-width:100%;margin:auto;background:white;color:black;padding:12px;font-family:"Courier New",monospace;font-size:11px;line-height:1.28;box-shadow:0 10px 40px rgba(0,0,0,.25)}.receipt-center{text-align:center}.receipt-sep{border-top:1px dashed #000;margin:8px 0}.receipt-meta div,.receipt-totals div{display:flex;justify-content:space-between;gap:8px;margin:2px 0}.receipt-table{width:100%;border-collapse:collapse;font-size:10.5px}.receipt-table th,.receipt-table td{border-bottom:1px dotted #bbb;padding:3px 0;vertical-align:top}.right{text-align:right}.receipt-totals .grand{font-size:13px;font-weight:900;border-top:1px solid #000;padding-top:4px;margin-top:4px}.receipt-small{font-size:9.5px}
@media(max-width:1100px){.layout,.inventory-layout{grid-template-columns:1fr}.cart-panel{position:static;order:-1}.topbar{grid-template-columns:1fr}nav{justify-content:flex-start}}
@media(max-width:760px){.tab-content{padding:10px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.inline{grid-template-columns:1fr}.panel-head{display:block}.topbar{display:block}nav{margin-top:10px}.cart-row{grid-template-columns:1fr auto}.cart-row button{grid-column:1/-1}}
@media print{body *{visibility:hidden!important}#receiptModal,#receiptModal *,#receiptPaper,#receiptPaper *{visibility:visible!important}.no-print,.receipt-actions{display:none!important}#receiptModal{position:static;background:white;display:block;padding:0}.receipt-shell{width:80mm;max-height:none;overflow:visible;margin:0}.receipt-paper{width:80mm;box-shadow:none;margin:0;padding:0}@page{size:80mm auto;margin:4mm}}


/* ============================
    PREMIUM UI OVERRIDES
   ============================ */
:root{
  --green:#056839;
  --green-2:#0b8f53;
  --gold:#f4b400;
  --red:#b42834;
  --blue:#2563eb;
  --purple:#7c3aed;
  --orange:#f97316;
  --soft:#edf7f1;
  --panel:#ffffff;
  --line:#d7e8dd;
  --shadow:0 18px 45px rgba(7,56,34,.10);
}
body{
  background:
    radial-gradient(circle at 10% 0%, rgba(11,143,83,.12), transparent 28%),
    radial-gradient(circle at 100% 10%, rgba(244,180,0,.10), transparent 20%),
    linear-gradient(135deg,#f5fff8,#eaf5ee 55%,#f7fbf8);
}
.login-card,.panel{
  border:1px solid rgba(5,104,57,.13)!important;
  box-shadow:var(--shadow)!important;
}
.login-card{
  background:linear-gradient(180deg,#ffffff,#fbfffc)!important;
}
.brand-mark{
  background:linear-gradient(135deg,var(--green),var(--green-2))!important;
  box-shadow:0 14px 28px rgba(5,104,57,.25)!important;
}
.topbar{
  background:rgba(255,255,255,.93)!important;
  backdrop-filter:blur(14px);
  box-shadow:0 8px 24px rgba(7,56,34,.07);
}
.topbar h2{
  letter-spacing:.2px;
}
.tab,button.secondary{
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
button:hover,.tab:hover,.product-card:hover{
  transform:translateY(-1px);
}
.tab.active,button:not(.secondary):not(.danger){
  background:linear-gradient(135deg,var(--green),var(--green-2))!important;
  box-shadow:0 8px 18px rgba(5,104,57,.18);
}
button.danger{
  background:linear-gradient(135deg,#b42834,#951c25)!important;
}
.panel{
  background:rgba(255,255,255,.96)!important;
}
.panel-head h3{
  font-size:22px;
}
.category-btn{
  border:1px solid rgba(5,104,57,.08);
}
.category-btn.active{
  background:linear-gradient(135deg,var(--green),var(--green-2))!important;
  box-shadow:0 9px 18px rgba(5,104,57,.18);
}
.product-card{
  background:
    linear-gradient(180deg,#ffffff,#fbfffc)!important;
  border:1px solid rgba(5,104,57,.13)!important;
  box-shadow:0 8px 18px rgba(7,56,34,.06);
  transition:transform .15s ease, box-shadow .15s ease, outline .15s ease;
}
.product-card:hover{
  box-shadow:0 16px 30px rgba(7,56,34,.13);
}
.product-card span{
  color:var(--green)!important;
}
.scan-box,.totals,.api-box,.report-card{
  background:linear-gradient(135deg,#f3faf6,#edf7f1)!important;
}
input:focus,select:focus{
  outline:3px solid rgba(244,180,0,.35)!important;
  border-color:#e2a900!important;
}
.table th{
  background:#f2faf5;
  color:#083822;
  position:sticky;
  top:0;
}
.table tr:hover td{
  background:#fbfffc;
}
.badge-ok{
  background:#e4f5ea;
  color:#056839!important;
  padding:4px 8px;
  border-radius:999px;
  display:inline-block;
}
.badge-muted{
  background:#fff1f2;
  color:#b42834!important;
  padding:4px 8px;
  border-radius:999px;
  display:inline-block;
}
.sync-badge.ok{
  background:linear-gradient(135deg,#e5f7eb,#d7f0df)!important;
}
.sync-badge.pending{
  background:linear-gradient(135deg,#fff6d7,#ffec99)!important;
}
.receipt-paper{
  border-radius:2px;
}
@media(max-width:760px){
  .product-card{min-height:138px}
  .panel{padding:14px}
}

.local-db-status{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:8px 0 10px;
  padding:8px 12px;
  border-radius:999px;
  background:#eef8f2;
  color:#056839;
  font-size:13px;
  font-weight:800;
  border:1px solid rgba(5,104,57,.12);
}


/* ================================
   QUATRO PASOS HOTEL THEME V109
   No green. Navy / gold / warm cafe.
   ================================ */
:root{
  --navy:#16213e;
  --navy-2:#24345f;
  --gold:#c89b3c;
  --gold-2:#e7c878;
  --coffee:#6f4e37;
  --cream:#f7efe1;
  --cream-2:#fbf7ef;
  --wine:#8f2d3f;
  --text:#1f2937;
  --muted:#6b7280;
  --line:#eadfc9;
  --soft:#f6efe2;
  --panel:#fffaf2;
  --shadow:0 18px 45px rgba(22,33,62,.12);
}

body{
  color:var(--text)!important;
  background:
    radial-gradient(circle at 10% 0%, rgba(200,155,60,.20), transparent 30%),
    radial-gradient(circle at 100% 10%, rgba(22,33,62,.12), transparent 24%),
    linear-gradient(135deg,#fffaf2,#f4ead8 55%,#fffdf8)!important;
}

.login-card,.panel{
  background:rgba(255,250,242,.96)!important;
  border:1px solid rgba(200,155,60,.28)!important;
  box-shadow:var(--shadow)!important;
}

.login-card{
  background:linear-gradient(180deg,#fffaf2,#fffdf8)!important;
}

.brand-mark{
  background:linear-gradient(135deg,var(--navy),var(--coffee))!important;
  color:var(--gold-2)!important;
  box-shadow:0 14px 28px rgba(22,33,62,.25)!important;
}

.topbar{
  background:rgba(255,250,242,.96)!important;
  border-bottom:1px solid rgba(200,155,60,.28)!important;
  box-shadow:0 8px 24px rgba(22,33,62,.08)!important;
}

.topbar h2,h1,h2,h3,label{
  color:var(--navy)!important;
}

.muted,.small{
  color:var(--muted)!important;
}

button,
.tab.active,
button.checkout,
button:not(.secondary):not(.danger){
  background:linear-gradient(135deg,var(--navy),var(--navy-2))!important;
  color:#fffaf2!important;
  box-shadow:0 8px 18px rgba(22,33,62,.20)!important;
}

button.secondary,.tab{
  background:#efe3cb!important;
  color:var(--navy)!important;
  border:1px solid rgba(200,155,60,.22)!important;
}

button.danger{
  background:linear-gradient(135deg,var(--wine),#6f1f2d)!important;
  color:#fff!important;
}

.sync-badge.ok{
  background:linear-gradient(135deg,#f5e7c8,#ead4a4)!important;
  color:var(--navy)!important;
  border:1px solid rgba(200,155,60,.30)!important;
}

.sync-badge.pending{
  background:linear-gradient(135deg,#fff2c2,#e7c878)!important;
  color:#5a3b00!important;
}

.scan-box,.totals,.api-box,.report-card,.local-db-status{
  background:linear-gradient(135deg,#fff6e6,#f4ead8)!important;
  border:1px solid rgba(200,155,60,.25)!important;
  color:var(--navy)!important;
}

input,select{
  border:1px solid #d9c395!important;
  background:#fffdf8!important;
  color:var(--text)!important;
}

input:focus,select:focus{
  outline:3px solid rgba(200,155,60,.35)!important;
  border-color:var(--gold)!important;
}

.category-bar{
  padding:10px 0 16px!important;
}

.category-btn{
  background:#efe3cb!important;
  color:var(--navy)!important;
  border:1px solid rgba(200,155,60,.26)!important;
  box-shadow:0 6px 16px rgba(22,33,62,.08)!important;
}

.category-btn.active{
  background:linear-gradient(135deg,var(--navy),var(--coffee))!important;
  color:#fffaf2!important;
  border-color:rgba(200,155,60,.55)!important;
}

.product-card{
  background:linear-gradient(180deg,#fffdf8,#fff7ea)!important;
  border:1px solid rgba(200,155,60,.25)!important;
  box-shadow:0 8px 18px rgba(22,33,62,.08)!important;
}

.product-card:hover{
  outline:3px solid rgba(200,155,60,.30)!important;
  box-shadow:0 16px 32px rgba(22,33,62,.15)!important;
}

.product-card span{
  color:var(--coffee)!important;
}

.product-card small{
  color:#715a33!important;
}

.table th{
  background:#efe3cb!important;
  color:var(--navy)!important;
}

.table td{
  border-bottom:1px solid rgba(200,155,60,.18)!important;
}

.table tr:hover td{
  background:#fff7ea!important;
}

.badge-ok{
  background:#f4e5c2!important;
  color:#6f4e37!important;
}

.badge-muted{
  background:#f8dddd!important;
  color:#8f2d3f!important;
}

.cart-list{
  background:#fffdf8!important;
  border:1px dashed #d9c395!important;
}

.receipt-paper{
  background:white!important;
  color:black!important;
}

@media(max-width:760px){
  .category-btn{
    padding:10px 14px!important;
  }
}


/* V109 INPUT FIX: keep inputs usable and readable */
input:disabled,
select:disabled,
textarea:disabled{
  opacity:1!important;
  background:#fffdf8!important;
  color:#1f2937!important;
  cursor:text!important;
}


/* V109 ALL INPUTS TYPE FIX */
html, body, #loginView, #posView, .tab-content, .panel, .cart-panel{
  pointer-events:auto!important;
}

input,
select,
textarea{
  pointer-events:auto!important;
  user-select:text!important;
  -webkit-user-select:text!important;
  cursor:text!important;
  opacity:1!important;
  filter:none!important;
  touch-action:auto!important;
}

select{
  cursor:pointer!important;
}

button{
  pointer-events:auto!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}

input:disabled,
select:disabled,
textarea:disabled,
input[readonly],
textarea[readonly]{
  opacity:1!important;
  background:#fffdf8!important;
  color:#1f2937!important;
  cursor:text!important;
  pointer-events:auto!important;
}

.product-card,
.category-btn,
.tab,
button{
  -webkit-app-region:no-drag!important;
}

input,
select,
textarea,
label,
.cart-panel,
.panel{
  -webkit-app-region:no-drag!important;
}


/* V109 OUT OF STOCK FIX */
.product-card.out-of-stock{
  opacity:.58!important;
  cursor:not-allowed!important;
  filter:grayscale(.35)!important;
  position:relative!important;
  pointer-events:auto!important;
}

.product-card.out-of-stock:hover{
  transform:none!important;
  box-shadow:0 8px 18px rgba(22,33,62,.08)!important;
  outline:none!important;
}

.product-card.out-of-stock::after{
  content:"OUT OF STOCK";
  position:absolute;
  top:12px;
  right:12px;
  background:#8f1d2c;
  color:#fff;
  font-size:11px;
  font-weight:900;
  padding:6px 8px;
  border-radius:999px;
  letter-spacing:.04em;
  box-shadow:0 8px 18px rgba(143,29,44,.25);
}

.stock-badge{
  display:inline-flex;
  align-items:center;
  margin-top:8px;
  padding:5px 8px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
}

.stock-badge.ok{
  background:#f3e2bd;
  color:#523516;
  border:1px solid rgba(200,155,60,.30);
}

.stock-badge.out,
.badge-danger{
  display:inline-flex;
  align-items:center;
  background:#8f1d2c;
  color:#fff;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:900;
}

.error-mini{
  color:#9f1239;
  font-weight:800;
  font-size:11px;
  display:block;
  margin-top:4px;
  white-space:normal;
}


/* V109 OUT OF STOCK OVERLAY ONLY
   Remove visible stock-count badges.
   Out-of-stock card keeps same appearance, only overlay + disabled click.
*/
.product-card .stock-badge.ok,
.product-card .stock-badge{
  display:none!important;
}

.product-card.out-of-stock{
  opacity:1!important;
  filter:none!important;
  cursor:not-allowed!important;
  pointer-events:auto!important;
}

.product-card.out-of-stock:hover{
  transform:none!important;
  box-shadow:0 8px 18px rgba(22,33,62,.08)!important;
  outline:none!important;
}

.product-card.out-of-stock::after{
  content:"OUT OF STOCK";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(22,33,62,.72);
  color:#fff;
  font-size:16px;
  font-weight:950;
  letter-spacing:.08em;
  border-radius:inherit;
  text-align:center;
  z-index:5;
}

.product-card.out-of-stock::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  border:2px solid rgba(143,29,44,.55);
  pointer-events:none;
  z-index:6;
}

.product-card{
  position:relative!important;
  overflow:hidden!important;
}


/* V109 GLOBAL TYPING FIX */
html, body, #loginView, #posView, .tab-content, .panel, .cart-panel{ pointer-events:auto!important; }
input, select, textarea{
  pointer-events:auto!important;
  user-select:text!important;
  -webkit-user-select:text!important;
  cursor:text!important;
  opacity:1!important;
  filter:none!important;
  touch-action:auto!important;
  -webkit-app-region:no-drag!important;
}
select{ cursor:pointer!important; }
button{
  pointer-events:auto!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  -webkit-app-region:no-drag!important;
}
input:disabled, select:disabled, textarea:disabled, input[readonly], textarea[readonly]{
  opacity:1!important;
  background:#fffdf8!important;
  color:#1f2937!important;
  cursor:text!important;
  pointer-events:auto!important;
}

/* V109 OUT OF STOCK OVERLAY ONLY */
.product-card .stock-badge, .product-card .stock-badge.ok{ display:none!important; }
.product-card{ position:relative!important; overflow:hidden!important; }
.product-card.out-of-stock{
  opacity:1!important;
  filter:none!important;
  cursor:not-allowed!important;
  pointer-events:auto!important;
}
.product-card.out-of-stock:hover{
  transform:none!important;
  box-shadow:0 8px 18px rgba(22,33,62,.08)!important;
  outline:none!important;
}
.product-card.out-of-stock::after{
  content:"OUT OF STOCK";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(22,33,62,.72);
  color:#fff;
  font-size:16px;
  font-weight:950;
  letter-spacing:.08em;
  border-radius:inherit;
  text-align:center;
  z-index:5;
}
.product-card.out-of-stock::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  border:2px solid rgba(143,29,44,.55);
  pointer-events:none;
  z-index:6;
}
.sync-badge.failed{
  background:#f8d7da!important;
  color:#8f1d2c!important;
  border:1px solid rgba(143,29,44,.25)!important;
}

/* V109 KEEP TYPING SAFE */
input, select, textarea{pointer-events:auto!important;user-select:text!important;-webkit-user-select:text!important;-webkit-app-region:no-drag!important;}
input:disabled,select:disabled,textarea:disabled,input[readonly],textarea[readonly]{opacity:1!important;pointer-events:auto!important;background:#fffdf8!important;}

.sync-badge.warn{background:#fff3cd;color:#856404;border:1px solid #ffe08a;}

.backup-mini-panel{margin:12px 0;padding:12px 14px;border:1px solid #e5e7eb;border-radius:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#f8fafc;}
.backup-mini-panel small{display:block;color:#64748b;margin-top:3px;}
.backup-actions{display:flex;gap:8px;flex-wrap:wrap;}
.secondary-btn{border:1px solid #d1d5db;background:#fff;border-radius:10px;padding:8px 12px;cursor:pointer;}
.secondary-btn:hover{transform:translateY(-1px);}
@media(max-width:700px){.backup-mini-panel{align-items:flex-start;flex-direction:column;}}

.empty-box,.empty-cart{padding:18px;border:1px dashed #d6c391;border-radius:14px;color:#7a6b4f;background:#fffaf0}.qty-actions{display:flex;gap:6px;align-items:center}.qty-actions button{min-width:32px;padding:4px 8px;border-radius:8px}.cart-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;border-bottom:1px solid #eadfc7;padding:10px 0}.product-grid{min-height:200px}.product-card{user-select:none}.category-btn.active{font-weight:900}

.hidden-deploy{display:none!important;}
.version{font-size:13px;color:#b9851d;letter-spacing:1px;font-weight:700;}


/* ===============================
   V109 DEPLOY POLISHED UI
   =============================== */
:root{
  --qp-navy:#111f44;
  --qp-navy-2:#1b2e63;
  --qp-gold:#d4a94f;
  --qp-gold-2:#f5dfad;
  --qp-cream:#fff8e8;
  --qp-paper:#fffaf0;
  --qp-bg:#f4ead9;
  --qp-red:#871a3a;
  --qp-green:#166534;
  --qp-muted:#667085;
  --qp-line:#ecd7a4;
  --qp-shadow:0 18px 45px rgba(17,31,68,.12);
}
body.qp-deploy-polished,
body{
  background:
    radial-gradient(circle at top left, rgba(245,223,173,.95), transparent 34%),
    linear-gradient(135deg, #fffaf0 0%, #f5ead7 45%, #efe0c6 100%) !important;
  color:#19213a;
}
header,.topbar,.app-header{
  background:rgba(255,250,240,.96) !important;
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(212,169,79,.35) !important;
  box-shadow:0 14px 35px rgba(17,31,68,.10) !important;
}
h1{
  letter-spacing:.03em;
}
h1::first-letter{
  color:var(--qp-red);
}
button,
.nav button,
.topbar button{
  transition:transform .16s ease, box-shadow .16s ease, filter .16s ease !important;
}
button:hover{
  transform:translateY(-2px);
  filter:saturate(1.07);
}
button:active{
  transform:translateY(0);
}
.nav button,
.topbar nav button,
#syncNowBtn,
#testServerBtn{
  border-radius:15px !important;
  font-weight:900 !important;
  letter-spacing:.02em;
}
.nav button.active,
.topbar nav button.active,
button[data-tab].active{
  background:linear-gradient(135deg, var(--qp-navy), var(--qp-navy-2)) !important;
  box-shadow:0 12px 30px rgba(17,31,68,.25) !important;
}
#syncStatusBadge,.sync-badge{
  border-radius:999px !important;
  font-weight:900 !important;
  box-shadow:0 10px 22px rgba(212,169,79,.18);
}
.panel,.card,.cart-panel,.inventory-panel,.pos-panel,.content-card,section{
  border-radius:24px !important;
}
.panel,.cart-panel,.inventory-panel,.pos-panel{
  background:rgba(255,250,240,.92) !important;
  border:1px solid rgba(236,215,164,.85) !important;
  box-shadow:var(--qp-shadow) !important;
}
.panel-head h2,.panel-head h3,
.cart-panel h2,.cart-panel h3,
section h2, section h3{
  color:#16213f !important;
}
.search-box,
.scan-box,
.summary,
.cart-summary,
.local-db-status,
.deploy-note{
  background:linear-gradient(135deg,#fff6df,#fffaf0) !important;
  border:1px solid rgba(212,169,79,.45) !important;
  border-radius:18px !important;
}
input,select,textarea{
  border-radius:14px !important;
  border:1px solid rgba(183,143,61,.5) !important;
  background:#fffdf7 !important;
  transition:box-shadow .16s ease, border-color .16s ease !important;
}
input:focus,select:focus,textarea:focus{
  outline:none !important;
  border-color:var(--qp-gold) !important;
  box-shadow:0 0 0 4px rgba(212,169,79,.22) !important;
}

/* Product cards */
.products-grid,
#productsGrid,
.product-grid{
  gap:16px !important;
}
.product-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,#fffaf0,#fff3db) !important;
  border:1px solid rgba(212,169,79,.35) !important;
  border-radius:18px !important;
  box-shadow:0 12px 30px rgba(72,50,20,.08) !important;
  min-height:155px;
}
.product-card::after{
  content:"";
  position:absolute;
  right:-34px;
  top:-34px;
  width:100px;
  height:100px;
  background:rgba(212,169,79,.15);
  border-radius:50%;
}
.product-card:hover{
  transform:translateY(-4px) scale(1.01) !important;
  box-shadow:0 18px 38px rgba(72,50,20,.16) !important;
  border-color:rgba(212,169,79,.85) !important;
}
.product-name{
  font-weight:900 !important;
  color:#1f2937 !important;
  line-height:1.1;
  position:relative;
  z-index:1;
}
.product-price{
  color:#6b4424 !important;
  font-size:23px !important;
  font-weight:1000 !important;
  position:relative;
  z-index:1;
}
.product-meta,.product-code,.product-stock{
  color:#695c49 !important;
  position:relative;
  z-index:1;
}
.product-stock{
  font-weight:700;
}

/* Category buttons */
.category-tabs button,
.category-filter button,
.filter-bar button{
  border-radius:14px !important;
}
.category-tabs button.active,
.category-filter button.active,
.filter-bar button.active{
  background:linear-gradient(135deg,var(--qp-navy),var(--qp-navy-2)) !important;
  color:white !important;
}

/* Cart */
.cart-panel{
  position:sticky;
  top:110px;
  align-self:start;
}
.cart-items,
#cartItems{
  background:#fffdf8 !important;
  border:1px dashed rgba(183,143,61,.55) !important;
  border-radius:18px !important;
}
.cart-row{
  border-bottom:1px solid rgba(236,215,164,.75) !important;
}
.primary,
#completeSaleBtn{
  background:linear-gradient(135deg,var(--qp-navy),var(--qp-navy-2)) !important;
  color:white !important;
  border-radius:16px !important;
  box-shadow:0 14px 30px rgba(17,31,68,.25) !important;
}
#clearCartBtn{
  background:linear-gradient(135deg,#f4dfb5,#fff1ca) !important;
  color:#142143 !important;
  border:1px solid rgba(212,169,79,.45) !important;
}

/* Inventory table/panels */
table{
  border-radius:16px;
  overflow:hidden;
}
th{
  background:linear-gradient(180deg,#f4dfb5,#e9ca82) !important;
  color:#142143 !important;
  font-weight:900 !important;
}
td{
  border-color:rgba(236,215,164,.75) !important;
}
tr:hover td{
  background:#fff7e8 !important;
}

/* Login polish */
.login-page,
.auth-page,
body:has(.login-card){
  background:
    radial-gradient(circle at 15% 15%, rgba(212,169,79,.42), transparent 32%),
    radial-gradient(circle at 80% 25%, rgba(135,26,58,.18), transparent 25%),
    linear-gradient(135deg,#fff8e8,#f1dec0) !important;
}
.login-card,
.auth-card,
#loginCard{
  border-radius:28px !important;
  background:rgba(255,250,240,.95) !important;
  border:1px solid rgba(212,169,79,.45) !important;
  box-shadow:0 28px 70px rgba(17,31,68,.18) !important;
  overflow:hidden;
}
.login-card::before,
.auth-card::before,
#loginCard::before{
  content:"🏨 Quatro Pasos";
  display:block;
  margin:-2px -2px 18px;
  padding:18px 22px;
  background:linear-gradient(135deg,var(--qp-navy),var(--qp-red));
  color:white;
  font-weight:1000;
  letter-spacing:.04em;
}
.login-card button,
.auth-card button,
#loginCard button{
  background:linear-gradient(135deg,var(--qp-navy),var(--qp-navy-2)) !important;
  color:white !important;
  border-radius:16px !important;
  box-shadow:0 14px 30px rgba(17,31,68,.25) !important;
}

/* Scrollbar */
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:#f4ead9}
::-webkit-scrollbar-thumb{background:#d4a94f;border-radius:999px;border:3px solid #f4ead9}
::-webkit-scrollbar-thumb:hover{background:#b9851d}

/* Responsive polish */
@media(max-width:900px){
  .cart-panel{position:relative;top:auto}
  .topbar,header,.app-header{position:relative !important}
}


/* V109 hotel rooms and login cleanup */
.login-card p,
.auth-card p,
#loginCard p{
  line-height:1.35 !important;
}
.login-card .muted,
.auth-card .muted,
#loginCard .muted{
  display:none !important;
}
.login-card input + label,
.auth-card input + label,
#loginCard input + label{
  margin-top:14px !important;
}
.login-card button,
.auth-card button,
#loginCard button,
button[type="submit"]{
  margin-top:18px !important;
  min-width:120px;
  padding:13px 20px !important;
}
.room-form-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:12px;
  background:linear-gradient(135deg,#fff6df,#fffaf0);
  border:1px solid rgba(212,169,79,.45);
  border-radius:18px;
  padding:16px;
  margin:14px 0 18px;
}
.room-summary{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  gap:12px;
  margin:14px 0;
}
.room-summary div{
  background:linear-gradient(145deg,#fffaf0,#fff2d5);
  border:1px solid rgba(212,169,79,.42);
  border-radius:18px;
  padding:14px;
  box-shadow:0 12px 28px rgba(17,31,68,.08);
}
.room-summary b{
  display:block;
  font-size:24px;
  color:#142143;
}
.room-summary span{
  color:#64748b;
  font-weight:800;
  font-size:12px;
  text-transform:uppercase;
}
.rooms-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:15px;
}
.room-card{
  background:linear-gradient(145deg,#fffaf0,#fff3dc);
  border:1px solid rgba(212,169,79,.38);
  border-radius:22px;
  padding:16px;
  box-shadow:0 14px 34px rgba(17,31,68,.10);
  position:relative;
  overflow:hidden;
}
.room-card::after{
  content:"";
  position:absolute;
  right:-34px;
  top:-34px;
  width:100px;
  height:100px;
  border-radius:50%;
  background:rgba(212,169,79,.18);
}
.room-top{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  position:relative;
  z-index:1;
}
.room-top h3{
  margin:0;
  font-size:22px;
  color:#142143;
}
.room-top p{
  margin:4px 0 0;
  color:#6b5b43;
  font-weight:800;
}
.room-badge{
  border-radius:999px;
  padding:7px 10px;
  background:#dcfce7;
  color:#166534;
  font-weight:900;
  font-size:12px;
  text-transform:uppercase;
}
.room-card.occupied .room-badge{background:#fee2e2;color:#991b1b}
.room-card.reserved .room-badge{background:#dbeafe;color:#1e40af}
.room-card.cleaning .room-badge{background:#fef3c7;color:#92400e}
.room-card.maintenance .room-badge{background:#f3e8ff;color:#6b21a8}
.room-meta{
  display:flex;
  gap:10px;
  margin:12px 0;
  color:#64748b;
  position:relative;
  z-index:1;
}
.room-rates{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  position:relative;
  z-index:1;
}
.room-rates div{
  background:#fffdf7;
  border:1px solid #ead7a9;
  border-radius:14px;
  padding:10px;
}
.room-rates small{
  display:block;
  color:#64748b;
  font-weight:800;
}
.room-rates b{
  color:#6b4424;
  font-size:17px;
}
.extra-rate{
  display:block;
  margin-top:10px;
  color:#64748b;
  font-weight:800;
  position:relative;
  z-index:1;
}

.hidden-login-meta{display:none!important;}

.login-card .brand-mark{display:none!important;}
.login-card h1{margin-top:0!important;}
.login-card button#loginBtn{margin-top:20px!important;display:inline-block!important;width:auto!important;padding:13px 26px!important;}


/* V109 rooms tab fix + report polish */
.hidden-login-meta{display:none!important}
.login-card .brand-mark{display:none!important}
.login-card button#loginBtn{margin-top:22px!important;padding:13px 26px!important;width:auto!important}
.room-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;background:linear-gradient(135deg,#fff6df,#fffaf0);border:1px solid rgba(212,169,79,.45);border-radius:18px;padding:16px;margin:14px 0 18px}
.room-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:14px 0}
.room-summary div{background:linear-gradient(145deg,#fffaf0,#fff2d5);border:1px solid rgba(212,169,79,.42);border-radius:18px;padding:14px;box-shadow:0 12px 28px rgba(17,31,68,.08)}
.room-summary b{display:block;font-size:24px;color:#142143}.room-summary span{color:#64748b;font-weight:800;font-size:12px;text-transform:uppercase}
.rooms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:15px}
.room-card{background:linear-gradient(145deg,#fffaf0,#fff3dc);border:1px solid rgba(212,169,79,.38);border-radius:22px;padding:16px;box-shadow:0 14px 34px rgba(17,31,68,.10);position:relative;overflow:hidden}
.room-card::after{content:"";position:absolute;right:-34px;top:-34px;width:100px;height:100px;border-radius:50%;background:rgba(212,169,79,.18)}
.room-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;position:relative;z-index:1}.room-top h3{margin:0;font-size:22px;color:#142143}.room-top p{margin:4px 0 0;color:#6b5b43;font-weight:800}
.room-badge{border-radius:999px;padding:7px 10px;background:#dcfce7;color:#166534;font-weight:900;font-size:12px;text-transform:uppercase}.room-card.occupied .room-badge{background:#fee2e2;color:#991b1b}.room-card.reserved .room-badge{background:#dbeafe;color:#1e40af}.room-card.cleaning .room-badge{background:#fef3c7;color:#92400e}.room-card.maintenance .room-badge{background:#f3e8ff;color:#6b21a8}
.room-meta{display:flex;gap:10px;margin:12px 0;color:#64748b;position:relative;z-index:1}.room-rates{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative;z-index:1}.room-rates div{background:#fffdf7;border:1px solid #ead7a9;border-radius:14px;padding:10px}.room-rates small{display:block;color:#64748b;font-weight:800}.room-rates b{color:#6b4424;font-size:17px}.extra-rate{display:block;margin-top:10px;color:#64748b;font-weight:800;position:relative;z-index:1}


/* V109 login cleanup and report API link */
.login-title-hidden{
  display:none!important;
}
.login-card .brand-mark{
  display:none!important;
}
.hidden-login-meta,
.login-card .api-box{
  display:none!important;
}
.login-card{
  padding-bottom:30px!important;
}
.login-card button#loginBtn{
  margin-top:22px!important;
  margin-bottom:14px!important;
  padding:13px 34px!important;
  min-width:145px!important;
  border-radius:16px!important;
}
.login-report-link{
  margin-top:18px;
  padding:14px 16px;
  border-radius:16px;
  background:linear-gradient(135deg,#fff6df,#fffaf0);
  border:1px solid rgba(212,169,79,.45);
  box-shadow:0 10px 22px rgba(17,31,68,.06);
}
.login-report-link span{
  display:block;
  font-weight:900;
  color:#142143;
  margin-bottom:6px;
}
.login-report-link a{
  display:block;
  color:#7f1734;
  font-weight:800;
  word-break:break-all;
  text-decoration:none;
}
.login-report-link a:hover{
  text-decoration:underline;
}


/* V109 room-order POS layout + stable login */
.rooms-pos-layout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px;align-items:start}
.rooms-main-panel{min-height:calc(100vh - 170px)}
.room-order-panel{position:sticky;top:112px}
.room-toolbar{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:12px;margin:14px 0}
.room-admin-form{margin-bottom:16px}
.room-card{cursor:pointer;transition:.16s}
.room-card.selected{outline:3px solid rgba(20,33,67,.45);transform:translateY(-3px)}
.selected-room-card{background:linear-gradient(145deg,#fffaf0,#fff3dc);border:1px solid #ead7a9;border-radius:18px;padding:16px;margin-bottom:14px;box-shadow:0 12px 28px rgba(17,31,68,.08)}
.empty-room-select{color:#64748b;font-weight:800;text-align:center;padding:28px 16px}
.selected-room-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.selected-room-head h2{margin:0;color:#142143}.selected-room-head p{margin:4px 0 0;font-weight:900;color:#6b5b43}.selected-room-head span{background:#dcfce7;color:#166534;border-radius:999px;padding:7px 10px;font-weight:900;text-transform:uppercase;font-size:12px}
.selected-room-rates{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.selected-room-rates div{background:#fffdf7;border:1px solid #ead7a9;border-radius:14px;padding:10px}.selected-room-rates small{display:block;color:#64748b;font-weight:800}.selected-room-rates b{color:#6b4424;font-size:17px}
.room-charge-total{display:flex;align-items:center;justify-content:space-between;background:#fff7e8;border:1px solid #ead7a9;border-radius:16px;padding:14px;margin:14px 0;font-weight:900}.room-charge-total strong{font-size:24px;color:#6b4424}
.room-cart-row{background:#fff7e8}
.login-title-hidden,.login-card .brand-mark,.hidden-login-meta,.login-card .api-box{display:none!important}
.login-card button#loginBtn{margin-top:22px!important;margin-bottom:14px!important;padding:13px 34px!important;min-width:145px!important;border-radius:16px!important}
.login-report-link{margin-top:18px;padding:14px 16px;border-radius:16px;background:linear-gradient(135deg,#fff6df,#fffaf0);border:1px solid rgba(212,169,79,.45);box-shadow:0 10px 22px rgba(17,31,68,.06)}
.login-report-link span{display:block;font-weight:900;color:#142143;margin-bottom:6px}.login-report-link a{display:block;color:#7f1734;font-weight:800;word-break:break-all;text-decoration:none}.login-report-link a:hover{text-decoration:underline}
@media(max-width:1100px){.rooms-pos-layout{grid-template-columns:1fr}.room-order-panel{position:relative;top:auto}.room-toolbar{grid-template-columns:1fr}}




/* V109: V109 Inventory / Items content and layout. Pagination only added. */
#inventoryTab > .inventory-layout{
  display:grid !important;
  grid-template-columns:420px minmax(0,1fr) !important;
  gap:18px !important;
  align-items:start !important;
}
#inventoryTab.hidden{
  display:none !important;
}
#inventoryTab > .inventory-layout > .panel{
  min-width:0 !important;
}
#inventoryTab .table-wrap{
  width:100% !important;
  overflow:auto !important;
}
#inventoryTab table.table{
  width:100% !important;
  min-width:760px !important;
}
#inventoryTab .inventory-pager{
  margin-top:12px !important;
  padding:10px 12px !important;
  border:1px solid rgba(214,169,88,.35) !important;
  border-radius:14px !important;
  background:#fff8e8 !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:12px !important;
  flex-wrap:wrap !important;
}
#inventoryTab .pager-info,
#inventoryTab .pager-actions span{
  font-weight:800 !important;
  color:#142143 !important;
}
#inventoryTab .pager-actions{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}
#inventoryTab .pager-actions button{
  padding:9px 13px !important;
  border-radius:11px !important;
}
#inventoryTab .pager-actions button:disabled{
  opacity:.45 !important;
  cursor:not-allowed !important;
}

/* Retain latest nav colors only, no inventory changes */
.topbar nav .nav-pos{background:linear-gradient(135deg,#0f2a55,#2454a6)!important;color:white!important}
.topbar nav .nav-rooms{background:linear-gradient(135deg,#4b2a88,#7c3aed)!important;color:white!important}
.topbar nav .nav-inventory{background:linear-gradient(135deg,#8a4b08,#d97706)!important;color:white!important}
.nav-ico{display:inline-grid;place-items:center;width:22px;height:22px;margin-right:6px;border-radius:8px;background:rgba(255,255,255,.18)}
@media(max-width:1100px){
  #inventoryTab > .inventory-layout{
    display:block !important;
  }
  #inventoryTab > .inventory-layout > .panel{
    margin-bottom:16px !important;
  }
}

/* Token page compact layout safeguard */
.token-access-row{display:grid!important;grid-template-columns:minmax(520px,1fr) auto!important;gap:16px!important;align-items:stretch!important}
.token-input-row{display:grid!important;grid-template-columns:minmax(360px,1fr) auto!important;gap:12px!important;align-items:end!important}
.generate-token-inline{align-self:stretch;display:flex;align-items:end;justify-content:center;background:#fff7e8;border:1px solid #ead7a9;border-radius:18px;padding:18px;min-width:210px}
@media(max-width:900px){.token-access-row{grid-template-columns:1fr!important}.token-input-row{grid-template-columns:1fr!important}.generate-token-inline button{width:100%}}


/* V109: Fixed scroll panels, hidden scrollbar only */
.room-order-panel{
  position:sticky !important;
  top:116px !important;
  max-height:calc(100vh - 135px) !important;
  overflow:hidden !important;
}

.room-order-scroll{
  max-height:calc(100vh - 165px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:4px !important;
  scrollbar-width:none !important;      /* Firefox */
  -ms-overflow-style:none !important;   /* IE/Edge */
}
.room-order-scroll::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

.room-order-panel textarea,
#roomInclusionsInput{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  resize:none !important;
  height:120px !important;
  max-height:120px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.room-order-panel textarea::-webkit-scrollbar,
#roomInclusionsInput::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Same behavior for POS cart */
.cart-panel{
  position:sticky !important;
  top:116px !important;
  max-height:calc(100vh - 135px) !important;
  overflow:hidden !important;
}

.cart-panel .cart-list,
#cartList{
  max-height:30vh !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:4px !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.cart-panel .cart-list::-webkit-scrollbar,
#cartList::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* hide page scrollbar only inside scrollable app panels where needed */
.room-order-scroll,
#cartList{
  scroll-behavior:smooth !important;
}


/* V109: Room Order button spacing + POS Cart fixed scroll hidden scrollbar */

/* ROOM ORDER: buttons must not stick together */
.room-order-panel #addRoomChargeToCartBtn{
  display:block !important;
  width:100% !important;
  margin:18px 0 14px 0 !important;
  border-radius:16px !important;
}
.room-order-panel #printRoomTicketBtn,
.room-order-panel .room-ticket-btn{
  display:block !important;
  width:auto !important;
  min-width:240px !important;
  margin:0 0 18px 0 !important;
  border-radius:16px !important;
}

/* ROOM ORDER: fixed panel + hidden scrollbar */
.room-order-panel{
  position:sticky !important;
  top:116px !important;
  max-height:calc(100vh - 138px) !important;
  overflow:hidden !important;
}
.room-order-scroll{
  max-height:calc(100vh - 168px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:4px !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.room-order-scroll::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Textarea same width, fixed height, hidden scrollbar */
.room-order-panel textarea,
#roomInclusionsInput{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  resize:none !important;
  height:120px !important;
  max-height:120px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.room-order-panel textarea::-webkit-scrollbar,
#roomInclusionsInput::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* POS CART: fixed/sticky panel + internal scroll + hidden scrollbar */
.cart-panel{
  position:sticky !important;
  top:116px !important;
  max-height:calc(100vh - 138px) !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}

.cart-panel h3{
  flex:0 0 auto !important;
}

.cart-panel .cart-list,
#cartList{
  flex:1 1 auto !important;
  min-height:120px !important;
  max-height:36vh !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:4px !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.cart-panel .cart-list::-webkit-scrollbar,
#cartList::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Keep checkout controls visible under scrollable cart list */
.cart-panel .totals,
.cart-panel label,
.cart-panel select,
.cart-panel input,
.cart-panel button,
.cart-panel .message{
  flex:0 0 auto !important;
}


/* V109 FINAL: FULL PANEL INTERNAL SCROLL FOR CART + ROOM ORDER */

/* ROOM ORDER: whole right panel scrolls, scrollbar hidden */
.room-order-panel{
  position:sticky !important;
  top:116px !important;
  height:calc(100vh - 136px) !important;
  max-height:calc(100vh - 136px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.room-order-panel::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}
.room-order-scroll{
  max-height:none !important;
  height:auto !important;
  overflow:visible !important;
  padding-right:0 !important;
}

/* Room buttons spacing */
.room-order-panel #addRoomChargeToCartBtn{
  display:block !important;
  width:100% !important;
  margin:18px 0 16px 0 !important;
}
.room-order-panel #printRoomTicketBtn,
.room-order-panel .room-ticket-btn{
  display:block !important;
  width:auto !important;
  min-width:250px !important;
  margin:0 0 20px 0 !important;
}

/* Textarea fixed size and hidden internal scrollbar */
.room-order-panel textarea,
#roomInclusionsInput{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  resize:none !important;
  height:120px !important;
  max-height:120px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.room-order-panel textarea::-webkit-scrollbar,
#roomInclusionsInput::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* POS CART: whole right cart panel scrolls, scrollbar hidden */
.cart-panel{
  position:sticky !important;
  top:116px !important;
  height:calc(100vh - 136px) !important;
  max-height:calc(100vh - 136px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
  display:block !important;
}
.cart-panel::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Cart list still scrolls if maraming items, hidden scrollbar */
.cart-panel .cart-list,
#cartList{
  max-height:30vh !important;
  min-height:140px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.cart-panel .cart-list::-webkit-scrollbar,
#cartList::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Make bottom fields accessible inside panel scroll */
.cart-panel .totals{
  margin-top:14px !important;
}
.cart-panel button.checkout,
.cart-panel button.secondary,
.cart-panel .wide{
  margin-bottom:12px !important;
}


/* V109 FINAL: Add Room modal restored + inline room form hidden + cart scroll */

/* Hide any old inline Add/Save Room form if it exists outside modal */
#roomsTab > .room-form-grid,
#roomsTab .room-admin-form:not(.modal-room-form),
#roomsTab > .panel > .room-form-grid,
#roomsTab h3 + .room-form-grid{
  display:none !important;
}

/* Room header action buttons */
.room-head-actions{
  display:flex !important;
  gap:12px !important;
  align-items:center !important;
}
#openAddRoomModalBtn{
  background:linear-gradient(135deg,#7c3aed,#4b2a88) !important;
  color:white !important;
}

/* Modal */
.modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999 !important;
  display:grid !important;
  place-items:center !important;
  padding:24px !important;
  background:rgba(15,23,42,.50) !important;
}
.modal.hidden{
  display:none !important;
}
.modal-card{
  width:min(920px,96vw) !important;
  max-height:90vh !important;
  overflow:auto !important;
  background:#fffaf0 !important;
  border:1px solid #ead7a9 !important;
  border-radius:24px !important;
  box-shadow:0 32px 90px rgba(0,0,0,.28) !important;
}
.modal-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:14px !important;
  padding:20px 24px !important;
  background:linear-gradient(135deg,#142143,#7f1734) !important;
  color:white !important;
}
.modal-head h3{
  margin:0 !important;
  color:white !important;
}
.modal-close{
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.14) !important;
  color:white !important;
  font-size:24px !important;
}
.modal-room-form{
  padding:22px !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr)) !important;
  gap:12px !important;
}
.add-room-modal-card .message{
  margin:0 22px 22px !important;
}

/* Room Order buttons spacing */
.room-order-panel #addRoomChargeToCartBtn{
  display:block !important;
  width:100% !important;
  margin:18px 0 16px 0 !important;
}
.room-order-panel #printRoomTicketBtn,
.room-order-panel .room-ticket-btn{
  display:block !important;
  width:auto !important;
  min-width:250px !important;
  margin:0 0 20px 0 !important;
}

/* Cart scroll: whole panel hidden scrollbar */
.cart-panel{
  position:sticky !important;
  top:116px !important;
  height:calc(100vh - 136px) !important;
  max-height:calc(100vh - 136px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
  display:block !important;
}
.cart-panel::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}
#cartList{
  max-height:30vh !important;
  min-height:140px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
#cartList::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}


/* V109: login duplicate title removed + modal force visible */

/* Hide duplicate inner login title only */
.login-main-title,
.login-main-logo,
.login-card > h2,
.login-card > p:not(#loginMsg){
  display:none !important;
}

/* Add Room modal: force correct centered card */
#addRoomModal.modal{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483000 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:24px !important;
  background:rgba(15,23,42,.55) !important;
}
#addRoomModal.modal.hidden{
  display:none !important;
}
#addRoomModal .modal-card{
  display:block !important;
  width:min(920px,96vw) !important;
  max-height:88vh !important;
  overflow:auto !important;
  background:#fffaf0 !important;
  border:1px solid #ead7a9 !important;
  border-radius:24px !important;
  box-shadow:0 32px 90px rgba(0,0,0,.32) !important;
  transform:none !important;
  opacity:1 !important;
}
#addRoomModal .modal-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  padding:20px 24px !important;
  background:linear-gradient(135deg,#142143,#7f1734) !important;
  color:white !important;
}
#addRoomModal .modal-head h3{
  margin:0 !important;
  color:white !important;
}
#addRoomModal .modal-close{
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  border:0 !important;
  background:rgba(255,255,255,.14) !important;
  color:white !important;
  font-size:24px !important;
  cursor:pointer !important;
}
#addRoomModal .modal-room-form{
  padding:22px !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr)) !important;
  gap:12px !important;
}
#addRoomModal input,
#addRoomModal select,
#addRoomModal button{
  width:100% !important;
  box-sizing:border-box !important;
  padding:13px 15px !important;
  border-radius:14px !important;
}
#addRoomModal #addRoomBtn{
  background:#142143 !important;
  color:white !important;
}
#addRoomModal #roomSetupMsg{
  margin:0 22px 22px !important;
}

/* Never show old inline room form */
#roomsTab > .room-form-grid,
#roomsTab .room-admin-form:not(#addRoomModal .room-admin-form),
#roomsTab h3 + .room-form-grid{
  display:none !important;
}

/* Cart panel internal scroll hidden */
.cart-panel{
  position:sticky !important;
  top:116px !important;
  height:calc(100vh - 136px) !important;
  max-height:calc(100vh - 136px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
.cart-panel::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}
#cartList{
  max-height:30vh !important;
  min-height:140px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
#cartList::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}

/* Room button spacing */
.room-order-panel #addRoomChargeToCartBtn{display:block!important;width:100%!important;margin:18px 0 16px 0!important}
.room-order-panel #printRoomTicketBtn,.room-order-panel .room-ticket-btn{display:block!important;min-width:250px!important;margin:0 0 20px 0!important}


/* V109: repaired index tail + complete modal */
.login-main-title,.login-main-logo,.login-brand,.login-logo,.login-card > h2,.login-card > p:not(#loginMsg){
  display:none !important;
}

#addRoomModal.qp-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483640 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:24px !important;
  background:rgba(15,23,42,.58) !important;
}
#addRoomModal.qp-modal.hidden{display:none !important}
#addRoomModal .qp-modal-card{
  display:block !important;
  width:min(940px,96vw) !important;
  max-height:88vh !important;
  overflow:auto !important;
  background:#fffaf0 !important;
  border:1px solid #ead7a9 !important;
  border-radius:24px !important;
  box-shadow:0 32px 90px rgba(0,0,0,.34) !important;
}
#addRoomModal .qp-modal-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:20px 24px !important;
  background:linear-gradient(135deg,#142143,#7f1734) !important;
  color:white !important;
}
#addRoomModal .qp-modal-head h3{margin:0!important;color:white!important;font-size:22px!important}
#addRoomModal .qp-modal-close{
  width:42px!important;height:42px!important;border:0!important;border-radius:14px!important;
  background:rgba(255,255,255,.16)!important;color:white!important;font-size:25px!important;cursor:pointer!important;
}
#addRoomModal .qp-modal-body{padding:22px!important}
#addRoomModal .modal-room-form{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr))!important;
  gap:12px!important;
}
#addRoomModal input,#addRoomModal select,#addRoomModal button{
  width:100%!important;box-sizing:border-box!important;padding:13px 15px!important;border-radius:14px!important;
}
#addRoomModal #addRoomBtn{background:#142143!important;color:white!important;font-weight:900!important}
#addRoomModal #roomSetupMsg{margin:14px 0 0!important}

#roomsTab > .room-form-grid,
#roomsTab .room-admin-form:not(.modal-room-form),
#roomsTab h3 + .room-form-grid{
  display:none !important;
}

.room-head-actions{display:flex!important;gap:12px!important;align-items:center!important}
#openAddRoomModalBtn{background:linear-gradient(135deg,#7c3aed,#4b2a88)!important;color:white!important}

/* cart scroll retained */
.cart-panel{
  position:sticky!important;top:116px!important;height:calc(100vh - 136px)!important;max-height:calc(100vh - 136px)!important;
  overflow-y:auto!important;overflow-x:hidden!important;scrollbar-width:none!important;-ms-overflow-style:none!important;
}
.cart-panel::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}
#cartList{
  max-height:30vh!important;min-height:140px!important;overflow-y:auto!important;overflow-x:hidden!important;
  scrollbar-width:none!important;-ms-overflow-style:none!important;
}
#cartList::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}


/* V109 polished login + room payment */
.login-shell,
.login-screen{
  min-height:100vh !important;
  display:grid !important;
  place-items:center !important;
  padding:34px !important;
  background:
    radial-gradient(circle at 18% 12%, rgba(214,173,88,.18), transparent 28%),
    radial-gradient(circle at 80% 10%, rgba(127,23,52,.12), transparent 30%),
    linear-gradient(135deg,#edf7f2,#fff8ea) !important;
}

.login-card{
  width:min(520px,94vw) !important;
  border-radius:28px !important;
  overflow:hidden !important;
  border:1px solid rgba(214,173,88,.45) !important;
  box-shadow:0 30px 90px rgba(20,33,67,.18) !important;
  background:#fffaf0 !important;
}

.login-card::before{
  content:"🏨  Quatro Pasos";
  display:block;
  padding:22px 30px;
  background:linear-gradient(135deg,#142143,#7f1734);
  color:white;
  font-size:22px;
  font-weight:900;
  letter-spacing:.06em;
}

.login-card .top-mini,
.login-card .login-title,
.login-card h1,
.login-card h2,
.login-card > p:not(#loginMsg),
.login-main-title,
.login-main-logo,
.login-logo{
  display:none !important;
}

.login-card label,
.login-card .field-label{
  font-weight:900 !important;
  color:#142143 !important;
}

.login-card input{
  width:100% !important;
  border-radius:16px !important;
  padding:15px 17px !important;
  border:1px solid #dfc996 !important;
}

.login-card button{
  border-radius:16px !important;
  padding:15px 18px !important;
  min-width:170px !important;
}

.login-api-card{
  margin-top:22px !important;
  padding:18px !important;
  border-radius:18px !important;
  border:1px solid rgba(214,173,88,.45) !important;
  background:linear-gradient(135deg,#fff8e8,#fffaf0) !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:14px !important;
}
.login-api-card b{
  display:block !important;
  color:#142143 !important;
  font-size:16px !important;
}
.login-api-card small{
  display:block !important;
  color:#64748b !important;
  margin-top:4px !important;
}
.login-api-card a{
  text-decoration:none !important;
  background:#142143 !important;
  color:white !important;
  padding:11px 14px !important;
  border-radius:14px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

.room-payment-box{
  margin:16px 0 !important;
  padding:14px !important;
  border:1px solid rgba(214,173,88,.45) !important;
  border-radius:18px !important;
  background:#fff8e8 !important;
}
.room-payment-box label{
  display:block !important;
  margin:8px 0 6px !important;
  font-weight:900 !important;
  color:#142143 !important;
}
.room-payment-box select,
.room-payment-box input{
  width:100% !important;
  box-sizing:border-box !important;
  border-radius:14px !important;
}
.room-payment-change{
  margin-top:10px !important;
  display:flex !important;
  justify-content:space-between !important;
  font-weight:900 !important;
  color:#142143 !important;
}
#payRoomNowBtn{
  display:block !important;
  width:100% !important;
  margin:16px 0 14px !important;
  background:linear-gradient(135deg,#0f7a44,#16a34a) !important;
  color:white !important;
  border-radius:16px !important;
  font-weight:900 !important;
}
#addRoomChargeToCartBtn{
  margin-top:10px !important;
}


/* V109 room occupancy workflow */
#roomDurationValue,
label[for="roomDurationValue"]{
  display:none !important;
}

#checkInRoomBtn{
  display:block !important;
  width:100% !important;
  margin:16px 0 12px !important;
  background:linear-gradient(135deg,#7c3aed,#4b2a88) !important;
  color:white !important;
  border-radius:16px !important;
  font-weight:900 !important;
}
#payRoomNowBtn{
  display:block !important;
  width:100% !important;
  margin:12px 0 !important;
  background:linear-gradient(135deg,#0f7a44,#16a34a) !important;
  color:white !important;
  border-radius:16px !important;
  font-weight:900 !important;
}
.occupied-rooms-panel{
  margin:18px 0 !important;
  padding:18px !important;
  border:1px solid rgba(214,173,88,.45) !important;
  border-radius:22px !important;
  background:#fffaf0 !important;
}
.occupied-rooms-list{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr)) !important;
  gap:12px !important;
}
.occupied-room-card{
  border:1px solid rgba(214,173,88,.40) !important;
  border-radius:16px !important;
  background:#fff8e8 !important;
  padding:14px !important;
  display:grid !important;
  grid-template-columns:1fr auto !important;
  gap:10px !important;
  align-items:center !important;
}
.occupied-room-card small{
  display:block !important;
  color:#64748b !important;
  margin-top:4px !important;
}
.occupied-room-card button{
  grid-column:1 / -1 !important;
  width:100% !important;
  border-radius:14px !important;
}
.empty-mini{
  padding:18px !important;
  text-align:center !important;
  color:#64748b !important;
  border:1px dashed rgba(214,173,88,.5) !important;
  border-radius:16px !important;
}


/* V109 restore room/cart scroll and fixed textarea width */
.cart-panel,
.room-order,
.room-order-card,
#cartPanel,
#roomOrderPanel,
.pos-cart,
.room-side-panel,
.checkout-panel {
  max-height: calc(100vh - 165px) !important;
  overflow-y: auto !important;
  scrollbar-width: none !important;
}
.cart-panel::-webkit-scrollbar,
.room-order::-webkit-scrollbar,
.room-order-card::-webkit-scrollbar,
#cartPanel::-webkit-scrollbar,
#roomOrderPanel::-webkit-scrollbar,
.pos-cart::-webkit-scrollbar,
.room-side-panel::-webkit-scrollbar,
.checkout-panel::-webkit-scrollbar {
  display: none !important;
}
#cartItems,
.cart-items,
.cart-list {
  max-height: 220px !important;
  overflow-y: auto !important;
  scrollbar-width: none !important;
}
#cartItems::-webkit-scrollbar,
.cart-items::-webkit-scrollbar,
.cart-list::-webkit-scrollbar {
  display: none !important;
}
#roomNotes,
#roomInclusions,
#inclusions,
textarea[name="room_notes"],
textarea[name="inclusions"],
.room-order textarea,
.room-order-card textarea {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  resize: none !important;
  min-height: 105px !important;
  max-height: 130px !important;
  overflow-y: auto !important;
  scrollbar-width: none !important;
}
#roomNotes::-webkit-scrollbar,
#roomInclusions::-webkit-scrollbar,
#inclusions::-webkit-scrollbar,
textarea[name="room_notes"]::-webkit-scrollbar,
textarea[name="inclusions"]::-webkit-scrollbar,
.room-order textarea::-webkit-scrollbar,
.room-order-card textarea::-webkit-scrollbar {
  display: none !important;
}
.room-action-buttons,
.room-order .button-row,
.room-order-card .button-row {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}


/* V109 occupied room dropdown restored */
#occupiedRoomSelectWrap {
  margin: 12px 0 14px !important;
  padding: 14px !important;
  border: 1px solid rgba(214,173,88,.65) !important;
  border-radius: 16px !important;
  background: #fff8e8 !important;
}
#occupiedRoomSelectWrap.hidden {
  display: none !important;
}
#occupiedRoomSelectWrap:not(.hidden) {
  display: block !important;
}
#occupiedRoomSelectWrap label {
  display: block !important;
  margin-bottom: 7px !important;
  font-weight: 900 !important;
}
#occupiedRoomSelectWrap select {
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 14px !important;
  padding: 12px 14px !important;
}
#occupiedRoomSelectWrap small {
  display: block !important;
  margin-top: 7px !important;
  color: #64748b !important;
}


/* V109 critical UI fixes */
.cart-panel,.room-order,.room-order-card,#cartPanel,#roomOrderPanel,.pos-cart,.room-side-panel,.checkout-panel{
  max-height:calc(100vh - 165px)!important;
  overflow-y:auto!important;
  scrollbar-width:none!important;
}
.cart-panel::-webkit-scrollbar,.room-order::-webkit-scrollbar,.room-order-card::-webkit-scrollbar,#cartPanel::-webkit-scrollbar,#roomOrderPanel::-webkit-scrollbar,.pos-cart::-webkit-scrollbar,.room-side-panel::-webkit-scrollbar,.checkout-panel::-webkit-scrollbar{display:none!important}
#cartList,#cartItems,.cart-items,.cart-list{
  max-height:220px!important;
  overflow-y:auto!important;
  scrollbar-width:none!important;
}
#cartList::-webkit-scrollbar,#cartItems::-webkit-scrollbar,.cart-items::-webkit-scrollbar,.cart-list::-webkit-scrollbar{display:none!important}
#roomInclusionsInput,#roomNotes,#roomInclusions,#inclusions,textarea[name="room_notes"],textarea[name="inclusions"],.room-order textarea,.room-order-card textarea{
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  resize:none!important;
  min-height:105px!important;
  max-height:130px!important;
  overflow-y:auto!important;
  scrollbar-width:none!important;
}
#roomInclusionsInput::-webkit-scrollbar,#roomNotes::-webkit-scrollbar,#roomInclusions::-webkit-scrollbar,#inclusions::-webkit-scrollbar,textarea[name="room_notes"]::-webkit-scrollbar,textarea[name="inclusions"]::-webkit-scrollbar,.room-order textarea::-webkit-scrollbar,.room-order-card textarea::-webkit-scrollbar{display:none!important}
.room-action-buttons,.room-order .button-row,.room-order-card .button-row{display:flex!important;gap:12px!important;flex-wrap:wrap!important}
#occupiedRoomSelectWrap{margin:12px 0 14px!important;padding:14px!important;border:1px solid rgba(214,173,88,.65)!important;border-radius:16px!important;background:#fff8e8!important}
#occupiedRoomSelectWrap.hidden{display:none!important}
#occupiedRoomSelectWrap:not(.hidden){display:block!important}
#occupiedRoomSelectWrap label{display:block!important;margin-bottom:7px!important;font-weight:900!important}
#occupiedRoomSelectWrap select{width:100%!important;box-sizing:border-box!important;border-radius:14px!important;padding:12px 14px!important}
#occupiedRoomSelectWrap small{display:block!important;margin-top:7px!important;color:#64748b!important}
.qp-modal.hidden{display:none!important}
.qp-modal:not(.hidden){display:flex!important}


/* V109 remove obsolete room charge cart button */
#addRoomChargeToCartBtn {
  display: none !important;
}


/* V109 auto-print checkout receipt support */
@media print {
  body * { visibility: hidden !important; }
  #receiptModal, #receiptModal *, #receiptPaper, #receiptPaper * { visibility: visible !important; }
  .no-print, .receipt-actions { display: none !important; }
  #receiptModal { position: static !important; background: #fff !important; display: block !important; padding: 0 !important; }
  .receipt-shell { width: 80mm !important; max-height: none !important; overflow: visible !important; margin: 0 !important; }
  .receipt-paper { width: 80mm !important; box-shadow: none !important; margin: 0 !important; padding: 0 !important; }
  @page { size: 80mm auto; margin: 4mm; }
}


/* V109 room charges preview before checkout */
.room-charge-preview {
  margin: 14px 0 !important;
  padding: 14px !important;
  border: 1px solid rgba(214,173,88,.7) !important;
  border-radius: 16px !important;
  background: #fff8e8 !important;
}
.room-charge-preview.hidden {
  display: none !important;
}
.room-charge-preview h3 {
  margin: 0 0 10px !important;
  font-size: 17px !important;
  font-weight: 900 !important;
}
.room-charge-preview-list {
  max-height: 180px !important;
  overflow-y: auto !important;
  scrollbar-width: none !important;
  border: 1px dashed rgba(214,173,88,.7) !important;
  border-radius: 14px !important;
  padding: 10px !important;
  background: rgba(255,255,255,.65) !important;
}
.room-charge-preview-list::-webkit-scrollbar {
  display: none !important;
}
.room-charge-row {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 10px !important;
  padding: 8px 0 !important;
  border-bottom: 1px solid rgba(214,173,88,.35) !important;
}
.room-charge-row:last-child {
  border-bottom: 0 !important;
}
.room-charge-row b {
  font-weight: 900 !important;
}
.room-charge-row small {
  display:block !important;
  color:#64748b !important;
  margin-top:2px !important;
}
.room-charge-preview-total {
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  margin-top:10px !important;
  padding-top:10px !important;
  border-top:1px solid rgba(214,173,88,.6) !important;
  font-weight:900 !important;
}


/* V109 login report link + alert/button polish */
.v105-report-access,
.login-report-access {
  margin-top: 14px !important;
  width: 100%;
}
.v105-report-access .report-direct-link,
.login-report-access .report-direct-link {
  display: flex !important;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(212, 172, 86, .45);
  background: linear-gradient(135deg, rgba(255,248,231,.98), rgba(255,255,255,.95));
  color: #111b3d !important;
  text-decoration: none !important;
  box-shadow: 0 14px 30px rgba(17, 27, 61, .10);
}
.v105-report-access .report-direct-link:hover,
.login-report-access .report-direct-link:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 36px rgba(17, 27, 61, .16);
}
.v105-report-access .report-icon,
.login-report-access .report-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #142452;
  color: #fff;
  flex: 0 0 auto;
}
.v105-report-access strong,
.login-report-access strong {
  display: block;
  font-weight: 900;
  letter-spacing: .02em;
}
.v105-report-access small,
.login-report-access small {
  display: block;
  color: #64748b;
  margin-top: 3px;
}
.v105-report-access b,
.login-report-access b {
  margin-left: auto;
  white-space: nowrap;
  background: #142452;
  color: #fff;
  padding: 10px 14px;
  border-radius: 12px;
  box-shadow: 0 10px 20px rgba(20,36,82,.2);
}

button, .btn, input[type="button"], input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
button:hover, .btn:hover {
  filter: brightness(1.03);
}

.alert, .msg, .message, .notice, .toast, .status-message, #roomMsg, #posMsg, #syncMsg, #loginMsg {
  border-radius: 16px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(212,172,86,.45) !important;
  background: linear-gradient(135deg, rgba(255,248,231,.98), rgba(255,255,255,.96)) !important;
  color: #16213f !important;
  box-shadow: 0 12px 26px rgba(15,23,42,.10) !important;
  font-weight: 700;
}
.alert:empty, .msg:empty, .message:empty, .notice:empty, .toast:empty, .status-message:empty, #roomMsg:empty, #posMsg:empty, #syncMsg:empty, #loginMsg:empty {
  display: none !important;
}
.alert:not(:empty)::before, .msg:not(:empty)::before, .message:not(:empty)::before, .notice:not(:empty)::before, .toast:not(:empty)::before, .status-message:not(:empty)::before, #roomMsg:not(:empty)::before, #posMsg:not(:empty)::before, #syncMsg:not(:empty)::before, #loginMsg:not(:empty)::before {
  content: "ℹ️ ";
  margin-right: 4px;
}
.alert.success:not(:empty)::before, .success:not(:empty)::before { content: "✅ "; }
.alert.error:not(:empty)::before, .error:not(:empty)::before { content: "⚠️ "; }
.alert.warning:not(:empty)::before, .warning:not(:empty)::before { content: "⚠️ "; }

.login-card form .v105-report-access,
.login-card .v105-report-access {
  margin-top: 14px !important;
}

/* V109 report external link clickable */
.v106-report-access .report-direct-link,
.login-report-access .report-direct-link {
  cursor: pointer !important;
  user-select: none;
}
.v106-report-access .report-direct-link b,
.login-report-access .report-direct-link b {
  pointer-events: none;
}


/* V109 polished login: one report link only */
body:has(.login-card) .login-report-access:not(.v107-report-access) {
  display: none !important;
}
.login-screen,
body.login-page {
  background:
    radial-gradient(circle at 18% 12%, rgba(255,255,255,.85), transparent 26%),
    radial-gradient(circle at 82% 30%, rgba(255,214,128,.22), transparent 28%),
    linear-gradient(135deg, #effaf5 0%, #f7fbf2 48%, #fff4df 100%) !important;
}
.login-card {
  border-radius: 28px !important;
  border: 1px solid rgba(212, 172, 86, .45) !important;
  background: rgba(255, 252, 244, .94) !important;
  box-shadow: 0 28px 80px rgba(17, 27, 61, .18) !important;
  padding: 34px !important;
  backdrop-filter: blur(10px);
}
.login-card .brand,
.login-card .brand-bar,
.login-card .login-brand {
  border-radius: 0 0 24px 24px !important;
  background: linear-gradient(135deg, #142452, #7d123f) !important;
  box-shadow: 0 14px 28px rgba(20,36,82,.22) !important;
}
.login-card label {
  font-weight: 900 !important;
  letter-spacing: .03em !important;
  color: #101b3d !important;
}
.login-card input {
  border-radius: 16px !important;
  border: 1px solid rgba(153, 115, 43, .35) !important;
  background: rgba(255,255,255,.82) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9) !important;
}
.login-card button[type="submit"],
#loginBtn {
  min-width: 160px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #132554, #20386f) !important;
  box-shadow: 0 16px 32px rgba(20,36,82,.25) !important;
}
.v107-report-access {
  margin-top: 18px !important;
  width: 100% !important;
}
.v107-report-access .report-direct-link {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 48px 1fr auto;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px 18px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(212,172,86,.50) !important;
  background: linear-gradient(135deg, #fff9ec, #ffffff) !important;
  color: #101b3d !important;
  text-align: left !important;
  box-shadow: 0 18px 40px rgba(17,27,61,.12) !important;
  cursor: pointer !important;
}
.v107-report-access .report-direct-link:hover {
  transform: translateY(-1px);
  box-shadow: 0 22px 48px rgba(17,27,61,.18) !important;
}
.v107-report-access .report-icon {
  width: 48px !important;
  height: 48px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #132554, #7d123f) !important;
  color: white !important;
  font-size: 20px !important;
}
.v107-report-access strong {
  font-size: 18px !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
  letter-spacing: .02em !important;
}
.v107-report-access small {
  display: block !important;
  margin-top: 4px !important;
  color: #64748b !important;
  font-weight: 700 !important;
}
.v107-report-access .report-pill {
  background: #101b3d !important;
  color: white !important;
  padding: 11px 16px !important;
  border-radius: 14px !important;
  font-weight: 950 !important;
  box-shadow: 0 12px 24px rgba(16,27,61,.25) !important;
}
body > .login-report-access,
body > .v105-report-access,
body > .v106-report-access {
  display: none !important;
}





/* V109 FIX: ICON ONLY hover motion. Boxes/cards must NOT rotate/zoom. */
.product-card:hover, .room-card:hover, .summary-card:hover, .panel:hover, .card:hover,
.qp-status-card:hover, .kpi-card:hover, .metric-card:hover, .report-card:hover,
.v107-report-access .report-direct-link:hover,
.v109-report-access .report-direct-link:hover,
.login-report-access .report-direct-link:hover,
button:hover, .btn:hover, .tab:hover, .nav-btn:hover {
  transform: none !important;
}

/* Keep buttons/cards stable; only icons inside them move */
.product-card, .room-card, .summary-card, .panel, .card,
.qp-status-card, .kpi-card, .metric-card, .report-card,
.v109-report-access .report-direct-link,
.login-report-access .report-direct-link,
button, .btn, .tab, .nav-btn {
  transition: box-shadow .18s ease, filter .18s ease, border-color .18s ease, background .18s ease !important;
}

/* Icon-only motion targets */
button:hover > span:first-child,
.btn:hover > span:first-child,
.tab:hover > span:first-child,
.nav-btn:hover > span:first-child,
.product-card:hover .icon,
.product-card:hover [class*="icon"],
.product-card:hover .product-icon,
.room-card:hover .icon,
.room-card:hover [class*="icon"],
.room-card:hover .room-icon,
.summary-card:hover .icon,
.summary-card:hover [class*="icon"],
.qp-status-card:hover .ico,
.kpi-card:hover .icon,
.metric-card:hover .icon,
.report-card:hover .icon,
.report-icon:hover,
.card-icon:hover,
.stat-icon:hover,
.brand-mark:hover,
.ico:hover,
[class*="icon"]:hover {
  transform: scale(1.12) rotate(-6deg) !important;
  transition: transform .18s ease, filter .18s ease !important;
  filter: brightness(1.05) !important;
}

/* Report link design, stable box */
.v109-report-access {
  margin-top: 18px !important;
  width: 100% !important;
}
.v109-report-access .report-direct-link {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 48px 1fr auto;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px 18px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(212,172,86,.50) !important;
  background: linear-gradient(135deg, #fff9ec, #ffffff) !important;
  color: #101b3d !important;
  text-align: left !important;
  box-shadow: 0 18px 40px rgba(17,27,61,.12) !important;
  cursor: pointer !important;
}
.v109-report-access .report-direct-link:hover {
  box-shadow: 0 20px 46px rgba(17,27,61,.16) !important;
}
.v109-report-access .report-icon {
  width: 48px !important;
  height: 48px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #132554, #7d123f) !important;
  color: white !important;
  font-size: 20px !important;
}
.v109-report-access strong {
  font-size: 18px !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
}
.v109-report-access small {
  display: block !important;
  margin-top: 4px !important;
  color: #64748b !important;
  font-weight: 700 !important;
}
.v109-report-access .report-pill {
  background: #101b3d !important;
  color: white !important;
  padding: 11px 16px !important;
  border-radius: 14px !important;
  font-weight: 950 !important;
}

/* Force-hide old duplicate report cards outside login */
body > .login-report-access,
body > .v105-report-access,
body > .v106-report-access,
body > .v107-report-access,
body > .v108-report-access,
main > .login-report-access:not(.v109-report-access),
.app > .login-report-access:not(.v109-report-access),
.login-screen > .login-report-access:not(.v109-report-access) {
  display: none !important;
}

/* V119: strict icon-only motion. Buttons/cards stay steady. */
button:hover, .btn:hover, .tab:hover, .nav-btn:hover, .category-btn:hover,
.room-card:hover, .product-card:hover, .summary-card:hover, .card:hover, .panel:hover {
  transform: none !important;
}
button:hover > span:first-child, .btn:hover > span:first-child, .tab:hover > span:first-child,
.nav-btn:hover > span:first-child, .category-btn:hover > span:first-child,
.room-card:hover .room-icon, .product-card:hover .product-icon,
.room-card:hover .icon, .product-card:hover .icon, .summary-card:hover .icon,
.card:hover .icon, .ico:hover, .report-icon:hover, .brand-mark:hover {
  transform: scale(1.12) rotate(-6deg) !important;
  transition: transform .18s ease, filter .18s ease !important;
  filter: brightness(1.05) !important;
}


/* V121 icon-only hover */
.btn-ico{
  display:inline-block !important;
  transform-origin:center !important;
  transition:transform .18s ease !important;
}
button:hover .btn-ico,
a:hover .btn-ico,
.nav-btn:hover .btn-ico{
  transform:scale(1.18) rotate(-8deg) !important;
}
button:hover{
  transform:none !important;
}


/* V122 login report link fix: inside card, exact browser URL, icon-only motion */
.login-card .login-report-access.v109-report-access {
  display:block !important;
  position:static !important;
  margin:18px 0 0 0 !important;
  width:100% !important;
}
.login-card .login-report-access.v109-report-access .report-direct-link {
  transform:none !important;
}
.login-card .login-report-access.v109-report-access .report-direct-link:hover {
  transform:none !important;
}
.login-card .login-report-access.v109-report-access .report-direct-link:hover .report-icon,
.login-card button:hover .btn-icon,
.topbar button:hover .nav-ico,
button:hover > .btn-icon,
button:hover > .nav-ico,
button:hover > .report-icon {
  transform:scale(1.12) rotate(-6deg) !important;
}
.login-card .login-report-access.v109-report-access .report-icon,
.btn-icon,.nav-ico,.report-icon {
  display:inline-grid;
  transition:transform .18s ease !important;
}
.login-api-card { display:none !important; }


/* V123 BIR compliance UI polish */
.bir-compliance-banner{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:14px;margin:0 0 18px}
.bir-compliance-banner>div{background:linear-gradient(135deg,#fff8e8,#ffffff);border:1px solid rgba(214,173,88,.45);border-radius:18px;padding:15px;box-shadow:0 12px 30px rgba(20,33,67,.08)}
.bir-compliance-banner b{display:block;color:#142143;margin:5px 0;font-size:14px}.bir-compliance-banner small{font-weight:700;color:#64748b}
.bir-cards{grid-template-columns:repeat(4,minmax(140px,1fr))}.reading-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;background:#fff7e8;border:1px solid #ead7a9;border-radius:18px;padding:14px;margin:18px 0}.reading-actions input{max-width:180px;margin:0}.status-pill{display:inline-block;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:900;text-transform:uppercase}.status-pill.ok{background:#dcfce7;color:#166534}.status-pill.danger{background:#fee2e2;color:#991b1b}.mini-action{padding:7px 10px;border-radius:10px;font-size:12px;margin:2px}.void-row{opacity:.72;background:#fff1f2!important}.table td small{color:#64748b}.stat-icon,.btn-ico,.nav-ico,.report-icon,.brand-mark{display:inline-block;transition:transform .18s ease}.stat-icon:hover,.btn-ico:hover,.nav-ico:hover,.report-icon:hover,.brand-mark:hover{transform:scale(1.15) rotate(-6deg)}@media(max-width:900px){.bir-compliance-banner,.bir-cards{grid-template-columns:1fr}.reading-actions input{max-width:none;width:100%}}

/* V129: inventory add/edit moved online; POS inventory is read-only cache */
#inventoryTab > .inventory-layout.inventory-layout-readonly{
  grid-template-columns: minmax(300px,420px) minmax(0,1fr) !important;
}
.online-inventory-panel .panel-head{align-items:start!important}
.info-box{
  margin-top:14px;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(20,33,67,.14);
  background:linear-gradient(135deg,#fff8e8,#ffffff);
  color:#142143;
  font-weight:800;
  line-height:1.45;
}
.badge-muted{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  background:#eef2f7;
  color:#475569;
  font-weight:900;
  font-size:12px;
}

.reserved-overlay{margin-top:10px;border-radius:14px;background:#ede9fe;color:#4c1d95;border:1px solid #c4b5fd;padding:10px;font-weight:1000;text-align:center;box-shadow:0 8px 18px #4c1d9518}.reserved-note{display:block;margin-top:8px;color:#6d28d9;font-weight:900}

/* V145 typography standard: Montserrat headings, Open Sans body */
body, input, select, textarea, button, .btn, table, td, th, label, p, a, small, span, div{font-family:"Open Sans",Arial,Helvetica,sans-serif}
h1,h2,h3,h4,h5,h6,.brand b,.qp-brand h1,.qp-topbar h2,.card b,.room-top b,.product-card b,.section-heading h2,.contact-feature-card h2,.contact-note-panel h2,.contact-action-panel h2,.public-room h3,.hotel-hero h1,.hero-copy h1,.page-hero h1{font-family:"Montserrat","Open Sans",Arial,sans-serif}
.receipt-paper,.receipt-paper *{font-family:"Courier New",monospace}

/* V146 smaller POS typography */
body{font-size:14px}button,.btn,input,select,textarea{font-size:13px}h1{font-size:24px}h2{font-size:20px}h3{font-size:17px}.room-card,.product-card,.sale-row,.table-row{font-size:13.5px}


/* V152: website-matched cream / gold / brown button theme + icon-only movement */
:root{
  --qp-button-brown:#4b3526;
  --qp-button-brown-2:#7a5737;
  --qp-button-gold:#caa86a;
  --qp-button-gold-soft:#fff5df;
  --qp-button-cream:#fffdf8;
}
button,
.nav button,
.topbar nav button,
.topbar button,
.category-btn,
.room-ticket-btn,
.secondary-btn,
.checkout,
button[type="submit"]{
  background:linear-gradient(135deg,var(--qp-button-brown-2),var(--qp-button-brown))!important;
  color:#fff8e8!important;
  border:1px solid rgba(202,168,106,.55)!important;
  box-shadow:0 12px 26px rgba(75,53,38,.16)!important;
  border-radius:999px!important;
}
button.secondary,
.secondary-btn,
.category-btn,
.topbar button:not(.active):not(.danger):not(.checkout),
.nav button:not(.active):not(.danger):not(.checkout){
  background:var(--qp-button-gold-soft)!important;
  color:var(--qp-button-brown)!important;
  border:1px solid #e2c790!important;
  box-shadow:0 8px 18px rgba(75,53,38,.08)!important;
}
button.danger{
  background:linear-gradient(135deg,#9a3d2c,#6b1f1b)!important;
  color:#fff8e8!important;
}
.category-btn.active,
.nav button.active,
.topbar nav button.active,
button[data-tab].active{
  background:linear-gradient(135deg,var(--qp-button-brown-2),var(--qp-button-brown))!important;
  color:#fff8e8!important;
  border-color:var(--qp-button-gold)!important;
}
button:hover,
.tab:hover,
.category-btn:hover{
  transform:none!important;
  filter:saturate(1.05);
}
button .icon,
button .emoji,
button .btn-icon,
button span:first-child,
.nav button span:first-child,
.topbar nav button span:first-child,
.category-btn span:first-child{
  display:inline-block;
  transition:transform .16s ease;
}
button:hover .icon,
button:hover .emoji,
button:hover .btn-icon,
button:hover span:first-child,
.nav button:hover span:first-child,
.topbar nav button:hover span:first-child,
.category-btn:hover span:first-child{
  transform:scale(1.13) rotate(-7deg);
}
.product-card.out-of-stock{display:none!important;}

/* V153: apply public website button theme to every clickable control in POS app */
button,.btn,.tab,.nav button,.topbar button,.topbar nav button,.category-btn,.room-ticket-btn,.secondary-btn,.checkout,.mini-action,.pagination button,.qp-modal button,.room-head-actions button,.panel-head button,.receipt-actions button,[role="button"]{
  min-height:38px;
  padding:10px 17px;
  border-radius:999px!important;
  border:1px solid #d6ad58!important;
  background:#fff6e4!important;
  color:#4b3526!important;
  font-family:"Open Sans",Arial,Helvetica,sans-serif!important;
  font-weight:900!important;
  letter-spacing:.02em;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
  transition:background .16s ease, border-color .16s ease, filter .16s ease!important;
}
button.active,.tab.active,.nav button.active,.topbar nav button.active,.category-btn.active,.checkout,button.primary,#checkoutBtn,#checkInRoomBtn,#payRoomNowBtn,#loginBtn{
  background:linear-gradient(135deg,#7a5737,#4b3526)!important;
  color:#fff8e8!important;
  border-color:#caa86a!important;
}
button.danger,#logoutBtn,.mini-action[data-type="void"],.mini-action[data-type="refund"]{
  background:#fff6e4!important;
  color:#4b3526!important;
  border-color:#d6ad58!important;
}
button:hover,.btn:hover,.tab:hover,.category-btn:hover,.mini-action:hover{transform:none!important;background:#fff1cf!important;border-color:#caa86a!important;filter:saturate(1.04)}
button.active:hover,.tab.active:hover,.category-btn.active:hover,.checkout:hover,button.primary:hover,#checkoutBtn:hover,#checkInRoomBtn:hover,#payRoomNowBtn:hover,#loginBtn:hover{background:linear-gradient(135deg,#8a6642,#4b3526)!important;color:#fff8e8!important}
button .nav-ico,button .btn-ico,button .btn-icon,button .icon,button .emoji,button span:first-child,.tab .nav-ico,.category-btn span:first-child{display:inline-block;transition:transform .16s ease}
button:hover .nav-ico,button:hover .btn-ico,button:hover .btn-icon,button:hover .icon,button:hover .emoji,button:hover span:first-child,.tab:hover .nav-ico,.category-btn:hover span:first-child{transform:scale(1.13) rotate(-7deg)}
button:disabled,.btn:disabled{opacity:.55!important;cursor:not-allowed!important;filter:grayscale(.2)}


/* V154: final POS-wide public website button theme, cleaned room/inventory actions */
:root{
  --qp-web-brown:#4b3526;
  --qp-web-brown-2:#7a5737;
  --qp-web-gold:#caa86a;
  --qp-web-gold-2:#d6ad58;
  --qp-web-soft:#fff6e4;
  --qp-web-hover:#fff1cf;
  --qp-web-ink:#4b3526;
}
button,.btn,.tab,.nav button,.topbar button,.topbar nav button,.category-btn,
.room-ticket-btn,.secondary-btn,.checkout,.mini-action,.pagination button,.qp-modal button,
.room-head-actions button,.panel-head button,.receipt-actions button,#backupNowBtn,#openDataFolderBtn,
#refreshSalesBtn,#refreshReportsBtn,#refreshInventoryBtn,#refreshRoomsBtn,#generateXBtn,#generateZBtn,
#refreshProductsBtn,#testServerBtn,#logoutBtn,#clearCartBtn,[role="button"]{
  min-height:38px!important;
  padding:10px 17px!important;
  border-radius:999px!important;
  border:1px solid var(--qp-web-gold-2)!important;
  background:var(--qp-web-soft)!important;
  color:var(--qp-web-ink)!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
  font-family:"Open Sans",Arial,Helvetica,sans-serif!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
  transform:none!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,filter .16s ease!important;
}
button.active,.tab.active,.topbar nav button.active,.nav button.active,.category-btn.active,
#checkoutBtn,#loginBtn,#checkInRoomBtn,#payRoomNowBtn,button.primary,.checkout.primary{
  background:linear-gradient(135deg,var(--qp-web-brown-2),var(--qp-web-brown))!important;
  color:#fff8e8!important;
  border-color:var(--qp-web-gold)!important;
  box-shadow:0 13px 28px rgba(75,53,38,.18)!important;
}
button.danger,#logoutBtn,.mini-action[data-type="void"],.mini-action[data-type="refund"],
#generateXBtn,#generateZBtn,#backupNowBtn,#openDataFolderBtn{
  background:var(--qp-web-soft)!important;
  color:var(--qp-web-ink)!important;
  border-color:var(--qp-web-gold-2)!important;
}
button:hover,.btn:hover,.tab:hover,.category-btn:hover,.mini-action:hover,
#backupNowBtn:hover,#openDataFolderBtn:hover,#generateXBtn:hover,#generateZBtn:hover{
  background:var(--qp-web-hover)!important;
  border-color:var(--qp-web-gold)!important;
  filter:saturate(1.04)!important;
  transform:none!important;
}
button.active:hover,.tab.active:hover,.category-btn.active:hover,#checkoutBtn:hover,#loginBtn:hover,
#checkInRoomBtn:hover,#payRoomNowBtn:hover{
  background:linear-gradient(135deg,#8a6642,var(--qp-web-brown))!important;
  color:#fff8e8!important;
  transform:none!important;
}
button .btn-ico,button .nav-ico,button .btn-icon,button .icon,button .emoji,button span:first-child,
.tab .nav-ico,.category-btn span:first-child{
  display:inline-block!important;
  transform-origin:center!important;
  transition:transform .16s ease!important;
}
button:hover .btn-ico,button:hover .nav-ico,button:hover .btn-icon,button:hover .icon,button:hover .emoji,
button:hover span:first-child,.tab:hover .nav-ico,.category-btn:hover span:first-child{
  transform:scale(1.13) rotate(-7deg)!important;
}
.room-head-actions{justify-content:flex-end!important;}
#openAddRoomModalBtn,#forceSyncRoomsBtn,#openOnlineInventoryBtn{display:none!important;}


/* V155 FINAL OVERRIDE: every POS clickable control follows public website cream/gold/brown theme */
:root{
  --qp-v155-brown:#4b3526;
  --qp-v155-brown-2:#7a5737;
  --qp-v155-gold:#caa86a;
  --qp-v155-gold-2:#d6ad58;
  --qp-v155-soft:#fff6e4;
  --qp-v155-hover:#fff1cf;
  --qp-v155-ink:#4b3526;
}
html body button,
html body .btn,
html body .tab,
html body nav button,
html body .topbar button,
html body .category-bar button.category-btn,
html body .category-btn,
html body .secondary-btn,
html body .room-ticket-btn,
html body .mini-action,
html body .pagination button,
html body .pager-actions button,
html body .qp-modal button,
html body .panel-head button,
html body .room-head-actions button,
html body .receipt-actions button,
html body input[type="button"],
html body input[type="submit"],
html body [role="button"]{
  background:var(--qp-v155-soft)!important;
  color:var(--qp-v155-ink)!important;
  border:1px solid var(--qp-v155-gold-2)!important;
  border-radius:999px!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
  min-height:38px!important;
  padding:10px 17px!important;
  font-family:"Open Sans",Arial,Helvetica,sans-serif!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
  transform:none!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,filter .16s ease!important;
}
html body button.active,
html body .tab.active,
html body nav button.active,
html body .topbar button.active,
html body .category-bar button.category-btn.active,
html body .category-btn.active,
html body #checkoutBtn,
html body #loginBtn,
html body #checkInRoomBtn,
html body #payRoomNowBtn,
html body button.primary{
  background:linear-gradient(135deg,var(--qp-v155-brown-2),var(--qp-v155-brown))!important;
  color:#fff8e8!important;
  border-color:var(--qp-v155-gold)!important;
  box-shadow:0 13px 28px rgba(75,53,38,.18)!important;
}
html body button:hover,
html body .btn:hover,
html body .tab:hover,
html body .category-btn:hover,
html body .mini-action:hover,
html body .panel-head button:hover,
html body .room-head-actions button:hover,
html body .secondary-btn:hover,
html body .room-ticket-btn:hover{
  background:var(--qp-v155-hover)!important;
  color:var(--qp-v155-ink)!important;
  border-color:var(--qp-v155-gold)!important;
  filter:saturate(1.04)!important;
  transform:none!important;
}
html body button.active:hover,
html body .tab.active:hover,
html body .category-btn.active:hover,
html body #checkoutBtn:hover,
html body #loginBtn:hover,
html body #checkInRoomBtn:hover,
html body #payRoomNowBtn:hover,
html body button.primary:hover{
  background:linear-gradient(135deg,#8a6642,var(--qp-v155-brown))!important;
  color:#fff8e8!important;
}
html body #openAddRoomModalBtn,
html body #forceSyncRoomsBtn,
html body #openOnlineInventoryBtn{
  display:none!important;
}
html body button .btn-ico,
html body button .nav-ico,
html body button .btn-icon,
html body button .icon,
html body button .emoji,
html body button > span:first-child,
html body .tab .nav-ico,
html body .category-btn > span:first-child{
  display:inline-block!important;
  transform-origin:center!important;
  transition:transform .16s ease!important;
}
html body button:hover .btn-ico,
html body button:hover .nav-ico,
html body button:hover .btn-icon,
html body button:hover .icon,
html body button:hover .emoji,
html body button:hover > span:first-child,
html body .tab:hover .nav-ico,
html body .category-btn:hover > span:first-child{
  transform:scale(1.13) rotate(-7deg)!important;
}

/* V170 BIR/security compliance additions */
.bir-settings-card{background:#fff;border:1px solid rgba(214,173,88,.35);border-radius:20px;padding:16px;margin:18px 0;box-shadow:0 14px 34px rgba(20,33,67,.08)}
.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(220px,1fr));gap:12px;margin:10px 0 14px}
.settings-grid label{font-weight:900;color:#142143;font-size:12px;display:flex;flex-direction:column;gap:6px}
.settings-grid input{width:100%;border:1px solid #d9e2d8;border-radius:12px;padding:10px;background:#fbfdfb;font-weight:700}
.small-note{font-size:12px;color:#64748b;font-weight:700;margin-top:10px}
.breakdown-pill{display:inline-flex;align-items:center;border:1px solid #ead7a9;background:#fff;border-radius:999px;padding:8px 11px;font-size:12px;font-weight:900;color:#142143}
@media(max-width:800px){.settings-grid{grid-template-columns:1fr}}

/* V170.2: BIR settings moved from inline page section to modal popup */
.bir-settings-summary{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  background:linear-gradient(135deg,#fff8e8,#ffffff)!important;
}
.bir-settings-summary h3{margin:0 0 4px!important;color:#142143!important}
.bir-settings-summary .small-note{margin:0!important}
.bir-settings-summary-copy{min-width:0!important}
#openBirSettingsModalBtn{white-space:nowrap!important}
#birSettingsModal.qp-modal{
  position:fixed!important;
  inset:0!important;
  z-index:99999!important;
  align-items:center!important;
  justify-content:center!important;
  padding:22px!important;
  background:rgba(15,23,42,.58)!important;
  backdrop-filter:blur(3px)!important;
}
#birSettingsModal.qp-modal.hidden{display:none!important}
#birSettingsModal.qp-modal:not(.hidden){display:flex!important}
#birSettingsModal .qp-modal-card{
  width:min(980px,96vw)!important;
  max-height:90vh!important;
  overflow:auto!important;
  background:#fffaf0!important;
  border:1px solid rgba(214,173,88,.65)!important;
  border-radius:24px!important;
  box-shadow:0 32px 90px rgba(0,0,0,.32)!important;
}
#birSettingsModal .qp-modal-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  padding:18px 22px!important;
  background:linear-gradient(135deg,#142143,#8b5e34)!important;
  color:#fff!important;
}
#birSettingsModal .qp-modal-head h3{margin:0!important;color:#fff!important;font-size:20px!important}
#birSettingsModal .qp-modal-close{
  width:42px!important;
  height:42px!important;
  border-radius:999px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:24px!important;
  background:rgba(255,255,255,.16)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.45)!important;
}
#birSettingsModal .qp-modal-body{padding:22px!important}
#birSettingsModal .settings-grid{margin:0 0 14px!important}
.bir-modal-actions{display:flex!important;gap:10px!important;flex-wrap:wrap!important;margin-top:14px!important}
@media(max-width:800px){
  .bir-settings-summary{align-items:stretch!important;flex-direction:column!important}
  #openBirSettingsModalBtn{width:100%!important}
  #birSettingsModal.qp-modal{padding:12px!important;align-items:flex-start!important}
  #birSettingsModal .qp-modal-card{max-height:94vh!important}
}

/* V170.3: FINAL BUTTON THEME FIX - remove remaining dark blue buttons, match header cream/gold/brown buttons */
:root{
  --qp-header-cream:#fff6e4;
  --qp-header-cream-hover:#fff1cf;
  --qp-header-gold:#d6ad58;
  --qp-header-gold-strong:#caa86a;
  --qp-header-brown:#4b3526;
  --qp-header-brown-2:#8b5e34;
  --qp-header-text:#4b3526;
}
html body button,
html body .btn,
html body input[type="button"],
html body input[type="submit"],
html body .secondary-btn,
html body .mini-action,
html body .room-ticket-btn,
html body .receipt-actions button,
html body .bir-modal-actions button,
html body #saveBirSettingsBtn,
html body #generateXBtn,
html body #generateZBtn,
html body #backupNowBtn,
html body #openDataFolderBtn,
html body #addRoomBtn,
html body #printRoomTicketBtn,
html body .qp-modal button{
  background:var(--qp-header-cream)!important;
  color:var(--qp-header-text)!important;
  border:1px solid var(--qp-header-gold)!important;
  border-radius:999px!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
}
html body button:hover,
html body .btn:hover,
html body input[type="button"]:hover,
html body input[type="submit"]:hover,
html body .secondary-btn:hover,
html body .mini-action:hover,
html body .room-ticket-btn:hover,
html body .receipt-actions button:hover,
html body .bir-modal-actions button:hover,
html body #saveBirSettingsBtn:hover,
html body #generateXBtn:hover,
html body #generateZBtn:hover,
html body #backupNowBtn:hover,
html body #openDataFolderBtn:hover,
html body #addRoomBtn:hover,
html body #printRoomTicketBtn:hover,
html body .qp-modal button:hover{
  background:var(--qp-header-cream-hover)!important;
  color:var(--qp-header-text)!important;
  border-color:var(--qp-header-gold-strong)!important;
  box-shadow:0 13px 28px rgba(75,53,38,.12)!important;
}
/* Keep selected/header-active style brown, not navy */
html body .tab.active,
html body nav button.active,
html body .topbar nav button.active,
html body .category-btn.active,
html body button.active,
html body button.primary,
html body .checkout,
html body #checkoutBtn,
html body #loginBtn,
html body #checkInRoomBtn,
html body #payRoomNowBtn{
  background:linear-gradient(135deg,var(--qp-header-brown-2),var(--qp-header-brown))!important;
  color:#fff8e8!important;
  border-color:var(--qp-header-gold-strong)!important;
  box-shadow:0 13px 28px rgba(75,53,38,.18)!important;
}
html body .tab.active:hover,
html body nav button.active:hover,
html body .topbar nav button.active:hover,
html body .category-btn.active:hover,
html body button.active:hover,
html body button.primary:hover,
html body .checkout:hover,
html body #checkoutBtn:hover,
html body #loginBtn:hover,
html body #checkInRoomBtn:hover,
html body #payRoomNowBtn:hover{
  background:linear-gradient(135deg,#9a7048,var(--qp-header-brown))!important;
  color:#fff8e8!important;
}
/* Modal header should also follow the same header brown, not dark blue */
#birSettingsModal .qp-modal-head{
  background:linear-gradient(135deg,var(--qp-header-brown-2),var(--qp-header-brown))!important;
}
#birSettingsModal .qp-modal-close{
  background:rgba(255,248,232,.18)!important;
  color:#fff8e8!important;
  border-color:rgba(255,248,232,.55)!important;
}

/* V170.4: FINAL remaining action-button cleanup - cart +/-/x and sales Void/Refund match header cream/gold theme */
html body #cartList .qty-actions button,
html body #cartItems .qty-actions button,
html body .cart-list .qty-actions button,
html body .cart-row .qty-actions button,
html body .cart-row button[data-act="minus"],
html body .cart-row button[data-act="plus"],
html body .cart-row button[data-act="remove"],
html body .mini-action.voidSaleBtn,
html body .mini-action.refundSaleBtn,
html body .mini-action[data-type="void"],
html body .mini-action[data-type="refund"]{
  background:var(--qp-header-cream)!important;
  color:var(--qp-header-text)!important;
  border:1px solid var(--qp-header-gold)!important;
  border-radius:999px!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
  font-weight:900!important;
  transform:none!important;
}
html body #cartList .qty-actions button:hover,
html body #cartItems .qty-actions button:hover,
html body .cart-list .qty-actions button:hover,
html body .cart-row .qty-actions button:hover,
html body .cart-row button[data-act="minus"]:hover,
html body .cart-row button[data-act="plus"]:hover,
html body .cart-row button[data-act="remove"]:hover,
html body .mini-action.voidSaleBtn:hover,
html body .mini-action.refundSaleBtn:hover,
html body .mini-action[data-type="void"]:hover,
html body .mini-action[data-type="refund"]:hover{
  background:var(--qp-header-cream-hover)!important;
  color:var(--qp-header-text)!important;
  border-color:var(--qp-header-gold-strong)!important;
  box-shadow:0 13px 28px rgba(75,53,38,.12)!important;
  transform:none!important;
}
html body #cartList .qty-actions button,
html body #cartItems .qty-actions button,
html body .cart-list .qty-actions button,
html body .cart-row .qty-actions button{
  min-width:42px!important;
  width:42px!important;
  height:42px!important;
  padding:0!important;
}
html body .mini-action.voidSaleBtn,
html body .mini-action.refundSaleBtn,
html body .mini-action[data-type="void"],
html body .mini-action[data-type="refund"]{
  min-height:38px!important;
  padding:9px 18px!important;
}

/* V170.5 - Room action visibility: only show actions allowed by current room status */
html body #checkInRoomBtn.hidden,
html body #payRoomNowBtn.hidden,
html body #printRoomTicketBtn.hidden,
html body .room-ticket-btn.hidden {
  display: none !important;
}

/* V170.6: BIR Reports remaining buttons - remove dark blue, match header cream/gold theme */
html body #openBirSettingsModalBtn,
html body #cancelBirSettingsModalBtn,
html body #saveBirSettingsBtn,
html body #generateXBtn,
html body #generateZBtn,
html body #refreshReportsBtn,
html body #birSettingsModal .bir-modal-actions button,
html body #birSettingsModal button:not(.qp-modal-close),
html body .reading-actions button,
html body .bir-settings-summary button,
html body #reportsTab button:not(.active):not(.tab),
html body #birTab button:not(.active):not(.tab){
  background:var(--qp-header-cream,#fff6e4)!important;
  color:var(--qp-header-text,#4b3526)!important;
  border:1px solid var(--qp-header-gold,#d6ad58)!important;
  border-radius:999px!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
  font-weight:900!important;
  transform:none!important;
}
html body #openBirSettingsModalBtn:hover,
html body #cancelBirSettingsModalBtn:hover,
html body #saveBirSettingsBtn:hover,
html body #generateXBtn:hover,
html body #generateZBtn:hover,
html body #refreshReportsBtn:hover,
html body #birSettingsModal .bir-modal-actions button:hover,
html body #birSettingsModal button:not(.qp-modal-close):hover,
html body .reading-actions button:hover,
html body .bir-settings-summary button:hover,
html body #reportsTab button:not(.active):not(.tab):hover,
html body #birTab button:not(.active):not(.tab):hover{
  background:var(--qp-header-cream-hover,#fff1cf)!important;
  color:var(--qp-header-text,#4b3526)!important;
  border-color:var(--qp-header-gold-strong,#caa86a)!important;
  box-shadow:0 13px 28px rgba(75,53,38,.12)!important;
  transform:none!important;
}
html body #birSettingsModal .qp-modal-close{
  background:rgba(255,246,228,.96)!important;
  color:var(--qp-header-text,#4b3526)!important;
  border:1px solid var(--qp-header-gold,#d6ad58)!important;
  box-shadow:0 10px 22px rgba(75,53,38,.14)!important;
}
html body #birSettingsModal .qp-modal-close:hover{
  background:var(--qp-header-cream-hover,#fff1cf)!important;
  color:var(--qp-header-text,#4b3526)!important;
  border-color:var(--qp-header-gold-strong,#caa86a)!important;
}

/* V170.8 BIR inner tabs + auto-search pagination */
.bir-report-tabs-card{
  margin-top:18px;
  padding:14px;
  border:1px solid rgba(212,169,79,.55);
  border-radius:20px;
  background:rgba(255,250,240,.82);
  box-shadow:0 12px 30px rgba(91,58,31,.07);
}
.bir-inner-tabs{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:14px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(212,169,79,.35);
}
.bir-inner-tabs button{
  border:1px solid rgba(212,169,79,.8)!important;
  background:linear-gradient(180deg,#fffdf8,#fff3d8)!important;
  color:#4a2e17!important;
  border-radius:999px!important;
  padding:10px 14px!important;
  box-shadow:0 8px 18px rgba(91,58,31,.08)!important;
  font-weight:900!important;
}
.bir-inner-tabs button.active,
.bir-inner-tabs button:hover{
  background:linear-gradient(180deg,#9b6633,#6f4424)!important;
  color:#fffdf8!important;
  transform:translateY(-1px);
}
.bir-tab-panel{display:none;}
.bir-tab-panel.active{display:block;}
.bir-tab-toolbar{
  display:grid;
  grid-template-columns:1fr minmax(260px,420px) 90px;
  gap:12px;
  align-items:center;
  margin:4px 0 10px;
}
.bir-tab-toolbar h3{margin:0!important;}
.bir-tab-toolbar input,
.bir-tab-toolbar select{
  border:1px solid rgba(212,169,79,.75)!important;
  border-radius:15px!important;
  background:#fffdf8!important;
  padding:12px 14px!important;
  color:#102044!important;
  font-weight:700!important;
}
.bir-pager{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:12px 0 2px;
  color:#5f6f86;
  font-weight:800;
}
.bir-pager .pager-actions{display:flex;align-items:center;gap:8px;}
.bir-pager button{
  border:1px solid rgba(212,169,79,.8)!important;
  background:linear-gradient(180deg,#fffdf8,#fff3d8)!important;
  color:#4a2e17!important;
  border-radius:999px!important;
  padding:8px 13px!important;
  font-weight:900!important;
}
.bir-pager button:disabled{opacity:.45;cursor:not-allowed;transform:none!important;}
@media(max-width:850px){
  .bir-tab-toolbar{grid-template-columns:1fr;}
  .bir-pager{align-items:flex-start;flex-direction:column;}
}

/* V170.9: make Print Room Ticket button same size as Check-in button */
html body #printRoomTicketBtn,
html body .room-order-panel #printRoomTicketBtn,
html body .room-order-panel .room-ticket-btn{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  margin:16px 0 12px!important;
  min-height:56px!important;
  padding:14px 18px!important;
  border-radius:16px!important;
  font-weight:900!important;
}


/* V170.10: move Generate X/Z controls inside Daily Sales/X/Z tab */
.reading-actions-inside-tab{
  margin:0 0 18px 0!important;
  padding:14px!important;
  border:1px solid rgba(214,173,88,.55)!important;
  border-radius:18px!important;
  background:rgba(255,246,228,.72)!important;
}
#birTabDaily .reading-actions-inside-tab + .bir-tab-toolbar{
  margin-top:0!important;
}


/* V170.11: remove POS scan/search product box */
#posTab .scan-box{
  display:none!important;
}


/* V170.12: polished BIR compliance summary cards */
.bir-dashboard-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  margin:16px 0 18px!important;
}
.bir-info-card,
.bir-metric-card{
  position:relative!important;
  overflow:hidden!important;
  border:1px solid rgba(214,173,88,.45)!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#fffdf8 0%,#fff5df 100%)!important;
  box-shadow:0 14px 32px rgba(75,53,38,.07)!important;
}
.bir-info-card{
  min-height:128px!important;
  padding:18px!important;
  display:flex!important;
  align-items:flex-start!important;
  gap:14px!important;
}
.bir-info-card::after,
.bir-metric-card::after{
  content:""!important;
  position:absolute!important;
  width:96px!important;
  height:96px!important;
  right:-34px!important;
  top:-34px!important;
  border-radius:999px!important;
  background:rgba(214,173,88,.16)!important;
}
.bir-info-icon{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:#fff6e4!important;
  border:1px solid rgba(214,173,88,.55)!important;
  box-shadow:0 10px 20px rgba(75,53,38,.08)!important;
  font-size:20px!important;
}
.bir-info-copy{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  flex-direction:column!important;
  gap:5px!important;
}
.bir-info-label{
  color:#7a654f!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.07em!important;
  text-transform:uppercase!important;
}
.bir-info-copy b{
  color:#13234a!important;
  font-size:16px!important;
  line-height:1.25!important;
}
.bir-info-copy small{
  color:#5f738a!important;
  font-weight:800!important;
  line-height:1.35!important;
}
.bir-metric-card{
  min-height:92px!important;
  padding:18px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:8px!important;
}
.bir-metric-card span{
  color:#52677f!important;
  font-size:14px!important;
  font-weight:800!important;
}
.bir-metric-card b{
  position:relative!important;
  z-index:2!important;
  color:#087247!important;
  font-size:28px!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:-.03em!important;
}
@media(max-width:1100px){
  .bir-dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:650px){
  .bir-dashboard-grid{grid-template-columns:1fr!important;}
  .bir-info-card{min-height:auto!important;}
}


/* V170.13: Desktop POS shift, cash drawer, discount approval, EOD checklist */
.shift-ops-panel,.eod-checklist-panel{
  border:1px solid rgba(214,173,88,.5)!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#fffdf8,#fff5df)!important;
  padding:14px!important;
  margin:0 0 14px!important;
  box-shadow:0 12px 26px rgba(75,53,38,.07)!important;
}
.shift-ops-head,.eod-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;margin-bottom:10px!important;color:#4b3526!important}
.shift-ops-grid{display:grid!important;grid-template-columns:1fr auto!important;gap:10px!important;align-items:end!important}
.shift-ops-grid label{font-weight:900!important;color:#52677f!important;font-size:12px!important}
.shift-ops-grid input,.discount-approval-wrap input,.eod-checklist-panel textarea{width:100%!important;border:1px solid rgba(214,173,88,.55)!important;border-radius:14px!important;padding:10px!important;background:#fff!important}
.cash-drawer-summary{margin-top:10px!important;padding:10px!important;border-radius:14px!important;background:#fffaf0!important;color:#4b3526!important;font-weight:800!important;font-size:13px!important}
.discount-approval-wrap{display:grid!important;grid-template-columns:auto 1fr!important;gap:10px!important;align-items:center!important;background:#fff8e8!important;border:1px dashed rgba(214,173,88,.8)!important;border-radius:14px!important;padding:9px!important}
.discount-approval-wrap.hidden{display:none!important}
.eod-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:10px!important;margin:10px 0!important}
.eod-grid label{background:#fff!important;border:1px solid rgba(214,173,88,.4)!important;border-radius:999px!important;padding:10px 12px!important;font-weight:900!important;color:#4b3526!important}
#eodStatusText{font-weight:900!important;color:#087247!important}
@media(max-width:900px){.shift-ops-grid{grid-template-columns:1fr!important}.eod-grid{grid-template-columns:1fr!important}}


/* V170.14: Shift/Cash Drawer moved to top modal + final header-button color cleanup */
.shift-cash-modal.qp-modal{
  align-items:center!important;
  justify-content:center!important;
}
.shift-cash-modal-card{
  width:min(720px,94vw)!important;
  border-radius:24px!important;
  overflow:hidden!important;
}
.shift-cash-modal-head{
  background:linear-gradient(135deg,#8b5e34,#4b3526)!important;
  color:#fff8e8!important;
  border-bottom:1px solid rgba(214,173,88,.45)!important;
}
.shift-cash-modal-head h3{
  color:#fff8e8!important;
}
.shift-cash-modal-body{
  padding:22px!important;
  background:#fffaf0!important;
}
.shift-cash-modal .shift-ops-panel{
  margin:0!important;
  background:linear-gradient(135deg,#fffdf8,#fff6e4)!important;
}
.shift-cash-modal .shift-ops-head b{
  display:block!important;
  color:#13234a!important;
  font-size:18px!important;
}
.shift-cash-modal .shift-ops-head small{
  display:block!important;
  margin-top:3px!important;
  color:#5f738a!important;
  font-weight:800!important;
}
.shift-cash-modal .shift-ops-grid{
  grid-template-columns:1fr 170px!important;
  gap:12px!important;
}
.shift-cash-modal .shift-ops-grid button{
  min-height:46px!important;
}
#openShiftCashDrawerBtn{
  white-space:nowrap!important;
}

/* Force all action buttons to the same cream/gold header theme; only active nav may stay brown */
html body button:not(.active):not(.tab.active):not(.category-btn.active):not(#checkoutBtn):not(#checkInRoomBtn):not(#payRoomNowBtn):not(#loginBtn),
html body .mini-action,
html body .reprintSaleBtn,
html body .voidSaleBtn,
html body .refundSaleBtn,
html body #startShiftBtn,
html body #endShiftBtn,
html body #backupNowBtn,
html body #openDataFolderBtn,
html body #printReceiptBtn,
html body #closeReceiptBtn{
  background:#fff6e4!important;
  color:#4b3526!important;
  border:1px solid #d6ad58!important;
  border-radius:999px!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
}
html body button:not(.active):not(.tab.active):not(.category-btn.active):not(#checkoutBtn):not(#checkInRoomBtn):not(#payRoomNowBtn):not(#loginBtn):hover,
html body .mini-action:hover,
html body .reprintSaleBtn:hover,
html body .voidSaleBtn:hover,
html body .refundSaleBtn:hover,
html body #startShiftBtn:hover,
html body #endShiftBtn:hover,
html body #backupNowBtn:hover,
html body #openDataFolderBtn:hover,
html body #printReceiptBtn:hover,
html body #closeReceiptBtn:hover{
  background:#fff1cf!important;
  color:#4b3526!important;
  border-color:#caa86a!important;
  box-shadow:0 13px 28px rgba(75,53,38,.13)!important;
}
html body .qp-modal-close{
  background:rgba(255,248,232,.18)!important;
  color:#fff8e8!important;
  border:1px solid rgba(255,248,232,.55)!important;
  box-shadow:none!important;
}
html body .qp-modal-close:hover{
  background:rgba(255,248,232,.28)!important;
  color:#fff8e8!important;
}
@media(max-width:760px){
  .shift-cash-modal .shift-ops-grid{grid-template-columns:1fr!important}
}


/* V170.15: polished EOD checkboxes + one-row top navigation */
html body .topbar{
  display:grid!important;
  grid-template-columns:minmax(250px,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  padding:10px 18px!important;
}
html body .topbar nav{
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  max-width:100%!important;
}
html body .topbar nav button,
html body .topbar nav .sync-badge{
  flex:0 0 auto!important;
  min-height:40px!important;
  padding:9px 14px!important;
  font-size:13px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
html body .topbar nav button .nav-ico,
html body .topbar nav button .btn-ico{
  margin-right:5px!important;
}
html body #openShiftCashDrawerBtn{
  padding-left:13px!important;
  padding-right:13px!important;
}
html body #syncStatusBadge{
  padding:9px 13px!important;
  min-width:0!important;
  max-width:110px!important;
}
html body #logoutBtn{
  padding-left:13px!important;
  padding-right:13px!important;
}
@media(max-width:1250px){
  html body .topbar{
    grid-template-columns:minmax(215px,1fr) auto!important;
    padding-left:14px!important;
    padding-right:14px!important;
  }
  html body .topbar h2{
    font-size:23px!important;
  }
  html body .topbar nav{
    gap:6px!important;
  }
  html body .topbar nav button,
  html body .topbar nav .sync-badge{
    font-size:12px!important;
    padding:8px 11px!important;
  }
}
@media(max-width:1050px){
  html body .topbar{
    grid-template-columns:1fr!important;
  }
  html body .topbar nav{
    justify-content:flex-start!important;
    overflow-x:auto!important;
    padding-bottom:4px!important;
  }
}

/* EOD checklist checkbox redesign */
html body .eod-checklist-panel{
  padding:18px!important;
}
html body .eod-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:12px!important;
  margin:14px 0!important;
}
html body .eod-grid label{
  position:relative!important;
  min-height:64px!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  padding:12px 14px!important;
  border:1px solid rgba(214,173,88,.55)!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#fffdf8,#fff6e4)!important;
  box-shadow:0 10px 24px rgba(75,53,38,.06)!important;
  cursor:pointer!important;
  user-select:none!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}
html body .eod-grid label:hover{
  background:#fff1cf!important;
  border-color:#caa86a!important;
  box-shadow:0 14px 30px rgba(75,53,38,.10)!important;
}
html body .eod-grid label input[type="checkbox"]{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
  width:1px!important;
  height:1px!important;
}
html body .eod-check-ui{
  width:28px!important;
  height:28px!important;
  flex:0 0 28px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:10px!important;
  border:2px solid #d6ad58!important;
  background:#fffaf0!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 8px 16px rgba(75,53,38,.08)!important;
}
html body .eod-check-text{
  color:#4b3526!important;
  font-size:14px!important;
  line-height:1.2!important;
  font-weight:900!important;
}
html body .eod-grid label:has(input[type="checkbox"]:checked){
  background:linear-gradient(135deg,#fff6e4,#f5dfad)!important;
  border-color:#8b5e34!important;
}
html body .eod-grid label:has(input[type="checkbox"]:checked) .eod-check-ui{
  background:linear-gradient(135deg,#8b5e34,#4b3526)!important;
  border-color:#d6ad58!important;
}
html body .eod-grid label:has(input[type="checkbox"]:checked) .eod-check-ui::after{
  content:"✓"!important;
  color:#fff8e8!important;
  font-size:18px!important;
  font-weight:950!important;
  line-height:1!important;
}
html body .eod-grid label:has(input[type="checkbox"]:checked) .eod-check-text{
  color:#13234a!important;
}
html body .eod-checklist-panel textarea{
  min-height:58px!important;
  border-radius:16px!important;
  background:#fffdf8!important;
}
@media(max-width:1200px){
  html body .eod-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  html body .eod-grid{grid-template-columns:1fr!important;}
}


/* V170.16: TRUE FIX - Shift / Cash Drawer must be real modal overlay, never inline page content */
html body #shiftCashDrawerModal.qp-modal{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100vh!important;
  z-index:999999!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:22px!important;
  background:rgba(22,18,14,.52)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  overflow:auto!important;
}
html body #shiftCashDrawerModal.qp-modal.hidden,
html body #shiftCashDrawerModal.hidden{
  display:none!important;
}
html body #shiftCashDrawerModal .shift-cash-modal-card,
html body #shiftCashDrawerModal .qp-modal-card{
  position:relative!important;
  width:min(760px,94vw)!important;
  max-height:92vh!important;
  margin:auto!important;
  overflow:hidden!important;
  border-radius:26px!important;
  background:#fffaf0!important;
  border:1px solid rgba(214,173,88,.7)!important;
  box-shadow:0 34px 90px rgba(31,24,16,.42)!important;
  transform:none!important;
}
html body #shiftCashDrawerModal .shift-cash-modal-head,
html body #shiftCashDrawerModal .qp-modal-head{
  position:relative!important;
  min-height:74px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  padding:20px 24px!important;
  background:linear-gradient(135deg,#8b5e34,#4b3526)!important;
  color:#fff8e8!important;
}
html body #shiftCashDrawerModal .shift-cash-modal-head h3,
html body #shiftCashDrawerModal .qp-modal-head h3{
  margin:0!important;
  color:#fff8e8!important;
  font-size:22px!important;
  font-weight:950!important;
}
html body #shiftCashDrawerModal #closeShiftCashDrawerBtn,
html body #shiftCashDrawerModal .qp-modal-close{
  position:static!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:999px!important;
  background:rgba(255,248,232,.16)!important;
  color:#fff8e8!important;
  border:1px solid rgba(255,248,232,.55)!important;
  font-size:22px!important;
  line-height:1!important;
  box-shadow:none!important;
}
html body #shiftCashDrawerModal #closeShiftCashDrawerBtn:hover{
  background:rgba(255,248,232,.28)!important;
  color:#fff8e8!important;
}
html body #shiftCashDrawerModal .shift-cash-modal-body,
html body #shiftCashDrawerModal .qp-modal-body{
  padding:24px!important;
  background:#fffaf0!important;
}
html body #shiftCashDrawerModal .shift-ops-panel{
  border:1px solid rgba(214,173,88,.55)!important;
  border-radius:22px!important;
  background:linear-gradient(135deg,#fffdf8,#fff6e4)!important;
  padding:18px!important;
  margin:0!important;
}
html body #shiftCashDrawerModal .shift-ops-grid{
  display:grid!important;
  grid-template-columns:1fr 180px!important;
  gap:14px!important;
  align-items:end!important;
}
html body #shiftCashDrawerModal .shift-ops-grid label{
  color:#52677f!important;
  font-size:13px!important;
  font-weight:900!important;
}
html body #shiftCashDrawerModal .shift-ops-grid input{
  min-height:48px!important;
  border-radius:16px!important;
}
html body #shiftCashDrawerModal #startShiftBtn,
html body #shiftCashDrawerModal #endShiftBtn{
  min-height:48px!important;
  border-radius:999px!important;
  background:#fff6e4!important;
  color:#4b3526!important;
  border:1px solid #d6ad58!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
}
html body #shiftCashDrawerModal #startShiftBtn:hover,
html body #shiftCashDrawerModal #endShiftBtn:hover{
  background:#fff1cf!important;
  border-color:#caa86a!important;
}
@media(max-width:760px){
  html body #shiftCashDrawerModal.qp-modal{
    padding:12px!important;
    align-items:flex-start!important;
  }
  html body #shiftCashDrawerModal .shift-ops-grid{
    grid-template-columns:1fr!important;
  }
}


/* V170.17: X/Z Reading generation guard and clearer disabled state */
html body #generateXBtn:disabled,
html body #generateZBtn:disabled{
  opacity:.55!important;
  cursor:not-allowed!important;
  filter:grayscale(.25)!important;
}
html body #birTabDaily .reading-actions-inside-tab::after{
  content:"X updates the current interim reading. Z is final and locks the selected business date."!important;
  display:block!important;
  flex-basis:100%!important;
  margin-top:6px!important;
  color:#6b5a44!important;
  font-size:12px!important;
  font-weight:800!important;
}


/* V170.18: X/Z Reading display fix */
.reading-type-pill,
.reading-status-pill{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:34px!important;
  padding:5px 10px!important;
  border-radius:999px!important;
  font-size:12px!important;
  font-weight:950!important;
  border:1px solid rgba(214,173,88,.55)!important;
}
.reading-type-pill.x{background:#fff6e4!important;color:#4b3526!important}
.reading-type-pill.z{background:#8b5e34!important;color:#fff8e8!important}
.reading-status-pill.generated{background:#fff6e4!important;color:#4b3526!important}
.reading-status-pill.closed{background:#dcfce7!important;color:#166534!important;border-color:#86efac!important}
.reading-actions-inside-tab.reading-locked{
  border-color:#86efac!important;
  background:linear-gradient(135deg,#f0fdf4,#fff6e4)!important;
}
.reading-actions-inside-tab.reading-locked::after{
  content:"This business date is already CLOSED by Z-Reading. X/Z generation is locked."!important;
  color:#166534!important;
}

/* V170.19: clearer X/Z note after duplicate cleanup */
html body #birTabDaily .reading-actions-inside-tab::after{
  content:"X updates only one interim row. Z is final and locks the selected business date."!important;
}


/* V170.20: Reset Local Database control */
.db-reset-card{
  margin-top:12px!important;
  border:1px solid rgba(214,173,88,.45)!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#fffdf8,#fff6e4)!important;
}
#resetLocalDatabaseBtn{
  background:#fff6e4!important;
  color:#4b3526!important;
  border:1px solid #d6ad58!important;
  border-radius:999px!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
}
#resetLocalDatabaseBtn:hover{
  background:#fff1cf!important;
  border-color:#caa86a!important;
}

/* V170.21: reset is automatic, no visible reset button */
.db-reset-card,#resetLocalDatabaseBtn{display:none!important;}

/* V170.22: forced reset runs before data load; no visible reset UI */
.db-reset-card,#resetLocalDatabaseBtn{display:none!important;}


/* V170.23: End-of-day checklist working state */
#eodStatusText.ready{
  color:#087247!important;
  font-weight:950!important;
}
#eodStatusText.warning{
  color:#8b5e34!important;
  font-weight:950!important;
}
#saveEodChecklistBtn{
  background:#fff6e4!important;
  color:#4b3526!important;
  border:1px solid #d6ad58!important;
  border-radius:999px!important;
}


/* V170.24: Per-terminal X/Z + consolidated daily report */
.terminal-pill{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:8px 12px!important;
  border-radius:999px!important;
  background:#fffaf0!important;
  color:#4b3526!important;
  border:1px solid rgba(214,173,88,.7)!important;
  font-weight:950!important;
  font-size:12px!important;
}
.consolidated-summary-strip{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:12px!important;
  margin:0 0 14px!important;
}
.consolidated-summary-strip div{
  border:1px solid rgba(214,173,88,.5)!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#fffdf8,#fff6e4)!important;
  padding:14px!important;
  box-shadow:0 10px 22px rgba(75,53,38,.06)!important;
}
.consolidated-summary-strip span{
  display:block!important;
  color:#6b5a44!important;
  font-size:12px!important;
  font-weight:900!important;
  margin-bottom:5px!important;
}
.consolidated-summary-strip b{
  color:#13234a!important;
  font-size:18px!important;
  font-weight:950!important;
}
.consolidated-total-card{
  border-color:#86efac!important;
  background:linear-gradient(135deg,#f0fdf4,#fff6e4)!important;
}
@media(max-width:1100px){
  .consolidated-summary-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:650px){
  .consolidated-summary-strip{grid-template-columns:1fr!important;}
}


/* V170.25: Remove server UI + backend-style POS login */
#testServerBtn,
.login-report-access,
#openReportsLink{
  display:none!important;
}
.qp-backend-login.login-wrap{
  min-height:100vh!important;
  display:grid!important;
  place-items:center!important;
  padding:24px!important;
  background:
    radial-gradient(circle at center,rgba(255,243,205,.58),transparent 34%),
    linear-gradient(135deg,#fffaf0,#f5ead2)!important;
}
.backend-style-login-card{
  width:min(560px,94vw)!important;
  padding:34px 36px!important;
  border-radius:28px!important;
  background:rgba(255,253,248,.96)!important;
  border:1px solid rgba(214,173,88,.55)!important;
  box-shadow:0 34px 95px rgba(75,53,38,.17)!important;
}
.backend-login-title{
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
  margin-bottom:22px!important;
}
.backend-login-logo{
  width:62px!important;
  height:62px!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 62px!important;
  border-radius:999px!important;
  background:#fffaf0!important;
  border:1px solid #d6ad58!important;
  box-shadow:0 12px 26px rgba(75,53,38,.10)!important;
  font-size:29px!important;
}
.backend-style-login-card h1{
  margin:0!important;
  color:#111827!important;
  font-size:34px!important;
  line-height:1.05!important;
  font-weight:950!important;
  letter-spacing:.02em!important;
}
.backend-login-title p{
  margin:8px 0 0!important;
  color:#8b5e34!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:.28em!important;
}
.backend-style-login-card .login-fields label{
  margin:18px 0 9px!important;
  color:#4b3526!important;
  font-size:13px!important;
  font-weight:950!important;
  letter-spacing:.08em!important;
}
.backend-style-login-card .login-fields label span{
  color:#caa86a!important;
  margin-right:8px!important;
}
.backend-style-login-card input{
  min-height:58px!important;
  padding:15px 16px!important;
  border-radius:17px!important;
  border:1px solid #d6ad58!important;
  background:#edf4ff!important;
  color:#111827!important;
  font-size:15px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important;
}
.backend-style-login-card input:focus{
  outline:none!important;
  border-color:#8b5e34!important;
  box-shadow:0 0 0 4px rgba(214,173,88,.18)!important;
}
.backend-style-login-card #loginBtn{
  width:100%!important;
  min-height:54px!important;
  margin-top:20px!important;
  border-radius:999px!important;
  background:#fff6e4!important;
  color:#4b3526!important;
  border:1px solid #d6ad58!important;
  font-weight:950!important;
  box-shadow:0 12px 26px rgba(75,53,38,.10)!important;
}
.backend-style-login-card #loginBtn:hover{
  background:#fff1cf!important;
  border-color:#caa86a!important;
}
.backend-style-login-card .message{
  margin:12px 0 0!important;
  min-height:22px!important;
}
.backend-login-foot{
  margin-top:18px!important;
  color:#6b5a44!important;
  font-size:16px!important;
  font-weight:950!important;
  letter-spacing:.01em!important;
}
@media(max-width:620px){
  .backend-style-login-card{padding:26px 22px!important;}
  .backend-login-title{align-items:flex-start!important;}
  .backend-style-login-card h1{font-size:27px!important;}
  .backend-login-title p{letter-spacing:.16em!important;}
}


/* V170.26: cleaner POS login */
.simpler-pos-login{
  width:min(600px,94vw)!important;
  padding:34px 38px!important;
}
.simpler-pos-login .backend-login-badge-row{
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
  margin-bottom:20px!important;
}
.simpler-pos-login .backend-login-subtitle{
  color:#8b5e34!important;
  font-size:18px!important;
  font-weight:950!important;
  letter-spacing:.22em!important;
  text-transform:uppercase!important;
}
.simpler-pos-login .backend-login-logo{
  width:68px!important;
  height:68px!important;
  flex:0 0 68px!important;
  font-size:31px!important;
}
.simpler-pos-login .login-fields label:first-child{margin-top:4px!important;}
@media(max-width:620px){
  .simpler-pos-login{padding:24px 22px!important;}
  .simpler-pos-login .backend-login-badge-row{gap:12px!important;}
  .simpler-pos-login .backend-login-subtitle{font-size:15px!important;letter-spacing:.12em!important;}
}


/* V170.28: remove odd login header bar */
.qp-backend-login .login-header,
.qp-backend-login .backend-login-title{
  display:none!important;
}
.simpler-pos-login .backend-login-badge-row{
  margin-top:4px!important;
  margin-bottom:24px!important;
}


/* V170.29: remove dark login strip + prevent login from showing after login */
.qp-backend-login .backend-login-title,
.qp-backend-login .login-header,
.qp-backend-login .login-title-bar,
.backend-style-login-card > .backend-login-title,
.backend-style-login-card > .login-header,
.backend-style-login-card > .login-title-bar{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  padding:0!important;
  margin:0!important;
  overflow:hidden!important;
}

html.is-pos-screen #loginView,
body.is-pos-screen #loginView,
#loginView.hidden{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  padding:0!important;
  margin:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
}

body.is-pos-screen #posView{
  display:block!important;
}
body.is-login-screen #posView{
  display:none!important;
}
body.is-pos-screen{
  background:#f7efe1!important;
}


/* V170.30: kill old global login pseudo-header completely */
.qp-backend-login .login-card::before,
.qp-backend-login .backend-style-login-card::before,
.qp-backend-login .simpler-pos-login::before,
body.is-login-screen .login-card::before{
  content:none!important;
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  padding:0!important;
  margin:0!important;
  overflow:hidden!important;
}

/* keep POS login button cream, not old navy style */
.qp-backend-login .login-card #loginBtn,
.qp-backend-login .backend-style-login-card #loginBtn,
.qp-backend-login .simpler-pos-login #loginBtn{
  width:auto!important;
  min-width:170px!important;
  min-height:54px!important;
  margin-top:20px!important;
  border-radius:18px!important;
  background:#fff6e4!important;
  color:#4b3526!important;
  border:1px solid #d6ad58!important;
  box-shadow:0 12px 26px rgba(75,53,38,.10)!important;
}

.qp-backend-login .login-card,
.qp-backend-login .backend-style-login-card,
.qp-backend-login .simpler-pos-login{
  overflow:visible!important;
}


/* V170.31: login button full-width + visible text on hover */
.qp-backend-login .login-card #loginBtn,
.qp-backend-login .backend-style-login-card #loginBtn,
.qp-backend-login .simpler-pos-login #loginBtn{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-height:58px!important;
  padding:15px 18px!important;
  margin-top:22px!important;
  border-radius:17px!important;
  background:#fff6e4!important;
  color:#4b3526!important;
  -webkit-text-fill-color:#4b3526!important;
  border:1px solid #d6ad58!important;
  box-shadow:0 12px 26px rgba(75,53,38,.10)!important;
  font-weight:950!important;
  opacity:1!important;
  filter:none!important;
  text-shadow:none!important;
}

.qp-backend-login .login-card #loginBtn:hover,
.qp-backend-login .login-card #loginBtn:focus,
.qp-backend-login .login-card #loginBtn:active,
.qp-backend-login .backend-style-login-card #loginBtn:hover,
.qp-backend-login .backend-style-login-card #loginBtn:focus,
.qp-backend-login .backend-style-login-card #loginBtn:active,
.qp-backend-login .simpler-pos-login #loginBtn:hover,
.qp-backend-login .simpler-pos-login #loginBtn:focus,
.qp-backend-login .simpler-pos-login #loginBtn:active{
  background:#fff1cf!important;
  color:#4b3526!important;
  -webkit-text-fill-color:#4b3526!important;
  border-color:#caa86a!important;
  opacity:1!important;
  filter:none!important;
  text-shadow:none!important;
}

.qp-backend-login .login-card #loginBtn *,
.qp-backend-login .backend-style-login-card #loginBtn *,
.qp-backend-login .simpler-pos-login #loginBtn *{
  color:#4b3526!important;
  -webkit-text-fill-color:#4b3526!important;
  opacity:1!important;
  filter:none!important;
  text-shadow:none!important;
}


/* V171 TABLET PWA / APP-LIKE MODE
   Keeps the POS looking like a real installed app on Android tablet/iPad. */
html.is-pwa-standalone,
html.is-pwa-standalone body {
  width: 100%;
  min-height: 100%;
  overscroll-behavior: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.pwa-install-btn {
  width: 100%;
  margin: 12px 0 4px;
  min-height: 46px;
  border-radius: 14px;
  font-weight: 800;
}

@media (min-width: 768px) {
  body {
    overscroll-behavior: none;
    touch-action: manipulation;
    background: #eef5ef;
  }

  input,
  button,
  select,
  textarea {
    font-size: 16px;
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 50;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  .tab,
  button,
  select,
  input,
  textarea {
    min-height: 42px;
  }

  .product-card,
  .room-card,
  .panel,
  .tab,
  button {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}

@media (display-mode: standalone) {
  body {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }

  .backend-login-foot::after {
    content: ' • Tablet App Mode';
  }
}

.room-guest-line{display:block;margin-top:4px;font-size:12px;color:#6b4f32;font-weight:800}
.room-charge-row b{word-break:break-word}


/* V175: occupied room guest name is fixed/readonly */
#roomGuestInput.readonly-guest,
#roomGuestInput[readonly] {
  background: #f3eadc;
  border-color: #d6ad62;
  color: #4b321f;
  font-weight: 800;
  cursor: not-allowed;
}


/* V176: occupied room full order details are fixed/readonly */
#roomDurationType.readonly-room-field,
#roomDurationType:disabled,
#roomInclusionsInput.readonly-room-field,
#roomInclusionsInput[readonly],
#roomGuestInput.readonly-room-field {
  background: #f3eadc !important;
  border-color: #d6ad62 !important;
  color: #4b321f !important;
  font-weight: 800;
  cursor: not-allowed;
  opacity: 1;
}
#roomDurationType:disabled {
  -webkit-text-fill-color: #4b321f;
}

/* V181: cross-platform install behavior for Android/Desktop and iOS */
.pwa-install-btn {
  width: 100%;
  min-height: 58px;
  margin: 14px 0 10px;
  border-radius: 16px;
  border: 1px solid #d6ad62;
  background: linear-gradient(135deg, #fff6dd, #f7dfab);
  color: #3b2a1c;
  font-weight: 900;
  letter-spacing: .3px;
  box-shadow: 0 14px 30px rgba(111, 78, 45, .12);
}
.pwa-install-btn:hover {
  transform: translateY(-1px) scale(1.01);
}
.pwa-install-help {
  margin: 0 0 10px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px dashed #d6ad62;
  background: #fffaf0;
  color: #4b321f;
  font-weight: 800;
  font-size: 13px;
  line-height: 1.45;
}


/* V181: iOS Add to Home Screen instruction modal */
.ios-install-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(31, 20, 12, .55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.ios-install-modal {
  width: min(430px, 96vw);
  position: relative;
  border-radius: 24px;
  padding: 24px 22px 22px;
  background: #fffaf0;
  border: 1px solid #d6ad62;
  box-shadow: 0 24px 70px rgba(31, 20, 12, .30);
  color: #3b2a1c;
  text-align: left;
}
.ios-install-close {
  position: absolute;
  right: 14px;
  top: 12px;
  width: 38px;
  height: 38px;
  min-height: 38px;
  border-radius: 50%;
  border: 1px solid #ead3a1;
  background: #fff;
  color: #4b321f;
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
}
.ios-install-icon {
  width: 54px;
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  margin-bottom: 12px;
  background: linear-gradient(135deg, #fff6dd, #f7dfab);
  border: 1px solid #d6ad62;
  font-size: 28px;
}
.ios-install-modal h3 {
  margin: 0 42px 8px 0;
  font-size: 20px;
  color: #3b2a1c;
}
.ios-install-modal p {
  margin: 0 0 14px;
  font-size: 14px;
  line-height: 1.45;
  color: #5d4430;
  font-weight: 700;
}
.ios-install-modal ol {
  margin: 0;
  padding-left: 20px;
}
.ios-install-modal li {
  margin: 10px 0;
  font-size: 15px;
  line-height: 1.45;
  font-weight: 800;
}
.ios-share-symbol {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 26px;
  padding: 0 6px;
  border-radius: 8px;
  border: 1px solid #d6ad62;
  background: #fff;
  color: #3b2a1c;
  font-weight: 900;
}
.ios-install-note {
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #fff4d5;
  border: 1px dashed #d6ad62;
  color: #4b321f;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.4;
}


/* ==========================================================
   V186 iPad/tablet landscape responsive sizing
   Reference: V181 scroll retained, but header/cards/fonts scale
   cleanly from 1024x768 up to 1376x1032.
   ========================================================== */
html, body{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  background:
    radial-gradient(circle at 12% 0%, rgba(212,169,79,.16), transparent 28%),
    linear-gradient(135deg,#fffaf2,#f4ead8 58%,#fffdf8)!important;
}
#posView,.tab-content,.layout,.inventory-layout,.topbar,.panel{min-width:0!important;}
.topbar{
  display:grid!important;
  grid-template-columns:clamp(170px,18vw,255px) minmax(0,1fr)!important;
  align-items:center!important;
  gap:clamp(6px,1vw,14px)!important;
  padding:clamp(8px,1.15vw,14px) clamp(10px,1.35vw,20px)!important;
  overflow:hidden!important;
}
.topbar > div:first-child{min-width:0!important;}
.topbar h2{
  margin:0 0 3px!important;
  font-size:clamp(18px,2.05vw,26px)!important;
  line-height:1.05!important;
  letter-spacing:-.25px!important;
  white-space:normal!important;
}
#userText{
  display:block;
  font-size:clamp(11px,1.15vw,15px)!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.topbar nav{
  min-width:0!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  justify-content:flex-start!important;
  align-items:center!important;
  gap:clamp(5px,.75vw,10px)!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  padding:2px 2px 4px!important;
}
.topbar nav::-webkit-scrollbar,.category-bar::-webkit-scrollbar{display:none;}
.topbar .tab,.topbar button,.topbar .sync-badge{
  flex:0 0 auto!important;
  min-height:clamp(36px,4.8vw,46px)!important;
  padding:clamp(8px,1.05vw,12px) clamp(11px,1.35vw,18px)!important;
  font-size:clamp(11px,1.18vw,14px)!important;
  line-height:1!important;
  white-space:nowrap!important;
  border-radius:999px!important;
}
.topbar .nav-ico{font-size:clamp(12px,1.25vw,16px)!important;}
.sync-badge{font-size:clamp(11px,1.05vw,13px)!important;}
.tab-content{
  padding:clamp(12px,1.45vw,20px)!important;
}
.layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) clamp(285px,29vw,400px)!important;
  gap:clamp(12px,1.5vw,20px)!important;
  align-items:start!important;
}
.inventory-layout{
  grid-template-columns:clamp(280px,30vw,420px) minmax(0,1fr)!important;
  gap:clamp(12px,1.5vw,20px)!important;
}
.cart-panel{
  position:sticky!important;
  top:clamp(74px,9.5vw,98px)!important;
  max-height:calc(100vh - clamp(90px,12vw,125px))!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch;
}
.panel{
  border-radius:clamp(16px,1.7vw,22px)!important;
  padding:clamp(12px,1.45vw,18px)!important;
}
.panel-head{
  display:flex!important;
  align-items:flex-start!important;
  gap:10px!important;
}
.panel-head h3,
.panel h3{
  font-size:clamp(17px,1.9vw,24px)!important;
  line-height:1.12!important;
}
.panel-head .muted,.small{
  font-size:clamp(11px,1.05vw,13px)!important;
}
.panel-head button,#refreshProductsBtn,#refreshRoomsBtn{
  min-width:clamp(105px,13vw,160px)!important;
  padding:clamp(8px,.95vw,12px) clamp(12px,1.4vw,20px)!important;
}
.category-bar{
  display:flex!important;
  flex-wrap:nowrap!important;
  overflow-x:auto!important;
  gap:clamp(6px,.85vw,10px)!important;
  padding:clamp(6px,.8vw,10px) 0 clamp(10px,1.2vw,16px)!important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.category-btn{
  flex:0 0 auto!important;
  min-height:clamp(36px,4.4vw,46px)!important;
  padding:clamp(8px,.95vw,12px) clamp(12px,1.35vw,18px)!important;
  font-size:clamp(11px,1.13vw,14px)!important;
}
.product-grid{
  grid-template-columns:repeat(auto-fill,minmax(clamp(118px,14.2vw,175px),1fr))!important;
  gap:clamp(9px,1.15vw,14px)!important;
}
.product-card{
  min-height:clamp(102px,14vh,136px)!important;
  padding:clamp(10px,1.1vw,14px)!important;
  border-radius:clamp(14px,1.45vw,18px)!important;
}
.product-card strong{
  font-size:clamp(12px,1.18vw,15px)!important;
  line-height:1.18!important;
}
.product-card small,
.product-card code{
  font-size:clamp(9px,.95vw,12px)!important;
  line-height:1.25!important;
}
.product-card span{
  font-size:clamp(15px,1.55vw,20px)!important;
  line-height:1.1!important;
}
.cart-list{
  min-height:clamp(92px,14vh,160px)!important;
  max-height:clamp(130px,24vh,260px)!important;
}
.cart-row{
  gap:clamp(5px,.8vw,9px)!important;
  padding:clamp(7px,.9vw,10px) 0!important;
  font-size:clamp(11px,1.05vw,14px)!important;
}
.totals{padding:clamp(10px,1.05vw,13px)!important;}
.totals div,label,input,select,textarea{
  font-size:clamp(12px,1.15vw,15px)!important;
}
input,select,textarea,button{
  min-height:clamp(38px,4.5vw,48px)!important;
}
.rooms-grid{
  grid-template-columns:repeat(auto-fill,minmax(clamp(220px,28vw,305px),1fr))!important;
  gap:clamp(10px,1.35vw,16px)!important;
}
.room-summary{
  grid-template-columns:repeat(auto-fit,minmax(clamp(105px,13vw,150px),1fr))!important;
  gap:clamp(8px,1vw,13px)!important;
}
.room-summary div{padding:clamp(10px,1.15vw,15px)!important;}
.room-summary b{font-size:clamp(18px,2.1vw,26px)!important;}
.room-summary span{font-size:clamp(9px,.95vw,12px)!important;}
.room-card{
  padding:clamp(12px,1.35vw,17px)!important;
  border-radius:clamp(16px,1.7vw,22px)!important;
}
.room-top h3{font-size:clamp(18px,2vw,24px)!important;}
.room-top p,.room-meta,.extra-rate{font-size:clamp(11px,1.05vw,14px)!important;}
.room-badge{font-size:clamp(9px,.92vw,12px)!important;padding:clamp(5px,.7vw,8px) clamp(8px,.9vw,11px)!important;}
.room-rates{gap:clamp(7px,.85vw,10px)!important;}
.room-rates div{padding:clamp(8px,.95vw,11px)!important;border-radius:clamp(11px,1.2vw,14px)!important;}
.room-rates small{font-size:clamp(10px,.98vw,12px)!important;}
.room-rates b{font-size:clamp(14px,1.45vw,18px)!important;}
.selected-room-card{padding:clamp(12px,1.25vw,16px)!important;}
.table{font-size:clamp(11px,1.05vw,14px)!important;}
.table th,.table td{padding:clamp(7px,.9vw,10px)!important;}
.login-wrap{
  min-height:100svh!important;
  padding:clamp(14px,2vw,28px)!important;
}
.login-card{
  width:min(92vw,560px)!important;
  padding:clamp(24px,3vw,40px)!important;
}
.backend-login-badge-row{gap:clamp(12px,1.8vw,24px)!important;}
.backend-login-logo{width:clamp(56px,7vw,72px)!important;height:clamp(56px,7vw,72px)!important;}
.backend-login-subtitle{font-size:clamp(18px,2.1vw,26px)!important;letter-spacing:clamp(4px,.6vw,8px)!important;}

/* iPad Mini / old 7.9 / 9th gen landscape tight widths */
@media (orientation: landscape) and (min-width: 1000px) and (max-width: 1139px){
  .topbar{grid-template-columns:clamp(165px,18vw,205px) minmax(0,1fr)!important;padding:8px 10px!important;gap:7px!important;}
  .topbar h2{font-size:clamp(18px,2.35vw,23px)!important;}
  #userText{font-size:12px!important;}
  .topbar nav{gap:6px!important;}
  .topbar .tab,.topbar button,.topbar .sync-badge{min-height:38px!important;padding:8px 11px!important;font-size:11px!important;}
  .layout{grid-template-columns:minmax(0,1fr) minmax(272px,29vw)!important;gap:12px!important;}
  .tab-content{padding:12px!important;}
  .panel{padding:12px!important;}
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr))!important;gap:9px!important;}
  .product-card{min-height:108px!important;padding:10px!important;}
  .rooms-grid{grid-template-columns:repeat(auto-fill,minmax(218px,1fr))!important;gap:10px!important;}
  .room-summary{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:8px!important;}
  .room-summary div{padding:10px!important;border-radius:14px!important;}
  .room-summary b{font-size:19px!important;}
  .room-summary span{font-size:9px!important;}
}

/* iPad 10/Air/Pro 11 landscape */
@media (orientation: landscape) and (min-width: 1140px) and (max-width: 1240px){
  .topbar{grid-template-columns:clamp(200px,20vw,250px) minmax(0,1fr)!important;}
  .topbar .tab,.topbar button,.topbar .sync-badge{font-size:12px!important;padding:9px 13px!important;}
  .layout{grid-template-columns:minmax(0,1fr) clamp(300px,29vw,355px)!important;}
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr))!important;}
  .rooms-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))!important;}
}

/* iPad Air 13 / Pro 12.9 / Pro 13 landscape */
@media (orientation: landscape) and (min-width: 1250px) and (max-width: 1400px){
  .topbar{grid-template-columns:clamp(230px,21vw,290px) minmax(0,1fr)!important;}
  .layout{grid-template-columns:minmax(0,1fr) clamp(340px,28vw,410px)!important;}
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(155px,1fr))!important;}
  .rooms-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))!important;}
}

/* Short-height landscape: 744/768/810/820/834px iPad viewports */
@media (orientation: landscape) and (max-height: 850px){
  .topbar{padding-top:8px!important;padding-bottom:8px!important;}
  .tab-content{padding-top:12px!important;}
  .panel{padding-top:12px!important;padding-bottom:12px!important;}
  .panel-head{margin-bottom:6px!important;}
  .panel-head h3,.panel h3{margin-bottom:5px!important;}
  .muted{margin-bottom:8px!important;}
  .category-bar{padding-top:5px!important;padding-bottom:10px!important;}
  .product-card{min-height:104px!important;}
  .cart-panel{top:76px!important;max-height:calc(100vh - 92px)!important;}
  .cart-list{max-height:150px!important;min-height:92px!important;}
  label{margin:8px 0 5px!important;}
  .room-summary{margin:10px 0!important;}
  .room-meta{margin:8px 0!important;}
  .extra-rate{margin-top:8px!important;}
}

/* Portrait tablets keep readability by stacking cart/panels */
@media (orientation: portrait) and (min-width: 768px){
  .topbar{grid-template-columns:1fr!important;}
  .topbar nav{justify-content:flex-start!important;}
  .layout,.inventory-layout{grid-template-columns:1fr!important;}
  .cart-panel{position:static!important;max-height:none!important;order:-1!important;}
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important;}
  .rooms-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))!important;}
}


/* V187 RESPONSIVE HEADER/CATEGORY SCALE + REMOVE WEB SYNC BADGE
   Goal: every tablet width scales down instead of overlapping. */
#syncStatusBadge{display:none!important;}

.topbar{
  display:grid!important;
  grid-template-columns:clamp(168px,19vw,280px) minmax(0,1fr)!important;
  align-items:center!important;
  gap:clamp(6px,.9vw,16px)!important;
  padding:clamp(7px,.85vw,13px) clamp(8px,1.2vw,18px)!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.topbar > div:first-child{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.topbar h2{
  display:block!important;
  max-width:100%!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:clamp(17px,2.05vw,28px)!important;
  line-height:1.03!important;
  margin:0 0 4px!important;
  letter-spacing:-.03em!important;
}
#userText{
  display:block!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:clamp(10px,1.15vw,14px)!important;
  line-height:1.1!important;
}
.topbar nav{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:clamp(5px,.72vw,10px)!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:none!important;
  padding:2px!important;
}
.topbar nav::-webkit-scrollbar{display:none!important;}
.topbar nav .tab,
.topbar nav button{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:auto!important;
  min-height:clamp(33px,4vw,45px)!important;
  padding:clamp(7px,.9vw,12px) clamp(9px,1.25vw,18px)!important;
  font-size:clamp(10px,1.08vw,14px)!important;
  line-height:1!important;
  white-space:nowrap!important;
  border-radius:999px!important;
}
.topbar nav .nav-ico{
  width:clamp(15px,1.55vw,22px)!important;
  height:clamp(15px,1.55vw,22px)!important;
  margin-right:clamp(3px,.55vw,6px)!important;
  font-size:clamp(10px,1.1vw,15px)!important;
}

.panel{max-width:100%!important;overflow:hidden!important;}
.panel-head{min-width:0!important;}
.panel-head > div{min-width:0!important;}
.panel-head h3{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.category-bar{
  width:100%!important;
  max-width:100%!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:none!important;
  gap:clamp(5px,.75vw,10px)!important;
  padding:clamp(5px,.75vw,9px) 0 clamp(8px,1vw,13px)!important;
}
.category-bar::-webkit-scrollbar{display:none!important;}
.category-btn{
  flex:0 0 auto!important;
  min-height:clamp(32px,3.9vw,44px)!important;
  padding:clamp(7px,.85vw,11px) clamp(10px,1.2vw,17px)!important;
  font-size:clamp(10px,1.08vw,14px)!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.layout{
  grid-template-columns:minmax(0,1fr) clamp(280px,28.5vw,410px)!important;
  max-width:100%!important;
  overflow:visible!important;
}
.product-grid,#productGrid{
  grid-template-columns:repeat(auto-fill,minmax(clamp(112px,13.5vw,172px),1fr))!important;
}
.product-card{overflow:hidden!important;}
.product-card strong,
.product-card small,
.product-card code{overflow:hidden!important;text-overflow:ellipsis!important;}
.cart-panel{min-width:0!important;}

/* 1024-1133px landscape: iPad Mini / old iPad widths */
@media (orientation: landscape) and (max-width:1139px){
  .topbar{grid-template-columns:clamp(145px,17vw,190px) minmax(0,1fr)!important;padding:6px 8px!important;gap:6px!important;}
  .topbar h2{font-size:clamp(15px,1.9vw,20px)!important;letter-spacing:-.045em!important;}
  #userText{font-size:10px!important;}
  .topbar nav{gap:5px!important;}
  .topbar nav .tab,.topbar nav button{min-height:33px!important;padding:7px 9px!important;font-size:10px!important;}
  .topbar nav .nav-ico{width:15px!important;height:15px!important;margin-right:3px!important;font-size:10px!important;}
  .tab-content{padding:10px!important;}
  .layout{grid-template-columns:minmax(0,1fr) minmax(260px,27vw)!important;gap:10px!important;}
  .panel{padding:10px!important;}
  .panel-head h3,.panel h3{font-size:18px!important;}
  .panel-head button,#refreshProductsBtn,#refreshRoomsBtn{min-height:34px!important;min-width:96px!important;padding:7px 10px!important;font-size:11px!important;}
  .category-btn{min-height:32px!important;padding:7px 10px!important;font-size:10px!important;}
  .product-grid,#productGrid{grid-template-columns:repeat(auto-fill,minmax(112px,1fr))!important;gap:8px!important;}
  .product-card{min-height:98px!important;padding:9px!important;}
  .product-card strong{font-size:11px!important;}
  .product-card small,.product-card code{font-size:9px!important;}
  .product-card span{font-size:14px!important;}
  .cart-panel{top:64px!important;max-height:calc(100vh - 78px)!important;}
}

/* 1140-1240px landscape: modern iPad 10/Air/Pro 11 widths */
@media (orientation: landscape) and (min-width:1140px) and (max-width:1240px){
  .topbar{grid-template-columns:clamp(175px,18vw,225px) minmax(0,1fr)!important;}
  .topbar h2{font-size:clamp(17px,1.9vw,23px)!important;}
  .topbar nav .tab,.topbar nav button{font-size:11px!important;padding:8px 11px!important;}
  .category-btn{font-size:11px!important;padding:8px 12px!important;}
  .product-grid,#productGrid{grid-template-columns:repeat(auto-fill,minmax(125px,1fr))!important;}
}

/* 1250-1400px landscape: large iPad widths */
@media (orientation: landscape) and (min-width:1250px) and (max-width:1400px){
  .topbar{grid-template-columns:clamp(210px,19vw,270px) minmax(0,1fr)!important;}
  .topbar h2{font-size:clamp(21px,2vw,28px)!important;}
  .topbar nav .tab,.topbar nav button{font-size:clamp(12px,1.05vw,14px)!important;}
}

/* V188 CAPSULE HEADER / CATEGORY / REFRESH SIZE FIX
   Makes the top navigation, category buttons, and all Refresh buttons slimmer capsules
   that scale down cleanly on iPad/tablet widths. */
:root{
  --v188-capsule-h: clamp(30px, 3.55vw, 38px);
  --v188-capsule-pad-y: clamp(5px, .62vw, 8px);
  --v188-capsule-pad-x: clamp(9px, 1.02vw, 15px);
  --v188-capsule-font: clamp(10px, .98vw, 13px);
  --v188-capsule-gap: clamp(5px, .65vw, 9px);
}

html body .topbar{
  grid-template-columns: clamp(185px, 18vw, 285px) minmax(0,1fr)!important;
  align-items:center!important;
  padding: clamp(6px,.72vw,10px) clamp(8px,1vw,16px)!important;
  gap: clamp(6px,.8vw,12px)!important;
}

html body .topbar nav{
  gap: var(--v188-capsule-gap)!important;
  align-items:center!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none!important;
}
html body .topbar nav::-webkit-scrollbar{display:none!important;}

html body .topbar nav .tab,
html body .topbar nav button,
html body .topbar button,
html body nav button,
html body #logoutBtn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap: clamp(3px,.45vw,6px)!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  min-height:var(--v188-capsule-h)!important;
  height:var(--v188-capsule-h)!important;
  padding:var(--v188-capsule-pad-y) var(--v188-capsule-pad-x)!important;
  font-size:var(--v188-capsule-font)!important;
  line-height:1!important;
  border-radius:999px!important;
  white-space:nowrap!important;
}

html body .topbar h2{
  font-size:clamp(19px,2.02vw,27px)!important;
  line-height:1.02!important;
  margin-bottom:2px!important;
}
html body #userText{
  font-size:clamp(10px,1.05vw,13px)!important;
}
html body .topbar nav .nav-ico,
html body .topbar button .nav-ico,
html body nav button .nav-ico{
  width:clamp(14px,1.35vw,18px)!important;
  height:clamp(14px,1.35vw,18px)!important;
  font-size:clamp(10px,1vw,13px)!important;
  margin-right:clamp(2px,.35vw,4px)!important;
  border-radius:999px!important;
}

html body .category-bar{
  gap:var(--v188-capsule-gap)!important;
  padding:clamp(5px,.65vw,8px) 0 clamp(7px,.8vw,10px)!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:none!important;
}
html body .category-bar::-webkit-scrollbar{display:none!important;}
html body .category-bar .category-btn,
html body .category-btn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:clamp(3px,.45vw,6px)!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  min-height:var(--v188-capsule-h)!important;
  height:var(--v188-capsule-h)!important;
  padding:var(--v188-capsule-pad-y) var(--v188-capsule-pad-x)!important;
  font-size:var(--v188-capsule-font)!important;
  line-height:1!important;
  border-radius:999px!important;
  white-space:nowrap!important;
}

html body #refreshProductsBtn,
html body #refreshInventoryBtn,
html body #refreshRoomsBtn,
html body #refreshSalesBtn,
html body #refreshReportsBtn,
html body #refreshOccupiedRoomsBtn,
html body .panel-head button[id*="refresh"],
html body .room-head-actions button[id*="refresh"]{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:clamp(4px,.5vw,7px)!important;
  width:auto!important;
  max-width:max-content!important;
  min-width:clamp(82px,8vw,116px)!important;
  min-height:var(--v188-capsule-h)!important;
  height:var(--v188-capsule-h)!important;
  padding:var(--v188-capsule-pad-y) clamp(12px,1.25vw,18px)!important;
  font-size:var(--v188-capsule-font)!important;
  line-height:1!important;
  border-radius:999px!important;
  white-space:nowrap!important;
}

html body .panel-head{
  align-items:center!important;
  gap:clamp(8px,1vw,14px)!important;
}
html body .panel-head h3,
html body .panel h3{
  font-size:clamp(18px,2.1vw,27px)!important;
  line-height:1.08!important;
}
html body .product-grid,
html body #productGrid{
  gap:clamp(8px,1vw,14px)!important;
}

@media (orientation: landscape) and (max-width:1139px){
  :root{
    --v188-capsule-h:30px;
    --v188-capsule-pad-y:5px;
    --v188-capsule-pad-x:8px;
    --v188-capsule-font:9.5px;
    --v188-capsule-gap:4px;
  }
  html body .topbar{
    grid-template-columns:clamp(138px,16vw,178px) minmax(0,1fr)!important;
    padding:5px 7px!important;
  }
  html body .topbar h2{font-size:clamp(14px,1.75vw,18px)!important;letter-spacing:-.05em!important;}
  html body #userText{font-size:9.5px!important;}
  html body .topbar nav .nav-ico{width:13px!important;height:13px!important;font-size:9px!important;margin-right:2px!important;}
  html body #refreshProductsBtn,
  html body #refreshInventoryBtn,
  html body #refreshRoomsBtn,
  html body #refreshSalesBtn,
  html body #refreshReportsBtn,
  html body #refreshOccupiedRoomsBtn{min-width:78px!important;}
  html body .panel-head h3,html body .panel h3{font-size:17px!important;}
}

@media (orientation: landscape) and (min-width:1140px) and (max-width:1240px){
  :root{
    --v188-capsule-h:33px;
    --v188-capsule-pad-y:6px;
    --v188-capsule-pad-x:10px;
    --v188-capsule-font:10.5px;
    --v188-capsule-gap:5px;
  }
  html body .topbar{grid-template-columns:clamp(168px,17vw,215px) minmax(0,1fr)!important;}
  html body .topbar h2{font-size:clamp(16px,1.85vw,22px)!important;}
}

@media (orientation: landscape) and (min-width:1250px) and (max-width:1400px){
  :root{
    --v188-capsule-h:36px;
    --v188-capsule-pad-y:7px;
    --v188-capsule-pad-x:13px;
    --v188-capsule-font:12px;
    --v188-capsule-gap:7px;
  }
}

/* V189 SCROLL ENABLED + NO ZOOM + LANDSCAPE ONLY
   - Enables normal mouse wheel/touch vertical scrolling again.
   - Keeps zoom disabled through viewport + touch handling.
   - Blocks portrait use with a rotate-device screen. */
html,
body{
  width:100%!important;
  min-height:100%!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior-x:none!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
  touch-action:pan-x pan-y!important;
}

body,
button,
input,
select,
textarea,
a{
  touch-action:manipulation!important;
}

#loginView,
#posView,
.tab-content,
.layout,
.rooms-pos-layout,
.inventory-layout,
.panel,
.cart-panel,
.room-order-panel,
.rooms-main-panel{
  -webkit-overflow-scrolling:touch!important;
}

.tab-content,
.layout,
.rooms-pos-layout,
.inventory-layout{
  overflow-y:visible!important;
  overflow-x:hidden!important;
}

.cart-panel,
.room-order-panel,
.cart-list,
.table-wrap,
.receipt-shell,
#inventoryList,
#salesList,
#reportsList{
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}

.category-bar,
.topbar nav{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
}

/* keep scrollbars functional but visually clean on tablet */
.category-bar::-webkit-scrollbar,
.topbar nav::-webkit-scrollbar{height:0!important;display:none!important;}

/* Portrait is intentionally blocked for the tablet/PWA app. */
@media (orientation:portrait){
  html,body{
    overflow:hidden!important;
    height:100%!important;
    min-height:100%!important;
    background:#fff7e8!important;
  }
  body::before{
    content:"Quatro Pasos POS is landscape only. Please rotate your tablet.";
    position:fixed!important;
    inset:0!important;
    z-index:999999!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:32px!important;
    text-align:center!important;
    color:#0b1f3a!important;
    background:linear-gradient(135deg,#fff7e8,#f7ead0)!important;
    font-weight:900!important;
    font-size:clamp(22px,5vw,42px)!important;
    line-height:1.25!important;
    font-family:"Open Sans",Arial,Helvetica,sans-serif!important;
  }
  #loginView,
  #posView,
  .receipt-modal{
    display:none!important;
  }
}

/* V190 FINAL POS LAYOUT: product list scrolls, cart same height as products panel
   Goal: no stacked/short cart on landscape tablet; left product grid has its own scroll. */
@media (orientation: landscape) and (min-width: 900px){
  html body #posTab.tab-content{
    height:calc(100dvh - clamp(74px, 8.4vh, 112px))!important;
    min-height:0!important;
    overflow:hidden!important;
    padding:clamp(8px,1.05vw,16px) clamp(10px,1.35vw,20px)!important;
  }

  html body #posTab .layout{
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-columns:minmax(0, 1fr) clamp(290px, 28vw, 390px)!important;
    gap:clamp(10px,1.35vw,18px)!important;
    align-items:stretch!important;
  }

  html body #posTab .layout > .panel,
  html body #posTab .layout > .cart-panel{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    margin:0!important;
    position:relative!important;
    top:auto!important;
  }

  html body #posTab .layout > .panel:not(.cart-panel){
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    padding:clamp(12px,1.3vw,18px)!important;
  }

  html body #posTab .panel-head{
    flex:0 0 auto!important;
  }

  html body #posTab #localDbStatus,
  html body #posTab .local-db-status,
  html body #posTab #categoryBar,
  html body #posTab .category-bar{
    flex:0 0 auto!important;
  }

  html body #posTab #productGrid,
  html body #posTab .product-grid{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    padding-right:clamp(2px,.35vw,6px)!important;
    padding-bottom:clamp(12px,1.2vw,20px)!important;
    align-content:start!important;
    grid-template-columns:repeat(auto-fill,minmax(clamp(118px,13.2vw,170px),1fr))!important;
  }

  html body #posTab #productGrid::-webkit-scrollbar,
  html body #posTab .product-grid::-webkit-scrollbar{
    width:0!important;
    height:0!important;
    display:none!important;
  }

  html body #posTab .cart-panel{
    display:flex!important;
    flex-direction:column!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    padding:clamp(12px,1.3vw,18px)!important;
  }

  html body #posTab .cart-panel > h3{
    flex:0 0 auto!important;
    margin-bottom:clamp(8px,.9vw,12px)!important;
  }

  html body #posTab #cartList,
  html body #posTab .cart-list{
    flex:0 0 clamp(96px, 17vh, 160px)!important;
    min-height:clamp(96px, 17vh, 160px)!important;
    max-height:clamp(96px, 17vh, 160px)!important;
    overflow-y:auto!important;
  }

  html body #posTab .totals{
    flex:0 0 auto!important;
    margin-top:clamp(8px,.9vw,12px)!important;
  }

  html body #posTab .cart-panel label,
  html body #posTab .cart-panel select,
  html body #posTab .cart-panel input,
  html body #posTab .cart-panel button,
  html body #posTab .cart-panel .message{
    flex:0 0 auto!important;
  }
}

/* iPad Mini / compact landscape: keep both columns, shrink rather than wrap */
@media (orientation: landscape) and (min-width:900px) and (max-width:1139px){
  html body #posTab .layout{
    grid-template-columns:minmax(0,1fr) clamp(260px, 30vw, 320px)!important;
    gap:8px!important;
  }
  html body #posTab.tab-content{
    height:calc(100dvh - 76px)!important;
    padding:7px 8px!important;
  }
  html body #posTab .layout > .panel:not(.cart-panel),
  html body #posTab .cart-panel{
    padding:10px!important;
    border-radius:15px!important;
  }
  html body #posTab #productGrid,
  html body #posTab .product-grid{
    grid-template-columns:repeat(auto-fill,minmax(118px,1fr))!important;
    gap:8px!important;
  }
  html body #posTab .product-card{
    min-height:104px!important;
    padding:9px 10px!important;
  }
  html body #posTab .product-card strong{
    font-size:12.5px!important;
    line-height:1.12!important;
  }
  html body #posTab .price{
    font-size:16px!important;
  }
  html body #posTab #cartList,
  html body #posTab .cart-list{
    flex-basis:118px!important;
    min-height:118px!important;
    max-height:118px!important;
  }
}

/* Medium/large iPads: taller cart and more comfortable product scroll */
@media (orientation: landscape) and (min-width:1140px){
  html body #posTab #cartList,
  html body #posTab .cart-list{
    flex-basis:clamp(130px, 20vh, 190px)!important;
    min-height:clamp(130px, 20vh, 190px)!important;
    max-height:clamp(130px, 20vh, 190px)!important;
  }
}

/* V191 READABILITY FIX: keep product area scrollable, but enlarge cards/text so content stays readable */
@media (orientation: landscape) and (min-width: 900px){
  html body #posTab .layout{
    grid-template-columns:minmax(0,1fr) clamp(320px,28vw,410px)!important;
  }
  html body #posTab #productGrid,
  html body #posTab .product-grid{
    grid-template-columns:repeat(auto-fill,minmax(clamp(160px,16vw,220px),1fr))!important;
    gap:12px!important;
    padding-right:8px!important;
    padding-bottom:16px!important;
  }
  html body #posTab .product-card{
    min-height:152px!important;
    padding:14px 14px 12px!important;
    border-radius:18px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
  }
  html body #posTab .product-card strong{
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    white-space:normal!important;
    font-size:clamp(16px,1.2vw,18px)!important;
    line-height:1.18!important;
    margin:0 0 4px 0!important;
  }
  html body #posTab .product-card small,
  html body #posTab .product-card code{
    display:block!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:clamp(12px,.92vw,13.5px)!important;
    line-height:1.2!important;
    margin:2px 0 0 0!important;
  }
  html body #posTab .product-card code{
    min-height:1.2em!important;
  }
  html body #posTab .product-card span,
  html body #posTab .product-card .price{
    display:block!important;
    font-size:clamp(17px,1.3vw,21px)!important;
    line-height:1.08!important;
    margin-top:8px!important;
  }
}

@media (orientation: landscape) and (min-width: 900px) and (max-width: 1139px){
  html body #posTab .layout{
    grid-template-columns:minmax(0,1fr) clamp(290px,29vw,338px)!important;
  }
  html body #posTab #productGrid,
  html body #posTab .product-grid{
    grid-template-columns:repeat(auto-fill,minmax(148px,1fr))!important;
    gap:10px!important;
  }
  html body #posTab .product-card{
    min-height:144px!important;
    padding:12px 12px 11px!important;
  }
  html body #posTab .product-card strong{
    font-size:15px!important;
    line-height:1.16!important;
  }
  html body #posTab .product-card small,
  html body #posTab .product-card code{
    font-size:11.8px!important;
    line-height:1.18!important;
  }
  html body #posTab .product-card span,
  html body #posTab .product-card .price{
    font-size:18px!important;
  }
}


/* V192: remove loaded products/offline cached inventory status for more space */
#localDbStatus,
.local-db-status{
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}


/* V194: brand title is Quatro Pasos only, prevent header cut */
.brand,
.qp-brand,
.app-brand,
.topbar .brand{
  min-width: max-content !important;
  max-width: none !important;
  flex-shrink: 0 !important;
}
.brand h1,
.brand b,
.qp-brand h1,
.app-brand h1,
.topbar .brand h1{
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}
@media (orientation: landscape) and (min-width:900px){
  .brand h1,
  .brand b,
  .qp-brand h1,
  .app-brand h1,
  .topbar .brand h1{
    font-size: clamp(19px, 2.05vw, 30px) !important;
    line-height: 1.05 !important;
  }
}


/* V195: inventory/items module removed from POS navigation */
.hidden-section,
#inventoryTab,
#itemsTab{
  display:none !important;
}
button[data-tab*="inventory" i],
button[data-view*="inventory" i],
a[href*="inventory" i],
a[data-tab*="inventory" i],
a[data-view*="inventory" i]{
  display:none !important;
}


/* V196 cleanup */
#localDbStatus,
#inventoryDbStatus,
.local-db-status,
.inventory-db-status{
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}
button:disabled{
  opacity:.7;
}


/* V197: restore independent scrolling for Sales/BIR and modal content */
#salesTab,
#reportsTab{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  max-height:calc(100dvh - 88px) !important;
  padding-bottom:24px !important;
}
#salesTab .panel,
#reportsTab .panel{
  overflow:visible !important;
  min-height:auto !important;
}
#salesList,
#reportsBox{
  overflow:visible !important;
}
.bir-report-tabs-card,
.bir-tab-panel.active{
  overflow:visible !important;
}
.table-wrap{
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
.qp-modal-body,
.bir-settings-modal-body{
  max-height:70dvh !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
}


/* V191 POS live payment change */
.pos-payment-change{
  margin:10px 0 4px !important;
  padding:12px 14px !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:1px solid rgba(190,132,43,.35);
  border-radius:14px;
  background:rgba(255,247,229,.78);
  color:#142143;
  font-weight:900;
}
.pos-payment-change strong{
  font-size:1.08rem;
  color:#6f461f;
}


/* V192: Discount can be fixed amount or percentage */
.cart-panel .discount-entry-row{
  align-items:center!important;
}
.cart-panel .discount-controls{
  display:grid!important;
  grid-template-columns:minmax(112px,1fr) minmax(86px,.72fr)!important;
  gap:7px!important;
  width:min(100%,250px)!important;
  margin:0!important;
}
.cart-panel .discount-controls select,
.cart-panel .discount-controls input{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  padding-left:10px!important;
  padding-right:10px!important;
}
.cart-panel .discount-preview{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:12px!important;
  padding-top:2px!important;
  font-size:.92em!important;
}
.cart-panel .discount-preview.hidden{
  display:none!important;
}
@media (orientation:landscape) and (max-width:1139px){
  .cart-panel .discount-entry-row{
    align-items:flex-start!important;
  }
  .cart-panel .discount-controls{
    grid-template-columns:1fr!important;
    width:min(100%,145px)!important;
  }
}


/* V193: 15% shorter POS field height + clean full-width Manager PIN layout */
html body.is-pos-screen input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="file"]):not([type="button"]):not([type="submit"]),
html body.is-pos-screen select {
  height: 41px !important;
  min-height: 41px !important;
  max-height: 41px !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
  line-height: 1.2 !important;
}

/* Keep multiline fields multiline while reducing their vertical padding by about 15%. */
html body.is-pos-screen textarea {
  padding-top: 9px !important;
  padding-bottom: 9px !important;
}

/* Manager PIN: one clean row, input uses all remaining available width. */
html body.is-pos-screen #discountApprovalWrap,
html body.is-pos-screen .discount-approval-wrap {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 9px 10px !important;
}

html body.is-pos-screen #discountApprovalWrap > span,
html body.is-pos-screen .discount-approval-wrap > span {
  white-space: nowrap !important;
  margin: 0 !important;
}

html body.is-pos-screen #discountApprovalPin,
html body.is-pos-screen .discount-approval-wrap input {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  justify-self: stretch !important;
}

@media (orientation: landscape) and (max-width: 1050px) {
  html body.is-pos-screen #discountApprovalWrap,
  html body.is-pos-screen .discount-approval-wrap {
    grid-template-columns: 1fr !important;
    row-gap: 6px !important;
  }
}

html body.is-pos-screen #discountApprovalWrap.hidden,
html body.is-pos-screen .discount-approval-wrap.hidden {
  display: none !important;
}


/* V194: compact POS controls and cleaner Manager PIN sizing */
html body.is-pos-screen input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="range"]):not([type="file"]):not([type="button"]):not([type="submit"]),
html body.is-pos-screen select {
  height: 35px !important;
  min-height: 35px !important;
  max-height: 35px !important;
  padding: 4px 10px !important;
  line-height: 1.1 !important;
  box-sizing: border-box !important;
}

html body.is-pos-screen textarea {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

html body.is-pos-screen #discountApprovalWrap,
html body.is-pos-screen .discount-approval-wrap {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 9px !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 6px 8px !important;
  box-sizing: border-box !important;
}

html body.is-pos-screen #discountApprovalPin,
html body.is-pos-screen .discount-approval-wrap input {
  width: 80% !important;
  min-width: 135px !important;
  max-width: 190px !important;
  justify-self: end !important;
  margin: 0 !important;
}

@media (max-width: 760px) {
  html body.is-pos-screen #discountApprovalWrap,
  html body.is-pos-screen .discount-approval-wrap {
    grid-template-columns: 1fr !important;
    row-gap: 5px !important;
  }
  html body.is-pos-screen #discountApprovalPin,
  html body.is-pos-screen .discount-approval-wrap input {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
  }
}


/* v195: POS and Rooms start directly with their working controls. */
html body #posTab .products-main-panel > .category-bar{
  padding-top:0!important;
}
html body #roomsTab .rooms-main-panel > .room-toolbar{
  margin-top:0!important;
}

/* V196: Rooms filtering summary + POS-style fixed layout and scrolling.
   - Summary counts follow search + room type filters.
   - Room Order aligns with the left panel.
   - Room cards and Room Order scroll independently like the POS screen. */
@media (orientation: landscape) and (min-width: 900px){
  html body #roomsTab.tab-content{
    height:calc(100vh - clamp(74px, 8.4vh, 112px))!important;
    height:calc(100dvh - clamp(74px, 8.4vh, 112px))!important;
    min-height:0!important;
    overflow:hidden!important;
    padding:clamp(8px,1.05vw,16px) clamp(10px,1.35vw,20px)!important;
  }

  html body #roomsTab .rooms-pos-layout{
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) clamp(300px,28vw,410px)!important;
    gap:clamp(10px,1.35vw,18px)!important;
    align-items:stretch!important;
  }

  html body #roomsTab .rooms-main-panel,
  html body #roomsTab .room-order-panel{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    margin:0!important;
    align-self:stretch!important;
    position:relative!important;
    top:auto!important;
  }

  html body #roomsTab .rooms-main-panel{
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    padding:clamp(12px,1.3vw,18px)!important;
  }

  html body #roomsTab .room-toolbar,
  html body #roomsTab .room-summary{
    flex:0 0 auto!important;
  }

  html body #roomsTab #roomsGrid,
  html body #roomsTab .rooms-grid{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    padding-right:clamp(2px,.35vw,6px)!important;
    padding-bottom:clamp(12px,1.2vw,20px)!important;
    align-content:start!important;
  }

  html body #roomsTab .room-order-panel{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    padding:clamp(12px,1.3vw,18px)!important;
  }

  html body #roomsTab .room-order-scroll{
    height:auto!important;
    max-height:none!important;
    min-height:0!important;
    overflow:visible!important;
    padding:0!important;
  }

  html body #roomsTab #roomsGrid::-webkit-scrollbar,
  html body #roomsTab .rooms-grid::-webkit-scrollbar,
  html body #roomsTab .room-order-panel::-webkit-scrollbar{
    width:0!important;
    height:0!important;
    display:none!important;
  }

  html body #roomsTab #roomsGrid,
  html body #roomsTab .rooms-grid,
  html body #roomsTab .room-order-panel{
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
  }
}


/* V197: uniform full-detail room cards across every filter result.
   Room cards never collapse when many rooms are shown; the grid scrolls instead. */
@media (orientation: landscape) and (min-width: 900px){
  html body #roomsTab #roomsGrid,
  html body #roomsTab .rooms-grid{
    grid-auto-rows:268px!important;
    align-content:start!important;
    align-items:stretch!important;
  }

  html body #roomsTab .room-card{
    height:268px!important;
    min-height:268px!important;
    max-height:268px!important;
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }

  html body #roomsTab .room-top,
  html body #roomsTab .room-meta,
  html body #roomsTab .room-rates,
  html body #roomsTab .extra-rate,
  html body #roomsTab .reserved-note{
    flex:0 0 auto!important;
  }

  html body #roomsTab .room-rates{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-template-rows:repeat(2,minmax(54px,auto))!important;
  }

  html body #roomsTab .room-rates > div{
    min-height:54px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }

  html body #roomsTab .extra-rate{
    margin-top:auto!important;
    padding-top:8px!important;
  }
}

@media (orientation: landscape) and (min-width:900px) and (max-height:760px){
  html body #roomsTab #roomsGrid,
  html body #roomsTab .rooms-grid{
    grid-auto-rows:246px!important;
  }
  html body #roomsTab .room-card{
    height:246px!important;
    min-height:246px!important;
    max-height:246px!important;
    padding:11px!important;
  }
  html body #roomsTab .room-rates{
    gap:7px!important;
    grid-template-rows:repeat(2,minmax(49px,auto))!important;
  }
  html body #roomsTab .room-rates > div{
    min-height:49px!important;
    padding:7px!important;
  }
  html body #roomsTab .room-meta{
    margin:7px 0!important;
  }
}

/* V198: Room Order matches Cart, with live overtime and room-only discount. */
html body #roomsTab .room-order-panel{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
html body #roomsTab .room-order-scroll{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
  width:100%!important;
  box-sizing:border-box!important;
}
html body #roomsTab .room-order-panel > .room-order-scroll > h3{
  margin:0 0 12px!important;
  font-size:clamp(22px,2vw,31px)!important;
  line-height:1.12!important;
  color:#142143!important;
}
html body #roomsTab .selected-room-card{
  min-height:148px!important;
  max-height:none!important;
  overflow:visible!important;
  margin:0 0 12px!important;
  padding:12px!important;
  border:1px dashed rgba(190,132,43,.52)!important;
  border-radius:14px!important;
  background:rgba(255,253,248,.82)!important;
  box-shadow:none!important;
}
html body #roomsTab .selected-room-card.empty-room-select{
  display:grid!important;
  place-items:center!important;
  text-align:center!important;
  color:#5c6f8d!important;
  font-weight:800!important;
}
html body #roomsTab .selected-room-head h2{
  margin:0!important;
  font-size:clamp(20px,1.7vw,27px)!important;
}
html body #roomsTab .selected-room-rates{
  gap:8px!important;
  margin:10px 0!important;
}
html body #roomsTab .selected-room-rates > div{
  min-height:58px!important;
  padding:9px!important;
  border-radius:13px!important;
}
html body #roomsTab .room-charge-preview{
  margin:0 0 12px!important;
  padding:10px!important;
  border:1px dashed rgba(190,132,43,.52)!important;
  border-radius:14px!important;
  background:rgba(255,253,248,.82)!important;
  box-shadow:none!important;
}
html body #roomsTab .room-charge-preview > h3{
  margin:0 0 8px!important;
  font-size:16px!important;
}
html body #roomsTab .room-charge-preview-list{
  max-height:170px!important;
  overflow:auto!important;
  scrollbar-width:none!important;
}
html body #roomsTab .room-charge-preview-list::-webkit-scrollbar{display:none!important;}
html body #roomsTab .room-charge-row{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:10px!important;
  padding:8px 0!important;
  border-bottom:1px solid rgba(190,132,43,.22)!important;
}
html body #roomsTab .room-charge-row:last-child{border-bottom:0!important;}
html body #roomsTab .room-charge-row small{display:block!important;color:#697993!important;}
html body #roomsTab .room-charge-row.room-discount-line{
  color:#8a1738!important;
}
html body #roomsTab .room-billing-summary{
  margin:0 0 12px!important;
  padding:12px!important;
  border-radius:14px!important;
  background:rgba(247,239,222,.78)!important;
  border:1px solid rgba(190,132,43,.24)!important;
}
html body #roomsTab .room-billing-summary > div{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:10px!important;
  margin:7px 0!important;
}
html body #roomsTab .room-billing-summary .hidden{display:none!important;}
html body #roomsTab .room-discount-entry-row{
  align-items:center!important;
}
html body #roomsTab .room-discount-controls{
  display:grid!important;
  grid-template-columns:minmax(112px,1fr) minmax(82px,.72fr)!important;
  gap:7px!important;
  width:min(100%,250px)!important;
  margin:0!important;
}
html body #roomsTab .room-discount-controls select,
html body #roomsTab .room-discount-controls input{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
}
html body #roomsTab .room-discount-preview{
  font-size:.92em!important;
}
html body #roomsTab .room-discount-approval{
  display:grid!important;
  grid-template-columns:max-content minmax(0,1fr)!important;
  align-items:center!important;
  column-gap:9px!important;
  padding:7px 0 0!important;
  border-top:1px dashed rgba(190,132,43,.32)!important;
}
html body #roomsTab .room-discount-approval input{
  width:80%!important;
  min-width:135px!important;
  max-width:190px!important;
  justify-self:end!important;
  margin:0!important;
}
html body #roomsTab .room-discount-note{
  display:block!important;
  margin:7px 0 4px!important;
  color:#6d7c93!important;
  font-size:11px!important;
  line-height:1.35!important;
}
html body #roomsTab .room-grand-total{
  margin-top:9px!important;
  padding-top:10px!important;
  border-top:1px solid rgba(190,132,43,.28)!important;
  font-weight:900!important;
}
html body #roomsTab .room-grand-total strong{
  font-size:1.12rem!important;
  color:#6f461f!important;
}
html body #roomsTab .room-payment-box{
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
html body #roomsTab .room-payment-change{
  margin:10px 0 4px!important;
  padding:12px 14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  border:1px solid rgba(190,132,43,.35)!important;
  border-radius:14px!important;
  background:rgba(255,247,229,.78)!important;
  color:#142143!important;
  font-weight:900!important;
}
html body #roomsTab #checkInRoomBtn,
html body #roomsTab #payRoomNowBtn{
  width:100%!important;
  justify-content:center!important;
  margin-top:12px!important;
  min-height:44px!important;
  border-radius:999px!important;
}
html body #roomsTab #printRoomTicketBtn,
html body #roomsTab .room-ticket-btn{
  width:100%!important;
  min-width:0!important;
  justify-content:center!important;
  margin:10px 0 0!important;
  min-height:42px!important;
  border-radius:999px!important;
}
@media (orientation:landscape) and (min-width:900px){
  html body #roomsTab .room-order-panel{
    padding:clamp(12px,1.3vw,18px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  html body #roomsTab .room-order-scroll{
    min-height:100%!important;
  }
}
@media (max-width:760px){
  html body #roomsTab .room-discount-controls{
    grid-template-columns:1fr!important;
    width:min(100%,150px)!important;
  }
  html body #roomsTab .room-discount-approval{
    grid-template-columns:1fr!important;
    row-gap:6px!important;
  }
  html body #roomsTab .room-discount-approval input{
    width:100%!important;
    max-width:100%!important;
    justify-self:stretch!important;
  }
}


/* V199: Room Order overlap/proof visibility + active-shift transaction lock. */
html body #roomsTab .room-order-panel{
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scroll-padding-bottom:72px!important;
  box-sizing:border-box!important;
}
html body #roomsTab .room-order-scroll{
  display:flex!important;
  flex-direction:column!important;
  height:auto!important;
  min-height:max-content!important;
  max-height:none!important;
  overflow:visible!important;
  padding-bottom:72px!important;
  box-sizing:border-box!important;
}
html body #roomsTab #selectedRoomCard.selected-room-card{
  position:relative!important;
  display:block!important;
  flex:0 0 auto!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  contain:layout paint!important;
  margin:0 0 14px!important;
}
html body #roomsTab #selectedRoomCard .selected-room-head,
html body #roomsTab #selectedRoomCard .selected-room-rates,
html body #roomsTab #selectedRoomCard > small{
  position:relative!important;
  inset:auto!important;
}
html body #roomsTab #selectedRoomCard .selected-room-rates{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  height:auto!important;
  min-height:0!important;
}
html body #roomsTab .room-order-scroll > label{
  position:relative!important;
  z-index:1!important;
  flex:0 0 auto!important;
  margin-top:0!important;
}
html body #roomsTab #printRoomTicketBtn,
html body #roomsTab .room-ticket-btn{
  display:flex!important;
  flex:0 0 auto!important;
  width:100%!important;
  min-height:44px!important;
  margin:12px 0 24px!important;
  padding:10px 14px!important;
  box-sizing:border-box!important;
  visibility:visible!important;
}
html body [data-shift-lock="1"]{
  opacity:.48!important;
  cursor:not-allowed!important;
  filter:grayscale(.25)!important;
  pointer-events:none!important;
}
html body.shift-closed #checkoutBtn,
html body.shift-closed #checkInRoomBtn,
html body.shift-closed #payRoomNowBtn{
  opacity:.48!important;
}
@media (orientation:landscape) and (min-width:900px){
  html body #roomsTab .room-order-panel{
    padding-bottom:0!important;
  }
  html body #roomsTab .room-order-scroll{
    padding-bottom:84px!important;
  }
}


/* V200: Room list breathing room, 15% more compact room-card content, and trimmed proof-button footer space. */
@media (orientation:landscape) and (min-width:900px){
  html body #roomsTab #roomsGrid,
  html body #roomsTab .rooms-grid{
    margin-top:10px!important;
    grid-auto-rows:228px!important;
  }

  html body #roomsTab .room-card{
    height:228px!important;
    min-height:228px!important;
    max-height:228px!important;
    padding:14px!important;
    border-radius:19px!important;
    font-size:11.5px!important;
  }

  html body #roomsTab .room-card::after{
    right:-29px!important;
    top:-29px!important;
    width:85px!important;
    height:85px!important;
  }

  html body #roomsTab .room-top{
    gap:8px!important;
  }

  html body #roomsTab .room-top h3{
    font-size:18.5px!important;
    line-height:1.08!important;
  }

  html body #roomsTab .room-top p{
    margin-top:3px!important;
    font-size:11.5px!important;
    line-height:1.18!important;
  }

  html body #roomsTab .room-badge{
    padding:6px 8px!important;
    font-size:10px!important;
    line-height:1.05!important;
  }

  html body #roomsTab .room-meta{
    gap:8px!important;
    margin:9px 0!important;
    font-size:11.5px!important;
    line-height:1.15!important;
  }

  html body #roomsTab .room-rates{
    gap:8px!important;
    grid-template-rows:repeat(2,minmax(46px,auto))!important;
  }

  html body #roomsTab .room-rates > div{
    min-height:46px!important;
    padding:8px!important;
    border-radius:12px!important;
  }

  html body #roomsTab .room-rates small{
    font-size:10px!important;
    line-height:1.05!important;
  }

  html body #roomsTab .room-rates b{
    font-size:14.5px!important;
    line-height:1.08!important;
  }

  html body #roomsTab .extra-rate{
    margin-top:auto!important;
    padding-top:7px!important;
    font-size:11.5px!important;
    line-height:1.1!important;
  }

  html body #roomsTab .room-order-panel{
    scroll-padding-bottom:18px!important;
  }

  html body #roomsTab .room-order-scroll{
    padding-bottom:12px!important;
  }

  html body #roomsTab #printRoomTicketBtn,
  html body #roomsTab .room-ticket-btn{
    margin:10px 0 4px!important;
  }
}

@media (orientation:landscape) and (min-width:900px) and (max-height:760px){
  html body #roomsTab #roomsGrid,
  html body #roomsTab .rooms-grid{
    grid-auto-rows:210px!important;
  }

  html body #roomsTab .room-card{
    height:210px!important;
    min-height:210px!important;
    max-height:210px!important;
    padding:11px!important;
  }

  html body #roomsTab .room-top h3{
    font-size:17px!important;
  }

  html body #roomsTab .room-meta{
    margin:7px 0!important;
  }

  html body #roomsTab .room-rates{
    gap:7px!important;
    grid-template-rows:repeat(2,minmax(42px,auto))!important;
  }

  html body #roomsTab .room-rates > div{
    min-height:42px!important;
    padding:7px!important;
  }

  html body #roomsTab .extra-rate{
    padding-top:5px!important;
  }
}

/* V201: compact Room Order footer with scroll only when content exceeds viewport. */
@media (orientation:landscape) and (min-width:900px){
  html body #roomsTab .rooms-pos-layout{
    align-items:start!important;
  }
  html body #roomsTab .room-order-panel{
    height:auto!important;
    min-height:0!important;
    max-height:100%!important;
    align-self:start!important;
    padding-bottom:12px!important;
    overflow-y:auto!important;
  }
  html body #roomsTab .room-order-scroll{
    height:auto!important;
    min-height:0!important;
    padding-bottom:0!important;
  }
  html body #roomsTab #printRoomTicketBtn,
  html body #roomsTab .room-ticket-btn{
    margin:10px 0 0!important;
  }
}

/* V202: Sales pagination/filtering and database-backed Shift/Cash Drawer reporting. */
.sales-filter-toolbar{
  display:grid;
  grid-template-columns:minmax(240px,1.5fr) repeat(4,minmax(130px,.75fr)) minmax(105px,.55fr);
  gap:10px;
  margin:12px 0;
  align-items:center;
}
.sales-filter-toolbar input,
.sales-filter-toolbar select,
.shift-report-toolbar input,
.shift-report-toolbar select{
  width:100%;
  min-width:0;
  height:38px;
  padding:7px 12px;
  border:1px solid var(--line,#d9b36c);
  border-radius:14px;
  background:#fffdf8;
  color:var(--ink,#17233d);
}
.sales-table-wrap{max-height:430px;overflow:auto;}
.sales-pager{margin-top:10px;}
.shift-report-shortcut{width:100%;margin-top:10px;}
.shift-report-summary{
  display:grid;
  grid-template-columns:repeat(5,minmax(135px,1fr));
  gap:10px;
  margin-bottom:12px;
}
.shift-report-summary>div{
  border:1px solid var(--line,#d9b36c);
  border-radius:16px;
  background:#fff8e8;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.shift-report-summary span{font-size:12px;font-weight:700;color:#60708a;text-transform:uppercase;}
.shift-report-summary b{font-size:20px;color:#17233d;}
.shift-report-toolbar{
  display:grid!important;
  grid-template-columns:minmax(230px,1.2fr) minmax(220px,1.1fr) minmax(130px,.65fr) minmax(135px,.7fr) minmax(135px,.7fr) minmax(90px,.45fr);
  gap:10px!important;
  align-items:center;
}
.shift-report-toolbar h3{margin:0;}
.shift-shortage{color:#b42318;font-weight:800;}
.shift-overage{color:#067647;font-weight:800;}
#birTabShifts .table-wrap{max-height:430px;overflow:auto;}
#birTabShifts table{min-width:1380px;}

@media (max-width:1250px){
  .sales-filter-toolbar{grid-template-columns:repeat(3,minmax(150px,1fr));}
  .shift-report-summary{grid-template-columns:repeat(3,minmax(140px,1fr));}
  .shift-report-toolbar{grid-template-columns:repeat(3,minmax(150px,1fr));}
}


/* V213 FINAL RECEIPT PRINT ISOLATION
   The landscape-only screen must never replace the 80mm receipt during print. */
@media print {
  html, body {
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: #fff !important;
  }
  body::before {
    content: none !important;
    display: none !important;
    visibility: hidden !important;
  }
  #loginView, #posView { display: none !important; }
  #receiptModal {
    display: block !important;
    visibility: visible !important;
    position: static !important;
    inset: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #fff !important;
  }
  #receiptModal.hidden { display: block !important; }
  #receiptModal .receipt-shell {
    display: block !important;
    width: 80mm !important;
    max-width: 80mm !important;
    max-height: none !important;
    overflow: visible !important;
    margin: 0 !important;
  }
  #receiptPaper {
    display: block !important;
    visibility: visible !important;
    width: 80mm !important;
    max-width: 80mm !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
    color: #000 !important;
  }
  #receiptPaper, #receiptPaper * { visibility: visible !important; }
  .receipt-actions, .no-print { display: none !important; }
  @page { size: 80mm auto; margin: 4mm; }
}


/* V219: inline action alerts only; always above POS and room action buttons. */
html body #posMsg.action-message,
html body #roomMsg.action-message{
  width:100%!important;
  min-height:0!important;
  margin:12px 0 10px!important;
  padding:12px 14px!important;
  border:1px solid rgba(212,172,86,.45)!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,rgba(255,248,231,.98),rgba(255,255,255,.96))!important;
  color:#16213f!important;
  box-shadow:0 8px 20px rgba(15,23,42,.08)!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.35!important;
  overflow-wrap:anywhere!important;
}
html body #posMsg.action-message:empty,
html body #roomMsg.action-message:empty{
  display:none!important;
}
html body #posMsg.action-message:not(:empty),
html body #roomMsg.action-message:not(:empty){
  display:block!important;
}
/* Ensure any older V217 floating notice cannot appear after the update. */
html body #qpActionNoticeHost,
html body .qp-action-notice-host,
html body .qp-action-notice{
  display:none!important;
}

/* V220: keep room cards away from the scroll-container edges.
   This prevents selected outlines and rounded corners from being clipped. */
html body #roomsTab #roomsGrid,
html body #roomsTab .rooms-grid{
  box-sizing:border-box!important;
  padding-left:12px!important;
  padding-right:12px!important;
  padding-top:12px!important;
  padding-bottom:20px!important;
  scroll-padding-left:12px!important;
  scroll-padding-right:12px!important;
}
html body #roomsTab .room-card{
  min-width:0!important;
  box-sizing:border-box!important;
}
@media (orientation:landscape) and (min-width:900px){
  html body #roomsTab #roomsGrid,
  html body #roomsTab .rooms-grid{
    margin-top:8px!important;
    padding-left:14px!important;
    padding-right:14px!important;
    padding-top:12px!important;
  }
}


/* V221: keep the main POS occupied-room selector fully readable.
   Global compact-control rules must not clip the selected room text. */
html body.is-pos-screen #occupiedRoomSelectWrap{
  overflow:visible!important;
}
html body.is-pos-screen #occupiedRoomSelectWrap #occupiedRoomSelect{
  width:100%!important;
  height:46px!important;
  min-height:46px!important;
  max-height:none!important;
  padding:0 42px 0 14px!important;
  line-height:46px!important;
  font-size:15px!important;
  font-weight:700!important;
  color:#142143!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
html body.is-pos-screen #occupiedRoomSelectWrap #occupiedRoomSelect option{
  font-size:15px!important;
  line-height:1.35!important;
  padding:8px 10px!important;
}


/* V222: keep all six room status counters in one compact row through 125% zoom.
   Also restore clear pointer/keyboard feedback for every room status card. */
@media (orientation:landscape) and (min-width:900px){
  html body #roomsTab .room-summary{
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:clamp(5px,.55vw,8px)!important;
    width:100%!important;
    min-width:0!important;
    margin:10px 0 12px!important;
  }
  html body #roomsTab .room-summary > div{
    box-sizing:border-box!important;
    width:auto!important;
    min-width:0!important;
    height:80px!important;
    min-height:80px!important;
    max-height:80px!important;
    padding:8px 10px!important;
    border-radius:14px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    overflow:hidden!important;
  }
  html body #roomsTab .room-summary b{
    margin:0!important;
    font-size:clamp(18px,1.65vw,23px)!important;
    line-height:1!important;
  }
  html body #roomsTab .room-summary span{
    margin-top:6px!important;
    min-width:0!important;
    font-size:clamp(8px,.72vw,10px)!important;
    line-height:1.05!important;
    letter-spacing:-.01em!important;
    white-space:nowrap!important;
    overflow:visible!important;
  }
  html body #roomsTab .room-card{
    cursor:pointer!important;
    touch-action:manipulation!important;
  }
  html body #roomsTab .room-card:focus-visible{
    outline:3px solid rgba(20,33,67,.5)!important;
    outline-offset:2px!important;
  }
}
@media (orientation:landscape) and (min-width:900px) and (max-height:760px){
  html body #roomsTab .room-summary > div{
    height:72px!important;
    min-height:72px!important;
    max-height:72px!important;
    padding:7px 9px!important;
  }
  html body #roomsTab .room-summary span{margin-top:5px!important;}
}

/* V225 numbered pagination for POS inventory, sales, and report tables */
.pager-actions .pager-number-list,
.bir-pager .pager-number-list{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  flex-wrap:wrap!important;
}
.pager-actions .pager-number,
.bir-pager .pager-number{
  min-width:36px!important;
  height:36px!important;
  padding:0 10px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(212,169,79,.8)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#fffdf8,#fff3d8)!important;
  color:#4a2e17!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.pager-actions .pager-number.active,
.bir-pager .pager-number.active{
  background:linear-gradient(135deg,#7a5737,#4b3526)!important;
  color:#fff!important;
  border-color:#7a5737!important;
}
.pager-actions .pager-ellipsis,
.bir-pager .pager-ellipsis{
  min-width:20px!important;
  text-align:center!important;
  color:#7a5733!important;
  font-weight:900!important;
}
@media(max-width:850px){
  .pager-actions .pager-number-list,
  .bir-pager .pager-number-list{
    width:100%!important;
    order:3!important;
  }
}

.admin-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,380px);
  gap:18px;
  align-items:start;
}
.admin-security-summary{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:10px;
  margin:12px 0;
}
.admin-security-summary div,
.admin-user-row{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fffdf8;
  padding:12px;
}
.admin-security-summary b{display:block;font-size:20px;color:var(--navy)}
.admin-security-summary span,.admin-user-row small{color:var(--muted);font-weight:800}
.admin-users-list{display:grid;gap:10px;margin-top:12px}
.admin-user-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
}
.admin-user-row h4{margin:0 0 4px;font-size:16px}
.admin-user-row .status-pill{margin-left:6px}
.admin-editor-panel{position:sticky;top:92px}
.admin-active-line{justify-content:flex-start!important}
.admin-active-line input{width:auto}
.password-change-box{
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.account-summary{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
  margin:12px 0;
}
.account-summary > div{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fffdf8;
  padding:12px;
}
.account-summary b{display:block;font-size:18px;color:var(--navy)}
.account-summary span{color:var(--muted);font-weight:800}
.account-password-box{max-width:560px}
.message.warning{
  min-height:0;
  border-left:4px solid #c7831a;
  background:#fff8e8;
  color:#6f4800;
  padding:10px 12px;
  border-radius:8px;
}

.reservation-toolbar{
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(180px,240px);
  gap:10px;
  margin:12px 0;
}
.reservations-list,.reservation-card-list{display:grid;gap:10px}
.reservation-card{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fffdf8;
  padding:14px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:start;
}
.reservation-card h4{margin:0 0 4px;font-size:17px}
.reservation-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  color:var(--muted);
  font-weight:800;
  font-size:13px;
}
.reservation-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
  min-width:220px;
}
.reservation-actions button{padding:8px 10px;font-size:12px}
@media(max-width:820px){
  .reservation-toolbar{grid-template-columns:1fr}
  .reservation-card{grid-template-columns:1fr}
  .reservation-actions{justify-content:flex-start;min-width:0}
}
@media(max-width:1000px){
  .admin-layout{grid-template-columns:1fr}
  .admin-editor-panel{position:static}
}

/* V230: reservation date/duration POS polish */
@media (orientation:landscape) and (min-width:900px){
  html body #roomsTab .room-summary{
    margin:8px 0 10px!important;
  }
  html body #roomsTab .room-summary > div{
    height:64px!important;
    min-height:64px!important;
    max-height:64px!important;
    padding:5px 8px!important;
    border-radius:13px!important;
  }
  html body #roomsTab .room-summary b{
    font-size:clamp(17px,1.45vw,21px)!important;
    line-height:1!important;
  }
  html body #roomsTab .room-summary span{
    margin-top:4px!important;
    font-size:clamp(8px,.68vw,9.5px)!important;
    line-height:1!important;
    letter-spacing:0!important;
  }
}
@media (orientation:landscape) and (min-width:900px) and (max-height:760px){
  html body #roomsTab .room-summary > div{
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    padding:4px 7px!important;
  }
}
html body #roomsTab .reserved-overlay{
  margin:12px 4px 12px!important;
  padding:12px 12px 14px!important;
  min-height:54px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  line-height:1.2!important;
  letter-spacing:0!important;
}
html body #roomsTab .reserved-overlay small{
  display:block!important;
  margin:0!important;
  line-height:1.25!important;
  white-space:normal!important;
}
html body #roomsTab .reservation-detail-grid{
  gap:10px!important;
}
html body #roomsTab .reservation-detail-grid > div{
  min-height:72px!important;
  padding:12px!important;
  overflow-wrap:anywhere!important;
}
html body #roomsTab .room-order-scroll{
  padding-bottom:120px!important;
}
html body #roomsTab #printRoomTicketBtn,
html body #roomsTab .room-ticket-btn{
  margin:14px 0 96px!important;
}

