/* Navigation (nav.js; owner picked option A on Nov 1, 2026). Phones under 820 px: slim top bar + bottom tab bar.
   Wide screens: a menu across the top. The old header links and the 21-area strip stay in the page, hidden. */
.has-nv .hdr-r,.has-nv .areabar{display:none!important}
.has-nv .brand-area{display:none}
.nv-r{display:flex;align-items:center;gap:6px;margin-left:auto;min-width:0}
.nv-area{display:inline-flex;align-items:center;gap:4px;height:40px;padding:0 6px 0 10px;border-radius:999px;border:1.5px solid var(--acc-line,#fed7aa);background:var(--acc-soft,#fff7ed);color:var(--acc-d,#c2410c);font:700 15px/1 var(--head,inherit);white-space:nowrap;cursor:pointer;min-width:0;max-width:44vw}
.nv-area svg{width:17px;height:17px;flex:0 0 auto}
.nv-area .nv-dn{width:18px;height:18px;margin-left:-1px}
.nv-area span{overflow:hidden;text-overflow:ellipsis;min-width:0}
.nv-ib{width:44px;height:44px;border-radius:50%;border:0;background:transparent;display:inline-flex;align-items:center;justify-content:center;color:var(--ink,#111);cursor:pointer;flex:0 0 auto;padding:0}
.nv-ib svg{width:24px;height:24px}
.nv-bdg{min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--acc,#e8590c);color:#fff;font:800 11.5px/19px var(--font,inherit);text-align:center;box-sizing:border-box}
.nv-bdg[hidden]{display:none!important}

/* desktop menu */
.nv-top{display:flex;align-items:center;gap:2px}
.nv-tl{position:relative;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 13px;border:0;border-radius:10px;background:transparent;color:var(--ink2,#374151);text-decoration:none;font:600 15px/1 var(--font,inherit);cursor:pointer;white-space:nowrap}
.nv-tl:hover{background:var(--bg,#f5f5f4);color:var(--ink,#111)}
.nv-tl.on{color:var(--acc-d,#c2410c);background:var(--acc-soft,#fff7ed)}
.nv-tl svg{width:19px;height:19px}
.nv-tl .nv-dn{width:16px;height:16px;margin-left:-3px}
.nv-tl[data-tab="cart"]{background:var(--acc,#e8590c);color:#fff;margin-left:4px;padding:0 14px}
.nv-tl[data-tab="cart"]:hover{background:var(--acc-d,#c2410c);color:#fff}
.nv-tl[data-tab="cart"].on{box-shadow:0 0 0 3px var(--acc-line,#fed7aa)}
.nv-tl[data-tab="cart"] .nv-bdg{background:#fff;color:var(--acc-d,#c2410c)}
.nv-search{display:none}
.bnav{display:none}

/* panels (More, area list, favorite store): dropdowns on wide screens */
.nv-scrim{position:fixed;inset:0;z-index:54;background:rgba(17,24,39,0);transition:background .18s}
.nv-scrim.in{background:rgba(17,24,39,.42)}
.nv-pan{position:fixed;z-index:56;background:#fff;box-shadow:0 18px 50px rgba(11,18,32,.24);display:flex;flex-direction:column;opacity:0;transition:opacity .16s,transform .18s}
.nv-pan.in{opacity:1;transform:none}
.nv-pan[hidden]{display:none}
.nv-grab{display:none;width:40px;height:4px;border-radius:2px;background:#d1d5db;margin:8px auto 2px;flex:0 0 auto}
.nv-ph{display:flex;align-items:center;gap:4px;padding:6px 8px 4px 16px;flex:0 0 auto}
.nv-ph h2{margin:0;flex:1;font:700 19px/1.2 var(--head,inherit);color:var(--ink,#111)}
.nv-ph .nv-x svg{width:22px;height:22px}
.nv-bk{margin-left:-10px}.nv-bk svg{transform:rotate(180deg)}
.nv-body{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:2px 12px 12px}
.nv-acct{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:14px;background:var(--acc-soft,#fff7ed);border:1px solid var(--acc-line,#fed7aa);margin:2px 0 6px;color:var(--ink,#111);text-decoration:none}
.nv-av{width:42px;height:42px;border-radius:50%;background:var(--acc,#e8590c);color:#fff;display:flex;align-items:center;justify-content:center;font:800 18px/1 var(--head,inherit);flex:0 0 auto}
.nv-av svg{width:24px;height:24px}
.nv-rt{min-width:0;flex:1}
.nv-rt b{display:block;font-weight:700;font-size:15.5px;line-height:1.25}
.nv-rt small{display:block;color:var(--mut,#6b7280);font-size:13px;line-height:1.3}
.nv-acct .nv-rt b{font:700 16px/1.25 var(--head,inherit)}
.nv-acct .nv-rt small{color:var(--ink2,#374151)}
.nv-chev{width:18px;height:18px;color:var(--mut,#9ca3af);flex:0 0 auto}
.nv-row{display:flex;align-items:center;gap:13px;min-height:56px;padding:6px 6px;border-bottom:1px solid var(--line2,#f1f1f0);text-decoration:none;color:var(--ink,#111)}
.nv-row:hover,.nv-acct:hover{filter:brightness(.98)}
.nv-em{width:40px;height:40px;border-radius:12px;background:var(--bg,#f5f5f4);display:flex;align-items:center;justify-content:center;font-size:21px;flex:0 0 auto}
.nv-pill{font-size:11px;font-weight:700;background:#f3f4f6;color:var(--mut,#6b7280);padding:2px 7px;border-radius:999px;margin-left:6px;vertical-align:2px;white-space:nowrap}
.nv-foot{text-align:center;color:var(--mut,#6b7280);font-size:13.5px;margin:10px 0 2px}
.nv-foot a{color:var(--mut,#6b7280);text-decoration:none;padding:8px 6px;display:inline-block}
.nv-hint{color:var(--mut,#6b7280);font-size:13.5px;margin:2px 4px 10px}
.nv-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.nv-opt{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:46px;padding:8px 12px;border-radius:12px;border:1.5px solid var(--line,#e7e5e4);background:#fff;color:var(--ink,#111);font:600 14.5px/1.2 var(--font,inherit);text-align:left;text-decoration:none;cursor:pointer}
.nv-opt.on{border-color:var(--acc,#e8590c);background:var(--acc-soft,#fff7ed);color:var(--acc-d,#c2410c);font-weight:700}
.nv-opt span{flex:0 0 auto}
.nv-none{width:100%;margin-top:10px;justify-content:center;color:var(--mut,#6b7280)}

/* "‹ Menu": back to the More menu from anything opened there (owner, Nov 1, 2026) */
.nv-backrow{padding:10px 0 2px}
.ls>.nv-backrow{padding:10px 14px 0;flex:0 0 auto}
.nv-tomenu{display:inline-flex;align-items:center;gap:2px;min-height:40px;padding:0 14px 0 8px;border-radius:999px;border:1.5px solid var(--acc-line,#fed7aa);background:var(--acc-soft,#fff7ed);color:var(--acc-d,#c2410c);font:700 15px/1 var(--head,inherit);cursor:pointer}
.nv-tomenu svg{width:20px;height:20px;flex:0 0 auto}
.nv-tomenu:active{background:var(--acc-line,#fed7aa)}
.nv-ph .nv-tomenu-in{margin:0 6px 0 -6px;min-height:36px;padding:0 12px 0 6px;font-size:14px}

@media (min-width:820px){
  .nv-pan{top:66px;right:max(16px,calc((100vw - 1180px) / 2 + 16px));width:380px;max-height:calc(100vh - 86px);border-radius:16px;transform:translateY(-6px)}
  .nv-areas{width:440px}
  .nv-scrim.in{background:rgba(17,24,39,.12)}
}
@media (min-width:820px) and (max-width:1023px){.has-nv .bt-x{display:none}.nv-tl{padding:0 10px}}

/* phones and the Play app: slim top bar + bottom tab bar */
@media (max-width:819px){
  .has-nv .hdr-in{height:56px;padding:0 6px 0 14px;gap:6px}
  .has-nv .bt-x{display:none}
  .has-nv .brand-t{font-size:17px}
  .has-nv body:not(.is-home) .top{top:56px}
  .nv-top{display:none}
  .nv-search{display:inline-flex}
  .bnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;height:calc(64px + env(safe-area-inset-bottom));padding:0 2px env(safe-area-inset-bottom);background:#fff;border-top:1px solid var(--line,#e7e5e4);box-shadow:0 -4px 14px -8px rgba(17,24,39,.15);justify-content:space-around;align-items:stretch;box-sizing:border-box}
  .nv-open .bnav{z-index:57}
  .bn-t{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:0;background:transparent;padding:0;color:var(--ink2,#4b5563);font:600 12.5px/1.1 var(--font,inherit);text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .bn-t b{font-weight:600}
  .bn-ic{position:relative;width:60px;height:32px;border-radius:16px;display:flex;align-items:center;justify-content:center;transition:background .15s}
  .bn-ic svg{width:24px;height:24px}
  .bn-t.on{color:var(--acc-d,#c2410c)}
  .bn-t.on b{font-weight:800}
  .bn-t.on .bn-ic{background:var(--acc-soft,#ffedd5);color:var(--acc,#e8590c)}
  .bn-t.on[data-tab="home"] .bn-ic path{fill:currentColor}
  .bn-ic .nv-bdg{position:absolute;top:-4px;left:33px;border:2px solid #fff;min-width:21px;height:21px;line-height:17px}
  /* leave room for the bar at the bottom of every page */
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  /* the cart bar becomes a slim line just above the tab bar: "3 items in cart · Cheapest: Landau's $9.07" */
  .cartbar{bottom:calc(64px + env(safe-area-inset-bottom));padding:0 8px 6px;animation:none}
  .cartbar-in{min-height:44px;padding:4px 6px 4px 12px;gap:8px;border-radius:12px;background:#fff;color:var(--ink,#111);border:1.5px solid var(--acc-line,#fed7aa);box-shadow:0 6px 18px -6px rgba(17,24,39,.28)}
  .cb-count{display:none}
  .cb-text{flex-direction:row;align-items:baseline;gap:6px;white-space:nowrap;overflow:hidden}
  .cb-text b{font-size:13.5px;font-weight:700;flex:0 0 auto}
  .cb-text b::after{content:" ·";color:var(--mut,#9ca3af);font-weight:600}
  .cb-text span{font-size:13.5px;font-weight:700;color:var(--acc-d,#c2410c);min-width:0}
  .cb-go{display:none}
  .cartbar-in::after{content:"\203A";flex:0 0 auto;font-size:24px;line-height:1;color:var(--acc,#e8590c);font-weight:700;padding:0 6px 3px 0}
  .cartbar.go .cartbar-in::after{display:none}
  .cartbar.go .cartbar-in{background:var(--acc,#e8590c);color:#fff;border-color:var(--acc,#e8590c);justify-content:center}
  .cartbar.go .cb-text{align-items:baseline;justify-content:center}
  .cartbar.go .cb-text b::after{color:rgba(255,255,255,.7)}
  .cartbar.go .cb-text span{color:#fff;font-weight:600}
  .has-bar .foot,.has-bar .foot-in{padding-bottom:70px}
  .toast{bottom:calc(126px + env(safe-area-inset-bottom))}
  body:not(.has-bar) .toast{bottom:calc(80px + env(safe-area-inset-bottom))}
  .ac-tray{bottom:calc(72px + env(safe-area-inset-bottom))}
  .on-areas .cartbar{display:none!important}
  /* panels are bottom sheets sitting on the tab bar */
  .nv-pan{left:0;right:0;bottom:calc(64px + env(safe-area-inset-bottom));max-height:calc(100% - 64px - env(safe-area-inset-bottom) - 40px);border-radius:22px 22px 0 0;transform:translateY(24px);box-shadow:0 -10px 40px rgba(11,18,32,.22)}
  .nv-grab{display:block}
}
@media (max-width:374px){.has-nv .brand-t{font-size:15px}.nv-area{font-size:14px;padding:0 4px 0 8px}.bn-ic{width:52px}}
/* Wide screens (820 px and up), owner Nov 1, 2026: "Navigation on the desktop view needs to be fixed" / "deals and
   compare should be under the navigation and contact on the main page". .nv-dA = one bar, .nv-dB = two rows;
   .nv-dC = one row with every page + Contact apart, .nv-dC2 = one ☰ Menu button + Contact apart ("all under the menu except for the contact").
   Phones never see any of this (.nv-dk hidden under 820 px). */
.nv-dk,.nv-hcontact{display:none}
@media (min-width:820px){
  .has-nv .nv-top{display:none}
  .has-nv .hdr-in{justify-content:flex-start;gap:14px}
  .has-nv .nv-r{flex:1;gap:10px;margin-left:0}
  .has-nv .nv-area{flex:0 0 auto;max-width:240px}
  .nv-dk{display:flex;align-items:center}
  .nv-dk .nv-tl{color:var(--ink2,#374151);background:transparent;border-radius:10px}
  .nv-dk .nv-tl:hover{background:var(--bg,#f5f5f4);color:var(--ink,#111)}
  .nv-dk .nv-tl.on{color:var(--acc-d,#c2410c);background:transparent}
  .nv-dk .nv-tl.on::after{content:"";position:absolute;left:12px;right:12px;height:3px;border-radius:3px;background:var(--acc,#e8590c)}
  .nv-dk .nv-tl svg{width:18px;height:18px}
  .nv-dem{font-size:16px;line-height:1}
  .nv-dright{gap:8px;margin-left:auto}
  .nv-dacct{display:inline-flex;align-items:center;gap:7px;height:44px;padding:0 12px;border-radius:10px;color:var(--ink2,#374151);text-decoration:none;font:600 15px/1 var(--font,inherit);white-space:nowrap}
  .nv-dacct:hover{background:var(--bg,#f5f5f4);color:var(--ink,#111)}
  .nv-dacct svg{width:20px;height:20px;color:var(--mut,#6b7280)}
  .nv-dk .nv-dcart,.nv-dk .nv-dcart.on{background:var(--acc,#e8590c);color:#fff;padding:0 16px;gap:8px}
  .nv-dk .nv-dcart:hover{background:var(--acc-d,#c2410c);color:#fff}
  .nv-dk .nv-dcart.on::after{display:none}
  .nv-dk .nv-dcart.on{box-shadow:0 0 0 3px var(--acc-line,#fed7aa)}
  .nv-dk .nv-dcart .nv-bdg{background:#fff;color:var(--acc-d,#c2410c)}
  .nv-dk .nv-dmore[aria-expanded="true"]{background:var(--bg,#f5f5f4);color:var(--ink,#111)}

  /* A: one bar */
  .nv-dA .nv-dlinks{flex:1;justify-content:center;gap:4px}
  .nv-dA .nv-dlinks .nv-tl{height:44px;padding:0 14px;font-size:15.5px}
  .nv-dA .nv-dlinks .nv-tl.on::after{bottom:-9px}

  /* B: top bar + a row of links under it */
  .nv-hs{flex:1;max-width:560px;margin:0 auto;height:44px;padding:0 14px;gap:9px;border:1.5px solid var(--line,#e5e7eb);border-radius:12px;background:var(--bg,#f8f8f7);visibility:hidden}
  .nv-hs-on .nv-hs{visibility:visible}
  .nv-hs:focus-within{border-color:var(--acc,#e8590c);background:#fff;box-shadow:0 0 0 3px var(--acc-soft,#fff7ed)}
  .nv-hs svg{width:19px;height:19px;color:var(--mut,#6b7280);flex:0 0 auto}
  .nv-hs input{flex:1;min-width:0;border:0;background:transparent;font:500 15px/1 var(--font,inherit);color:var(--ink,#111);outline:0;height:40px}
  .nv-sub{border-top:1px solid var(--line,#e5e7eb);background:#fff}
  .nv-sub-in{max-width:1180px;margin:0 auto;padding:0 10px;height:48px;display:flex;align-items:center;gap:2px;width:100%;box-sizing:border-box}
  .nv-sub .nv-tl{height:40px;padding:0 12px;font-size:14.5px;gap:7px}
  .nv-sub .nv-tl.on::after{bottom:-4px}
  .nv-sub .nv-tl[data-tab="deals"],.nv-sub .nv-tl[data-tab="compare"]{font-weight:700;color:var(--ink,#111)}
  .nv-sub .nv-tl[data-tab="deals"].on,.nv-sub .nv-tl[data-tab="compare"].on{color:var(--acc-d,#c2410c)}
  .nv-sep{width:1px;height:22px;background:var(--line,#e5e7eb);margin:0 8px}
  .nv-gap{flex:1}
  .nv-dB .nv-pan{top:118px;max-height:calc(100vh - 138px)}

  /* C and C2 (owner, Nov 1, 2026: "all under the menu except for the contact"): Contact is its own button, apart */
  .nv-dk .nv-dcontact{height:44px;padding:0 15px;gap:7px;border:1.5px solid var(--acc-line,#fed7aa);background:var(--acc-soft,#fff7ed);color:var(--acc-d,#c2410c);font-weight:700}
  .nv-dk .nv-dcontact:hover,.nv-dk .nv-dcontact.on{background:#ffedd5;color:var(--acc-d,#c2410c);border-color:var(--acc,#e8590c)}
  .nv-dk .nv-dcontact.on::after{display:none}
  .nv-dsep{width:1px;height:26px;background:var(--line,#e5e7eb);margin:0 4px}
  .nv-dC .nv-more [data-nv-go="contact"],.nv-dC2 .nv-more [data-nv-go="contact"]{display:none}
  .nv-dC .nv-sub .nv-tl{padding:0 11px}
  .nv-dC .nv-pan{top:118px;max-height:calc(100vh - 138px)}
  /* C2: no second row; one ☰ Menu button holds everything (Home, Deals, Compare first) */
  .nv-dk .nv-dmenu{height:44px;padding:0 12px 0 14px;gap:8px;border:1.5px solid var(--line,#e5e7eb);background:#fff;color:var(--ink,#111);font-weight:700}
  .nv-dk .nv-dmenu svg{width:20px;height:20px}
  .nv-dk .nv-dmenu .nv-dn{width:16px;height:16px}
  .nv-dk .nv-dmenu.on,.nv-dk .nv-dmenu[aria-expanded="true"]{border-color:var(--acc,#e8590c);color:var(--acc-d,#c2410c);background:var(--acc-soft,#fff7ed)}
  .nv-dk .nv-dmenu.on::after{display:none}
  .nv-dmain{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 10px;padding-bottom:12px;border-bottom:1px solid var(--line,#e5e7eb)}
  .nv-dmain .nv-dmrow{flex-direction:column;justify-content:center;gap:6px;padding:12px 6px;border-radius:12px;background:var(--acc-soft,#fff7ed);text-align:center}
  .nv-dmain .nv-dmrow:hover{background:#ffedd5}
  .nv-dmain .nv-em{margin:0;color:var(--acc-d,#c2410c)}
  .nv-dmain .nv-em svg{width:24px;height:24px}
  .nv-dmain .nv-rt b{font-size:15px}

  /* Contact on the main page */
  body.is-home .nv-hcontact{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1148px;margin:28px auto 8px;padding:20px 24px;border:1px solid var(--acc-line,#fed7aa);border-radius:16px;background:var(--acc-soft,#fff7ed);box-sizing:border-box}
  .nv-hc-t{display:flex;align-items:center;gap:14px;min-width:0}
  .nv-hc-ic{font-size:30px;line-height:1}
  .nv-hcontact h2{margin:0 0 3px;font:700 18px/1.3 var(--head,inherit);color:var(--ink,#111)}
  .nv-hcontact p{margin:0;color:var(--ink2,#374151);font-size:14.5px}
  .nv-hc-b{display:flex;gap:10px;flex:0 0 auto}
  .nv-hc-b .btn{min-height:46px}
  .nv-hc-wa{display:inline-flex;align-items:center;min-height:46px;padding:0 18px;border-radius:12px;background:#25d366;color:#fff;font-weight:700;text-decoration:none}
  .nv-hc-wa:hover{background:#1ebe5b;color:#fff}
}
@media (min-width:1100px){  /* C: what the row already shows is not repeated in More (under 1100 px More keeps them) */
  .nv-dC .nv-more .nv-body>[data-nv-go="list"],.nv-dC .nv-more .nv-body>[data-nv-go="overpaid"],.nv-dC .nv-more .nv-body>[data-nv-go="fav"],
  .nv-dC .nv-more .nv-body>[data-nv-go="alerts"],.nv-dC .nv-more .nv-body>[data-nv-go="lists"],.nv-dC .nv-more .nv-body>[data-nv-go="receipt"]{display:none}
}
@media (min-width:820px) and (max-width:1099px){
  .nv-dC .nv-sub .nv-tl[data-tab="fav"],.nv-dC .nv-sub .nv-tl[data-tab="lists"],.nv-dC .nv-sub .nv-tl[data-tab="alerts"]{display:none}
  .nv-dC .nv-sub .nv-tl{padding:0 9px}
  .nv-dC2 .nv-hs{min-width:0;flex-basis:0}
  .nv-dk .nv-dmenu{padding:0 12px}.nv-dk .nv-dmenu .nv-dn{display:none}
  .nv-dem,.nv-sub .nv-tl svg{display:none}
  .nv-dA .nv-dlinks .nv-tl{padding:0 10px}
  .nv-sub .nv-tl{padding:0 9px}
  .nv-sub .nv-tl[data-tab="receipt"]{display:none}
  .nv-dacct span{display:none}
}
@media (prefers-reduced-motion:reduce){.nv-pan,.nv-scrim{transition:none}}