/**
 * ARTISTARIA - Product Page Styles
 * Versão: 24.2.0 (VERSÃO APROVADA - DESCRIÇÃO CENTRALIZADA)
 * 
 * CSS completo para páginas de produto WooCommerce
 */

/* ========================================
   🚨 CORREÇÃO GLOBAL MOBILE - PREVENIR OVERFLOW
   ======================================== */

/**
 * CRÍTICO: Garantir que NADA ultrapasse a largura da tela
 * 
 * ❌ NÃO USAR overflow-x: hidden - QUEBRA POSITION STICKY!
 * ✅ USAR max-width + box-sizing
 */
html,
body {
  max-width: 100vw !important;
  box-sizing: border-box !important;
}

.single-product,
.single-product #page,
.single-product .site,
.single-product .site-content,
.single-product .woocommerce,
.single-product .content-area,
.single-product main,
.single-product article {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/**
 * 🔥 MOBILE ESPECÍFICO: Forçar APENAS containers de conteúdo
 * a respeitarem 100% da largura
 */
@media (max-width: 767px) {
  /* Container principal */
  .single-product .product-page {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  
  /* Grid layout */
  .single-product .product-layout {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
  
  /* Containers da galeria e summary */
  .single-product .product-gallery-sticky,
  .single-product .product-summary,
  .single-product .woocommerce-product-gallery,
  .single-product .summary {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  
  /* Imagens */
  .single-product .woocommerce-product-gallery img,
  .single-product .woocommerce-product-gallery__image img {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
  }
  
  /* Plugin React */
  .single-product #artistaria-configurador-root {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* ========================================
   🎯 CONTAINER PRINCIPAL
   ======================================== */

/**
 * Container principal da página de produto
 * - Fundo bege/creme (#f5f3ed)
 * - Padding generoso
 * - Centralizado
 * 
 * ✅ CORREÇÃO MOBILE: Padding reduzido e max-width: 100%
 * ❌ NÃO USAR overflow-x: hidden - QUEBRA POSITION STICKY!
 */
.single-product .product-page {
  background-color: #f5f3ed !important;
  padding: 20px 16px !important; /* 🔥 REDUZIDO: 40px 24px → 20px 16px */
  min-height: 100vh !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
}

@media (min-width: 768px) {
  .single-product .product-page {
    padding: 60px 48px !important;
  }
}

@media (min-width: 1200px) {
  .single-product .product-page {
    padding: 60px 64px !important;
  }
}

/* ========================================
   📐 LAYOUT DO PRODUTO (GRID 2 COLUNAS)
   ======================================== */

/**
 * Grid 2 colunas: Galeria (esquerda) + Configurador (direita)
 * 
 * - Mobile: 1 coluna (stack vertical)
 * - Desktop: 2 colunas (50% / 50%)
 */
.single-product .product-layout {
  max-width: 1200px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 40px !important;
}

@media (min-width: 1024px) {
  .single-product .product-layout {
    grid-template-columns: 1fr 1fr !important;
    gap: 60px !important;
  }
}

/**
 * 🔥 CRÍTICO: Container wrapper da galeria (com classe .product-gallery-sticky)
 * 
 * Este é o container EXTERNO que aplica o sticky
 * Dentro dele está o .woocommerce-product-gallery
 */
.single-product .product-gallery-sticky {
  position: sticky !important;
  top: 100px !important; /* Espaço do header */
  align-self: start !important;
  width: 100% !important;
  z-index: 10 !important;
}

@media (max-width: 1023px) {
  .single-product .product-gallery-sticky {
    position: static !important; /* Remove sticky em mobile */
  }
}

/**
 * 🔥 CRÍTICO: Container summary (configurador)
 * NÃO é sticky - rola normalmente
 */
.single-product .product-summary {
  width: 100% !important;
  position: relative !important;
}

/* ========================================
   🖼️ GALERIA DE IMAGENS (WOOCOMMERCE FLEXSLIDER)
   ======================================== */

/**
 * CRÍTICO: Container da galeria WooCommerce
 * 
 * - Posicionamento: Grid esquerdo
 * - Fundo: Branco
 * - Border-radius: 12px
 * - Box-shadow: Sutil
 * - STICKY: Gruda no topo ao rolar
 * 
 * ✅ CORREÇÃO MOBILE: Padding reduzido e box-sizing
 */
.single-product .woocommerce-product-gallery {
  background: white !important;
  border-radius: 12px !important;
  padding: 16px !important; /* 🔥 REDUZIDO: 24px → 16px em mobile */
  box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
  position: sticky !important;
  top: 24px !important;
  align-self: start !important;
  width: 100% !important;
  max-width: 100% !important; /* 🔥 NOVO: Limita largura */
  box-sizing: border-box !important; /* 🔥 NOVO: Inclui padding */
  overflow: hidden !important; /* 🔥 NOVO: Previne estouro */
}

@media (min-width: 768px) {
  .single-product .woocommerce-product-gallery {
    padding: 24px !important;
  }
}

/**
 * CRÍTICO: FlexSlider viewport
 * 
 * Contém APENAS 1 imagem visível por vez
 */
.single-product .woocommerce-product-gallery .flex-viewport {
  max-height: 600px !important;
  overflow: hidden !important;
  width: 100% !important; /* FORÇA 100% DA LARGURA */
}

/**
 * CRÍTICO: Container das imagens do slider
 * 
 * - display: flex (para transição horizontal)
 * - transition: transform (animação suave)
 */
.single-product .woocommerce-product-gallery .flex-viewport .woocommerce-product-gallery__wrapper {
  display: flex !important;
  transition: transform 0.3s ease !important;
  width: 100% !important; /* FORÇA 100% DA LARGURA */
}

/**
 * CRÍTICO: Cada imagem do slider
 * 
 * - flex-shrink: 0 (não encolhe)
 * - width: 100% (ocupa toda a largura do viewport)
 */
.single-product .woocommerce-product-gallery .flex-viewport .woocommerce-product-gallery__image {
  flex-shrink: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 100% !important; /* GARANTE LARGURA MÍNIMA 100% */
}

/**
 * Imagem principal (dentro do link)
 */
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a {
  display: block !important;
  width: 100% !important; /* LINK OCUPA 100% */
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 8px !important;
  object-fit: contain !important; /* CONTAIN AO INVÉS DE COVER */
  max-height: 550px !important;
  margin: 0 auto !important; /* CENTRALIZA SE MENOR */
}

/**
 * CRÍTICO: Miniaturas (thumbnails)
 * 
 * - Posicionadas ABAIXO da imagem principal
 * - Display: flex horizontal
 * - Gap: 12px
 */
.single-product .woocommerce-product-gallery .flex-control-thumbs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 16px !important;
  padding: 0 !important;
  list-style: none !important;
}

/**
 * Cada miniatura
 */
.single-product .woocommerce-product-gallery .flex-control-thumbs li {
  flex: 0 0 auto !important;
  width: 64px !important;
  height: 64px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/**
 * Imagem da miniatura
 */
.single-product .woocommerce-product-gallery .flex-control-thumbs li img {
  width: 64px !important;
  height: 64px !important;
  object-fit: cover !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  border: 2px solid transparent !important;
  transition: all 0.2s ease !important;
}

/**
 * Miniatura ativa (selecionada)
 */
.single-product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active,
.single-product .woocommerce-product-gallery .flex-control-thumbs li img:hover {
  border-color: #ff9800 !important;
  opacity: 1 !important;
}

/**
 * Miniaturas não ativas (opacidade reduzida)
 */
.single-product .woocommerce-product-gallery .flex-control-thumbs li img:not(.flex-active) {
  opacity: 0.6 !important;
}

/* ========================================
   ⚙️ CONFIGURADOR (COLUNA DIREITA)
   ======================================== */

/**
 * Container do configurador React
 * 
 * - Posicionamento: Grid direito
 * - Fundo: Branco
 * - Border-radius: 12px
 * - Box-shadow: Sutil
 * - NÃO STICKY: Rola normalmente
 * 
 * ✅ CORREÇÃO MOBILE: Padding reduzido e box-sizing
 */
.single-product .summary {
  background: white !important;
  border-radius: 12px !important;
  padding: 16px !important; /* 🔥 REDUZIDO: 24px → 16px em mobile */
  box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
  max-width: 100% !important; /* 🔥 NOVO: Limita largura */
  box-sizing: border-box !important; /* 🔥 NOVO: Inclui padding */
  overflow: hidden !important; /* 🔥 NOVO: Previne estouro */
  overflow-y: visible !important; /* 🔥 PERMITE scroll vertical */
}

@media (min-width: 768px) {
  .single-product .summary {
    padding: 24px !important;
  }
}

/**
 * Título do produto
 * CRÍTICO: Seletores múltiplos para garantir aplicação
 */
.single-product .summary .product_title,
.single-product .product_title,
.woocommerce.single-product .product_title,
body.single-product .product_title,
.product_title.entry-title {
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  margin-top: 20px !important;
  margin-bottom: 16px !important;
  padding-top: 20px !important;
  color: #2b2b2b !important;
  line-height: 1.3 !important;
}

/**
 * Descrição curta
 */
.single-product .summary .woocommerce-product-details__short-description {
  margin-bottom: 24px !important;
  color: #666 !important;
  line-height: 1.6 !important;
}

/* ========================================
   📝 DESCRIÇÃO DO PRODUTO
   ======================================== */

/**
 * CRÍTICO: Alinhar descrição com o layout do produto
 */
.single-product .woocommerce-tabs {
  max-width: 1200px !important;
  margin: 80px auto 0 auto !important;
  padding: 0 24px !important;
}

@media (min-width: 1200px) {
  .single-product .woocommerce-tabs {
    padding: 0 64px !important;
  }
}

/**
 * 🔥 OCULTAR TABS (abas) e TÍTULO "Descrição"
 * ✅ Mantém o conteúdo da descrição visível
 */
.single-product .woocommerce-tabs ul.tabs {
  display: none !important;
}

.single-product .woocommerce-tabs .woocommerce-Tabs-panel h2 {
  display: none !important;
}

/**
 * Garantir que o conteúdo interno não estoure
 */
.single-product .woocommerce-tabs .woocommerce-Tabs-panel {
  max-width: 100% !important;
}

/**
 * Melhorar hierarquia visual do conteúdo
 */
.single-product .woocommerce-tabs p {
  line-height: 1.6 !important;
}

/* ========================================
   🛍️ PRODUTOS RELACIONADOS (4 COLUNAS)
   ======================================== */

/**
 * CRÍTICO: Container dos produtos relacionados
 * 
 * ✅ CORREÇÕES APLICADAS:
 * 1. max-width: 1200px (ALINHADO com galeria/descrição)
 * 2. margin: 80px auto (espaçamento vertical consistente)
 * 3. padding: 0 24px (ALINHADO com resto da página)
 * 4. border-top: 1px solid #ddd (separação visual clara)
 * 5. padding-top: 48px (respiro acima do título)
 */
.single-product .related.products,
.single-product .upsells.products {
  max-width: 1200px !important;
  margin: 80px auto 80px auto !important; /* top: 80px / bottom: 80px */
  padding: 0 24px !important;
  width: 100% !important;
  clear: both !important;
  float: none !important;
  border-top: 1px solid #ddd !important;
  padding-top: 48px !important;
}

@media (min-width: 1200px) {
  .single-product .related.products,
  .single-product .upsells.products {
    padding: 48px 64px 0 64px !important; /* Mantém border-top com padding-top */
  }
}

/**
 * Título dos produtos relacionados
 */
.single-product .related.products h2,
.single-product .upsells.products h2 {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: #2b2b2b !important;
  margin-bottom: 32px !important;
  text-align: left !important;
}

/**
 * CRÍTICO: Grid de produtos relacionados (4 colunas)
 * 
 * - Mobile: 2 colunas
 * - Tablet: 3 colunas
 * - Desktop: 4 colunas
 * - Gap: 24px (CONSISTENTE com resto do site)
 */
.single-product .related.products ul.products,
.single-product .upsells.products ul.products {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/**
 * CRÍTICO: REMOVER ::BEFORE/AFTER DO UL.PRODUCTS (GRID CONTAINER)
 * 
 * ✅ Alguns temas adicionam ::before no próprio <ul>
 * ✅ Isso cria "ghost elements" no grid
 */
.single-product .related.products ul.products::before,
.single-product .related.products ul.products::after,
.single-product .upsells.products ul.products::before,
.single-product .upsells.products ul.products::after {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (min-width: 640px) {
  .single-product .related.products ul.products,
  .single-product .upsells.products ul.products {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (min-width: 1024px) {
  .single-product .related.products ul.products,
  .single-product .upsells.products ul.products {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 24px !important;
  }
}

/**
 * CRÍTICO: Cada produto relacionado
 * 
 * - Aspect-ratio: 1/1 (quadrado perfeito)
 * - Fundo: Branco
 * - Border-radius: 8px
 * - Box-shadow: Sutil
 * 
 * ✅ CORREÇÃO FLEX: align-items: center para impedir stretch
 */
.single-product .related.products ul.products li.product,
.single-product .upsells.products ul.products li.product {
  background: white !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important; /* 🔥 IMPEDE STRETCH DOS FILHOS */
  width: 100% !important;
  height: auto !important;
  min-height: unset !important; /* RESET MIN-HEIGHT */
  position: relative !important; /* Para badge absoluto APENAS */
}

/* CRÍTICO: REMOVER ::BEFORE DOS CARDS */
.single-product .related.products ul.products li.product::before,
.single-product .related.products ul.products li.product::after,
.single-product .upsells.products ul.products li.product::before,
.single-product .upsells.products ul.products li.product::after {
  display: none !important;
  content: none !important;
}

/**
 * CRÍTICO: REMOVER ::BEFORE ESPECÍFICO DA COLUNA 4
 * 
 * ✅ Storefront e outros temas WooCommerce adicionam ::before
 * ✅ Aplicar em TODOS os nth-child possíveis
 */
.single-product .related.products ul.products li.product:nth-child(4)::before,
.single-product .related.products ul.products li.product:nth-child(4)::after,
.single-product .related.products ul.products li:nth-child(4)::before,
.single-product .related.products ul.products li:nth-child(4)::after,
.single-product .related.products ul.products li:nth-child(4n)::before,
.single-product .related.products ul.products li:nth-child(4n)::after,
.single-product .upsells.products ul.products li.product:nth-child(4)::before,
.single-product .upsells.products ul.products li.product:nth-child(4)::after,
.single-product .upsells.products ul.products li:nth-child(4)::before,
.single-product .upsells.products ul.products li:nth-child(4)::after,
.single-product .upsells.products ul.products li:nth-child(4n)::before,
.single-product .upsells.products ul.products li:nth-child(4n)::after {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
}

/**
 * CRÍTICO: REMOVER ::BEFORE/AFTER DE QUALQUER ELEMENTO FILHO
 * 
 * ✅ REMOVE TAMBÉM A BADGE "PERSONALIZÁVEL"
 */
.single-product .related.products ul.products li.product *::before,
.single-product .related.products ul.products li.product *::after,
.single-product .upsells.products ul.products li.product *::before,
.single-product .upsells.products ul.products li.product *::after,
.single-product .related.products ul.products li.product a::after,
.single-product .upsells.products ul.products li.product a::after,
.single-product .related.products ul.products li.product .woocommerce-loop-product__link::after,
.single-product .upsells.products ul.products li.product .woocommerce-loop-product__link::after {
  display: none !important;
  content: none !important;
}

.single-product .related.products ul.products li.product:hover,
.single-product .upsells.products ul.products li.product:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

/**
 * CRÍTICO: REMOVER POSITION ABSOLUTE DO BOTÃO E TÍTULO
 * 
 * ✅ Restaura fluxo normal do card
 * ✅ Elimina sobreposição
 */
.single-product .related.products ul.products li.product .button,
.single-product .related.products ul.products li.product .add_to_cart_button,
.single-product .related.products ul.products li.product .woocommerce-loop-product__title,
.single-product .related.products ul.products li.product h2,
.single-product .related.products ul.products li.product .price,
.single-product .upsells.products ul.products li.product .button,
.single-product .upsells.products ul.products li.product .add_to_cart_button,
.single-product .upsells.products ul.products li.product .woocommerce-loop-product__title,
.single-product .upsells.products ul.products li.product h2,
.single-product .upsells.products ul.products li.product .price {
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
}

/**
 * CRÍTICO: Container da imagem (aspect-ratio 1:1)
 * 
 * ✅ CORREÇÃO: height: auto + min-height: 220px + overflow: visible
 * ✅ Isso permite que o título apareça ABAIXO da imagem
 */
.single-product .related.products ul.products li.product a,
.single-product .upsells.products ul.products li.product a,
.single-product .related.products ul.products li.product .woocommerce-loop-product__link,
.single-product .upsells.products ul.products li.product .woocommerce-loop-product__link {
  display: block !important;
  width: 100% !important;
  height: auto !important; /* 🔥 MUDADO: auto para permitir expansão */
  min-height: 220px !important; /* 🔥 ADICIONADO: altura mínima da imagem */
  overflow: visible !important; /* 🔥 MUDADO: visible para mostrar título */
  position: relative !important;
  flex-shrink: 0 !important;
  border-radius: 12px 12px 0 0 !important;
}

/**
 * CRÍTICO: Imagem do produto relacionado
 * 
 * - width: 100%
 * - height: 220px (FIXA)
 * - object-fit: cover (preenche todo o espaço)
 */
.single-product .related.products ul.products li.product a img,
.single-product .upsells.products ul.products li.product a img,
.single-product .related.products ul.products li.product img,
.single-product .upsells.products ul.products li.product img {
  width: 100% !important;
  height: 220px !important; /* ALTURA FIXA */
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.3s ease !important;
  border-radius: 12px 12px 0 0 !important;
  position: static !important; /* NÃO ABSOLUTO */
}

.single-product .related.products ul.products li.product:hover img,
.single-product .upsells.products ul.products li.product:hover img {
  transform: scale(1.05) !important;
}

/**
 * Título do produto relacionado
 * 
 * ✅ GARANTIR VISIBILIDADE E CENTRALIZAÇÃO
 * ✅ SELETORES MÚLTIPLOS PARA FORÇAR APARIÇÃO
 * 
 * CRÍTICO: O título está DENTRO do <a> junto com imagem e preço
 * Precisamos ser SUPER específicos para sobrescrever qualquer CSS do tema
 */
.single-product .related.products ul.products li.product h2,
.single-product .upsells.products ul.products li.product h2,
.single-product .related.products ul.products li.product .woocommerce-loop-product__title,
.single-product .upsells.products ul.products li.product .woocommerce-loop-product__title,
.single-product .related.products ul.products li.product h3,
.single-product .upsells.products ul.products li.product h3,
.single-product .related.products ul.products li.product .product-title,
.single-product .upsells.products ul.products li.product .product-title,
.single-product .related.products ul.products li.product a h2,
.single-product .upsells.products ul.products li.product a h2,
.single-product .related.products ul.products li.product a .woocommerce-loop-product__title,
.single-product .upsells.products ul.products li.product a .woocommerce-loop-product__title,
.single-product .related.products ul.products li.product .woocommerce-LoopProduct-link h2,
.single-product .upsells.products ul.products li.product .woocommerce-LoopProduct-link h2,
.single-product .related.products ul.products li.product .woocommerce-LoopProduct-link .woocommerce-loop-product__title,
.single-product .upsells.products ul.products li.product .woocommerce-LoopProduct-link .woocommerce-loop-product__title {
  display: block !important;
  padding: 16px 16px !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: #2b2b2b !important;
  margin: 0 !important;
  text-align: center !important;
  background: #fff !important;
  flex-shrink: 0 !important;
  line-height: 1.4 !important;
  min-height: 50px !important;
  opacity: 1 !important;
  visibility: visible !important;
  position: static !important;
  width: 100% !important;
  z-index: 10 !important;
  overflow: visible !important;
  max-height: none !important;
  clip-path: none !important;
  transform: none !important;
}

/**
 * BOTÃO "VER OPÇÕES" nos produtos relacionados
 * 
 * ✅ CORREÇÃO v6: SELETOR ULTRA-ESPECÍFICO + ALTURA FIXA FORÇADA
 */
.single-product .related.products .product .button,
.single-product .related.products .product .add_to_cart_button,
.single-product .upsells.products .product .button,
.single-product .upsells.products .product .add_to_cart_button,
.single-product .related.products .product a.button,
.single-product .upsells.products .product a.button,
.single-product .related.products ul.products li.product a.button,
.single-product .upsells.products ul.products li.product a.button,
.single-product .related.products ul.products li.product .button[href],
.single-product .upsells.products ul.products li.product .button[href] {
  width: auto !important;
  max-width: 150px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  border-radius: 8px !important;
  margin: 0 auto 8px auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  background: #ff9800 !important;
  color: white !important;
  text-align: center !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: background 0.2s ease !important;
  border: none !important;
  cursor: pointer !important;
  height: 38px !important; /* 🔥 ALTURA FIXA (não auto) */
  max-height: 38px !important;
  min-height: 38px !important;
  line-height: 1.2 !important; /* 🔥 REDUZIDO */
  align-self: center !important;
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  flex-basis: auto !important; /* 🔥 NOVO */
  overflow: hidden !important;
  box-sizing: border-box !important; /* 🔥 NOVO */
  vertical-align: middle !important; /* 🔥 NOVO */
}

.single-product .related.products .product .button:hover,
.single-product .upsells.products .product .button:hover,
.single-product .related.products .product .add_to_cart_button:hover,
.single-product .upsells.products .product .add_to_cart_button:hover {
  background: #e68900 !important;
}

/**
 * Centralizar botão (opcional)
 */
.single-product .related.products .product,
.single-product .upsells.products .product {
  text-align: center !important;
}

/* ========================================
   🚫 OCULTAR ELEMENTOS DESNECESSÁRIOS
   ======================================== */

/**
 * Ocultar preço, quantidade e botão "Adicionar ao carrinho"
 * CRÍTICO: display: none + height: 0 + margin: 0 para garantir zero espaço
 */
.single-product .price,
.single-product .quantity,
.single-product .single_add_to_cart_button,
.single-product .cart,
.single-product .related.products .price,
.single-product .upsells.products .price,
.single-product .related.products .added_to_cart,
.single-product .upsells.products .added_to_cart {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  line-height: 0 !important;
  font-size: 0 !important;
}

/**
 * CRÍTICO: Remover TODOS os espaços extras nos produtos relacionados
 * EXCETO: imagem (a), título (h2) e BOTÃO (.button, .add_to_cart_button)
 */
.single-product .related.products ul.products li.product > *:not(a):not(.woocommerce-loop-product__link):not(h2):not(.woocommerce-loop-product__title):not(.button):not(.add_to_cart_button),
.single-product .upsells.products ul.products li.product > *:not(a):not(.woocommerce-loop-product__link):not(h2):not(.woocommerce-loop-product__title):not(.button):not(.add_to_cart_button) {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/**
 * Ocultar breadcrumbs (migalhas de pão)
 */
.single-product .woocommerce-breadcrumb {
  display: none !important;
}

/**
 * Ocultar avaliações (ratings)
 */
.single-product .woocommerce-product-rating,
.single-product .star-rating {
  display: none !important;
}

/**
 * Ocultar SKU, categorias e tags
 */
.single-product .product_meta {
  display: none !important;
}