/* ---------- Colour themes (easy on the eyes). Set in Settings > Business > Colour theme ---------- */
html[data-theme=navy]  { --bg:#0e1726; --surface:#152238; --surface2:#1b2c47; --text:#c9d4e3; --muted:#8c9db5; --border:#253653; --sidebar:#0a111e; --accent:#4f8cf0; --accent-d:#3b74d4; color-scheme:dark; }
html[data-theme=green] { --bg:#0b1914; --surface:#122820; --surface2:#19352b; --text:#cde2d8; --muted:#8aae9d; --border:#22392f; --sidebar:#07130e; --accent:#36a880; --accent-d:#2b8c69; color-scheme:dark; }
html[data-theme=soft]  { --bg:#e6eaed; --surface:#f3f5f6; --surface2:#e0e5e9; --text:#2a3540; --muted:#5d6a76; --border:#cbd3da; --sidebar:#2b3d4f; --accent:#3b6ea8; --accent-d:#2f5a8c; color-scheme:light; }
html[data-theme] {
  --bs-body-bg:var(--bg); --bs-body-color:var(--text); --bs-border-color:var(--border); --bs-secondary-color:var(--muted); --bs-tertiary-bg:var(--surface2); --bs-secondary-bg:var(--surface2);
  --bs-emphasis-color:var(--text); --bs-primary:var(--accent); --bs-link-color:var(--accent); --bs-link-hover-color:var(--accent-d); --bs-heading-color:var(--text);
}
html[data-theme=navy] { --c-blue:#6aa3ff; --c-green:#4cc38a; --c-amber:#f0b95a; --c-violet:#a78bfa; --c-rose:#f07a86; --c-teal:#43c6c0; }
html[data-theme=green]{ --c-blue:#6fb0e8; --c-green:#5fd0a0; --c-amber:#e8c261; --c-violet:#b199e8; --c-rose:#ec8590; --c-teal:#4fd2c4; }
html[data-theme=soft] { --c-blue:#2f6fc0; --c-green:#238a5c; --c-amber:#b9810f; --c-violet:#6d4fc0; --c-rose:#c0394a; --c-teal:#12877f; }

body{background:var(--bg);color:var(--text);font-size:.95rem}
a{color:var(--accent)}
.text-muted{color:var(--muted)!important}
.sidebar{background:var(--sidebar);color:#cfd8e3;width:240px;border-right:1px solid var(--border)}
@media(min-width:992px){.sidebar{position:fixed;top:0;bottom:0;left:0;overflow-y:auto;z-index:100}.content{margin-left:240px;padding:1.25rem 1.5rem}}
@media(max-width:991.98px){.content{padding:.75rem}}
.topbar{background:var(--sidebar);border-bottom:1px solid var(--border)}
.side-inner{display:flex;flex-direction:column;min-height:100%;padding:.75rem}
.brand{align-items:center;gap:.5rem;font-weight:600;padding:.5rem .5rem 1rem;font-size:1.05rem;color:#e2e8f0}
.sidebar .nav-link{color:#b4c0d0;border-radius:.5rem;padding:.5rem .75rem;display:flex;gap:.6rem;align-items:center;transition:background .15s,color .15s}
.sidebar .nav-link:hover{background:rgba(255,255,255,.07);color:#e8eef6}
.sidebar .nav-link.active{background:var(--accent);color:#fff}
.side-foot{margin-top:auto;padding:.75rem .25rem;color:#aab6c6}
.sidebar .offcanvas-title{color:#e2e8f0}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--border);border-radius:8px}::-webkit-scrollbar-track{background:transparent}

/* Components on the calm palette */
.card{background:var(--surface);--bs-card-bg:var(--surface);--bs-card-color:var(--text);border:1px solid var(--border);border-radius:.75rem;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.card-footer{background:transparent;border-color:var(--border)}
.table{--bs-table-bg:transparent;--bs-table-color:var(--text);--bs-table-border-color:var(--border);--bs-table-hover-bg:rgba(127,150,190,.08);--bs-table-striped-bg:rgba(127,150,190,.05)}
.table>:not(caption)>*>*{padding:.55rem .6rem}
.form-control,.form-select,.input-group-text{background-color:var(--surface2);border-color:var(--border);color:var(--text)}
.form-control:focus,.form-select:focus{background-color:var(--surface2);color:var(--text);border-color:var(--accent);box-shadow:0 0 0 .2rem rgba(79,140,240,.2)}
.form-control::placeholder{color:var(--muted);opacity:.8}
.form-text{color:var(--muted)}
.modal-content,.dropdown-menu,.offcanvas:not(.sidebar),.list-group-item,.toast{background:var(--surface);color:var(--text);border-color:var(--border)}
.btn-close{filter:var(--bs-btn-close-white-filter,none)}html[data-theme=navy] .btn-close,html[data-theme=green] .btn-close{filter:invert(1) grayscale(100%) brightness(200%)}
.btn{border-radius:.5rem}
.btn-primary{--bs-btn-bg:var(--accent);--bs-btn-border-color:var(--accent);--bs-btn-hover-bg:var(--accent-d);--bs-btn-hover-border-color:var(--accent-d);--bs-btn-active-bg:var(--accent-d);--bs-btn-color:#fff;--bs-btn-hover-color:#fff}
.btn-outline-primary{--bs-btn-color:var(--accent);--bs-btn-border-color:var(--accent);--bs-btn-hover-bg:var(--accent);--bs-btn-hover-border-color:var(--accent);--bs-btn-hover-color:#fff}
.btn-secondary{--bs-btn-bg:var(--surface2);--bs-btn-border-color:var(--border);--bs-btn-color:var(--text);--bs-btn-hover-bg:var(--border);--bs-btn-hover-border-color:var(--border);--bs-btn-hover-color:var(--text);--bs-btn-active-bg:var(--border)}
.btn-outline-secondary{--bs-btn-color:var(--muted);--bs-btn-border-color:var(--border);--bs-btn-hover-bg:var(--surface2);--bs-btn-hover-border-color:var(--border);--bs-btn-hover-color:var(--text)}
.nav-tabs{--bs-nav-tabs-border-color:var(--border);--bs-nav-tabs-link-active-bg:var(--surface);--bs-nav-tabs-link-active-color:var(--text);--bs-nav-tabs-link-active-border-color:var(--border) var(--border) var(--surface);--bs-nav-link-color:var(--muted);--bs-nav-link-hover-color:var(--text)}
.progress{background:var(--surface2)}
.alert{border-width:1px}
pre,code{color:inherit}code{color:var(--c-rose)}
.bg-body-tertiary{background:var(--surface2)!important}
.badge.text-bg-warning,.badge.text-bg-info,.badge.text-bg-success,.badge.text-bg-danger{color:#10151d!important}

/* ---------- Coloured stat cards that move on hover ---------- */
.stat{--c:var(--c-blue);position:relative;overflow:hidden;border-left:5px solid var(--c);cursor:default;
  background:linear-gradient(135deg,color-mix(in srgb,var(--c) 16%,var(--surface)),var(--surface) 70%);
  transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s,border-color .22s}
.stat::after{content:"";position:absolute;right:-26px;top:-26px;width:90px;height:90px;border-radius:50%;background:color-mix(in srgb,var(--c) 20%,transparent);transition:transform .35s}
.stat:hover{transform:translateY(-6px) scale(1.025);box-shadow:0 14px 30px rgba(0,0,0,.38),0 0 0 1px var(--c)}
.stat:hover::after{transform:scale(1.8)}
.stat .v{font-size:1.5rem;font-weight:700;color:var(--c);position:relative;z-index:1}
.stat .card-body{position:relative;z-index:1}
.stat .ico{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;color:var(--c);background:color-mix(in srgb,var(--c) 18%,transparent)}
.stat.active{box-shadow:0 0 0 2px var(--c)}
a:hover .stat{transform:translateY(-6px) scale(1.025);box-shadow:0 14px 30px rgba(0,0,0,.38),0 0 0 1px var(--c)}
.c-blue{--c:var(--c-blue)}.c-green{--c:var(--c-green)}.c-amber{--c:var(--c-amber)}.c-violet{--c:var(--c-violet)}.c-rose{--c:var(--c-rose)}.c-teal{--c:var(--c-teal)}
.card.lift{transition:transform .2s,box-shadow .2s}.card.lift:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.3)}
.room{transition:transform .18s,box-shadow .18s}.room:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 10px 22px rgba(0,0,0,.35)}
@media (prefers-reduced-motion:reduce){.stat,.stat::after,.card.lift,.room{transition:none}.stat:hover,.card.lift:hover,.room:hover{transform:none}}

/* ---------- POS ---------- */
.pos-wrap{display:grid;grid-template-columns:1fr 380px;gap:1rem;height:calc(100vh - 2.5rem)}
@media(max-width:991.98px){.pos-wrap{grid-template-columns:1fr;height:auto}.cart-col{position:sticky;bottom:0}}
.prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.5rem;overflow-y:auto;max-height:calc(100vh - 11rem);padding:.25rem}
@media(max-width:991.98px){.prod-grid{max-height:50vh}}
.prod{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:.6rem;padding:.5rem;cursor:pointer;text-align:left;min-height:78px;transition:transform .12s,border-color .12s}
.prod:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 0 0 2px rgba(79,140,240,.18)}
.prod .n{font-weight:600;font-size:.85rem;line-height:1.15}
.prod .p{color:var(--accent);font-weight:700}
.cart-col{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:.75rem;overflow:hidden}
.cart-lines{flex:1;overflow-y:auto;min-height:140px;max-height:45vh}
.cart-line{display:flex;gap:.4rem;align-items:center;padding:.4rem .6rem;border-bottom:1px solid var(--border)}
.cart-line .nm{flex:1;min-width:0;font-size:.88rem}
.cart-total{font-size:1.7rem;font-weight:800;color:var(--c-green)}
.qty-in{width:74px;text-align:center}
.big-btn{padding:.9rem;font-size:1.1rem;font-weight:600}
.pay-methods .btn{padding:.8rem}
#scanBox{font-size:1.1rem}

/* ---------- Receipt: always white paper, black ink ---------- */
.receipt{font-family:"Courier New",monospace;font-size:12px;color:#000;margin:0 auto;padding:6px;background:#fff}
.receipt *{color:#000}
.receipt.w80{width:76mm}.receipt.w58{width:54mm;font-size:11px}
.receipt .c{text-align:center}.receipt hr{border:0;border-top:1px dashed #000;margin:5px 0;opacity:1}
.receipt table{width:100%;--bs-table-bg:transparent}.receipt td{vertical-align:top;padding:1px 0;border:0;background:transparent}.receipt .r{text-align:right}
@media print{
  html[data-theme]{--bg:#fff;--surface:#fff;--surface2:#fff;--text:#000;--muted:#333;--border:#999}
  body{background:#fff!important;color:#000!important}.no-print,.sidebar,.navbar,.topbar{display:none!important}
  .content{margin:0!important;padding:0!important}.card{box-shadow:none;border:1px solid #bbb;background:#fff}.stat{background:#fff;transform:none!important}.stat .v{color:#000}
  .table{--bs-table-color:#000}.receipt{width:100%!important;padding:0}.text-muted{color:#444!important}
  @page{margin:8mm}
}

/* Install-app bar (bottom of the screen) */
.install-bar{position:fixed;left:.75rem;right:.75rem;top:calc(.5rem + env(safe-area-inset-top,0px));z-index:2000;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;justify-content:space-between;background:var(--sidebar,#0a111e);color:#e8eef6;border:1px solid var(--border,#253653);border-radius:.75rem;padding:.6rem .8rem;box-shadow:0 6px 24px rgba(0,0,0,.35);max-width:560px;margin:0 auto}
.install-bar .install-text{flex:1 1 220px;font-size:.9rem}
