

/* GoJD Mobile Bottom Navigation */
.mobile-bottom-nav{display:none}
.mobile-bottom-nav svg{width:22px;height:22px;display:block;flex:0 0 22px}
@media (max-width:768px){
  .public-app-wrapper{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
  .mobile-bottom-nav{
    position:fixed;left:0;right:0;bottom:0;z-index:900;
    height:calc(64px + env(safe-area-inset-bottom,0px));
    padding:5px 10px env(safe-area-inset-bottom,0px);
    display:grid;grid-template-columns:repeat(5,1fr);align-items:stretch;
    background:rgba(255,255,255,.97);border-top:1px solid #e7e7e7;
    box-shadow:0 -5px 20px rgba(0,0,0,.07);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
  }
  .mobile-bottom-nav-item{
    position:relative;min-width:0;border:0;background:transparent;color:#777;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    padding:2px 4px;font:inherit;text-decoration:none;transition:color .2s ease,transform .2s ease
  }
  .mobile-bottom-nav-item:active{transform:scale(.94)}
  .mobile-bottom-nav-item.active{color:#e50914}
  .mobile-bottom-nav-item svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
  .mobile-bottom-nav-item span:not(.mobile-bottom-nav-icon-wrap):not(.mobile-bottom-nav-badge){font-size:10px;line-height:1.1;font-weight:700;white-space:nowrap}
  .mobile-bottom-nav-icon-wrap{position:relative;display:flex;align-items:center;justify-content:center}
  .mobile-bottom-nav-badge{position:absolute;top:-6px;right:-10px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:#e50914;color:#fff;border:2px solid #fff;display:flex;align-items:center;justify-content:center;font-size:9px!important;line-height:1;font-weight:800}
}

/* GoJD mobile header cleanup v2 */
@media (max-width:768px){
  .main-header .mobile-top-account-action{display:none!important}
  .main-header .cart-item,
  .main-header .action-item.cart-ref{display:none!important}
  .category-nav{display:none!important}
}

/* Keep the GoJD chat mascot fully outside the mobile bottom navigation. */
@media (max-width:768px){
  button:has(> img[src="/moseis.png"][alt="Chat"]){
    bottom:calc(72px + env(safe-area-inset-bottom,0px))!important;
    right:12px!important;
  }
}

/* GoJD mobile header compact + logo ampliada — 2026-08-29 */
@media (max-width:768px){
  .main-header{
    height:70px!important;
    min-height:70px!important;
    max-height:70px!important;
    padding:0!important;
  }
  .main-header .header-container{
    width:100%!important;
    height:70px!important;
    min-height:70px!important;
    max-height:70px!important;
    padding:0 16px!important;
    margin:0!important;
    gap:0!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
  }
  .main-header .header-logo{
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    height:70px!important;
    overflow:visible!important;
    display:flex!important;
    align-items:center!important;
  }
  .main-header .header-logo img,
  .main-header .header-logo-img{
    width:112px!important;
    height:112px!important;
    max-width:none!important;
    object-fit:contain!important;
    margin:-21px 0!important;
    display:block!important;
  }
  .main-header .header-actions{
    flex:0 0 auto!important;
    width:auto!important;
    height:70px!important;
    margin-left:auto!important;
    gap:8px!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
  }
}

/* Mobile: remove apenas o carrossel promocional acima da logo. */
@media (max-width:768px){
  .promo-banner-carousel{display:none!important}
}

/* Mobile: fixa o topo com logo/favoritos durante a rolagem sem alterar desktop. */
@media (max-width:768px){
  body:not(:has(.product-page)):not(:has(.login-page)):not(:has(.register-page)) .main-header{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    z-index:1200!important;
  }
  body:not(:has(.product-page)):not(:has(.login-page)):not(:has(.register-page)) .main-content{
    padding-top:70px!important;
  }
}
