/* MJ PACKAGING V115 — MODERN HEADER CART + HERO GLASS NAV */

/* ---------- HEADER CART: CLEAN ICON + EMERALD COUNT BADGE ---------- */
body .mj-global-shell .mj-actions .mj-cart-trigger,
body .mj-global-shell .mj-cart-trigger{
  position:relative!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  padding:8px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  outline:0!important;
  border-radius:999px!important;
  background:transparent!important;
  color:#37413d!important;
  box-shadow:none!important;
  transition:color .2s ease,background .2s ease,transform .2s ease!important;
}
body .mj-global-shell .mj-actions .mj-cart-trigger:hover,
body .mj-global-shell .mj-cart-trigger:hover{
  background:#f0f2ef!important;
  color:#0d7254!important;
  transform:translateY(-1px)!important;
}
body .mj-global-shell .mj-actions .mj-cart-trigger:focus-visible,
body .mj-global-shell .mj-cart-trigger:focus-visible{
  outline:2px solid #0d7254!important;
  outline-offset:2px!important;
}
body .mj-global-shell .mj-actions .mj-cart-trigger svg,
body .mj-global-shell .mj-cart-trigger svg{
  width:24px!important;
  height:24px!important;
  stroke:currentColor!important;
  fill:none!important;
  stroke-width:1.8!important;
}
body .mj-global-shell .mj-actions .mj-cart-trigger .cartCount,
body .mj-global-shell .mj-cart-trigger .cartCount{
  position:absolute!important;
  top:1px!important;
  right:0!important;
  z-index:3!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:18px!important;
  width:18px!important;
  height:18px!important;
  padding:0!important;
  border:2px solid #f9f7f2!important;
  border-radius:999px!important;
  background:#0d7254!important;
  color:#fff!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:0!important;
  box-shadow:none!important;
}

/* ---------- HERO: GLASSMORPHIC ROUND ARROWS ---------- */
.mj-hero .hero-arrow{
  position:absolute!important;
  top:auto!important;
  bottom:24px!important;
  z-index:40!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(255,255,255,.24)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  box-shadow:0 8px 24px rgba(0,0,0,.20)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
  font-size:0!important;
  line-height:1!important;
  opacity:1!important;
  transform:none!important;
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease!important;
}
.mj-hero .hero-prev{left:auto!important;right:76px!important}
.mj-hero .hero-next{left:auto!important;right:24px!important}
.mj-hero .hero-prev::before,
.mj-hero .hero-next::before{
  display:block!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:20px!important;
  font-weight:400!important;
  line-height:1!important;
}
.mj-hero .hero-prev::before{content:'‹'!important}
.mj-hero .hero-next::before{content:'›'!important}
.mj-hero .hero-arrow:hover{
  background:rgba(255,255,255,.94)!important;
  border-color:rgba(255,255,255,.94)!important;
  color:#122f26!important;
  transform:translateY(-2px)!important;
  box-shadow:0 10px 26px rgba(0,0,0,.24)!important;
}
.mj-hero .hero-arrow:active{transform:translateY(0)!important}
.mj-hero .hero-arrow:focus-visible{
  outline:2px solid rgba(255,255,255,.95)!important;
  outline-offset:3px!important;
}

@media(max-width:760px){
  body .mj-global-shell .mj-actions .mj-cart-trigger,
  body .mj-global-shell .mj-cart-trigger{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important}
  .mj-hero .hero-arrow{bottom:16px!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important}
  .mj-hero .hero-prev{right:64px!important;left:auto!important}
  .mj-hero .hero-next{right:16px!important;left:auto!important}
  .mj-hero .hero-prev::before,.mj-hero .hero-next::before{font-size:19px!important}
}
