/* =====================================================================
   SHOW GLASS — LOJA · Grade "Ateliê" v1.2 (grid rígido de alto padrão)
   Cards com moldura de imagem 4:5, preço em coluna, botão ancorado no
   rodapé, hover com 2ª foto. Carregado nas páginas Woo junto do skin.css.
   ===================================================================== */

/* ---- Card: coluna flex, rodapé ancorado ---- */
.woocommerce ul.products li.product{
  display:flex; flex-direction:column;
  transition:box-shadow .28s ease, border-color .28s ease;
}
.woocommerce ul.products li.product:hover{
  border-color:rgba(198,160,83,.45) !important;
  box-shadow:0 16px 38px rgba(10,21,33,.10);
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{
  display:flex; flex-direction:column; flex:1 1 auto; position:relative;
}

/* ---- Moldura de imagem: proporção FIXA 4:5 (mata o desalinhamento) ---- */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > img,
.woocommerce ul.products li.product img.attachment-woocommerce_thumbnail{
  width:100% !important; aspect-ratio:4/5; height:auto; object-fit:cover; object-position:center;
  background:#F5F4F1; border-radius:2px; margin:0 0 14px !important; display:block;
}
/* 2ª foto no hover (injetada pelo plugin) */
.woocommerce ul.products li.product img.sgl-hover-img{
  position:absolute; top:0; left:0; right:0; z-index:1;
  opacity:0; transition:opacity .38s ease; pointer-events:none;
  margin:0 !important;
}
.woocommerce ul.products li.product:hover img.sgl-hover-img{ opacity:1; }

/* ---- Título: Inter, 2 linhas reservadas, sem "dança" ---- */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--sgl-ui,'Inter',sans-serif) !important;
  font-size:14.5px !important; font-weight:500 !important;
  color:var(--sgl-ink,#0A1521) !important; line-height:1.5 !important;
  letter-spacing:.01em; text-transform:none !important;
  min-height:calc(2 * 1.5 * 14.5px);
  padding:0 !important; margin:0 0 6px !important;
  transition:color .2s ease;
}
.woocommerce ul.products li.product:hover .woocommerce-loop-product__title{
  color:var(--sgl-goldd,#9C7A2E) !important;
}

/* ---- Rating: fora do grid (uniformidade > 1 avaliação solta) ---- */
.woocommerce ul.products li.product .star-rating{ display:none !important; }

/* ---- Bloco de preço: UMA coluna, tudo à esquerda ---- */
/* min-height nivela cards em que a pílula de economia quebra de linha */
.woocommerce ul.products li.product .sg-price-block{ text-align:left !important; margin:0; min-height:84px; }
.woocommerce ul.products li.product .sg-price-block .sg-price-regular del,
.woocommerce ul.products li.product .sg-price-block .sg-price-regular del .woocommerce-Price-amount{
  font-size:13px !important;
}
.woocommerce ul.products li.product .sg-price-block .sg-price-regular,
.woocommerce ul.products li.product .sg-price-block .sg-price-main,
.woocommerce ul.products li.product .sg-price-block .sg-price-card{
  justify-content:flex-start !important; text-align:left !important;
}
.woocommerce ul.products li.product .sg-price-block .sg-price-regular{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
/* pílula de economia: contorno discreto (não "grito" de varejão) */
.woocommerce ul.products li.product .sg-discount-badge{
  background:transparent !important; color:var(--sgl-goldd,#9C7A2E) !important;
  border:1px solid rgba(198,160,83,.5) !important; border-radius:999px !important;
  font-family:var(--sgl-ui,'Inter',sans-serif) !important;
  font-size:10.5px !important; font-weight:600 !important; letter-spacing:.06em !important;
  text-transform:uppercase; padding:2.5px 10px !important; box-shadow:none !important;
}
.woocommerce ul.products li.product .sg-installments{
  text-align:left !important; color:#8A93A0; margin-top:2px;
}

/* ---- Botão: flat fantasma que preenche no hover do CARD ---- */
.woocommerce ul.products li.product .button{
  margin-top:auto !important; width:100%; text-align:center;
  background:transparent !important; color:var(--sgl-goldd,#9C7A2E) !important;
  border:1px solid rgba(198,160,83,.55) !important; border-radius:4px !important;
  box-shadow:none !important; text-shadow:none !important;
  font-family:var(--sgl-ui,'Inter',sans-serif) !important;
  font-size:12px !important; font-weight:600 !important;
  letter-spacing:.08em !important; text-transform:uppercase;
  padding:11px 16px !important; transform:none !important;
  transition:background .22s ease, color .22s ease, border-color .22s ease;
}
.woocommerce ul.products li.product:hover .button{
  background:var(--sgl-grad,linear-gradient(135deg,#E7CE8C,#C6A053,#9C7A2E)) !important;
  color:#3A2C0E !important; border-color:transparent !important;
}
/* espaço entre o fim do link e o botão */
.woocommerce ul.products li.product .button{ margin-bottom:0; }
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{ margin-bottom:12px; }

/* ---- Badge onsale nativa fora (a pílula do bloco de preço cobre) ---- */
.woocommerce ul.products li.product .onsale{ display:none !important; }

/* ---- Paginação: sóbria ---- */
.woocommerce nav.woocommerce-pagination ul{ border:0; }
.woocommerce nav.woocommerce-pagination ul li{ border:0; margin:0 3px; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  font-family:var(--sgl-ui,'Inter',sans-serif); font-size:14px;
  color:var(--sgl-ink,#0A1521); border:1px solid rgba(10,21,33,.14);
  border-radius:3px; min-width:38px; line-height:36px; padding:0 8px;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover{
  background:var(--sgl-ink,#0A1521); color:#fff; border-color:var(--sgl-ink,#0A1521);
}

/* ---- Ordenação padrão do Woo (quando visível): discreta ---- */
.woocommerce .woocommerce-ordering select{
  font-family:var(--sgl-ui,'Inter',sans-serif); font-size:13px; color:#3F4A56;
  border:1px solid rgba(10,21,33,.16); border-radius:4px; padding:7px 10px; background:#fff;
}

/* ---- Filtro WBW: rótulos sem quebra feia (checkbox fixo + texto fluido) ---- */
.wpfMainWrapper li{ display:flex; align-items:flex-start; gap:7px; line-height:1.5; }
.wpfMainWrapper li input[type=checkbox], .wpfMainWrapper li input[type=radio]{ flex:0 0 auto; margin-top:3px; }
.wpfMainWrapper .wpfLiLabel{ display:inline; flex:1 1 auto; min-width:0; }
