/* Family Food V21 — mobile search/notifications + complete, crisp QR codes. */
:root{--ff-v21-accent:#f36b20;--ff-v21-ink:var(--ff-ink,#211c18)}
.topbar{height:auto!important;min-height:0!important}
.topbar .ff-mobile-search{display:none!important}
.topbar .ff-notification-trigger{position:relative!important}
.topbar .ff-unread-count:not([hidden]){display:flex!important;position:absolute!important;right:-4px!important;top:-5px!important;
 background:#e74528!important;color:white!important;border:2px solid var(--ff-paper,#fff)!important;
 border-radius:20px!important;min-width:19px!important;min-height:19px!important;padding:0 4px!important;
 align-items:center!important;justify-content:center!important;font-size:10px!important;line-height:1!important;font-weight:800!important}
.topbar .ff-unread-count[hidden]{display:none!important}
.ff-qr-visual{position:relative!important;display:grid!important;place-items:center!important;isolation:isolate!important;
  width:min(100%,var(--ff-qr-target-size,180px))!important;max-width:100%!important;height:auto!important;
  aspect-ratio:1/1!important;box-sizing:border-box!important;padding:0!important;overflow:visible!important;
  background:#fff!important;border-radius:14px!important}
.ff-qr-visual .ff-qr-code,.ff-product-qr-card #qr.ff-qr-visual .ff-qr-code{
  display:grid!important;place-items:center!important;position:static!important;inset:auto!important;
  width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
  padding:0!important;margin:0!important;border:0!important;box-sizing:border-box!important;
  overflow:visible!important;background:#fff!important;border-radius:8px!important}
.ff-qr-visual .ff-qr-code svg,.ff-product-qr-card #qr.ff-qr-visual .ff-qr-code svg{
  display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;
  aspect-ratio:1/1!important;overflow:visible!important;flex:none!important}
.ff-qr-visual .ff-qr-logo{display:none!important}
.ff-qr-error{font-size:12px!important;text-align:center!important;line-height:1.35!important;color:#55301e!important;padding:10px!important}
.ff-product-qr-card{grid-template-columns:minmax(0,1fr) minmax(126px,176px)!important;align-items:center!important;
  gap:clamp(12px,3vw,24px)!important;overflow:visible!important}
.ff-product-qr-card #qr.ff-product-qr-mark{width:100%!important;max-width:176px!important;min-width:0!important;
  height:auto!important;aspect-ratio:1/1!important;padding:7px!important;border-radius:14px!important;overflow:visible!important}
.card-qr-box.ff-qr-visual{width:min(100%,var(--ff-qr-target-size,160px))!important;height:auto!important;aspect-ratio:1/1!important;padding:6px!important}
@media(max-width:760px){
 :root{--ff-v20-header:113px}
 html{scroll-padding-top:123px!important}
 .topbar .topbar-inner{display:flex!important;flex-wrap:nowrap!important;min-height:60px!important;height:60px!important;
   padding:6px 12px 4px!important;gap:8px!important;box-sizing:border-box!important}
 .topbar .header-left{display:flex!important;flex:0 1 auto!important;min-width:0!important;gap:9px!important}
 .topbar .brand img{max-width:105px!important;width:105px!important;height:45px!important;object-fit:contain!important}
 .topbar .nav-actions{display:flex!important;gap:8px!important;flex:0 0 auto!important;width:auto!important;
   max-width:calc(100% - 160px)!important;min-width:0!important;margin-left:auto!important;justify-content:flex-end!important}
 .topbar .nav-actions>.header-action,.topbar .nav-actions>.profile-link{display:none!important}
 .topbar .nav-actions .ff-action-alerts{display:inline-flex!important;flex:0 0 40px!important;width:40px!important;min-width:40px!important;
   height:40px!important;min-height:40px!important;background:var(--ff-paper,#fff)!important}
 .topbar .nav-actions .ff-action-cart{display:inline-flex!important;flex:0 0 40px!important;width:40px!important;min-width:40px!important;
   height:40px!important;min-height:40px!important}
 .topbar .nav-actions .ff-action-login,.topbar .nav-actions .ff-action-profile{display:none!important}
 .topbar .ff-mobile-search{display:flex!important;align-items:center!important;gap:8px!important;
   margin:0!important;padding:0 12px 10px!important;width:100%!important;max-width:100%!important;
   min-width:0!important;box-sizing:border-box!important;background:var(--ff-paper,#fff)!important}
 .topbar .ff-mobile-search-wrap{display:flex!important;flex:1 1 auto!important;min-width:0!important;
   align-items:center!important;gap:10px!important;padding:0 13px!important;height:42px!important;
   background:var(--ff-search-bg,#f7f3f0)!important;border:1px solid var(--ff-border,#ebdcd0)!important;
   border-radius:14px!important;color:var(--ff-muted,#8c7666)!important}
 .topbar .ff-mobile-search-wrap input{flex:1 1 auto!important;min-width:0!important;width:100%!important;height:38px!important;
   padding:0!important;border:0!important;outline:0!important;box-shadow:none!important;
   background:transparent!important;color:var(--ff-v21-ink)!important;font:inherit!important;font-size:14px!important}
 .topbar .ff-mobile-search-wrap:focus-within{border-color:var(--ff-v21-accent)!important;box-shadow:0 0 0 3px rgba(243,107,32,.13)!important}
 .topbar .ff-mobile-search>button{flex:0 0 42px!important;display:grid!important;place-items:center!important;
   width:42px!important;min-width:42px!important;height:42px!important;padding:0!important;
   background:var(--ff-v21-accent)!important;border:0!important;border-radius:13px!important;color:#fff!important;cursor:pointer!important}
 .ff-product-qr-card{grid-template-columns:minmax(0,1fr) minmax(120px,156px)!important;gap:12px!important}
 .ff-product-qr-card #qr.ff-product-qr-mark{max-width:156px!important}
}
@media(max-width:370px){
 .topbar .topbar-inner{padding-inline:8px!important;gap:5px!important}
 .topbar .header-left{gap:5px!important}
 .topbar .ff-global-menu{flex:0 0 38px!important;width:38px!important;min-width:38px!important;height:38px!important;min-height:38px!important}
 .topbar .brand img{max-width:86px!important;width:86px!important;height:42px!important}
 .topbar .nav-actions{gap:5px!important;max-width:calc(100% - 137px)!important}
 .topbar .nav-actions .ff-action-cart,.topbar .nav-actions .ff-action-alerts{flex-basis:36px!important;min-width:36px!important;width:36px!important;height:36px!important;min-height:36px!important}
 .topbar .ff-mobile-search{padding-inline:8px!important}
 .ff-product-qr-card{grid-template-columns:minmax(0,1fr) minmax(110px,128px)!important;gap:9px!important;padding:11px!important}
 .ff-product-qr-card #qr.ff-product-qr-mark{max-width:128px!important;padding:4px!important}
}
:root[data-theme='dark'] .topbar .ff-mobile-search,:root[data-theme='dark'] .topbar .ff-mobile-search-wrap{background:#090909!important}
:root[data-theme='dark'] .topbar .ff-mobile-search-wrap{border-color:#323232!important}
:root[data-theme='dark'] .topbar .ff-mobile-search-wrap input{color:#fff!important}
@media print{.ff-qr-visual,.ff-qr-visual .ff-qr-code,.ff-qr-visual svg{break-inside:avoid!important;print-color-adjust:exact!important;-webkit-print-color-adjust:exact!important}}
