/* ==========================================================================
   Loja Meneses — custom.css
   Overlay de estilos sobre o tema Hummingbird (PrestaShop 8.2).
   Não altera o core do tema: só adiciona regras. Carregado automaticamente
   pelo PrestaShop a partir de themes/<tema>/assets/css/custom.css
   Estilo-alvo: loja tipo "product-forward", grelhas de 4 colunas,
   cabeçalhos de secção em maiúsculas, cartões limpos. (ref. lotusvalley.pt)
   ========================================================================== */

:root{
  --lm-ink:        #14181c;
  --lm-ink-soft:   #5d666f;
  --lm-line:       #e7eaed;
  --lm-bg-soft:    #f7f8f9;
  --lm-accent:     #1d7a68;
  --lm-accent-dk:  #155a4d;
  --lm-radius:     12px;
}

/* --------------------------------------------------------------------------
   1. Faixa promocional no topo (inserida em _partials/header.tpl)
   -------------------------------------------------------------------------- */
.promo-strip{
  background: var(--lm-ink);
  color: #fff;
  font-size: .78rem;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.promo-strip__inner{
  display: flex;
  flex-wrap: wrap;
  gap: .6rem 1rem;
  align-items: center;
  justify-content: center;
  padding: .6rem 1rem;
  text-align: center;
}
.promo-strip__badge{
  background: var(--lm-accent);
  border-radius: 999px;
  padding: .16rem .6rem;
  font-size: .68rem;
  font-weight: 800;
}
.promo-strip__text{ opacity: .95; }

/* --------------------------------------------------------------------------
   2. Largura de contentor e respiro geral
   -------------------------------------------------------------------------- */
.page-home .container{ max-width: 1260px; }
.page-home .wrapper__content{ padding-top: .35rem; }

/* --------------------------------------------------------------------------
   3. Hero / slider
   -------------------------------------------------------------------------- */
#home-slider{ margin: .6rem 0 0; }
#home-slider .carousel,
#home-slider .carousel-inner{ border-radius: var(--lm-radius); }
#home-slider .carousel-content{
  position: relative;
  overflow: hidden;
  border-radius: var(--lm-radius);
  margin: 0;
}
#home-slider .carousel-content img{
  width: 100%;
  height: auto;
  display: block;
}
/* véu escuro à esquerda para o texto ficar legível sobre a imagem */
#home-slider .carousel-content::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,
              rgba(6,10,12,.78) 0%,
              rgba(6,10,12,.52) 34%,
              rgba(6,10,12,.06) 66%,
              rgba(6,10,12,0)   100%);
  pointer-events: none;
}
#home-slider .carousel-caption{
  left: 11%;
  right: auto;
  bottom: auto;
  top: 50%;
  transform: translateY(-50%);
  text-align: left;
  max-width: 46%;
  z-index: 2;
  color: #fff;
}
#home-slider .carousel-caption .display-1{
  color: #fff;
  text-shadow: 0 2px 18px rgba(0,0,0,.35);
}
#home-slider .caption-description,
#home-slider .caption-description p{
  color: rgba(255,255,255,.93);
}
#home-slider .carousel-control-prev,
#home-slider .carousel-control-next{ opacity: .75; }
#home-slider .carousel-control-prev-icon,
#home-slider .carousel-control-next-icon{ filter: drop-shadow(0 1px 6px rgba(0,0,0,.55)); }
#home-slider .carousel-indicators [data-bs-target]{ background-color: #fff; }

@media (max-width: 767.98px){
  #home-slider .carousel-caption{ left: 6%; max-width: 82%; }
  #home-slider .carousel-caption .display-1{ font-size: 1.35rem; }
  #home-slider .carousel-content::after{
    background: linear-gradient(180deg, rgba(6,10,12,.45) 0%, rgba(6,10,12,.78) 100%);
  }
}
#home-slider .carousel-caption .display-1{
  font-size: clamp(1.7rem, 3.1vw, 3rem);
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: .01em;
  margin: 0 0 .7rem;
}
#home-slider .caption-description{
  font-size: clamp(.9rem, 1.1vw, 1.08rem);
  opacity: .95;
}
#home-slider .caption-description p{ margin-bottom: 1.1rem; }
#home-slider .carousel-control-prev,
#home-slider .carousel-control-next{ opacity: .55; }

/* botão de chamada à ação dentro do hero */
.btn-promo{
  display: inline-block;
  background: #fff;
  color: var(--lm-ink) !important;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .7rem 1.35rem;
  border-radius: 999px;
  text-decoration: none;
  transition: background .18s ease, color .18s ease;
}
.btn-promo:hover{
  background: var(--lm-accent);
  color: #fff !important;
}

/* --------------------------------------------------------------------------
   4. Cabeçalhos de secção ("EM DESTAQUE", "NOVIDADES", ...)
   -------------------------------------------------------------------------- */
.section-title{
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--lm-ink);
  text-align: center;
  margin: 2.6rem 0 1.5rem;
}
.section-title::after{
  content: "";
  display: block;
  width: 46px;
  height: 3px;
  margin: .75rem auto 0;
  border-radius: 2px;
  background: var(--lm-accent);
}

/* --------------------------------------------------------------------------
   5. Cartões de produto
   -------------------------------------------------------------------------- */
.page-home .products.row{ --bs-gutter-x: 1.3rem; --bs-gutter-y: 1.3rem; }

.product-miniature .card{
  height: 100%;
  background: #fff;
  border: 1px solid var(--lm-line);
  border-radius: var(--lm-radius);
  overflow: hidden;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.product-miniature .card:hover{
  border-color: #d8dde1;
  box-shadow: 0 16px 34px rgba(20,24,28,.10);
  transform: translateY(-3px);
}
.product-miniature__image-container{
  background: var(--lm-bg-soft);
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .85rem;
}
.product-miniature__image{
  object-fit: contain;
  max-width: 100%;
  max-height: 100%;
}
.product-miniature__infos{ padding: .95rem 1rem 1.15rem; }
.product-miniature__title,
.product-miniature__title a{
  font-size: .95rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--lm-ink);
  text-decoration: none;
}
.product-miniature__title:hover a{ color: var(--lm-accent); }
.product-miniature__title{ margin-bottom: .4rem; }
.product-miniature__prices{ font-weight: 800; color: var(--lm-ink); }
.product-miniature__price{ font-size: 1.06rem; }
.product-miniature__regular-price{ font-size: .84rem; color: var(--lm-ink-soft); }
.product-miniature__discount-price{ color: var(--lm-accent); }
.product-miniature__variants{ font-size: .78rem; color: var(--lm-ink-soft); }

.product-miniature .btn-primary{
  background: var(--lm-ink);
  border-color: var(--lm-ink);
  border-radius: 9px;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: .6rem 1rem;
}
.product-miniature .btn-primary:hover{
  background: var(--lm-accent);
  border-color: var(--lm-accent);
}
.product-miniature__quickview_button{
  font-size: .76rem;
  color: var(--lm-ink-soft);
}
.featured-products-footer .btn,
.new-products-footer .btn{
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  border: 1px solid var(--lm-ink);
  color: var(--lm-ink);
  background: transparent;
}
.featured-products-footer .btn:hover,
.new-products-footer .btn:hover{
  background: var(--lm-ink);
  color: #fff;
}

/* --------------------------------------------------------------------------
   6. Bloco de texto / apresentação da loja
   -------------------------------------------------------------------------- */
#custom-text{ padding: .5rem 0 .25rem; }
#custom-text h2{
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: .01em;
  margin-bottom: .55rem;
}
#custom-text p{
  color: var(--lm-ink-soft);
  max-width: 78ch;
}
#custom-text strong.dark{ color: var(--lm-ink); }

/* --------------------------------------------------------------------------
   7. Faixa de garantias (blockreassurance, hook displayFooterBefore)
   Markup real: .blockreassurance > .row > .col-* > .block-icon + .block-title + p
   -------------------------------------------------------------------------- */
.blockreassurance{
  border-top: 1px solid var(--lm-line);
  margin-top: 2.6rem;
  padding: 2rem 0 1.6rem;
  text-align: center;
}
.blockreassurance .row{
  justify-content: center;
  row-gap: 1.6rem;
}
.blockreassurance .block-icon{
  display: flex;
  justify-content: center;
  margin-bottom: .65rem;
}
.blockreassurance .block-icon img{
  width: 34px;
  height: 34px;
  object-fit: contain;
  opacity: .92;
}
.blockreassurance .block-title{
  font-size: .82rem !important;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
  margin-bottom: .3rem;
}
.blockreassurance p{
  font-size: .85rem;
  line-height: 1.45;
  color: var(--lm-ink-soft) !important;
  max-width: 34ch;
  margin: 0 auto;
}

/* ícones inline gerados pelo JS do módulo (substituem o <img class="svg">) */
.blockreassurance .block-icon svg{
  width: 34px;
  height: 34px;
  display: block;
}
.blockreassurance .block-icon img.svg{
  width: 34px;
  height: 34px;
}

/* o banner de demonstração do módulo ps_banner não entra no layout */
.banner{ display: none !important; }