/* ========================================================================
   ZUVA App Home 10.13 — mobile-first dashboard UI
   Scope: only the dedicated ZUVA App Home page / editor representation.
   Bottom navigation is intentionally untouched.
   ======================================================================== */

body.zuva-app-home-page,
.editor-styles-wrapper .zuva-app-dashboard-home {
  --zuva-app-gutter: 14px;
  --zuva-app-surface: #fffdf8;
  --zuva-app-soft: #f2eee6;
  --zuva-app-line: rgba(55,73,30,.16);
  --zuva-app-shadow: 0 10px 30px rgba(33,26,22,.07);
}

body.zuva-app-home-page main.zuva-app-page-shell,
body.zuva-app-home-page .zuva-app-page-shell,
body.zuva-app-home-page .entry-content,
body.zuva-app-home-page .wp-block-post-content {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.zuva-app-home-page .zuva-app-dashboard-home,
.editor-styles-wrapper .zuva-app-dashboard-home {
  width: 100%;
  max-width: 760px;
  margin-inline: auto;
  padding: 14px 0 116px;
  overflow-x: clip;
  background: var(--zuva-cream-soft, #fbf7ef);
}

body.zuva-app-home-page .zuva-app-dashboard-home > .alignwide,
.editor-styles-wrapper .zuva-app-dashboard-home > .alignwide {
  width: auto !important;
  max-width: none !important;
  margin-left: var(--zuva-app-gutter) !important;
  margin-right: var(--zuva-app-gutter) !important;
}

/* Location / branch selector */
body.zuva-app-home-page .zuva-app-address-panel,
.editor-styles-wrapper .zuva-app-address-panel {
  min-height: 82px;
  padding: 14px 14px 14px 16px;
  gap: 12px;
  border: 1px solid var(--zuva-app-line);
  border-radius: 18px;
  background: var(--zuva-app-surface);
  box-shadow: var(--zuva-app-shadow);
}
body.zuva-app-home-page .zuva-app-address-copy,
.editor-styles-wrapper .zuva-app-address-copy {
  min-width: 0;
  margin: 0 !important;
}
body.zuva-app-home-page .zuva-app-address-kicker,
.editor-styles-wrapper .zuva-app-address-kicker {
  margin: 0 0 3px !important;
  color: var(--zuva-olive, #5e713c);
  font-family: var(--zuva-accent, Inter, sans-serif);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .16em;
}
body.zuva-app-home-page .zuva-app-address-text,
.editor-styles-wrapper .zuva-app-address-text {
  margin: 0 !important;
  color: var(--zuva-charcoal, #1a1512);
  font-size: .98rem;
  font-weight: 600;
  line-height: 1.25;
}
body.zuva-app-home-page .zuva-app-address-help,
.editor-styles-wrapper .zuva-app-address-help {
  margin: 3px 0 0 !important;
  color: #7a736b;
  font-size: .72rem;
  line-height: 1.35;
}
body.zuva-app-home-page .zuva-app-address-action,
.editor-styles-wrapper .zuva-app-address-action {
  flex: 0 0 auto;
  margin: 0 !important;
}
body.zuva-app-home-page .zuva-app-address-action .wp-block-button__link,
.editor-styles-wrapper .zuva-app-address-action .wp-block-button__link {
  min-height: 42px;
  padding: 0 13px;
  border: 1px solid var(--zuva-olive, #5e713c) !important;
  border-radius: 13px !important;
  color: var(--zuva-olive-deep, #37491e) !important;
  background: transparent !important;
  font-family: var(--zuva-body, Inter, sans-serif) !important;
  font-size: .68rem !important;
  font-weight: 600;
  letter-spacing: .02em !important;
  text-transform: none !important;
  white-space: nowrap;
}

/* Fulfilment strip: intentionally horizontal, like a native restaurant app. */
body.zuva-app-home-page .zuva-app-mode-strip,
.editor-styles-wrapper .zuva-app-mode-strip {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 10px !important;
  margin-top: 12px !important;
  padding: 0 0 4px !important;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
body.zuva-app-home-page .zuva-app-mode-strip::-webkit-scrollbar { display: none; }
body.zuva-app-home-page .zuva-app-mode-card,
.editor-styles-wrapper .zuva-app-mode-card {
  flex: 0 0 112px;
  scroll-snap-align: start;
}
body.zuva-app-home-page .zuva-app-mode-card .wp-block-button__link,
.editor-styles-wrapper .zuva-app-mode-card .wp-block-button__link {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 112px;
  height: 100px;
  padding: 58px 10px 13px;
  border: 1px solid rgba(55,73,30,.18) !important;
  border-radius: 18px !important;
  color: #403a34 !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(33,26,22,.055);
  font-family: var(--zuva-body, Inter, sans-serif) !important;
  font-size: .78rem !important;
  font-weight: 600;
  letter-spacing: 0 !important;
  line-height: 1.1 !important;
  text-transform: none !important;
}
body.zuva-app-home-page .zuva-app-mode-card .wp-block-button__link::before,
.editor-styles-wrapper .zuva-app-mode-card .wp-block-button__link::before {
  position: absolute;
  top: 12px;
  left: 50%;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 12px;
  color: var(--zuva-terracotta, #a54a28);
  background: #f7eee7;
  font-size: 1.35rem;
  transform: translateX(-50%);
}
body.zuva-app-home-page .zuva-app-mode-card.mode-delivery .wp-block-button__link::before,
.editor-styles-wrapper .zuva-app-mode-card.mode-delivery .wp-block-button__link::before { content: "◇"; }
body.zuva-app-home-page .zuva-app-mode-card.mode-pickup .wp-block-button__link::before,
.editor-styles-wrapper .zuva-app-mode-card.mode-pickup .wp-block-button__link::before { content: "⌂"; }
body.zuva-app-home-page .zuva-app-mode-card.mode-drive .wp-block-button__link::before,
.editor-styles-wrapper .zuva-app-mode-card.mode-drive .wp-block-button__link::before { content: "→"; }

/* Compact app sections */
body.zuva-app-home-page .zuva-app-home-section,
.editor-styles-wrapper .zuva-app-home-section {
  margin-top: 26px !important;
  padding: 0 !important;
}
body.zuva-app-home-page .zuva-app-section-heading,
.editor-styles-wrapper .zuva-app-section-heading {
  margin: 0 0 10px !important;
  gap: 12px;
}
body.zuva-app-home-page .zuva-app-section-heading h2,
.editor-styles-wrapper .zuva-app-section-heading h2 {
  position: relative;
  margin: 0 !important;
  padding-bottom: 8px;
  font-family: var(--zuva-body, Inter, sans-serif) !important;
  font-size: 1.28rem !important;
  font-weight: 700 !important;
  letter-spacing: -.02em !important;
  line-height: 1.08 !important;
}
body.zuva-app-home-page .zuva-app-section-heading h2::after,
.editor-styles-wrapper .zuva-app-section-heading h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 42px;
  height: 2px;
  border-radius: 999px;
  background: var(--zuva-terracotta, #a54a28);
}
body.zuva-app-home-page .zuva-app-section-heading p,
.editor-styles-wrapper .zuva-app-section-heading p { margin: 0 !important; }
body.zuva-app-home-page .zuva-app-section-heading a,
.editor-styles-wrapper .zuva-app-section-heading a {
  color: #4b453f;
  font-size: .74rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

/* Featured products become a swipeable offer rail only on the app home. */
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-grid,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-grid {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 1px 6px !important;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-grid::-webkit-scrollbar { display: none; }
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-card,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-card {
  flex: 0 0 min(82vw, 330px) !important;
  min-width: 0 !important;
  max-width: 330px !important;
  scroll-snap-align: start;
  overflow: hidden;
  border: 1px solid rgba(33,26,22,.08) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 10px 28px rgba(33,26,22,.07) !important;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-image,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-image {
  display: block !important;
  aspect-ratio: 16/10 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #eee5d7 !important;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-image img,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-tag,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-tag {
  top: 10px !important;
  left: 10px !important;
  padding: 7px 10px !important;
  border-radius: 999px !important;
  background: rgba(255,253,248,.94) !important;
  font-size: .55rem !important;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-copy,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-copy {
  min-height: 0 !important;
  padding: 13px 14px 14px !important;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-head,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-head {
  display: block !important;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-head h3,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-head h3 {
  margin: 0 !important;
  font-size: 1.42rem !important;
  line-height: 1 !important;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-head p,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-head p {
  display: -webkit-box !important;
  margin: 6px 0 0 !important;
  overflow: hidden !important;
  color: #746d65 !important;
  font-size: .76rem !important;
  line-height: 1.4 !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-price,
.editor-styles-wrapper .zuva-app-offers-section .zuva-universal-product-price { margin-top: 9px !important; }
body.zuva-app-home-page .zuva-app-offers-section .zuva-add-order,
.editor-styles-wrapper .zuva-app-offers-section .zuva-add-order {
  margin-top: 10px !important;
}

/* Static promotional banner replaces the old video/full-screen hero. */
body.zuva-app-home-page .zuva-app-promo-banner,
.editor-styles-wrapper .zuva-app-promo-banner {
  width: auto !important;
  max-width: none !important;
  min-height: 180px !important;
  margin: 24px var(--zuva-app-gutter) 0 !important;
  overflow: hidden;
  border-radius: 18px;
  box-shadow: var(--zuva-app-shadow);
}
body.zuva-app-home-page .zuva-app-promo-banner .wp-block-cover__inner-container,
.editor-styles-wrapper .zuva-app-promo-banner .wp-block-cover__inner-container {
  width: 100%;
  padding: 18px;
}
body.zuva-app-home-page .zuva-app-promo-copy,
.editor-styles-wrapper .zuva-app-promo-copy { margin: 0 !important; }
body.zuva-app-home-page .zuva-app-promo-kicker,
.editor-styles-wrapper .zuva-app-promo-kicker {
  margin: 0 0 7px !important;
  color: #fff;
  font-family: var(--zuva-accent, Inter, sans-serif);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .16em;
}
body.zuva-app-home-page .zuva-app-promo-banner h2,
.editor-styles-wrapper .zuva-app-promo-banner h2 {
  max-width: 310px;
  margin: 0 !important;
  color: #fff;
  font-size: clamp(1.8rem, 8.2vw, 2.65rem) !important;
  line-height: .95 !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}
body.zuva-app-home-page .zuva-app-promo-banner .wp-block-buttons,
.editor-styles-wrapper .zuva-app-promo-banner .wp-block-buttons { margin-top: 14px !important; }
body.zuva-app-home-page .zuva-app-promo-banner .wp-block-button__link,
.editor-styles-wrapper .zuva-app-promo-banner .wp-block-button__link {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 10px !important;
  background: #fff !important;
  color: #2e2a26 !important;
  font-family: var(--zuva-body, Inter, sans-serif) !important;
  font-size: .7rem !important;
  font-weight: 700;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Explore-menu rail uses the existing live WooCommerce categories. */
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-showcase,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-showcase { margin: 0 !important; }
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-heading,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-heading { display: none !important; }
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-grid,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-grid {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 1px 6px !important;
  overflow-x: auto;
  align-items: flex-start !important;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-grid::-webkit-scrollbar { display: none; }
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-card,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-card {
  display: block !important;
  flex: 0 0 126px !important;
  width: 126px !important;
  min-width: 126px !important;
  min-height: 0 !important;
  height: auto !important;
  align-self: flex-start !important;
  content-visibility: visible !important;
  contain: none !important;
  contain-intrinsic-size: auto !important;
  scroll-snap-align: start;
  overflow: hidden;
  border: 1px solid rgba(33,26,22,.08) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(33,26,22,.05) !important;
  text-decoration: none !important;
}
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-media,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-media {
  display: block !important;
  width: 100% !important;
  height: 100px !important;
  min-height: 100px !important;
  aspect-ratio: auto !important;
  overflow: hidden;
  background: #eee5d7;
}
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-media > img,
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-banner,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-media > img,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-banner {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-copy,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-copy {
  display: block !important;
  padding: 10px 10px 11px !important;
}
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-copy strong,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-copy strong {
  display: block;
  color: #302b27;
  font-size: .76rem;
  font-weight: 700;
  line-height: 1.15;
}
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-copy small,
body.zuva-app-home-page .zuva-app-explore-section .zuva-menu-category-copy em,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-copy small,
.editor-styles-wrapper .zuva-app-explore-section .zuva-menu-category-copy em { display: none !important; }

body.zuva-app-home-page .zuva-app-quick-actions,
.editor-styles-wrapper .zuva-app-quick-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 10px !important;
}
body.zuva-app-home-page .zuva-app-quick-card,
.editor-styles-wrapper .zuva-app-quick-card {
  min-width: 0;
  padding: 16px 14px;
  border: 1px solid rgba(33,26,22,.08);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(33,26,22,.05);
}
body.zuva-app-home-page .zuva-app-quick-icon,
.editor-styles-wrapper .zuva-app-quick-icon {
  margin: 0 0 7px !important;
  color: var(--zuva-terracotta, #a54a28);
  font-size: 1.35rem;
}
body.zuva-app-home-page .zuva-app-quick-card h3,
.editor-styles-wrapper .zuva-app-quick-card h3 {
  margin: 0 !important;
  font-family: var(--zuva-body, Inter, sans-serif) !important;
  font-size: .9rem !important;
  font-weight: 700 !important;
}
body.zuva-app-home-page .zuva-app-quick-card > p:not(.zuva-app-quick-icon),
.editor-styles-wrapper .zuva-app-quick-card > p:not(.zuva-app-quick-icon) {
  margin: 4px 0 10px !important;
  color: #7a736b;
  font-size: .7rem;
  line-height: 1.35;
}
body.zuva-app-home-page .zuva-app-quick-card .wp-block-button__link,
.editor-styles-wrapper .zuva-app-quick-card .wp-block-button__link {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(55,73,30,.35) !important;
  border-radius: 10px !important;
  color: var(--zuva-olive-deep, #37491e) !important;
  background: transparent !important;
  font-family: var(--zuva-body, Inter, sans-serif) !important;
  font-size: .68rem !important;
  font-weight: 600;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Native app presentation: no desktop footer underneath the fixed app nav. */
html.zuva-pwa-standalone body.zuva-app-home-page footer.wp-block-template-part { display: none !important; }

@media (max-width: 782px) {
  body.zuva-app-home-page .zuva-app-dashboard-home {
    max-width: 100%;
    padding-top: 12px;
    padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px));
  }
}

@media (max-width: 370px) {
  body.zuva-app-home-page,
  .editor-styles-wrapper .zuva-app-dashboard-home { --zuva-app-gutter: 10px; }
  body.zuva-app-home-page .zuva-app-mode-card,
  .editor-styles-wrapper .zuva-app-mode-card,
  body.zuva-app-home-page .zuva-app-mode-card .wp-block-button__link,
  .editor-styles-wrapper .zuva-app-mode-card .wp-block-button__link {
    width: 102px;
    flex-basis: 102px;
  }
  body.zuva-app-home-page .zuva-app-address-help { display: none; }
}

@media (min-width: 783px) {
  body.zuva-app-home-page .zuva-app-dashboard-home {
    padding-top: 26px;
    padding-bottom: 48px;
  }
  body.zuva-app-home-page .zuva-app-mode-strip { overflow: visible; }
  body.zuva-app-home-page .zuva-app-offers-section .zuva-universal-product-card { flex-basis: 290px !important; }
}
