/* TAQA STORE V252 — Bottom Navigation Rebalance
   Restores a comfortable app-tab-bar proportion inspired by the supplied iOS/ecommerce tab bar kits.
   Loads after V251 and keeps one canonical 5-item navigation across customer pages. */
:root{
  --v252-nav-green:#39e66b;
  --v252-nav-bg:rgba(7,12,9,.975);
  --v252-nav-muted:#7f8b84;
  --v252-nav-h:78px;
}

@media (max-width:1023px){
  html body:not(.admin-page)>.mobile-bottom-nav.v245-bottom-nav,
  html body:not(.admin-page) .mobile-bottom-nav.v245-bottom-nav,
  body.customer-account-v130 .ca-bottom.v232-bottom.v245-bottom-nav{
    left:10px!important;
    right:10px!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    pointer-events:auto!important;
    height:var(--v252-nav-h)!important;
    min-height:var(--v252-nav-h)!important;
    padding:6px 5px!important;
    gap:3px!important;
    border-radius:23px!important;
    border:1px solid rgba(255,255,255,.09)!important;
    background:var(--v252-nav-bg)!important;
    box-shadow:0 14px 38px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.025)!important;
    backdrop-filter:blur(20px)!important;
    -webkit-backdrop-filter:blur(20px)!important;
    overflow:visible!important;
  }

  html body:not(.admin-page) .v245-bottom-nav>a,
  html body:not(.admin-page) .v245-bottom-nav>button,
  body.customer-account-v130 .ca-bottom.v232-bottom.v245-bottom-nav>a,
  body.customer-account-v130 .ca-bottom.v232-bottom.v245-bottom-nav>button{
    height:66px!important;
    min-height:66px!important;
    padding:6px 2px 5px!important;
    pointer-events:auto!important;
    gap:4px!important;
    border-radius:18px!important;
    color:var(--v252-nav-muted)!important;
    font-size:10.5px!important;
    font-weight:700!important;
    line-height:1.15!important;
  }

  html body:not(.admin-page) .v245-bottom-nav .v245-bottom-icon{
    width:34px!important;
    height:33px!important;
    min-width:34px!important;
    min-height:33px!important;
    border-radius:12px!important;
  }

  html body:not(.admin-page) .v245-bottom-nav .v245-bottom-icon svg,
  html body:not(.admin-page) .v245-bottom-nav .v245-bottom-icon .v246-icon,
  html body:not(.admin-page) .v245-bottom-nav .v245-bottom-icon .v250-account-icon{
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    min-height:22px!important;
    font-size:22px!important;
  }

  html body:not(.admin-page) .v245-bottom-nav>a>span:last-child,
  html body:not(.admin-page) .v245-bottom-nav>button>span:last-child{
    font-size:10.5px!important;
    font-weight:700!important;
    line-height:1.15!important;
  }

  html body:not(.admin-page) .v245-bottom-nav>:is(a,button).active,
  html body:not(.admin-page) .v245-bottom-nav>:is(a,button).taqa-active,
  html body:not(.admin-page) .v245-bottom-nav>:is(a,button)[aria-current="page"]{
    color:var(--v252-nav-green)!important;
    background:rgba(57,230,107,.075)!important;
  }

  html body:not(.admin-page) .v245-bottom-nav>:is(a,button).active .v245-bottom-icon,
  html body:not(.admin-page) .v245-bottom-nav>:is(a,button).taqa-active .v245-bottom-icon,
  html body:not(.admin-page) .v245-bottom-nav>:is(a,button)[aria-current="page"] .v245-bottom-icon{
    color:var(--v252-nav-green)!important;
    background:rgba(57,230,107,.07)!important;
  }

  html body:not(.admin-page) .v245-bottom-nav .cart-count{
    top:-2px!important;
    right:-7px!important;
    min-width:17px!important;
    height:17px!important;
    padding:0 4px!important;
    font:800 9px/17px Arial,sans-serif!important;
    box-shadow:0 0 0 2px #070c09!important;
  }

  html body:not(.admin-page){
    padding-bottom:calc(98px + env(safe-area-inset-bottom))!important;
  }
}

@media (max-width:360px){
  :root{--v252-nav-h:75px}
  html body:not(.admin-page) .v245-bottom-nav>a,
  html body:not(.admin-page) .v245-bottom-nav>button{height:63px!important;min-height:63px!important;font-size:10px!important}
  html body:not(.admin-page) .v245-bottom-nav>a>span:last-child,
  html body:not(.admin-page) .v245-bottom-nav>button>span:last-child{font-size:10px!important}
}

@media (min-width:1024px){
  html body:not(.admin-page) .mobile-bottom-nav.v245-bottom-nav{display:none!important}
}
