/* Shared mobile app navigation: mirrors the index.php app shell. */
@media (max-width: 767px) {
  body.app-page { padding-bottom: 94px !important; }
  body.app-page .site-header { display: none !important; }

  .ore-app-header {
    position: relative; z-index: 30; display: flex; align-items: center; justify-content: space-between;
    min-height: 68px; padding: calc(10px + env(safe-area-inset-top, 0px)) 18px 10px;
    background: #fff; border-bottom: 1px solid #edf1ef; box-shadow: 0 5px 20px rgba(8, 57, 42, .06);
  }
  .ore-app-header__brand { display: inline-flex; align-items: center; gap: 7px; color: #0b4a36; text-decoration: none; min-width: 0; }
  .ore-app-header__logo { width: 35px; height: 35px; flex: 0 0 35px; overflow: hidden; border-radius: 50%; display: grid; place-items: center; }
  .ore-app-header__logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
  .ore-app-header__wordmark { font-size: 22px; line-height: 1; font-weight: 800; letter-spacing: -.9px; white-space: nowrap; }
  .ore-app-header__wordmark b { color: #FF7000; font-weight: 800; }
  .ore-app-header__actions { display: flex; align-items: center; gap: 8px; }
  .ore-app-header__cart { position: relative; display: grid; place-items: center; width: 39px; height: 39px; border-radius: 13px; color: #0b4a36; background: #eff7f4; }
  .ore-app-header__cart svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .ore-app-header__cart span, .ore-app-tabbar i { position: absolute; display: grid; place-items: center; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 99px; background: #FF7000; color: #fff; font-size: 10px; line-height: 1; font-style: normal; font-weight: 800; border: 2px solid #fff; }
  .ore-app-header__cart span { top: -3px; right: -3px; }
  .ore-app-header__account, .ore-app-header__signin { padding: 9px 11px; border-radius: 11px; background: #0b4a36; color: #fff; text-decoration: none; font-size: 12px; font-weight: 750; white-space: nowrap; }

  .ore-app-tabbar { position: fixed; z-index: 1000; right: 12px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); left: 12px; height: 70px; display: grid; grid-template-columns: repeat(5, 1fr); align-items: center; padding: 0 5px; border: 1px solid #e9efec; border-radius: 24px; background: rgba(255,255,255,.97); box-shadow: 0 11px 30px rgba(11, 74, 54, .16); backdrop-filter: blur(14px); }
  .ore-app-tabbar a { position: relative; display: flex; min-width: 0; height: 62px; align-items: center; justify-content: center; flex-direction: column; gap: 4px; color: #8a9691; text-decoration: none; font-size: 10px; font-weight: 700; }
  .ore-app-tabbar a svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.15; stroke-linecap: round; stroke-linejoin: round; }
  .ore-app-tabbar a.is-active { color: #0b4a36; }
  .ore-app-tabbar a.is-active::after { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #FF7000; }
  .ore-app-tabbar__search { width: 55px; height: 55px !important; margin: -27px auto 0; border: 4px solid #fff; border-radius: 50%; background: #FF7000; color: #fff !important; box-shadow: 0 8px 19px rgba(255,112,0,.34); }
  .ore-app-tabbar__search svg { width: 25px !important; height: 25px !important; }
  .ore-app-tabbar i { top: 3px; right: calc(50% - 19px); }

  .app-page--marketplace .marketplace-topbar, .app-page--marketplace .marketplace-tabs,
  .app-page--properties .property-app-topbar, .app-page--properties .property-app-tabs,
  .app-page--restaurant .restaurant-hero-nav, .app-page--restaurant .restaurant-app-tabs, .app-page--cart .cart-app-topbar, .app-page--cart .cart-app-tabs,
  .app-page--checkout .checkout-app-topbar, .app-page--checkout .checkout-app-tabs,
  .app-page--receipt .receipt-app-topbar, .app-page--receipt .receipt-app-tabs,
  .app-page--account .account-mobile-app-header, .app-page--account .account-mobile-dock,
  .property-support-topbar, .property-support-tabs, .property-dashboard-topbar, .property-dashboard-tabs,
  .property-route-topbar, .property-route-tabs, .property-detail-app-topbar { display: none !important; }
}
/* Homepage-consistent mobile chrome. These rules intentionally match index.php. */
@media (max-width: 767px) {
  .ore-app-header {
    position: sticky; top: 0; z-index: 30; min-height: 66px;
    padding: max(10px, env(safe-area-inset-top)) 15px 10px;
    background: rgba(255,255,255,.97); border-bottom: 1px solid #e4ece6;
    box-shadow: 0 2px 11px rgba(7,55,34,.055); backdrop-filter: blur(18px);
  }
  .ore-app-header__brand { gap: 4px; }
  .ore-app-header__logo { width: 32px; height: 32px; flex: 0 0 32px; overflow: hidden; border: 0; border-radius: 11px; background: transparent; box-shadow: none; }
  .ore-app-header__logo img { display: block !important; width: 100% !important; height: 100% !important; max-width: none; object-fit: contain; opacity: 1; visibility: visible; transform: scale(1.1); }
  .ore-app-header__wordmark { color: #123d2c; font-size: 18px; letter-spacing: -.055em; }
  .ore-app-header__wordmark b { color: #FF7000 !important; }
  .ore-app-header__actions { gap: 5px; }
  .ore-app-header__cart { width: 36px; height: 36px; border: 1px solid #e0eae3; border-radius: 11px; background: #f7faf8; color: #0b4a36; box-shadow: none; }
  .ore-app-header__cart svg { display: block; width: 17px; height: 17px; fill: currentColor; stroke: none; }
  .ore-app-header__cart span { top: -5px; right: -4px; }
  .ore-app-header__signin, .ore-app-header__join, .ore-app-header__account { min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; border: 0; border-radius: 11px; font-size: 9.5px; font-weight: 800; line-height: 1; text-decoration: none; white-space: nowrap; }
  .ore-app-header__signin { padding: 0 7px; background: transparent; color: #0b4a36; }
  .ore-app-header__join { padding: 0 10px; background: #0b4a36; color: #fff; box-shadow: 0 5px 12px rgba(7,70,48,.15); }
  .ore-app-header__account { padding: 0 9px; border: 1px solid #dce9e1; background: #f1f7f3; color: #0b4a36; }
  .ore-app-header__account svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

  .ore-app-tabbar { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); left: 12px; z-index: 1000; display: flex; height: 68px; align-items: center; justify-content: space-around; padding: 0 5px; border: 1px solid #dbe7df; border-radius: 24px; background: rgba(255,255,255,.96); box-shadow: 0 14px 34px rgba(7,40,24,.2); backdrop-filter: blur(14px); }
  .ore-app-tabbar a { position: relative; display: flex; min-width: 44px; height: auto; align-items: center; justify-content: center; flex-direction: column; gap: 4px; color: #728178; font-size: 9px; font-weight: 600; }
  .ore-app-tabbar a svg { width: 20px; height: 20px; stroke-width: 1.9; }
  .ore-app-tabbar a.is-active { color: #0b4a36; }
  .ore-app-tabbar a.is-active::after { position: absolute; top: -9px; width: 20px; height: 3px; border-radius: 99px; background: #0b4a36; content: ''; }
  .ore-app-tabbar__search { width: 54px; min-width: 54px; height: 54px !important; margin: -25px 0 0; border: 4px solid #f6f7f5; border-radius: 18px; background: #FF7000; color: #fff !important; box-shadow: 0 9px 19px rgba(255,112,0,.32); }
  .ore-app-tabbar__search svg { width: 22px !important; height: 22px !important; stroke: #fff; }
  .ore-app-tabbar i { top: -5px; right: calc(50% - 19px); }
  .app-page--marketplace .marketplace-tabs { display: none !important; }
}
@media (max-width: 359px) {
  .ore-app-header { padding-right: 9px; padding-left: 9px; }
  .ore-app-header__logo { width: 30px; height: 30px; flex-basis: 30px; }
  .ore-app-header__wordmark { font-size: 16px; }
  .ore-app-header__signin { display: none; }
  .ore-app-header__join { padding: 0 9px; }
  .ore-app-tabbar { right: 8px; left: 8px; }
  .ore-app-tabbar a { min-width: 40px; font-size: 8px; }
}

/* Shared bottom bar is deliberately the Index app navigation, unchanged in scale and geometry. */
@media (max-width: 767px) {
  .ore-app-tabbar.homepage-mobile-tabs { position:fixed; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); left:12px; z-index:1000; display:flex; height:76px; align-items:center; justify-content:space-around; padding:0 5px; border:1px solid #dbe7df; border-radius:38px; background:rgba(255,255,255,.97); box-shadow:0 14px 34px rgba(7,40,24,.2); backdrop-filter:blur(14px); }
  .ore-app-tabbar.homepage-mobile-tabs .homepage-mobile-tab { position:relative; display:flex; min-width:44px; height:auto; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:#728178; font-size:9px; font-weight:600; text-decoration:none; }
  .ore-app-tabbar.homepage-mobile-tabs .homepage-mobile-tab svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
  .ore-app-tabbar.homepage-mobile-tabs .homepage-mobile-tab.is-active { color:#0b4a36; }
  .ore-app-tabbar.homepage-mobile-tabs .homepage-mobile-tab.is-active::after { position:absolute; top:-9px; width:20px; height:3px; border-radius:99px; background:#0b4a36; content:''; }
  .ore-app-tabbar.homepage-mobile-tabs .homepage-mobile-tab--center { width:62px; min-width:62px; height:62px !important; margin-top:-25px; border:4px solid #f6f7f5; border-radius:50%; background:#FF7000; color:#fff !important; box-shadow:0 9px 19px rgba(255,112,0,.32); }
  .ore-app-tabbar.homepage-mobile-tabs .homepage-mobile-tab--center::after { display:none; }
  .ore-app-tabbar.homepage-mobile-tabs .homepage-mobile-tab--center svg { width:22px; height:22px; stroke:#fff; }
  .ore-app-tabbar.homepage-mobile-tabs i { top:-5px; right:calc(50% - 19px); }
}

/* Actual shared markup uses the same classes as index.php, so it receives the same app tab-bar treatment. */
@media (max-width: 767px) {
  .homepage-mobile-tabs.app-tabbar .sabo-market-tab {
    width:58px !important;
    min-width:58px !important;
    height:74px !important;
    margin-top:-25px !important;
    overflow:visible !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#728178 !important;
    box-shadow:none !important;
  }
  .homepage-mobile-tabs.app-tabbar .sabo-market-tab .sabo-market-icon {
    display:grid !important;
    flex:none !important;
    width:44px !important;
    height:44px !important;
    place-items:center;
    border:3px solid #f6f7f5 !important;
    border-radius:50% !important;
    background:#FF7000 !important;
    box-shadow:0 9px 19px rgba(255,112,0,.32) !important;
  }
  .homepage-mobile-tabs.app-tabbar .sabo-market-tab .sabo-market-icon svg {
    width:18px !important;
    height:18px !important;
    stroke:#fff !important;
  }
  .homepage-mobile-tabs.app-tabbar .sabo-market-tab .sabo-market-label {
    position:absolute !important;
    top:56px !important;
    left:50% !important;
    margin:0 !important;
    transform:translateX(-50%) !important;
    color:#0b4a36 !important;
    font-size:9px !important;
    font-weight:600 !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  .homepage-mobile-tabs.app-tabbar {
    position:fixed; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); left:12px; z-index:1000;
    display:flex; height:76px; align-items:center; justify-content:space-around; padding:0 5px;
    border:1px solid #dbe7df; border-radius:38px; background:rgba(255,255,255,.97);
    box-shadow:0 14px 34px rgba(7,40,24,.2); backdrop-filter:blur(14px);
  }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab {
    position:relative; display:flex; min-width:44px; height:auto; flex-direction:column; align-items:center; justify-content:center;
    gap:4px; color:#728178; font-size:9px; font-weight:600; text-decoration:none;
  }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab.is-active { color:#0b4a36; }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab.is-active::before { position:absolute; top:-9px; width:20px; height:3px; border-radius:99px; background:#0b4a36; content:''; }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab--center { width:62px; min-width:62px; height:62px; margin-top:-25px; border:4px solid #f6f7f5; border-radius:50%; background:#FF7000; color:#fff; box-shadow:0 9px 19px rgba(255,112,0,.32); }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab--center::before { display:none; }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab--center svg { width:22px; height:22px; stroke:#fff; }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab--center { width:58px; min-width:58px; height:74px; margin-top:-25px; overflow:visible; border:0; border-radius:0; background:transparent; color:#0b4a36 !important; box-shadow:none; }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab--center .sabo-market-icon { display:grid; flex:none; width:44px; height:44px; place-items:center; border:3px solid #f6f7f5; border-radius:50%; background:#FF7000; box-shadow:0 9px 19px rgba(255,112,0,.32); }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab--center .sabo-market-icon svg { width:18px; height:18px; stroke:#fff; }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab--center .sabo-market-label { position:absolute; top:56px; left:50%; margin:0; transform:translateX(-50%); white-space:nowrap; color:#0b4a36; font-size:9px; font-weight:800; line-height:1; }
  .homepage-mobile-tabs.app-tabbar .newview-dock-cart-count { position:absolute; top:-5px; right:calc(50% - 19px); display:grid; min-width:17px; height:17px; padding:0 4px; place-items:center; border:2px solid #fff; border-radius:99px; background:#FF7000; color:#fff; font-size:10px; font-style:normal; font-weight:800; line-height:1; }
}
@media (max-width:359px) {
  .homepage-mobile-tabs.app-tabbar { right:8px; left:8px; }
  .homepage-mobile-tabs.app-tabbar .homepage-mobile-tab { min-width:40px; font-size:8px; }
}

/* Shared live header state: one cart and account identity across every app page. */
@media (max-width: 767px) {
  .ore-app-header__guest-actions { display:contents; }
  .ore-app-header__guest-actions[hidden], .ore-app-header__account[hidden] { display:none !important; }
}

@media (max-width: 767px) {
  .homepage-mobile-tabs.app-tabbar a[href="cart.php"] > i[data-mobile-cart-count] {
    top: 1px;
    right: auto;
    left: calc(50% + 6px);
  }
}

@media (max-width: 767px) {
  .homepage-mobile-tabs.app-tabbar .sabo-market-tab {
    width:58px !important;
    min-width:58px !important;
    height:74px !important;
    margin-top:-25px !important;
    overflow:visible !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#0b4a36 !important;
    box-shadow:none !important;
  }
  .homepage-mobile-tabs.app-tabbar .sabo-market-tab .sabo-market-icon {
    display:grid !important;
    flex:none !important;
    width:44px !important;
    height:44px !important;
    place-items:center !important;
    border:3px solid #f6f7f5 !important;
    border-radius:50% !important;
    background:#FF7000 !important;
    box-shadow:0 9px 19px rgba(255,112,0,.32) !important;
  }
  .homepage-mobile-tabs.app-tabbar .sabo-market-tab .sabo-market-icon svg {
    width:18px !important;
    height:18px !important;
    stroke:#fff !important;
  }
  .homepage-mobile-tabs.app-tabbar .sabo-market-tab .sabo-market-label {
    position:absolute !important;
    top:56px !important;
    left:50% !important;
    margin:0 !important;
    transform:translateX(-50%) !important;
    color:#0b4a36 !important;
    font-size:9px !important;
    font-weight:800 !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
}