:root{--bg:#f6f7ef;--card:#fff;--text:#14343b;--muted:#6c8084;--teal:#16a7a2;--teal2:#77cfc8;--mint:#9bd8ad;--gold:#f4a261;--line:#d8e7e4;--shadow:0 16px 35px rgba(19,52,59,.08);--radius:22px}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}.app{height:100vh;display:flex;overflow:hidden}.sidebar{width:280px;background:linear-gradient(180deg,#075e66,#0a7771);color:#fff;padding:26px 20px;display:flex;flex-direction:column;gap:22px}.brand{display:flex;align-items:center;gap:14px}.logo{width:58px;height:58px;border-radius:20px;background:linear-gradient(135deg,#eaf7ef,#f0ad4e);display:grid;place-items:center}.logo svg{width:32px}.brand h1{font-size:18px;margin:0}.brand p{margin:2px 0 0;opacity:.8;font-size:13px}.sidebar nav{display:grid;gap:8px}.nav-btn{border:0;background:transparent;color:white;text-align:left;padding:14px 16px;border-radius:16px;display:flex;gap:12px;align-items:center;font-size:15px;cursor:pointer}.nav-btn:hover,.nav-btn.active{background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}.nav-btn svg{width:19px}.operator{margin-top:auto;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:16px;display:grid;gap:3px}.operator small,.operator span{opacity:.8}.main{flex:1;overflow:auto;padding:24px}.topbar{min-height:92px;background:rgba(255,255,255,.76);backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:26px;display:flex;align-items:center;justify-content:space-between;padding:18px 24px;margin-bottom:22px;box-shadow:var(--shadow)}.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:var(--teal);font-weight:800;font-size:12px;margin:0 0 7px}.topbar h2,.panel h3{margin:0}.top-actions,.action-row{display:flex;align-items:center;gap:10px}.icon-btn{width:44px;height:44px;border:0;border-radius:14px;background:#e9f6f4;color:#0d7271;display:grid;place-items:center;cursor:pointer}.pill{height:44px;border:0;border-radius:16px;background:#edf8f7;color:#0d7271;padding:0 18px;font-weight:700;display:flex;gap:8px;align-items:center}.page{display:none}.page.active{display:block}.panel{background:rgba(255,255,255,.82);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.soft-icon{width:44px;height:44px;border-radius:14px;background:#e8f7f5;color:var(--teal);display:grid;place-items:center}.soft-icon svg{width:23px}.pos-grid{display:grid;grid-template-columns:minmax(560px,1fr) 420px;gap:18px;height:calc(100vh - 145px)}.menu-panel,.cart-panel{min-height:0;display:flex;flex-direction:column}.filters{display:grid;grid-template-columns:1fr 170px;gap:10px;margin-bottom:14px}.search{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:0 12px}.search input,.filters select,.totals input,.totals select,.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);background:#fff;border-radius:14px;padding:12px 14px;font:inherit;color:var(--text)}.search input{border:0;outline:0}.menu-grid{overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;padding-right:4px}.menu-card{border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg,#fff,#f5faf8);padding:16px;min-height:116px;cursor:pointer;position:relative;overflow:hidden;transition:.15s}.menu-card:after{content:"";position:absolute;right:-16px;top:-16px;width:64px;height:64px;border-radius:50%;background:rgba(22,167,162,.12)}.menu-card:hover{transform:translateY(-2px);border-color:var(--teal);box-shadow:0 14px 24px rgba(22,167,162,.13)}.tag{font-size:11px;color:#537078;font-weight:800;text-transform:uppercase}.menu-card h4{margin:10px 0 8px;font-size:15px;line-height:1.2}.price{color:#dc6b20;font-size:21px;font-weight:900}.cart-box{height:315px;min-height:315px;max-height:315px;overflow:auto;border:1px solid var(--line);border-radius:18px;background:#fff;position:relative}.cart-table{width:100%;border-collapse:collapse;font-size:13px}.cart-table th{position:sticky;top:0;background:#f4faf8;color:var(--muted);font-size:11px;text-align:left;padding:10px;z-index:2}.cart-table td{border-bottom:1px solid #edf3f1;padding:8px 10px;vertical-align:middle}.qty{display:inline-flex;align-items:center;gap:5px}.mini{width:25px;height:25px;border-radius:9px;border:0;background:#eaf7f5;color:#0b7775;font-weight:900;cursor:pointer}.empty-cart{display:grid;place-items:center;height:270px;color:var(--muted);font-size:13px}.totals{padding-top:14px;display:grid;gap:10px}.totals>div:not(.action-row){display:flex;justify-content:space-between}.grand{background:linear-gradient(135deg,#e9f7f5,#fff0e1);padding:16px;border-radius:17px;font-size:19px}.grand b{font-size:26px;color:#dc6b20}.primary,.ghost{border:0;border-radius:14px;padding:12px 16px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.primary{background:linear-gradient(135deg,var(--teal),#67c7c0);color:white}.ghost{background:#eef6f4;color:#0b7775}.primary.small,.ghost.small{padding:8px 11px;font-size:12px}.cash-change-box{display:grid;gap:7px;border:1px solid var(--line);background:rgba(255,255,255,.58);border-radius:16px;padding:12px}.cash-change-box label{font-size:12px;color:var(--muted);font-weight:800}.cash-change-box input{width:100%;border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;font:inherit;color:var(--text)}.cash-change-box div{display:flex;justify-content:space-between;align-items:center;font-size:14px}.cash-change-box b{font-size:18px;color:#16a7a2}.dark .cash-change-box,.dark .cash-change-box input{background:#0e2a31;color:var(--text);border-color:var(--line)}.hidden{display:none!important}.cards{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:14px;margin-bottom:18px}.metric{border-radius:22px;padding:18px;min-height:116px;background:linear-gradient(135deg,#fff,#e8f7f5);border:1px solid var(--line);box-shadow:var(--shadow);position:relative;overflow:hidden}.metric.gold{background:linear-gradient(135deg,#f3a15e,#ffd16d);color:white}.metric.mint{background:linear-gradient(135deg,#8dd3a2,#91ddd5);color:white}.metric svg{width:22px;opacity:.75}.metric small{display:block;margin:10px 0 6px;color:inherit;opacity:.75}.metric b{font-size:28px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.wide{grid-column:1/-1}.chart{height:230px;display:flex;align-items:end;gap:12px;border-left:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px;margin-top:12px}.bar{flex:1;min-width:30px;background:linear-gradient(180deg,var(--teal2),var(--teal));border-radius:12px 12px 0 0;position:relative}.bar.gold{background:linear-gradient(180deg,#ffd16d,#f3a15e)}.bar span{position:absolute;bottom:-28px;left:50%;transform:translateX(-50%);font-size:11px;color:var(--muted);white-space:nowrap}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px;border-bottom:1px solid #edf3f1;text-align:left;font-size:14px}.table th{color:var(--muted);font-size:12px;background:#f7fbfa}.tabs{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}.tab{border:0;border-radius:999px;background:#fff;padding:10px 16px;color:#0b7775;font-weight:800;cursor:pointer}.tab.active{background:var(--teal);color:white}.staff-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:15px}.staff-card{text-align:center}.avatar{width:94px;height:94px;border-radius:50%;background:linear-gradient(135deg,#9bd8ad,#76cbc8);display:grid;place-items:center;margin:6px auto 12px;color:white;font-size:28px;font-weight:900;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:grid;gap:7px;margin-bottom:12px}.field label{font-size:13px;color:var(--muted)}.settings-layout{display:grid;grid-template-columns:280px 1fr;gap:20px}.settings-menu{display:grid;gap:10px;align-content:start}.settings-menu strong{color:var(--teal);margin-top:8px}.settings-menu button{border:0;background:#fff;border-radius:999px;padding:14px 18px;text-align:left;color:#11434b;box-shadow:var(--shadow);cursor:pointer}.settings-menu button.active{background:var(--teal);color:white}.notice{background:#fff8e6;border:1px solid #f5c775;color:#825600;border-radius:14px;padding:12px;margin-bottom:14px}.modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:grid;place-items:center;z-index:10}.modal-card{background:white;border-radius:18px;padding:22px;max-width:520px;width:min(92vw,520px);position:relative;max-height:90vh;overflow:auto}.close{position:absolute;right:14px;top:10px;border:0;background:transparent;font-size:28px;color:#999;cursor:pointer}.receipt-preview{font-family:"Courier New",monospace;font-size:12px;line-height:1.45;width:260px;margin:auto;border:1px solid #ddd;padding:12px;color:#555;background:white}.center{text-align:center}.r-row{display:flex;justify-content:space-between;gap:8px}.dash{border-top:1px dashed #999;margin:8px 0}.receipt-print{display:none}svg{width:18px;height:18px;stroke-width:2;stroke:currentColor;fill:none;stroke-linecap:round;stroke-linejoin:round}.dark{--bg:#071c22;--card:#0e2a31;--text:#effffc;--muted:#a7c2c4;--line:#254950}.dark .panel,.dark .topbar,.dark .metric,.dark .settings-menu button,.dark .cart-box,.dark input,.dark select,.dark textarea{background:#0e2a31;color:var(--text);border-color:var(--line)}.dark .menu-card{background:linear-gradient(135deg,#102c34,#0a2228)}@media(max-width:1100px){.pos-grid{grid-template-columns:1fr;height:auto}.sidebar{width:230px}.cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:780px){.app{display:block;overflow:auto}.sidebar{width:auto}.main{padding:12px}.pos-grid,.grid2,.two,.settings-layout{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.cart-box{height:280px}.topbar{display:block}}@media print{body>*:not(.receipt-print){display:none!important}.receipt-print{display:block!important;width:50mm;min-height:80mm;margin:0;padding:2mm;font-family:"Courier New",monospace;font-size:10px;line-height:1.25;color:#000;background:#fff}.receipt-print h2{font-size:11px;text-align:center;margin:0 0 2mm}.receipt-print table{width:100%;border-collapse:collapse}.receipt-print td{vertical-align:top;padding:0}.receipt-print hr{border:0;border-top:1px dashed #000;margin:2mm 0}.receipt-print .center{text-align:center}.receipt-print .total{font-weight:900;font-size:11px}@page{size:50mm 80mm;margin:0}}


/* V1.7 polish fixes */
.topbar .eyebrow{display:none!important}
.receipt-preview h2,.receipt-print h2,.receipt-business{text-align:center!important;display:block;width:100%;font-weight:900;margin:0 0 8px!important;}
.cash-change-box{grid-template-columns:1fr!important;gap:10px!important;align-items:stretch!important;}
.cash-change-box label{display:block;text-align:left;}
.cash-change-box input{min-width:0;}
.cash-change-box div{display:grid!important;grid-template-columns:1fr auto;align-items:center;gap:8px;}
.action-row .primary{flex:1;}
.settings-form{display:grid;gap:14px;max-width:860px;}
.save-settings-btn{justify-self:start;position:static!important;margin-top:6px;}
.checkline{display:flex;align-items:center;gap:10px;margin:12px 0;font-weight:700;}
.checkline input{width:auto!important;}
.inline-input{width:100%;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:#fff;color:var(--text);}
.low-stock{border-color:#f2a43a;background:#fff4dc;color:#6f4300;}
.report-filter{display:grid;grid-template-columns:1fr 240px 240px;gap:14px;align-items:end;margin-bottom:16px;}
.report-filter label{display:grid;gap:6px;font-size:12px;color:var(--muted);font-weight:800;}
.report-filter input{border:1px solid var(--line);border-radius:12px;padding:12px;background:#fff;color:var(--text);font:inherit;}
.muted{color:var(--muted);font-size:13px;margin-top:4px;}
.dark .table th,.dark .table td{border-color:var(--line)!important;color:var(--text)!important;}
.dark .table th{background:#12323a!important;color:#c7e8e5!important;}
.dark .notice{background:#2b240f!important;border-color:#715a1e!important;color:#ffe6a3!important;}
.dark .modal-card{background:#0e2a31!important;color:var(--text)!important;border:1px solid var(--line);}
.dark .receipt-preview{background:#fff!important;color:#333!important;}
.dark .tab{background:#0e2a31;color:#dffcf8;border:1px solid var(--line);}
.dark .tab.active{background:var(--teal);color:#fff;}
.dark .ghost{background:#14343b;color:#dffcf8;}
.dark .inline-input,.dark .report-filter input{background:#0b242b!important;color:#effffc!important;border-color:#254950!important;}
.dark .menu-card .tag{color:#8fd1cf!important;}
.dark .price{color:#ff9b55!important;}
.dark .grand{background:linear-gradient(135deg,#12333a,#332615)!important;}
@media(max-width:900px){.report-filter{grid-template-columns:1fr}.cash-change-box div{grid-template-columns:1fr}}
/* V1.8 data management */
.data-grid{display:grid;grid-template-columns:repeat(2,minmax(260px,1fr));gap:16px;margin-top:16px}.data-card{border:1px solid var(--line);border-radius:18px;padding:18px;background:var(--card);box-shadow:var(--shadow)}.data-card.wide{grid-column:1/-1}.data-card h4{font-size:18px;margin:0 0 8px;color:var(--text)}.data-card p{color:var(--muted);margin-bottom:14px}.data-card button{width:auto;margin:6px 8px 6px 0}.danger{background:#ef4444;color:white;border:0;border-radius:14px;padding:12px 16px;font-weight:800;cursor:pointer}.danger:hover{filter:brightness(.95)}@media(max-width:900px){.data-grid{grid-template-columns:1fr}.data-card.wide{grid-column:auto}}


/* V1.9 cash drawer and report refinements */
.cash-hero{border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,#7cd0c9,#9bd8ad);padding:30px;margin-bottom:18px;display:flex;justify-content:space-between;align-items:center;gap:20px;box-shadow:var(--shadow);color:white}.cash-hero h3{font-size:20px;margin:0 0 8px}.cash-hero b{font-size:48px;line-height:1}.cash-hero p{opacity:.85;margin-top:6px}.cash-actions{display:flex;gap:12px;flex-wrap:wrap}.cash-actions .primary,.cash-actions .ghost{min-width:150px}.report-table{margin-top:16px}.chart .bar span{max-width:92px;overflow:hidden;text-overflow:ellipsis}.cash-change-box{display:grid!important;grid-template-columns:auto minmax(140px,1fr) auto!important;align-items:center!important;gap:10px!important}.cash-change-box label{white-space:nowrap;margin:0}.cash-change-box input{min-width:140px}.cash-change-box div{display:flex!important;justify-content:flex-end!important;gap:4px!important;white-space:nowrap}.dark .cash-hero{background:linear-gradient(135deg,#167e7a,#3f8e63);color:#fff}.dark .cash-hero .ghost{background:#eafffb;color:#0b7775}@media(max-width:900px){.cash-hero{display:block;text-align:center}.cash-actions{justify-content:center;margin-top:16px}.cash-change-box{grid-template-columns:1fr!important}.cash-change-box div{justify-content:space-between!important}}

/* V1.13 stability, login, printing, alignment, and dark mode fixes */
.login-screen{position:fixed;inset:0;z-index:9999;background:linear-gradient(135deg,#0b5f63,#16a7a2 55%,#f2c879);display:grid;place-items:center;padding:24px}.login-card{width:min(440px,94vw);background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.55);box-shadow:0 24px 70px rgba(0,0,0,.22);border-radius:30px;padding:28px}.login-card .login-logo{display:grid;place-items:center;margin-bottom:16px}.login-card h1{text-align:center;margin:0;color:#12373d}.login-card p{text-align:center;color:#638084;margin:8px 0 24px}.login-actions{display:grid;gap:10px;margin-top:10px}.home-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}.home-card{border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,#fff,#edf9f7);box-shadow:var(--shadow);padding:22px;cursor:pointer;transition:.15s}.home-card:hover{transform:translateY(-3px);border-color:var(--teal)}.home-card svg{width:32px;height:32px;color:var(--teal)}.home-card h3{margin:12px 0 6px}.logout-btn{width:100%;margin-top:12px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.14);color:#fff;border-radius:14px;padding:10px 12px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}.brand-logo-img{width:58px;height:58px;border-radius:20px;object-fit:cover;display:block}.receipt-logo-preview{max-width:100px;max-height:70px;margin:0 auto 8px;display:block}.receipt-preview{width:50mm;min-height:80mm;max-height:80vh;overflow:auto;padding:3mm!important;font-size:10px!important;line-height:1.32!important;color:#111!important}.receipt-preview h2{font-size:12px!important;line-height:1.25!important;text-align:center!important;margin:0 0 3mm!important}.receipt-line{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:start}.receipt-line span:first-child{word-break:break-word}.receipt-line span:last-child{text-align:right;white-space:nowrap}.receipt-mini{font-size:9px}.cash-change-box.v113{grid-template-columns:1fr!important}.cash-change-line{display:grid!important;grid-template-columns:auto minmax(140px,1fr) auto auto!important;align-items:center!important;gap:8px!important}.cash-change-line label{font-size:12px}.cash-change-line input{min-width:0!important}.cash-change-line .change-label{font-size:13px;color:var(--muted);font-weight:800}.cash-change-line b{white-space:nowrap}.aligned-money{font-variant-numeric:tabular-nums}.cash-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.cash-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:18px}.logo-upload-box{display:flex;align-items:center;gap:14px;border:1px dashed var(--line);border-radius:18px;padding:14px;background:rgba(255,255,255,.45)}.logo-upload-box img{width:72px;height:72px;border-radius:18px;object-fit:cover;background:#edf8f7}.settings-form .primary.save-settings-btn{position:static!important;justify-self:start!important}.dark .home-card{background:linear-gradient(135deg,#102c34,#0a2228);color:var(--text)}.dark .login-card{background:#0e2a31;color:var(--text);border-color:#254950}.dark .login-card h1{color:#effffc}.dark .login-card p{color:#a7c2c4}.dark .receipt-preview{background:#fff!important;color:#111!important}.dark .receipt-preview *{color:#111!important}.dark .home-card p,.dark .metric small,.dark .field label,.dark .muted{color:#b8d6d8!important}.dark .menu-card h4,.dark .panel h3,.dark .topbar h2,.dark .table td{color:#effffc!important}.dark .empty-cart{color:#b8d6d8!important}@media(max-width:900px){.cash-change-line{grid-template-columns:1fr!important}.cash-form-grid{grid-template-columns:1fr}.receipt-preview{width:50mm}.modal-card{width:min(96vw,520px)!important}}
@media print{.receipt-print{font-size:9.5px!important;line-height:1.25!important;padding:2mm!important}.receipt-print h2{font-size:11px!important;text-align:center!important;margin:0 0 2mm!important}.receipt-print .receipt-line{display:grid!important;grid-template-columns:1fr auto!important;gap:4px!important}.receipt-print img{max-width:22mm!important;max-height:14mm!important;margin:0 auto 1mm!important;display:block!important}}

/* V1.22 Premium Login Screen - replaces separate homepage */
.login-screen{position:fixed;inset:0;z-index:9999;background:linear-gradient(135deg,#F0FDFA 0%,#f8fafc 45%,#ecfeff 100%);display:grid;place-items:center;padding:28px;overflow:auto}.login-screen.hidden{display:none!important}.mvi-login-shell{width:min(1160px,100%);display:grid;gap:18px}.mvi-login-card{min-height:650px;background:rgba(255,255,255,.84);border:1px solid rgba(15,118,110,.15);box-shadow:0 30px 90px rgba(15,23,42,.16);border-radius:34px;overflow:hidden;display:grid;grid-template-columns:440px 1fr;backdrop-filter:blur(18px)}.mvi-login-left{position:relative;padding:42px 46px;display:flex;flex-direction:column;background:linear-gradient(180deg,#ffffff 0%,#F8FFFD 100%)}.mvi-login-brand{display:flex;align-items:center;gap:14px}.mvi-login-logo{width:58px;height:58px;border-radius:20px;background:linear-gradient(135deg,#0F766E,#8EE6D4);display:grid;place-items:center;color:white;box-shadow:0 12px 30px rgba(15,118,110,.28)}.mvi-login-logo svg{width:30px}.mvi-login-brand h2{margin:0;font-size:18px;color:#0f172a}.mvi-login-brand p{margin:2px 0 0;color:#64748b;font-size:13px}.mvi-version{position:absolute;top:54px;right:46px;color:#cbd5e1;font-size:22px;font-weight:700}.mvi-welcome{margin-top:74px}.mvi-kicker{display:inline-flex;background:#ECFDF5;color:#0F766E;border:1px solid #A7F3D0;border-radius:999px;padding:7px 12px;font-size:12px;font-weight:900;letter-spacing:.12em}.mvi-welcome h1{margin:18px 0 8px;font-size:38px;letter-spacing:-.04em;color:#0f172a}.mvi-welcome p{margin:0;color:#64748b}.mvi-login-fields{margin-top:28px;display:grid;gap:14px}.mvi-login-fields .field label{color:#475569;font-weight:800}.mvi-login-fields .field input{border:1px solid #dbe7e5;background:white;border-radius:14px;padding:14px 16px}.mvi-login-btn{width:100%;background:linear-gradient(135deg,#0F766E,#14B8A6)!important;box-shadow:0 14px 26px rgba(15,118,110,.22)}.mvi-demo-btn{width:100%;justify-content:center}.mvi-help{margin-top:18px;font-size:12px;color:#64748b}.mvi-login-right{position:relative;overflow:hidden;padding:44px;background:radial-gradient(circle at 25% 15%,rgba(255,255,255,.28),transparent 28%),linear-gradient(135deg,#0f3d46 0%,#0f766e 48%,#0F766E 120%);color:white}.mvi-login-right:before{content:"";position:absolute;inset:auto -100px -120px auto;width:360px;height:360px;border-radius:50%;background:rgba(255,255,255,.12);animation:floaty 7s ease-in-out infinite}.mvi-hero-copy{position:relative;z-index:2;max-width:560px}.mvi-hero-copy span{font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:900;color:#CCFBF1}.mvi-hero-copy h2{font-size:44px;line-height:1.02;margin:18px 0 12px;letter-spacing:-.04em}.mvi-hero-copy p{color:#dff7f4;font-size:16px;line-height:1.7}.mvi-dashboard-mock{position:relative;z-index:2;margin-top:44px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);border-radius:28px;padding:22px;box-shadow:0 30px 70px rgba(0,0,0,.22);backdrop-filter:blur(18px);animation:floaty 6s ease-in-out infinite}.mock-top{display:flex;align-items:center;gap:8px;margin-bottom:18px}.mock-top span{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.55)}.mock-top b{margin-left:auto;font-size:13px;color:#fff}.mock-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.mock-metric{border-radius:18px;padding:16px;background:rgba(255,255,255,.14)}.mock-metric small{display:block;color:#e6fffb}.mock-metric b{font-size:26px}.mock-metric.orange{background:rgba(255,108,0,.78)}.mock-metric.teal{background:rgba(6,182,212,.42)}.mock-metric.green{background:rgba(16,185,129,.42)}.mock-chart{height:170px;margin-top:16px;border-radius:20px;background:rgba(15,23,42,.22);display:flex;align-items:end;gap:18px;padding:24px}.mock-chart i{flex:1;border-radius:12px 12px 0 0;background:linear-gradient(180deg,#fff,#CCFBF1);animation:pulsebar 2.2s ease-in-out infinite}.mock-chart i:nth-child(2){animation-delay:.2s}.mock-chart i:nth-child(3){animation-delay:.4s}.mock-chart i:nth-child(4){animation-delay:.6s}.mock-flow{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.mock-flow span,.floating-chip{display:inline-flex;align-items:center;gap:8px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);padding:9px 13px;font-size:13px;font-weight:800}.mock-flow svg,.floating-chip svg{width:16px}.floating-chip{position:absolute;z-index:3;box-shadow:0 14px 30px rgba(0,0,0,.18);backdrop-filter:blur(12px)}.chip-one{right:34px;top:200px}.chip-two{left:30px;bottom:120px}.chip-three{right:56px;bottom:50px}.mvi-login-footer{display:flex;justify-content:space-between;gap:16px;align-items:center;color:#334155;font-size:13px;padding:0 12px}.mvi-login-footer b{color:#0f172a}.mvi-login-footer span{color:#0F766E;font-weight:800}@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes pulsebar{0%,100%{filter:brightness(1);transform:scaleY(1)}50%{filter:brightness(1.15);transform:scaleY(1.06)}}@media(max-width:900px){.login-screen{padding:14px}.mvi-login-card{grid-template-columns:1fr}.mvi-login-right{min-height:480px}.mvi-login-footer{flex-direction:column;text-align:center}.mvi-version{display:none}.mvi-welcome{margin-top:44px}}@media(max-width:560px){.mvi-login-left,.mvi-login-right{padding:28px}.mvi-hero-copy h2{font-size:34px}.mock-grid{grid-template-columns:1fr}.floating-chip{display:none}.mvi-login-card{border-radius:24px}}

/* V1.23 payment behavior fix: hide cash tender/change for non-cash MOP even with older !important grid rules */
.menu-card{width:100%;text-align:left;color:inherit;font:inherit}
#cashBox.hidden{display:none!important;visibility:hidden!important;height:0!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;overflow:hidden!important;}
#ref.hidden{display:none!important;}

/* V1.24 login cleanup */
.mvi-version,.mvi-demo-btn,.mvi-help{display:none!important}
.mvi-login-btn{background:linear-gradient(135deg,#14B8A6,#0F766E)!important;box-shadow:0 14px 26px rgba(15,118,110,.22)!important}
.mvi-login-logo{background:linear-gradient(135deg,#14B8A6,#0F766E)!important;box-shadow:0 12px 30px rgba(15,118,110,.28)!important}
.mvi-kicker{background:#ECFDF5!important;color:#0F766E!important;border-color:#A7F3D0!important}
.mvi-login-right{background:radial-gradient(circle at 25% 15%,rgba(255,255,255,.28),transparent 28%),linear-gradient(135deg,#064E3B 0%,#0F766E 55%,#115E59 100%)!important}
.mock-metric.orange,.mock-metric.emerald{background:rgba(16,185,129,.50)!important}
.mock-chart i{background:linear-gradient(180deg,#fff,#A7F3D0)!important}
.mvi-login-footer span{color:#0F766E!important}
/* V1.28 inventory control enhancements */
.badge{display:inline-flex;align-items:center;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:800}.badge.good{background:#dcfce7;color:#166534}.badge.bad{background:#fee2e2;color:#991b1b}.notice.danger{border-color:#fecaca;background:#fef2f2;color:#991b1b}.primary.small,.ghost.small{width:auto;padding:8px 12px;font-size:12px}.panel-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.clean-modal{box-shadow:none;border:none;background:transparent}.modal-actions{display:flex;gap:8px;justify-content:flex-start;margin-bottom:12px}.table td,.table th{vertical-align:top}
/* V1.29 recipe/costing/dashboard enhancements */
.hero-number{font-size:24px;font-weight:900;color:var(--teal);margin:12px 0}.executive-chart{min-height:190px}.recipe-detail{border:1px solid var(--line);border-radius:14px;margin:10px 0;background:rgba(255,255,255,.6);overflow:hidden}.recipe-detail summary{cursor:pointer;padding:14px 16px;display:flex;justify-content:space-between;gap:12px}.recipe-detail summary span{color:var(--muted);font-size:13px}.recipe-detail .two{padding:12px 16px}.small-input{max-width:110px;padding:8px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--text)}.dark .recipe-detail{background:rgba(20,184,166,.08)}

/* V1.30 System Settings Data Control */
.panel-soft{border:1px solid var(--line,#cfe4df);background:rgba(255,255,255,.6);border-radius:18px;padding:16px;margin:14px 0;box-shadow:0 8px 20px rgba(15,118,110,.06)}
.panel-soft h4{margin:0 0 10px;font-size:16px;color:var(--ink,#0f2f33)}
.danger-zone{border-color:#fecaca;background:#fff7f7}
button.danger{border:0;background:#dc2626;color:#fff;border-radius:14px;padding:12px 16px;font-weight:800;cursor:pointer}
button.danger:hover{filter:brightness(.95);transform:translateY(-1px)}

/* V1.31 UI helpers */
.wizard-steps{margin-top:14px;padding:8px 12px;border-radius:999px;background:rgba(15,118,110,.10);color:#0f766e;font-weight:700;display:inline-block}
.panel-soft.selected-card{border:2px solid #0f766e;background:linear-gradient(135deg,rgba(15,118,110,.12),rgba(20,184,166,.08))}
.badge.good{background:#dcfce7;color:#166534}.badge.bad{background:#fee2e2;color:#991b1b}
.notice.danger{background:#fff1f2;border-color:#fecdd3;color:#9f1239}
.dark .notice.danger{background:#3f121c;color:#fecdd3;border-color:#7f1d1d}
.modal-actions button[disabled]{opacity:.45;cursor:not-allowed}

/* V2.0.1 Hybrid Foundation */
.logo-preview{min-height:80px;border:1px dashed var(--line,#d8dee9);border-radius:14px;display:flex;align-items:center;justify-content:center;padding:12px;background:rgba(15,118,110,.05);color:var(--muted,#64748b);margin-bottom:12px}
.logo-preview img{max-width:120px;max-height:90px;border-radius:16px;object-fit:contain;background:#fff;padding:8px;box-shadow:0 8px 20px rgba(15,23,42,.08)}
.hybrid-status-card{border:1px solid rgba(15,118,110,.18);background:linear-gradient(135deg,rgba(15,118,110,.08),rgba(37,99,235,.06))}
.page-header.compact{margin-bottom:10px}
.badge.warn{background:#fff7ed;color:#9a3412;border-color:#fed7aa}





/* V2.1.9.4 - Body-level floating MVI Super Admin setup button */
#superAdminGear.super-admin-gear{
  position:fixed !important;
  left:22px !important;
  bottom:22px !important;
  right:auto !important;
  top:auto !important;
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  min-height:44px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.75) !important;
  border-radius:999px !important;
  background:#0f766e !important;
  color:#ffffff !important;
  font-size:18px !important;
  line-height:1 !important;
  cursor:pointer !important;
  opacity:.92 !important;
  pointer-events:auto !important;
  z-index:2147483647 !important;
  box-shadow:0 10px 26px rgba(0,0,0,.28) !important;
  transform:none !important;
}
#superAdminGear.super-admin-gear:hover{
  opacity:1 !important;
  transform:rotate(90deg) !important;
  background:#0b5f59 !important;
}
#superAdminGear.super-admin-gear:active{
  transform:scale(.96) !important;
}

/* V2.1.9.5 - Visible MVI setup button on login screen */
.mvi-setup-btn{
  margin-top:10px;
  width:100%;
  border:1px solid rgba(15,118,110,.18);
  background:rgba(15,118,110,.06);
  color:#0f766e;
  border-radius:14px;
  padding:12px 14px;
  font-weight:800;
  cursor:pointer;
  transition:.2s ease;
}
.mvi-setup-btn:hover{
  background:rgba(15,118,110,.12);
  transform:translateY(-1px);
}

/* V2.1.9.6 - Bulletproof MVI Setup button */
#mviSetupBtn.mvi-setup-btn{
  pointer-events:auto !important;
  position:relative !important;
  z-index:999999 !important;
  user-select:none !important;
}
#mviSetupBtn.mvi-setup-btn:active{
  transform:scale(.98) !important;
}

/* V2.1.9.7 - remove duplicate floating Super Admin gear */
#superAdminGear.super-admin-gear{
  display:none !important;
}

/* V2.1.9.7 - Editable User Access Matrix */
.role-access-grid{
  display:grid;
  gap:18px;
  margin:18px 0;
}
.role-access-card{
  border:1px solid #cfe3e0;
  border-radius:18px;
  padding:18px;
  background:#fff;
}
.role-access-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.role-access-head h3{
  margin:0;
}
.role-access-head b{
  font-size:12px;
  color:#003b44;
}
.role-module-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.module-check{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid #d5e7e4;
  border-radius:12px;
  padding:10px 12px;
  cursor:pointer;
  background:#fff;
  user-select:none;
}
.module-check input{
  width:16px;
  height:16px;
  accent-color:#0f766e;
  cursor:pointer;
}
.module-check.locked{
  opacity:.65;
  cursor:not-allowed;
}
.module-check.locked input{
  cursor:not-allowed;
}

/* V2.1.9.8 - Final RBAC checkbox clickability */
.role-access-grid{display:grid;gap:18px;margin:18px 0;}
.role-access-card{border:1px solid #cfe3e0;border-radius:18px;padding:18px;background:#fff;}
.role-access-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;}
.role-access-head h3{margin:0;}
.role-module-list{display:flex;flex-wrap:wrap;gap:10px;}
.module-check{display:inline-flex;align-items:center;gap:8px;border:1px solid #d5e7e4;border-radius:12px;padding:10px 12px;background:#fff;cursor:pointer;user-select:none;pointer-events:auto;}
.module-check input{width:16px;height:16px;accent-color:#0f766e;cursor:pointer;pointer-events:auto;}
.module-check.locked{opacity:.70;cursor:not-allowed;}
.module-check.locked input{cursor:not-allowed;}

/* V2.1.9.9 - Final RBAC input click fix */
.role-access-card input[type="checkbox"]:not(:disabled){
  pointer-events:auto !important;
  opacity:1 !important;
  cursor:pointer !important;
}
.role-access-card .module-check:not(.locked){
  pointer-events:auto !important;
  cursor:pointer !important;
}
.role-access-card .module-check:not(.locked) *{
  pointer-events:auto !important;
}

/* V2.1.9.9 - RBAC fixes: badge in role-access-head, editable highlight */
.role-access-head .badge{background:#f0fdf4;color:#15803d;border:1px solid #bbf7d0;font-size:11px;}
.role-access-head .badge.mvi-only{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe;}
.role-access-card.editable{border-color:#0d9488;}
.role-access-card.editable .role-access-head{border-bottom:1px solid #e2f5f3;padding-bottom:10px;margin-bottom:12px;}


/* V2.3.4 Owner Dashboard */
.owner-header-v234 {
  align-items: center;
}
.owner-kpi-v234 .metric b {
  letter-spacing: -0.04em;
}
.owner-grid-v234 {
  margin-top: 18px;
}
.owner-chart-bars-v234 {
  height: 240px;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}
.owner-bar-wrap-v234 {
  min-width: 0;
  display: grid;
  grid-template-rows: 1fr auto auto;
  gap: 7px;
  text-align: center;
}
.owner-bar-track-v234 {
  height: 150px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(15,118,110,.08), rgba(15,118,110,.04));
  border: 1px solid rgba(15,118,110,.10);
  display: flex;
  align-items: end;
  padding: 7px;
  overflow: hidden;
}
.owner-bar-track-v234 span {
  width: 100%;
  border-radius: 12px 12px 7px 7px;
  background: linear-gradient(180deg, #ffffff, #b8f5da 60%, #14b8a6);
  box-shadow: 0 -8px 18px rgba(20,184,166,.14);
}
.owner-bar-wrap-v234 small {
  color: var(--muted, #64748b);
  font-weight: 800;
  font-size: 11px;
  white-space: nowrap;
}
.owner-bar-wrap-v234 b {
  font-size: 11px;
  color: var(--primary, #0f766e);
  white-space: nowrap;
}
.owner-table-v234 td:last-child,
.owner-table-v234 th:last-child {
  text-align: right;
}
.empty-state-v234 {
  border: 1px dashed rgba(15,118,110,.22);
  border-radius: 18px;
  padding: 28px;
  color: var(--muted, #64748b);
  background: rgba(255,255,255,.55);
  text-align: center;
  font-weight: 800;
}
@media (max-width: 900px) {
  .owner-chart-bars-v234 {
    overflow-x: auto;
    grid-template-columns: repeat(7, 86px);
    padding-bottom: 6px;
  }
  .owner-table-v234 {
    min-width: 520px;
  }
}


/* =========================================================
   V2.3.6 - Mobile PWA Layout Fix
========================================================= */
html, body { max-width:100%; overflow-x:hidden; }

@media (max-width: 820px) {
  body { overflow-x:hidden; }
  .app { width:100%; max-width:100vw; display:block !important; min-height:100dvh; }
  .sidebar {
    position:relative !important; width:100% !important; min-width:0 !important; max-width:100% !important;
    height:auto !important; min-height:auto !important; padding:16px !important; border-radius:0 0 24px 24px;
  }
  .brand { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
  .brand .logo { width:58px !important; height:58px !important; flex:0 0 58px; }
  .brand h1 { font-size:20px !important; line-height:1.05 !important; }
  .brand p { font-size:13px !important; }

  #nav, .sidebar nav {
    display:flex !important; overflow-x:auto !important; gap:8px !important; padding:4px 0 10px !important;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  }
  #nav button, .sidebar nav button, .nav-btn {
    flex:0 0 auto !important; white-space:nowrap !important; min-width:auto !important;
    padding:12px 14px !important; border-radius:16px !important; scroll-snap-align:start;
  }
  .operator {
    margin-top:10px !important; padding:12px !important; display:grid !important;
    grid-template-columns:1fr auto !important; align-items:center !important; gap:10px !important;
  }
  .operator small, .operator span { font-size:12px !important; }
  .operator b { font-size:16px !important; }
  .operator button, .logout-btn { min-width:120px !important; }

  .main { width:100% !important; max-width:100vw !important; margin:0 !important; padding:14px !important; overflow-x:hidden !important; }
  .topbar {
    display:flex !important; align-items:center !important; justify-content:space-between !important;
    gap:10px !important; padding:16px !important; border-radius:22px !important; margin-bottom:14px !important;
  }
  .topbar h2, #title { font-size:24px !important; line-height:1.1 !important; }
  .top-actions { display:flex !important; gap:8px !important; flex-wrap:nowrap !important; }
  .top-actions .pill { display:none !important; }
  .icon-btn { width:44px !important; height:44px !important; min-width:44px !important; }

  .panel { border-radius:22px !important; padding:16px !important; margin-bottom:14px !important; }
  .pos-grid { display:grid !important; grid-template-columns:1fr !important; gap:14px !important; width:100% !important; }
  .menu-panel, .cart-panel { width:100% !important; min-width:0 !important; }
  .panel-head, .panel-title-row, .page-header { display:flex !important; align-items:flex-start !important; justify-content:space-between !important; gap:10px !important; flex-wrap:wrap !important; }
  .filters { display:grid !important; grid-template-columns:1fr !important; gap:10px !important; width:100% !important; }
  .search, .search input, #cat { width:100% !important; min-width:0 !important; font-size:16px !important; }

  .menu-grid { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; }
  .menu-card, .item-card { min-width:0 !important; width:100% !important; padding:14px !important; }
  .menu-card h4, .item-card h4 { font-size:15px !important; line-height:1.2 !important; }
  .menu-card b, .item-card b { font-size:22px !important; }

  .cart-panel { position:static !important; top:auto !important; }
  .cart-box { max-height:none !important; overflow-x:auto !important; }
  .cart-table, .table { width:100% !important; min-width:0 !important; }
  .cart-table th, .cart-table td { font-size:13px !important; padding:10px 8px !important; }

  .payment-row, .settings-actions, .actions { display:grid !important; grid-template-columns:1fr !important; gap:10px !important; }
  .primary, .ghost, .danger { width:100% !important; justify-content:center !important; min-height:46px !important; }
  input, select, textarea, button { font-size:16px !important; }
  .cards { display:grid !important; grid-template-columns:1fr !important; gap:12px !important; }
  .grid2, .grid-two, .settings-layout { display:grid !important; grid-template-columns:1fr !important; gap:14px !important; }
  .settings-menu { position:static !important; max-height:none !important; overflow:visible !important; }
  .settings-menu button { width:100% !important; }

  .role-access-grid { grid-template-columns:1fr !important; }
  .role-module-list { grid-template-columns:1fr !important; }
}

@media (max-width: 430px) {
  .main { padding:10px !important; }
  .sidebar { padding:14px 12px !important; }
  .brand h1 { font-size:18px !important; }
  .menu-grid { grid-template-columns:1fr !important; }
  .topbar { align-items:flex-start !important; }
  .top-actions { margin-left:auto !important; }
  .panel { padding:14px !important; }
}