/* =====================================================================
   SHOW GLASS — LOJA · Página de produto "Ateliê" v1.2
   Galeria com rail vertical, variações em chips, frete clean,
   chips de ambiente, façade de YouTube. Carregado só em is_product().
   ===================================================================== */

/* ===== "A diferença Show Glass" — bullets de consciência acima da compra ===== */
.sgl-bullets{margin:4px 0 20px;border:1px solid rgba(198,160,83,.35);border-radius:5px;padding:16px 20px 14px;background:rgba(198,160,83,.04)}
.sgl-bullets-t{display:block;font-family:Inter,'Segoe UI',sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#9C7A2E;font-weight:700;margin-bottom:9px}
.sgl-bullets ul{list-style:none !important;margin:0 !important;padding:0 !important}
.sgl-bullets li{position:relative;padding:5px 0 5px 24px !important;margin:0 !important;font-family:Inter,'Segoe UI',sans-serif;font-size:13px;line-height:1.5;color:rgba(10,21,33,.78);border-top:1px solid rgba(10,21,33,.06);text-align:left}
.sgl-bullets li:first-child{border-top:none}
.sgl-bullets li::before{content:"✓";position:absolute;left:2px;top:5px;color:#C6A053;font-weight:700;font-size:12px}
.sgl-bullets li b{color:#0A1521;font-weight:600}
@media (max-width:767px){ .sgl-bullets{padding:14px 16px 12px} .sgl-bullets li{font-size:12.5px} }

/* ================= GALERIA — rail de thumbs vertical ================= */
/* coluna da galeria STICKY (template Produto — Ateliê, container bf10002):
   ao rolar a coluna de compra, a imagem acompanha em vez de deixar vazio */
@media (min-width:1025px){
  .elementor-element.elementor-element-bf10002{
    position:sticky; top:96px;
    align-self:flex-start !important; height:fit-content; /* sem isto o stretch da linha impede o sticky de andar */
  }
}
/* badge de desconto nativa na galeria: a pílula do bloco de preço já comunica */
.woocommerce div.product .onsale{ display:none !important; }

.woocommerce div.product div.images.woocommerce-product-gallery{ position:relative; }
.woocommerce-product-gallery .flex-viewport{
  border-radius:2px; overflow:hidden; background:#F5F4F1;
}
.woocommerce-product-gallery img{ border-radius:2px; }

@media (min-width:1025px){
  .woocommerce div.product div.images.woocommerce-product-gallery{
    display:grid !important; grid-template-columns:72px minmax(0,1fr);
    gap:14px; align-items:start;
  }
  .woocommerce-product-gallery .flex-viewport{ grid-column:2; grid-row:1; }
  .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper{ grid-column:2; grid-row:1; }
  .woocommerce-product-gallery ol.flex-control-thumbs{
    grid-column:1; grid-row:1;
    display:flex; flex-direction:column; gap:10px; margin:0 !important; padding:0;
    max-height:640px; overflow-y:auto; scrollbar-width:none;
  }
  .woocommerce-product-gallery ol.flex-control-thumbs::-webkit-scrollbar{ display:none; }
  .woocommerce-product-gallery ol.flex-control-thumbs li{
    width:100% !important; float:none !important; margin:0; padding:0;
  }
}
@media (max-width:1024px){
  .woocommerce-product-gallery ol.flex-control-thumbs{
    display:flex; gap:8px; overflow-x:auto; padding:10px 0 2px; margin:0;
    scrollbar-width:none;
  }
  .woocommerce-product-gallery ol.flex-control-thumbs::-webkit-scrollbar{ display:none; }
  .woocommerce-product-gallery ol.flex-control-thumbs li{
    flex:0 0 64px; width:64px !important; float:none !important; margin:0;
  }
}
.woocommerce-product-gallery ol.flex-control-thumbs li img{
  border-radius:2px; border:1px solid rgba(10,21,33,.10);
  opacity:.55; cursor:pointer; transition:opacity .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.woocommerce-product-gallery ol.flex-control-thumbs li img:hover{ opacity:1; }
.woocommerce-product-gallery ol.flex-control-thumbs li img.flex-active{
  opacity:1; border-color:var(--sgl-goldd,#9C7A2E);
  box-shadow:0 0 0 1px var(--sgl-goldd,#9C7A2E);
}
/* lupa de zoom: sóbria, porcelana */
.woocommerce div.product div.images .woocommerce-product-gallery__trigger{
  background:rgba(245,244,241,.92) !important; border-radius:50%;
  box-shadow:0 2px 10px rgba(10,21,33,.14); top:14px; right:14px;
}
.woocommerce div.product div.images .woocommerce-product-gallery__trigger::before{
  border-color:var(--sgl-ink,#0A1521);
}
.woocommerce div.product div.images .woocommerce-product-gallery__trigger::after{
  background:var(--sgl-ink,#0A1521);
}

/* ================= CHIPS DE AMBIENTE (sob a galeria) ================= */
.sgl-amb-chips{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  margin:16px 0 0; font-family:var(--sgl-ui,'Inter',sans-serif);
}
.sgl-amb-chips .sgl-amb-label{
  font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:#8A93A0; margin-right:2px;
}
.sgl-amb-chips a{
  font-size:12.5px; font-weight:500; color:var(--sgl-goldd,#9C7A2E);
  border:1px solid rgba(198,160,83,.42); border-radius:999px;
  padding:5px 13px; text-decoration:none;
  transition:background .2s ease, border-color .2s ease;
}
.sgl-amb-chips a:hover{ background:rgba(198,160,83,.10); border-color:var(--sgl-gold,#C6A053); }

/* ================= VARIAÇÕES — de tabela crua a CHIPS ================= */
.woocommerce div.product form.cart table.variations,
.woocommerce div.product form.cart table.variations tbody,
.woocommerce div.product form.cart table.variations tr,
.woocommerce div.product form.cart table.variations th,
.woocommerce div.product form.cart table.variations td{
  display:block; width:100%; border:0 !important; padding:0; margin:0; background:transparent !important;
}
.woocommerce div.product form.cart table.variations{ margin:4px 0 2px; }
.woocommerce div.product form.cart table.variations th.label,
.woocommerce div.product form.cart table.variations td.label{
  font-family:var(--sgl-ui,'Inter',sans-serif) !important;
  font-size:11px !important; font-weight:600 !important;
  letter-spacing:.12em; text-transform:uppercase; color:#6E7682 !important;
  padding:14px 0 8px !important; line-height:1; text-align:left !important;
}
.woocommerce div.product form.cart table.variations td.value{ padding:0 !important; text-align:left !important; }

/* ---- Coluna de compra: TUDO alinhado à esquerda (hierarquia de leitura) ---- */
.woocommerce div.product .sg-price-block.sg-single{ text-align:left !important; }
.woocommerce div.product .sg-price-block.sg-single .sg-price-regular,
.woocommerce div.product .sg-price-block.sg-single .sg-price-main,
.woocommerce div.product .sg-price-block.sg-single .sg-price-card{ justify-content:flex-start !important; }
.woocommerce div.product .sg-price-block.sg-single .sg-installments{ text-align:left !important; }
.woocommerce div.product p.stock.sgl-on-order{ text-align:left !important; }
.woocommerce div.product .cfvsw-swatches-container{ justify-content:flex-start !important; }
.woocommerce div.product form.cart{ text-align:left !important; }

/* swatches (plugin cfvsw) viram chips Ateliê */
.cfvsw-swatches-container{ display:flex !important; flex-wrap:wrap; gap:8px; }
.cfvsw-swatches-container .cfvsw-swatches-option{
  border:1px solid rgba(10,21,33,.18) !important; border-radius:4px !important;
  background:#fff !important; color:#3F4A56 !important;
  font-family:var(--sgl-ui,'Inter',sans-serif) !important;
  font-size:13px !important; font-weight:500 !important;
  height:auto !important; min-width:0 !important; line-height:1.25 !important;
  padding:9px 14px !important; margin:0 !important;
  box-shadow:none !important; transition:border-color .2s ease, background .2s ease, color .2s ease;
}
.cfvsw-swatches-container .cfvsw-swatches-option:hover{
  border-color:var(--sgl-gold,#C6A053) !important;
}
.cfvsw-swatches-container .cfvsw-selected-swatch{
  border-color:var(--sgl-goldd,#9C7A2E) !important;
  box-shadow:inset 0 0 0 1px var(--sgl-goldd,#9C7A2E) !important;
  background:rgba(198,160,83,.08) !important; color:var(--sgl-ink,#0A1521) !important;
}
/* selects (fallback sem swatches) */
.woocommerce div.product form.cart table.variations select{
  font-family:var(--sgl-ui,'Inter',sans-serif); font-size:13.5px; color:var(--sgl-ink,#0A1521);
  border:1px solid rgba(10,21,33,.18); border-radius:4px; background:#fff; padding:9px 12px;
  min-width:200px;
}
/* limpar seleção: discreto */
.woocommerce div.product form.cart .reset_variations{
  font-family:var(--sgl-ui,'Inter',sans-serif); font-size:12px; color:#8A93A0 !important;
  text-decoration:none; border-bottom:1px dotted rgba(138,147,160,.6);
  margin-top:8px; display:inline-block;
}

/* preço da VARIAÇÃO dentro do form: redundante — o bloco premium injetado
   no widget do topo atualiza dinamicamente no found_variation (regra que
   existia no plugin antigo e se perdeu no porte; sem ela o preço duplica) */
.woocommerce div.product form.cart .woocommerce-variation-price{ display:none !important; }

/* quantidade: campo limpo — o padding 8px/16px herdado do tema em um campo
   de ~51px empurrava o número pra fora da área visível (só sobrava um pontinho) */
.woocommerce div.product form.cart .quantity .qty{
  border:1px solid rgba(10,21,33,.16); border-radius:4px;
  height:46px; width:64px; padding:0 6px !important;
  text-align:center;
  font-family:var(--sgl-ui,'Inter',sans-serif); font-size:15px; font-weight:500;
  color:var(--sgl-ink,#0A1521);
  -moz-appearance:textfield; appearance:textfield;
}
.woocommerce div.product form.cart .quantity .qty::-webkit-outer-spin-button,
.woocommerce div.product form.cart .quantity .qty::-webkit-inner-spin-button{
  -webkit-appearance:none; margin:0;
}

/* ================= FRETE — sem caixa cinza, linguagem hairline ================= */
[id*="calculo-de-frete"], [class*="calculo-de-frete"],
#woocommerce-correios-calculo-de-frete-na-pagina-do-produto{
  background:transparent !important; border:0 !important;
  border-top:1px solid rgba(10,21,33,.08) !important; border-radius:0 !important;
  margin:22px 0 0 !important; padding:16px 0 0 !important;
  font-family:var(--sgl-ui,'Inter',sans-serif) !important;
}
[id*="calculo-de-frete"] h3, [class*="calculo-de-frete"] h3,
[id*="calculo-de-frete"] > p:first-child, [class*="calculo-de-frete"] > p:first-child,
[id*="calculo-de-frete"] strong:first-child, [class*="calculo-de-frete"] > strong{
  font-family:var(--sgl-ui,'Inter',sans-serif) !important;
  font-size:11px !important; font-weight:600 !important; letter-spacing:.12em;
  text-transform:uppercase; color:#6E7682 !important; margin:0 0 10px !important;
}
[id*="calculo-de-frete"] input[type="text"], [class*="calculo-de-frete"] input[type="text"]{
  border:1px solid rgba(10,21,33,.18) !important; border-radius:4px !important;
  background:#fff !important; height:44px !important; padding:0 14px !important;
  font-family:var(--sgl-ui,'Inter',sans-serif) !important; font-size:14px !important;
  color:var(--sgl-ink,#0A1521) !important; box-shadow:none !important;
}
[id*="calculo-de-frete"] button, [class*="calculo-de-frete"] .button,
[id*="calculo-de-frete"] input[type="submit"], [class*="calculo-de-frete"] input[type="submit"]{
  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; height:44px !important; padding:0 20px !important;
  font-family:var(--sgl-ui,'Inter',sans-serif) !important; font-size:12px !important;
  font-weight:600 !important; letter-spacing:.06em; text-transform:uppercase;
  transition:background .2s ease, color .2s ease;
}
[id*="calculo-de-frete"] button:hover, [class*="calculo-de-frete"] .button:hover{
  background:var(--sgl-gold,#C6A053) !important; color:#3A2C0E !important;
}
/* resultados do cálculo: linhas limpas */
[id*="calculo-de-frete"] table, [class*="calculo-de-frete"] table{
  border:0 !important; margin-top:12px;
}
[id*="calculo-de-frete"] table th, [id*="calculo-de-frete"] table td,
[class*="calculo-de-frete"] table th, [class*="calculo-de-frete"] table td{
  border:0 !important; border-bottom:1px solid rgba(10,21,33,.06) !important;
  font-size:13px !important; color:#4A5460 !important; padding:9px 6px !important;
  background:transparent !important;
}

/* ================= FAÇADE DE YOUTUBE (descrição/obras) ================= */
.sgl-yt-facade{
  position:relative; aspect-ratio:16/9; max-width:860px; margin:18px auto;
  background-color:var(--sgl-ink,#0A1521); background-size:cover; background-position:center;
  border-radius:6px; overflow:hidden; cursor:pointer;
}
.sgl-yt-facade::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(10,21,33,0) 55%,rgba(10,21,33,.45) 100%);
}
.sgl-yt-facade .sgl-yt-play{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:64px; height:64px; border-radius:50%;
  background:rgba(245,244,241,.94); box-shadow:0 6px 24px rgba(10,21,33,.35);
  transition:transform .2s ease;
}
.sgl-yt-facade .sgl-yt-play::after{
  content:""; position:absolute; top:50%; left:53%; transform:translate(-50%,-50%);
  border-style:solid; border-width:11px 0 11px 18px;
  border-color:transparent transparent transparent var(--sgl-goldd,#9C7A2E);
}
.sgl-yt-facade:hover .sgl-yt-play{ transform:translate(-50%,-50%) scale(1.07); }
.sgl-yt-facade iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
