/* V995 — one mobile shell across storefront, product, checkout and contact. */
@media (max-width:760px){
  :root{
    --foxi-mobile-dock-height:70px;
    --foxi-mobile-dock-reserve:calc(88px + env(safe-area-inset-bottom));
    --foxi-mobile-buybar-reserve:76px;
  }

  html{scroll-padding-bottom:var(--foxi-mobile-dock-reserve)}
  body.foxi-mobile-app{
    min-height:100dvh;
    padding-bottom:var(--foxi-mobile-dock-reserve)!important;
    background:#f7faf8;
  }
  body.foxi-mobile-app.foxi-mobile-product{
    padding-bottom:calc(var(--foxi-mobile-dock-reserve) + var(--foxi-mobile-buybar-reserve))!important;
  }

  /* Retire the experimental V990 duplicate. future-v18 owns the canonical dock. */
  .foxi-mobile-bar,.foxi-mobile-search{display:none!important}

  body.foxi-mobile-app .fx-mobile-dock{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    z-index:9990!important;
    width:auto!important;
    max-width:none!important;
    min-height:var(--foxi-mobile-dock-height)!important;
    margin:0!important;
    padding:7px 6px!important;
    border:1px solid rgba(8,96,70,.12)!important;
    border-radius:23px!important;
    background:rgba(255,255,255,.96)!important;
    box-shadow:0 12px 35px rgba(11,55,42,.18)!important;
    backdrop-filter:blur(18px) saturate(1.25)!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.25)!important;
  }
  body.foxi-mobile-app .fx-mobile-dock a,
  body.foxi-mobile-app .fx-mobile-dock button{
    box-sizing:border-box!important;
    min-width:0!important;
    min-height:54px!important;
    padding:3px 1px!important;
    border:0!important;
    border-radius:14px!important;
    background:transparent!important;
    color:#61756e!important;
    font:600 10.5px/1.1 "DM Sans",sans-serif!important;
    text-align:center!important;
    white-space:nowrap!important;
    -webkit-tap-highlight-color:transparent;
  }
  body.foxi-mobile-app .fx-mobile-dock a>span,
  body.foxi-mobile-app .fx-mobile-dock button>span{font-size:18px!important;line-height:1!important}
  body.foxi-mobile-app .fx-mobile-dock .is-active{background:#edf8f3!important;color:#087149!important}

  /* Header shortcuts: account and cart remain available on every mobile page. */
  body:not(.admin-body).foxi-mobile-app .fw-tools{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:4px!important;
    min-width:92px!important;
  }
  body:not(.admin-body).foxi-mobile-app .fw-tools>a.fw-mobile-account{
    box-sizing:border-box!important;
    display:grid!important;
    place-items:center!important;
    flex:0 0 44px!important;
    width:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    height:44px!important;
    padding:0!important;
    border:1px solid #dce8e2!important;
    border-radius:14px!important;
    background:#f3f8f5!important;
    color:#087149!important;
  }
  body:not(.admin-body).foxi-mobile-app .fw-tools>a.fw-mobile-account>span{
    display:grid!important;
    place-items:center!important;
    width:22px!important;
    height:22px!important;
    color:inherit!important;
    font-size:0!important;
  }
  body:not(.admin-body).foxi-mobile-app .fw-tools>a.fw-mobile-account svg{
    width:22px!important;
    height:22px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.8!important;
    stroke-linecap:round!important;
  }
  body:not(.admin-body).foxi-mobile-app .fw-tools>a.fw-mobile-account>div{display:none!important}
  body:not(.admin-body).foxi-mobile-app .fw-tools .fw-cart{
    box-sizing:border-box!important;
    flex:0 0 44px!important;
    width:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    height:44px!important;
    padding:0!important;
    justify-content:center!important;
  }

  /* Equal mobile checkout steps: label baselines align and no text is clipped. */
  body.foxi-mobile-app.fw-checkout .checkout-stepper.checkout-stepper--3{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr) 18px minmax(0,1fr)!important;
    align-items:start!important;
    gap:0!important;
    width:100%!important;
    min-width:0!important;
    padding:10px 7px 9px!important;
    overflow:visible!important;
  }
  body.foxi-mobile-app.fw-checkout .checkout-stepper.checkout-stepper--3>i{
    display:block!important;
    align-self:start!important;
    width:calc(100% + 6px)!important;
    height:2px!important;
    margin:17px -3px 0!important;
    border-radius:999px!important;
  }
  body.foxi-mobile-app.fw-checkout .checkout-stepper.checkout-stepper--3 .checkout-step{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:36px minmax(28px,auto)!important;
    justify-items:center!important;
    align-content:start!important;
    gap:7px!important;
    width:100%!important;
    min-width:0!important;
    min-height:71px!important;
    padding:0 2px!important;
    overflow:visible!important;
  }
  body.foxi-mobile-app.fw-checkout .checkout-stepper.checkout-stepper--3 .checkout-step>span{
    grid-row:1!important;
    grid-column:1!important;
    width:34px!important;
    height:34px!important;
    box-sizing:border-box!important;
  }
  body.foxi-mobile-app.fw-checkout .checkout-stepper.checkout-stepper--3 .checkout-step>b{
    grid-row:2!important;
    grid-column:1!important;
    display:block!important;
    align-self:start!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    color:#6b7972;
    font-size:10px!important;
    font-weight:800!important;
    line-height:1.18!important;
    text-align:center!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    text-wrap:balance;
  }
  body.foxi-mobile-app.fw-checkout .checkout-stepper.checkout-stepper--3 .checkout-step>small{display:none!important}

  /* On phones the order summary is a genuine third step, not a permanent sidebar. */
  body.foxi-mobile-app.fw-checkout:not(.checkout-final-step) .checkout-summary{display:none!important}
  body.foxi-mobile-app.fw-checkout.checkout-final-step .checkout-summary{
    display:block!important;
    order:2!important;
    width:100%!important;
    margin-top:14px!important;
  }

  /* The completion icon keeps a fixed column and can never shrink into text. */
  body.foxi-mobile-app.fw-checkout .final-review-note{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr)!important;
    align-items:start!important;
    column-gap:12px!important;
    width:100%!important;
  }
  body.foxi-mobile-app.fw-checkout .final-review-note>span{
    box-sizing:border-box!important;
    display:grid!important;
    place-items:center!important;
    grid-column:1!important;
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
    padding:0!important;
    border-radius:50%!important;
    line-height:1!important;
  }
  body.foxi-mobile-app.fw-checkout .final-review-note>div{
    grid-column:2!important;
    min-width:0!important;
  }

  /* Search results start directly under the live search field, not under the nav rail. */
  body.foxi-mobile-app .fw-search{position:relative!important;overflow:visible!important;z-index:420!important}
  body.foxi-mobile-app .fw-search-results.is-viewport-positioned{
    box-sizing:border-box!important;
    position:fixed!important;
    left:8px!important;
    right:8px!important;
    width:auto!important;
    max-width:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    border-radius:16px!important;
    z-index:10020!important;
    -webkit-overflow-scrolling:touch;
  }

  /* Expanded animal menu is a fitted viewport panel and can scroll above the dock. */
  body:not(.admin-body).foxi-mobile-app .fw-nav.fw-mega-nav .fw-mega-panel{
    box-sizing:border-box!important;
    position:fixed!important;
    top:var(--foxi-mobile-mega-top,264px)!important;
    left:6px!important;
    right:6px!important;
    width:auto!important;
    max-width:none!important;
    max-height:var(--foxi-mobile-mega-height,calc(100dvh - 360px))!important;
    padding-bottom:22px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    transform:none!important;
    z-index:9970!important;
    -webkit-overflow-scrolling:touch;
  }
  body:not(.admin-body).foxi-mobile-app .fw-nav.fw-mega-nav .fw-mega-panel.is-open{transform:none!important}
  body.foxi-mobile-app .fw-mega-panel__grid{padding-bottom:12px!important}

  /* Product purchase CTA sits in its own tier immediately above the bottom nav. */
  body.foxi-mobile-app.foxi-mobile-product .product-mobile-buybar{display:none!important}
  body.foxi-mobile-app.foxi-mobile-product .pd-mobile-buybar{
    box-sizing:border-box!important;
    left:8px!important;
    right:8px!important;
    bottom:var(--foxi-mobile-dock-reserve)!important;
    z-index:9980!important;
    width:auto!important;
    min-height:66px!important;
    padding:9px 12px!important;
    border:1px solid #dce8e2!important;
    border-radius:17px!important;
    background:rgba(255,255,255,.97)!important;
    box-shadow:0 10px 30px rgba(15,55,42,.16)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
  }
  body.foxi-mobile-app.foxi-mobile-product .pd-mobile-buybar button{
    min-width:min(170px,48vw)!important;
    min-height:48px!important;
  }

  /* Every active filter stays readable; rows grow instead of clipping horizontally. */
  body.foxi-mobile-app .v12-active-filters{
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    align-content:flex-start!important;
    flex-wrap:wrap!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    margin:10px 0 16px!important;
    padding:0!important;
    overflow:visible!important;
  }
  body.foxi-mobile-app .v12-active-filters>span{flex:0 0 100%!important;font-size:10px!important}
  body.foxi-mobile-app .v12-active-filters button{
    flex:0 1 auto!important;
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    min-height:36px!important;
    padding:8px 12px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    line-height:1.25!important;
    text-align:left!important;
  }

  body.foxi-mobile-app .announcement{font-size:10px;min-height:28px;padding:5px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.foxi-mobile-app .site-header{position:sticky;top:0;z-index:90;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);box-shadow:0 2px 12px rgba(15,54,42,.08)}
  body.foxi-mobile-app .header-main{min-height:60px;padding:8px 14px;gap:10px}
  body.foxi-mobile-app .brand-name{font-size:18px}
  body.foxi-mobile-app .brand-fox,body.foxi-mobile-app .brand-fox img{width:32px;height:32px}
  body.foxi-mobile-app .main-nav{display:none}
  body.foxi-mobile-app .search{display:none}
  body.foxi-mobile-app .header-actions .icon-btn span{display:none}
  body.foxi-mobile-app .header-actions .icon-btn{min-width:44px;min-height:44px;border-radius:14px;background:#f0f6f3}
  body.foxi-mobile-app .product-page{padding-top:12px}
  body.foxi-mobile-app .cart-page,body.foxi-mobile-app .checkout-page{padding-bottom:18px}
  body.foxi-mobile-app .checkout-summary{position:static!important}
  body.foxi-mobile-app .footer{padding-bottom:24px}
  body.foxi-mobile-app .v12-footer{margin-bottom:12px}
}

@media (max-width:360px){
  body.foxi-mobile-app .fx-mobile-dock{left:7px!important;right:7px!important;padding-inline:3px!important}
  body.foxi-mobile-app .fx-mobile-dock a,body.foxi-mobile-app .fx-mobile-dock button{font-size:9.5px!important}
  body.foxi-mobile-app.foxi-mobile-product .pd-mobile-buybar{gap:8px!important}
  body.foxi-mobile-app.foxi-mobile-product .pd-mobile-buybar button{min-width:142px!important;font-size:13px!important}
  body.foxi-mobile-app.fw-checkout .checkout-stepper.checkout-stepper--3{
    grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr)!important;
    padding-inline:4px!important;
  }
  body.foxi-mobile-app.fw-checkout .checkout-stepper.checkout-stepper--3 .checkout-step>b{font-size:9.25px!important}
}

@media (min-width:761px){.foxi-mobile-bar,.foxi-mobile-search{display:none!important}}