@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600&display=swap');

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0; height: 100%;
  font-family: 'Inter', -apple-system, sans-serif;
  background: #F2F3F1;
  color: #14171A;
}
h1, h2, h3 { font-family: 'Space Grotesk', 'Inter', sans-serif; }
a { color: inherit; }
.mono { font-family: 'JetBrains Mono', monospace; }

/* ---------- Shell layout ---------- */
.shell { display: flex; min-height: 100vh; }

.sidebar {
  width: 230px;
  flex-shrink: 0;
  background: var(--brand-secondary, #0B0B0B);
  color: #EDEDED;
  display: flex;
  flex-direction: column;
  padding: 20px 16px;
  position: sticky;
  top: 0;
  height: 100vh;
}
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 6px 20px 6px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  margin-bottom: 16px;
}
.sidebar-logo { width: 34px; height: 34px; object-fit: contain; }
.sidebar-brand-name { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 15px; line-height: 1.2; }

.sidebar-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.sidebar-nav a {
  text-decoration: none;
  color: #B7B9BC;
  padding: 9px 10px;
  border-radius: 7px;
  font-size: 14px;
  font-weight: 500;
}
.sidebar-nav a:hover { background: rgba(255,255,255,0.06); color: #fff; }
.sidebar-nav a.active { background: var(--brand-primary, #1FAA3C); color: #fff; }
.sidebar-section {
  margin: 14px 0 4px 10px;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6C6F73;
  font-weight: 600;
}

.sidebar-footer { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 14px; margin-top: 12px; }
.sidebar-user { font-size: 13px; color: #E4E4E4; margin-bottom: 8px; }
.sidebar-user small { color: #8A8D90; font-weight: 400; }
.logout-link { font-size: 13px; color: #B7B9BC; text-decoration: none; }
.logout-link:hover { color: #fff; }
.powered-by { margin-top: 10px; font-size: 11px; color: #62666A; }
.powered-by strong { color: #9AA0A6; }

.content { flex: 1; padding: 32px 40px; max-width: 1200px; }

/* ---------- Flash messages ---------- */
.flash-stack { margin-bottom: 20px; display: flex; flex-direction: column; gap: 8px; }
.flash-stack-standalone { max-width: 420px; margin: 20px auto 0; }
body.auth-page .flash-stack-standalone { position:fixed; z-index:1000; top:18px; left:50%; width:min(420px,calc(100vw - 24px)); margin:0; transform:translateX(-50%); }
.flash { padding: 11px 16px; border-radius: 8px; font-size: 14px; font-weight: 500; }
.flash-success { background: #E4F7E9; color: #15722A; border: 1px solid #B6E7C2; }
.flash-error { background: #FBEAEA; color: #A32020; border: 1px solid #F0C2C2; }
.flash-info { background: #E9EEF8; color: #1F4CA3; border: 1px solid #C4D2F0; }

/* ---------- Page headers ---------- */
.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; }
.page-header h1 { font-size: 22px; margin: 0; font-weight: 700; }
.page-header p.subtitle { color: #6B6F73; font-size: 13.5px; margin: 4px 0 0; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 16px; border-radius: 8px; border: none;
  font-size: 13.5px; font-weight: 600; cursor: pointer;
  text-decoration: none; font-family: inherit;
}
.btn-primary { background: var(--brand-primary, #1FAA3C); color: #fff; }
.btn-primary:hover { filter: brightness(1.07); }
.btn-secondary { background: #E7E8E6; color: #14171A; }
.btn-secondary:hover { background: #DCDDDA; }
.btn-danger { background: #D64545; color: #fff; }

.application-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.application-option { display:flex; align-items:center; gap:9px; padding:10px; border:1px solid #D8D9D6; border-radius:7px; cursor:pointer; }
.application-option input { width:auto; }
.application-disabled { opacity:.45; cursor:not-allowed; background:#F4F4F2; }
.danger-action summary { color:#B42318; font-weight:700; cursor:pointer; font-size:12px; }
.danger-action form { position:absolute; right:45px; z-index:10; width:330px; padding:16px; background:#fff; border:1px solid #F1B4AF; border-radius:12px; box-shadow:0 18px 50px rgba(55,15,12,.2); }
.danger-action p { margin:0 0 10px; color:#8F1D16; font-size:12px; }
.danger-action label { display:block; font-size:11px; margin-bottom:6px; }
.danger-action input { width:100%; padding:9px; border:1px solid #D7A19D; border-radius:8px; margin-bottom:9px; }
.btn-sm { padding: 6px 11px; font-size: 12.5px; }
.btn-block { width: 100%; justify-content: center; }

/* ---------- Cards / tables ---------- */
.card { background: #fff; border-radius: 12px; padding: 22px 24px; box-shadow: 0 1px 2px rgba(0,0,0,0.04); border: 1px solid #E7E8E6; }
.card + .card { margin-top: 18px; }
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin-bottom: 24px; }
.stat-card { background: #fff; border-radius: 12px; padding: 18px 20px; border: 1px solid #E7E8E6; }
.stat-card .stat-label { font-size: 12px; color: #6B6F73; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }
.stat-card .stat-value { font-size: 26px; font-weight: 700; margin-top: 6px; font-family: 'Space Grotesk', sans-serif; }
.stat-card.warn .stat-value { color: #B8590E; }

table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
th { text-align: left; color: #6B6F73; font-weight: 600; font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.04em; padding: 8px 10px; border-bottom: 1px solid #E7E8E6; }
td { padding: 11px 10px; border-bottom: 1px solid #F0F0EF; }
tr:last-child td { border-bottom: none; }
table.clickable tr:hover { background: #FAFAF9; cursor: pointer; }

.badge { display: inline-block; padding: 3px 9px; border-radius: 20px; font-size: 11.5px; font-weight: 600; }
.badge-green { background: #E4F7E9; color: #15722A; }
.badge-red { background: #FBEAEA; color: #A32020; }
.badge-gray { background: #EDEDEC; color: #55585B; }

/* ---------- Forms ---------- */
.form-row { margin-bottom: 16px; }
.form-row label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.form-row input[type=text], .form-row input[type=number], .form-row input[type=password],
.form-row input[type=email], .form-row textarea, .form-row select {
  width: 100%; padding: 10px 12px; border-radius: 8px; border: 1px solid #D8D9D6;
  font-size: 14px; font-family: inherit; background: #fff;
}
.form-row input[type=file] { font-size: 13px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.form-actions { margin-top: 20px; display: flex; gap: 10px; }
.checkbox-row { display: flex; align-items: center; gap: 8px; }
.checkbox-row input { width: auto; }
.color-input { width: 60px !important; height: 40px; padding: 2px !important; }

/* ---------- Auth page ---------- */
body.auth-page { width:100%; min-width:0; min-height:100vh; min-height:100dvh; overflow-x:clip; display:flex; align-items:center; justify-content:center; background:#0B0B0B; }
body.auth-page.login-page {
  background-color:#07101A;
  background-image:url('../img/westony-server-room-bg.jpg');
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  background-attachment:fixed;
}
.login-video-background { position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; background:#07101A url('../img/westony-server-room-bg.jpg') center/cover no-repeat; }
.login-video-background video { width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
body.login-page .auth-card { position:relative; z-index:1; }
body.login-page .auth-card {
  background:#1B1C1E;
  color:#FFFFFF;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 24px 70px rgba(0,0,0,.65);
}
body.login-page .auth-tabs { background:#0E1012; }
body.login-page .auth-tabs a { color:#E8ECE9; }
body.login-page .auth-tabs a.active { background:#62FF2F; color:#101510; box-shadow:0 5px 18px rgba(98,255,47,.25); }
body.login-page .auth-card p.tag { color:#C8CECA; }
body.login-page .form-row label { color:#FFFFFF; }
body.login-page .form-row input {
  color:#FFFFFF;
  background:#0D1013;
  border-color:#41464B;
}
body.login-page .form-row input:focus { border-color:#62FF2F; outline:2px solid rgba(98,255,47,.18); }
body.login-page .btn-primary { background:#62FF2F; color:#101510; box-shadow:0 8px 22px rgba(98,255,47,.22); }
body.login-page .btn-primary:hover { background:#73FF47; }
body.auth-page.signup-theme-page { display:block; overflow-x:hidden; overflow-y:auto; min-height:100vh; min-height:100dvh; background:#07101A url('../img/westony-server-room-bg.jpg') center/cover fixed no-repeat; }
body.signup-theme-page .signup-page { position:relative; z-index:1; }
body.signup-theme-page .signup-tabs { background:#0E1012; }
body.signup-theme-page .signup-tabs a { color:#E8ECE9; }
body.signup-theme-page .signup-tabs a.active { background:#62FF2F; color:#101510; box-shadow:0 5px 18px rgba(98,255,47,.25); }
body.signup-theme-page .signup-heading p { color:#E1E6E2; }
body.signup-theme-page .pricing-card,
body.signup-theme-page .signup-form-card {
  background:#1B1C1E;
  color:#FFFFFF;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 24px 70px rgba(0,0,0,.58);
}
body.signup-theme-page .pricing-card.selected { border-color:#62FF2F; box-shadow:0 20px 60px rgba(98,255,47,.20); }
body.signup-theme-page .plan-kicker { color:#62FF2F; }
body.signup-theme-page .pricing-card h2 small,
body.signup-theme-page .ex-vat,
body.signup-theme-page .signup-form-card>div>p { color:#C8CECA; }
body.signup-theme-page .pricing-card li { border-bottom-color:#34383B; }
body.signup-theme-page .pricing-card li:before { color:#62FF2F; }
body.signup-theme-page .plan-recommendation { background:#102713; color:#BFFFAD; border:1px solid rgba(98,255,47,.22); }
body.signup-theme-page .custom-plan-message { background:#0E1012; border:1px solid #34383B; }
body.signup-theme-page .custom-plan-message p { color:#C8CECA; }
body.signup-theme-page .form-row label { color:#FFFFFF; }
body.signup-theme-page .form-row input,
body.signup-theme-page .form-row textarea {
  color:#FFFFFF;
  background:#0D1013;
  border-color:#41464B;
}
body.signup-theme-page .form-row input:focus,
body.signup-theme-page .form-row textarea:focus { border-color:#62FF2F; outline:2px solid rgba(98,255,47,.18); }
body.signup-theme-page .btn-primary { background:#62FF2F; color:#101510; box-shadow:0 8px 22px rgba(98,255,47,.22); }
body.signup-theme-page .btn-primary:hover { background:#73FF47; }
@media(prefers-reduced-motion:reduce){.login-video-background video{display:none}}
.auth-card {
  width: 440px; background: #fff; border-radius: 16px; padding: 34px 32px;
  max-width:calc(100vw - 24px); margin-inline:auto; flex:0 0 auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}
.auth-logo { display: block; margin: 0 auto 16px; width: 56px; height: 56px; object-fit: contain; }
.auth-logo.vendiright-logo {
  width:100%;
  max-width:100%;
  height:auto;
  aspect-ratio:1920 / 910;
  object-fit:contain;
  object-position:center;
  border-radius:12px;
  background:#090f16;
}
.auth-card h1 { text-align: center; font-size: 19px; margin: 0 0 4px; }
.auth-card p.tag { text-align: center; color: #6B6F73; font-size: 13px; margin: 2px 0 24px; }
.auth-tabs { display:flex; background:#eef1ee; border-radius:12px; padding:4px; margin:0 0 18px; }
.auth-tabs a { flex:1; text-align:center; padding:9px 14px; border-radius:9px; color:#566058; font-weight:800; text-decoration:none; }
.auth-tabs a.active { background:#fff; color:#132219; box-shadow:0 4px 12px rgba(18,42,25,.1); }
.signup-page { width:min(1120px,calc(100vw - 28px)); margin:36px auto; }
.signup-tabs { width:min(360px,100%); margin:0 auto 24px; }
.signup-heading { text-align:center; color:#fff; margin-bottom:26px; }
.signup-heading img {
  display:block;
  width:min(680px,100%);
  max-width:100%;
  height:auto;
  aspect-ratio:1920 / 910;
  object-fit:contain;
  object-position:center;
  margin:0 auto;
  border-radius:14px;
  background:#090f16;
}
.signup-heading h1 { margin:16px 0 6px; font-size:34px; }
.signup-heading p { color:#b8c2bc; margin:0; }
.pricing-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; align-items:stretch; }
.pricing-card { background:#fff; border:2px solid transparent; border-radius:22px; padding:28px; box-shadow:0 18px 50px rgba(0,0,0,.28); display:flex; flex-direction:column; }
.pricing-card.selected { border-color:#19df77; box-shadow:0 18px 55px rgba(25,223,119,.2); }
.plan-kicker { color:#10b963; font-size:12px; font-weight:900; letter-spacing:.14em; }
.pricing-card h2 { margin:9px 0 0; font-size:36px; }
.pricing-card h2 small { font-size:14px; color:#6b746e; }
.ex-vat { color:#747c77; margin:2px 0 18px; font-size:13px; }
.pricing-card ul { list-style:none; padding:0; margin:0 0 22px; flex:1; }
.pricing-card li { padding:8px 0 8px 28px; position:relative; border-bottom:1px solid #edf0ed; }
.pricing-card li:before { content:'✓'; position:absolute; left:2px; color:#10bf66; font-weight:900; }
.plan-recommendation { padding:12px; border-radius:10px; background:#eef9f2; color:#1d623b; font-weight:700; font-size:13px; }
.custom-plan-message { background:#101c15; color:#fff; padding:20px; border-radius:14px; margin:18px 0; }
.custom-plan-message strong { font-size:19px; }
.custom-plan-message p { color:#b8c9be; margin:8px 0 0; line-height:1.5; }
.signup-form-card {
  width:min(980px,100%);
  background:#fff;
  border-radius:24px;
  padding:34px;
  margin:28px auto 50px;
  box-shadow:0 22px 65px rgba(0,0,0,.34);
}
.signup-form-intro {
  margin:-34px -34px 28px;
  padding:30px 34px 24px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:linear-gradient(135deg,rgba(98,255,47,.075),rgba(98,255,47,0));
  border-radius:24px 24px 0 0;
}
.signup-form-card h2 { margin:7px 0 6px;font-size:27px;letter-spacing:-.02em; }
.signup-form-card .signup-form-intro p { margin:0;font-size:15px; }
.signup-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 22px; }
.signup-form-grid .form-row:nth-child(5) { grid-column:1 / -1;max-width:calc(50% - 11px); }
.signup-form-card .form-row { margin-bottom:19px; }
.signup-form-card .form-row label { margin-bottom:8px;font-size:13px;font-weight:800;color:#f5f7f5; }
.signup-form-card .form-row input:not([type=hidden]),
.signup-form-card .form-row textarea {
  display:block;
  width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:13px 14px;
  border:1px solid #41484a;
  border-radius:11px;
  background:#0d1113;
  color:#fff;
  font:inherit;
  font-size:15px;
  line-height:1.35;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.signup-form-card .form-row input:not([type=hidden]) { min-height:48px; }
.signup-form-card .form-row textarea { min-height:92px;resize:vertical; }
.signup-form-card .form-row input::placeholder,
.signup-form-card .form-row textarea::placeholder { color:#7f8983;opacity:1; }
.signup-form-card .form-row input:focus,
.signup-form-card .form-row textarea:focus {
  outline:none;
  border-color:#62ff2f;
  background:#111719;
  box-shadow:0 0 0 4px rgba(98,255,47,.13);
}
.signup-form-card .btn-primary {
  min-height:52px;
  margin-top:5px;
  border-radius:12px;
  font-size:15px;
  font-weight:900;
  letter-spacing:.01em;
}
.signup-thanks { text-align:center; }
.signup-thanks p { color:#667069; line-height:1.5; }
@media (max-width:760px) {
  body.auth-page:has(.signup-page){display:block}
  .pricing-grid,.signup-form-grid{grid-template-columns:1fr}
  .signup-page{margin:18px auto}
  .signup-heading h1{font-size:27px}
  .pricing-card{padding:22px}
  .signup-form-card{padding:22px;border-radius:19px}
  .signup-form-intro{margin:-22px -22px 23px;padding:24px 22px 20px;border-radius:19px 19px 0 0}
  .signup-form-card h2{font-size:23px}
  .signup-form-grid .form-row:nth-child(5){grid-column:auto;max-width:none}
}
.enquiry-detail-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:14px 0; }
.enquiry-detail-grid div { padding:13px; background:#f4f6f4; border-radius:10px; display:flex; flex-direction:column; gap:4px; overflow-wrap:anywhere; }
.enquiry-detail-grid small { color:#778079; text-transform:uppercase; font-weight:800; letter-spacing:.06em; }
.enquiry-notes { padding:14px; border-left:4px solid #16bd67; background:#f1faf4; white-space:pre-wrap; }
@media(max-width:760px){.enquiry-detail-grid{grid-template-columns:1fr 1fr}}
.email-scope-note { border-left:5px solid #13c86a; background:#f0faf4; }
.email-scope-note p { margin:6px 0 0; color:#536158; }

/* ---------- POS till (touch-first) ---------- */
.pos-wrap { display: grid; grid-template-columns: 1fr 400px; gap: 18px; height: calc(100vh - 76px); }
.pos-main { display: flex; flex-direction: column; min-height: 0; }

.pos-scan-box { margin-bottom: 12px; }
.pos-scan-box input {
  width: 100%; font-size: 20px; padding: 16px 18px; border-radius: 12px;
  border: 2px solid var(--brand-primary, #1FAA3C); font-family: 'JetBrains Mono', monospace;
  background: #fff;
}
.pos-scan-box input:focus { outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-primary, #1FAA3C) 25%, transparent); }

.pos-results {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px;
  overflow-y: auto; flex: 1; padding-bottom: 12px; align-content: start;
}
.pos-product-tile {
  background: #fff; border: 1.5px solid #E7E8E6; border-radius: 14px; padding: 14px;
  cursor: pointer; text-align: center; font-family: inherit;
  transition: transform .08s, border-color .1s; min-height: 148px;
  display: flex; flex-direction: column;
}
.pos-product-tile:active { transform: scale(0.96); }
.pos-product-tile:hover { border-color: var(--brand-primary, #1FAA3C); }
.pos-product-tile.out-of-stock { opacity: 0.5; }
.pos-product-tile img { width: 100%; height: 78px; object-fit: cover; border-radius: 8px; margin-bottom: 8px; background: #F2F3F1; }
.pos-product-tile .tile-noimg {
  width: 100%; height: 78px; border-radius: 8px; margin-bottom: 8px; background: #F2F3F1;
  display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 700; color: #C4C6C3;
}
.pos-product-tile .tile-name { font-size: 13px; font-weight: 700; line-height: 1.3; flex: 1; }
.pos-product-tile .tile-price { font-size: 14.5px; color: var(--brand-primary, #1FAA3C); font-weight: 700; margin-top: 6px; }
.pos-product-tile .tile-stock { font-size: 11px; color: #8A8D90; margin-top: 2px; }

.pos-cart { background: #fff; border-radius: 16px; border: 1px solid #E7E8E6; display: flex; flex-direction: column; overflow: hidden; }
.pos-cart-header { padding: 16px 18px; border-bottom: 1px solid #E7E8E6; font-weight: 700; font-size: 15px; display: flex; justify-content: space-between; align-items: center; }
.pos-cart-items { flex: 1; overflow-y: auto; padding: 6px 12px; }
.cart-empty { color: #8A8D90; font-size: 14px; text-align: center; margin-top: 40px; }
.cart-line { display: flex; align-items: center; gap: 10px; padding: 12px 6px; border-bottom: 1px solid #F0F0EF; font-size: 14px; }
.cart-line .cart-name { flex: 1; font-weight: 600; }
.qty-stepper { display: flex; align-items: center; gap: 6px; }
.qty-btn {
  width: 32px; height: 32px; border-radius: 8px; border: 1px solid #D8D9D6; background: #F7F7F6;
  font-size: 18px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center;
  line-height: 1; padding: 0;
}
.qty-btn:active { background: #ECECEA; }
.qty-value { width: 22px; text-align: center; font-family: 'JetBrains Mono', monospace; font-weight: 600; }
.cart-line .cart-linetotal { width: 74px; text-align: right; font-family: 'JetBrains Mono', monospace; font-weight: 600; }
.cart-line .cart-remove { color: #C24545; cursor: pointer; font-size: 15px; padding: 4px; }
.pos-cart-totals { padding: 14px 18px; border-top: 1px solid #E7E8E6; }
.pos-cart-totals .row { display: flex; justify-content: space-between; font-size: 13.5px; margin-bottom: 6px; color: #6B6F73; }
.pos-cart-totals .row.total { font-size: 22px; font-weight: 700; color: #14171A; margin-top: 8px; }
.pos-cart-footer { padding: 14px 18px 18px; border-top: 1px solid #E7E8E6; display: flex; flex-direction: column; gap: 10px; }
.pay-method-row { display: flex; gap: 8px; }
.pay-method-row button {
  flex: 1; padding: 13px 6px; border-radius: 10px; border: 1.5px solid #D8D9D6; background: #fff;
  font-weight: 700; font-size: 13px; cursor: pointer;
}
.pay-method-row button.selected { background: var(--brand-secondary, #0B0B0B); color: #fff; border-color: var(--brand-secondary, #0B0B0B); }
#accountCustomer { padding: 12px; border-radius: 10px; border: 1px solid #D8D9D6; font-size: 14px; }
.btn-charge { padding: 18px; font-size: 17px; border-radius: 12px; }

.pos-overlay {
  display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.55);
  align-items: center; justify-content: center; z-index: 50;
}
.pos-overlay.show { display: flex; }
.pos-overlay-card { background: #fff; border-radius: 18px; padding: 36px; width: 320px; text-align: center; }

.receipt-cash-detail { margin: 4px 0 16px; text-align: left; border-top: 1px dashed #E7E8E6; padding-top: 12px; }
.receipt-cash-detail .row { display: flex; justify-content: space-between; font-size: 14px; color: #6B6F73; margin-bottom: 4px; }
.receipt-cash-detail .row.change { font-weight: 700; color: #14171A; font-size: 17px; }

/* ---------- Cash-count modal ---------- */
.cash-modal-card {
  width: 380px;
  max-height: calc(100dvh - 20px);
  overflow-y: auto;
  box-sizing: border-box;
  padding: 22px;
  text-align: left;
  overscroll-behavior: contain;
}
.cash-modal-card h2 { text-align: center; }
.cash-modal-card .subtitle { text-align: center; }
.cash-modal-card .form-actions {
  position: sticky;
  bottom: -22px;
  z-index: 3;
  margin-left: -22px;
  margin-right: -22px;
  margin-bottom: -22px;
  padding: 12px 22px calc(12px + env(safe-area-inset-bottom));
  background: #fff;
  border-top: 1px solid #E1E6E0;
  box-shadow: 0 -8px 20px rgba(20,38,25,.1);
}

.note-row { display: flex; gap: 8px; margin-bottom: 16px; }
.note-btn {
  flex: 1; padding: 14px 4px; border-radius: 10px; border: 1.5px solid #D8D9D6;
  background: #F7F7F6; font-weight: 700; font-size: 14px; cursor: pointer;
}
.note-btn:active { background: #ECECEA; transform: scale(0.96); }

.cash-amount-display {
  display: flex; justify-content: space-between; align-items: baseline;
  background: #F2F3F1; border-radius: 10px; padding: 12px 16px; margin-bottom: 14px;
}
.cash-amount-label { font-size: 12.5px; color: #6B6F73; font-weight: 600; }
.cash-amount-value { font-size: 24px; font-weight: 700; }

.keypad { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.key {
  padding: 16px 0; border-radius: 10px; border: 1.5px solid #D8D9D6; background: #fff;
  font-size: 19px; font-weight: 700; cursor: pointer; font-family: 'JetBrains Mono', monospace;
}
.key:active { background: #F2F3F1; transform: scale(0.96); }
.key-backspace { font-family: inherit; font-size: 17px; }

.cash-change-row {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 16px; padding: 12px 16px; border-radius: 10px;
  background: #E4F7E9; font-weight: 700; font-size: 17px; color: #15722A;
}
.cash-change-row.insufficient { background: #FBEAEA; color: #A32020; font-size: 14px; }

.terminal-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; }
.terminal-card {
  background: #fff; border: 1px solid #E7E8E6; border-radius: 12px; padding: 22px;
  text-align: center; text-decoration: none; color: inherit;
}
.terminal-card:hover { border-color: var(--brand-primary, #1FAA3C); }
.terminal-card .till-icon { font-size: 28px; margin-bottom: 8px; }

/* ---------- Till-mode shell (cashiers - no sidebar, full-bleed touch UI) ---------- */
body.till-mode { background: #EDEEEC; }
.till-topbar {
  display: flex; align-items: center; justify-content: space-between;
  background: var(--brand-secondary, #0B0B0B); color: #fff;
  padding: 10px 20px; position: sticky; top: 0; z-index: 30;
}
.till-topbar-brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-family: 'Space Grotesk', sans-serif; }
.till-topbar-brand img { width: 30px; height: 30px; object-fit: contain; }
.till-topbar-mid { font-size: 14px; color: #C9CACC; font-weight: 600; }
.till-topbar-right { display: flex; align-items: center; gap: 14px; }
.till-user { font-size: 13px; color: #C9CACC; }
.till-topbar .logout-link { font-size: 13px; color: #C9CACC; text-decoration: none; }
.till-topbar .logout-link:hover { color: #fff; }
.till-content { padding: 18px 22px 22px; }

/* ---------- Report tiles ---------- */
.report-menu { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.report-tile {
  background: #fff; border: 1px solid #E7E8E6; border-radius: 12px; padding: 20px;
  text-decoration: none; color: inherit; display: block;
}
.report-tile:hover { border-color: var(--brand-primary, #1FAA3C); }
.report-tile h3 { margin: 0 0 6px; font-size: 15px; }
.report-tile p { margin: 0; font-size: 13px; color: #6B6F73; }

/* ---------- Printable till receipt slip ---------- */
.receipt-slip { max-width: 320px; margin: 0 auto; background: #fff; border: 1px solid #E7E8E6; border-radius: 12px; padding: 24px 20px; font-family: 'JetBrains Mono', monospace; font-size: 12.5px; }
.receipt-slip-header { text-align: center; margin-bottom: 14px; }
.receipt-slip-header img { width: 40px; height: 40px; object-fit: contain; margin-bottom: 6px; }
.receipt-slip-header h3 { margin: 0; font-family: inherit; font-size: 14px; }
.receipt-slip-header p { margin: 2px 0 0; color: #6B6F73; }
.receipt-slip-meta { border-top: 1px dashed #C9CACC; border-bottom: 1px dashed #C9CACC; padding: 10px 0; margin-bottom: 10px; }
.receipt-slip-meta div { display: flex; justify-content: space-between; margin-bottom: 3px; }
.receipt-slip-meta span:first-child { color: #6B6F73; }
.receipt-line { margin-bottom: 6px; }
.receipt-line-name { font-weight: 700; }
.receipt-line-detail { display: flex; justify-content: space-between; color: #6B6F73; }
.receipt-slip-totals { border-top: 1px dashed #C9CACC; margin-top: 10px; padding-top: 10px; }
.receipt-slip-totals div { display: flex; justify-content: space-between; margin-bottom: 4px; }
.receipt-slip-totals .total { font-weight: 700; font-size: 15px; border-top: 1px dashed #C9CACC; padding-top: 6px; margin-top: 4px; }
.receipt-slip-footer { text-align: center; margin-top: 16px; color: #6B6F73; }
.receipt-actions { max-width:560px; margin:20px auto 0; }
.westony-receipt-signature { margin-top:18px; padding-top:12px; border-top:1px dashed #C9CACC; display:flex; align-items:center; justify-content:center; gap:8px; }
.westony-receipt-signature img { width:30px; height:30px; object-fit:contain; }
.westony-receipt-signature div { display:flex; flex-direction:column; text-align:left; font-family:'Inter',sans-serif; }
.westony-receipt-signature strong { font-size:11px; }
.westony-receipt-signature span { font-size:8.5px; color:#6B6F73; }

/* ---------- Premium visual finish ---------- */
html, body { background:radial-gradient(circle at 85% 5%, rgba(31,170,60,.08), transparent 30%), #F4F6F3; }
.sidebar { width:250px; background:linear-gradient(180deg, var(--brand-secondary,#101412) 0%, #070908 100%); padding:22px 17px; box-shadow:12px 0 35px rgba(8,18,11,.08); }
.sidebar-brand { padding:5px 7px 22px; }
.sidebar-logo { width:40px; height:40px; filter:drop-shadow(0 5px 12px rgba(0,0,0,.22)); }
.sidebar-nav a { padding:10px 12px; border-radius:9px; transition:.18s ease; }
.sidebar-nav a:hover { transform:translateX(3px); background:rgba(255,255,255,.08); }
.sidebar-nav a.active { box-shadow:0 8px 22px color-mix(in srgb, var(--brand-primary,#1FAA3C) 34%, transparent); }
.content { padding:38px 46px; }
.page-header h1 { font-size:27px; letter-spacing:-.035em; }
.page-header p.subtitle { font-size:14px; }
.card, .stat-card { border:1px solid rgba(21,38,27,.08); box-shadow:0 10px 35px rgba(17,38,23,.055); }
.card { border-radius:16px; padding:25px 27px; }
.stat-card { border-radius:15px; transition:transform .18s ease,box-shadow .18s ease; }
.stat-card:hover { transform:translateY(-2px); box-shadow:0 15px 38px rgba(17,38,23,.09); }
.btn { border-radius:10px; min-height:38px; transition:transform .15s ease,box-shadow .15s ease; }
.btn:hover { transform:translateY(-1px); }
.btn-primary { box-shadow:0 8px 20px color-mix(in srgb, var(--brand-primary,#1FAA3C) 25%, transparent); }
.form-row input[type=text], .form-row input[type=number], .form-row input[type=password], .form-row input[type=email], .form-row textarea, .form-row select { border-radius:10px; min-height:42px; transition:border .15s ease,box-shadow .15s ease; }
.form-row input:focus, .form-row textarea:focus, .form-row select:focus { outline:none; border-color:var(--brand-primary,#1FAA3C); box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-primary,#1FAA3C) 14%,transparent); }
th { background:#F8FAF7; }
.eyebrow { display:inline-block; color:var(--brand-primary,#1FAA3C); font-size:10px; font-weight:800; letter-spacing:.14em; margin-bottom:5px; }
.settings-hero-card { border-top:3px solid var(--brand-primary,#1FAA3C); }
.westony-platform-card { margin-top:13px; padding:10px; border-radius:11px; display:flex; gap:9px; align-items:center; background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.07); }
.westony-platform-card img { width:31px; height:31px; object-fit:contain; }
.westony-platform-card div { display:flex; flex-direction:column; min-width:0; }
.westony-platform-card strong { font-size:11px; color:#fff; }
.westony-platform-card a { color:#8E9691; text-decoration:none; font-size:9px; white-space:nowrap; }
@media (max-width:800px) { .sidebar{width:210px}.content{padding:25px 20px}.form-grid{grid-template-columns:1fr}.application-grid{grid-template-columns:1fr} }

/* ---------- Touch-first tablet launcher ---------- */
.tablet-shell { min-height:100vh; display:flex; flex-direction:column; background:linear-gradient(145deg,#F7FAF6 0%,#EEF4EE 48%,#F7F8F5 100%); }
.tablet-header { min-height:84px; padding:14px clamp(18px,4vw,50px); display:flex; align-items:center; justify-content:space-between; gap:20px; background:rgba(255,255,255,.92); border-bottom:1px solid rgba(19,52,29,.09); box-shadow:0 8px 30px rgba(17,45,25,.06); position:sticky; top:0; z-index:40; backdrop-filter:blur(16px); }
.tablet-brand { display:flex; align-items:center; gap:13px; text-decoration:none; min-width:0; }
.tablet-brand img { width:50px; height:50px; border-radius:13px; object-fit:contain; background:#fff; padding:4px; box-shadow:0 8px 22px rgba(15,40,22,.12); }
.tablet-brand img.vendiright-logo { width:150px; padding:0; background:#090f16; }
.till-topbar-brand img.vendiright-logo { width:145px; object-fit:contain; border-radius:8px; background:#090f16; }
.tablet-brand div,.tablet-user { display:flex; flex-direction:column; }
.tablet-brand strong { font-family:'Space Grotesk',sans-serif; font-size:18px; line-height:1.1; }
.tablet-brand span,.tablet-user span { color:#778079; font-size:11px; margin-top:3px; }
.tablet-header-right { display:flex; align-items:center; gap:16px; }
.tablet-user { text-align:right; }
.tablet-user strong { font-size:13px; }
.tablet-logout { min-height:46px; display:inline-flex; align-items:center; padding:0 17px; border-radius:12px; background:#172119; color:#fff; text-decoration:none; font-size:13px; font-weight:700; }
.app-launcher { width:min(1500px,100%); margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(135px,1fr)); gap:13px; padding:24px clamp(18px,4vw,50px) 8px; }
.app-button { min-height:112px; padding:15px 12px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:10px; text-align:center; text-decoration:none; border-radius:20px; background:rgba(255,255,255,.96); border:1px solid rgba(20,58,31,.09); box-shadow:0 10px 28px rgba(17,45,25,.075); color:#253029; transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease; touch-action:manipulation; }
.app-button:hover,.app-button:focus-visible { transform:translateY(-4px) scale(1.015); box-shadow:0 17px 35px rgba(17,45,25,.13); border-color:color-mix(in srgb,var(--brand-primary,#1FAA3C) 40%,white); outline:none; }
.app-button:active { transform:scale(.97); }
.app-button.active { color:#fff; background:linear-gradient(145deg,var(--brand-primary,#1FAA3C),color-mix(in srgb,var(--brand-primary,#1FAA3C) 72%,#07160B)); border-color:transparent; box-shadow:0 15px 34px color-mix(in srgb,var(--brand-primary,#1FAA3C) 30%,transparent); }
.app-icon { width:47px; height:47px; border-radius:15px; display:grid; place-items:center; background:color-mix(in srgb,var(--brand-primary,#1FAA3C) 12%,white); color:var(--brand-primary,#1FAA3C); font-family:'Space Grotesk',sans-serif; font-weight:800; font-size:13px; letter-spacing:-.03em; }
.app-button.active .app-icon { background:rgba(255,255,255,.18); color:#fff; }
.app-button strong { font-size:13px; line-height:1.15; }
.tablet-content { width:min(1500px,100%); margin:0 auto; flex:1; padding:24px clamp(18px,4vw,50px) 45px; }
.tablet-footer { min-height:58px; padding:11px 30px; display:flex; justify-content:center; align-items:center; gap:9px; color:#78817B; font-size:10px; background:rgba(255,255,255,.7); border-top:1px solid rgba(19,52,29,.07); }
.tablet-footer img { width:28px; height:28px; object-fit:contain; }
.tablet-footer strong { color:#253029; }
.tablet-content .btn { min-height:48px; padding:11px 20px; }
.tablet-content .btn-sm { min-height:40px; }
.tablet-content .form-row input,.tablet-content .form-row select,.tablet-content .form-row textarea { min-height:50px; font-size:16px; }
.tablet-content table td { padding-top:15px; padding-bottom:15px; }
@media (min-width:1200px) { .app-launcher { grid-template-columns:repeat(6,1fr); } }
@media (max-width:700px) { .tablet-header{min-height:70px;padding:10px 14px}.tablet-brand img{width:42px;height:42px}.tablet-brand span,.tablet-user{display:none}.tablet-header-right{gap:8px}.tablet-logout{min-height:42px;padding:0 13px}.app-launcher{grid-template-columns:repeat(2,1fr);padding:15px 13px 4px;gap:10px}.app-button{min-height:100px;border-radius:16px}.tablet-content{padding:18px 13px 35px}.tablet-footer span{display:none}.page-header{align-items:flex-start;gap:12px;flex-direction:column}.page-header .btn{width:100%;justify-content:center}.card{padding:19px 16px;overflow-x:auto}.stat-grid{grid-template-columns:repeat(2,1fr)} }
.category-chip { min-height:46px; display:inline-flex; align-items:center; padding:0 16px; background:#EEF2ED; color:#2D3730; text-decoration:none; font-size:13px; font-weight:700; border-radius:13px; }
.category-chip.active { background:var(--brand-primary,#1FAA3C); color:#fff; }
.quick-stock-card summary { cursor:pointer; list-style:none; display:flex; flex-direction:column; color:var(--brand-primary,#1FAA3C); font-weight:800; }
.quick-stock-card summary::-webkit-details-marker { display:none; }
.quick-stock-card summary small { color:#7A827C; font-weight:500; margin-top:3px; }
.quick-stock-card[open] summary { padding-bottom:18px; margin-bottom:18px; border-bottom:1px solid #E6EAE5; }
.quick-stock-title { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:19px; padding-bottom:15px; border-bottom:1px solid #E6EAE5; }
.quick-stock-title h3 { margin:0 0 3px; }
.quick-stock-title p { margin:0; }
.quick-stock-card[hidden] { display:none; }
.audit-filter-form { display:grid; grid-template-columns:1fr 1fr 1.5fr auto auto; gap:11px; align-items:end; }
.audit-filter-form .form-row { margin:0; }
.audit-section-title { margin:28px 0 14px; }
.audit-section-title h2 { margin:1px 0 3px; }
.audit-section-title p { margin:0; color:#778079; }
.receiving-audit-batch { padding:0; overflow:hidden; }
.batch-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 23px; background:linear-gradient(120deg,#F8FBF7,#EFF5EF); border-bottom:1px solid #DFE7DF; }
.batch-header h3 { margin:4px 0 2px; }
.batch-header p { margin:0; color:#768078; font-size:12px; }
.batch-number { color:var(--brand-primary,#1FAA3C); font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:800; }
.batch-summary { display:flex; align-items:center; gap:16px; }
.batch-summary strong { font-family:'Space Grotesk',sans-serif; font-size:23px; }
.receiving-audit-batch table { margin:0; }
.batch-total-row td { background:#F8FAF7; font-weight:800; }
.empty-audit { text-align:center; color:#78817B; padding:35px; }
@media(max-width:800px){.audit-filter-form{grid-template-columns:1fr 1fr}.audit-filter-form .form-row:nth-child(3){grid-column:1/-1}.batch-header{align-items:flex-start;flex-direction:column}.batch-summary{width:100%;justify-content:space-between}}
.receiving-balance-panel { margin:18px 0 4px auto; width:min(430px,100%); padding:15px 17px; background:#F5F8F4; border:1px solid #E0E8DF; border-radius:14px; }
.receiving-balance-panel div { display:flex; justify-content:space-between; padding:6px 0; color:#667068; }
.receiving-balance-panel strong { color:#202A23; }
.receiving-balance-panel .projected { margin-top:5px; padding-top:11px; border-top:1px solid #D7E0D6; color:#1B4427; font-weight:800; font-size:16px; }
.receiving-balance-panel .projected strong { color:var(--brand-primary,#1FAA3C); font-size:19px; }
@media print {
  .receipt-slip { border: none; max-width: 100%; padding: 0; }
}

/* ---------- POS 2026: modern touchscreen workspace ---------- */
.pos-mode { background:radial-gradient(circle at 12% 0%,#f5faf3 0,#eef1ed 34%,#e8ebe7 100%); overflow:hidden; }
.pos-mode .app-launcher { display:none; }
.pos-mode .tablet-content { padding:16px 18px 18px; max-width:none; }
.pos-mode .tablet-header { min-height:66px; padding:9px 20px; }
.pos-wrap { grid-template-columns:minmax(0,1fr) minmax(390px,34vw); gap:16px; height:calc(100vh - 100px); }
@media(min-width:821px){
  .focused-menu-mode.pos-mode .pos-wrap{height:calc(100dvh - 170px);min-height:0}
  .focused-menu-mode.pos-mode .pos-cart{height:100%;min-height:0}
  .focused-menu-mode.pos-mode .pos-cart-items{min-height:0}
}
.pos-main { background:rgba(255,255,255,.55); border:1px solid rgba(255,255,255,.9); border-radius:24px; padding:18px; box-shadow:0 18px 50px rgba(25,40,29,.07); backdrop-filter:blur(14px); }
.pos-workspace-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.pos-workspace-heading h1 { margin:2px 0 1px; font-size:25px; letter-spacing:-.7px; }
.pos-workspace-heading p { margin:0; color:#758078; font-size:13px; }
.pos-live-pill { display:flex; align-items:center; gap:8px; padding:9px 13px; background:#fff; border:1px solid #e2e8e1; border-radius:999px; color:#526058; font-size:12px; font-weight:800; box-shadow:0 5px 18px rgba(20,42,25,.06); }
.pos-live-pill span { width:9px; height:9px; border-radius:50%; background:var(--brand-primary,#1FAA3C); box-shadow:0 0 0 4px color-mix(in srgb,var(--brand-primary,#1FAA3C) 16%,transparent); }
.pos-scan-box { position:relative; margin-bottom:14px; }
.pos-scan-box input { height:62px; padding:0 92px 0 54px; border:1px solid #dce3db; border-radius:17px; font-family:inherit; font-size:17px; font-weight:600; box-shadow:0 9px 28px rgba(25,45,30,.07); }
.pos-scan-box input:focus { border-color:var(--brand-primary,#1FAA3C); box-shadow:0 0 0 4px color-mix(in srgb,var(--brand-primary,#1FAA3C) 14%,transparent),0 10px 28px rgba(25,45,30,.07); }
.pos-search-icon { position:absolute; z-index:2; left:18px; top:13px; font-size:30px; color:#667269; line-height:34px; }
.pos-scan-hint { position:absolute; right:15px; top:20px; z-index:2; font-size:10px; letter-spacing:1px; font-weight:900; color:#79847c; background:#edf1ec; border-radius:7px; padding:5px 7px; }
.camera-scan-btn { min-height:44px; padding:0 15px; border:0; border-radius:11px; background:#172019; color:#fff; font:800 12px inherit; cursor:pointer; white-space:nowrap; box-shadow:0 5px 14px rgba(16,31,20,.15); }
.camera-scan-btn:active { transform:scale(.97); }
.barcode-input-group { display:flex; align-items:stretch; gap:8px; }
.barcode-input-group input { min-width:0; flex:1; }
.pos-camera-btn { position:absolute; z-index:3; right:9px; top:9px; height:44px; background:var(--brand-primary,#1FAA3C); }
.pos-scan-box input { padding-right:125px; }
.barcode-camera-overlay { display:none; position:fixed; inset:0; z-index:200; align-items:center; justify-content:center; padding:18px; background:rgba(8,15,10,.76); backdrop-filter:blur(10px); }
.barcode-camera-overlay.show { display:flex; }
.barcode-camera-card { width:min(560px,100%); padding:20px; border-radius:25px; background:#fff; box-shadow:0 30px 100px rgba(0,0,0,.4); }
.barcode-camera-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.barcode-camera-head h2 { margin:3px 0 0; }
.barcode-camera-close { width:46px; height:46px; border:0; border-radius:14px; background:#edf1ed; color:#263029; font-size:28px; cursor:pointer; }
.barcode-video-wrap { position:relative; aspect-ratio:4/3; overflow:hidden; border-radius:19px; background:#101713; }
.barcode-video-wrap video { width:100%; height:100%; object-fit:cover; }
.barcode-scan-frame { position:absolute; inset:19% 9%; border:3px solid rgba(255,255,255,.9); border-radius:16px; box-shadow:0 0 0 999px rgba(0,0,0,.28); }
.barcode-scan-frame span { position:absolute; left:5%; right:5%; top:50%; height:2px; background:#ff4b4b; box-shadow:0 0 10px #ff4b4b; animation:barcode-scan-line 1.8s ease-in-out infinite; }
@keyframes barcode-scan-line { 0%,100%{transform:translateY(-65px)} 50%{transform:translateY(65px)} }
#barcodeCameraStatus { min-height:20px; margin:14px 2px; color:#647068; font-weight:600; text-align:center; }
#barcodeCameraStatus a { color:var(--brand-primary,#1FAA3C); font-weight:900; }
.mobile-camera-setup { width:min(620px,calc(100% - 28px)); margin:28px auto; padding:28px; border-radius:25px; background:#fff; box-shadow:0 25px 80px rgba(0,0,0,.25); }
.mobile-camera-setup > img { width:68px; height:68px; object-fit:contain; margin-bottom:14px; }
.mobile-camera-setup h1 { margin:5px 0 8px; }
.mobile-camera-setup > p { color:#667169; line-height:1.55; }
.mobile-setup-step { display:grid; grid-template-columns:42px 1fr; gap:13px; padding:17px 0; border-top:1px solid #e7ebe6; }
.mobile-setup-step > strong { display:flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:12px; background:var(--brand-primary,#1FAA3C); color:#fff; font-size:18px; }
.mobile-setup-step h3 { margin:5px 0 7px; }
.mobile-setup-step p { margin:5px 0 11px; color:#657068; line-height:1.5; }
.mobile-setup-step code { display:block; margin-top:9px; padding:10px; border-radius:9px; background:#edf1ed; text-align:center; word-break:break-all; }
.mobile-setup-note { padding:12px; border-radius:10px; background:#fff8df; color:#765c12 !important; font-size:12px; }
@media(max-width:600px){.barcode-input-group{flex-direction:column}.camera-scan-btn{min-height:50px}.pos-camera-btn{display:block;top:8px;right:8px}.pos-scan-box input{padding-right:118px}.barcode-camera-card{padding:14px;border-radius:20px}.barcode-video-wrap{aspect-ratio:3/4}}
.pos-results { grid-template-columns:repeat(auto-fill,minmax(165px,1fr)); gap:13px; padding:1px 3px 16px; }
.pos-product-tile { min-height:190px; padding:11px; border:0; border-radius:19px; box-shadow:0 7px 24px rgba(26,45,31,.08); text-align:left; overflow:hidden; }
.pos-product-tile:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(26,45,31,.13); }
.pos-product-tile:active { transform:scale(.97); }
.pos-product-tile img,.pos-product-tile .tile-noimg { height:104px; border-radius:13px; margin-bottom:10px; }
.pos-product-tile .tile-noimg { background:linear-gradient(145deg,#edf4eb,#dfe9df); color:var(--brand-primary,#1FAA3C); font-size:36px; }
.pos-product-tile .tile-name { font-size:14px; padding:0 3px; }
.pos-product-tile .tile-price { font-size:17px; padding:0 3px; }
.pos-product-tile .tile-stock { padding:0 3px 2px; }
.pos-cart { border:0; border-radius:24px; box-shadow:0 18px 55px rgba(20,38,25,.14); }
.pos-cart-header { min-height:72px; padding:14px 17px; background:linear-gradient(135deg,#172019,#26342a); color:#fff; border:0; gap:10px; }
.pos-cart-header > div:first-child { display:flex; flex-direction:column; }
.pos-cart-header .eyebrow { color:#8ea295; }
.pos-cart-header strong { font-size:18px; }
.pos-cart-header .badge { background:rgba(255,255,255,.12); color:#fff; }
.pos-cart-header .btn { min-height:38px; background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.12); }
.pos-cart-items { padding:7px 14px; background:#fbfcfb; }
.cart-empty { margin:55px 18px; padding:45px 15px; border:2px dashed #e0e7df; border-radius:18px; }
.cart-line { min-height:72px; gap:9px; padding:10px 4px; }
.cart-line .cart-name { font-size:13px; }
.qty-btn { width:40px; height:40px; border:0; border-radius:12px; background:#edf1ec; font-size:21px; }
.cart-line .cart-remove { display:flex; align-items:center; justify-content:center; min-width:38px; min-height:38px; border-radius:11px; background:#fff0f0; font-size:17px; }
.pos-cart-totals { position:relative; padding:16px 18px 13px; background:#fff; }
.pos-clear-sale { position:absolute; right:17px; top:14px; border:0; background:#fff0f0; color:#b73c3c; border-radius:8px; padding:7px 10px; font-weight:800; cursor:pointer; }
.pos-cart-totals .row { max-width:65%; font-size:13px; }
.pos-cart-totals .row.total { max-width:none; padding-top:9px; border-top:1px solid #e8ece7; font-size:26px; }
.pos-cart-footer { padding:13px 17px 17px; background:#f7f9f7; }
.pay-method-row button { min-height:62px; border:0; border-radius:14px; background:#fff; box-shadow:inset 0 0 0 1px #dce3db; font-size:14px; }
.pay-method-row button.selected { background:#172019; box-shadow:0 7px 18px rgba(18,31,21,.18); }
.btn-charge { min-height:66px; padding:0 20px; border-radius:16px; display:flex; align-items:center; justify-content:space-between; font-size:18px; box-shadow:0 10px 25px color-mix(in srgb,var(--brand-primary,#1FAA3C) 28%,transparent); }
.btn-charge strong { font-size:22px; }
.pos-overlay { backdrop-filter:blur(8px); background:rgba(10,18,12,.65); }
.pos-overlay-card { width:min(420px,calc(100vw - 28px)); border-radius:25px; box-shadow:0 28px 90px rgba(0,0,0,.28); }
.keypad .key,.note-btn { min-height:58px; font-size:19px; border-radius:14px; }
@media(max-width:1100px){.pos-wrap{grid-template-columns:minmax(0,1fr) 390px}.pos-results{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.pos-workspace-heading p{display:none}}
@media(max-width:820px){
  .pos-mode{overflow:auto;padding-bottom:env(safe-area-inset-bottom)}
  .pos-mode .tablet-content,.till-content{padding:10px}
  .pos-wrap{display:flex;height:auto;min-height:calc(100vh - 90px);flex-direction:column;gap:12px}
  .pos-main{min-height:0;padding:12px;border-radius:19px}
  .pos-results{max-height:38vh;min-height:180px}
  .pos-cart{min-height:0;overflow:visible;border-radius:19px}
  .pos-cart-items{min-height:110px;max-height:34vh;overflow-y:auto}
  .pos-cart-footer{position:sticky;bottom:0;z-index:12;padding-bottom:calc(17px + env(safe-area-inset-bottom));border-radius:0 0 19px 19px;box-shadow:0 -10px 24px rgba(20,38,25,.12)}
  .pos-workspace-heading h1{font-size:21px}
  .pos-live-pill{display:none}
  .pos-scan-box input{height:58px}
  .pay-method-row button{min-height:58px}
  .btn-charge{min-height:62px}
  .pos-overlay{align-items:flex-start;overflow-y:auto;padding:10px}
  .pos-overlay-card{width:min(420px,100%);max-height:none;overflow:visible;margin:auto;padding:22px 18px calc(20px + env(safe-area-inset-bottom))}
  .cash-modal-card .form-actions{position:sticky;bottom:0;z-index:3;margin-left:-18px;margin-right:-18px;margin-bottom:calc(-20px - env(safe-area-inset-bottom));padding:12px 18px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #E1E6E0;box-shadow:0 -8px 20px rgba(20,38,25,.1)}
}
@media(max-width:480px){
  .pos-cart-header{align-items:flex-start;flex-direction:column}
  .pos-cart-header>div:last-child{width:100%;flex-wrap:wrap}
  .pay-method-row{gap:5px}
  .pay-method-row button{padding:10px 4px;font-size:12px}
  .pos-cart-totals .row.total{font-size:22px}
}
.print-header { display: none; }
.report-brand-header { align-items:center; gap:14px; }
.report-brand-header img { width:58px; height:58px; object-fit:contain; }
.report-filter { display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; }
.report-filter .form-row { margin-bottom:0; }
.report-table-wrap { overflow-x:auto; }
@media print {
  .sidebar, .till-topbar, .no-print, .flash-stack { display: none !important; }
  .shell, .content, .till-content { display: block !important; padding: 0 !important; margin: 0 !important; width: 100% !important; }
  body { background: #fff !important; }
  .print-header { display: block; margin-bottom: 16px; }
  .print-header.report-brand-header { display:flex; }
  .print-header h2 { margin: 0 0 2px; }
  .print-header p { margin: 0; color: #555; font-size: 13px; }
  .card { border: none !important; box-shadow: none !important; padding: 0 !important; }
  .stat-grid { break-inside: avoid; }
}
.page-header-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.focused-menu-bar { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:12px clamp(16px,3vw,34px); background:#fff; border-bottom:1px solid #E1E6E0; box-shadow:0 5px 18px rgba(20,38,25,.05); }
.focused-menu-back { min-height:44px; display:inline-flex; align-items:center; gap:9px; padding:0 15px; border-radius:11px; background:#EDF2ED; color:#243029; text-decoration:none; font-size:13px; font-weight:850; }
.focused-menu-back span { font-size:20px; line-height:1; }
.focused-menu-back:hover { background:#E2EAE2; }
.focused-menu-name { color:#6B756D; font-size:13px; font-weight:800; }
.promotion-summary{display:flex;gap:12px;margin-bottom:16px}.promotion-summary>div{min-width:150px;padding:15px 18px;border-radius:14px;background:#17351F;color:#fff;display:flex;align-items:baseline;gap:9px}.promotion-summary strong{font-size:27px}.promotion-summary span{color:#C8D8CC;font-size:12px;font-weight:800}.promotion-list{display:flex;flex-direction:column;gap:12px}.promotion-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:17px;border:1px solid #E0E6DF;border-radius:15px;background:#fff}.promotion-disabled{opacity:.65;background:#F7F8F7}.promotion-card-main{display:flex;align-items:center;gap:14px}.promotion-icon{width:52px;height:52px;display:flex;align-items:center;justify-content:center;border-radius:15px;background:#E5F7E8;color:var(--brand-primary,#1FAA3C);font-size:23px;font-weight:900}.promotion-title-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.promotion-title-row h3{margin:0}.promotion-card p{margin:5px 0;color:#49554C}.promotion-card small{color:#7A847C}.promotion-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.promotion-actions form{margin:0}.promotion-rule-box{margin:15px 0;padding:19px;border:1px solid #DCE8DC;border-radius:15px;background:linear-gradient(145deg,#F6FAF5,#EDF5ED)}.promotion-rule-box h3{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:6px 0}.promotion-rule-box h3 input{width:110px;padding:9px;border:1px solid #CAD8CA;border-radius:9px;font-size:18px;font-weight:800;text-align:center}.promotion-rule-box p{margin:0;color:#667168}.promotion-enable{display:flex;align-items:flex-start;gap:10px;padding:15px;border:1px solid #DDE5DC;border-radius:13px;cursor:pointer}.promotion-enable input{width:20px;height:20px;margin-top:2px}.promotion-enable span{display:flex;flex-direction:column}.promotion-enable small{margin-top:3px;color:#6F7971}.tile-promotion{margin:6px 3px 1px;padding:5px 7px;border-radius:7px;background:#E8F8EA;color:#19742C;font-size:10px;font-weight:900;line-height:1.2}.cart-promotion{display:block;margin-top:4px;color:#16802E;font-weight:800;line-height:1.25}.cart-line .cart-name{min-width:0}.cart-line{align-items:flex-start}@media(max-width:720px){.promotion-card{align-items:stretch;flex-direction:column}.promotion-actions{width:100%}.promotion-actions .btn{flex:1}.promotion-summary>div{min-width:0;flex:1}.promotion-rule-box h3 input{width:90px}}
.stocktake-progress { height:9px; background:#E4E9E3; border-radius:99px; overflow:hidden; margin:-8px 0 18px; }
.stocktake-progress span { display:block; height:100%; background:var(--brand-primary,#1FAA3C); transition:width .25s ease; }
.stocktake-scan-card { border-top:4px solid var(--brand-primary,#1FAA3C); }
.stocktake-scan-card h2,.stocktake-table-head h2 { margin:3px 0 5px; }
.stocktake-scan-row { display:grid; grid-template-columns:minmax(220px,1fr) 90px auto auto; gap:9px; margin-top:18px; }
.stocktake-scan-row input,.stocktake-table-head input { min-height:48px; padding:10px 13px; border:1px solid #D8D9D6; border-radius:10px; font-size:16px; }
.stocktake-scan-message { min-height:24px; margin-top:12px; font-weight:700; color:#536057; }
.stocktake-scan-message.success,.stock-over { color:#147A2C; }
.stocktake-scan-message.error,.stock-under { color:#B42318; }
.stocktake-table-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px; }
.stocktake-table-head input { min-height:42px; width:min(340px,100%); font-size:14px; }
.stocktake-table-wrap { overflow-x:auto; }
.stocktake-count-form { display:flex; gap:5px; align-items:center; }
.stocktake-count-form input { width:100px; padding:7px; border:1px solid #D8D9D6; border-radius:7px; }
.stocktake-just-scanned { background:#E9F8EC!important; }
.stocktake-complete-bar { position:sticky; bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 18px; border-radius:13px; background:#17351F; color:#fff; box-shadow:0 10px 30px rgba(0,0,0,.2); z-index:5; }
.stocktake-complete-bar div { display:flex; flex-direction:column; gap:2px; }
.stocktake-complete-bar span { color:#C9D8CC; font-size:13px; }
.stocktake-report-filters { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px; }
.stocktake-empty { text-align:center; color:#7A827C; padding:30px!important; }
.stocktake-stats .stat-card strong { font-size:30px; }
@media(max-width:760px){.stocktake-scan-row{grid-template-columns:1fr 80px}.stocktake-scan-row .camera-scan-btn,.stocktake-scan-row .btn{width:100%}.stocktake-table-head{align-items:stretch;flex-direction:column}.stocktake-table-head input{width:100%}.stocktake-complete-bar{align-items:stretch;flex-direction:column}.stocktake-complete-bar .btn{width:100%}}
@media(max-width:700px){.focused-menu-bar{padding:10px 13px}.focused-menu-name{display:none}.focused-menu-back{width:100%;justify-content:center}}
@media print{
  @page { margin:12mm; }
  .tablet-header,.app-launcher,.focused-menu-bar,.tablet-footer,.till-topbar,.flash-stack,.no-print,.btn,.stocktake-report-filters,.barcode-camera-overlay { display:none!important; }
  html,body,.tablet-shell,.tablet-content,.till-content { display:block!important; width:100%!important; min-height:0!important; margin:0!important; padding:0!important; background:#fff!important; box-shadow:none!important; }
  .tablet-content { max-width:none!important; }
  .print-header { display:block!important; }
  .print-header.report-brand-header { display:flex!important; }
  .card { border:0!important; box-shadow:none!important; padding:0!important; background:#fff!important; }
  table { width:100%!important; }
  tr,.stat-grid,.stat-card { break-inside:avoid; }
}
.ai-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:16px;align-items:stretch}.ai-sidebar{padding:12px;max-height:680px;overflow-y:auto}.ai-sidebar h3{padding:4px 8px}.ai-sidebar a{display:flex;flex-direction:column;gap:4px;padding:11px;border-radius:10px;color:#26322A;text-decoration:none}.ai-sidebar a:hover,.ai-sidebar a.active{background:#E9F4EA}.ai-sidebar small{color:#758078}.ai-chat-card{padding:0;overflow:hidden;display:flex;flex-direction:column;min-height:600px}.ai-messages{padding:22px;display:flex;flex-direction:column;gap:14px;overflow-y:auto;flex:1;max-height:620px}.ai-message{max-width:82%;padding:13px 15px;border-radius:16px;background:#F0F3F0}.ai-message-user{align-self:flex-end;background:#17351F;color:#fff}.ai-message-label{font-size:11px;font-weight:900;opacity:.7;margin-bottom:5px}.ai-message-body{white-space:pre-wrap;line-height:1.5}.ai-compose{display:grid;grid-template-columns:1fr auto;gap:10px;padding:14px;border-top:1px solid #E0E6E0;background:#FAFBFA}.ai-compose textarea,.ai-change-form textarea{width:100%;resize:vertical;padding:12px;border:1px solid #CDD6CE;border-radius:11px;font:inherit}.ai-compose .btn{align-self:end}.ai-empty{text-align:center;margin:auto;color:#68736B}.ai-empty span{display:inline-flex;width:58px;height:58px;align-items:center;justify-content:center;border-radius:18px;background:#17351F;color:#fff;font-size:24px;font-weight:900}.ai-setup-warning{border-left:4px solid #18B943}.ai-setup-warning p{margin:6px 0 12px}.ai-change-form{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}.ai-change-list{margin-top:18px;display:flex;flex-direction:column;gap:10px}.ai-change-list>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px;border:1px solid #E0E6E0;border-radius:11px}.ai-change-list p{margin:0;white-space:pre-wrap}.ai-change-list form{display:flex;gap:7px}.ai-change-list select{padding:8px;border:1px solid #CDD6CE;border-radius:8px}@media(max-width:800px){.ai-layout{grid-template-columns:1fr}.ai-sidebar{max-height:180px}.ai-chat-card{min-height:540px}.ai-message{max-width:94%}.ai-compose,.ai-change-form{grid-template-columns:1fr}.ai-change-list>div{align-items:stretch;flex-direction:column}.ai-change-list form{width:100%}.ai-change-list select{flex:1}}