:root{--green:#d9342b;--brand:var(--green);--green2:color-mix(in srgb,var(--green),#000 16%);--cream:#faf5f4;--paper:#ffffff;--ink:#26191a;--muted:#8c8180;--line:#efe1e0;--orange:#e8871e;--shadow:0 14px 38px rgba(90,20,16,.10);--menubar-bg:#fdecea;--topbar-bg:#ffffff;--tint:#fdecea;--tint-strong:#fbdedb}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;max-width:100%;overflow-x:hidden;font-family:"IBM Plex Sans Thai",sans-serif;color:var(--ink);background:var(--cream)}button,input{font:inherit}button{cursor:pointer}input,select,textarea{font-size:16px}.hidden{display:none!important}
.app-shell{height:100vh;min-height:680px;display:flex;flex-direction:column;overflow:hidden}.topbar{height:82px;background:var(--topbar-bg,var(--paper));border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;flex-shrink:0;box-shadow:0 1px 12px rgba(90,20,16,.05)}.topbar-left,.brand,.top-actions,.user-button{display:flex;align-items:center}.topbar-left{gap:16px}.brand{gap:12px}.brand-mark{width:44px;height:44px;display:grid;place-items:center;background:linear-gradient(140deg,var(--green),var(--green2));color:white;border-radius:13px;font-weight:700;box-shadow:0 5px 14px rgba(217,52,43,.32)}a.brand-mark{text-decoration:none;color:inherit;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}a.brand-mark:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(217,52,43,.36)}a.brand-mark:active{transform:translateY(0)}.brand strong,.brand span{display:block}.brand strong{font-size:18px}.brand span{font-size:12px;color:var(--muted)}.top-actions{gap:24px}.status{font-size:12px;color:#2f8f57;background:#e8f6ee;padding:8px 12px;border-radius:30px}.status i{display:inline-block;width:7px;height:7px;background:#2d9a65;border-radius:50%;margin-right:6px}.date-box{text-align:right;font-size:12px;color:var(--muted)}.date-box span,.date-box b{display:block}.date-box b{font-size:16px;color:var(--ink)}.user-button{border:0;background:transparent;border-left:1px solid var(--line);padding-left:22px;gap:2px;text-align:right;display:grid;grid-template-columns:1fr 38px}.user-button span,.user-button small{display:block}.user-button span{font-weight:600}.user-button small{color:var(--muted)}.user-button em{grid-column:2;grid-row:1/3;width:38px;height:38px;border-radius:50%;background:var(--tint-strong);color:var(--green2);display:grid;place-items:center;font-style:normal;margin-left:10px;font-weight:600}
main{display:grid;grid-template-columns:minmax(0,1fr) 420px;min-height:0;flex:1}.catalog{padding:20px 28px;overflow:auto}.catalog-head{display:flex;justify-content:space-between;align-items:end;gap:24px}.eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#79837e;margin:0 0 3px;font-weight:600}.catalog h1,.checkout h2,.modal h2{margin:0;font-size:27px;line-height:1.2}.search,.product-search-bar{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 8px 6px 18px;min-height:52px;box-shadow:0 4px 15px rgba(20,40,30,.03);transition:border-color .2s var(--ease-out),box-shadow .2s var(--ease-out)}.search{width:min(560px,60%)}.product-search-bar{width:100%;margin-top:4px}.search:focus-within,.product-search-bar:focus-within{border-color:color-mix(in srgb,var(--green) 35%,var(--line));box-shadow:0 0 0 3px var(--tint)}.search .field-ico,.product-search-bar .field-ico{flex:none;color:#8a918d;transform:none;font-size:inherit}.search .field-ico .ico,.product-search-bar .field-ico .ico{width:20px;height:20px}.search input,.product-search-bar input{border:0;outline:0;background:transparent;flex:1;min-width:0;color:var(--ink);font-size:15px;margin:0!important}.catalog-mode-toggle{display:flex;gap:8px;margin-top:12px}.catalog-mode-toggle button{border:1px solid var(--line);background:rgba(255,255,255,.52);color:#53615a;border-radius:10px;padding:9px 16px;font-weight:600;font-size:12px}.catalog-mode-toggle button.active{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 4px 12px rgba(217,52,43,.24)}.categories{display:flex;gap:8px;margin:16px 0 12px;overflow:auto;padding-bottom:2px}.category{border:1px solid var(--line);background:rgba(255,255,255,.52);color:#53615a;border-radius:30px;padding:9px 16px;white-space:nowrap;transition:.18s;touch-action:none;user-select:none;cursor:grab}.category.dragging{opacity:.6;transform:scale(1.08);box-shadow:0 8px 18px rgba(90,20,16,.2);border-color:var(--green);cursor:grabbing}.category:hover{border-color:#e0a29c}.category.active{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 4px 12px rgba(217,52,43,.24)}.product-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.product-meta p{font-size:13px;color:var(--muted);margin:0}.product-meta p b{color:var(--ink)}.product-meta button{border:1px solid var(--line);background:rgba(255,255,255,.6);color:var(--green);font-weight:600;font-size:13px;border-radius:10px;padding:7px 13px;cursor:pointer}.product-meta button.active{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 4px 12px rgba(217,52,43,.24)}.product-grid{display:grid;grid-template-columns:repeat(4,minmax(145px,1fr));gap:14px;padding-bottom:30px}.product-card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:12px;text-align:left;position:relative;transition:.2s;min-width:0;cursor:pointer}.product-card.dragging{opacity:.55;transform:scale(1.04);box-shadow:0 14px 30px rgba(90,20,16,.22);z-index:5;border-color:var(--green);cursor:grabbing}.product-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--tint-strong)}.product-card:active{transform:scale(.98)}.product-grid.reordering .product-card{touch-action:none;user-select:none;cursor:grab}.product-grid.reordering .product-card:hover{transform:none}.product-grid.reordering .pf-add,.product-grid.reordering .qty-control{opacity:.35;pointer-events:none}.product-visual{height:116px;border-radius:11px;display:grid;place-items:center;font-size:55px;margin-bottom:12px;overflow:hidden}.product-card h3{font-size:14px;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-card p{font-size:11px;color:var(--muted);margin:0 0 10px}.product-foot{display:flex;align-items:center;justify-content:space-between}.product-foot b{font-size:16px;color:var(--green)}.pf-add{width:28px;height:28px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:20px;transition:.15s;box-shadow:0 3px 8px rgba(217,52,43,.28)}.product-card:hover .pf-add{transform:scale(1.1)}.qty-control{display:flex;align-items:center;gap:2px;background:var(--tint);border:1px solid var(--tint-strong);border-radius:20px;padding:2px}.qty-control .pf-step{width:26px;height:26px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:18px;line-height:1;box-shadow:0 2px 6px rgba(217,52,43,.28)}.qty-control .pf-count{min-width:24px;text-align:center;font-size:14px;font-weight:700;color:var(--green2)}.stock-low{position:absolute;right:19px;top:19px;background:#fff4e5;color:#b26b25;border-radius:10px;padding:4px 7px;font-size:9px;font-weight:600}.promo-badge{position:absolute;right:19px;top:19px;background:var(--orange);color:#fff;border-radius:10px;padding:4px 7px;font-size:9px;font-weight:700}.product-foot b s{color:var(--muted);font-weight:400;font-size:11px;margin-right:3px}.cart-info p s{color:var(--muted);font-size:10px}.promo-tag{font-style:normal;background:#fdf1de;color:#a5690f;border-radius:8px;padding:1px 5px;font-size:9px;font-weight:700}.empty-products{text-align:center;color:var(--muted);padding:80px 20px}.empty-products span{font-size:40px}.empty-products h3{color:var(--ink);margin:10px 0 3px}.empty-products p{margin:0;font-size:13px}
.checkout{background:var(--paper);border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0}.checkout-head{padding:26px 24px 17px;display:flex;justify-content:space-between;align-items:center}.checkout h2{font-size:22px}.checkout h2 span{font-size:11px;color:white;background:var(--green);display:inline-grid;place-items:center;vertical-align:middle;border-radius:20px;min-width:22px;height:22px;padding:0 6px}.clear-btn{border:0;background:var(--green);color:#fff;font-size:12px;font-weight:600;border-radius:9px;padding:8px 14px;box-shadow:0 4px 12px rgba(217,52,43,.24)}.clear-btn:hover{background:var(--green2)}.order-info{margin:0 24px;display:flex}.order-info b{color:var(--ink)}.cart-list{padding:12px 24px;overflow:auto;flex:1}.cart-item{display:grid;grid-template-columns:45px 1fr auto;gap:10px;padding:11px 0;border-bottom:1px solid #eeece5;align-items:center}.cart-thumb{width:45px;height:45px;border-radius:9px;display:grid;place-items:center;font-size:26px}.cart-info{min-width:0}.cart-info h4{font-size:13px;margin:0;max-width:100%;white-space:normal;overflow:hidden}.cart-info p{font-size:11px;color:var(--muted);margin:1px 0 7px}.qty{display:flex;align-items:center;gap:10px}.weight-qty-input{width:56px;border:1px solid var(--line);border-radius:6px;padding:3px 6px;font-size:12px;font-weight:600}.qty button{border:1px solid var(--line);width:24px;height:24px;background:white;border-radius:6px;line-height:1;color:var(--green)}.qty span{font-size:12px;font-weight:600}.cart-price{text-align:right}.cart-price b{font-size:13px}.cart-price button{border:0;background:transparent;color:#aaa;font-size:18px;display:block;margin:8px 0 0 auto;padding:0}.gift-list{padding:0 24px 8px}.gift-row{display:flex;align-items:center;gap:10px;background:#fdf1de;border:1px dashed #e8c586;border-radius:9px;padding:8px 11px;margin-bottom:8px;font-size:11px}.gift-row>span{font-size:20px}.gift-row div{flex:1}.gift-row b{display:block;font-size:12px;color:#a5690f}.gift-row small{color:var(--muted);font-size:9px}.gift-row em{font-style:normal;color:var(--green);font-weight:700}.empty-cart{margin:auto;text-align:center;color:var(--muted)}.empty-cart div{font-size:38px;filter:grayscale(1);opacity:.45}.empty-cart h3{font-size:15px;color:#53605a;margin:10px 0 4px}.empty-cart p{font-size:12px;margin:0;line-height:1.7}.summary{border-top:1px solid var(--line);padding:17px 24px 18px;box-shadow:0 -6px 20px rgba(20,40,30,.025)}.discount-row{width:100%;border:1px dashed #c7cbc6;background:#faf9f4;border-radius:8px;display:flex;justify-content:space-between;padding:9px 11px;color:var(--green);font-size:12px;margin-bottom:12px}.sum-row,.total-row{display:flex;justify-content:space-between;align-items:center;margin:8px 0;font-size:13px}.promo-savings-row{color:#a5690f}.promo-savings-row b{color:#a5690f}.sum-row.muted{color:var(--muted);font-size:11px}.sum-row small{font-size:9px}.total-row{border-top:1px solid var(--line);padding-top:13px;margin-top:12px;font-size:15px}.total-row b{font-size:25px;color:var(--green)}.pay-button,.confirm-pay{border:0;width:100%;background:linear-gradient(135deg,var(--green),var(--green2));color:#fff;border-radius:13px;padding:15px 18px;display:flex;justify-content:space-between;font-weight:700;font-size:15px;margin-top:14px;transition:.2s;box-shadow:0 8px 20px rgba(217,52,43,.28)}.pay-button:hover,.confirm-pay:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 11px 26px rgba(217,52,43,.34)}.pay-button:disabled,.confirm-pay:disabled{background:#d8cfce;box-shadow:none;transform:none;filter:none;cursor:not-allowed}.shortcut{text-align:center;color:#9a9f9c;font-size:10px;margin:8px 0 0}
.modal-backdrop{position:fixed;inset:0;background:rgba(45,14,12,.5);backdrop-filter:blur(4px);display:grid;place-items:center;z-index:20;padding:20px;overflow-x:hidden;max-width:100vw}#discountModal,#voidSaleModal,#svcHistoryDetailModal{z-index:25}.modal{width:min(440px,100%);max-width:100%;min-width:0;box-sizing:border-box;background:var(--paper);border-radius:22px;padding:28px;box-shadow:0 28px 80px rgba(50,15,13,.28);position:relative;animation:pop .22s ease;overflow-x:hidden}.small-modal{width:min(380px,100%)}.about-rows{margin:18px 0}.update-version-rows{margin:14px 0 16px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#faf9f6}.update-version-rows>div{display:flex;justify-content:space-between;align-items:center;padding:7px 0;gap:10px}.update-version-rows>div+div{border-top:1px dashed var(--line)}.update-version-rows span{font-size:12px;color:var(--muted)}.update-version-rows b{font-size:14px;color:var(--ink)}.update-version-rows b#updateNewVersion{color:var(--green)}.about-rows>div{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);gap:10px}.about-rows>div:last-child{border-bottom:0}.about-rows span{font-size:12px;color:var(--muted)}.about-rows b{font-size:13px;text-align:right}.about-version-link{font-size:13px;font-weight:700;color:var(--ink);text-align:right;border:0;background:transparent;padding:0;font-family:inherit;cursor:pointer;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}.about-version-link:hover{color:var(--green)}.about-rows a{color:var(--green);font-weight:700;text-decoration:none}.about-update-status{font-size:12px;color:var(--muted);text-align:center;margin:10px 0 0;min-height:15px}.version-detail-date{font-size:11px;color:var(--muted);margin:2px 0 16px}.version-detail-notes{margin:0;padding-left:18px;font-size:13px;color:#3d4841;line-height:1.7}.update-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#e0473f;margin-left:7px;vertical-align:middle;box-shadow:0 0 0 2px #fff}@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}.modal-close{position:absolute;right:18px;top:16px;border:0;background:var(--tint);border-radius:50%;width:30px;height:30px;font-size:20px;color:var(--green2);z-index:5}.modal-close:hover{background:var(--tint-strong)}.discount-options{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:22px}.discount-options button{border:1px solid var(--line);background:white;border-radius:12px;padding:14px;color:var(--ink)}.discount-options button:hover{border-color:var(--green);color:var(--green)}.payment-total{font-size:42px;font-weight:700;color:var(--green);margin:8px 0 18px}.payment-tabs{display:grid;grid-template-columns:repeat(3,1fr);background:#eeece6;padding:3px;border-radius:9px;margin-bottom:18px}.payment-tabs button{border:0;border-radius:7px;padding:8px;background:transparent;color:#8b918e}.payment-tabs button.active{background:white;color:var(--green);box-shadow:0 2px 7px #d9d6cd}.cash-label{font-size:12px;color:var(--muted)}.cash-label input{display:block;width:100%;font-size:36px;font-weight:700;border:1px solid var(--line);border-radius:12px;padding:16px 16px;margin-top:5px;outline:0}.cash-label input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--tint)}.quick-cash{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}.quick-cash button{border:1px solid var(--line);background:#faf9f5;border-radius:8px;padding:7px 12px;font-size:12px}.change-row{display:flex;justify-content:space-between;background:var(--tint);border-radius:10px;padding:12px;margin-top:18px;color:var(--green2)}.confirm-pay{justify-content:center}.success-view{text-align:center}.success-icon{width:68px;height:68px;border-radius:50%;background:#dff1e8;color:#1e8a5d;display:grid;place-items:center;font-size:36px;margin:8px auto 16px}.success-view h2{font-size:29px}.receipt-summary{background:#f3f1eb;border-radius:12px;padding:14px;margin:22px 0;text-align:left}.receipt-summary span{display:flex;justify-content:space-between;font-size:12px;padding:5px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:#18231f;color:white;border-radius:9px;padding:10px 16px;font-size:12px;opacity:0;pointer-events:none;transition:.25s;z-index:30}.toast.show{opacity:1;transform:translate(-50%,0)}
.global-kb{position:fixed;left:0;right:0;bottom:0;z-index:650;background:#eeece6;border-top:1px solid var(--line);box-shadow:0 -8px 26px rgba(20,20,15,.18);padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));animation:kb-slide-up .16s ease}
@keyframes kb-slide-up{from{transform:translateY(100%)}to{transform:translateY(0)}}
.global-kb-body{max-width:820px;margin:0 auto}
.global-kb-row{display:flex;gap:5px;margin-bottom:5px}
.global-kb-row:last-child{margin-bottom:0}
.global-kb-row button{flex:1;min-width:0;height:44px;border:1px solid var(--line);background:#fff;border-radius:8px;font-size:15px;font-weight:600;color:var(--ink);font-family:inherit;cursor:pointer}
.global-kb-row button:active{background:#e7e5df;transform:scale(.95)}
.global-kb-controls{display:flex;gap:5px}
.global-kb-controls button{height:44px;border:0;background:#dedbd2;color:var(--ink);border-radius:8px;font-weight:700;font-size:12px;font-family:inherit;cursor:pointer}
.global-kb-controls button.kb-active{background:var(--green);color:#fff}
.global-kb-controls .kb-shift{flex:1.3}
.global-kb-controls .kb-lang{flex:1.3}
.global-kb-controls .kb-symbols{flex:1.3}
.global-kb-controls .kb-space{flex:2.6}
.global-kb-controls .kb-back{flex:1.3;color:#b5524b;background:#f4dedb}
.global-kb-controls .kb-enter{flex:1.6;background:var(--green);color:#fff}
.global-kb-numeric .global-kb-body{max-width:340px}
.global-kb-numeric .global-kb-row button{height:52px;font-size:20px}
.global-kb-numeric .kb-back,.global-kb-numeric .kb-clear{background:#f4dedb;color:#b5524b}
.global-kb-numeric .kb-enter{background:var(--green);color:#fff}
html.kb-open #adminModal.modal-backdrop,html.kb-open .modal-backdrop:not(#paymentModal){align-items:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(var(--kb-height, 280px) + 16px)}
html.kb-open #adminModal .admin-modal,html.kb-open .modal:not(.payment-modal){max-height:calc(100dvh - var(--kb-height, 280px) - 40px);margin-top:max(12px,env(safe-area-inset-top,0px))}
html.kb-open .global-kb{z-index:100030}
@media(max-width:1100px){.product-grid{grid-template-columns:repeat(3,1fr)}main{grid-template-columns:minmax(0,1fr) 370px}.top-actions .status{display:none}}
@media(max-width:820px){.app-shell{height:auto;min-height:100vh;overflow:visible}.topbar{padding:10px 14px;height:auto;gap:10px}.date-box{display:block;text-align:right;flex-shrink:0}.date-box #today,.date-box #clock{display:none}.date-box .sub-days-left{display:none!important}main{display:block}.catalog{padding:22px 16px;overflow:visible}.catalog-head{display:block}.search{width:100%;margin-top:16px}.product-grid{grid-template-columns:repeat(2,1fr)}.checkout{border-left:0;border-top:1px solid var(--line);min-height:600px}.brand{min-width:0;flex-shrink:1;gap:9px}.brand-mark{width:40px;height:40px;flex:none}.brand strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px}.brand span{display:none}.top-actions{gap:8px;min-width:0}.admin-menu-toggle span{margin:0}.user-button{border:0;padding:0;display:block}.user-button span,.user-button small{display:none}.user-button em{margin:0}}
@media(max-width:420px){.product-grid{gap:9px}.product-card{padding:9px}.product-visual{height:68px;font-size:32px}.product-card h3{font-size:15px}.product-foot b{font-size:20px}.catalog h1{font-size:24px}.checkout{min-height:100vh}}
.login-screen{position:fixed;inset:0;z-index:1100;background:linear-gradient(135deg,#fbe6e3,#fdf4f2 55%,#f8dedb);display:grid;place-items:center;padding:24px;overflow:auto}.login-screen::before,.login-screen::after{content:"";position:fixed;border-radius:50%;filter:blur(1px);opacity:.5}.login-screen::before{width:380px;height:380px;background:#f0a9a2;left:-130px;top:-130px}.login-screen::after{width:300px;height:300px;background:#f6c9a0;right:-90px;bottom:-110px}.login-card{width:min(520px,100%);background:rgba(255,255,255,.95);border:1px solid rgba(255,255,255,.8);border-radius:26px;padding:30px;box-shadow:0 30px 90px rgba(90,20,16,.18);position:relative;z-index:1}.login-intro-head{display:flex;align-items:center;gap:14px}.login-logo-mark{flex:none;display:block;line-height:0;border-radius:18px;box-shadow:0 8px 22px rgba(217,52,43,.24)}.login-logo-mark img{display:block;width:64px;height:64px;border-radius:18px}.login-intro-titles{min-width:0;flex:1}.login-intro-titles .eyebrow{margin:0 0 4px}.login-intro-titles h1{margin:0}.login-logo-tag{display:block;font-size:11px;color:var(--muted);margin-top:4px}.login-brand{display:flex;align-items:center;gap:11px;padding-bottom:22px;border-bottom:1px solid var(--line)}.login-brand strong,.login-brand span{display:block}.login-brand span{font-size:11px;color:var(--muted)}.login-intro{margin:0 0 17px;padding-bottom:20px;border-bottom:1px solid var(--line)}.login-intro h1{font-size:30px;margin:0}.login-intro>p:last-child{font-size:13px;color:var(--muted);margin:5px 0}.role-picker{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:20px}.role-choice{border:1px solid var(--line);background:#faf9f5;border-radius:12px;padding:11px 6px;color:var(--ink)}.role-choice span,.role-choice b,.role-choice small{display:block}.role-choice span{font-size:22px;margin-bottom:3px}.role-choice b{font-size:12px}.role-choice small{font-size:9px;color:var(--muted)}.role-choice.active{border-color:var(--green);background:var(--tint);box-shadow:0 0 0 2px var(--tint-strong)}.login-card form label{display:block;font-size:12px;font-weight:600;margin-top:12px;position:relative}.login-card form input{display:block;width:100%;height:47px;border:1px solid var(--line);background:white;border-radius:10px;padding:0 13px;margin-top:5px;outline:0}.login-card form input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--tint)}.show-password{position:absolute;right:8px;bottom:8px;border:0;background:var(--tint);border-radius:6px;padding:5px 8px;font-size:10px;color:var(--green2)}.login-error{font-size:11px;color:#b5524b;background:#fbecea;padding:8px 10px;border-radius:7px;margin:10px 0 0}.login-submit{width:100%;height:50px;border:0;background:linear-gradient(135deg,var(--green),var(--green2));color:white;border-radius:12px;margin-top:17px;padding:0 16px;font-weight:700;display:flex;justify-content:center;gap:10px;align-items:center;box-shadow:0 8px 20px rgba(217,52,43,.28)}.login-submit:hover{filter:brightness(1.06);transform:translateY(-1px)}.login-submit span{font-size:20px}.demo-account{margin-top:16px;background:#f2f0ea;border-radius:9px;padding:9px 10px;display:flex;gap:8px;align-items:center;font-size:10px;color:var(--muted)}.demo-account code{color:var(--green);font-weight:700;flex:1}.demo-account button{border:0;background:transparent;color:var(--green);font-size:10px;font-weight:600}.login-demo-bar{margin-top:4px}.demo-login-btn{width:100%;border:1px solid #b8dcc8;background:linear-gradient(135deg,#f0faf4,#fff);color:#1a6b42;border-radius:12px;padding:12px 14px;display:grid;grid-template-columns:36px 1fr 24px;align-items:center;text-align:left;cursor:pointer;transition:filter .16s ease,transform .16s ease}.demo-login-btn:hover{filter:brightness(1.03);transform:translateY(-1px)}.demo-login-btn:disabled{opacity:.6;cursor:wait;transform:none}.demo-login-ico{width:36px;height:36px;display:grid;place-items:center;background:#dcfce7;border-radius:10px;font-size:14px;color:#15803d}.demo-login-btn b,.demo-login-btn small{display:block}.demo-login-btn b{font-size:14px;color:#145c3f}.demo-login-btn small{font-size:10px;color:var(--muted);margin-top:2px}.demo-login-btn em{font-size:19px;font-style:normal;color:#15803d}.demo-quick-login{margin-top:14px;text-align:center}.demo-quick-login .login-submit{margin-top:0;background:linear-gradient(135deg,#2d8a5e,#1f6b47);box-shadow:0 8px 20px rgba(31,107,71,.28)}.demo-quick-meta{margin:8px 0 0;font-size:11px;color:var(--muted);letter-spacing:.02em}.login-card form input:read-only{background:#f7f5ef;color:var(--muted)}.guest-divider{height:25px;display:flex;align-items:center;color:#a2a7a4;font-size:10px}.guest-divider::before,.guest-divider::after{content:"";height:1px;background:var(--line);flex:1}.guest-divider span{padding:0 9px}.guest-button{width:100%;border:1px solid var(--tint-strong);background:var(--tint);color:var(--green);border-radius:12px;padding:11px 13px;display:grid;grid-template-columns:30px 1fr 20px;align-items:center;text-align:left}.guest-button>span{font-size:20px}.guest-button b,.guest-button small{display:block}.guest-button b{font-size:13px}.guest-button small{font-size:10px;color:var(--muted)}.guest-button em{font-size:19px;font-style:normal}.guest-button:hover{background:var(--tint-strong)}.account-menu{position:fixed;z-index:50;right:20px;top:73px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:12px;box-shadow:var(--shadow);width:190px}.account-menu div{padding:2px 5px 10px;border-bottom:1px solid var(--line)}.account-menu b,.account-menu small{display:block}.account-menu small{color:var(--muted)}.account-menu button{border:0;background:#f9ecea;color:#a8524d;border-radius:7px;width:100%;padding:8px;margin-top:8px;text-align:left}.customer-mode .product-meta button,.customer-mode .shortcut{display:none}@media(max-width:540px){.login-card{padding:22px 16px}.role-picker{gap:5px}.role-choice{padding:9px 2px}.demo-account span{display:none}}
.admin-menu-wrap{position:relative;display:flex;align-items:center}.admin-menu-toggle{display:flex;align-items:center;gap:8px;min-height:42px;border:1px solid #a9c8bb;background:var(--menubar-bg,#edf5f1);color:var(--green);border-radius:13px;padding:8px 16px;font-size:13px;font-weight:600}.admin-menu-toggle span{font-size:17px}.admin-menu-toggle:hover{background:white;box-shadow:0 3px 9px rgba(20,60,45,.12)}.admin-menu-toggle.active{background:var(--green);color:white;border-color:var(--green)}.admin-menubar{display:none;flex-direction:column;gap:2px;position:absolute;top:calc(100% + 8px);left:0;z-index:50;background:var(--paper,#fff);border:1px solid var(--line);border-radius:13px;padding:6px;box-shadow:var(--shadow,0 12px 30px rgba(20,60,45,.18));min-width:200px}.admin-menubar.open{display:flex}.admin-menubar button{min-height:42px;border:0;background:transparent;color:var(--green);border-radius:9px;padding:8px 14px;font-size:13px;font-weight:600;text-align:left;width:100%}.admin-menubar button span{font-size:17px;margin-right:6px}.admin-menubar button:hover{background:var(--menubar-bg,#edf5f1)}.admin-modal{width:min(760px,100%);max-height:90vh;overflow:auto}.admin-tabs{display:flex;border-bottom:1px solid var(--line);margin:20px 0;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.admin-tabs button{border:0;background:transparent;padding:10px 18px;color:var(--muted);border-bottom:2px solid transparent}.admin-tabs button.active{color:var(--green);border-color:var(--green);font-weight:600}.admin-toolbar{display:flex;justify-content:space-between;align-items:end;gap:12px;margin-bottom:13px}.admin-toolbar label,.settings-form label,.product-form label{font-size:11px;color:var(--muted);font-weight:600;display:block}.admin-toolbar input,.settings-form input,.product-form input,.product-form select{display:block;border:1px solid var(--line);border-radius:8px;padding:9px 10px;margin-top:4px;outline:0;background:white;width:100%}.product-form select{cursor:pointer}.product-form #productUnitCustom{margin-top:6px}.admin-toolbar button:not(.search-scan){border:0;background:var(--green);color:white;border-radius:8px;padding:10px 14px}.admin-search-related{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px}.admin-search-related-label{font-size:10px;color:var(--muted);margin-right:2px}.admin-search-related-chip{border:1px solid var(--line);background:#f7f5ef;border-radius:999px;padding:5px 10px;font-size:10px;color:var(--green);font-weight:600}.admin-search-related-chip:active{transform:scale(.97)}.admin-search-hit{background:#fff0a8;color:#145c3f;border-radius:3px;padding:0 2px;font-weight:700;box-decoration-break:clone;-webkit-box-decoration-break:clone}.admin-product-list{border:1px solid var(--line);border-radius:12px;overflow:auto;max-height:min(56vh,520px);-webkit-overflow-scrolling:touch}.admin-product-pager{display:flex;align-items:center;justify-content:center;gap:10px;margin:10px 0 4px;flex-wrap:wrap}.admin-product-pager button{border:1px solid var(--line);background:white;border-radius:8px;padding:8px 12px;font-size:11px;color:var(--green);font-weight:600}.admin-product-pager button:disabled{opacity:.45;cursor:not-allowed;color:var(--muted)}.admin-product-pager span{color:var(--muted);font-size:10px;text-align:center}.admin-product{display:grid;grid-template-columns:42px 1fr 100px 85px 70px;gap:10px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line);font-size:12px}.admin-product:last-child{border:0}.admin-product>span:first-child{width:38px;height:38px;display:grid;place-items:center;border-radius:8px;font-size:22px}.admin-product b,.admin-product small{display:block}.admin-product small{color:var(--muted)}.admin-product-actions{display:flex;gap:5px}.admin-product-actions button{border:1px solid var(--line);background:white;border-radius:6px;padding:5px 7px}.admin-product-actions button:last-child{color:#b5524b}.settings-form{max-width:480px}.settings-form label{margin:12px 0}.settings-form input[type=color]{height:43px;padding:4px}.reset-settings{width:100%;border:0;background:transparent;color:#a65852;padding:10px}.danger-zone{margin-top:18px;border:1px solid #f0c9c5;background:#fdf3f2;border-radius:12px;padding:14px}.danger-zone>b{display:block;font-size:13px;color:#b5352d}.danger-zone>small{display:block;font-size:10px;color:#9a6864;margin:4px 0 10px}.danger-button{width:100%;border:0;background:#c0392b;color:#fff;border-radius:10px;padding:12px;font-weight:700;box-shadow:0 6px 16px rgba(192,57,43,.26)}.danger-button:hover{background:#a93226}.clear-data-confirm-hint{font-size:12px;color:var(--muted);margin:14px 0 6px}.clear-data-confirm-input{width:100%;border:1px solid var(--line);border-radius:9px;padding:11px 12px;text-align:center;font-size:15px;outline:0;margin-bottom:4px}.clear-data-confirm-input:focus{border-color:#c0392b;box-shadow:0 0 0 3px #fbe4e2}#confirmClearData{background:#c0392b!important;border-color:#c0392b!important;color:#fff}#confirmClearData:disabled{background:#e6bdb8!important;border-color:#e6bdb8!important;cursor:not-allowed}.form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.product-form label{margin-top:13px}.profit-margin-badge{display:inline-block;font-style:normal;font-weight:700;font-size:10px;padding:2px 8px;border-radius:20px;margin-left:6px;vertical-align:middle;background:#fae8e5;color:#b5524b}.profit-margin-badge.margin-mid{background:#fdf1de;color:#a5690f}.profit-margin-badge.margin-high{background:#e7f5ec;color:#0c8a3c}.product-modal{width:min(520px,100%);max-height:90vh;overflow:auto}.confirm-modal{width:min(360px,100%);text-align:center}.warning-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#fae8e5;color:#b5524b;font-size:26px;font-weight:700;margin:0 auto 12px}.confirm-modal p{font-size:12px;color:var(--muted)}.confirm-modal>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.confirm-modal button{border:1px solid var(--line);background:white;border-radius:8px;padding:10px}.confirm-modal #confirmDelete{background:#b5524b;border-color:#b5524b;color:white}.confirm-modal #confirmAppUpdate{background:var(--green);border-color:var(--green);color:white}@media(max-width:720px){.form-grid{grid-template-columns:1fr}}
.tax-toolbar{display:flex;justify-content:space-between;align-items:end;flex-wrap:wrap;gap:8px;margin-bottom:14px}.tax-toolbar label{font-size:11px;color:var(--muted);min-width:0;flex:1 1 140px}.tax-toolbar input{display:block;width:100%;max-width:100%;min-width:0;border:1px solid var(--line);border-radius:8px;padding:8px;margin-top:4px;box-sizing:border-box}.tax-toolbar button{border:0;background:var(--green);color:white;border-radius:8px;padding:10px 13px;flex:0 0 auto}.purchase-ocr-row{margin:0 0 12px}.purchase-ocr-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:42px;border:1px dashed #b9d1c7;background:#f4faf7;color:var(--green);border-radius:10px;padding:10px 14px;font-size:13px;font-weight:600;cursor:pointer}.purchase-ocr-btn:hover{background:#edf5f1}.purchase-ocr-btn:disabled{opacity:.55;cursor:wait}.purchase-ocr-preview{display:block;margin:0 0 12px;font-size:11px;color:var(--muted)}.purchase-ocr-preview textarea{width:100%;margin-top:6px;border:1px solid var(--line);border-radius:8px;padding:8px;font-size:11px;line-height:1.45;resize:vertical;min-height:88px;background:#fafaf8;color:#333}.purchase-amount-sync-toggle{margin:0 0 10px!important;padding:10px 11px!important}.purchase-credit-note-toggle{margin:0 0 10px!important;padding:10px 11px!important}.purchase-fresh-food-toggle{margin:0 0 10px!important;padding:10px 11px!important}.purchase-amount-grid .hidden{display:none!important}.tax-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tax-summary article{background:#f4f2ec;border-radius:10px;padding:12px}.tax-summary span,.tax-summary b,.tax-summary small{display:block}.tax-summary span{font-size:10px;color:var(--muted)}.tax-summary b{font-size:17px;margin:4px 0;color:var(--green)}.tax-summary small{font-size:9px;color:#959b98}.tax-summary .tax-net{background:var(--green);color:white}.tax-summary .tax-net span,.tax-summary .tax-net b,.tax-summary .tax-net small{color:white}.tax-section-title{display:flex;flex-direction:column;gap:3px;min-width:0}
.tax-section-note{display:block;color:var(--muted);font-size:9px;line-height:1.45;font-weight:400}
.tax-daily-row{cursor:pointer}
.tax-daily-row.expanded td{background:color-mix(in srgb,var(--tint) 45%,#fff)}
.tax-daily-row td:first-child{font-weight:600;color:var(--green)}
.tax-day-toggle{border:0;background:transparent;color:var(--green);font-weight:700;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px;padding:0;font-size:inherit;cursor:pointer;font-family:inherit;white-space:nowrap}
.tax-day-toggle:hover{color:var(--green2)}
.tax-day-detail td{padding:0!important;background:#faf8f5;border-bottom:1px solid var(--line)!important}
.tax-day-detail-panel{padding:8px 10px 10px;max-height:min(420px,60vh);overflow:auto;-webkit-overflow-scrolling:touch}
.tax-day-detail-table{width:100%;font-size:9px;border-collapse:collapse}
.tax-day-detail-table th,.tax-day-detail-table td{padding:6px 8px;border-bottom:1px solid #ece6e4;text-align:left;white-space:nowrap}
.tax-day-detail-table th{background:#f0ece8;color:var(--muted);font-weight:600}
.tax-day-detail-table td:nth-last-child(-n+5),.tax-day-detail-table th:nth-last-child(-n+5){text-align:right}
.tax-day-detail-table tbody tr:last-child td{border-bottom:0}.tax-section-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin:20px 0 8px;min-width:0}.tax-section-head h3{font-size:14px;margin:0}.tax-section-head button{border:1px solid var(--line);background:white;border-radius:7px;padding:6px 9px;font-size:10px}.tax-section-actions{display:flex;gap:6px}.tax-section-head select{border:1px solid var(--line);background:white;border-radius:7px;padding:6px 9px;font-size:10px}.tax-table-wrap{border:1px solid var(--line);border-radius:9px;overflow:auto}.tax-table-wrap table{border-collapse:collapse;width:100%;font-size:10px;white-space:nowrap}.tax-table-wrap th,.tax-table-wrap td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}.tax-table-wrap th{background:#f4f2ec;color:var(--muted)}.tax-table-wrap td:nth-last-child(-n+3),.tax-table-wrap th:nth-last-child(-n+3){text-align:right}#saleTaxTableWrap td:nth-child(n+5),#saleTaxTableWrap th:nth-child(n+5){text-align:right}#purchaseTaxTableWrap td:nth-child(n+3),#purchaseTaxTableWrap th:nth-child(n+3){text-align:right}#issuedTaxInvoiceTableWrap td:last-child,#issuedTaxInvoiceTableWrap th:last-child{text-align:right}#issuedTaxInvoiceTableWrap .tax-buyer-cell{max-width:160px;overflow:hidden;text-overflow:ellipsis;text-align:left!important}#issuedTaxInvoiceTableWrap .tax-buyer-edit{border:0;background:transparent;padding:0;margin:0;font:inherit;color:var(--ink);font-weight:600;text-align:left;cursor:pointer;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}#issuedTaxInvoiceTableWrap .tax-buyer-edit:hover{color:var(--green)}#saleTaxTableWrap td:last-child{color:var(--green);font-weight:700}#salesReportTableWrap td:nth-child(n+3),#salesReportTableWrap th:nth-child(n+3){text-align:right}#salesReportTableWrap td:last-child{color:var(--green);font-weight:700}.tax-table-total{background:#f4f2ec;font-weight:700}.tax-doc-link{border:0;background:transparent;color:var(--green);font-weight:600;text-decoration:underline;padding:0;font-size:inherit;cursor:pointer}.sale-item-detail{white-space:normal;min-width:180px;max-width:340px}.sale-item-detail b{display:block;font-size:10px;margin-bottom:2px}.sale-item-detail small{display:block;font-size:9px;line-height:1.4;color:#777;white-space:normal}.sale-payment-cell{white-space:normal;min-width:88px;max-width:140px;font-size:9px;line-height:1.4;color:#555}.sale-item-group-head td{border-top:2px solid #e3e0d8}.sale-item-group-head+tr td,.sale-item-group-head~tr:not(.sale-item-group-head) td{border-top:0}.tax-table-total td{border-top:2px solid var(--green)!important}.tax-table-wrap tbody tr:last-child td{border:0}.tax-table-wrap .no-data{text-align:center!important;color:var(--muted);padding:18px}.table-pager{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:10px 0 4px;padding:0 4px}.table-pager.hidden{display:none}.table-pager-btn{min-width:32px;height:32px;border:1px solid var(--line);background:white;border-radius:8px;font-size:11px;font-weight:600;color:var(--ink);cursor:pointer;padding:0 8px}.table-pager-btn.active{background:var(--green);border-color:var(--green);color:white}.delete-tax{border:0;background:transparent;color:#b5524b}.edit-tax{border:0;background:transparent;color:var(--green);font-weight:600}.tax-day-actions{display:flex;gap:8px;justify-content:flex-end;white-space:nowrap}.edit-sale{border:0;background:transparent;color:var(--green);font-weight:600}.receipt-no-cell{cursor:pointer;color:var(--green);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px}.receipt-no-cell:hover{color:var(--green2)}
.barcode-print-panel{max-width:900px}.barcode-print-layout{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start}.barcode-print-controls{min-width:0}.barcode-a4-preview{border:1px solid var(--line);border-radius:12px;padding:12px;background:#f7f6f2}.barcode-a4-preview>b{display:block;font-size:11px;color:var(--muted);font-weight:600;margin-bottom:8px}.a4-scale-wrap{width:100%;max-width:100%;display:flex;justify-content:center;background:#e9e7e0;border:1px solid var(--line);border-radius:6px;padding:6px 0;overflow-x:auto;-webkit-overflow-scrolling:touch}.a4-sheet{width:210mm;min-height:297mm;background:white;box-shadow:0 2px 10px rgba(0,0,0,.1);display:flex;flex-wrap:wrap;align-content:flex-start;padding:4mm;zoom:.34}.a4-sheet .label{width:38mm;height:26mm;margin:1.5mm;box-sizing:border-box;border:1px solid #999;border-radius:2px;background:#fff;display:flex;flex-direction:column;overflow:hidden}.a4-sheet .label-top{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2px 2px 1px}.a4-sheet .pname{font-size:8px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;max-width:100%}.a4-sheet .price{font-size:24px;font-weight:800;line-height:1.1;margin:1px 0}.a4-sheet .price small{font-size:9px;font-weight:600;margin-left:2px}.a4-sheet .label-bottom{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:1.2px 2px}.a4-sheet .label-bottom.label-yellow{background:#ffe600}.a4-sheet .label-bottom.label-red{background:#e0342b}.a4-sheet .barcode-wrap{width:94%;display:flex;flex-direction:column;align-items:center;gap:.5mm}.a4-sheet .barcode-svg{display:block;width:100%;height:7.4mm;max-width:none;flex:none}.a4-sheet .barcode-value{width:100%;text-align:center;font-size:6.5px;font-weight:700;line-height:1;background:#fff;color:#111;border-radius:1px;padding:.2mm 0}.a4-sheet .label-bottom.label-yellow .barcode-value,.a4-sheet .label-bottom.label-red .barcode-value{background:#fff}.a4-sheet svg{width:100%;height:auto}@media(max-width:820px){.barcode-print-layout{grid-template-columns:1fr}}.barcode-cart-list{display:grid;gap:8px;margin-top:12px}.barcode-cart-item{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:9px 11px}.barcode-cart-item-info b{display:block;font-size:13px}.barcode-cart-item-info small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.qty-stepper{display:flex;align-items:center;gap:8px}.qty-stepper button{width:26px;height:26px;border:1px solid var(--line);background:white;border-radius:7px;font-weight:700;color:var(--green)}.qty-stepper span{min-width:18px;text-align:center;font-weight:700}.cart-item-remove{border:0;background:#fae8e5;color:#b5524b;border-radius:7px;width:26px;height:26px;font-weight:700}.barcode-print-options{border:1px solid var(--line);border-radius:12px;padding:14px;margin-top:14px}.barcode-print-options>label{display:block;font-size:11px;color:var(--muted);font-weight:600;margin-bottom:8px}.barcode-color-picker{display:flex;gap:8px;margin-bottom:14px}.color-choice{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);background:white;border-radius:9px;padding:9px 6px;font-size:12px;font-weight:600;color:var(--ink)}.color-choice.active{border-color:var(--green);background:var(--tint);color:var(--green)}.color-choice .swatch{width:14px;height:14px;border-radius:4px;border:1px solid rgba(0,0,0,.12)}.swatch-yellow{background:#ffe600}.swatch-red{background:#e0342b}.swatch-none{background:#fff}.print-sale{border:0;background:transparent;color:var(--muted);font-weight:600;margin-right:8px}.void-sale{border:0;background:transparent;color:#b5524b;font-weight:600;margin-left:8px}.voided-row{opacity:.65}.voided-row td{text-decoration:line-through}.voided-row td:last-child{text-decoration:none}.voided-tag{text-decoration:none;display:inline-block;background:#fae8e5;color:#b5524b;border-radius:20px;padding:3px 10px;font-size:9px;font-weight:700;margin-right:8px}.void-sale-warning{font-size:11px;color:#a05f2b;background:#fff6e5;border-radius:8px;padding:9px 11px;margin:12px 0}.sales-report-search{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 11px;margin-bottom:10px;outline:0;background:white}.sales-report-search:focus{border-color:#6b9b89;box-shadow:0 0 0 3px #dfede8}@media(max-width:720px){.tax-summary{grid-template-columns:repeat(2,1fr)}}
.sale-edit-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin:10px 0}.sale-edit-items{border:1px solid var(--line);border-radius:12px;padding:0 14px;max-height:220px;overflow:auto;margin-bottom:12px}.sale-edit-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid #eeece5}.sale-edit-row:last-child{border:0}.sale-edit-row-info{flex:1;min-width:0}.sale-edit-row-info h4{font-size:13px;margin:0;line-height:1.3;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere;word-break:break-word;white-space:normal}.sale-edit-row-info p{font-size:11px;color:var(--muted);margin:1px 0 0}.sale-edit-row-price{text-align:right}.sale-edit-row-price b{font-size:13px;display:block}.sale-edit-row-price button{border:0;background:transparent;color:#aaa;font-size:18px;display:block;margin:4px 0 0 auto;padding:0}.sale-edit-add{margin-bottom:10px}#saleEditModal .gift-list{margin:0 0 10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fffaf0}.sale-edit-breakdown{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:10px;background:#faf9f6}.sale-edit-breakdown .sum-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:11px;padding:4px 0;color:var(--ink)}.sale-edit-breakdown .sum-row b{font-size:12px}.sale-edit-breakdown .sum-row.muted{color:var(--muted)}.sale-edit-breakdown .sum-row.muted small{font-weight:400;font-size:9px}.sale-edit-breakdown .sale-edit-summary{display:flex;justify-content:space-between;align-items:center;margin-top:8px;padding-top:8px;border-top:1px dashed var(--line);background:transparent;border-radius:0;padding-left:0;padding-right:0;color:var(--green)}.sale-edit-summary{display:flex;justify-content:space-between;align-items:center;background:#edf5f1;border-radius:10px;padding:12px;margin-top:14px;color:var(--green)}.sale-edit-summary b{font-size:20px}
.vat-toggle{display:flex!important;align-items:center;gap:10px;background:#f4f2ec;border-radius:10px;padding:11px;margin-top:16px!important;cursor:pointer}.vat-toggle>input{display:none!important}.vat-toggle>span{width:38px;height:22px;border-radius:20px;background:#bbc2be;position:relative;flex:none}.vat-toggle>span::after{content:"";position:absolute;width:16px;height:16px;background:white;border-radius:50%;left:3px;top:3px;transition:.2s}.vat-toggle>input:checked+span{background:var(--green)}.vat-toggle>input:checked+span::after{left:19px}.vat-toggle b,.vat-toggle small{display:block}.vat-toggle b{font-size:12px;color:var(--ink)}.vat-toggle small{font-size:9px;font-weight:400}.vat-chip{font-size:8px!important;background:#e8f2ee;color:var(--green)!important;border-radius:4px;padding:1px 4px;display:inline-block!important;margin-left:4px}.vat-chip.exempt{background:#f2eee5;color:#8a7358!important}.linked-tag{color:var(--green)!important;font-weight:600}
@media print{body>*{display:none!important}#adminModal{display:block!important;position:static;background:white}.admin-modal>*{display:none!important}.admin-modal #adminTax{display:block!important}.tax-toolbar,.admin-tabs,.tax-section-head button,.delete-tax,.edit-tax,.edit-sale,.print-sale,.void-sale{display:none!important}.admin-modal{width:100%;max-height:none;box-shadow:none}.tax-table-wrap{overflow:visible}}
.member-modal{width:min(520px,calc(100% - 20px));padding:28px 28px 24px!important;height:fit-content;align-self:center}.member-modal h2{font-size:25px;margin:0 0 8px;line-height:1.2}#memberLookupView>.eyebrow,#memberRegisterView>.eyebrow,#memberProfileView .member-profile-head .eyebrow{margin:0 0 2px;font-size:11px}#memberLookupView>h2{font-size:21px;margin:0 0 4px;line-height:1.2}#memberRegisterView>h2{margin:0 0 12px}#memberRegisterView .product-form{margin:0}#memberRegisterView .product-form label{margin:0 0 10px!important;font-size:11px!important;color:var(--muted)}#memberRegisterView .product-form label input{height:44px!important;margin-top:5px;border-radius:10px;font-size:16px;box-sizing:border-box}#memberRegisterView .login-submit{height:48px!important;margin-top:4px;border-radius:12px;font-size:14px}#memberRegisterView .reset-settings{margin:8px 0 0;padding:6px 0;font-size:12px;width:100%}.member-lead{font-size:11px;color:var(--muted);margin:0 0 14px;line-height:1.35}.member-modal form>label{display:block;font-size:11px;font-weight:600;color:var(--muted);margin:0!important}.member-modal form>label input{display:block;width:100%;height:44px;border:1px solid var(--line);border-radius:10px;padding:0 11px;margin-top:5px;outline:0;font-size:16px;box-sizing:border-box}.member-error{background:#fbecea;color:#b5524b;font-size:11px;padding:8px;border-radius:7px;margin:6px 0 0}.member-profile-head{display:flex;align-items:center;gap:12px}.member-avatar{width:48px;height:48px;border-radius:50%;background:#e5efe9;color:var(--green);display:grid;place-items:center;font-size:20px;font-weight:700}.member-profile-head small{color:var(--muted)}.points-card{background:linear-gradient(135deg,var(--green),var(--green2));color:white;border-radius:14px;padding:14px 16px;margin:14px 0}.points-card span,.points-card b,.points-card small{display:block}.points-card span,.points-card small{font-size:10px;opacity:.75}.points-card b{font-size:17px;margin:3px 0}.points-card em{font-size:30px;font-style:normal}.reward-title{font-size:13px;margin:0 0 8px}.reward-list{display:grid;gap:8px}.reward{border:1px solid var(--line);background:white;border-radius:10px;padding:10px 12px;display:grid;grid-template-columns:38px 1fr auto;align-items:center;text-align:left}.reward>span{font-size:23px}.reward b,.reward small{display:block}.reward b{font-size:12px}.reward small{font-size:9px;color:var(--muted)}.reward em{font-size:10px;font-style:normal;color:var(--green);font-weight:600}.reward:disabled{opacity:.45;cursor:not-allowed}.reward.selected{border-color:var(--green);background:#edf5f1}.member-badge{color:var(--green)!important;font-weight:600!important}
.member-history-list{display:grid;gap:6px;max-height:220px;overflow-y:auto;margin-top:8px}.member-history-row{display:grid;grid-template-columns:1fr auto;gap:2px 10px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:11px}.member-history-row span{grid-column:1;font-weight:600}.member-history-row small{grid-column:1;color:var(--muted);font-size:9px}.member-history-row b{grid-row:1;font-size:13px}.history-plus{color:var(--green)}.history-minus{color:#b5524b}
.member-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:16px}.member-stats article{background:#f4f2ec;border-radius:10px;padding:12px}.member-stats span,.member-stats b,.member-stats small{display:block}.member-stats span,.member-stats small{font-size:9px;color:var(--muted)}.member-stats b{font-size:19px;color:var(--green);margin:3px 0}.admin-member-list{border:1px solid var(--line);border-radius:12px;overflow:hidden}.admin-member-row{display:grid;grid-template-columns:40px 1fr 90px 105px 105px;gap:10px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--line);font-size:11px}.admin-member-row:last-child{border:0}.admin-member-row .member-avatar{width:36px;height:36px;font-size:14px}.admin-member-row b,.admin-member-row small{display:block}.admin-member-row small{color:var(--muted)}.admin-member-actions{display:flex;gap:5px}.admin-member-actions button{border:1px solid var(--line);background:white;border-radius:6px;padding:5px 7px;font-size:10px}.admin-member-actions button:last-child{color:#b5524b}@media(max-width:720px){.member-stats{grid-template-columns:1fr}.admin-member-row{grid-template-columns:36px 1fr 95px}.admin-member-row>span:nth-child(3),.admin-member-row>span:nth-child(4){display:none}}
.brand-mark.has-system-logo,.logo-preview.has-system-logo{background-image:url('icon-96.png')}
.brand-mark.has-logo{background-color:#fff!important;background-size:contain;background-repeat:no-repeat;background-position:center;color:transparent;border:1px solid var(--line);box-shadow:none}.logo-setting{display:flex;align-items:center;gap:14px;background:#f4f2ec;border-radius:12px;padding:12px;margin-bottom:16px}.logo-preview{width:68px;height:68px;border-radius:14px;background:var(--green);color:white;display:grid;place-items:center;font-weight:700;background-size:cover;background-position:center;flex:none}.logo-preview.has-logo{color:transparent;background-color:#fff;border:1px solid var(--line);background-size:contain;background-repeat:no-repeat;background-position:center}.logo-setting b,.logo-setting small{display:block}.logo-setting small{font-size:9px;color:var(--muted);margin-bottom:6px}.logo-setting input{display:none}.upload-logo,.logo-setting button{display:inline-block!important;border:1px solid var(--tint-strong)!important;background:white!important;color:var(--green)!important;border-radius:6px!important;padding:5px 8px!important;margin:0 4px 0 0!important;font-size:9px!important;cursor:pointer}.logo-setting button{color:#a65852!important;border-color:#ddc9c6!important}.theme-colors{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.theme-colors input{height:45px!important;padding:4px!important}
.cash-keypad{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:12px}.cash-keypad button{height:60px;border:1px solid var(--line);background:white;border-radius:10px;font-size:22px;font-weight:600;color:var(--ink);transition:.12s}.cash-keypad button:hover{background:#f2f6f3;border-color:#a7c0b5}.cash-keypad button:active{transform:scale(.96);background:#e5efe9}.cash-keypad .key-action{font-size:11px;color:var(--green);background:#f2f6f3}.cash-keypad .key-done{font-size:11px;color:white;background:var(--green);border-color:var(--green)}.cash-keypad .key-done:hover{background:var(--green2)}
.cash-keypad button > *,.universal-keypad button > *,#memberKeypad button > *,.quick-cash button > *{pointer-events:none}
.promptpay-setting{background:#f4f2ec;border-radius:12px;padding:2px 12px 12px;margin:14px 0}.promptpay-setting .vat-toggle{padding-left:0;padding-right:0}.promptpay-payment{text-align:center;background:#f0f5f8;border:1px solid #d4e1e8;border-radius:13px;padding:16px;margin-top:8px}.promptpay-icon{width:58px;height:58px;border-radius:50%;background:#173c71;color:white;display:grid;place-items:center;font-size:31px;font-weight:700;margin:0 auto 10px}.promptpay-qr{width:190px;height:190px;object-fit:contain;background:white;border-radius:10px;padding:6px;margin:0 auto 8px;box-shadow:0 4px 16px rgba(20,45,70,.1)}.promptpay-payment p{font-size:10px;color:var(--muted);margin:0}.promptpay-payment h3{margin:4px 0 0;font-size:15px}.promptpay-payment>b{display:block;color:#173c71;font-size:14px;letter-spacing:.06em}.promptpay-payment>strong{display:block;color:var(--green);font-size:22px;margin-top:4px}.promptpay-payment small{display:block;color:var(--muted);margin-top:8px;font-size:9px}
.print-promptpay-qr{width:100%;margin-top:12px;border:1px solid #173c71;background:#fff;color:#173c71;border-radius:10px;padding:11px;font-weight:700}.print-promptpay-qr:disabled{opacity:.55;cursor:wait}
.quick-cash-label{display:flex;justify-content:space-between;margin-top:11px;font-size:10px;font-weight:600;color:var(--ink)}.quick-cash-label small{color:var(--muted);font-weight:400}.quick-cash{display:grid!important;grid-template-columns:repeat(4,1fr);gap:6px!important;margin-top:6px!important}.quick-cash button{padding:8px 4px!important;text-align:center;color:var(--green);font-weight:800;font-size:16px}.quick-cash button:last-child{grid-column:span 2}
.custom-discount-form{margin-top:20px}.custom-discount-form label{font-size:11px;color:var(--muted);font-weight:600}.custom-discount-form label>div{display:flex;align-items:center;border:1px solid var(--line);background:white;border-radius:10px;margin-top:5px;padding-left:13px}.custom-discount-form label>div:focus-within{border-color:#6b9b89;box-shadow:0 0 0 3px #dfede8}.custom-discount-form label span{font-size:22px;color:var(--green);font-weight:700}.custom-discount-form input{border:0;outline:0;width:100%;font-size:25px;font-weight:600;padding:10px;background:transparent}.custom-discount-form small{display:block;margin-top:5px;font-size:9px;color:var(--muted)}.discount-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.discount-actions button{border:1px solid var(--line);background:white;border-radius:9px;padding:11px;color:#a65852}.discount-actions button:last-child{background:var(--green);border-color:var(--green);color:white;font-weight:600}
.discount-type{display:grid;grid-template-columns:1fr 1fr;background:#efede7;border-radius:9px;padding:3px;margin-bottom:16px}.discount-type button{border:0;background:transparent;border-radius:7px;padding:8px;color:var(--muted)}.discount-type button.active{background:white;color:var(--green);font-weight:600;box-shadow:0 2px 7px #d9d6cd}.custom-discount-form label em{font-size:21px;font-style:normal;color:var(--green);font-weight:700;padding-right:13px}
.order-info{align-items:center}.order-info .member-select-button{width:100%;display:grid;grid-template-columns:34px 1fr 12px;align-items:center;gap:8px;background:white;border:1px solid var(--tint-strong);border-radius:12px;padding:10px 12px;text-align:left;box-shadow:0 3px 10px rgba(90,20,16,.05)}.member-select-button:hover{background:var(--tint);border-color:var(--green)}.member-select-button em{width:32px;height:32px;border-radius:50%;background:var(--tint-strong);display:grid;place-items:center;font-size:17px;font-style:normal}.member-select-button span,.member-select-button b,.member-select-button small{display:block}.member-select-button b{font-size:12px;color:var(--green)}.member-select-button small{font-size:8px;color:var(--muted);font-weight:400}.member-select-button i{font-style:normal;font-size:22px;color:var(--green)}.member-phone-suggest{display:grid;gap:6px;margin-top:8px}.member-phone-suggest button{border:1px solid var(--tint-strong);background:var(--tint);border-radius:10px;padding:9px 12px;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--ink)}.member-phone-suggest button b{color:var(--green);font-weight:700}.member-phone-suggest button small{color:var(--muted);font-size:9px}
.member-keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0}.member-keypad button{border:1px solid var(--line);background:#fff;border-radius:14px;padding:0;min-height:72px;height:72px;font-size:28px;font-weight:600;color:var(--ink);transition:.1s;box-shadow:0 1px 2px rgba(45,14,12,.04)}.member-keypad button:hover{background:var(--tint)}.member-keypad button:active{transform:scale(.96);background:var(--tint-strong)}.member-keypad button.key-fn{font-size:16px;color:var(--green);background:var(--tint)}.member-main-action{height:48px!important;font-size:14px!important;border-radius:11px!important}@media(max-width:420px){.order-info .member-select-button{min-width:0;width:100%}}
.product-visual.has-image{background-size:cover!important;background-position:center;background-repeat:no-repeat;font-size:0}.product-image-upload{display:flex;align-items:center;gap:13px;background:#f4f2ec;border-radius:11px;padding:11px;margin-top:15px}.product-image-preview{width:76px;height:76px;border-radius:11px;display:grid;place-items:center;background:#e7eee8;font-size:32px;background-size:cover;background-position:center;flex:none}.product-image-upload b,.product-image-upload small{display:block}.product-image-upload small{font-size:9px;color:var(--muted);margin-bottom:7px}.product-image-upload input{display:none}.product-image-upload label,.product-image-upload button{display:inline-block!important;border:1px solid #b9d1c7!important;background:white!important;color:var(--green)!important;border-radius:6px!important;padding:5px 8px!important;margin:0 4px 0 0!important;font-size:9px!important;cursor:pointer}.product-image-upload button{color:#a65852!important;border-color:#ddc9c6!important}#capturePhotoBtn{color:var(--green)!important;border-color:var(--tint-strong)!important}.scanner-camera #photoVideo{width:100%;border-radius:12px;display:block}.admin-product>span:first-child.has-image{background-size:cover!important;background-position:center;font-size:0}
.cart-thumb.has-image{background-size:cover!important;background-position:center;font-size:0}
.product-toolbar-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.admin-toolbar-products{display:flex;flex-direction:column;align-items:stretch;gap:10px}.admin-toolbar-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px}.admin-toolbar-row .admin-search-field{flex:1 1 240px;min-width:0}.admin-toolbar-row .admin-sort-label{flex:0 0 auto;min-width:120px}.admin-toolbar-row-actions{align-items:center;justify-content:space-between;gap:10px}.admin-toolbar .import-product-button{background:#edf5f1;color:var(--green);border:1px solid #b9d1c7}.admin-toolbar .template-button{background:white;color:var(--green);border:1px solid var(--line)}.admin-toolbar .clear-products-button{color:#a8524d;border-color:#e8c5c2}.import-result{font-size:10px;border-radius:8px;padding:8px 10px;margin:-5px 0 10px}.import-replace-label{font-size:11px;display:flex;align-items:center;gap:6px;color:var(--muted);width:auto;margin:0;flex:0 1 auto;white-space:nowrap}.import-result.success{background:#e8f4ee;color:#287552}.import-result.error{background:#fbecea;color:#a8524d}.admin-search-field{display:block;flex:1;min-width:0}@media(max-width:600px){.admin-toolbar:not(.admin-toolbar-products){align-items:stretch;flex-direction:column}.admin-toolbar-products .admin-toolbar-row{flex-direction:column;align-items:stretch}.admin-toolbar .admin-search-field{order:-1}.admin-toolbar-row-actions{flex-direction:column;align-items:stretch}.admin-toolbar-row-actions .import-replace-label{white-space:normal}.product-toolbar-actions{display:grid;grid-template-columns:1fr 1fr}}
.category-add-form{display:grid;grid-template-columns:1fr auto;gap:7px;margin:18px 0 12px}.category-add-form input{border:1px solid var(--line);border-radius:8px;padding:9px;outline:0}.category-add-form button{border:0;background:var(--green);color:white;border-radius:8px;padding:0 14px}.category-manage-list{border:1px solid var(--line);border-radius:10px;overflow:hidden}.category-manage-row{display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:7px;padding:9px;border-bottom:1px solid var(--line)}.category-manage-row:last-child{border:0}.category-position{width:22px;height:22px;border-radius:50%;background:#edf5f1;color:var(--green);display:grid;place-items:center;font-size:9px;font-weight:700}.category-manage-row input{border:0;background:#f5f3ed;border-radius:6px;padding:7px 8px;outline:0;min-width:0}.category-manage-row div{display:flex;gap:4px}.category-manage-row button{border:1px solid var(--line);background:white;border-radius:6px;padding:5px 7px;font-size:9px}.category-manage-row button:disabled{opacity:.3;cursor:not-allowed}.category-manage-row button:last-child{color:#a8524d}.category-hint{display:block;color:var(--muted);font-size:9px;margin-top:9px}
.skip-member-payment{display:block;width:100%;height:48px;border:0;background:var(--green);color:#fff;border-radius:12px;padding:0 14px;font-family:inherit;font-size:14px;font-weight:700;margin:12px 0 0;box-shadow:0 6px 16px rgba(217,52,43,.22)}.skip-member-payment:hover{background:var(--green2);box-shadow:0 8px 20px rgba(217,52,43,.28)}.skip-member-payment:active{transform:scale(.98)}#memberContinuePayment{justify-content:center;margin-top:14px}
.admin-member-search-row{grid-template-columns:minmax(0,1fr) 44px 44px}.admin-member-search-row input{height:44px!important;border-radius:10px!important;font-size:14px!important}.admin-member-search-row .member-icon-action{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;border-radius:10px!important}.admin-member-search-row .member-icon-action-svg{width:22px;height:22px}.admin-member-search-row{margin-top:4px}.member-phone-search-row{display:grid;grid-template-columns:minmax(0,1fr) 44px 44px;gap:6px;margin-top:5px;align-items:center}.member-phone-search-row input,.member-phone-search-row .member-icon-action{height:44px!important;min-height:44px!important;max-height:44px!important;align-self:center}.member-modal form>label .member-phone-search-row input{margin:0!important;width:100%;border-radius:10px!important;box-sizing:border-box;font-size:22px;letter-spacing:.02em;text-align:center}.member-icon-action{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;margin:0!important;padding:0!important;border:0!important;border-radius:10px!important;background:var(--green)!important;color:#fff!important;display:grid!important;place-items:center!important;cursor:pointer;box-shadow:0 4px 10px rgba(217,52,43,.2);transition:transform .15s,filter .15s,box-shadow .15s}.member-icon-action:hover{filter:brightness(1.04);box-shadow:0 6px 14px rgba(217,52,43,.26)}.member-icon-action:active{transform:scale(.96)}.member-icon-action-svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}#memberLookupView>.guest-divider{display:none!important}
.payment-name-setting{background:#f4f2ec;border-radius:12px;padding:12px;margin:14px 0}.payment-name-setting>b,.payment-name-setting>small{display:block}.payment-name-setting>b{font-size:12px}.payment-name-setting>small{font-size:9px;color:var(--muted);margin-bottom:8px}.payment-name-grid{grid-template-columns:repeat(2,1fr)}@media(max-width:540px){.payment-name-grid{grid-template-columns:1fr}}
.custom-payment-setting{border:1px solid var(--line);border-radius:12px;padding:12px;margin:14px 0}.custom-payment-setting>b,.custom-payment-setting>small{display:block}.custom-payment-setting>b{font-size:12px}.custom-payment-setting>small{font-size:9px;color:var(--muted)}.custom-payment-add{display:grid;grid-template-columns:1fr auto;gap:6px;margin:9px 0}.custom-payment-add input{border:1px solid var(--line);border-radius:7px;padding:8px}.custom-payment-add button{border:0;background:var(--green);color:white;border-radius:7px;padding:0 12px}.custom-payment-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px;background:#f4f2ec;border-radius:7px;padding:7px 9px;margin-top:5px;font-size:11px}.transfer-image-block{margin-top:12px}.transfer-image-note{display:block;font-size:9px;color:var(--muted);margin:4px 0 8px}.transfer-image-preview{display:flex;align-items:flex-start;gap:12px;margin-top:8px}.transfer-image-preview img{width:120px;height:120px;object-fit:contain;border:1px solid var(--line);border-radius:10px;background:#fff;padding:4px}.transfer-image-actions{display:grid;gap:6px;align-content:start}.transfer-image-upload{display:inline-block;margin-top:8px}.custom-payment-row>input{min-width:0;border:1px solid transparent;background:white;border-radius:6px;padding:7px 8px}.custom-payment-row>input:focus{outline:0;border-color:#8eb4a4}.custom-payment-row>div{display:flex;gap:4px}.custom-payment-row button{border:1px solid var(--line);background:white;border-radius:6px;padding:5px 7px;color:var(--green);font-size:10px}.custom-payment-row button:last-child{color:#a8524d}.payment-tabs{grid-template-columns:repeat(auto-fit,minmax(80px,1fr))!important}.reward-tier-add{display:grid;grid-template-columns:1.6fr 1fr 1fr auto;gap:6px;margin:9px 0}.reward-tier-add input{border:1px solid var(--line);border-radius:7px;padding:8px;min-width:0}.reward-tier-add button{border:0;background:var(--green);color:white;border-radius:7px;padding:0 12px}.reward-tier-row{display:grid;grid-template-columns:1.6fr 1fr 1fr auto;align-items:center;gap:6px;background:#f4f2ec;border-radius:7px;padding:7px 9px;margin-top:5px;font-size:11px}.reward-tier-row span{min-width:0;padding:2px 4px}.reward-tier-label{font-weight:600}.reward-tier-points,.reward-tier-discount{color:var(--muted)}.reward-tier-row button{border:1px solid #e8c5c2;background:white;border-radius:6px;padding:5px 10px;color:#a8524d;font-size:10px;font-weight:600}.tax-buyer-list-title{display:block;font-size:12px;margin:16px 0 4px}.tax-buyer-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;background:#f4f2ec;border-radius:7px;padding:8px 10px;margin-top:5px;font-size:11px}.tax-buyer-row div:first-child b{display:block;font-size:12px}.tax-buyer-row div:first-child small{color:var(--muted);font-size:9px}.tax-buyer-row div:last-child{display:flex;gap:4px}.tax-buyer-row button{border:1px solid var(--line);background:white;border-radius:6px;padding:5px 7px;color:var(--green);font-size:10px}.tax-buyer-row button:last-child{color:#a8524d}#taxInvoiceForm label{display:block;font-size:12px;font-weight:600;color:var(--ink);margin:12px 0 0}#taxInvoiceForm input,#taxInvoiceForm select,#taxInvoiceForm textarea{display:block;width:100%;border:1px solid var(--line);border-radius:10px;padding:11px 12px;margin-top:5px;outline:0;font-family:inherit;font-size:14px;background:#fff}#taxInvoiceForm input:focus,#taxInvoiceForm select:focus,#taxInvoiceForm textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--tint)}#taxInvoiceForm textarea{resize:vertical;min-height:72px}#taxInvoiceForm .employee-form-actions{margin-top:18px}#taxBuyerManageList{margin-top:6px}
.customer-display-image-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}.customer-display-image-list .thumb{position:relative;width:70px;height:70px;border-radius:8px;overflow:hidden;border:1px solid var(--line)}.customer-display-image-list .thumb img{width:100%;height:100%;object-fit:cover;display:block}.customer-display-image-list .thumb button{position:absolute;top:2px;right:2px;border:0;background:rgba(0,0,0,.55);color:#fff;border-radius:50%;width:18px;height:18px;font-size:11px;line-height:1;padding:0}
.custom-payment-view{text-align:center;background:#f4f2ec;border-radius:13px;padding:22px;margin-top:8px}.custom-payment-view>div{font-size:38px}.custom-payment-view p{font-size:10px;color:var(--muted);margin:4px}.custom-payment-view h3{margin:0;font-size:19px}.custom-payment-view strong{display:block;color:var(--green);font-size:25px;margin-top:5px}.custom-payment-view small{display:block;color:var(--muted);font-size:9px;margin-top:10px}
.split-payment-view{background:#f4f2ec;border-radius:13px;padding:13px;margin-top:8px}.split-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.split-head span{font-size:12px;font-weight:600}.split-head small{font-size:9px;color:var(--muted)}.split-payment-row{display:grid;grid-template-columns:1fr 125px;align-items:center;gap:8px;margin-top:7px}.split-payment-row label{font-size:11px}.split-payment-row div{display:flex;align-items:center;background:white;border:1px solid var(--line);border-radius:7px;padding-left:8px;color:var(--green)}.split-payment-row input{width:100%;min-width:0;border:0;outline:0;padding:8px;font-weight:600;text-align:right}.split-summary{border-top:1px solid #d9d7cf;margin-top:11px;padding-top:10px;display:flex;justify-content:space-between;font-size:10px}.split-summary span,.split-summary b{display:block}.split-summary span:last-child{text-align:right}.split-summary b{font-size:16px;color:var(--green);margin-top:2px}
.payment-modal{max-height:94vh;overflow:auto}
.custom-payment-view label{display:block;text-align:left;font-size:10px;color:var(--muted);margin-top:13px}.custom-payment-view label>div{display:flex;align-items:center;background:white;border:1px solid var(--line);border-radius:9px;padding-left:11px;color:var(--green);font-size:19px;font-weight:700;margin-top:4px}.custom-payment-view input{width:100%;border:0;outline:0;background:transparent;padding:10px;font-size:22px;font-weight:600}
.payment-running-total{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:-10px 0 14px}.payment-running-total>span{background:#f4f2ec;border-radius:8px;padding:8px 10px;font-size:9px;color:var(--muted)}.payment-running-total>span:last-child{text-align:right}.payment-running-total b{display:block;color:var(--green);font-size:14px;margin-top:2px}.payment-running-total.complete>span{background:#e5f2eb}.payment-running-total.complete b{color:#23825a}
.large-change{background:linear-gradient(135deg,#e4f3eb,#edf7f2);border:1px solid #c5dfd2;border-radius:16px;padding:16px;margin:18px 0 8px}.large-change span,.large-change b{display:block}.large-change span{font-size:12px;color:#587468}.large-change b{font-size:44px;line-height:1.15;color:var(--green);margin-top:3px}
.gift-alert{background:#fdf1de;border:2px dashed #e8c586;border-radius:14px;padding:14px 16px;margin:12px 0;text-align:left;animation:pop .22s ease}.gift-alert>span{display:block;font-weight:700;color:#a5690f;font-size:14px}.gift-alert #giftAlertList{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.gift-alert #giftAlertList span{background:white;border-radius:8px;padding:5px 10px;font-size:12px;font-weight:600;color:#a5690f}
.payment-gift-info{background:#fdf1de;border:1px dashed #e8c586;border-radius:10px;padding:9px 12px;margin-bottom:10px;font-size:12px;font-weight:600;color:#a5690f;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.report-filter{display:flex;align-items:end;gap:8px;margin-bottom:14px;flex-wrap:wrap;min-width:0;max-width:100%}.report-filter label{font-size:9px;color:var(--muted);min-width:0;flex:1 1 140px}.report-filter input,.report-filter select{display:block;width:100%;max-width:100%;min-width:0;border:1px solid var(--line);border-radius:7px;padding:8px;margin-top:3px;background:white;box-sizing:border-box}.report-filter button{border:0;background:var(--green);color:white;border-radius:7px;padding:9px 12px;font-size:10px;flex:0 0 auto}.report-filter .export-report{background:#edf5f1;color:var(--green);border:1px solid #b9d1c7}.stock-alert-hint{display:block;color:var(--muted);font-size:9px;margin:-4px 0 8px}.stock-alert-list{margin-bottom:20px}.stock-alert-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-top:0}.stock-alert-row:first-child{border-top:1px solid var(--line);border-radius:9px 9px 0 0}.stock-alert-row:last-child{border-radius:0 0 9px 9px}.stock-alert-icon{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;font-size:20px;flex:none;background-size:cover;background-position:center}.stock-alert-info{flex:1;min-width:0}.stock-alert-info b,.stock-alert-info small{display:block}.stock-alert-info small{color:var(--muted);font-size:11px}.stock-alert-meta{text-align:right;flex:none;font-size:11px}.stock-alert-meta b{display:block;font-size:12px}.stock-alert-meta small{color:var(--muted)}.stock-alert-badge{display:inline-block;padding:2px 9px;border-radius:20px;font-size:10px;font-weight:700}.stock-alert-badge.expired{background:#fae8e5;color:#b5524b}.stock-alert-badge.soon{background:#fdf1de;color:#a5690f}.report-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.report-summary article{background:#f4f2ec;border-radius:10px;padding:12px}.report-summary span,.report-summary b,.report-summary small{display:block}.report-summary span,.report-summary small{font-size:9px;color:var(--muted)}.report-summary b{font-size:17px;color:var(--green);margin:3px 0}.payment-breakdown{display:flex;gap:6px;overflow:auto;margin-top:10px}.payment-breakdown span{white-space:nowrap;background:#edf5f1;color:var(--green);border-radius:20px;padding:6px 10px;font-size:9px}.tax-section-head>small{color:var(--muted);font-size:9px}@media(max-width:720px){.report-summary{grid-template-columns:repeat(2,1fr)}}
.report-charts{display:grid;grid-template-columns:1.1fr 0.9fr 0.9fr;gap:10px;margin-top:12px}.report-charts>section{border:1px solid var(--line);border-radius:11px;padding:12px;min-width:0}.chart-title{display:flex;justify-content:space-between;align-items:center}.chart-title b{font-size:12px}.chart-title small{font-size:9px;color:var(--muted)}.chart-title select{border:1px solid var(--line);background:white;border-radius:7px;padding:4px 7px;font-size:9px}.daily-chart{height:175px;display:flex;align-items:end;gap:5px;padding-top:20px;overflow-x:auto;border-bottom:1px solid var(--line)}.daily-bar-wrap{height:100%;min-width:28px;flex:1;display:flex;flex-direction:column;justify-content:end;align-items:center}.daily-bar-value{font-size:7px;color:var(--green);white-space:nowrap}.daily-bar{width:min(22px,70%);min-height:2px;background:linear-gradient(to top,var(--green),color-mix(in srgb,var(--green),white 40%));border-radius:4px 4px 0 0;margin:3px 0}.daily-bar-label{font-size:7px;color:var(--muted);height:16px;white-space:nowrap}.channel-chart{display:grid;gap:11px;margin-top:18px}.channel-row>div:first-child{display:flex;justify-content:space-between;font-size:9px;margin-bottom:4px}.channel-row>div:first-child b{color:var(--green)}.channel-track{height:9px;background:#eeece6;border-radius:10px;overflow:hidden}.channel-fill{height:100%;background:var(--orange);border-radius:10px}.chart-empty{margin:auto;color:var(--muted);font-size:10px}.pie-chart-wrap{display:flex;align-items:center;gap:14px;margin-top:14px}.pie-chart{width:96px;height:96px;border-radius:50%;flex:none;position:relative;background:#eeece6}.pie-chart::after{content:'';position:absolute;inset:17px;border-radius:50%;background:var(--paper)}.pie-legend{display:grid;gap:9px;font-size:10px;flex:1;min-width:0}.pie-legend-row{display:flex;align-items:center;gap:7px}.pie-legend-row .swatch{width:10px;height:10px;border-radius:3px;flex:none}.pie-legend-row div{flex:1;min-width:0}.pie-legend-row b{display:block;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pie-legend-row small{color:var(--muted);font-size:9px}.pie-legend-row em{font-style:normal;font-weight:700;font-size:11px;color:var(--ink)}@media(max-width:1050px){.report-charts{grid-template-columns:1fr 1fr}}@media(max-width:720px){.report-charts{grid-template-columns:1fr}}
.points-setting,.pack-case-setting,.byweight-setting{border:1px solid var(--line);border-radius:12px;padding:12px;margin:14px 0}.points-setting>b,.points-setting>small,.pack-case-setting>b,.pack-case-setting>small{display:block}.points-setting>b,.pack-case-setting>b{font-size:12px}.points-setting>small,.pack-case-setting>small{font-size:9px;color:var(--muted)}.byweight-setting .vat-toggle{background:transparent;padding:0}.pack-case-setting .form-grid{margin-top:8px}.pack-case-setting .vat-toggle{background:transparent;padding:0}.link-product-setting{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}.link-product-results{display:grid;gap:7px;margin-top:8px;max-height:180px;overflow:auto}.link-product-results button{border:1px solid var(--line);background:white;border-radius:10px;padding:9px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;font-size:12px;width:100%}.link-product-results button:hover{border-color:var(--green)}.link-product-results button small{color:var(--muted);font-size:9px;white-space:nowrap}.link-product-selected{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#edf5f1;border-radius:10px;padding:10px 12px;margin-top:8px;font-size:12px;color:var(--green);font-weight:600}.link-product-selected button{border:1px solid var(--line);background:white;border-radius:7px;padding:5px 10px;font-size:10px;font-weight:400;color:var(--ink)}.points-rule{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:12px}.points-rule label{display:inline-flex;align-items:center;gap:7px;font-size:12px!important;font-weight:600;color:var(--ink);margin:0!important}.points-rule input{width:88px;text-align:center;font-weight:600;margin:0!important}.points-rule>span{font-size:12px;color:var(--muted);padding:0;margin-right:6px}.points-setting p{background:var(--tint);color:var(--green2);border-radius:9px;padding:9px 12px;font-size:12px;font-weight:600;margin:12px 0 0;text-align:center}
#adminMembers .points-setting,#adminMembers .custom-payment-setting{max-width:760px}
.reward-tier-add input:focus,.points-rule input:focus{outline:0;border-color:var(--green);box-shadow:0 0 0 2px var(--tint)}
.scanner-modal{width:min(500px,100%)}.scanner-camera{position:relative;aspect-ratio:4/3;background:#16201c;border-radius:14px;overflow:hidden;margin-top:17px}.scanner-camera video{width:100%;height:100%;object-fit:cover}.scanner-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:white;font-size:42px;background:#1d2924}.scanner-placeholder small{font-size:11px;margin-top:8px;opacity:.7}.scan-frame{position:absolute;inset:20%;z-index:2}.scan-frame i{position:absolute;width:32px;height:32px;border-color:#79f2b3;border-style:solid}.scan-frame i:nth-child(1){left:0;top:0;border-width:3px 0 0 3px}.scan-frame i:nth-child(2){right:0;top:0;border-width:3px 3px 0 0}.scan-frame i:nth-child(3){left:0;bottom:0;border-width:0 0 3px 3px}.scan-frame i:nth-child(4){right:0;bottom:0;border-width:0 3px 3px 0}.scan-frame span{position:absolute;left:4px;right:4px;height:2px;background:#79f2b3;box-shadow:0 0 8px #79f2b3;animation:scanline 2s ease-in-out infinite}@keyframes scanline{0%,100%{top:5%}50%{top:92%}}.scanner-status{text-align:center;color:var(--muted);font-size:11px;margin:12px 0 0}.scanner-retry{display:block;width:100%;border:0;background:var(--green);color:white;border-radius:9px;padding:10px;margin-top:10px}.scanner-fallback{margin-top:12px}.scanner-fallback input[type=file]{display:none}.scanner-capture-btn{display:flex;align-items:center;justify-content:center;width:100%;border:0;background:var(--green);color:#fff;border-radius:11px;padding:14px;font-weight:700;cursor:pointer;box-shadow:0 6px 16px rgba(217,52,43,.26)}.scanner-manual{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:10px}.scanner-manual input{border:1px solid var(--line);border-radius:10px;padding:12px;font-size:16px;outline:0}.scanner-manual input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--tint)}.scanner-manual button{border:0;background:var(--tint-strong);color:var(--green2);border-radius:10px;padding:0 18px;font-weight:700}
.search-scan{display:inline-flex;align-items:center;gap:6px;border:0;background:#e8f3ef;border-radius:999px;padding:10px 16px;font-size:12px;font-weight:600;white-space:nowrap;cursor:pointer;flex:none;color:inherit;transition:background .18s var(--ease-out)}.search-scan .ico{width:16px;height:16px;color:#5a6360}.search-scan em{font-style:normal;font-weight:700;font-size:15px;color:#d32f2f}.search-scan:hover{background:#dceee6;color:inherit}.search-scan:hover em{color:#d32f2f}.admin-toolbar .product-search-bar,.withdrawal-form .product-search-bar,.sale-edit-add .product-search-bar,.barcode-print-controls .product-search-bar{display:flex;align-items:center;gap:10px;margin-top:4px}.admin-toolbar .product-search-bar input,.withdrawal-form .product-search-bar input,.sale-edit-add .product-search-bar input,.barcode-print-controls .product-search-bar input{display:block;flex:1;min-width:0;width:auto;margin:0!important;border:0;background:transparent;padding:0;box-shadow:none}@media(max-width:520px){.search-scan em{display:none}.search-scan{padding:10px 12px}}
.barcode-form-input{display:flex;gap:6px;margin-top:4px}.barcode-form-input input{flex:1;min-width:0;margin:0!important}.barcode-form-input select{margin:0!important}.barcode-form-input button:not(.search-scan){flex:none;border:1px solid #b9d1c7;background:#edf5f1;color:var(--green);border-radius:8px;padding:0 11px;font-size:10px;font-weight:600;white-space:nowrap}.barcode-form-input button:not(.search-scan):hover{background:var(--green);color:white}.barcode-form-input.product-search-bar button.search-scan{border:0;background:#e8f3ef;color:inherit;border-radius:999px;padding:10px 16px;font-size:12px}
.admin-sort-label{min-width:130px}.admin-sort-label select{display:block;width:100%;border:1px solid var(--line);background:white;border-radius:8px;padding:9px 28px 9px 9px;margin-top:4px;color:var(--ink);font-size:10px;outline:0}.admin-sort-label select:focus{border-color:#86aa9b}
.admin-modal{width:min(920px,100%)!important;max-width:100%;min-width:0;box-sizing:border-box}
.admin-fresh-products .admin-product-header,.admin-fresh-products .admin-product{grid-template-columns:36px minmax(0,1.6fr) minmax(48px,.5fr) minmax(52px,.55fr) minmax(40px,.4fr) max-content!important}.admin-fresh-products .admin-product-header [data-sort-field="category"],.admin-fresh-products .admin-product .product-category{display:none}.admin-product-list-head{display:flex;justify-content:space-between;align-items:flex-end;margin:10px 2px 6px}.admin-product-list-head b,.admin-product-list-head small{display:block}.admin-product-list-head small{color:var(--muted);font-size:10px;margin-top:2px}.admin-product-header,.admin-product{grid-template-columns:36px minmax(0,1.5fr) minmax(48px,.5fr) minmax(52px,.55fr) minmax(56px,.65fr) minmax(40px,.4fr) max-content!important;gap:6px;width:100%;max-width:100%;min-width:0;box-sizing:border-box}.admin-product-header{display:grid;align-items:center;background:#f0eee8;color:var(--muted);border:1px solid var(--line);border-bottom:0;border-radius:10px 10px 0 0;padding:8px 10px;font-size:9px;font-weight:600}.admin-product-header [data-sort-field]{cursor:pointer;user-select:none;display:flex;align-items:center;gap:2px;min-width:0}.admin-product-header [data-sort-field]:hover{color:var(--green)}.sort-icon{font-size:8px;line-height:1;opacity:.35}.sort-icon::before{content:'⇅'}.admin-product-header [data-sort-field].sort-active{color:var(--green)}.admin-product-header [data-sort-field].sort-active .sort-icon{opacity:1}.admin-product-header [data-sort-field].sort-active.sort-asc .sort-icon::before{content:'▲'}.admin-product-header [data-sort-field].sort-active.sort-desc .sort-icon::before{content:'▼'}.admin-product-list{border-radius:0 0 10px 10px!important;overflow-x:hidden!important;max-width:100%}.admin-product{padding:8px 10px}.admin-product>span:first-child{width:34px;height:34px;min-width:34px}.admin-product .product-table-name{min-width:0;overflow:hidden}.admin-product .product-table-name b,.admin-product .product-table-name small{display:block}.admin-product .product-table-name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-product .product-table-name small{color:var(--muted);font-size:8px}.admin-product .product-category{background:#f3f1eb;border-radius:10px;padding:3px 6px;text-align:center;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.admin-product-actions{display:flex;flex-wrap:nowrap;gap:4px;justify-content:flex-end;align-items:center;min-width:0}.admin-product-actions button{flex:0 0 auto;padding:5px 6px;font-size:11px;white-space:nowrap}@media(max-width:760px){.admin-product-header,.admin-product{grid-template-columns:32px minmax(0,1fr) minmax(48px,.55fr) minmax(36px,.35fr) max-content!important;gap:5px}.admin-product-header>span:nth-child(3),.admin-product-header>span:nth-child(5),.admin-product>span:nth-child(3),.admin-product>span:nth-child(5){display:none}.admin-product-header>span:nth-child(2)::after{content:''}.admin-product-header>span:nth-child(2){font-size:0}.admin-product-header>span:nth-child(2)::before{content:'สินค้า';font-size:9px}.admin-product-actions button{padding:5px 5px;font-size:10px}}
@media(max-width:480px){.admin-modal{padding:16px}.admin-product-header,.admin-product{grid-template-columns:26px minmax(0,1fr) minmax(44px,.5fr) minmax(28px,.3fr) max-content!important;gap:4px;padding:7px 6px}.admin-product-header>span:first-child{font-size:0}.admin-product .product-table-name b{font-size:11px}.admin-product .product-table-name small{font-size:7px}.admin-product-actions{gap:3px}.admin-product-actions button{font-size:0;padding:5px 4px;min-width:28px}.admin-product-actions button::before{font-size:12px}.admin-product-actions button[data-edit]::before{content:'✏️'}.admin-product-actions button[data-delete]::before{content:'🗑️'}.admin-product-actions button.admin-feature-star{font-size:12px;padding:4px}}
.best-sellers{border:1px solid var(--line);border-radius:11px;padding:12px;margin-top:10px}.best-seller-row{display:grid;grid-template-columns:28px 38px 1fr 75px 85px 85px;gap:8px;align-items:center;border-bottom:1px solid var(--line);padding:8px 0;font-size:9px}.best-seller-row:last-child{border:0}.best-rank{width:23px;height:23px;border-radius:50%;background:#edf5f1;color:var(--green);display:grid;place-items:center;font-weight:700}.best-seller-row:nth-child(1) .best-rank{background:#f3d67d;color:#735b13}.best-seller-row:nth-child(2) .best-rank{background:#e0e3e2;color:#59615e}.best-seller-row:nth-child(3) .best-rank{background:#ead0b7;color:#815c3b}.best-product-icon{width:34px;height:34px;border-radius:7px;display:grid;place-items:center;font-size:19px;background-size:cover!important;background-position:center!important}.best-product-name b,.best-product-name small{display:block}.best-product-name small{color:var(--muted)}.best-seller-row>span:nth-last-child(-n+3){text-align:right}.best-profit{color:var(--green);font-weight:600}@media(max-width:620px){.best-seller-row{grid-template-columns:25px 34px 1fr 60px}.best-seller-row>span:nth-child(5),.best-seller-row>span:nth-child(6){display:none}}
.payment-amount-field{display:block;text-align:left;font-size:10px;color:var(--muted);margin-top:10px}.payment-amount-field>div{display:flex;align-items:center;background:white;border:1px solid #d4e1e8;border-radius:8px;padding-left:10px;color:#173c71;font-size:18px;font-weight:700;margin-top:3px}.payment-amount-field input{width:100%;border:0;outline:0;background:transparent;padding:8px;font-size:20px;font-weight:600}.universal-keypad{margin-top:12px}
.account-menu .admin-settings-menu{background:#edf5f1;color:var(--green);font-weight:600}
.status{width:16px;height:16px;padding:0;background:transparent}.status i{width:10px;height:10px;margin:3px;background:#2d9a65;box-shadow:0 0 0 0 rgba(45,154,101,.5);animation:status-pulse 1.5s infinite}.status.offline i{background:#d9342b;box-shadow:0 0 0 0 rgba(217,52,43,.5);animation:status-pulse-red 1.5s infinite}@keyframes status-pulse{0%{box-shadow:0 0 0 0 rgba(45,154,101,.55);opacity:1}70%{box-shadow:0 0 0 7px rgba(45,154,101,0);opacity:.65}100%{box-shadow:0 0 0 0 rgba(45,154,101,0);opacity:1}}@keyframes status-pulse-red{0%{box-shadow:0 0 0 0 rgba(217,52,43,.55);opacity:1}70%{box-shadow:0 0 0 7px rgba(217,52,43,0);opacity:.65}100%{box-shadow:0 0 0 0 rgba(217,52,43,0);opacity:1}}
.status.pending i{background:#e8871e;box-shadow:0 0 0 0 rgba(232,135,30,.5);animation:status-pulse-orange 1.5s infinite}@keyframes status-pulse-orange{0%{box-shadow:0 0 0 0 rgba(232,135,30,.55);opacity:1}70%{box-shadow:0 0 0 7px rgba(232,135,30,0);opacity:.65}100%{box-shadow:0 0 0 0 rgba(232,135,30,0);opacity:1}}
.user-button{position:relative}.user-button .status{position:absolute;right:-4px;top:-2px;display:block}.user-button .status i{display:block}
.printer-setting{background:#f4f2ec;border:1px solid var(--line);border-radius:12px;padding:14px;margin:14px 0}.setting-section-title{display:flex;align-items:center;gap:10px;margin-bottom:6px}.setting-section-title>span{font-size:25px}.setting-section-title b,.setting-section-title small{display:block}.setting-section-title small,.printer-note{color:var(--muted);font-size:9px}.printer-setting select{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 10px;margin-top:4px;background:white;color:var(--ink)}.printer-setting .vat-toggle{margin:10px 0}.printer-test-button{width:100%;border:1px solid #a9c8bb;background:#edf5f1;color:var(--green);border-radius:8px;padding:10px;font-weight:600}.printer-test-button:hover{background:var(--green);color:white}.printer-note{text-align:center;margin:7px 0 0}
.receipt-setting{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;margin:14px 0}.receipt-setting textarea{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 10px;margin-top:4px;resize:vertical;font:inherit;outline:0}.receipt-setting textarea:focus{border-color:#86aa9b}
.receipt-preview-panel{background:#e9e7e1;border-radius:12px;padding:14px;margin:14px 0;text-align:center}.receipt-preview-panel>b,.receipt-preview-panel>small{display:block}.receipt-preview-panel>small{color:var(--muted);font-size:9px;margin-bottom:12px}.receipt-preview-paper{width:260px;max-width:100%;min-height:360px;margin:auto;background:white;padding:20px 16px;box-shadow:0 8px 24px rgba(30,40,35,.14);font-family:monospace;font-size:10px;color:#222}.receipt-preview-paper h3{font-family:inherit;font-size:16px;margin:0 0 3px}.receipt-preview-paper p{margin:3px 0;white-space:pre-line}.receipt-preview-paper hr{border:0;border-top:1px dashed #777;margin:10px 0}.receipt-preview-line{display:flex;justify-content:space-between;gap:8px;text-align:left;margin:3px 0}.receipt-preview-total{font-size:14px;font-weight:700}
.receipt-preview-logo{display:block;width:58px;height:58px;object-fit:contain;margin:0 auto 8px;filter:grayscale(1) contrast(1.25)}
#adminPrinter{max-width:none;grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:auto auto auto;gap:0 20px;align-items:start}#adminPrinter:not(.hidden){display:grid}#adminPrinter .printer-setting{grid-column:1;grid-row:1}#adminPrinter .receipt-setting{grid-column:1;grid-row:2}#adminPrinter .receipt-preview-panel{grid-column:2;grid-row:1/4;position:sticky;top:0}#adminPrinter>.login-submit{grid-column:1;grid-row:3;margin-top:0}@media(max-width:760px){#adminPrinter{grid-template-columns:1fr}#adminPrinter .printer-setting,#adminPrinter .receipt-setting,#adminPrinter .receipt-preview-panel,#adminPrinter>.login-submit{grid-column:1;grid-row:auto}#adminPrinter .receipt-preview-panel{position:static}}
.payment-modal.success-mode{width:min(820px,100%)}.success-content{display:grid;grid-template-columns:minmax(280px,1fr) 320px;gap:24px;align-items:start}.success-content.no-receipt-side{grid-template-columns:1fr;max-width:420px;margin:0 auto}.success-receipt-side.hidden{display:none!important}.payment-modal.success-mode:has(.no-receipt-side){width:min(480px,100%)}.success-details{padding-top:4px}.success-receipt-side{background:#e9e7e1;border-radius:14px;padding:14px;text-align:center}.success-receipt-side>b{display:block;margin-bottom:10px}.success-receipt-side .receipt-preview-paper{min-height:330px}.success-receipt-side .receipt-preview-logo{width:48px;height:48px}@media(max-width:700px){.success-content{grid-template-columns:1fr}.success-receipt-side{margin-top:8px}}
.reprint-button{width:100%;border:0;background:linear-gradient(135deg,var(--green),var(--green2));color:#fff;border-radius:13px;padding:15px 18px;margin-top:12px;font-family:inherit;font-size:15px;font-weight:700;box-shadow:0 8px 20px rgba(217,52,43,.28);transition:transform .16s ease,filter .16s ease,box-shadow .16s ease}.reprint-button:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 11px 26px rgba(217,52,43,.34)}.reprint-button:active{transform:translateY(1px);box-shadow:0 3px 10px rgba(217,52,43,.22)}
.payment-modal:not(.success-mode){width:min(1480px,96vw);max-height:92vh}#paymentForm{position:relative;padding-left:410px;padding-right:400px;min-height:430px}.payment-number-panel{position:absolute;right:0;top:42px;width:370px;padding:14px;background:#f3f1eb;border:1px solid var(--line);border-radius:14px}.payment-number-panel .quick-cash-label{margin-top:0}.payment-number-panel .quick-cash{margin-bottom:14px}.payment-number-panel .universal-keypad{position:static;width:auto;margin:0;padding:0;background:transparent;border:0}.payment-number-panel .universal-keypad::before{content:'⌨️ แป้นตัวเลข';grid-column:1/-1;text-align:left;font-size:12px;font-weight:700;color:var(--green);padding:0 2px 5px}
.payment-cart-panel{position:absolute;left:0;top:42px;width:380px;padding:16px;background:#f3f1eb;border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;max-height:calc(92vh - 100px)}.payment-cart-panel .quick-cash-label{margin-top:0}.payment-cart-list{overflow-y:auto;display:grid;gap:9px;margin:12px 0}.payment-cart-list .payment-cart-row{background:white;border:1px solid var(--line);border-radius:11px;padding:11px 13px;font-size:14px;display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center}.payment-cart-thumb{width:42px;height:42px;border-radius:9px;display:grid;place-items:center;font-size:24px;background-position:center!important;background-size:cover!important}.payment-cart-info{min-width:0}.payment-cart-list .payment-cart-row span{color:var(--muted);font-size:11px;display:block;margin-top:2px;white-space:normal}.payment-cart-list .payment-cart-row small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.payment-cart-list .payment-cart-row b{font-size:14px}.payment-cart-info>b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.payment-cart-line-total{white-space:nowrap;text-align:right}.payment-cart-total{display:flex;justify-content:space-between;align-items:center;background:white;border-radius:10px;padding:12px 14px;font-weight:700;font-size:15px;color:var(--green2);margin-top:auto}
@media(max-width:1200px){.payment-modal:not(.success-mode){width:min(780px,96vw)}#paymentForm{padding-left:0}.payment-cart-panel{position:static;width:auto;margin-bottom:14px;max-height:220px}}
@media(max-width:700px){.payment-modal:not(.success-mode){width:min(440px,100%)}#paymentForm{padding-right:0;min-height:0}.payment-number-panel{position:static;width:auto;margin-top:12px;padding:12px}.payment-number-panel .universal-keypad::before{display:none}}
.payment-tabs{grid-template-columns:repeat(auto-fit,minmax(68px,1fr));gap:2px}.payment-tabs button{padding:7px 4px;font-size:10px;white-space:nowrap}
@media (min-width:1201px) and (max-height:900px){
  #paymentModal{padding:8px;overflow:hidden}
  #paymentModal .payment-modal:not(.success-mode){height:calc(100dvh - 16px);max-height:none;padding:18px 24px;overflow:hidden}
  #paymentForm{height:100%;min-height:0;padding-left:390px;padding-right:380px;display:flex;flex-direction:column;gap:0;overflow:hidden}
  #paymentForm>.eyebrow{margin:0 0 2px;font-size:10px;line-height:1.2}
  #paymentForm>#paymentTitle{margin:0;font-size:28px;line-height:1.15}
  #paymentForm>.payment-total{font-size:38px;line-height:1.05;margin:5px 0 8px}
  #paymentForm>.discount-row{min-height:42px;padding:8px 11px;margin:0 0 7px}
  #paymentForm>.change-row{padding:8px 10px;margin:0 0 7px}
  #paymentForm>.payment-running-total{margin:0 0 7px;gap:6px}
  #paymentForm>.payment-running-total>span{padding:6px 8px}
  #paymentForm>.payment-amount-summary{padding:5px 8px;margin:0 0 7px}
  #paymentForm>.payment-tabs{margin:0 0 7px}
  #paymentForm>.payment-tabs button{padding:6px 4px}
  #paymentForm #cashPaymentView .cash-label input,#paymentForm .custom-payment-view .cash-label input{font-size:30px;padding:10px 12px;margin-top:3px}
  .payment-cart-panel{top:30px;bottom:0;width:360px;max-height:none;padding:12px}
  .payment-cart-list{min-height:0;margin:8px 0;gap:6px}
  .payment-cart-list .payment-cart-row{padding:8px 10px}
  .payment-cart-total{padding:9px 11px}
  .payment-number-panel{top:30px;bottom:0;width:350px;padding:10px;display:flex;flex-direction:column;overflow:hidden}
  .payment-number-panel .quick-cash{margin:5px 0 8px;gap:5px}
  .payment-number-panel .quick-cash button{padding:5px 9px}
  .payment-number-panel .universal-keypad{flex:1;min-height:0;gap:6px}
}
.custom-payment-view{background:transparent;padding:0;margin-top:0;text-align:left}.custom-payment-view .cash-label{margin-top:0;font-size:12px}.custom-payment-view .cash-label input{display:block;width:100%;font-size:36px;font-weight:700;border:1px solid var(--line);border-radius:12px;padding:16px 16px;margin-top:5px;outline:0;background:white}.custom-payment-view .cash-label input:focus{border-color:var(--green);box-shadow:0 0 0 3px var(--tint)}.custom-payment-row{grid-template-columns:1fr auto}
#paymentForm>.change-row{margin:-10px 0 16px;font-size:14px}#paymentForm>.change-row b{font-size:20px}
#paymentForm>.change-row,#paymentForm>.payment-running-total{display:none}
#paymentForm>#confirmPay{display:none}
.payment-amount-summary{border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 10px;margin:0 0 12px;font-size:10px}.payment-amount-summary>div{display:flex;justify-content:space-between;gap:10px;padding:3px 0}.payment-amount-summary>div:first-child{color:var(--green);font-weight:700}.payment-amount-summary .summary-total{border-top:1px dashed var(--line);margin-top:3px;padding-top:6px;font-size:12px}.payment-amount-summary .summary-change{color:#23825a}
.employee-layout{display:grid;grid-template-columns:minmax(320px,380px) 1fr;gap:18px}.employee-form,.employee-list-panel{border:1px solid var(--line);border-radius:12px;padding:15px;background:#fff}.employee-form h3{margin:0 0 10px}.employee-form>label{display:block;font-size:11px;color:var(--muted);font-weight:600;margin:10px 0}.employee-form>label>input:not([type=checkbox]){display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 10px;margin-top:4px;outline:0}.employee-form-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.employee-form-actions button{border:1px solid var(--line);background:white;border-radius:8px;padding:10px}.employee-form-actions button:last-child{background:var(--green);color:white;border-color:var(--green)}
.sale-edit-actions{grid-template-columns:1fr 1fr 1fr}.sale-edit-actions button:last-child{background:#fae8e5;color:#b5524b;border-color:#f0c9c5}.employee-list-head b,.employee-list-head small{display:block}.employee-list-head small{color:var(--muted);font-size:10px}.employee-row{display:grid;grid-template-columns:38px 1fr auto auto;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line);font-size:11px}.employee-row:last-child{border:0}.employee-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#e5f0eb;color:var(--green);font-weight:700}.employee-row b,.employee-row small{display:block}.employee-row small{color:var(--muted)}.employee-row em{font-style:normal;font-size:9px;border-radius:20px;padding:4px 7px}.employee-row em.active{background:#e5f2eb;color:#23825a}.employee-row em.inactive{background:#f4e5e3;color:#a8524d}.employee-row>div{display:flex;gap:4px}.employee-row>div button{border:1px solid var(--line);background:white;border-radius:6px;padding:5px 7px;font-size:9px}.employee-row>div button:last-child{color:#a8524d}@media(max-width:700px){.employee-layout{grid-template-columns:1fr}.employee-row{grid-template-columns:38px 1fr auto}.employee-row>em{display:none}}
.password-setting{border:1px solid #d8cdbb;background:#faf6ee;border-radius:12px;padding:14px;margin:14px 0}.save-password-button{width:100%;border:1px solid var(--green);background:#edf5f1;color:var(--green);border-radius:8px;padding:10px;font-weight:600}.save-password-button:hover{background:var(--green);color:white}
.employee-permissions{border:1px solid var(--line);background:linear-gradient(180deg,#fafcf9 0%,#f5f7f4 100%);border-radius:14px;padding:14px;margin:14px 0}.perm-head{margin-bottom:12px}.perm-head b{display:block;font-size:13px;color:var(--ink)}.perm-head small{display:block;margin-top:3px;font-size:10px;color:var(--muted);line-height:1.4}.perm-group{margin-top:12px;padding-top:12px;border-top:1px dashed color-mix(in srgb,var(--line) 80%,transparent)}.perm-group:first-of-type{margin-top:0;padding-top:0;border-top:0}.perm-group h4{margin:0 0 8px;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#7a8680}.perm-grid{display:grid;gap:8px}.perm-card{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:center;gap:0 10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}.perm-card:hover{border-color:color-mix(in srgb,var(--green) 35%,var(--line));box-shadow:0 4px 14px rgba(20,40,30,.05)}.perm-card:has(input:checked){border-color:color-mix(in srgb,var(--green) 45%,var(--line));background:linear-gradient(180deg,#fff 0%,#f3faf6 100%);box-shadow:0 0 0 1px color-mix(in srgb,var(--green) 12%,transparent)}.perm-card input{display:none!important}.perm-copy{grid-column:1;grid-row:1 / span 2}.perm-copy b,.perm-copy small{display:block}.perm-copy b{font-size:12px;color:var(--ink)}.perm-copy small{margin-top:2px;font-size:10px;color:var(--muted);line-height:1.35;font-weight:400}.perm-switch{grid-column:2;grid-row:1 / span 2;width:40px;height:24px;border-radius:999px;background:#c5ccc8;position:relative;flex:none;transition:background .18s ease}.perm-switch::after{content:"";position:absolute;width:18px;height:18px;background:#fff;border-radius:50%;left:3px;top:3px;box-shadow:0 1px 3px rgba(0,0,0,.12);transition:left .18s ease}.perm-card input:checked+.perm-switch{background:var(--green)}.perm-card input:checked+.perm-switch::after{left:19px}.perm-sales-code{display:block;margin-top:10px;font-size:11px;color:var(--muted);font-weight:600}.perm-sales-code input{display:block;width:100%;border:1px solid var(--line);border-radius:10px;padding:9px 10px;margin-top:5px;font-weight:400;color:var(--ink)}.perm-sales-code small{display:block;margin-top:5px;font-size:10px;color:var(--muted);font-weight:400;line-height:1.35}.employee-permissions.perm-highlight{animation:permPulse .9s ease}.employee-form.employee-form-editing{box-shadow:0 0 0 2px color-mix(in srgb,var(--green) 28%,transparent),0 12px 32px rgba(20,40,30,.08)}@keyframes permPulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--green) 0%,transparent)}50%{box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 18%,transparent)}}.employee-perm-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.perm-chip{display:inline-flex;align-items:center;font-size:9px;font-weight:600;line-height:1;padding:4px 8px;border-radius:999px;background:#edf5f0;color:#2d7a55;border:1px solid #cfe6d8}.perm-chip.muted{background:#f3f4f2;color:#8a9088;border-color:#e4e6e2}.employee-access{display:none!important}
.staff-mode #importProducts,.staff-mode #downloadProductTemplate,.staff-mode #productCsvFile{display:none!important}
.admin-toolbar .product-toolbar-actions button{min-height:32px;padding:6px 9px;font-size:10px;line-height:1.2;white-space:nowrap;border-radius:7px}.product-toolbar-actions{gap:4px}
.employee-password-form label{display:block;font-size:11px;color:var(--muted);font-weight:600;margin:12px 0}.employee-password-form input{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:10px;margin-top:4px;outline:0}.employee-password-form input:focus{border-color:#6b9b89;box-shadow:0 0 0 3px #dfede8}
.forgot-password{display:block;margin:8px 0 0 auto;border:0;background:transparent;color:var(--green);font-size:11px;font-weight:600}.forgot-password:hover{text-decoration:underline}.forgot-password-form label{display:block;font-size:11px;color:var(--muted);font-weight:600;margin-top:14px}.forgot-password-form input{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:11px;margin-top:5px;outline:0}.forgot-password-form input:focus{border-color:#6b9b89;box-shadow:0 0 0 3px #dfede8}.forgot-password-form p{background:#f3f1eb;border-radius:8px;padding:10px;color:var(--muted);font-size:10px}
.user-button em.has-avatar{background-size:cover;background-position:center;color:transparent}.profile-photo-button{background:#edf5f1;color:var(--green);font-weight:600;border:0;border-radius:8px;padding:9px 12px;width:100%;text-align:left;font-size:12px;cursor:pointer}
.account-settings-section{border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:14px;display:grid;gap:8px}.account-settings-section>b{font-size:12px}.account-settings-section .vat-toggle{margin:0}
#staffSettingsModal .profile-photo-button{margin-bottom:8px}
.payment-number-panel #cashPaymentView{margin-bottom:10px}.payment-number-panel #cashPaymentView .cash-label{font-size:11px}.payment-number-panel #cashPaymentView .cash-label input{font-size:28px;padding:9px 11px;margin-top:3px;background:#fff}
.payment-number-panel #promptPayView{margin:0 0 10px;padding:0;background:transparent;border:0;border-radius:0;text-align:left}.payment-number-panel #promptPayView>.promptpay-icon,.payment-number-panel #promptPayView>.promptpay-qr,.payment-number-panel #promptPayView>p,.payment-number-panel #promptPayView>h3,.payment-number-panel #promptPayView>b,.payment-number-panel #promptPayView>strong,.payment-number-panel #promptPayView>small{display:none!important}.payment-number-panel #promptPayView .payment-amount-field{margin:0;font-size:11px}.payment-number-panel #promptPayView .payment-amount-field>div{margin-top:3px;border-color:var(--line);color:var(--ink)}.payment-number-panel #promptPayView .payment-amount-field input{font-size:28px;padding:9px 11px;color:var(--ink)}
.promptpay-qr-toggle{align-self:stretch;flex:none;border:0;border-left:1px solid var(--line);background:#f7f6f2;color:var(--green);padding:0 13px;font-size:11px;font-weight:700;border-radius:0 8px 8px 0}.promptpay-qr-toggle.active{background:var(--green);color:#fff}
.withdrawal-menu-button{min-height:42px;border:1px solid #d6b989;background:#fff6e5;color:#8a6327;border-radius:11px;padding:8px 13px;font-size:12px;font-weight:600}.withdrawal-menu-button:hover{background:#f7e8ca}.sync-data-button{min-height:42px;border:1px solid var(--tint-strong);background:var(--tint);color:var(--green2);border-radius:11px;padding:8px 13px;font-size:12px;font-weight:600;display:flex;align-items:center;gap:6px}.sync-data-button:hover{background:var(--tint-strong)}.sync-data-button:disabled{opacity:.6;cursor:wait}.sync-data-button .sync-icon{display:inline-block;font-size:14px}.sync-data-button.syncing .sync-icon{animation:sync-spin 1s linear infinite}@keyframes sync-spin{to{transform:rotate(360deg)}}.withdrawal-layout{display:grid;grid-template-columns:330px 1fr;gap:18px}.withdrawal-form,.withdrawal-history{border:1px solid var(--line);border-radius:12px;padding:15px;background:white}.withdrawal-form h3{margin:0 0 12px}.withdrawal-form label{display:block;font-size:11px;color:var(--muted);font-weight:600;margin:10px 0}.withdrawal-form input,.withdrawal-form select{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 10px;margin-top:4px;background:white;box-sizing:border-box;min-width:0}.withdrawal-form .form-grid{display:grid;grid-template-columns:1fr;gap:10px;margin:10px 0}.withdrawal-form .form-grid>label{min-width:0;margin:0}.withdrawal-form input[type=date]{width:100%;max-width:100%;font-size:12px;padding:8px 6px}.withdrawal-cart-list{max-height:280px;overflow:auto;margin-top:8px}.withdrawal-cart-list .cart-item{padding:9px 0}.withdrawal-cart-list .cart-price{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.withdrawal-cart-list .cart-price b{font-size:12px;color:var(--ink)}.withdrawal-cart-list .empty-products{padding:20px 10px;font-size:11px}.withdrawal-date-filter{margin:0 0 12px;padding:0;border:0;background:transparent;align-items:end}
.withdrawal-date-filter label{font-size:10px}
.withdrawal-date-filter input{font-size:12px;padding:7px 8px}
.withdrawal-date-filter button{align-self:end;white-space:nowrap}.withdrawal-date-head{display:flex;justify-content:space-between;align-items:baseline;padding:10px 2px 6px;position:sticky;top:0;background:var(--paper);z-index:1}.withdrawal-date-head b{font-size:12px;color:var(--green)}.withdrawal-date-head small{font-size:10px;color:var(--muted)}.withdrawal-row{display:grid;grid-template-columns:1fr 70px 95px 90px;gap:9px;padding:10px 0;border-bottom:1px solid var(--line);font-size:10px;align-items:center}.withdrawal-row:last-child{border:0}.withdrawal-row b,.withdrawal-row small{display:block}.withdrawal-row small{color:var(--muted)}.withdrawal-qty{color:#a05f2b;font-weight:700}.withdrawal-returned-note{color:#0c8a3c!important}.withdrawal-return-btn{border:1px solid #ddc9c6;background:white;color:#a65852;border-radius:6px;padding:6px 8px;font-size:10px;font-weight:600}.withdrawal-returned-tag{font-style:normal;background:#e7f5ec;color:#0c8a3c;border-radius:8px;padding:4px 7px;font-size:9px;font-weight:700}@media(max-width:700px){.withdrawal-layout{grid-template-columns:1fr}.withdrawal-menu-button{font-size:0}.withdrawal-menu-button::first-letter{font-size:18px}}

/* --- premium line icons + chrome polish (v1.48) --- */
.ico-wrap{display:inline-flex;align-items:center;justify-content:center;vertical-align:-.16em;line-height:0}
.ico{width:1.15em;height:1.15em;display:block;flex:none}
.admin-menu-toggle{gap:8px}.admin-menu-toggle .ico{width:18px;height:18px}
.admin-menubar button{display:flex;align-items:center;gap:10px}.admin-menubar button span{margin:0}.admin-menubar button .ico{width:18px;height:18px;opacity:.9}
.admin-menu-toggle{box-shadow:0 1px 2px rgba(20,60,45,.06)}
.admin-menubar{padding:7px;box-shadow:0 18px 44px rgba(20,60,45,.16),0 3px 10px rgba(20,60,45,.08)}
.admin-menubar button{padding:9px 13px;transition:background .12s}
.catalog-mode-toggle button{display:inline-flex;align-items:center;gap:7px}.catalog-mode-toggle .ico{width:16px;height:16px}
.sync-data-button,.withdrawal-menu-button{display:inline-flex;align-items:center;gap:7px}.sync-data-button .ico,.withdrawal-menu-button .ico{width:16px;height:16px}
.admin-settings-menu{display:flex;align-items:center;gap:9px}.admin-settings-menu .ico{width:17px;height:17px;opacity:.9}
#barcodePrintScan,#barcodePrintBtn{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.account-menu button:not(#logoutBtn){transition:background .12s}
/* settings form: 2-column grid — narrow fields pair up, wide blocks span full */
#settingsForm{max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:14px 22px;align-items:start;grid-auto-flow:row dense}
#settingsForm>*{margin:0}
#settingsForm>label{align-self:start}
#settingsForm>.account-settings-section,#settingsForm>.logo-setting,#settingsForm>.payment-group,#settingsForm>.customer-display-setting,#settingsForm>.login-submit,#settingsForm>.reset-settings{grid-column:1/-1}
.about-modal .danger-zone{margin-top:14px;display:flex;flex-direction:column;gap:8px}.danger-button-outline{background:#fff;color:#c0392b;border:1px solid #e8c5c2;box-shadow:none}.danger-button-outline:hover{background:#fdf3f2}
.about-modal{width:min(480px,100%);max-height:min(92vh,820px);overflow-y:auto;padding-bottom:22px}
.about-sub-block{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.about-sub-block-first{margin-top:12px;padding-top:0;border-top:0}
.about-meta-rows{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.about-meta-rows>div:last-child{border-bottom:0}
.about-downloads-block{margin-bottom:4px}
.about-downloads-page-link{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:12px 14px;border:0;border-radius:12px;background:var(--brand);color:#fff;font:inherit;font-size:14px;font-weight:700;text-decoration:none;cursor:pointer}
.about-downloads-page-link:hover{filter:brightness(.96)}
.about-downloads-hint{margin:8px 0 0;text-align:center}
.downloads-modal{width:min(440px,100%);max-height:min(88vh,720px);overflow-y:auto;padding-bottom:20px}
.about-downloads-list{margin:0 0 4px;display:flex;flex-direction:column;gap:12px}
.about-dl-group{margin:0}
.about-dl-group-title{margin:0 0 6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.about-dl-links{display:flex;flex-direction:column;gap:6px}
.about-dl-link{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--line);border-radius:11px;background:#fafafa;text-decoration:none;color:var(--ink);font-size:13px;line-height:1.35;transition:border-color .15s,background .15s}
.about-dl-link:hover{border-color:var(--brand);background:#fff}
.about-dl-link b{font-weight:600;font-size:13px}
.about-dl-link span{text-align:right;font-size:11px;color:var(--muted);white-space:nowrap}
.about-dl-link.is-featured{border-color:rgba(217,52,43,.35);background:#fff8f7}
.about-update-btn{margin-top:16px}
.about-update-status{margin:8px 0 0}
.about-block-title{margin:0 0 8px;font-size:15px;font-weight:700;color:var(--ink)}
.about-block-hint{margin:-4px 0 10px;font-size:12px;color:var(--muted)}
.about-sub-rows{margin:0 0 10px}
.about-muted{margin:0;font-size:13px;color:var(--muted)}
.about-renew-link{display:inline-block;margin:4px 0 12px;font-size:13px;font-weight:600;color:var(--green);text-decoration:none}
.about-renew-link:hover{text-decoration:underline}
.about-packages{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.about-pkg{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fafafa}
.about-pkg-btn{cursor:pointer;text-align:left;font:inherit;width:100%;transition:border-color .15s,background .15s,transform .12s}
.about-pkg-btn:hover{border-color:var(--brand);background:#fff;transform:translateY(-1px)}
.about-pkg-btn:focus-visible{outline:2px solid rgba(217,52,43,.35);outline-offset:2px}
.about-pkg.is-current,.about-pkg-btn.is-current{border-color:var(--brand);background:#fff5f5;box-shadow:0 0 0 1px rgba(217,52,43,.12)}
.about-pkg b{display:block;font-size:13px;margin-bottom:4px}
.about-pkg span{display:block;font-size:15px;font-weight:700;color:var(--brand)}
.about-pkg small{display:block;margin-top:4px;font-size:11px;color:var(--muted);line-height:1.4}
.about-pkg-btn.is-selected{border-color:var(--brand);background:#fff5f5;box-shadow:0 0 0 2px rgba(217,52,43,.2)}
.about-pkg.highlight{border-color:rgba(217,52,43,.35)}
.about-renew-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#faf9f6}
.about-renew-bar.hidden{display:none}
.about-renew-selected span{display:block;font-size:11px}
.about-renew-selected b{display:block;font-size:14px;margin-top:2px;color:var(--ink)}
.about-renew-go{display:inline-block;padding:8px 14px;border-radius:999px;background:var(--brand);color:#fff;font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap;border:none;cursor:pointer;font-family:inherit;line-height:1.2}
.about-renew-go:hover:not(.is-disabled):not([aria-disabled="true"]){filter:brightness(.95)}
.about-renew-go.is-disabled,.about-renew-go[aria-disabled="true"]{opacity:.55;cursor:not-allowed;pointer-events:none}
button.about-renew-go:disabled{opacity:.55;cursor:not-allowed}
.about-demo-upgrade-row{margin-top:12px}
.about-demo-upgrade-btn{width:100%;margin:0}
.demo-mode .demo-locked{cursor:pointer}
.demo-mode #settingsForm .settings-card{position:relative}
.demo-nav-lock-hint{position:relative}
.demo-mode .demo-locked::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(217,52,43,.12);background:rgba(255,255,255,.04)}
.demo-lock-badge{position:absolute;top:5px;right:5px;z-index:3;width:18px;height:18px;border-radius:999px;background:rgba(255,255,255,.96);color:#b42318;display:grid;place-items:center;box-shadow:0 1px 4px rgba(0,0,0,.12);pointer-events:none}
.demo-lock-ico{width:11px;height:11px;display:block}
.admin-menubar .demo-lock-badge,.account-menu .demo-lock-badge{top:8px;right:8px}
.product-edit-btn.demo-locked .demo-lock-badge{top:2px;right:2px;width:16px;height:16px}
.sub-days-left.demo-upgrade-link{cursor:pointer;text-decoration:underline dotted;text-underline-offset:2px}
.demo-upgrade-modal{width:min(520px,100%);padding:24px 24px 20px}
.demo-upgrade-modal h2{margin:0 0 8px;font-size:22px;line-height:1.25}
.demo-upgrade-lead{margin:0 0 16px;padding:12px 14px;font-size:13px;line-height:1.55;color:var(--ink);background:linear-gradient(135deg,#fff8f6,#f6faf7);border:1px solid color-mix(in srgb,var(--line) 85%,#fff);border-radius:14px}
.demo-upgrade-form{display:flex;flex-direction:column;gap:14px}
.demo-upgrade-section{margin:0;padding:14px 14px 12px;border:1px solid var(--line);border-radius:14px;background:#fff}
.demo-upgrade-section--soft{background:#faf9f6}
.demo-upgrade-section--packages{padding-bottom:14px}
.demo-upgrade-section-title{margin:0 0 12px;font-size:13px;font-weight:700;color:var(--ink);letter-spacing:.01em;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.demo-upgrade-optional-tag{font-size:10px;font-weight:600;color:var(--muted);background:#f0f0ec;border:1px solid var(--line);border-radius:999px;padding:2px 8px}
.demo-upgrade-required{font-style:normal;color:var(--brand);font-weight:700}
.demo-upgrade-fields{display:flex;flex-direction:column;gap:12px}
.demo-upgrade-fields--grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px}
.demo-upgrade-field{display:block;margin:0}
.demo-upgrade-label{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-bottom:6px}
.demo-upgrade-form input{display:block;width:100%;height:46px;margin:0;border:1px solid var(--line);border-radius:12px;padding:0 14px;font-size:15px;background:#fff;color:var(--ink);box-sizing:border-box;transition:border-color .16s ease,box-shadow .16s ease}
.demo-upgrade-form input:focus{outline:0;border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 14%,transparent)}
.demo-upgrade-form input::placeholder{color:#a8adb2;opacity:1}
.demo-upgrade-packages{margin-top:2px}
.demo-upgrade-form .login-error{margin:0;border-radius:10px;font-size:12px}
.demo-upgrade-submit{margin:2px 0 0;height:50px;border-radius:13px;font-size:15px}
.demo-upgrade-success-lead{margin:0 0 12px}
.demo-upgrade-success-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;align-items:center}
.demo-upgrade-enter{flex:1;min-width:160px}
@media(max-width:480px){.demo-upgrade-fields--grid{grid-template-columns:1fr}.demo-upgrade-modal{padding:20px 16px 18px}}
@media(max-width:420px){.about-packages{grid-template-columns:1fr}}
@media(max-width:760px){#settingsForm{grid-template-columns:1fr}}
.profile-photo-button{display:flex;align-items:center;gap:9px}.profile-photo-button .ico{width:16px;height:16px}
/* sale-edit multi-channel payment */
.sale-edit-discount-label{display:block;font-size:11px;color:var(--muted);font-weight:600;margin:6px 0}
.sale-edit-discount-label input{display:block;width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 10px;margin-top:4px;outline:0;background:white}
.sale-edit-payments{margin:12px 0}
.sale-edit-pay-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.sale-edit-pay-head>span{font-size:12px;font-weight:700}.sale-edit-pay-head small{font-weight:500;color:var(--muted)}
.sale-edit-pay-hint{font-size:11px;font-weight:600}.sale-edit-pay-hint.ok{color:#0c8a3c}.sale-edit-pay-hint.warn{color:#b5524b}
#saleEditPaymentList{display:grid;gap:6px}
.sale-edit-pay-row{display:grid;grid-template-columns:22px 1fr 120px;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:8px 12px;cursor:pointer}
.sale-edit-pay-row.active{border-color:var(--green);background:var(--tint)}
.sale-edit-pay-row .pay-name{font-size:13px;font-weight:600}
.sale-edit-pay-row .pay-amount{border:1px solid var(--line);border-radius:8px;padding:7px 9px;text-align:right;outline:0;background:white;font-weight:600}
.sale-edit-pay-row .pay-amount:disabled{background:#f4f3ef;color:#bbb}
/* crisp full-strength icons (inherit button text color: red on light, white on red) */
.ico{opacity:1}
/* icon sizing across converted emoji contexts */
.inline-ico{vertical-align:-.15em}.inline-ico .ico{width:1.05em;height:1.05em}
.empty-products .field-ico .ico{width:40px;height:40px;color:var(--muted)}
.huge-ico .ico{width:46px;height:46px}.empty-cart .huge-ico{filter:none;opacity:.4;color:var(--muted)}
.role-ico .ico{width:22px;height:22px}
.warning-icon .ico{width:26px;height:26px}
.success-icon .ico{width:34px;height:34px}
.setting-section-title .ico{width:22px;height:22px}
.member-select-button em .ico{width:18px;height:18px}
.product-image-preview .big-ico .ico{width:38px;height:38px;color:#9bb0a4}
.scanner-placeholder .big-ico .ico{width:44px;height:44px}
.chart-title .ico,.chart-title b .ico{width:16px;height:16px}
.role-choice .role-ico{display:flex;justify-content:center;margin:0 auto 3px}
.guest-button .role-ico .ico{width:20px;height:20px}
/* inline svg icons injected from JS render */
.inline-svg-ico .ico{width:18px;height:18px}
.member-svg-ico .ico{width:18px;height:18px}
.linked-tag .ico{width:12px;height:12px;vertical-align:-.12em}
.reward-row .inline-svg-ico .ico,.gift-row .inline-svg-ico .ico{width:18px;height:18px}
.promotion-item .employee-avatar .ico,.employee-avatar .ico{width:20px;height:20px}
/* lively topbar action buttons */
.withdrawal-menu-button,.sync-data-button{transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease,border-color .16s ease;cursor:pointer;will-change:transform}
.withdrawal-menu-button .ico,.sync-data-button .ico{transition:transform .3s ease}
.withdrawal-menu-button:hover{background:#e6a53f;border-color:#e6a53f;color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(180,120,20,.3)}
.withdrawal-menu-button#customerDisplayButton.active{background:#0c8a3c;border-color:#0c8a3c;color:#fff;box-shadow:0 7px 18px rgba(12,138,60,.25)}
.withdrawal-menu-button:hover .ico{transform:scale(1.14)}
.withdrawal-menu-button:active{transform:translateY(0) scale(.96)}
.sync-data-button:not(:disabled):hover{background:var(--green,#d9342b);border-color:var(--green,#d9342b);color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(217,52,43,.3)}
.sync-data-button:not(:disabled):hover .sync-icon{transform:rotate(180deg)}
.sync-data-button:not(:disabled):active{transform:translateY(0) scale(.96)}
/* taxonomy (unit/category) editor */
.field-label-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.taxonomy-edit-btn{border:0;background:transparent;color:var(--green);font-size:10px;font-weight:700;cursor:pointer;padding:0}
.taxonomy-edit-btn:hover{text-decoration:underline}
.taxonomy-hint{font-size:11px;color:var(--muted);margin:0 0 12px;line-height:1.5}
.taxonomy-list{display:grid;gap:8px;max-height:52vh;overflow:auto;margin-bottom:14px}
.taxonomy-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px}
.taxonomy-row .taxonomy-input{border:1px solid var(--line);border-radius:8px;padding:8px 10px;outline:0;background:white;font-size:13px}
.taxonomy-row .taxonomy-input:focus{border-color:var(--green)}
.taxonomy-row small{color:var(--muted);font-size:10px;white-space:nowrap}
.taxonomy-del{border:1px solid #f0c9c5;background:#fae8e5;color:#b5524b;border-radius:7px;padding:6px 10px;font-size:11px;font-weight:600;cursor:pointer}
.taxonomy-del:disabled{opacity:.4;cursor:not-allowed}
/* mobile fit: collapse sync button to icon-only, keep topbar tidy */
.sync-data-button{white-space:nowrap}
@media(max-width:700px){.sync-data-button{font-size:0;gap:0;padding:8px 11px}.sync-data-button .ico{width:19px;height:19px}}
@media(max-width:820px){.top-actions{gap:8px}.topbar-left{gap:10px}.admin-menu-toggle{padding:8px 12px}}
/* mobile: let topbar brand shrink/ellipsis so row fits */
@media(max-width:820px){.topbar-left{min-width:0;flex:1 1 auto}.topbar-left .brand{min-width:0;flex:1 1 auto}.topbar-left .brand>div{min-width:0}.admin-menu-wrap{flex:none}}
@media(max-width:560px){.brand strong{font-size:14px}.topbar{padding:8px 10px}.admin-menu-toggle{padding:8px 11px}}
@media(max-width:480px){.admin-menu-toggle{font-size:0;gap:0;padding:8px 10px}.admin-menu-toggle .ico{width:20px;height:20px}.user-button .status{right:-2px}.top-actions{gap:6px}}
/* settings color pickers as small circular swatches */
#settingsForm input[type=color]{-webkit-appearance:none;appearance:none;box-sizing:border-box;width:40px;height:40px;min-width:40px;flex:none;padding:0;border:3px solid #fff;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 3px 8px rgba(0,0,0,.16);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
#settingsForm input[type=color]:hover{transform:scale(1.1);box-shadow:0 0 0 1px rgba(0,0,0,.08),0 5px 14px rgba(0,0,0,.24)}
#settingsForm input[type=color]::-webkit-color-swatch-wrapper{padding:0}
#settingsForm input[type=color]::-webkit-color-swatch{border:0;border-radius:50%}
#settingsForm input[type=color]::-moz-color-swatch{border:0;border-radius:50%}
#settingsForm .theme-colors{display:flex;flex-wrap:wrap;gap:14px 20px}
#settingsForm .theme-colors label{display:flex;flex-direction:column-reverse;align-items:center;gap:6px;margin:0;width:auto;font-size:10px;text-align:center}
#settingsForm .customer-display-setting>label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0;font-size:12px;font-weight:600;color:var(--muted)}

/* grouped store settings */
#settingsForm{gap:16px}
#settingsForm>.settings-section-nav,#settingsForm>.settings-card{grid-column:1/-1}
.settings-section-nav{display:flex;gap:7px;flex-wrap:wrap;padding:5px;background:#f4f2ec;border:1px solid var(--line);border-radius:12px;position:sticky;top:-1px;z-index:3}
.settings-section-nav a{flex:1;min-width:105px;text-align:center;text-decoration:none;color:var(--muted);font-size:11px;font-weight:700;padding:9px 10px;border-radius:8px;transition:.15s}
.settings-section-nav a:hover{background:#fff;color:var(--green);box-shadow:0 2px 8px rgba(50,30,20,.08)}
#settingsForm .settings-card{margin:0;border:1px solid var(--line);border-radius:16px;padding:18px;background:#fff;box-shadow:0 5px 18px rgba(50,30,20,.04);scroll-margin-top:68px}
.settings-card-head{display:flex;align-items:center;gap:11px;padding-bottom:13px;margin-bottom:14px;border-bottom:1px solid var(--line)}
.settings-card-head>span{width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:10px;background:var(--tint);color:var(--green);font-size:11px;font-weight:800}
.settings-card-head b,.settings-card-head small{display:block}.settings-card-head b{font-size:14px;color:var(--ink)}.settings-card-head small{font-size:10px;color:var(--muted);margin-top:2px}
.account-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.account-action-grid button{margin:0!important;justify-content:center;border:1px solid var(--line)!important;background:#faf9f6!important;color:var(--green)!important;padding:10px!important}
#settingsForm .logo-setting{margin:0 0 14px}.store-settings-card>.compact-field{display:block;max-width:240px;margin:12px 0 0}
#settingsForm>.login-submit{margin-top:0}
@media(max-width:540px){.settings-section-nav{position:static}.settings-section-nav a{min-width:calc(50% - 4px)}#settingsForm .settings-card{padding:14px}.account-action-grid{grid-template-columns:1fr}}

/* taxonomy combobox: type + pick suggestions */
.product-form .taxonomy-combo{
  position:relative;width:100%
}
.product-form .taxonomy-combo>input{
  width:100%;height:52px;margin:0;border:1px solid var(--line);border-radius:11px;
  padding:0 44px 0 14px;font-size:15px;font-weight:700;color:var(--ink);
  background:#fff;box-sizing:border-box;
  transition:border-color .15s ease,box-shadow .15s ease
}
.product-form .taxonomy-combo>input::placeholder{color:var(--muted);font-weight:600}
.product-form .taxonomy-combo>input:focus{
  outline:0;border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 12%,transparent)
}
.product-form .taxonomy-combo-toggle{
  position:absolute;right:4px;top:50%;transform:translateY(-50%);
  width:40px;height:40px;border:0;border-radius:9px;background:transparent;cursor:pointer;padding:0
}
.product-form .taxonomy-combo-toggle::after{
  content:"";display:block;margin:0 auto;width:8px;height:8px;
  border-right:2px solid var(--green);border-bottom:2px solid var(--green);
  transform:translateY(-2px) rotate(45deg)
}
.product-form .taxonomy-combo-toggle:hover{background:color-mix(in srgb,var(--tint) 70%,#fff)}
.product-form .taxonomy-combo-menu{
  position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;
  max-height:220px;overflow:auto;padding:6px;
  background:#fff;border:1px solid color-mix(in srgb,var(--green) 14%,var(--line));
  border-radius:12px;box-shadow:0 14px 34px rgba(90,20,16,.14)
}
.product-form .taxonomy-combo-menu.hidden{display:none!important}
.product-form .taxonomy-combo-item{
  display:block;width:100%;text-align:left;border:0;background:transparent;
  border-radius:9px;padding:10px 12px;font-size:14px;font-weight:700;color:var(--ink);cursor:pointer
}
.product-form .taxonomy-combo-item:hover,
.product-form .taxonomy-combo-item.active{background:var(--tint);color:var(--green2)}
.product-form .taxonomy-combo-empty{
  padding:12px;font-size:12px;color:var(--muted);text-align:center
}

/* logout action */
#logoutBtn{display:flex;align-items:center;gap:9px;font-weight:600}
#logoutBtn .logout-icon{width:20px;height:20px;display:grid;place-items:center;flex:none}
#logoutBtn .logout-icon .ico{width:18px;height:18px}

/* compact, readable color controls */
#settingsForm .theme-colors{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:9px;width:100%}
#settingsForm .theme-colors label{box-sizing:border-box;width:100%;min-width:0;min-height:56px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:9px 10px 9px 12px;border:1px solid var(--line);border-radius:11px;background:#faf9f6;color:var(--ink);font-size:10px;line-height:1.35;text-align:left;overflow-wrap:anywhere}
#settingsForm .theme-colors input[type=color]{width:48px;height:36px;min-width:48px;border:3px solid #fff;border-radius:10px;box-shadow:0 0 0 1px rgba(35,25,20,.12),0 3px 8px rgba(35,25,20,.13);transition:transform .15s ease,box-shadow .15s ease}
#settingsForm .theme-colors input[type=color]:hover{transform:translateY(-1px) scale(1.03);box-shadow:0 0 0 1px rgba(35,25,20,.16),0 5px 12px rgba(35,25,20,.18)}
#settingsForm .theme-colors input[type=color]::-webkit-color-swatch-wrapper{padding:0}
#settingsForm .theme-colors input[type=color]::-webkit-color-swatch{border:0;border-radius:7px}
#settingsForm .theme-colors input[type=color]::-moz-color-swatch{border:0;border-radius:7px}
@media(max-width:620px){#settingsForm .theme-colors{grid-template-columns:repeat(2,minmax(0,1fr))}#settingsForm .theme-colors input[type=color]{width:42px;min-width:42px}}
@media(max-width:390px){#settingsForm .theme-colors{grid-template-columns:1fr}}

/* v1.54 visual consistency pass */
:where(button,a,input,select,textarea){font-family:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
:where(button,a,input,select,textarea):focus-visible{outline:3px solid color-mix(in srgb,var(--green) 25%,transparent);outline-offset:2px}
:where(input,select,textarea){transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
:where(.product-form,.settings-form,.employee-form,.withdrawal-form) :where(input:not([type=checkbox]):not([type=color]),select,textarea):focus{border-color:var(--green)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 12%,transparent)!important}
.modal{border:1px solid rgba(255,255,255,.75);box-shadow:0 28px 80px rgba(54,24,20,.22),0 3px 12px rgba(54,24,20,.08)}
.modal>.eyebrow{color:var(--green);font-weight:700}.modal>.eyebrow+.modal h2{letter-spacing:-.02em}
.modal-close{display:grid;place-items:center;transition:transform .15s ease,background .15s ease}.modal-close:hover{transform:rotate(5deg) scale(1.06)}
.login-submit,.pay-button,.confirm-pay,.admin-toolbar button,.employee-form-actions button:last-child{transition:transform .16s ease,filter .16s ease,box-shadow .16s ease}
.login-submit:active,.pay-button:active,.confirm-pay:active{transform:translateY(1px);box-shadow:0 3px 10px rgba(217,52,43,.22)}
.product-card{box-shadow:0 2px 7px rgba(40,30,20,.035)}
.product-card h3{letter-spacing:-.01em}.product-visual{transition:transform .2s ease}.product-card:hover .product-visual{transform:scale(1.015)}
.admin-product-list,.sales-table-wrap,.employee-list-panel,.withdrawal-history{box-shadow:0 4px 16px rgba(40,30,20,.035)}
:where(.admin-product,.sales-table tbody tr,.tax-table tbody tr){transition:background .13s ease}
:where(.admin-product,.sales-table tbody tr,.tax-table tbody tr):hover{background:color-mix(in srgb,var(--tint) 55%,#fff)}
.account-menu{box-shadow:0 18px 50px rgba(45,25,20,.17);border-radius:15px}.account-menu button{min-height:38px}
.admin-menubar{border-radius:15px}.admin-menubar button{min-height:44px}
*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--green) 30%,#ddd) transparent}
*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--green) 28%,#ddd);border-radius:20px;border:2px solid transparent;background-clip:padding-box}
.a4-sheet .barcode-wrap{width:97%!important;height:11mm!important;max-height:none!important;display:flex!important;align-items:center;justify-content:center;padding:.3mm!important;box-sizing:border-box}.a4-sheet .barcode-wrap svg{width:100%!important;height:10.4mm!important;max-width:none!important;flex:none}
.barcode-size-fields{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:10px;margin:0 0 6px}.barcode-size-fields label{display:grid;gap:6px;font-size:11px;color:var(--muted);font-weight:600}.barcode-size-fields input{width:100%;height:42px;border:1px solid var(--line);border-radius:9px;background:#fff;padding:0 12px;font:700 14px inherit;color:var(--ink);box-sizing:border-box}.barcode-size-fields span{padding-bottom:11px;color:var(--muted);font-weight:700}.barcode-size-hint{display:block;margin:0 0 14px;font-size:10px;color:var(--muted)}
#memberModal{overflow:hidden;overscroll-behavior:none;touch-action:none;padding:16px;align-content:center}
#memberModal .member-modal{max-height:calc(100dvh - 32px);height:fit-content;overflow-x:hidden;overflow-y:auto;overscroll-behavior-x:none;overscroll-behavior-y:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;box-sizing:border-box}
#memberModal .member-modal>*{touch-action:pan-y}#memberModal .member-modal button,#memberModal .member-modal input{touch-action:manipulation}
#memberLookupForm{display:flex;flex-direction:column}
#skipMemberPayment:not(.hidden){display:block;width:100%;margin:10px 0 0;min-height:48px;flex:none}
@media(max-height:640px){#memberModal{padding:8px}#memberModal .member-modal{padding:18px 16px 14px!important;max-height:calc(100dvh - 16px)}#memberLookupView>h2{font-size:19px}.member-lead{margin-bottom:10px}.member-keypad{gap:5px;margin:6px 0}.member-keypad button{min-height:62px;height:62px;font-size:24px}.skip-member-payment{height:44px;font-size:13px;margin-top:8px}}
.printer-setting>.form-grid{gap:16px;margin-bottom:16px}.printer-setting>label:not(.vat-toggle){display:grid;gap:8px;margin-bottom:16px}.printer-setting :where(input:not([type=checkbox]),select){width:100%;height:58px;border:1px solid var(--line);border-radius:13px;background:#fff;padding:0 18px;box-sizing:border-box;font-size:18px;color:var(--ink);transition:border-color .16s ease,box-shadow .16s ease}.printer-setting :where(input:not([type=checkbox]),select):focus{outline:0;border-color:var(--green);box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 12%,transparent)}.printer-setting .form-grid>label{display:grid;gap:8px;margin:0}.printer-auto-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0}.printer-auto-grid .vat-toggle{min-height:88px;margin:0;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff;box-sizing:border-box}.printer-auto-grid .vat-toggle div{min-width:0}.printer-auto-grid .vat-toggle b{font-size:13px;line-height:1.25}.printer-auto-grid .vat-toggle small{font-size:10px;line-height:1.4;margin-top:3px}.cash-drawer-button{margin-top:0!important}
@media(max-width:620px){.printer-auto-grid{grid-template-columns:1fr}.printer-setting>.form-grid{grid-template-columns:1fr}}
@media(max-width:720px){.modal-backdrop{padding:10px}.modal{padding:22px 16px;border-radius:18px}.catalog{padding-left:16px;padding-right:16px}.settings-card-head small{line-height:1.45}}
.turnstile-wrap{min-height:65px;margin-top:14px;display:flex;align-items:center;justify-content:center}.turnstile-wrap .cf-turnstile{width:100%}.login-submit:disabled{opacity:.62;cursor:wait;transform:none!important}
/* merged color group */
.color-group-block{margin:6px 0 16px}
.color-group-title{display:block;font-size:11px;font-weight:700;color:var(--ink);margin-bottom:10px}
/* taxonomy add-row button */
.taxonomy-add-btn{width:100%;border:1px dashed var(--green);background:var(--tint);color:var(--green);border-radius:9px;padding:10px;font-weight:600;margin-bottom:12px;cursor:pointer}
.taxonomy-add-btn:hover{background:var(--tint-strong)}
/* tint native date pickers to brand + polish field */
input[type=date]{accent-color:var(--green);color-scheme:light}
.product-form input[type=date]{cursor:pointer}
.product-form input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.65;filter:invert(24%) sepia(80%) saturate(1800%) hue-rotate(-8deg)}
.product-form input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}
.safari-engine .modal-backdrop{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:rgba(45,14,12,.62)}
.safari-engine .modal{animation:none!important;box-shadow:0 18px 48px rgba(50,15,13,.24)}
.safari-engine .global-kb,.safari-engine .toast{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.safari-engine .global-kb{animation:none!important}
.safari-engine .product-card,.safari-engine .product-card:hover,.safari-engine .product-card:active{transform:none!important;transition:box-shadow .12s ease,border-color .12s ease!important}
.safari-engine .product-card:hover .product-visual{transform:none!important;transition:none!important}
.safari-engine .product-grid .product-card{content-visibility:visible;contain-intrinsic-size:auto}
.safari-engine .pay-button:hover,.safari-engine .confirm-pay:hover,.safari-engine .top-cash-drawer-button:hover,.safari-engine .reprint-button:hover,.safari-engine .sync-data-button:not(:disabled):hover,.safari-engine .withdrawal-menu-button:hover{transform:none!important;filter:none!important}
.safari-engine .payment-number-panel .cash-keypad button:hover{transform:none!important;filter:none!important}
.product-form label small.field-hint{display:block;margin-top:4px;font-size:10px;color:var(--muted);font-weight:400;line-height:1.4}.product-form .product-taxonomy-grid,.product-form .product-date-grid{align-items:start}.product-form .taxonomy-field{display:flex;flex-direction:column;gap:7px;margin-top:12px}.product-form .taxonomy-field>span{font-size:11px;color:var(--muted);font-weight:600;line-height:1.3}.product-form .product-taxonomy-grid .taxonomy-combo,.product-form .product-date-grid input{height:52px;margin-top:0;width:100%}.product-form .product-date-grid input{border-radius:11px;padding:0 14px;font-size:14px;box-sizing:border-box}.product-form .product-date-grid input:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 12%,transparent)}.product-form .product-date-grid input{font-weight:600;color:var(--ink)}
.product-form .product-stock-featured-row{align-items:stretch;gap:10px;margin-top:12px}
.product-form .product-stock-featured-row>#productStockField{margin:0;min-width:0}
.product-form .product-stock-featured-row.stock-hidden{grid-template-columns:1fr}
.product-form .product-featured-toggle{margin:0!important;padding:10px 12px!important;min-height:52px;box-sizing:border-box;align-self:end;background:#f4f2ec;border:1px solid var(--line)}
.product-form .product-featured-toggle:has(input:checked){background:#eef8f1;border-color:color-mix(in srgb,var(--green) 35%,var(--line))}
.product-form .product-featured-toggle b{font-size:12px}
.product-form .product-featured-toggle small{font-size:9px;line-height:1.35}
.stock-link-flow{margin:0 0 14px;padding:14px;border:1px solid #c8ddd3;border-radius:13px;background:linear-gradient(180deg,#f4faf7 0%,#edf5f1 100%)}.stock-link-flow-title{margin:0 0 10px;font-size:11px;font-weight:700;color:var(--green);letter-spacing:.02em}.stock-link-flow-row{display:flex;align-items:stretch;justify-content:center;gap:6px;flex-wrap:wrap}.stock-link-node{flex:1;min-width:78px;max-width:120px;display:grid;gap:3px;padding:10px 8px;border-radius:10px;background:white;border:1px solid var(--line);text-align:center}.stock-link-node small{font-size:9px;color:var(--muted);font-weight:600}.stock-link-node b{font-size:11px;line-height:1.35;color:var(--ink);word-break:break-word}.stock-link-node em{font-style:normal;font-size:10px;color:var(--green);font-weight:600;min-height:14px}.stock-link-node--parent{border-color:#b9d1c7;background:#f8fcfa}.stock-link-node--qty{flex:none;min-width:58px;max-width:72px;border-color:#e2cca5;background:#fffaf0}.stock-link-node--qty b{font-size:18px;color:#8a6327}.stock-link-node--current{border-color:var(--green);box-shadow:0 0 0 1px color-mix(in srgb,var(--green) 18%,transparent)}.stock-link-flow--ready .stock-link-node--qty{border-color:var(--green);background:#edf6f2}.stock-link-flow--ready .stock-link-node--qty b{color:var(--green)}.stock-link-arrow{align-self:center;font-size:16px;font-weight:700;color:#8a6327;line-height:1}.stock-link-step{display:grid;grid-template-columns:auto 1fr;gap:10px;margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:white}.stock-link-step-no{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:white;font-size:12px;font-weight:700;flex:none;margin-top:2px}.stock-link-step-body{display:grid;gap:6px;min-width:0}.stock-link-step-body>b{font-size:13px;color:var(--ink)}.stock-link-step-body>small{font-size:10px;color:var(--muted);line-height:1.45}.stock-link-step-body>input{margin:0!important;height:48px;border-radius:10px;padding:0 14px;font-size:15px;font-weight:600}.stock-link-step .link-product-results{margin-top:4px}.link-product-selected{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#edf5f1;border-radius:10px;padding:10px 12px;margin-top:8px;font-size:12px;color:var(--green);font-weight:600}.link-product-selected>span{display:grid;gap:2px}.link-product-selected>span small{font-size:10px;color:var(--muted)}.link-product-selected>span b{font-size:13px;color:var(--green)}.link-product-selected button{border:1px solid var(--line);background:white;border-radius:7px;padding:5px 10px;font-size:10px;font-weight:400;color:var(--ink)}.link-stock-example{display:grid;gap:5px;margin-top:12px;padding:13px 15px;border:1px solid #b9d8ca;border-radius:11px;background:#edf6f2}.link-stock-example b{font-size:11px;color:var(--green)}.link-stock-example span{font-size:12px;line-height:1.5;color:var(--ink)}
.stock-link-help{margin-top:14px;border:1px solid #ead8b6;border-radius:13px;background:#fffaf0;color:var(--ink);overflow:hidden}.stock-link-help>summary{cursor:pointer;list-style:none;padding:12px 16px;font-size:12px;font-weight:700;color:#8a6327;display:flex;align-items:center;justify-content:space-between;gap:8px}.stock-link-help>summary::-webkit-details-marker{display:none}.stock-link-help>summary::after{content:'▾';font-size:11px;color:#b8924f;transition:transform .15s}.stock-link-help[open]>summary::after{transform:rotate(180deg)}.stock-link-help-body{padding:0 16px 14px;border-top:1px dashed #e2cca5}.stock-link-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}.stock-link-levels article{display:grid;gap:3px;padding:10px;border-radius:10px;background:#f5e5c7;text-align:center}.stock-link-levels strong{font-size:10px;color:#7b551d}.stock-link-levels span{font-size:11px;font-weight:700;color:var(--ink)}.stock-link-levels small{font-size:9px;line-height:1.45;color:#8a6327}.stock-link-examples{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}.stock-link-examples span{padding:5px 8px;border-radius:7px;background:#f5e5c7;color:#7b551d;font-size:10px;font-weight:600}.stock-link-help-body p{margin:11px 0 0;font-size:11px;line-height:1.6;color:var(--ink)}@media(max-width:520px){.stock-link-levels{grid-template-columns:1fr}.stock-link-arrow{display:none}.stock-link-flow-row{flex-direction:column;align-items:stretch}.stock-link-node{max-width:none}}
.top-cash-drawer-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;border:1px solid #9fcbbd;background:#eaf6f2;color:#176b58;border-radius:11px;padding:8px 13px;font-family:inherit;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease,border-color .16s ease}.top-cash-drawer-button span{font-size:16px;line-height:1}.top-cash-drawer-button:hover{background:#16836b;border-color:#16836b;color:#fff;box-shadow:0 9px 20px rgba(22,131,107,.24);transform:translateY(-2px)}.top-cash-drawer-button:active{transform:translateY(0) scale(.96)}.top-cash-drawer-button.hidden{display:none!important}@media(max-width:980px){.top-cash-drawer-button,.withdrawal-menu-button#servicesButton,.withdrawal-menu-button#customerDisplayButton,.sync-data-button{width:42px;min-width:42px;padding:0;font-size:0;justify-content:center}.top-cash-drawer-button span,.withdrawal-menu-button#servicesButton .ico-wrap,.withdrawal-menu-button#customerDisplayButton .ico-wrap,.sync-data-button .ico-wrap{font-size:16px;width:18px;height:18px;display:inline-flex}}
.localhost-mode .turnstile-wrap{display:none!important}
.promotion-loyalty-settings{display:grid;gap:16px;margin-top:20px}.promotion-loyalty-head{display:grid;gap:3px;padding:0 2px}.promotion-loyalty-head>b{font-size:18px;color:var(--ink)}.promotion-loyalty-head>small{font-size:11px;color:var(--muted)}.promotion-loyalty-settings .points-setting,.promotion-loyalty-settings .custom-payment-setting{margin:0}
.payment-cart-panel>.discount-row{margin:10px 0 8px;flex:none}.payment-cart-panel>.payment-amount-summary{margin:0;flex:none}
.payment-cart-promo-savings{display:flex;justify-content:space-between;align-items:center;padding:10px 13px;margin-top:8px;border-radius:10px;background:#fff4df;color:#9b6816;font-size:12px;font-weight:700;flex:none}.payment-cart-promo-savings.hidden{display:none!important}.payment-cart-promo-savings b{color:#9b6816;font-size:13px}
#paymentCartCount{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:5px 12px;border-radius:999px;background:linear-gradient(135deg,#ea3a30,var(--green2));color:#fff!important;font-size:11px!important;font-weight:800!important;box-shadow:0 5px 14px rgba(217,52,43,.32)}
/* หน้าชำระเงิน — รายการสินค้า / ยอดรวม / ส่วนลด / สรุปยอด ให้สีเด่น */
.payment-cart-panel{
  background:linear-gradient(180deg,#fff 0%,color-mix(in srgb,var(--tint) 38%,#fff) 100%);
  border:1px solid color-mix(in srgb,var(--green) 16%,var(--line));
  box-shadow:0 10px 32px rgba(90,20,16,.08);
  padding:18px
}
.payment-cart-panel .quick-cash-label{
  font-size:13px;
  font-weight:800;
  color:var(--ink);
  letter-spacing:-.01em
}
.payment-cart-panel .quick-cash-label span{
  color:var(--ink)
}
.payment-cart-list .payment-cart-row{
  background:#fff;
  border:1px solid color-mix(in srgb,var(--green) 10%,var(--line));
  box-shadow:0 2px 8px rgba(90,20,16,.04);
  padding:12px 14px;
  align-items:stretch;
  grid-template-columns:42px minmax(0,1fr) minmax(4.8rem,max-content);
  column-gap:10px;
}
.payment-cart-info>b{
  font-weight:800;
  font-size:clamp(14px,3.4vw,16px);
  line-height:1.28;
  color:var(--ink);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;
  overflow:hidden;text-overflow:ellipsis;
  overflow-wrap:anywhere;word-break:break-word;white-space:normal
}
.payment-cart-line-total{
  display:flex!important;align-items:center!important;justify-content:flex-end!important;align-self:center;
  min-width:max(4.8rem,calc(var(--price-chars,5) * 0.62ch + 2px))!important;
  max-width:none!important;
  padding:0!important;box-sizing:border-box;
  background:none!important;border:none!important;
  font-size:clamp(15px,calc(32px - (var(--price-chars,5) - 4) * 2.4px),28px)!important;
  font-weight:900!important;
  color:var(--green)!important;
  font-variant-numeric:tabular-nums;
  text-align:right!important;
  white-space:nowrap;
  overflow:visible;
  line-height:1.05!important;
  letter-spacing:calc(-.015em - (var(--price-chars,5) - 4) * .004em);
}
.payment-cart-list .payment-cart-row span{font-size:13px;line-height:1.35}
.payment-cart-list .payment-cart-row small{font-size:12px}
.payment-cart-total{
  background:linear-gradient(135deg,color-mix(in srgb,var(--tint-strong) 70%,#fff),color-mix(in srgb,var(--tint) 45%,#fff));
  border:2px solid color-mix(in srgb,var(--green) 22%,var(--line));
  border-radius:12px;
  padding:14px 16px;
  font-size:16px;
  margin-top:10px
}
.payment-cart-total span{
  font-weight:800;
  color:var(--ink);
  font-size:15px
}
.payment-cart-total b{
  font-size:clamp(16px,4.2vw,22px);
  font-weight:900;
  color:var(--green);
  letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;
  white-space:nowrap
}
.payment-cart-panel>.discount-row{
  margin:12px 0 10px;
  min-height:46px;
  padding:12px 14px;
  border:2px dashed color-mix(in srgb,var(--green) 35%,var(--line));
  background:color-mix(in srgb,var(--tint) 55%,#fff);
  border-radius:12px;
  color:var(--green);
  font-size:13px;
  font-weight:700;
  transition:background .15s ease,border-color .15s ease
}
.payment-cart-panel>.discount-row:hover{
  background:var(--tint-strong);
  border-color:var(--green)
}
.payment-cart-panel>.discount-row strong{
  color:var(--green2);
  font-weight:800
}
.payment-cart-panel>.payment-amount-summary{
  margin:0;
  padding:14px 16px;
  border:2px solid color-mix(in srgb,var(--green) 14%,var(--line));
  border-radius:12px;
  background:#fff;
  box-shadow:0 4px 16px rgba(90,20,16,.05);
  font-size:12px
}
.payment-cart-panel>.payment-amount-summary>div{
  padding:5px 0;
  font-size:12px
}
.payment-cart-panel>.payment-amount-summary>div:first-child{
  font-size:13px;
  padding-bottom:8px;
  margin-bottom:4px;
  border-bottom:1px dashed color-mix(in srgb,var(--green) 18%,var(--line))
}
.payment-cart-panel>.payment-amount-summary>div:first-child b{
  color:var(--green);
  font-weight:800;
  font-size:13px
}
.payment-cart-panel>.payment-amount-summary>div b{
  font-weight:900;
  color:var(--green);
  font-size:22px;
  line-height:1.1;
  font-variant-numeric:tabular-nums
}
.payment-cart-panel>.payment-amount-summary .summary-total{
  border-top:2px solid color-mix(in srgb,var(--green) 16%,var(--line));
  margin-top:8px;
  padding-top:10px;
  font-size:14px
}
.payment-cart-panel>.payment-amount-summary .summary-total b{
  color:var(--green);
  font-size:24px
}
.payment-cart-panel>.payment-amount-summary>div:last-child b{
  font-size:26px;
  color:var(--green);
  font-weight:900
}
.payment-cart-panel>.payment-amount-summary .summary-change b{
  color:#23825a;
  font-size:24px
}
@media(min-width:1201px){.payment-header-grid{grid-template-columns:minmax(320px,1fr) minmax(420px,560px)}.payment-header-input{width:min(560px,100%);justify-self:end}.payment-header-input .cash-label input,.payment-header-input .payment-amount-field>div{border:2px solid #e7aaa5!important;border-radius:18px!important;background:linear-gradient(145deg,#fff 0%,#fffafa 72%,#fff1ef 100%)!important;box-shadow:inset 0 1px 0 #fff,0 8px 22px rgba(164,55,47,.08)!important;transition:border-color .18s ease,box-shadow .18s ease}.payment-header-input .cash-label input:focus,.payment-header-input .payment-amount-field>div:focus-within{outline:0;border-color:var(--green)!important;box-shadow:0 0 0 4px rgba(217,52,43,.1),0 10px 24px rgba(164,55,47,.12)!important}}
@media(min-width:1201px){.payment-header-grid{display:grid;grid-template-columns:minmax(320px,1fr) minmax(420px,1fr);align-items:stretch;gap:22px;margin:0 0 12px}.payment-header-total{min-width:0;display:flex;flex-direction:column}.payment-header-total h2{line-height:1.05}.payment-header-total .payment-total{max-width:none;min-height:78px;font-size:38px;display:flex;align-items:center;margin:0;flex:1}.payment-header-input{width:100%;height:100%;align-self:stretch}.payment-header-input>div:not(.hidden){display:flex;height:100%}.payment-header-input .cash-label,.payment-header-input .payment-amount-field{display:flex;flex-direction:column;width:100%;height:100%;margin:0;text-align:left;color:var(--muted);font-size:12px}.payment-header-input .cash-label input,.payment-header-input .payment-amount-field>div{height:auto;min-height:0;max-height:118px;flex:1;margin-top:6px;border:1px solid var(--green);border-radius:14px;background:#fff;font-size:34px;padding:14px 18px;box-shadow:none}.payment-header-input .payment-amount-field>div{display:flex;align-items:center;color:var(--green);font-weight:700}.payment-header-input .payment-amount-field input{height:100%;font-size:34px;padding:0 10px}.payment-header-input #promptPayView{padding:0;background:transparent;border:0;border-radius:0;text-align:left;margin:0}.payment-header-input #promptPayView>:not(.payment-amount-field){display:none!important}.payment-header-input #customPaymentView .cash-label{display:flex}.payment-header-input #customPaymentView>span{display:none!important}.payment-tabs{margin-bottom:10px}.payment-cart-panel{max-height:calc(96vh - 86px)}}
.payment-modal:not(.success-mode){overflow:hidden}.payment-modal:not(.success-mode) #paymentForm{max-height:calc(96vh - 56px);overflow:hidden}
.payment-header-input .cash-label{position:relative}.payment-header-input .cash-label::after{display:none}.payment-header-input .cash-label input{padding-left:18px!important;color:#050505!important;font-weight:800!important;font-variant-numeric:tabular-nums}.payment-header-input .cash-label input::placeholder{color:#777;opacity:1}.payment-header-input .payment-amount-field>div>span{display:none}.payment-header-input .payment-amount-field input{color:#050505!important;font-weight:800!important;font-variant-numeric:tabular-nums}.payment-header-input .payment-amount-field input::placeholder{color:#777;opacity:1}
@media(max-width:1200px){#cashPaymentView{position:static;width:auto}}
.payment-header-grid{position:relative}.payment-header-grid #cashPaymentView{z-index:1}
/* === payment keypad: 5-col grid within #paymentForm (nums | actions | quick-cash) === */
.payment-number-panel .universal-keypad::before{display:none!important;content:none!important}
.payment-number-panel .cash-keypad>.quick-cash-label{display:none!important}
.payment-number-panel .cash-keypad{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-template-rows:repeat(4,clamp(52px,11.5vw,92px))!important;grid-auto-rows:auto!important;gap:clamp(6px,1vw,9px)!important;align-content:stretch!important}
.payment-number-panel .cash-keypad button{height:auto!important;min-height:0!important;max-height:none!important;width:100%!important;border:1px solid var(--line)!important;background:#fff!important;color:var(--ink)!important;font-size:clamp(17px,3.2vw,24px)!important;font-weight:600!important;border-radius:11px!important;transition:transform .14s ease,box-shadow .14s ease,background .14s ease,border-color .14s ease,filter .14s ease!important}
.payment-number-panel .cash-keypad button:not([data-key="back"]):not([data-key="clear"]):not([data-key="exact"]):not(.key-done):hover{background:#fff!important;border-color:#cfc6c4!important;box-shadow:0 4px 14px rgba(38,25,26,.1)!important;transform:translateY(-1px)!important}
.payment-number-panel .cash-keypad button:active{transform:scale(.97)!important}
.payment-number-panel .cash-keypad>[data-key="1"]{grid-area:1/1!important}
.payment-number-panel .cash-keypad>[data-key="2"]{grid-area:1/2!important}
.payment-number-panel .cash-keypad>[data-key="3"]{grid-area:1/3!important}
.payment-number-panel .cash-keypad>[data-key="back"]{grid-area:1/4!important}
.payment-number-panel .cash-keypad>[data-key="4"]{grid-area:2/1!important}
.payment-number-panel .cash-keypad>[data-key="5"]{grid-area:2/2!important}
.payment-number-panel .cash-keypad>[data-key="6"]{grid-area:2/3!important}
.payment-number-panel .cash-keypad>[data-key="clear"]{grid-area:2/4!important}
.payment-number-panel .cash-keypad>[data-key="7"]{grid-area:3/1!important}
.payment-number-panel .cash-keypad>[data-key="8"]{grid-area:3/2!important}
.payment-number-panel .cash-keypad>[data-key="9"]{grid-area:3/3!important}
.payment-number-panel .cash-keypad>[data-key="exact"]{grid-area:3/4!important;font-size:clamp(13px,2.4vw,19px)!important;font-weight:700!important}
.payment-number-panel .cash-keypad>[data-key="0"]{grid-area:4/1!important}
.payment-number-panel .cash-keypad>[data-key="."]{grid-area:4/2!important}
.payment-number-panel .cash-keypad>.key-done{grid-area:4/3/5/5!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:2px!important;font-size:clamp(15px,2.6vw,20px)!important;color:#fff!important;background:linear-gradient(135deg,var(--green),var(--green2))!important;border-color:var(--green)!important;box-shadow:0 5px 14px rgba(217,52,43,.24)!important}
.payment-number-panel .cash-keypad>.key-done b{font-size:clamp(10px,1.7vw,13px)!important;font-weight:600!important;line-height:1.1!important;color:#fff!important}
.payment-number-panel .cash-keypad>[data-key="back"],.payment-number-panel .cash-keypad>[data-key="clear"],.payment-number-panel .cash-keypad>[data-key="exact"]{background:linear-gradient(135deg,var(--green),var(--green2))!important;border-color:var(--green)!important;color:#fff!important;box-shadow:0 5px 14px rgba(217,52,43,.24)!important}
.payment-number-panel .cash-keypad>[data-key="back"]:hover,.payment-number-panel .cash-keypad>[data-key="clear"]:hover,.payment-number-panel .cash-keypad>[data-key="exact"]:hover,.payment-number-panel .cash-keypad>.key-done:hover{transform:translateY(-2px)!important;box-shadow:0 8px 22px rgba(217,52,43,.34)!important;filter:brightness(1.05)!important;border-color:#c42e26!important}
.payment-number-panel .cash-keypad>[data-key="back"]:active,.payment-number-panel .cash-keypad>[data-key="clear"]:active,.payment-number-panel .cash-keypad>[data-key="exact"]:active,.payment-number-panel .cash-keypad>.key-done:active{transform:translateY(0) scale(.97)!important;box-shadow:0 3px 10px rgba(217,52,43,.2)!important;filter:none!important}
.payment-number-panel .cash-keypad>.quick-cash{grid-area:1/5/5/6!important;display:flex!important;flex-direction:column!important;gap:clamp(6px,1vw,9px)!important;margin:0!important;height:auto!important;min-height:0!important}
.payment-number-panel .cash-keypad>.quick-cash button{display:flex!important;align-items:center!important;justify-content:center!important;gap:0!important;color:var(--green)!important;font-weight:900!important;background:#fff!important;border:1px solid var(--line)!important;box-shadow:none!important;flex:1 1 0!important;height:auto!important;min-height:0!important;max-height:none!important;font-size:clamp(20px,3.4vw,28px)!important;transition:transform .14s ease,box-shadow .14s ease,background .14s ease,border-color .14s ease!important}
.payment-number-panel .cash-keypad>.quick-cash button .quick-money-icon{display:none!important}
.payment-number-panel .cash-keypad>.quick-cash button span{font-size:1em;line-height:1;font-variant-numeric:tabular-nums}
.quick-money-icon{width:22px;height:22px;flex:none;color:var(--muted)!important}
.payment-number-panel .cash-keypad>.quick-cash button:hover{background:#fff!important;border-color:#cfc6c4!important;box-shadow:0 4px 14px rgba(38,25,26,.1)!important;transform:translateY(-1px)!important;filter:none!important}
.payment-number-panel .cash-keypad>.quick-cash button:active{transform:scale(.97)!important}
@media(min-width:1201px){#paymentForm{padding-right:0}.payment-number-panel{position:static;inset:auto;width:min(960px,100%);max-width:960px;margin:18px auto 0;padding:20px;max-height:none;overflow:visible;display:flex;flex-direction:column;border-radius:18px;box-shadow:0 10px 28px rgba(73,39,34,.08)}.payment-number-panel .universal-keypad{flex:none;gap:11px}.payment-cart-panel{max-height:calc(92vh - 100px)}.payment-number-panel .cash-keypad{grid-template-rows:repeat(4,clamp(58px,8vh,76px))!important;gap:8px!important}}
@media(min-width:1201px) and (max-height:900px){.payment-number-panel{flex:1;min-height:0;margin-top:8px;padding:9px;overflow:hidden}.payment-number-panel .universal-keypad{flex:1;min-height:0}#paymentForm{padding-right:0}.payment-number-panel .cash-keypad{grid-template-rows:repeat(4,minmax(48px,1fr))!important}}
/* === mobile: let payment modal scroll instead of clipping (fixes can't-scroll + squeeze distortion) === */
@media(max-width:1200px){
  #paymentModal.modal-backdrop{align-items:start!important;place-items:start center!important;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;padding:14px 12px;max-width:100vw}
  .payment-modal:not(.success-mode){max-height:none!important;overflow:visible!important;margin:0 auto}
  .payment-modal:not(.success-mode) #paymentForm{max-height:none!important;overflow:visible!important;height:auto!important;min-height:0!important;display:block!important;padding-left:0!important;padding-right:0!important}
  .payment-modal:not(.success-mode) .payment-cart-panel{position:static!important;max-height:none!important;overflow:visible!important;width:auto!important;inset:auto!important}
  .payment-modal:not(.success-mode) .payment-cart-list{max-height:none!important;overflow:visible!important}
  .payment-modal:not(.success-mode) .payment-number-panel{position:static!important;inset:auto!important;width:100%!important;max-width:none!important;margin:12px 0 0!important;overflow:visible!important;max-height:none!important}
  #paymentForm>.change-row,#paymentForm>.payment-running-total{display:none}
  #paymentForm>#confirmPay{display:none}
}
/* === mobile: admin + product forms scroll on phone/APK === */
/* overflow-y is `hidden`, not `visible`. A lone `visible` beside `overflow-x:hidden`
   is turned into `auto` by the spec, so each of these was its own scroll container —
   and a scroll container inside a -webkit-overflow-scrolling parent can be dragged
   sideways on iOS with nothing there to show. The backdrop scrolls; these do not. */
@media(max-width:820px){
  #adminModal.modal-backdrop,#productModal.modal-backdrop,#adminMemberModal.modal-backdrop{align-items:start!important;place-items:start center!important;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;padding:12px 10px calc(12px + env(safe-area-inset-bottom,0px));max-width:100vw}
  #adminModal .admin-modal,#productModal .product-modal,#adminMemberModal .product-modal{max-height:none!important;overflow-x:hidden!important;overflow-y:hidden!important;margin:0 auto;width:100%!important;max-width:100%!important;min-width:0;box-sizing:border-box}
  #adminModal .admin-product-list,#adminModal #adminReports,#adminModal #adminMembers,#adminModal #adminTax,#adminModal #adminPromotions,#adminModal #adminWithdrawals,#adminModal #adminBarcode,#adminModal #adminEmployees,#adminModal #adminPrinter,#adminModal #settingsForm,#adminModal #adminProducts{max-width:100%;min-width:0}
  #adminModal .admin-product-list{max-height:none!important;overflow-x:hidden!important;overflow-y:hidden!important;border-radius:0 0 12px 12px}
  #adminModal .admin-tabs{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
  #adminModal .admin-tabs button{flex:0 0 auto;white-space:nowrap}
  #adminModal .report-filter{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:8px}
  #adminModal .report-filter label{flex:none;min-width:0}
  #adminModal .report-filter input[type="date"]{width:100%;max-width:100%;min-width:0}
  #adminModal .report-filter .export-report,#adminModal .report-filter>button{grid-column:1/-1;width:100%}
  #adminModal .tax-toolbar{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:8px}
  #adminModal .tax-toolbar label{flex:none}
  #adminModal .tax-toolbar>button{grid-column:1/-1;width:100%}
  #adminModal .admin-member-list{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
  #adminModal .barcode-print-panel,#adminModal .barcode-a4-preview{max-width:100%;min-width:0}
  .admin-toolbar-products .admin-toolbar-row{flex-direction:column;align-items:stretch;gap:8px}
  .admin-toolbar-products .admin-search-field,.admin-toolbar-products .admin-sort-label{flex:1 1 auto;width:100%;min-width:0}
  .admin-toolbar-products .admin-toolbar-row-actions{flex-direction:column;align-items:stretch;gap:8px}
  .admin-toolbar-products .product-toolbar-actions{width:100%}
  .admin-toolbar-products .product-toolbar-actions button{flex:1 1 auto;min-width:0}
  #adminModal .admin-product-pager{display:flex;justify-content:center;padding:12px 0 16px}
  #adminModal .admin-product-pager button,#adminLoadMore,#adminLoadMoreMembers{min-height:44px;padding:10px 20px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--green);font-weight:600;box-shadow:0 2px 8px rgba(20,40,30,.06)}
  #adminModal .admin-product-pager button{min-height:40px;min-width:74px;padding:8px 10px;font-size:12px;flex:0 0 auto}
  #adminModal .admin-product-pager span{width:auto;flex:1 1 auto;min-width:0;font-size:12px;line-height:1.2;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #productModal .product-form .product-image-upload{margin-top:10px;padding:10px}
  #productModal .product-form .login-submit{position:sticky;bottom:0;z-index:2;margin-top:12px}
}
.stock-negative-cell{color:#a8524d;font-weight:700}
/* === scroll-lock: background must not move while any popup is open === */
body.modal-open{position:fixed!important;left:0;right:0;width:100%;overflow:hidden!important;overscroll-behavior:none}
html.modal-open{overflow:hidden!important;overscroll-behavior:none}
/* === bill preview overlay (บิลเงินสด / บิลส่งของ) — iOS-safe printing without popups === */
#billFormatModal,#taxInvoiceModal{z-index:100010}
#demoUpgradeModal{z-index:100030}
#billPrintHost{position:fixed;inset:0;z-index:100000;background:#e9e6df;overflow:auto;-webkit-overflow-scrolling:touch}
#billPrintHost .bill-toolbar{position:sticky;top:0;display:flex;gap:10px;justify-content:flex-end;padding:12px;background:#fff;border-bottom:1px solid #ddd;z-index:2}
#billPrintHost .bill-toolbar button{padding:10px 22px;border-radius:10px;border:1px solid var(--line);font-family:inherit;font-weight:700;font-size:15px;cursor:pointer}
#billPrintHost .bill-print-btn{background:var(--green,#d9342b);color:#fff;border-color:var(--green,#d9342b)}
#billPrintHost .bill-close-btn{background:#fff;color:#333}
#billPrintHost .bill-paper{max-width:800px;margin:16px auto;background:#fff;padding:26px;color:#111;font-family:Arial,sans-serif;font-size:13px;box-shadow:0 6px 24px rgba(0,0,0,.12)}
#billPrintHost .bill-paper section{display:block;margin-bottom:34px}
#billPrintHost .bill-paper .head{text-align:center;margin-bottom:14px}
#billPrintHost .bill-paper .head h1{font-size:20px;margin:0}
#billPrintHost .bill-paper .head small{color:#555}
#billPrintHost .bill-paper .meta{display:flex;justify-content:space-between;font-size:12px;margin-bottom:12px;gap:16px}
#billPrintHost .bill-paper .meta b{font-size:13px}
#billPrintHost .bill-paper .cust-box{border:1px solid #999;border-radius:6px;padding:8px 10px;margin-bottom:12px}
#billPrintHost .bill-paper .cust-title{font-weight:700;font-size:12px;margin-bottom:6px}
#billPrintHost .bill-paper .cust-row{display:flex;align-items:flex-end;gap:8px;margin:7px 0;font-size:12px}
#billPrintHost .bill-paper .cust-row .cl{white-space:nowrap;min-width:64px}
#billPrintHost .bill-paper .cust-row .cline{flex:1;border-bottom:1px dotted #444;min-height:15px;padding:0 4px}
#billPrintHost .bill-paper table{width:100%;border-collapse:collapse;font-size:12px}
#billPrintHost .bill-paper th,#billPrintHost .bill-paper td{border:1px solid #999;padding:6px 8px;text-align:right}
#billPrintHost .bill-paper th{background:#f0f0f0;text-align:center}
#billPrintHost .bill-paper td.desc{text-align:left}
#billPrintHost .bill-paper td:first-child,#billPrintHost .bill-paper th:first-child{text-align:center;width:36px}
#billPrintHost .bill-paper .totals{margin-top:10px;display:flex;justify-content:flex-end}
#billPrintHost .bill-paper .totals table{width:280px}
#billPrintHost .bill-paper .totals td:first-child{text-align:left}
#billPrintHost .bill-paper .signatures{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:60px;font-size:12px;text-align:center}
#billPrintHost .bill-paper .sig-line{border-top:1px solid #333;margin:40px 18px 6px}
html.bill-mode-slip #billPrintHost .bill-paper{max-width:74mm;font-size:11px;padding:14px}
html.bill-mode-slip #billPrintHost .bill-paper .head h1{font-size:15px}
html.bill-mode-slip #billPrintHost .bill-paper .head small{font-size:9px}
html.bill-mode-slip #billPrintHost .bill-paper .meta{flex-direction:column;gap:2px;font-size:10px}
html.bill-mode-slip #billPrintHost .bill-paper .meta>div{text-align:left!important}
html.bill-mode-slip #billPrintHost .bill-paper table{font-size:10px}
html.bill-mode-slip #billPrintHost .bill-paper th,html.bill-mode-slip #billPrintHost .bill-paper td{border:0;border-bottom:1px dotted #999;padding:3px 2px}
html.bill-mode-slip #billPrintHost .bill-paper th{border-bottom:1px solid #000;background:none}
html.bill-mode-slip #billPrintHost .bill-paper th:nth-child(4),html.bill-mode-slip #billPrintHost .bill-paper td:nth-child(4){display:none}
html.bill-mode-slip #billPrintHost .bill-paper .totals{display:block;margin-top:8px}
html.bill-mode-slip #billPrintHost .bill-paper .totals table{width:100%}
html.bill-mode-slip #billPrintHost .bill-paper .totals td{border:0}
html.bill-mode-slip #billPrintHost .bill-paper .signatures{margin-top:24px;gap:12px;font-size:10px}
html.bill-mode-slip #billPrintHost .bill-paper .sig-line{margin:22px 6px 4px}
@media print{
  @page{size:A4;margin:16mm}
  html.bill-open body>*{display:none!important}
  html.bill-open #adminModal{display:none!important}
  html.bill-open #billPrintHost{display:block!important;position:static!important;overflow:visible!important;background:#fff!important}
  html.bill-open,html.bill-open body{background:#fff!important;position:static!important;overflow:visible!important}
  html.bill-open #billPrintHost .bill-toolbar{display:none!important}
  html.bill-open #billPrintHost .bill-paper{max-width:none!important;margin:0!important;padding:0!important;box-shadow:none!important}
  html.bill-open #billPrintHost .bill-paper section{break-after:page;margin:0}
  html.bill-open #billPrintHost .bill-paper section:last-child{break-after:auto}
  /* thermal slip mode: narrow layout + 80mm page */
  @page slip{size:80mm auto;margin:3mm}
  html.bill-mode-slip #billPrintHost .bill-paper{page:slip;width:74mm!important;font-size:11px!important}
  html.bill-mode-slip #billPrintHost .bill-paper .head h1{font-size:15px!important}
  html.bill-mode-slip #billPrintHost .bill-paper .head small{font-size:9px!important}
  html.bill-mode-slip #billPrintHost .bill-paper .meta{flex-direction:column!important;gap:2px!important;font-size:10px!important}
  html.bill-mode-slip #billPrintHost .bill-paper .meta>div{text-align:left!important}
  html.bill-mode-slip #billPrintHost .bill-paper table{font-size:10px!important}
  html.bill-mode-slip #billPrintHost .bill-paper th,html.bill-mode-slip #billPrintHost .bill-paper td{border:0!important;border-bottom:1px dotted #999!important;padding:3px 2px!important}
  html.bill-mode-slip #billPrintHost .bill-paper th{border-bottom:1px solid #000!important;background:none!important}
  html.bill-mode-slip #billPrintHost .bill-paper th:nth-child(4),html.bill-mode-slip #billPrintHost .bill-paper td:nth-child(4){display:none!important}
  html.bill-mode-slip #billPrintHost .bill-paper .totals{display:block!important;margin-top:8px!important}
  html.bill-mode-slip #billPrintHost .bill-paper .totals table{width:100%!important}
  html.bill-mode-slip #billPrintHost .bill-paper .totals td{border:0!important}
  html.bill-mode-slip #billPrintHost .bill-paper .signatures{margin-top:24px!important;gap:12px!important;font-size:10px!important}
  html.bill-mode-slip #billPrintHost .bill-paper .sig-line{margin:22px 6px 4px!important}
}
/* === bill format chooser (A4 / slip) === */
.bill-format-hint{font-size:12px;color:var(--muted);margin:2px 0 18px}
.bill-format-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bill-format-actions button{display:flex;flex-direction:column;align-items:center;gap:5px;padding:22px 12px;border:1.5px solid var(--line);border-radius:14px;font-family:inherit;cursor:pointer}
.bill-format-actions button b{font-size:20px}
.bill-format-actions button small{font-size:11px}
.bill-format-actions #billFormatA4{background:var(--green,#0c4a3c);color:#fff;border-color:var(--green,#0c4a3c)}
.bill-format-actions #billFormatA4 small{color:rgba(255,255,255,.85)}
.bill-format-actions #billFormatSlip{background:var(--accent,#f08c46);color:#fff;border-color:var(--accent,#f08c46)}
.bill-format-actions #billFormatSlip small{color:rgba(255,255,255,.9)}
/* === bill customer input (in format chooser) === */
.bill-cust-form{display:grid;gap:10px;margin-bottom:16px;text-align:left}
.bill-cust-form label{display:block;font-size:12px;color:var(--muted);font-weight:600}
.bill-cust-form input{display:block;width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 12px;margin-top:4px;outline:0;font-family:inherit;font-size:15px;box-sizing:border-box}
.bill-cust-form input:focus{border-color:var(--green)}
.tax-invoice-modal{width:min(460px,100%);max-height:min(92vh,760px);overflow:auto;padding:24px 22px 20px}
.tax-invoice-modal h2{margin-bottom:4px}
.tax-invoice-form{display:grid;gap:0}
.tax-invoice-saved-pick{margin:0 0 14px;padding:12px 14px;border:1px solid #d4e4dc;border-radius:12px;background:linear-gradient(180deg,#f7fbf9 0%,#edf5f1 100%)}
.tax-invoice-saved-pick label{margin:0!important}
.tax-invoice-saved-pick label>span{display:block;font-size:12px;font-weight:600;color:var(--ink)}
.tax-invoice-saved-pick small{display:block;margin-top:2px;font-size:10px;font-weight:400;color:var(--muted)}
.tax-buyer-suggest{display:grid;gap:6px;margin-top:8px}
.tax-buyer-suggest.hidden{display:none}
.tax-buyer-suggest button{border:1px solid #d4e4dc;background:#fff;border-radius:10px;padding:10px 12px;text-align:left;font-family:inherit;cursor:pointer;width:100%}
.tax-buyer-suggest button:hover,.tax-buyer-suggest button:active{background:#edf5f1;border-color:#b9d1c7}
.tax-buyer-suggest button span{display:block;min-width:0}
.tax-buyer-suggest button b{display:block;font-size:14px;line-height:1.35;color:var(--ink)}
.tax-buyer-suggest button small{display:block;margin-top:2px;font-size:11px;color:var(--muted)}
.tax-buyer-suggest-empty{display:block;padding:8px 2px;font-size:12px;color:var(--muted)}
.bill-type-tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:700;line-height:1.4;white-space:nowrap}
.bill-type-tag--cash{background:#edf5f1;color:#1f6b4f}
.bill-type-tag--delivery{background:#fff4e8;color:#a85b00}
.tax-bill-type{font-size:10px;color:var(--muted);white-space:nowrap}
.tax-invoice-form>label,.tax-invoice-grid label{display:block;font-size:12px;font-weight:600;color:var(--ink);margin:12px 0 0}
.tax-invoice-grid{display:grid;grid-template-columns:1.35fr .85fr;gap:10px;margin-top:0}
.tax-invoice-form input,.tax-invoice-form select,.tax-invoice-form textarea{display:block;width:100%;border:1px solid var(--line);border-radius:11px;padding:12px 13px;margin-top:6px;outline:0;font-family:inherit;font-size:15px;background:#fff;color:var(--ink);box-sizing:border-box;transition:border-color .15s,box-shadow .15s}
.tax-invoice-form input:-webkit-autofill,.tax-invoice-form input:-webkit-autofill:hover,.tax-invoice-form input:-webkit-autofill:focus{-webkit-text-fill-color:var(--ink);-webkit-box-shadow:0 0 0 1000px #fff inset;box-shadow:0 0 0 1000px #fff inset;transition:background-color 9999s ease-out 0s}
.tax-invoice-form select{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center;padding-right:36px;cursor:pointer}
.tax-invoice-form input:focus,.tax-invoice-form select:focus,.tax-invoice-form textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 12%,transparent)}
.tax-invoice-form textarea{resize:vertical;min-height:84px;line-height:1.45}
.tax-invoice-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:10px;margin-top:18px}
.tax-invoice-actions button{min-height:50px;border-radius:12px;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:transform .15s,filter .15s,box-shadow .15s}
.tax-invoice-btn-secondary{border:1.5px solid var(--line);background:#fff;color:var(--ink)}
.tax-invoice-btn-secondary:hover{border-color:#b9d1c7;background:#f7fbf9}
.tax-invoice-btn-primary{border:0;background:var(--green);color:#fff;box-shadow:0 6px 16px rgba(217,52,43,.22)}
.tax-invoice-btn-primary:hover{filter:brightness(1.03)}
.tax-invoice-actions button:active{transform:scale(.98)}
@media(max-width:520px){.tax-invoice-grid{grid-template-columns:1fr}.tax-invoice-actions{grid-template-columns:1fr}.tax-invoice-modal{padding:20px 16px 16px}}

/* === v1.61 UI polish — softer surfaces, depth, motion === */
:root{
  --radius-sm:10px;--radius-md:14px;--radius-lg:18px;--radius-xl:24px;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --shadow-soft:0 8px 32px rgba(90,20,16,.08);
  --shadow-card:0 4px 20px rgba(90,20,16,.06),0 1px 3px rgba(90,20,16,.04);
  --shadow-float:0 16px 48px rgba(90,20,16,.12)
}
html,body{
  background:
    radial-gradient(ellipse 80% 55% at 0% 0%,color-mix(in srgb,var(--green) 7%,transparent),transparent 55%),
    radial-gradient(ellipse 65% 45% at 100% 100%,color-mix(in srgb,var(--orange) 5%,transparent),transparent 50%),
    var(--cream)
}
.topbar{
  backdrop-filter:blur(14px) saturate(1.15);
  background:color-mix(in srgb,var(--topbar-bg,#fff) 86%,transparent);
  border-bottom-color:color-mix(in srgb,var(--line) 75%,transparent);
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 4px 24px rgba(90,20,16,.04)
}
.brand-mark{border-radius:15px;font-size:15px;letter-spacing:-.02em}
.brand strong{letter-spacing:-.02em;font-weight:700}
.catalog h1,.checkout h2{letter-spacing:-.03em;font-weight:700}
.eyebrow{color:color-mix(in srgb,var(--green) 55%,var(--muted));letter-spacing:.14em}
.search:focus-within{
  box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 12%,transparent),var(--shadow-card)
}
.catalog-mode-toggle button{
  border-radius:var(--radius-md);
  transition:all .18s var(--ease-out);
  background:var(--paper)
}
.catalog-mode-toggle button:not(.active):hover{
  border-color:color-mix(in srgb,var(--green) 30%,var(--line));
  background:color-mix(in srgb,var(--tint) 40%,#fff)
}
.category{
  border-radius:999px;font-weight:600;font-size:12px;
  background:var(--paper);
  box-shadow:0 1px 4px rgba(90,20,16,.04);
  transition:all .18s var(--ease-out)
}
.category.active{box-shadow:0 6px 18px color-mix(in srgb,var(--green) 32%,transparent)}
.product-grid{gap:16px}
.product-grid .product-card{content-visibility:auto;contain-intrinsic-size:132px 198px;display:flex;flex-direction:column;height:100%}
.product-card{
  border-radius:var(--radius-lg);
  background:linear-gradient(180deg,#fff 0%,color-mix(in srgb,var(--cream) 35%,#fff) 100%);
  box-shadow:var(--shadow-card);
  border-color:color-mix(in srgb,var(--line) 90%,#fff)
}
.product-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-soft);
  border-color:color-mix(in srgb,var(--green) 22%,var(--line))
}
.product-visual{
  border-radius:var(--radius-md);
  background:linear-gradient(145deg,var(--tint) 0%,color-mix(in srgb,var(--paper) 65%,var(--tint)) 100%);
  height:74px;
  margin-bottom:8px;
  font-size:36px;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.product-grid .product-visual.has-image{
  background-size:cover!important;
  background-position:center;
  background-repeat:no-repeat;
  padding:0;
  box-sizing:border-box;
}
.product-foot{margin-top:auto;padding-top:2px}
.product-foot b{font-weight:800;letter-spacing:-.02em;font-size:22px;color:var(--green)}
.product-foot b s{font-size:13px;margin-right:4px}
.product-card h3{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;overflow:hidden;
  line-height:1.28;white-space:normal;overflow-wrap:anywhere;word-break:break-word;
  font-size:16px;font-weight:700;margin:0 0 1px;color:var(--ink);
}
.product-card p{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-size:12px;font-weight:500;margin:0 0 5px;line-height:1.25;color:var(--muted);
}
.pf-add{box-shadow:0 4px 12px rgba(217,52,43,.32)}
.stock-low,.stock-negative,.promo-badge{position:absolute;right:12px;top:12px;z-index:1;padding:4px 7px;font-size:9px;font-weight:600;border-radius:999px}
.stock-low{
  background:linear-gradient(135deg,#fff4e5,#ffe8cc);
  box-shadow:0 2px 8px rgba(178,107,37,.14);
  color:#b26b25;
  letter-spacing:.02em
}
.stock-negative{
  background:linear-gradient(135deg,#fde8e6,#f8d4cf);
  color:#a8524d;
  box-shadow:0 2px 8px rgba(168,82,77,.14);
  letter-spacing:.02em
}
.empty-products{
  background:color-mix(in srgb,var(--tint) 28%,transparent);
  border-radius:var(--radius-xl);
  border:1px dashed color-mix(in srgb,var(--green) 18%,var(--line))
}
.checkout{
  background:linear-gradient(180deg,color-mix(in srgb,var(--tint) 55%,var(--paper)) 0%,var(--paper) 180px);
  box-shadow:-12px 0 44px rgba(90,20,16,.05);
  height:100%;
  min-height:0
}
.checkout-head{
  border-bottom:2px solid color-mix(in srgb,var(--green) 14%,var(--line));
  background:linear-gradient(135deg,color-mix(in srgb,var(--tint-strong) 55%,var(--paper)),color-mix(in srgb,var(--tint) 35%,var(--paper)));
  padding:11px 20px 10px;
  flex-shrink:0
}
.checkout .checkout-head .eyebrow{
  color:var(--green);
  font-weight:700;
  letter-spacing:.12em;
  font-size:10px;
  margin:0
}
.checkout-head-main{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  column-gap:8px;
  row-gap:0;
  align-items:center;
  min-width:0;
}
.checkout-head-main .eyebrow{grid-column:1;grid-row:1}
.checkout-head-main h2{
  grid-column:1;grid-row:2;
  margin:0;
  font-size:18px;
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.1;
}
.checkout-head-main .checkout-cart-badge,
.checkout-head-main #cartBadge{
  grid-column:2;
  grid-row:1/3;
  align-self:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--green),var(--green2));
  box-shadow:0 3px 10px rgba(217,52,43,.3);
  font-weight:900;
  height:42px;
  min-width:42px;
  padding:0 8px;
  border-radius:999px;
  line-height:1;
  letter-spacing:-.05em;
  font-variant-numeric:tabular-nums;
  font-size:22px;
  color:#fff;
  box-sizing:border-box;
}
.checkout-head-main #cartBadge.cart-badge-wide{
  min-width:50px;
  padding:0 7px;
  font-size:18px;
  letter-spacing:-.04em;
}
.checkout h2{
  font-size:18px;
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.15
}
.checkout h2 span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--green),var(--green2));
  box-shadow:0 3px 10px rgba(217,52,43,.3);
  font-weight:900;
  min-width:48px;
  height:48px;
  padding:0 4px 2px;
  border-radius:999px;
  margin:0;
  flex-shrink:0;
  transform:translateY(-6px);
  line-height:1;
  letter-spacing:-.05em;
  font-variant-numeric:tabular-nums;
  font-size:30px;
  box-sizing:border-box;
}
.checkout h2 span.cart-badge-wide{
  min-width:56px;
  font-size:24px;
  letter-spacing:-.04em;
  padding:0 6px 2px;
}
.clear-btn{
  background:transparent;color:var(--green);
  border:1.5px solid color-mix(in srgb,var(--green) 45%,var(--line));
  box-shadow:none;border-radius:8px;
  font-weight:700;
  font-size:11px;
  padding:6px 10px;
  display:inline-flex;align-items:center;gap:5px;
  transition:all .16s var(--ease-out)
}
.clear-btn .ico{width:14px;height:14px}
.clear-btn:hover{background:var(--tint-strong);border-color:var(--green);color:var(--green2)}
.cart-list{padding:10px 20px;flex:1 1 auto;min-height:0;overflow:auto}
.cart-item{
  background:color-mix(in srgb,var(--cream) 45%,var(--paper));
  border-radius:var(--radius-md);
  padding:14px 14px 12px;margin-bottom:8px;
  border:1px solid color-mix(in srgb,var(--green) 8%,var(--line));
  border-bottom:1px solid color-mix(in srgb,var(--green) 8%,var(--line));
  grid-template-columns:40px minmax(0,1fr) minmax(4.8rem,max-content);
  gap:12px;
  align-items:stretch;
  transition:background .15s ease,transform .15s ease;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent
}
.cart-item:active{transform:scale(.985)}
.cart-item:hover{background:color-mix(in srgb,var(--tint) 45%,var(--paper));border-color:color-mix(in srgb,var(--green) 18%,var(--line))}
.cart-qty-badge{
  display:inline-block;font-size:15px;font-weight:800;color:var(--green2);
  background:color-mix(in srgb,var(--tint) 70%,var(--paper));
  border:1px solid color-mix(in srgb,var(--green) 12%,var(--line));
  border-radius:999px;padding:4px 11px;margin-top:4px
}
.cart-thumb{width:40px;height:40px;border-radius:10px;box-shadow:0 2px 8px rgba(90,20,16,.08);font-size:22px}
.cart-list .cart-thumb.has-image{background-size:contain!important;background-position:center;background-repeat:no-repeat}
.cart-info{min-width:0;overflow:hidden}
.cart-info h4{
  font-weight:800;color:var(--ink);font-size:clamp(15px,3.6vw,18px);line-height:1.28;margin:0 0 2px;
  max-width:100%;min-width:0;white-space:normal;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;
  overflow:hidden;text-overflow:ellipsis;
  overflow-wrap:anywhere;word-break:break-word;hyphens:none
}
.cart-info p{font-size:15px;line-height:1.28;margin:0 0 4px;color:var(--muted);max-width:100%;overflow-wrap:anywhere}
.cart-info p s{font-size:13px}
.cart-info .promo-tag{font-size:12px;white-space:normal}
#cartList .cart-price{
  display:flex;align-items:center;justify-content:flex-end;align-self:center;
  min-width:max(4.8rem,calc(var(--price-chars,5) * 0.62ch + 2px));
  max-width:none;padding:0;box-sizing:border-box;
  background:none;border:none;overflow:visible;
}
#cartList .cart-price b{
  color:var(--green);font-weight:900;width:auto;max-width:none;text-align:right;
  font-size:clamp(15px,calc(32px - (var(--price-chars,5) - 4) * 2.4px),28px);
  line-height:1.05;letter-spacing:calc(-.015em - (var(--price-chars,5) - 4) * .004em);
  font-variant-numeric:tabular-nums;white-space:nowrap;overflow:visible;
}
.empty-cart{padding:36px 24px;flex:1 1 auto;display:flex;flex-direction:column;justify-content:center}
.empty-cart .ico-wrap.huge-ico{
  width:80px;height:80px;margin:0 auto 16px;
  border-radius:50%;
  background:linear-gradient(145deg,var(--tint-strong),var(--tint));
  color:var(--green);
  display:grid;place-items:center;
  box-shadow:0 8px 24px rgba(217,52,43,.14);
  filter:none!important;opacity:1!important
}
.empty-cart .ico-wrap.huge-ico .ico{width:38px;height:38px;stroke:var(--green);stroke-width:2.2}
.empty-cart h3{color:var(--ink);font-size:16px;font-weight:800;margin:12px 0 6px}
.empty-cart p{color:#6b5f5e;font-size:13px;line-height:1.65}
.summary{
  background:#fff;
  border-top:2px solid color-mix(in srgb,var(--green) 14%,var(--line));
  border-left:0;
  border-right:0;
  border-bottom:0;
  border-radius:0;
  box-shadow:0 -8px 24px rgba(90,20,16,.07);
  padding:12px 18px max(14px,env(safe-area-inset-bottom,0px));
  margin:0;
  margin-top:auto;
  flex-shrink:0;
  width:100%;
  box-sizing:border-box
}
.checkout .summary .sum-row{padding:2px 0;margin:0;gap:8px;line-height:1.25}
.sum-row b{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;font-size:14px}
.sum-row.muted{color:#756a69;font-size:11px;line-height:1.3}
.total-row{
  border-top:1px solid color-mix(in srgb,var(--green) 20%,var(--line));
  padding-top:8px;margin:8px 0 10px;align-items:baseline
}
.total-row span{font-weight:800;font-size:14px;color:var(--ink)}
.total-row b{font-weight:900;font-size:26px;color:var(--green);letter-spacing:-.03em;line-height:1}
.pay-button{
  border-radius:var(--radius-lg);
  position:relative;overflow:hidden;
  font-size:16px;letter-spacing:.01em;
  min-height:48px;
  font-weight:800;
  border:2px solid transparent;
  margin-top:0
}
.pay-button:not(:disabled){
  background:linear-gradient(135deg,#ea3a30,var(--green2));
  box-shadow:0 12px 30px rgba(217,52,43,.38)
}
.pay-button:disabled{
  background:linear-gradient(135deg,color-mix(in srgb,var(--green) 28%,#f5efee),color-mix(in srgb,var(--green) 14%,#ebe4e3));
  color:rgba(255,255,255,.92);
  border-color:color-mix(in srgb,var(--green) 22%,var(--line));
  box-shadow:0 6px 18px rgba(217,52,43,.12);
  opacity:1;cursor:not-allowed
}
.pay-button:not(:disabled)::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.18) 50%,transparent 62%);
  transform:translateX(-120%);
  transition:transform .55s var(--ease-out);
  pointer-events:none
}
.pay-button:not(:disabled):hover::after{transform:translateX(120%)}
.order-info .member-select-button{
  border-radius:var(--radius-md);
  transition:all .16s var(--ease-out)
}
.login-screen{
  background:
    radial-gradient(circle at 18% 18%,rgba(240,169,162,.42),transparent 42%),
    radial-gradient(circle at 82% 82%,rgba(246,201,160,.32),transparent 40%),
    linear-gradient(160deg,#fce8e5 0%,#fdf6f4 45%,#faecea 100%)
}
.login-screen::before,.login-screen::after{filter:blur(70px);opacity:.6;animation:login-float 14s ease-in-out infinite alternate}
.login-screen::after{animation-delay:-7s}
@keyframes login-float{from{transform:translate(0,0) scale(1)}to{transform:translate(18px,-12px) scale(1.06)}}
.login-card{
  backdrop-filter:blur(22px) saturate(1.25);
  background:rgba(255,255,255,.78);
  border:1px solid rgba(255,255,255,.92);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-float),0 0 0 1px rgba(255,255,255,.55) inset;
  animation:login-card-in .45s var(--ease-out)
}
@keyframes login-card-in{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.login-intro h1{letter-spacing:-.03em;font-weight:800}
#loginForm label input,#loginUsername,#loginPassword{
  border-radius:12px;
  transition:border-color .16s ease,box-shadow .16s ease
}
#loginForm label input:focus,#loginUsername:focus,#loginPassword:focus{
  border-color:var(--green);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 10%,transparent)
}
.login-user-fixed input{
  background:#f5f5f5;
  color:var(--muted);
  cursor:default;
}
.login-user-fixed input:focus{
  border-color:var(--line);
  box-shadow:none;
}
.login-admin-note{margin:0 0 12px;padding:10px 12px;border-radius:12px;background:#fff4f2;border:1px solid #f3d4cf;color:#7a2e28;font-size:12px;line-height:1.45}
.employee-form-note{margin:-4px 0 12px;padding:10px 12px;border-radius:12px;background:#fff8f6;border:1px solid #f0ddd9;color:#6d4a44;font-size:12px;line-height:1.45}
.employee-admin-card{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px 16px;margin-bottom:12px;border-radius:14px;background:linear-gradient(135deg,#fff4f2,#fff);border:1px solid #f3d4cf}
.employee-admin-card .admin-tag{background:#fdecea;color:#b8261e}
.employee-status-col{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.employee-presence{display:inline-flex;align-items:center;font-size:9px;font-weight:700;padding:3px 8px;border-radius:999px;white-space:nowrap}
.employee-presence.online{background:#e5f2eb;color:#23825a}
.employee-presence.offline{background:#f0f0f0;color:#777}
.employee-presence-hint{color:var(--muted);font-size:10px}
.employee-row .employee-status-col em{margin:0}
.login-submit{border-radius:var(--radius-md);box-shadow:0 10px 28px rgba(217,52,43,.3);font-weight:700}
.toast{
  border-radius:999px;padding:12px 22px;font-weight:600;font-size:13px;
  background:color-mix(in srgb,var(--ink) 88%,var(--green));
  box-shadow:var(--shadow-float);backdrop-filter:blur(10px)
}
.toast.show{transform:translate(-50%,0)}
.user-button em{box-shadow:0 2px 10px rgba(217,52,43,.14)}
.date-box b{font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.sub-days-left{display:block;margin-top:4px;font-size:11px;font-weight:600;color:#2f8f57;line-height:1.2}
.sub-days-left.warn{color:#b45309}
.sub-days-left.danger{color:#c0392b}
.sub-days-left.lifetime{color:#047857}
@media(max-width:820px){.sub-days-left{display:none!important}}
.admin-menu-toggle{border-radius:var(--radius-md)}
.modal-backdrop{backdrop-filter:blur(8px) saturate(1.1)}
@media (prefers-reduced-motion:reduce){
  .login-screen::before,.login-screen::after,.login-card{animation:none}
  .pay-button:not(:disabled)::after{display:none}
  .search:focus-within,.product-card:hover{transform:none}
}

/* admin menu: keep dropdown above catalog (mobile stacking fix) */
.topbar{position:sticky;top:0;z-index:500;overflow:visible}
/* แถบบนไม่ทับตะกร้า — topbar อยู่เฉพาะคอลัมน์สินค้า */
@media(min-width:821px){
  .app-shell{
    display:grid;
    grid-template-columns:minmax(0,1fr) 420px;
    grid-template-rows:auto minmax(0,1fr);
    flex-direction:unset
  }
  .topbar{
    grid-column:1;
    grid-row:1
  }
  main{display:contents}
  .catalog{
    grid-column:1;
    grid-row:2;
    min-height:0
  }
  .checkout{
    grid-column:2;
    grid-row:1 / -1;
    min-height:0;
    height:100%;
    max-height:100dvh;
    align-self:stretch
  }
}
@media(min-width:821px) and (max-width:1100px){
  .app-shell{grid-template-columns:minmax(0,1fr) 370px}
}
@media(max-width:820px){
  .app-shell{display:flex;flex-direction:column}
}
html:not(.restoring-session):not(.session-admin):not(.session-staff):not(.session-customer) body:has(#loginScreen:not(.hidden)) .app-shell,
body:has(#subscriptionBlock:not(.hidden)) .app-shell{
  visibility:hidden;
  pointer-events:none
}
html.session-admin #loginScreen,
html.session-staff #loginScreen,
html.session-customer #loginScreen{
  display:none!important;
  pointer-events:none!important
}
html.session-admin .app-shell,
html.session-staff .app-shell,
html.session-customer .app-shell{
  visibility:visible!important;
  pointer-events:auto!important
}
.admin-menu-wrap{z-index:501}
.admin-menubar{z-index:1000;max-height:min(70vh,calc(100dvh - 96px));overflow-y:auto;-webkit-overflow-scrolling:touch}
body:has(.admin-menubar.open)::before{
  content:"";position:fixed;inset:0;background:rgba(20,30,25,.22);z-index:499;pointer-events:none
}
/* modals/toast above sticky topbar (500) */
.modal-backdrop{z-index:600}
#servicesModal{z-index:600}
#discountModal,#voidSaleModal,#svcHistoryDetailModal{z-index:605}
#employeeModal,#employeePasswordModal,#productModal,#adminMemberModal{z-index:610}
#scannerModal,#photoCaptureModal{z-index:620}
.global-kb{z-index:650}
.toast{z-index:1200}

/* product grid — edit button on catalog cards */
.product-edit-btn{
  position:absolute;left:8px;top:8px;z-index:4;
  width:30px;height:30px;border-radius:9px;
  border:1px solid color-mix(in srgb,var(--line) 82%,#fff);
  background:rgba(255,255,255,.94);color:var(--green);
  display:grid;place-items:center;padding:0;
  font-size:15px;line-height:1;font-family:inherit;
  box-shadow:0 2px 8px rgba(20,40,30,.1);cursor:pointer;
  transition:background .15s ease,border-color .15s ease,transform .12s ease
}
.product-edit-btn:hover{
  background:#fff;
  border-color:color-mix(in srgb,var(--green) 38%,var(--line));
  box-shadow:0 4px 12px rgba(20,60,45,.14)
}
.product-edit-btn:active{transform:scale(.94)}
.product-grid.reordering .product-edit-btn{opacity:.35;pointer-events:none}
.categories-wrap{display:flex;align-items:stretch;gap:6px;margin:16px 0 12px;min-width:0}
.categories-wrap .categories{flex:1;min-width:0;margin:0;touch-action:pan-x;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scroll-behavior:smooth;padding-bottom:4px}
.categories-scroll{flex:none;width:40px;align-self:center;min-height:40px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--green);font-size:26px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(20,40,30,.06);padding:0}
.categories-scroll:active{background:var(--tint);transform:scale(.96)}
.categories-wrap:not(.has-overflow) .categories-scroll{display:none}
.native-shell .categories-scroll{width:46px;min-height:46px;font-size:28px}
.categories .category{touch-action:pan-x}
.categories.reordering{touch-action:pan-x;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.categories.reordering .category:not([data-cat="ทั้งหมด"]){cursor:grab;box-shadow:0 0 0 2px color-mix(in srgb,var(--green) 25%,transparent);user-select:none;-webkit-user-select:none}
.categories.reordering .category.dragging,.category.dragging{cursor:grabbing;touch-action:none;opacity:.92;transform:scale(1.04);z-index:2;position:relative}

/* admin pagination — single compact row */
.admin-product-scroll-sentinel{height:1px;width:100%;pointer-events:none;visibility:hidden}
.admin-product-pager{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap}
.admin-product-pager button{min-width:84px;white-space:nowrap;border-radius:10px;box-shadow:0 1px 4px rgba(20,40,30,.06);transition:transform .12s ease,background .12s ease}
.admin-product-pager button:not(:disabled):active{transform:scale(.97)}
.admin-product-pager .nav-pager-label,.admin-product-pager span{flex:1 1 auto;min-width:0;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.catalog-loading{grid-column:1/-1;text-align:center;padding:48px 16px;color:#79837e;font-weight:600}
.catalog-pager{display:flex;justify-content:center;padding:12px 0 20px}
.catalog-pager button{min-height:44px;padding:10px 20px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--green);font-weight:600;box-shadow:0 2px 8px rgba(20,40,30,.06)}
.catalog-pager button:active{transform:scale(.98)}

.subscription-blocked .app-shell{display:none!important}
.subscription-meta{display:grid;gap:10px;margin:0 0 18px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fafafa}
.subscription-meta div{display:flex;justify-content:space-between;gap:12px;font-size:13px}
.subscription-meta span{color:var(--muted)}
.subscription-contact{margin:14px 0 0;font-size:12px;color:var(--muted);text-align:center}
.subscription-contact a{color:var(--green);font-weight:600}
.subscription-renew-link{display:block;text-align:center;margin-top:10px;text-decoration:none;background:#fff;color:var(--green)!important;border:2px solid var(--green);box-shadow:none}
.login-demo-bar.demo-only{margin-top:4px}
.login-demo-bar.demo-only .demo-login-btn{min-height:58px}
.demo-login-mode .login-error{margin:0 0 12px}
.employee-modal{width:min(580px,100%);max-height:min(92dvh,880px);overflow:auto;padding:22px 26px 26px}
.employee-modal-form.employee-form{border:0;padding:0;background:transparent;margin:0;box-shadow:none}
.employee-list-full{max-width:760px;margin:0 auto}
.employee-list-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:4px}
.employee-add-btn{border:0;background:var(--green);color:#fff;border-radius:10px;padding:10px 14px;font-size:12px;font-weight:600;white-space:nowrap;box-shadow:0 4px 14px rgba(35,130,90,.18);transition:transform .15s ease,filter .15s ease}
.employee-add-btn:active{transform:scale(.98)}
.employee-modal .employee-form-actions{margin-top:14px}

/* account menu — anchor to profile button, not viewport right edge */
.user-menu-wrap{position:relative;flex-shrink:0}
.user-menu-wrap .account-menu{
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  left:auto;
  z-index:550;
}

/* cart item edit modal */
.cart-item-modal-head{display:flex;align-items:center;gap:14px;margin:8px 0 18px}
.cart-item-modal-thumb{width:56px;height:56px;border-radius:12px;font-size:30px;flex-shrink:0}
.cart-item-modal-head h2{
  font-size:clamp(16px,4.2vw,20px);margin:0 0 4px;line-height:1.3;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;
  overflow:hidden;overflow-wrap:anywhere;word-break:break-word
}
.cart-item-modal-head p{margin:0;font-size:13px;color:var(--muted);line-height:1.4}
.cart-item-modal-qty{
  display:flex;align-items:center;justify-content:center;gap:18px;
  margin:0 0 16px;padding:12px;
  background:color-mix(in srgb,var(--cream) 50%,var(--paper));
  border:1px solid var(--line);border-radius:14px
}
.cart-item-modal-qty button{
  width:52px;height:52px;border-radius:12px;border:1px solid var(--line);
  background:#fff;color:var(--green);font-size:28px;font-weight:700;line-height:1;
  box-shadow:0 2px 8px rgba(20,40,30,.06);transition:transform .12s ease,background .12s ease
}
.cart-item-modal-qty button:active{transform:scale(.94);background:var(--tint)}
.cart-item-modal-qty input{
  flex:1;max-width:140px;min-width:72px;min-height:52px;
  font-size:clamp(28px,8vw,36px);font-weight:900;text-align:center;color:var(--ink);
  border:1px solid color-mix(in srgb,var(--green) 22%,var(--line));
  background:#fff;font-variant-numeric:tabular-nums;
  border-radius:12px;padding:0 8px;
  box-shadow:0 2px 8px rgba(20,40,30,.06);
  cursor:text;
}
.cart-item-modal-qty input:focus{
  outline:0;border-color:var(--green);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 22%,transparent);
}
.cart-item-modal-qty-hint{margin:-8px 0 14px;text-align:center;font-size:11px;color:var(--muted);line-height:1.35}
.cart-item-modal-qty-hint.hidden{display:none!important}
.cart-item-modal-qty-label{font-size:clamp(28px,8vw,36px);font-weight:900;min-width:72px;text-align:center;color:var(--ink);flex:1}
.cart-item-modal-weight{margin:0 0 14px}
.cart-item-modal-weight label{display:block;font-size:13px;font-weight:600;color:var(--muted)}
.cart-item-modal-weight input{width:100%;margin-top:6px;font-size:18px;font-weight:700;padding:10px 12px;border-radius:10px;border:1px solid var(--line)}
.cart-item-modal-total{text-align:center;font-size:15px;color:var(--muted);margin:0 0 12px}
.cart-item-modal-total b{font-size:24px;color:var(--green);font-weight:900}
.cart-item-modal-confirm{width:100%;margin:0 0 10px}
.cart-item-modal-delete{
  width:100%;min-height:46px;border:1px solid #f0c4c0;background:#fff5f4;color:#b8524d;
  border-radius:12px;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px;
  transition:background .15s ease,border-color .15s ease
}
.cart-item-modal-delete:hover{background:#ffeceb;border-color:#e8a8a3}
.cart-item-modal-delete .ico{width:18px;height:18px}
@media(max-width:760px){#employeeModal.modal-backdrop{align-items:flex-start;overflow-y:auto;padding:12px 10px calc(12px + env(safe-area-inset-bottom,0px))}.employee-modal{max-height:none;margin:0 auto;width:100%!important}}

/* POS APK / แท็บเล็ต — topbar อยู่คอลัมน์สินค้า ต้องกระชับไม่ทับกัน */
@media (min-width:821px){
  .topbar-left{min-width:0}
  .top-actions{gap:10px;min-width:0;flex-shrink:0}
}
@media (min-width:821px) and (max-width:1400px){
  .topbar{height:auto;min-height:64px;padding:8px 14px;gap:8px;flex-wrap:wrap;align-content:center}
  .topbar-left{flex:1 1 200px;gap:10px}
  .brand{min-width:0;flex:1 1 auto}
  .brand>div{min-width:0;overflow:hidden}
  .brand strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .brand span{font-size:11px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .top-actions{flex:1 1 auto;justify-content:flex-end;flex-wrap:wrap;gap:6px}
  .date-box{flex-shrink:0;line-height:1.25}
  .date-box #today{display:none}
  .date-box b{font-size:14px}
  .date-box .sub-days-left{font-size:10px;margin-top:2px;max-width:9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .user-menu-wrap{flex-shrink:0}
  .user-button{padding-left:10px;border-left:0;grid-template-columns:38px;min-width:38px}
  .user-button span,.user-button small{display:none}
  .user-button em{margin-left:0;grid-column:1;grid-row:1}
  .user-button .status{right:-3px;top:-3px}
  .top-cash-drawer-button,
  .withdrawal-menu-button#servicesButton,
  .withdrawal-menu-button#customerDisplayButton,
  .sync-data-button{font-size:0;gap:0;padding:8px 10px;min-width:42px;justify-content:center}
  .top-cash-drawer-button .ico-wrap,
  .withdrawal-menu-button#servicesButton .ico-wrap,
  .withdrawal-menu-button#customerDisplayButton .ico-wrap,
  .sync-data-button .ico-wrap{width:18px;height:18px}
  .top-cash-drawer-button .ico,
  .withdrawal-menu-button#servicesButton .ico,
  .withdrawal-menu-button#customerDisplayButton .ico,
  .sync-data-button .ico{width:18px;height:18px}
  .admin-menu-toggle{padding:8px 12px;font-size:12px}
}
@media (min-width:821px){
  html.native-shell .topbar{height:auto;min-height:52px;padding:6px 10px;gap:6px;flex-wrap:nowrap}
  html.native-shell .topbar-left{flex:1 1 auto;gap:8px;min-width:0}
  html.native-shell .brand-mark{width:36px;height:36px;font-size:13px;flex:none}
  html.native-shell .brand{min-width:0;max-width:min(42vw,240px)}
  html.native-shell .brand strong{font-size:13px;line-height:1.15}
  html.native-shell .brand span{display:none}
  html.native-shell .top-actions{gap:5px;flex-wrap:nowrap;flex-shrink:0}
  html.native-shell .date-box{display:none!important}
  html.native-shell .user-button span,
  html.native-shell .user-button small{display:none}
  html.native-shell .user-button{padding-left:0;border-left:0;grid-template-columns:34px;min-width:34px}
  html.native-shell .user-button em{width:34px;height:34px;margin-left:0;font-size:13px}
  html.native-shell .top-cash-drawer-button,
  html.native-shell .withdrawal-menu-button#servicesButton,
  html.native-shell .withdrawal-menu-button#customerDisplayButton,
  html.native-shell .sync-data-button{font-size:0;gap:0;padding:7px 9px;min-width:38px;min-height:38px;justify-content:center}
  html.native-shell .admin-menu-toggle{font-size:0;gap:0;padding:7px 9px;min-width:38px;min-height:38px;justify-content:center}
  html.native-shell .admin-menu-toggle .ico-wrap{display:inline-flex;font-size:14px}
  html.native-shell .admin-menu-toggle .ico{width:18px;height:18px}
}
.menu-sub-days{display:block;margin-top:4px;font-size:11px;font-weight:600;color:#2f8f57;line-height:1.2}
.menu-sub-days.warn{color:#b45309}
.menu-sub-days.danger{color:#c0392b}
.menu-sub-days.lifetime{color:#047857}
.menu-sub-days.hidden{display:none!important}

.admin-feature-star{
  min-width:34px;padding:6px 8px;border:1px solid #d4cfc4;border-radius:10px;background:#fff;
  color:#b8b0a4;font-size:15px;line-height:1;cursor:pointer;font-weight:700;
}
.admin-feature-star:hover{border-color:#c9a227;color:#c9a227}
.admin-feature-star.active{border-color:#e6b422;background:linear-gradient(180deg,#fff9e6,#fff3cc);color:#c98700;box-shadow:0 2px 8px rgba(201,135,0,.18)}
.admin-featured-mark{font-style:normal;color:#c98700;font-weight:700}
@media(max-width:480px){
  .admin-product-actions button.admin-feature-star{font-size:0;padding:5px 2px}
  .admin-product-actions button.admin-feature-star::before{content:'★';font-size:12px}
  .admin-product-actions button.admin-feature-star.active::before{color:#c98700}
}

/* reCAPTCHA v3 (Firebase App Check) — ซ่อน badge มุมจอ ตามนโยบาย Google ต้องมีข้อความใน flow (ดู .login-recaptcha-note) */
.grecaptcha-badge,
iframe[title="reCAPTCHA"] {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  position: fixed !important;
  right: -9999px !important;
  bottom: 0 !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  transform: scale(0) !important;
}

.login-recaptcha-note {
  margin: 10px 0 0;
  font-size: 10px;
  line-height: 1.45;
  color: var(--muted);
  text-align: center;
}

.login-recaptcha-note a {
  color: color-mix(in srgb, var(--muted), var(--green) 35%);
  text-decoration: none;
}

.login-recaptcha-note a:hover {
  text-decoration: underline;
}

.services-modal{width:min(560px,100%);max-height:min(92vh,900px);overflow-y:auto;padding-bottom:20px}
.svc-type-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:14px 0 16px}
.svc-type-tabs button{height:42px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font:inherit;font-weight:600;font-size:11px;cursor:pointer;padding:0 4px;white-space:nowrap}
.svc-type-tabs button.active{background:var(--green);color:#fff;border-color:var(--green)}
.svc-form label{display:block;margin:0 0 10px;font-size:12px;font-weight:600;color:var(--muted)}
.svc-form input,.svc-form select{display:block;width:100%;height:44px;margin-top:6px;border:1px solid var(--line);border-radius:12px;padding:0 12px;font:inherit;font-size:15px;background:#fff;color:var(--ink);box-sizing:border-box}
.svc-form input:focus,.svc-form select:focus{outline:0;border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 14%,transparent)}
.svc-scan-field{display:flex;gap:6px;margin-top:4px;align-items:stretch}
.svc-scan-field input{flex:1;min-width:0;margin:0!important}
.svc-scan-field button{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;border:1px solid #b9d1c7;background:#edf5f1;color:var(--green);border-radius:10px;padding:0 12px;font-size:12px;font-weight:700;white-space:nowrap;cursor:pointer}
.svc-scan-field button:hover{background:var(--green);color:#fff}
.svc-scan-field button .ico{flex:none}
.svc-suggest{margin:-4px 0 10px;border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden;max-height:160px;overflow-y:auto}
.svc-suggest button{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:#fff;padding:10px 12px;font:inherit;cursor:pointer}
.svc-suggest button:last-child{border-bottom:0}
.svc-suggest button:hover{background:#faf7f6}
.svc-suggest b{display:block;font-size:13px;color:var(--ink)}
.svc-suggest small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.svc-fee-box{margin:4px 0 12px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#faf7f6}
.svc-totals{display:grid;gap:6px;margin-top:10px}
.svc-totals>div{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted)}
.svc-totals b{color:var(--ink);font-variant-numeric:tabular-nums}
.svc-total-row{padding-top:6px;border-top:1px dashed var(--line);font-weight:700;color:var(--ink)!important}
.svc-total-row b{font-size:18px;color:var(--green)}
.svc-hint{margin:0 0 12px;font-size:12px;line-height:1.45;color:var(--muted)}
.svc-section-label{margin:0 0 8px;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.02em}
.svc-shop-account{margin:0 0 14px}
.svc-shop-account.empty .svc-bank-card{opacity:.55}
.svc-shop-account-empty{margin:8px 0 0;font-size:12px;color:var(--muted);line-height:1.4}
.svc-shop-account:not(.empty) .svc-shop-account-empty{display:none}
.svc-shop-account.empty .svc-bank-copy-btn{pointer-events:none;opacity:.4}
.svc-transfer-review{margin:0 0 12px}
.svc-bank-card{display:grid;gap:0;border-radius:14px;border:1px solid var(--line);background:#fff;overflow:hidden;box-shadow:0 4px 16px rgba(90,20,16,.05)}
.svc-bank-row{display:grid;gap:4px;padding:12px 14px;border-bottom:1px solid var(--line)}
.svc-bank-row:last-child{border-bottom:0}
.svc-bank-label{font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--muted)}
.svc-bank-name-line{display:flex;align-items:center;gap:10px;min-width:0}
.svc-bank-logo{flex-shrink:0;width:40px;height:40px;border-radius:10px;overflow:hidden;background:#f3f4f6;box-shadow:0 2px 10px rgba(15,23,42,.1)}
.svc-bank-logo.svc-net-logo{background:#fff;border:1px solid var(--line)}
.svc-bank-logo.svc-net-logo img{padding:4px;box-sizing:border-box}
.svc-bank-name-line b,.svc-bank-row>b{font-size:15px;font-weight:700;color:var(--ink);word-break:break-word}
.svc-bank-copy-wrap{display:flex;align-items:center;justify-content:space-between;gap:10px}
.svc-bank-number{font-size:20px;font-weight:800;letter-spacing:.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.svc-bank-copy-btn{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;height:34px;padding:0 10px;border:1px solid color-mix(in srgb,var(--green) 55%,#fff);border-radius:10px;background:#fff;color:var(--green);font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.svc-bank-copy-btn:hover{background:color-mix(in srgb,var(--green) 8%,#fff)}
.svc-transfer-amount-line{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding:12px 14px;border-radius:12px;background:#faf7f6;border:1px solid var(--line);font-size:13px;color:var(--muted)}
.svc-transfer-amount-line b{font-size:22px;color:var(--green);font-variant-numeric:tabular-nums}
.svc-transfer-review-hint{margin:8px 0 0;font-size:12px;color:var(--muted);line-height:1.4}
.svc-transfer-review.ready .svc-transfer-review-hint{color:#0c8a3c;font-weight:600}
.svc-shop-fill-btn{display:inline-flex;align-items:center;justify-content:center;margin-top:10px;width:100%;min-height:40px;padding:0 12px;border:1.5px dashed color-mix(in srgb,var(--green) 40%,var(--line));border-radius:12px;background:#f7fbf8;color:var(--green);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.svc-shop-fill-btn:hover{background:#eef8f1;border-style:solid}
.svc-action-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:10px;margin-top:4px}
.svc-cancel-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 14px;border:1.5px solid var(--line);border-radius:14px;background:#fff;color:var(--muted);font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.svc-cancel-btn:hover{color:var(--ink);border-color:color-mix(in srgb,var(--ink) 22%,var(--line));background:#fafafa}
.svc-transfer-edit{margin:0 0 10px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px}
.svc-shop-fill-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.svc-shop-fill-head b{font-size:13px;font-weight:800;color:var(--ink)}
.svc-shop-fill-close{border:0;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:700;cursor:pointer;padding:4px 6px}
.svc-shop-fill-close:hover{color:var(--ink)}
.svc-transfer-edit.hidden{display:none!important}
.svc-transfer-review.svc-shop-filling .svc-shop-fill-btn{display:none}
.svc-confirm-btn{margin:0}
.svc-history-item{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:10px 0;border-bottom:1px dashed var(--line);font-size:13px}
.svc-history-item:last-child{border-bottom:0}
.svc-history-item b{color:var(--ink)}
.svc-history-item small{color:var(--muted);grid-column:1/-1}
.svc-history-empty{padding:8px 0;font-size:12px;color:var(--muted)}
.svc-field-label{display:block;margin:0 0 8px;font-size:12px;font-weight:600;color:var(--muted)}
.svc-net-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0 0 10px}
.svc-net-btn{display:grid;place-items:center;height:48px;padding:4px 6px;border:1.5px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .12s}
.svc-net-btn img{max-width:100%;max-height:32px;width:auto;height:auto;object-fit:contain;pointer-events:none}
.svc-net-btn:hover{border-color:color-mix(in srgb,var(--green) 40%,var(--line))}
.svc-net-btn.active{border-color:var(--green);box-shadow:0 0 0 2px color-mix(in srgb,var(--green) 16%,transparent);background:#f7fbf8}
.svc-net-btn:active{transform:scale(.98)}
@media(max-width:380px){.svc-net-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-net-btn{height:52px}.svc-net-btn img{max-height:34px}}
.svc-rate-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:#fff}
.svc-rate-table{width:100%;border-collapse:collapse;font-size:13px}
.svc-rate-table th,.svc-rate-table td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left}
.svc-rate-table th{font-size:11px;color:var(--muted);font-weight:600;background:#faf7f6}
.svc-rate-table tr:last-child td{border-bottom:0}
.svc-rate-table input{width:100%;height:38px;border:1px solid var(--line);border-radius:10px;padding:0 10px;font:inherit;box-sizing:border-box}
.svc-rate-table .svc-rate-remove{border:0;background:transparent;color:#c0392b;font:inherit;font-size:12px;font-weight:600;cursor:pointer;padding:6px 4px}
.svc-rate-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.svc-rate-actions button{height:36px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font:inherit;font-size:12px;font-weight:600;padding:0 12px;cursor:pointer}
.svc-rate-actions .svc-rate-reset{color:var(--green);border-color:color-mix(in srgb,var(--green) 35%,var(--line))}
.svc-fee-auto-hint{display:block;margin:6px 0 0;font-size:11px;color:var(--muted);font-weight:500}
@media(max-width:560px){.svc-type-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.svc-type-tabs button{height:40px;font-size:11px}}@media(max-width:380px){.svc-type-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}


.empty-products{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:48px 20px;text-align:center;min-height:220px}
.catalog-sync-retry{width:min(280px,100%);margin-top:8px;min-height:46px}

.svc-bill-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px}
.svc-bill-type-btn{min-height:44px;border:1.5px solid var(--line);border-radius:12px;background:#fff;font-size:14px;font-weight:800;color:#18231f;cursor:pointer}
.svc-bill-type-btn.active{border-color:var(--green);background:#f7fbf8;color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 14%,transparent)}
.svc-bill-provider-grid .svc-net-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:auto;min-height:52px;padding:6px 4px;font-size:9px;font-weight:700;color:#475569}
.svc-bill-provider-grid .svc-net-btn img{max-height:26px}
.svc-bill-provider-grid .svc-net-btn small{line-height:1.1;text-align:center;font-size:10px;font-weight:700;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(min-width:520px){.svc-bill-type-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

.svc-shop-edit-hint{margin:0 0 12px;color:#6b7280;font-size:13px}
.svc-bank-field{display:grid;gap:6px;margin:0 0 10px}
.svc-bank-dropdown{position:relative}
.svc-bank-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:52px;padding:8px 12px 8px 10px;border:1.5px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;font:inherit;color:var(--ink);text-align:left}
.svc-bank-trigger:hover{border-color:color-mix(in srgb,var(--green) 35%,var(--line))}
.svc-bank-dropdown.is-open .svc-bank-trigger{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 14%,transparent)}
.svc-bank-trigger-inner{flex:1;min-width:0;display:flex;align-items:center;gap:10px}
.svc-bank-picker-logo{flex-shrink:0;width:40px;height:40px;border-radius:50%;overflow:hidden;background:#fff;border:1px solid var(--line);display:grid;place-items:center;box-shadow:0 1px 4px rgba(15,23,42,.08)}
.svc-bank-picker-logo img{width:100%;height:100%;object-fit:contain;display:block}
.svc-bank-trigger-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.svc-bank-picker-name{font-size:14px;font-weight:800;color:var(--ink);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.svc-bank-picker-meta{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;padding:1px 7px;border-radius:7px;background:#eef1f4;color:#64748b;font-size:11px;font-weight:700}
.svc-bank-picker-meta code{font:inherit;font-weight:800;color:#475569}
.svc-bank-placeholder{font-size:14px;font-weight:700;color:var(--muted)}
.svc-bank-chevron{flex-shrink:0;color:var(--muted);transition:transform .2s}
.svc-bank-dropdown.is-open .svc-bank-chevron{transform:rotate(180deg)}
.svc-bank-panel{position:absolute;z-index:50;top:calc(100% + 6px);left:0;right:0;max-height:min(40vh,280px);overflow:auto;padding:8px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:0 16px 40px rgba(15,23,42,.14)}
.svc-bank-panel.hidden{display:none!important}
.svc-bank-item{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;border-radius:10px;background:transparent;cursor:pointer;font:inherit;text-align:left;color:var(--ink)}
.svc-bank-item:hover{background:#f7fbf8}
.svc-bank-item.is-selected{background:#f0faf3;box-shadow:inset 0 0 0 1.5px var(--green)}
.svc-bank-item .svc-bank-picker-logo{width:32px;height:32px}
.svc-bank-item .svc-bank-picker-name{font-size:13px}

.svc-shop-rates{margin:16px 0 14px;padding-top:14px;border-top:1px dashed var(--line)}
.svc-shop-rates .svc-section-label{margin-top:14px}
.svc-shop-rates .svc-section-label:first-child{margin-top:0}
.svc-shop-rates .svc-shop-edit-hint{margin:8px 0 0}
.svc-shop-rates .svc-rate-actions{margin-bottom:4px}
.svc-history-filters{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 12px}
.svc-history-filters label{display:grid;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}
.svc-history-filters input[type="date"]{min-height:42px;border:1px solid var(--line);border-radius:12px;padding:0 12px;font:inherit;color:var(--ink);background:#fff}
.svc-history-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 12px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#faf7f6}
.svc-history-summary>div{display:grid;gap:4px;min-width:0}
.svc-history-summary span{font-size:11px;font-weight:700;color:var(--muted);line-height:1.3}
.svc-history-summary b{font-size:16px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.svc-history-summary-profit b{color:var(--green)}
@media (max-width:420px){.svc-history-summary{grid-template-columns:1fr}.svc-history-summary>div{display:flex;justify-content:space-between;align-items:baseline;gap:10px}}
.svc-history-panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:12px 0 8px}
.svc-history-panel-head b{font-size:14px}
.svc-history-panel-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.svc-history-panel-tools small{font-size:12px;color:var(--muted)}
.svc-history-export{border:1px solid #b9d1c7;background:#edf5f1;color:var(--green);border-radius:10px;padding:7px 10px;font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.svc-history-export:hover{background:var(--green);color:#fff}
.svc-history-panel-list{max-height:min(52vh,420px);overflow-y:auto;border:1px solid var(--line);border-radius:12px;background:#fff;padding:4px 12px}
.svc-history-scroll-sentinel{height:1px;width:100%;pointer-events:none;visibility:hidden}
.svc-history-pager{display:flex;justify-content:center;padding:10px 0 4px}
.svc-history-pager button{min-height:42px;padding:8px 18px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--green);font-weight:600;box-shadow:0 2px 8px rgba(20,40,30,.06)}
.svc-history-pager button:active{transform:scale(.98)}
.svc-history-item-top{display:contents}
.svc-history-no{display:inline-block;grid-column:1/-1;font:inherit;font-size:12px;font-weight:700;color:var(--green);background:#edf5f1;border:0;border-radius:8px;padding:4px 8px;width:fit-content;cursor:pointer;text-align:left}
.svc-history-no:hover{background:var(--green);color:#fff}
.svc-history-actions{grid-column:1/-1;margin-top:2px}
.svc-history-actions button{border:1px solid #b9d1c7;background:#edf5f1;color:var(--green);border-radius:8px;padding:6px 10px;font-size:11px;font-weight:700;cursor:pointer}
.svc-history-actions button:hover{background:var(--green);color:#fff}
.svc-history-detail{display:grid;gap:0;margin:14px 0 16px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
.svc-history-detail-row{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid var(--line);font-size:13px}
.svc-history-detail-row:last-child{border-bottom:0}
.svc-history-detail-row span{color:var(--muted);flex:0 0 auto}
.svc-history-detail-row b{text-align:right;color:var(--ink);font-weight:700;overflow-wrap:anywhere}

.payment-transfer-card{margin-top:8px;background:#fff;border:1px solid #eadfdc;border-radius:12px;overflow:hidden}
.payment-transfer-card-head{padding:10px 12px;font-size:12px;font-weight:800;color:#8b3a34;background:#fff7f6;border-bottom:1px solid #eadfdc}
.payment-transfer-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid #f0ebe8;font-size:13px;color:#738079}
.payment-transfer-row:last-child{border-bottom:0}
.payment-transfer-row b,.payment-transfer-row code{color:#18231f;font-weight:800;font-size:13px;text-align:right;word-break:break-all}
.payment-transfer-received{background:#fff9f8}
.payment-transfer-received span{color:#8b3a34;font-weight:800}
.payment-transfer-received b{color:#d9342b;font-size:18px}

/* services top button: never collapse / always beat .hidden when session active */
html.session-admin #servicesButton,
html.session-staff #servicesButton,
html.session-admin #servicesButton.hidden,
html.session-staff #servicesButton.hidden{display:inline-flex!important;visibility:visible!important;opacity:1}
@media(max-width:820px){
  .topbar{flex-wrap:nowrap;align-items:center}
  .top-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;min-width:0;flex:0 1 auto;justify-content:flex-end}
  .top-actions>.withdrawal-menu-button,
  .top-actions>.top-cash-drawer-button,
  .top-actions>.sync-data-button{flex:none;flex-shrink:0}
  .date-box{display:none!important}
  .withdrawal-menu-button#servicesButton .ico{width:18px!important;height:18px!important;min-width:18px}
}


/* Login must sit above custom keyboard; hide KB while login is visible (mobile). */
#loginScreen:not(.hidden){z-index:100040}
#loginScreen:not(.hidden) ~ .global-kb{display:none!important;pointer-events:none!important}
.login-screen::before,.login-screen::after{pointer-events:none}
.login-password-field{position:relative}
.login-password-field input{padding-right:64px!important;box-sizing:border-box}
.login-password-field .show-password{position:absolute;right:8px;bottom:8px;z-index:2;touch-action:manipulation}
#loginForm input,#loginForm .login-submit{touch-action:manipulation}
#loginForm input{-webkit-user-select:text;user-select:text}

#loginMobileRepair{display:block;width:100%;margin-top:8px;text-align:center;font-size:12px}
@media(min-width:821px){#loginMobileRepair{display:none}}

#loginAdminNote{display:block!important;margin:0 0 10px;padding:10px 12px;border-radius:10px;background:#fff4f2;border:1px solid #f0cfc9;color:#8a3a34;font-size:12px;line-height:1.45;font-weight:600}
.login-store-bind{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;padding:10px 12px;border-radius:12px;background:#f3faf4;border:1px solid #cfe8d4;color:#1f5c34;font-size:12px;line-height:1.4;font-weight:600}
.login-store-bind.hidden{display:none!important}
.login-store-bind-copy{flex:none;border:0;border-radius:999px;padding:7px 12px;background:#1f5c34;color:#fff;font:inherit;font-size:11px;font-weight:700;cursor:pointer}
.login-store-bind-copy:active{transform:scale(.98)}
#loginError:not(.hidden){display:block!important;margin-top:12px;padding:12px;font-size:13px;font-weight:700}
#loginUsername,#loginPassword{font-size:16px!important}

.catalog-rescue-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;padding:14px 16px;border:1px dashed color-mix(in srgb,var(--green) 30%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--tint) 55%,#fff)}
.catalog-rescue-bar.hidden{display:none!important}
.catalog-rescue-copy{min-width:0;display:flex;flex-direction:column;gap:2px}
.catalog-rescue-copy b{font-size:14px;color:var(--ink)}
.catalog-rescue-copy small{font-size:11px;color:var(--muted);word-break:break-all}
.catalog-rescue-bar .login-submit{flex:none;min-height:42px;width:auto;min-width:150px;padding:0 14px;font-size:13px}
@media(max-width:820px){.catalog-rescue-bar{flex-direction:column;align-items:stretch}.catalog-rescue-bar .login-submit{width:100%}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.employee-transfer-image{margin:10px 0;padding:12px;border:1px solid var(--line,#eadfdc);border-radius:12px;background:#fff}
.employee-transfer-image>b{display:block;font-size:13px}
.employee-transfer-image>small{display:block;color:var(--muted,#8a7a76);margin:2px 0 8px;font-size:11px}
.employee-transfer-preview{min-height:60px;display:flex;align-items:center;justify-content:center;border:1px dashed var(--line,#eadfdc);border-radius:10px;padding:8px;margin-bottom:8px;background:#faf7f6}
.employee-transfer-preview img{max-width:160px;max-height:160px;object-fit:contain;border-radius:8px}
.employee-transfer-empty{font-size:11px;color:var(--muted,#8a7a76)}
.employee-transfer-actions{display:flex;gap:8px}
.employee-transfer-actions .login-submit{flex:1;min-height:38px}
.employee-transfer-remove{border:1px solid #ddc9c6;background:#fff;color:#a65852;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:600}

html.session-staff button[data-svc-type="shop"]{display:none!important}

.grecaptcha-badge{visibility:hidden!important;opacity:0!important;pointer-events:none!important}
.settings-card.settings-tab-off{display:none!important}
.settings-section-nav a.active{background:var(--color,#d9342b);color:#fff;box-shadow:0 4px 12px rgba(217,52,46,.28)}
.settings-section-nav a.active:hover{background:var(--color,#d9342b);color:#fff}
.staff-transfer-image{margin:12px 0 0;padding:12px;border:1px solid var(--line,#eadfdc);border-radius:12px;background:#fff;text-align:left}
.staff-transfer-image>b{display:block;font-size:13px}
.staff-transfer-image>small{display:block;color:var(--muted,#8a7a76);margin:2px 0 8px;font-size:11px}
.transfer-image-fallback{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.transfer-image-fallback img{width:64px;height:64px;object-fit:contain;border:1px dashed var(--line,#eadfdc);border-radius:10px;background:#fff;padding:3px;opacity:.75}
.transfer-image-fallback small{color:var(--muted,#8a7a76);font-size:10px}
.checkout-head{gap:8px;flex-wrap:wrap}
.hold-bill-btn{border:1px solid rgba(217,52,43,.35);background:#fff;color:var(--green);font-size:12px;font-weight:700;border-radius:9px;padding:8px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.hold-bill-btn:hover{background:#fdecea}
.hold-bill-btn b{background:var(--green);color:#fff;border-radius:999px;min-width:20px;padding:1px 6px;font-size:11px;text-align:center}
.held-bill-hint{margin:2px 0 12px;font-size:12px;color:#738079}
.held-bill-list{display:flex;flex-direction:column;gap:8px;max-height:52vh;overflow:auto}
.held-bill-row{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid #e5e7eb;border-radius:12px;padding:10px 12px}
.held-bill-info b{display:block;font-size:17px;font-weight:800;color:#18231f}
.held-bill-info small{display:block;margin-top:2px;font-size:12px;color:#738079}
.held-bill-actions{display:flex;gap:6px;flex-shrink:0}
.held-bill-resume,.held-bill-delete{border:0;border-radius:9px;padding:8px 12px;font-size:12px;font-weight:700;cursor:pointer}
.held-bill-resume{background:var(--green);color:#fff}
.held-bill-delete{background:#f2f4f3;color:#8a3129}
.held-bill-empty{margin:14px 0;text-align:center;color:#738079;font-size:13px}
.custom-payment-locked{display:inline-flex;align-items:center;padding:8px 12px;border-radius:9px;background:#f2f4f3;color:#738079;font-size:12px;font-weight:700;white-space:nowrap}
/* รูปสินค้า: กฎ cover เดิมอยู่แต่ใน media query จอเล็ก จอใหญ่จึงได้ background-size auto แล้วรูปปูซ้ำ */
.product-visual.has-image{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;font-size:0}
.admin-product>span.has-image{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;font-size:0}
.cart-thumb.has-image,.cart-item-modal-thumb.has-image{background-size:contain!important;background-position:center!important;background-repeat:no-repeat!important;font-size:0}
.product-image-preview{background-size:contain;background-position:center;background-repeat:no-repeat}
/* กรอบจัตุรัสบอกขอบเขตที่ระบบจะเก็บ ถ่ายแล้วได้ภาพตรงกับที่เห็น */
.photo-capture-camera{position:relative}
.photo-capture-camera #photoVideo{aspect-ratio:1/1;object-fit:cover;width:100%;height:auto}
.photo-square-guide{position:absolute;inset:0;border:2px dashed rgba(255,255,255,.75);border-radius:12px;pointer-events:none}

/* ── Every modal has to be reachable on a phone ────────────────────────────────
 *
 * .modal-backdrop centres its modal with `display:grid;place-items:center`, and a
 * centred grid item that is taller than its container overflows in both
 * directions with no way to scroll to either end. .product-modal capped itself at
 * 90vh to avoid that — but on iOS `vh` counts the space behind Safari's toolbars,
 * so 90vh is taller than what the customer can actually see and the bottom of the
 * form sits underneath the browser chrome.
 *
 * That was being fixed one modal at a time: #adminModal, #productModal and
 * #adminMemberModal at 820px, #employeeModal at 760px, #paymentModal at 1200px,
 * #memberModal by height. Five of thirty-two. #purchaseTaxModal was one of the
 * twenty-seven left, which is why บันทึกภาษีซื้อ could not be filled in on a
 * phone: มูลค่าก่อน VAT and the save button were below the cut.
 *
 * So this covers all of them by class instead of by name. flex with `margin:auto`
 * rather than `place-items:safe center`, because `safe` is not reliable on the
 * Safari versions these tills run: auto margins centre a modal that fits and
 * simply stop centring one that does not, leaving it scrollable from the top.
 *
 * The id-scoped rules above still win where they use !important — the payment
 * screen in particular has a layout of its own and is left alone.
 */
@supports (height:100dvh) {
  /* iOS reports `inset:0` against the large viewport, so the bottom of the
     backdrop hides behind the toolbar. dvh is the space actually on screen. */
  .modal-backdrop { height: 100dvh; }
}

@media (max-width: 820px) {
  .modal-backdrop {
    display: flex;
    place-items: normal;
    /* The backdrop is the only thing that scrolls, and only downwards. Sideways is
       spelled out rather than inherited so nothing here can start a horizontal
       rubber-band on a touch screen. */
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-x: none;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    padding: 10px 10px calc(10px + env(safe-area-inset-bottom, 0px));
  }

  /* `overflow: hidden`, not `visible`. Writing overflow-y:visible next to
     overflow-x:hidden does not mean what it reads as: the spec turns a lone
     `visible` into `auto`, which quietly made every modal its own scroll
     container. On iOS a scroll container nested in a -webkit-overflow-scrolling
     parent can be dragged sideways even with nothing to show there, and it was. */
  .modal-backdrop > .modal {
    margin: auto;
    max-height: none;
    overflow: hidden;
    overscroll-behavior: none;
  }
}

/* ── The expiry countdown must be visible on the devices shops actually use ──
 *
 * .sub-days-left is hidden below 820px in two places, so on a phone or tablet the
 * topbar never showed how many days were left. The other signals are thin: the
 * badge in the account menu has to be opened to be seen, the warning toast fires
 * once a session, and the warning email has been failing on an invalid Resend key
 * — subscriptionCron logs "API key is invalid" every night. A shop could reach the
 * day its package lapsed without having been told once.
 *
 * Only `danger` is brought back: seven days or fewer, or already past. That is the
 * window the email itself was written to cover (30, 7, 1, 0 — and the last three
 * are all danger). `warn` stays hidden, because it starts a month out and demo
 * shops carry it permanently, and a badge that is always there is furniture.
 */
@media (max-width: 820px) {
  /* :not(.hidden) is load-bearing. hideBoth() in updateSubDaysLeft adds `hidden`
     but leaves the previous `danger` class in place, so a shop that went offline
     after seeing the warning would have kept a stale badge on screen. */
  .date-box .sub-days-left.danger:not(.hidden),
  .sub-days-left.danger:not(.hidden) {
    display: block !important;
  }
}