/* Desktop counter layout, with independent compact phone presentation. */
html{scroll-behavior:smooth}body{--nav-height:70px;--dock-height:169px}main>*{min-width:0}button{touch-action:manipulation}input,select{min-width:0}nav svg{width:23px;height:23px;display:block;margin:auto}nav button{min-height:48px;border-radius:12px}nav button:hover{background:#f0f6fa}.brand small{line-height:1.6}.heading h1{font-weight:700;letter-spacing:-1.2px}.ticket-title{gap:10px}.ticket-title h2{font-size:20px}.product{box-shadow:0 2px 3px #20303b02}.product:hover{box-shadow:0 8px 22px #20303b0a}.primary{min-height:52px}.textbutton,.remove,.close{min-width:44px;min-height:44px}.textbutton:disabled{opacity:.4;cursor:default}.filters button{min-height:44px}.close{top:9px;right:9px}dialog{overscroll-behavior:contain}dialog input,dialog select{font-size:16px}dialog .quantity{font-size:32px}.error{overflow-wrap:anywhere}.line .edit{min-width:0;min-height:44px}.line .edit small{line-height:1.5}.line strong{white-space:nowrap}.search input{font-size:16px}.search{border-radius:12px}#lines{min-height:0}.ticket-title .textbutton{color:#0076ad}#pending{color:#0076ad}#toast{max-width:calc(100vw - 32px);text-align:center}nav .selected{background:#e8f4fb}.note{line-height:1.6}
@media(min-width:901px){
 body:not(.phone-preview){background:#f3f5f8}
 body:not(.phone-preview) header{height:100px;padding:0 38px;gap:20px}
 body:not(.phone-preview) .brand-stripe{height:5px}
 body:not(.phone-preview) nav{top:105px;bottom:0;left:0;width:100px;border-top:0;border-right:1px solid #e1e6ec;flex-direction:column;justify-content:flex-start;align-items:center;gap:13px;padding:29px 10px;background:#fff}
 body:not(.phone-preview) nav button{width:76px;min-width:0;height:72px;padding:12px 4px;font-size:20px}
 body:not(.phone-preview) nav span{font-size:11px;font-weight:600;margin-top:9px}
 body:not(.phone-preview) main{margin:0 auto 0 100px;max-width:none;padding:36px clamp(24px,3vw,52px) 32px;display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,390px);gap:30px;align-items:start}
 body:not(.phone-preview) .catalog{max-width:1040px;width:100%;justify-self:end}
 body:not(.phone-preview) .heading{display:flex;align-items:center;gap:16px;min-height:78px}
 body:not(.phone-preview) h1{font-size:34px;margin:9px 0 7px}
 body:not(.phone-preview) .heading p{margin:0;font-size:13px}
 body:not(.phone-preview) .eyebrow{font-size:10px;letter-spacing:1.5px}
 body:not(.phone-preview) .secondary{padding:13px 16px;border-radius:10px;font-weight:600}
 body:not(.phone-preview) .search{margin-top:27px;background:#fff;box-shadow:0 2px 4px #20303b02}
 body:not(.phone-preview) .search input{height:54px}
 body:not(.phone-preview) .filters{margin:20px 0;gap:10px}
 body:not(.phone-preview) .filters button{min-width:86px;padding:10px 20px;font-weight:600;border-color:transparent;background:#e9edf2;color:#586570}
 body:not(.phone-preview) .filters button.active{background:#007eb8;color:#fff;box-shadow:0 3px 8px #007eb820}
 body:not(.phone-preview) .products{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
 body:not(.phone-preview) .product{padding:16px;border-radius:15px;min-height:170px;border-color:#e3e8ee}
 body:not(.phone-preview) .fruit{height:86px;font-size:49px;background:#f5f8fb;margin-bottom:15px;border-radius:10px}
 body:not(.phone-preview) .product strong{font-size:15px}
 body:not(.phone-preview) .product small{font-size:12px;padding-right:23px;margin-top:8px}
 body:not(.phone-preview) .plus{width:28px;height:28px;right:13px;bottom:15px;font-size:20px}
 body:not(.phone-preview) .ticket{width:100%;position:sticky;top:24px;border-radius:18px;padding:0;min-height:560px;height:calc(100dvh - 173px);max-height:830px;box-shadow:0 8px 28px #23314207;overflow:hidden;border:1px solid #e0e6ed}
 body:not(.phone-preview) .ticket-title{padding:24px 22px 20px;flex-shrink:0;border-bottom:1px solid #e8edf2;background:#fcfdfe}
 body:not(.phone-preview) #lines{overflow-y:auto;flex:1;padding:8px 22px;scrollbar-width:thin}
 body:not(.phone-preview) .empty{height:100%;min-height:220px;display:flex;flex-direction:column;justify-content:center;padding:30px 12px}
 body:not(.phone-preview) .empty b{font-size:42px;color:#007eb8;opacity:.28;margin-bottom:18px}
 body:not(.phone-preview) .empty strong{font-size:14px}
 body:not(.phone-preview) .empty p{font-size:12px;max-width:210px;margin:10px auto}
 body:not(.phone-preview) .ticket-bottom{padding:22px 22px 10px;margin:0;flex-shrink:0;background:#fbfcfe;border-top:1px solid #e5ebf1}
 body:not(.phone-preview) .total{margin-bottom:19px}
 body:not(.phone-preview) .total>span{font-size:14px;font-weight:600}
 body:not(.phone-preview) .total strong{font-size:32px;font-variant-numeric:tabular-nums}
 body:not(.phone-preview) #checkout{border-radius:11px;min-height:55px;font-size:16px}
 body:not(.phone-preview) #pending{margin:6px auto 0}
 body:not(.phone-preview) .note{margin:20px 0;font-size:11px;color:#84909a}
 body:not(.phone-preview) #toast{bottom:28px}
}
@media(min-width:901px) and (max-width:1120px){body:not(.phone-preview) main{grid-template-columns:minmax(0,1fr) 320px;gap:20px;padding:28px 24px}body:not(.phone-preview) .heading{display:block}body:not(.phone-preview) .heading .secondary{margin-top:15px}body:not(.phone-preview) .products{gap:10px}body:not(.phone-preview) .product{padding:11px}body:not(.phone-preview) .product small{padding-right:0}body:not(.phone-preview) .plus{display:none}body:not(.phone-preview) h1{font-size:30px}}
@media(min-width:651px) and (max-width:900px){body:not(.phone-preview) main{grid-template-columns:minmax(0,1fr) 290px;gap:18px;padding:26px 20px 110px}body:not(.phone-preview) .ticket{padding:18px;top:20px}body:not(.phone-preview) .products{grid-template-columns:repeat(2,minmax(0,1fr))}body:not(.phone-preview) .heading{display:block}body:not(.phone-preview) .heading .secondary{margin-top:10px}body:not(.phone-preview) .filters{flex-wrap:wrap}body:not(.phone-preview) .filters button{padding:9px 14px}body:not(.phone-preview) .ticket-title h2{font-size:18px}}
@media(max-width:650px){
 body{--nav-height:70px}header{padding:0 16px}main{padding:23px 16px calc(var(--nav-height) + var(--dock-height) + 35px + env(safe-area-inset-bottom));display:block}
 .heading h1{font-size:28px}.heading p{font-size:13px}.heading .secondary{min-height:44px;margin-top:10px}.products{grid-template-columns:repeat(3,minmax(0,1fr))}.product{min-width:0}.product strong{overflow-wrap:anywhere}.filters{display:flex;gap:6px}.filters button{padding:9px 13px}.search{margin-top:19px}
 nav{height:calc(var(--nav-height) + env(safe-area-inset-bottom));padding:8px 12px calc(8px + env(safe-area-inset-bottom));gap:8px;justify-content:space-around}nav button{flex:1;min-width:0;max-width:95px}nav span{font-size:11px;margin-top:4px}
 .ticket{padding:18px;min-height:180px}.ticket-title h2{font-size:19px}.ticket-bottom{bottom:calc(var(--nav-height) + env(safe-area-inset-bottom));padding:12px 16px 4px}.ticket-bottom .total{margin-bottom:9px}.ticket-bottom .total strong{font-size:26px}.ticket-bottom #pending{margin:0 auto;min-height:38px;padding:8px}.ticket-bottom .primary{min-height:51px}#toast{bottom:calc(var(--nav-height) + var(--dock-height) + 15px + env(safe-area-inset-bottom))}
 dialog{max-height:calc(100dvh - 24px);padding:28px 22px 24px;max-width:calc(100vw - 24px)}.quick{gap:6px}.quick button{min-height:44px;padding:8px 4px;font-size:14px}.price-row{grid-template-columns:minmax(0,1fr) 105px}.empty{padding:22px 8px}
}
@media(max-width:360px){.products{grid-template-columns:repeat(2,minmax(0,1fr))}.filters{gap:4px}.filters button{padding:9px 10px;font-size:12px}.brand>span:not(.tw-logo){font-size:24px}.line{gap:4px}.line strong{font-size:12px}.ticket{padding:14px}}
.phone-preview{border-radius:0;overflow:visible;min-height:100vh}.phone-preview .brand{gap:8px}.phone-preview .brand>span:not(.tw-logo){font-size:23px}.phone-preview .brand small{font-size:6px}.phone-preview .brand .tw-logo{width:94px;height:48px;background-size:251.9px 192.5px;background-position:-80.3px -47.3px}.phone-preview .filters{gap:6px}.phone-preview .filters button{padding:9px 13px}.phone-preview main{padding-bottom:260px}.phone-preview nav{height:70px;padding:8px 12px;gap:8px}.phone-preview nav button{flex:1;min-width:0}.phone-preview .ticket-bottom{bottom:70px;padding:12px 16px 4px}.phone-preview #pending{min-height:38px;margin:0 auto;padding:8px}.phone-preview dialog{max-width:366px}.phone-preview #toast{bottom:250px}.phone-preview .heading .secondary{margin-top:10px}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Keep the brand visible while browsing, and fit a compact 4 × 2 desktop grid. */
body{--brand-height:98px;--stripe-height:6px}
header{position:sticky;top:0;z-index:20}
.brand-stripe{position:sticky;top:var(--brand-height);z-index:20}
html{scroll-padding-top:110px}
.ticket{scroll-margin-top:110px}
@media(min-width:901px){
 body:not(.phone-preview){--brand-height:78px;--stripe-height:5px}
 body:not(.phone-preview) header{height:var(--brand-height);padding:0 30px}
 body:not(.phone-preview) nav{top:calc(var(--brand-height) + var(--stripe-height));width:88px;padding:20px 6px;gap:10px}
 body:not(.phone-preview) nav button{width:70px;height:65px}
 body:not(.phone-preview) main{margin-left:88px;padding:22px clamp(18px,2.2vw,36px);grid-template-columns:minmax(0,1fr) minmax(290px,340px);gap:24px}
 body:not(.phone-preview) .heading{display:flex;min-height:62px;gap:12px}
 body:not(.phone-preview) h1{font-size:28px;margin:6px 0}
 body:not(.phone-preview) .heading p{font-size:12px}
 body:not(.phone-preview) .heading .secondary{margin-top:0;padding:11px 12px;font-size:12px}
 body:not(.phone-preview) .search{margin-top:16px}
 body:not(.phone-preview) .search input{height:46px}
 body:not(.phone-preview) .filters{margin:12px 0;gap:8px}
 body:not(.phone-preview) .filters button{min-width:75px;min-height:40px;padding:8px 14px;font-size:12px}
 body:not(.phone-preview) .products{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
 body:not(.phone-preview) .product{min-height:126px;padding:11px;border-radius:12px}
 body:not(.phone-preview) .fruit{height:52px;font-size:35px;margin-bottom:10px;border-radius:8px}
 body:not(.phone-preview) .product strong{font-size:14px;overflow-wrap:anywhere}
 body:not(.phone-preview) .product small{font-size:11px;margin-top:6px;padding-right:0}
 body:not(.phone-preview) .plus{display:none}
 body:not(.phone-preview) .ticket{top:calc(var(--brand-height) + var(--stripe-height) + 20px);height:calc(100dvh - var(--brand-height) - var(--stripe-height) - 42px);min-height:360px;max-height:760px}
 body:not(.phone-preview) .ticket-title{padding:18px}
 body:not(.phone-preview) .ticket-title h2{font-size:18px}
 body:not(.phone-preview) #lines{padding:6px 18px}
 body:not(.phone-preview) .empty{min-height:100px;padding:15px 8px}
 body:not(.phone-preview) .ticket-bottom{padding:16px 18px 6px}
 body:not(.phone-preview) .total{margin-bottom:12px}
 body:not(.phone-preview) .total strong{font-size:28px}
 body:not(.phone-preview) .note{margin:12px 0 0}
}
@media(min-width:901px) and (max-width:1100px){
 body:not(.phone-preview) main{grid-template-columns:minmax(0,1fr) 285px;gap:16px;padding:20px 16px}
 body:not(.phone-preview) .products{gap:8px}
 body:not(.phone-preview) .product{padding:9px;min-height:121px}
 body:not(.phone-preview) .product strong{font-size:12px}
 body:not(.phone-preview) .product small{font-size:10px}
 body:not(.phone-preview) .heading p{max-width:235px}
}
@media(min-width:651px) and (max-width:900px){body:not(.phone-preview) .ticket{top:118px}}
@media(max-width:650px){body{--brand-height:84px}header{height:var(--brand-height)}}
.phone-preview{--brand-height:85px}
.phone-preview header{height:var(--brand-height)}
@media(min-width:901px) and (max-height:560px){body:not(.phone-preview) .ticket{position:static;min-height:360px;height:auto}body:not(.phone-preview) #lines{max-height:220px}}

/* Cash change: high contrast and a clear label, including exact payment. */
.change-highlight{display:block;background:#fff0f0;border:3px solid #c90019;border-radius:14px;padding:18px 12px;margin:20px 0;text-align:center;color:#b80016!important}.change-highlight span{display:block;font-size:13px;font-weight:800;letter-spacing:1px;color:#b80016}.change-highlight strong{display:block;margin-top:8px;color:#c00018;font-size:clamp(30px,8vw,48px);font-weight:850;line-height:1.15;letter-spacing:-1px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}@media(max-width:380px){.change-highlight{padding:16px 8px}.change-highlight strong{font-size:32px}}

.weight-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.weight-fields label{margin-top:4px}.weight-fields input{margin-top:8px}.quantity-heading{display:flex;align-items:center;gap:16px}.quantity-heading .modalfruit{font-size:42px}.quantity-heading h2{margin:5px 0}.quantity-heading p{font-size:12px;margin:0}.sale-modes{display:flex;gap:8px;margin:20px 0 12px}.sale-modes button{flex:1;border:1px solid #c8dce7;background:#f4f8fb;border-radius:10px;padding:12px 8px;min-height:44px;color:#0076ad}.sale-modes .active{background:#007eb8;color:white;border-color:#007eb8}.quantity-summary{font-size:20px;font-weight:700;text-align:center;padding:12px;background:#f0f7fb;border-radius:10px}#quantityform .subtotal{margin:16px 0}#quantityform .error:empty{min-height:0;margin:8px 0}#quantityform .quick{flex-wrap:wrap;margin-bottom:4px}#quantityform .quick button{min-width:64px}#quantityform #clearqty{display:block;margin:0 auto 4px}.phone-preview dialog .quantity-heading{gap:10px}@media(max-width:650px){.weight-fields{gap:10px}.quantity-heading .modalfruit{font-size:34px}}

/* Product catalog editor */
.managed-list{margin-top:16px}.managed-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid #e3e9ee;padding:13px 0}.managed-row>div{flex:1;min-width:0}.managed-row strong{display:block;overflow-wrap:anywhere}.managed-row small{display:block;margin-top:4px;color:#667581;font-size:12px}.managed-row .secondary{padding:10px;min-height:44px}.managed-emoji{font-size:28px}.product-live{display:flex;align-items:center;gap:16px;background:#f0f7fb;border:1px solid #cde3ee;border-radius:14px;padding:16px;margin:16px 0}.product-live>span{font-size:42px}.product-live strong,.product-live small{display:block;overflow-wrap:anywhere}.product-live small{margin-top:6px;color:#526575}.product-live>div{min-width:0}.product-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.product-fields>div{min-width:0}.product-fields select{width:100%;min-width:0}.emoji-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:20px}.emoji-picker{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.emoji-picker button{min-height:44px;border:1px solid #dbe5eb;background:#f6f9fb;border-radius:9px;font-size:25px;padding:6px}.emoji-picker button[aria-pressed="true"]{border:2px solid #007eb8;background:#e1f3ff}.product-visible{display:flex;align-items:center;gap:10px;margin-top:20px!important}.product-visible input{width:20px!important;height:20px;margin:0!important}.filters{flex-wrap:wrap}.product strong{overflow-wrap:anywhere}#productform input,#productform select,#managequery{font-size:16px}#productform .primary{margin-top:8px}@media(max-width:360px){.product-fields{grid-template-columns:1fr}.emoji-picker{grid-template-columns:repeat(5,minmax(0,1fr))}}

.last-ticket{margin:8px 12px;background:#edf7fc;border:1px solid #cde3ef;border-radius:10px;color:#0076ad;font-size:12px;flex-shrink:0}.last-ticket[hidden]{display:none}.business-logo{display:block;max-width:140px;max-height:80px;margin:10px auto}.business-logo[hidden]{display:none}.integration-note{background:#f2f6f9;border-radius:12px;padding:14px;margin-top:18px}.integration-note p{margin-bottom:0;font-size:13px}.receipt-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.receipt-actions button,.receipt-actions a{display:flex;align-items:center;justify-content:center;text-align:center;min-height:48px;padding:10px;font-size:13px;text-decoration:none}.whatsapp-ticket{color:#17643b;border-color:#b4d8c2;background:#effaf3}.receipt-preview{background:#edf1f4;padding:16px 10px;border-radius:12px}.receipt-paper{background:white;max-width:320px;margin:auto;padding:18px;color:#17212a;font:13px Arial,sans-serif;box-shadow:0 3px 12px #17212a12;overflow-wrap:anywhere}.receipt-head{text-align:center}.receipt-head img{max-width:120px;max-height:70px}.receipt-paper h2{font-size:20px;margin:8px 0}.receipt-head>strong{font-size:11px}.receipt-items{border-top:1px dashed #aebac2;margin-top:16px}.receipt-item{padding:10px 0;border-bottom:1px dashed #aebac2}.receipt-item>div{display:flex;justify-content:space-between;gap:8px;margin-top:5px;font-size:11px}.receipt-item b{white-space:nowrap}.receipt-total{display:flex;justify-content:space-between;gap:8px;font-size:20px;margin-top:16px}.sales-list{display:grid;gap:8px}.sale-ticket{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;border:1px solid #dce6ed;border-radius:10px;background:#f6fafc;padding:14px;color:#243746}.sale-ticket small{display:block;margin-top:5px;font-size:11px}.sale-ticket b{white-space:nowrap;font-size:13px}#receiptdone{width:100%;margin-top:10px}

.cash-boxes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 14px}.cash-box{border:1px solid #cddfe8;border-radius:14px;padding:16px;min-width:0;background:#f3f8fb}.cash-box>span{display:block;font-size:14px;font-weight:700}.cash-box>strong{display:block;font-size:clamp(22px,5vw,30px);margin:10px 0;letter-spacing:-.7px;overflow-wrap:anywhere}.cash-box>small{font-size:12px;color:#526571}.cash-physical{background:#f3f8f2;border-color:#d0dfc9}.cash-digital{background:#edf8ff;border-color:#bee4f8}.cash-digital>span{color:#0076ad}.cash-breakdown{font-size:11px;border-top:1px solid #cce4ef;padding-top:10px;margin-top:12px;line-height:1.8}.cash-grand-total{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#414143;color:white;padding:16px;border-radius:12px}.cash-grand-total small{display:block;font-size:12px;margin-top:5px;color:#ddd}.cash-grand-total>strong{font-size:24px;overflow-wrap:anywhere}.cash-filters{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.cash-filters button{border:1px solid #cddfe8;background:#f4f8fb;padding:10px 15px;min-height:44px;border-radius:10px;color:#345}.cash-filters .active{background:#007eb8;border-color:#007eb8;color:white}@media(max-width:420px){.cash-boxes{grid-template-columns:1fr}.cash-box{padding:14px}.cash-box>strong{font-size:28px}}.phone-preview .cash-boxes{grid-template-columns:1fr}