:root{
  --primary:#7a3cff !important;
  --accent:#9b6bff !important;
  --brand:#8d54ff !important;
  --blue:#7a3cff !important;
  --blue-2:#9b6bff !important;
  --nv-purple:#7a3cff !important;
  --nv-purple-2:#a77cff !important;
  --nv-purple-3:#5120bf !important;
  --fast-purple:#7a3cff !important;
  --fast-purple-dark:#5b28d8 !important;
  --fast-purple-soft:rgba(122,60,255,.22) !important;
}

/* Barrinha flutuante: fundo escuro, logo à esquerda e botões à direita. */
html body .lovenav{
  width:min(980px,calc(100% - 20px)) !important;
  height:76px !important;
  padding:7px 12px 7px 9px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
  overflow:hidden !important;
  border-radius:21px !important;
  background:linear-gradient(180deg,rgba(8,8,14,.97),rgba(15,10,28,.98) 58%,rgba(8,8,14,.97)) !important;
  border:1px solid rgba(140,105,255,.26) !important;
  box-shadow:0 14px 30px rgba(0,0,0,.48),inset 0 0 0 1px rgba(255,255,255,.03) !important;
}
html body .lovenav .nav-logo{
  order:1 !important;
  position:relative !important;
  left:auto !important;
  top:auto !important;
  transform:none !important;
  width:62px !important;
  height:62px !important;
  min-width:62px !important;
  margin:0 auto 0 0 !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  border-radius:50% !important;
  border:1px solid rgba(155,107,255,.30) !important;
  background:rgba(14,10,24,.72) !important;
  box-shadow:none !important;
  z-index:2 !important;
}
html body .lovenav .nav-logo img{
  width:58px !important;
  height:58px !important;
  max-width:58px !important;
  max-height:58px !important;
  object-fit:cover !important;
  border-radius:50% !important;
  filter:none !important;
  transform:none !important;
}
html body .lovenav .nav-left,
html body .lovenav .nav-right{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 !important;
}
html body .lovenav .nav-left{order:2 !important}
html body .lovenav .nav-right{order:3 !important}
html body .lovenav .nav-ico{
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  border-radius:13px !important;
  background:linear-gradient(180deg,rgba(31,22,56,.90),rgba(17,13,31,.94)) !important;
  border:1px solid rgba(150,112,255,.22) !important;
  box-shadow:none !important;
  transform:none !important;
}
html body .lovenav .nav-ico:hover,
html body .lovenav .nav-ico:active{
  background:linear-gradient(180deg,rgba(58,42,104,.94),rgba(25,18,47,.96)) !important;
  border-color:rgba(155,107,255,.48) !important;
  box-shadow:none !important;
  transform:none !important;
}
html body .lovenav .nav-ico svg{
  width:24px !important;
  height:24px !important;
  fill:#fff !important;
  filter:none !important;
}

/* Volta da identidade roxa principal. */
html body .nav-ico,
html body .menu-close,
html body .how-receive-btn,
html body .categories button,
html body .show-all-category,
html body .category-showcase-action,
html body .buy-small,
html body .detail-buy,
html body .pay,
html body .linkbtn,
html body .checkout-pay-btn,
html body .coupon-row button,
html body .summary-remove,
html body .legal-back{
  background:linear-gradient(180deg,#8f59ff 0%,#7a3cff 58%,#5a23d2 100%) !important;
  border-color:rgba(167,124,255,.32) !important;
}
html body .buy-small,
html body .detail-buy,
html body .pay,
html body .checkout-pay-btn,
html body .linkbtn{
  box-shadow:0 5px 0 #4415a8,0 0 13px rgba(122,60,255,.15) !important;
}
html body .category-showcase-card,
html body .category-card,
html body .catalog .product,
html body .product,
html body .checkout-card,
html body .pix-card,
html body .product-detail,
html body .legal-box,
html body .content-card{
  border-color:rgba(141,84,255,.28) !important;
}
html body .section-line,
html body .categories-separator-line{
  background:linear-gradient(90deg,transparent,#7a3cff,transparent) !important;
  box-shadow:none !important;
}
html body .blue,
html body .desc b.blue,
html body .discount-line,
html body .order-total b,
html body .coupon-box span,
html body #couponMsg.ok,
html body .category-title-row h2,
html body .section-title-pill,
html body .categories-separator-pill{
  color:#9b6bff !important;
}
html body .show-all-category.active,
html body .categories button.active{
  background:#6e34ef !important;
  color:#fff !important;
}
html body .bg::before{
  background-image:
    linear-gradient(rgba(155,107,255,.15) 1px,transparent 1px),
    linear-gradient(90deg,rgba(155,107,255,.15) 1px,transparent 1px) !important;
}

/* Hero da página inicial sem banner, agora só com texto. */
html body .brand-intro.brand-intro-copy{
  background:linear-gradient(135deg,rgba(10,10,18,.97) 0%,rgba(23,18,44,.97) 52%,rgba(12,10,22,.98) 100%) !important;
  border:1px solid rgba(155,107,255,.22) !important;
  box-shadow:0 18px 44px rgba(0,0,0,.46),0 0 0 1px rgba(122,60,255,.09) inset !important;
}
html body .brand-intro.brand-intro-copy::before{
  background:radial-gradient(circle at 14% 30%,rgba(155,107,255,.18),transparent 28%),radial-gradient(circle at 82% 18%,rgba(122,60,255,.14),transparent 24%),linear-gradient(120deg,transparent 0 14%,rgba(255,255,255,.04) 15% 17%,transparent 18% 100%) !important;
}
html body .brand-intro.brand-intro-copy::after{
  background:radial-gradient(circle,rgba(122,60,255,.12) 0%,transparent 70%) !important;
}
html body .brand-intro-copy .brand-intro-kicker{
  background:rgba(122,60,255,.14) !important;
  border:1px solid rgba(155,107,255,.30) !important;
  color:#efe8ff !important;
  box-shadow:none !important;
}
html body .brand-intro-copy h1{
  color:#fff !important;
  text-shadow:0 10px 22px rgba(0,0,0,.38) !important;
}
html body .brand-intro-copy p{
  color:#dfdbf3 !important;
}
html body .brand-intro-copy .brand-intro-badges span{
  background:linear-gradient(180deg,rgba(122,60,255,.24),rgba(12,10,25,.78)) !important;
  border:1px solid rgba(255,255,255,.08) !important;
}
html body .brand-main-banner{display:none !important}

/* Barrinhas de categoria mais finas. */
html body .storefront-content-zone .main-category-grid{
  gap:12px !important;
}
html body .storefront-content-zone .category-showcase-card,
html body .storefront-content-zone .category-card.category-showcase-card{
  min-height:112px !important;
  padding:11px 15px !important;
  border-radius:20px !important;
  background-image:linear-gradient(90deg,rgba(4,5,12,.94) 0%,rgba(7,10,22,.90) 48%,rgba(10,8,22,.72) 100%),var(--category-art) !important;
}
html body .storefront-content-zone .category-showcase-thumb{
  width:76px !important;
  height:76px !important;
}
html body .storefront-content-zone .category-showcase-content{
  gap:3px !important;
}
html body .storefront-content-zone .category-showcase-content strong{
  font-size:18px !important;
}
html body .storefront-content-zone .category-showcase-content small{
  font-size:12px !important;
}
html body .storefront-content-zone .category-showcase-action{
  padding:8px 14px !important;
  font-size:12px !important;
}

@media(max-width:650px){
  html body .lovenav{
    width:calc(100% - 14px) !important;
    height:68px !important;
    padding:6px 8px 6px 7px !important;
    gap:6px !important;
    border-radius:17px !important;
  }
  html body .lovenav .nav-logo{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
  }
  html body .lovenav .nav-logo img{
    width:50px !important;
    height:50px !important;
    max-width:50px !important;
    max-height:50px !important;
  }
  html body .lovenav .nav-left,
  html body .lovenav .nav-right{gap:6px !important}
  html body .lovenav .nav-ico{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    border-radius:11px !important;
  }
  html body .lovenav .nav-ico svg{width:21px !important;height:21px !important}
  html body .storefront-content-zone .main-category-grid{
    gap:10px !important;
  }
  html body .storefront-content-zone .category-showcase-card,
  html body .storefront-content-zone .category-card.category-showcase-card{
    min-height:96px !important;
    padding:10px 12px !important;
    border-radius:18px !important;
  }
  html body .storefront-content-zone .category-showcase-thumb{
    width:62px !important;height:62px !important;
  }
  html body .storefront-content-zone .category-showcase-content strong{font-size:15px !important}
  html body .storefront-content-zone .category-showcase-content small{font-size:10.5px !important}
  html body .storefront-content-zone .category-showcase-action{padding:7px 12px !important;font-size:11px !important}
}
@media(max-width:380px){
  html body .lovenav{gap:4px !important}
  html body .lovenav .nav-left,
  html body .lovenav .nav-right{gap:4px !important}
  html body .lovenav .nav-ico{
    width:35px !important;height:35px !important;min-width:35px !important
  }
  html body .lovenav .nav-logo{
    width:50px !important;height:50px !important;min-width:50px !important
  }
  html body .lovenav .nav-logo img{width:46px !important;height:46px !important}
}


/* Wordmark horizontal na barrinha flutuante e no final do site */
html body .lovenav .nav-logo{
  width:250px !important;
  height:58px !important;
  min-width:250px !important;
  border-radius:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
  overflow:visible !important;
}
html body .lovenav .nav-logo img{
  width:250px !important;
  height:58px !important;
  max-width:250px !important;
  max-height:58px !important;
  object-fit:contain !important;
  border-radius:0 !important;
  filter:none !important;
  box-shadow:none !important;
}
html body .footer-brand-bar{
  width:min(1080px,calc(100% - 24px)) !important;
  margin:28px auto 8px !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
}
html body .footer-brand-image{
  width:min(720px,92%) !important;
  height:auto !important;
  display:block !important;
  object-fit:contain !important;
  filter:none !important;
}
@media(max-width:900px){
  html body .lovenav .nav-logo{
    width:210px !important;
    height:50px !important;
    min-width:210px !important;
  }
  html body .lovenav .nav-logo img{
    width:210px !important;
    height:50px !important;
    max-width:210px !important;
    max-height:50px !important;
  }
}
@media(max-width:650px){
  html body .lovenav{
    justify-content:space-between !important;
  }
  html body .lovenav .nav-logo{
    width:172px !important;
    height:40px !important;
    min-width:172px !important;
    margin-right:auto !important;
  }
  html body .lovenav .nav-logo img{
    width:172px !important;
    height:40px !important;
    max-width:172px !important;
    max-height:40px !important;
  }
  html body .footer-brand-bar{margin:22px auto 6px !important;}
  html body .footer-brand-image{width:min(94%,520px) !important;}
}
@media(max-width:430px){
  html body .lovenav .nav-logo{
    width:150px !important;
    height:36px !important;
    min-width:150px !important;
  }
  html body .lovenav .nav-logo img{
    width:150px !important;
    height:36px !important;
    max-width:150px !important;
    max-height:36px !important;
  }
}
