_Importante em caso de atualizações do tema Astra

AVISO AO ADMINISTRADOR DO SITE

Todas as vezes que o tema principal do site (ASTRA) for atualizado, as classes CSS abaixo serão apagadas.

Esta página é para salvar esse CSS para recolocar em Aparência -> Personalizar.

O código que coloca o botão do WhatsApp na página está no plugin WPCode. Acessar o WPCode pelo menu lateral do WP – não pela página de plugin:

WPCode -> Insert Headers and Footers

.whatsapp-float {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 30px;
  right: 30px;
  background-color: #25d366;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 2px 2px 8px rgba(0,0,0,0.3);
  z-index: 9999;
  transition: transform 0.2s;
}
.whatsapp-float:hover {
  transform: scale(1.1);
}
.whatsapp-float svg {
  width: 34px;
  height: 34px;
  fill: white;
}

/* ========================================
   ZOOM NO HOVER - CATEGORIAS E PRODUTOS
   ======================================== */

/* Container das imagens - evita overflow */
.woocommerce ul.products li.product a img,
.woocommerce .product-category a img {
    transition: transform 0.4s ease, opacity 0.3s ease;
    transform: scale(1);
    display: block;
    width: 100%;
}

/* Efeito de zoom ao passar o mouse */
.woocommerce ul.products li.product a:hover img,
.woocommerce .product-category a:hover img {
    transform: scale(1.2); /* 10% maior */
    opacity: 0.95; /* leve transparência pra dar profundidade */
}

/* Garante que a imagem não "vaze" do container */
.woocommerce ul.products li.product a,
.woocommerce .product-category a {
    overflow: hidden;
    display: block;
}

/* Opcional: arredonda cantos das imagens */
.woocommerce ul.products li.product a img,
.woocommerce .product-category a img {
    border-radius: 8px;
}

/* Cards dos produtos */
.woocommerce ul.products li.product {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* Imagens dos produtos */
.woocommerce ul.products li.product img {
    border-radius: 12px 12px 0 0;
}

/* Botão "Adicionar ao carrinho" e "Ver opções" */
.woocommerce ul.products li.product .button {
    padding: 10px 20px !important;
    font-size: 14px !important;
    background: #F4A460 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

.woocommerce ul.products li.product .button:hover {
    background: #4A2010 !important;
    transform: translateY(-2px);
}