/* Mandrake UX v5 - front público mais limpo e responsivo */
:root{
  --mg5-blue:#0057ff;
  --mg5-blue-dark:#003fc2;
  --mg5-ink:#061126;
  --mg5-muted:#66758f;
  --mg5-soft:#eef5ff;
  --mg5-border:#d6e5ff;
  --mg5-shadow:0 12px 30px rgba(15,23,42,.08);
  --mg5-shadow-hover:0 18px 44px rgba(15,23,42,.13);
}

/* ===== Header / menu ===== */
.mg-header-inicio{
  background:rgba(255,255,255,.92)!important;
  border-bottom:1px solid rgba(0,87,255,.12)!important;
  box-shadow:0 8px 24px rgba(15,23,42,.08)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.mg-header-inicio-inner{
  width:min(1180px,calc(100% - 1.1rem))!important;
  padding:.48rem 0!important;
}
.mg-inicio-logo-card{
  min-height:3rem!important;
  border-radius:1rem!important;
  padding:.34rem .68rem .34rem .42rem!important;
  box-shadow:0 8px 22px rgba(0,87,255,.10)!important;
}
.mg-inicio-logo-img{width:2.35rem!important;height:2.35rem!important;border-radius:.75rem!important}
.mg-inicio-logo-title{font-size:.95rem!important;letter-spacing:-.04em!important}
.mg-inicio-menu-button{
  width:2.75rem!important;height:2.75rem!important;border-radius:1rem!important;
  background:#fff!important;border:1px solid rgba(0,87,255,.18)!important;
  box-shadow:0 8px 22px rgba(0,87,255,.10)!important;
}
@media (min-width:960px){
  .mg-inicio-slide-menu{max-width:430px!important}
}

/* ===== Geral ===== */
body{background:linear-gradient(180deg,#f5fbff 0%,#eef8ff 100%)!important}
.mg-store{
  width:min(1180px,calc(100% - 1rem))!important;
  margin-inline:auto!important;
  padding-top:5.15rem!important;
  padding-bottom:2rem!important;
}
@media (min-width:760px){
  .mg-store{width:min(1180px,calc(100% - 2rem))!important;padding-top:5.7rem!important}
}

/* Hero mais curto */
.mg-hero-card{margin-top:0!important;border-radius:1.55rem!important;box-shadow:var(--mg5-shadow)!important}
.mg-hero-pro{min-height:auto!important;padding:1.2rem!important}
.mg-hero-pro-inner{align-items:center!important;gap:1rem!important}
.mg-hero-copy h1{font-size:clamp(2.15rem,5vw,4.25rem)!important;line-height:.95!important;letter-spacing:-.075em!important}
.mg-hero-copy p{max-width:660px!important;font-size:.98rem!important;line-height:1.55!important}
.mg-hero-status-card{min-width:150px!important;min-height:112px!important}
.mg-trust-strip{margin-top:.9rem!important;gap:.75rem!important}
.mg-trust-item{min-height:4.25rem!important;border-radius:1.05rem!important;padding:.75rem .9rem!important}
@media (max-width:720px){
  .mg-hero-pro{padding:1rem!important}
  .mg-hero-pro-inner{grid-template-columns:1fr!important}
  .mg-hero-copy h1{font-size:2.45rem!important}
  .mg-hero-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:.55rem!important}
  .mg-hero-cta{min-height:2.8rem!important;padding:.7rem!important;font-size:.78rem!important}
  .mg-hero-status-card{display:none!important}
  .mg-trust-strip{grid-template-columns:1fr!important}
}

/* ===== Filtro: fica no fluxo normal, não fica grudado por cima dos produtos ===== */
.mg-filter-panel{
  position:relative!important;
  top:auto!important;
  z-index:3!important;
  margin-top:1rem!important;
  border-radius:1.35rem!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:var(--mg5-shadow)!important;
}
.mg-product-filter-grid{
  display:grid!important;
  grid-template-columns:minmax(230px,1.35fr) minmax(190px,.85fr) minmax(170px,.75fr) minmax(140px,.55fr)!important;
  gap:.75rem!important;
}
#tabsList{display:none!important}
@media (max-width:820px){
  .mg-filter-panel{padding:1rem!important}
  .mg-product-filter-grid{grid-template-columns:1fr 1fr!important;gap:.65rem!important}
  .mg-search-wrap{grid-column:1/-1!important}
  .mg-input-pro{height:3rem!important;border-radius:1.05rem!important;font-size:.82rem!important}
}
@media (max-width:430px){
  .mg-product-filter-grid{grid-template-columns:1fr!important}
}

/* ===== Grid dos produtos ===== */
#abasConteudo{margin-top:1.1rem!important}
#mgUnifiedResults{margin-top:1.15rem!important}
#mgUnifiedTitle,.js-tab-content h2{
  font-size:clamp(1.45rem,2.6vw,2.2rem)!important;
  line-height:1.05!important;
  letter-spacing:-.055em!important;
}
#mgUnifiedSubtitle,.js-tab-content h2+p{
  font-size:.92rem!important;
  color:#334155!important;
  line-height:1.45!important;
}
.js-products-grid,#mgUnifiedGrid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:.8rem!important;
  align-items:start!important;
}
@media (min-width:700px){.js-products-grid,#mgUnifiedGrid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:1rem!important}}
@media (min-width:1120px){.js-products-grid,#mgUnifiedGrid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:1.05rem!important}}

/* ===== Card de produto compacto ===== */
.js-product-card,.mg-product-card{
  content-visibility:visible!important;
  contain:none!important;
  contain-intrinsic-size:auto!important;
  height:auto!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:1.18rem!important;
  border:1px solid var(--mg5-border)!important;
  background:#fff!important;
  box-shadow:var(--mg5-shadow)!important;
  transform:none!important;
}
.js-product-card:hover{box-shadow:var(--mg5-shadow-hover)!important;transform:translateY(-2px)!important}
.js-product-card .mg-product-image-wrap{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:0!important;
  aspect-ratio:4/5!important;
  flex:0 0 auto!important;
  overflow:hidden!important;
  background:linear-gradient(135deg,#f8fbff,#eaf2ff)!important;
  border-bottom:1px solid rgba(0,87,255,.10)!important;
}
.js-product-card .imagem-produto{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  padding:7px!important;
  background:transparent!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
}
.js-product-card:hover .imagem-produto{transform:scale(1.025)!important}
.js-product-card > .flex.flex-1.flex-col{
  padding:.72rem!important;
  border-top:0!important;
  min-height:0!important;
}
.mg-card-meta-row{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:.45rem!important;margin-bottom:.42rem!important}
.mg-card-category{
  max-width:100%!important;
  overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  font-size:.6rem!important;line-height:1!important;padding:.36rem .48rem!important;
}
.mg-card-availability{display:none!important}
.js-product-card h3{
  min-height:2.25rem!important;
  margin:0!important;
  font-size:.9rem!important;
  line-height:1.14rem!important;
  letter-spacing:-.035em!important;
}
.js-product-card .mt-2{margin-top:.5rem!important}
.js-product-card .text-lg.font-black,
.js-product-card .sm\:text-xl{
  font-size:1.28rem!important;line-height:1.1!important;color:var(--mg5-blue)!important;letter-spacing:-.04em!important;
}
.js-product-card .mg-price-box{border:0!important;background:transparent!important;padding:0!important}
.js-rating{margin-top:.55rem!important;font-size:.66rem!important;background:#fff!important;border:1px solid var(--mg5-border)!important}

/* Na vitrine, tamanho aparece pequeno e cor fica só na página do produto */
.js-product-card .mt-3.space-y-3{
  margin-top:.65rem!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  display:block!important;
}
.js-product-card .mg-list-color-row{display:none!important}
.js-product-card .mg-list-size-row,
.js-product-card .mt-3.space-y-3 > div:not(.mg-list-color-row){
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.js-product-card .mg-list-size-row p,
.js-product-card .mt-3.space-y-3 p{
  margin:0 0 .35rem!important;
  font-size:.62rem!important;
  letter-spacing:.07em!important;
}
.js-product-card .mg-size-label{
  min-width:1.9rem!important;
  min-height:1.85rem!important;
  padding:.35rem .48rem!important;
  font-size:.64rem!important;
  border-radius:999px!important;
}
.js-product-card p.rounded-xl{
  border-radius:.85rem!important;
  padding:.55rem .65rem!important;
  font-size:.7rem!important;
}

/* A listagem tem 1 ação principal: abrir produto */
.js-product-card .mg-card-actions{
  display:block!important;
  margin-top:auto!important;
  padding:.65rem .72rem .72rem!important;
  border-top:1px solid rgba(0,87,255,.08)!important;
}
.js-product-card .mg-card-actions .js-add-cart{display:none!important}
.js-product-card .mg-card-actions .mg-detail-btn{
  width:100%!important;
  min-height:2.55rem!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:.9rem!important;
  font-size:.76rem!important;
  font-weight:900!important;
  color:#fff!important;
  background:var(--mg5-blue)!important;
  border:1px solid var(--mg5-blue)!important;
}

/* Mobile card ainda mais compacto */
@media (max-width:640px){
  .mg-store{padding-top:4.65rem!important}
  .js-products-grid,#mgUnifiedGrid{gap:.62rem!important}
  .js-product-card{border-radius:1rem!important}
  .js-product-card > .flex.flex-1.flex-col{padding:.6rem!important}
  .js-product-card h3{font-size:.78rem!important;line-height:1.02rem!important;min-height:2rem!important}
  .mg-card-category{font-size:.5rem!important;padding:.32rem .42rem!important}
  .js-product-card .text-lg.font-black,.js-product-card .sm\:text-xl{font-size:1.08rem!important}
  .js-rating{font-size:.55rem!important}
  .js-product-card .mg-size-label{min-width:1.65rem!important;min-height:1.65rem!important;font-size:.55rem!important;padding:.25rem .36rem!important}
  .js-product-card .mg-card-actions{padding:.52rem!important}
  .js-product-card .mg-card-actions .mg-detail-btn{min-height:2.25rem!important;font-size:.65rem!important}
}

/* ===== Home: cards menores e com função clara ===== */
.mg-products-panel{border-radius:1.55rem!important;padding:1.2rem!important}
.mg-products-heading{
  font-size:clamp(1.75rem,4vw,3rem)!important;
  line-height:1!important;
  letter-spacing:-.035em!important;
  word-spacing:.16em!important;
  white-space:normal!important;
}
#produtosCarrossel{gap:.85rem!important;padding-bottom:.8rem!important}
#produtosCarrossel .produto-card{
  width:clamp(205px,21vw,250px)!important;
  min-height:0!important;
  height:auto!important;
  border-radius:1.15rem!important;
  display:flex!important;
  flex-direction:column!important;
  box-shadow:var(--mg5-shadow)!important;
  border:1px solid var(--mg5-border)!important;
}
#produtosCarrossel .produto-card > .relative:first-child{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:4/5!important;
  background:linear-gradient(135deg,#f8fbff,#eaf2ff)!important;
  overflow:hidden!important;
}
#produtosCarrossel .produto-img{
  width:100%!important;height:100%!important;object-fit:contain!important;padding:7px!important;
  opacity:1!important;visibility:visible!important;
}
#produtosCarrossel .produto-card .p-4,
#produtosCarrossel .produto-card .p-5{padding:.8rem!important}
#produtosCarrossel .produto-nome{font-size:.9rem!important;line-height:1.15rem!important;min-height:2.3rem!important;margin-bottom:.4rem!important}
#produtosCarrossel .produto-price-box{font-size:1.35rem!important;line-height:1.05!important;margin-bottom:.55rem!important;color:var(--mg5-blue)!important}
#produtosCarrossel .opcoes[data-type="cor"],
#produtosCarrossel .mg-home-color-row{display:none!important}
#produtosCarrossel .btn-comprar{display:none!important}
#produtosCarrossel a[aria-label*="Ver detalhes"]{
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:.9rem!important;
  min-height:2.45rem!important;
  background:var(--mg5-blue)!important;
  color:#fff!important;
  border:1px solid var(--mg5-blue)!important;
  font-weight:900!important;
}
@media (max-width:640px){
  .mg-products-panel{padding:1rem!important}
  #produtosCarrossel .produto-card{width:58vw!important;max-width:235px!important}
  #produtosCarrossel .produto-nome{font-size:.84rem!important}
  #produtosCarrossel .produto-price-box{font-size:1.18rem!important}
}

/* ===== Mobile bottom nav ===== */
@media (max-width:900px){
  #carrinhoFlutuante,.mg-floating-cart{display:none!important;visibility:hidden!important;pointer-events:none!important}
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))!important}
}
.mg-client-mobile-bar{
  left:.65rem!important;right:.65rem!important;
  bottom:calc(.55rem + env(safe-area-inset-bottom,0px))!important;
  z-index:2147483000!important;
  height:4.15rem!important;
  display:none;
  grid-template-columns:repeat(4,1fr)!important;
  align-items:center!important;
  border-radius:1.35rem!important;
  border:1px solid rgba(0,87,255,.14)!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 18px 42px rgba(15,23,42,.16)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  overflow:hidden!important;
}
@media (max-width:900px){.mg-client-mobile-bar{display:grid!important}}
.mg-client-mobile-bar a{
  min-width:0!important;height:100%!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  gap:.18rem!important;color:#334155!important;text-decoration:none!important;font-weight:900!important;font-size:.66rem!important;
}
.mg-client-mobile-bar a[aria-current="page"],.mg-client-mobile-bar a.is-active{color:var(--mg5-blue)!important}
.mg-client-mobile-bar .mg-nav-icon{
  width:1.65rem!important;height:1.65rem!important;display:grid!important;place-items:center!important;
  border-radius:.75rem!important;background:#f1f6ff!important;color:currentColor!important;font-size:0!important;
}
.mg-client-mobile-bar a[aria-current="page"] .mg-nav-icon,
.mg-client-mobile-bar a.is-active .mg-nav-icon{
  background:var(--mg5-blue)!important;color:#fff!important;box-shadow:0 8px 18px rgba(0,87,255,.25)!important;
}
.mg-client-mobile-bar svg{width:1.05rem!important;height:1.05rem!important;display:block!important}