/*
 * Variation Swatches
 * v1.6.5
 *
 * Página individual:
 * - estilos limitados ao form.variations_form de body.single-product;
 * - padrão visual alinhado ao haja-archive-filters;
 * - Cor = controle retangular com imagem + texto, alinhado ao filtro de cores;
 * - Tamanho = círculo compacto;
 * - outros atributos textuais = controle retangular;
 * - espaçamento real entre as rows de atributos.
 *
 * Products Grid:
 * - bloco .evs-grid-* preservado sem alterações visuais.
 */

/* =========================================================
   1. PÁGINA INDIVIDUAL — ESTRUTURA DAS VARIAÇÕES
   ========================================================= */
body.single-product form.variations_form {
    /* Mesmo fundo de ação usado pelo painel Filtrar.
       Se a variável do haja-archive-filters existir na página, ela é reutilizada;
       caso contrário, mantém o verde padrão do projeto. */
    --evs-action-bg: #000000;
}

body.single-product form.variations_form,
body.single-product form.variations_form table.variations,
body.single-product form.variations_form table.variations > tbody,
body.single-product form.variations_form table.variations > tbody > tr,
body.single-product form.variations_form table.variations > tbody > tr > th,
body.single-product form.variations_form table.variations > tbody > tr > td,
body.single-product form.variations_form .evs-variation-picker,
body.single-product form.variations_form .evs-swatches {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

/* O select nativo continua no DOM e sincronizado com o WooCommerce. */
body.single-product form.variations_form .evs-native-select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Neutraliza o layout de tabela do WooCommerce/JetWoo somente no produto. */
body.single-product form.variations_form table.variations {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-spacing: 0 !important;
    border-collapse: collapse !important;
}

body.single-product form.variations_form table.variations > tbody,
body.single-product form.variations_form table.variations > tbody > tr {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* Espaço ENTRE atributos diferentes: Cor -> Tamanho -> demais rows. */
body.single-product form.variations_form table.variations > tbody > tr + tr {
    margin-top: 18px !important;
}

/* A label nativa fica oculta; o swatch já comunica o atributo visualmente. */
body.single-product form.variations_form table.variations > tbody > tr > th.label,
body.single-product form.variations_form table.variations > tbody > tr > td.label,
body.single-product form.variations_form table.variations .label > label {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body.single-product form.variations_form table.variations > tbody > tr > td.value {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    vertical-align: top !important;
}

body.single-product form.variations_form a.reset_variations {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

body.single-product form.variations_form .evs-variation-picker {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.single-product form.variations_form .evs-swatches {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* =========================================================
   2. PÁGINA INDIVIDUAL — BASE DOS SWATCHES
   Mesmo vocabulário do haja-archive-filters:
   Montserrat 16/300, uppercase, branco + borda preta e ação #000000.
   ========================================================= */
body.single-product form.variations_form button.evs-swatch {
    all: unset !important;
    box-sizing: border-box !important;
    -webkit-box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;

    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 40px !important;

    margin: 0 !important;
    padding: 8px 16px !important;

    border: 1px solid #000000 !important;
    border-radius: 50px !important;
    overflow: hidden !important;

    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    color: #000000 !important;

    font-family: "Montserrat", Sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 300 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    text-align: center !important;
    white-space: nowrap !important;

    cursor: pointer !important;
    box-shadow: none !important;
    outline: 0 !important;
    transform: none !important;
    transition:
        background-color 220ms ease,
        color 220ms ease,
        border-color 220ms ease,
        opacity 220ms ease !important;
    -webkit-tap-highlight-color: transparent !important;
}

body.single-product form.variations_form button.evs-swatch::before,
body.single-product form.variations_form button.evs-swatch::after {
    content: none !important;
    display: none !important;
}

body.single-product form.variations_form button.evs-swatch > .evs-swatch__inner {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.single-product form.variations_form button.evs-swatch .evs-swatch__label {
    display: block !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #000000 !important;
    font-family: "Montserrat", Sans-serif !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 300 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
    text-align: center !important;
    white-space: nowrap !important;
    transition: color 220ms ease !important;
}

/* =========================================================
   3. COR — CANTOS RETOS; MINIATURA INTERNA PRESERVADA
   ========================================================= */
body.single-product form.variations_form button.evs-swatch.evs-swatch--image {
    min-height: 48px !important;
    padding: 7px 12px !important;
    justify-content: flex-start !important;
    border-radius: 0 !important;
}

body.single-product form.variations_form button.evs-swatch.evs-swatch--image > .evs-swatch__inner {
    justify-content: flex-start !important;
    gap: 10px !important;
}

body.single-product form.variations_form button.evs-swatch .evs-swatch__image-wrap {
    display: block !important;
    flex: 0 0 26px !important;
    width: 26px !important;
    min-width: 26px !important;
    max-width: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 1px solid rgba(0, 0, 0, .28) !important;
    border-radius: 50% !important;
    background: transparent !important;
    background-clip: border-box !important;
    box-shadow: none !important;
    transition: border-color 220ms ease !important;
}

body.single-product form.variations_form button.evs-swatch .evs-swatch__image {
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: none !important;
    aspect-ratio: 1 / 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    object-position: center !important;
    box-shadow: none !important;
}

/* =========================================================
   4. TAMANHO — SOMENTE TAMANHO VIRA CÍRCULO
   Outros atributos .evs-swatch--text mantêm o padrão pill do filtro.
   ========================================================= */
body.single-product form.variations_form button.evs-swatch.evs-swatch--size {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 !important;
    border-radius: 50% !important;
}

body.single-product form.variations_form button.evs-swatch.evs-swatch--size > .evs-swatch__inner {
    width: 100% !important;
    height: 100% !important;
    gap: 0 !important;
}

body.single-product form.variations_form button.evs-swatch.evs-swatch--size .evs-swatch__label {
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
    align-items: center !important;
    justify-content: center !important;
}

/* =========================================================
   5. HOVER / FOCO / SELECIONADO / INDISPONÍVEL
   ========================================================= */
/*
 * Hover, foco por teclado e estado pressionado usam a mesma linguagem visual
 * do haja-archive-filters: fundo de ação, texto branco e borda transparente.
 *
 * O plugin marca a opção escolhida com .is-selected + aria-checked="true".
 * .is-active/.selected/aria-pressed são aceitos como aliases defensivos para
 * impedir que integrações do Elementor/JetWoo produzam um estado visual diferente.
 */
body.single-product form.variations_form button.evs-swatch:hover:not(:disabled):not(.is-disabled):not([aria-disabled="true"]),
body.single-product form.variations_form button.evs-swatch:focus-visible:not(:disabled):not(.is-disabled):not([aria-disabled="true"]),
body.single-product form.variations_form button.evs-swatch:active:not(:disabled):not(.is-disabled):not([aria-disabled="true"]),
body.single-product form.variations_form button.evs-swatch.is-selected,
body.single-product form.variations_form button.evs-swatch.is-active,
body.single-product form.variations_form button.evs-swatch.selected,
body.single-product form.variations_form button.evs-swatch[aria-checked="true"],
body.single-product form.variations_form button.evs-swatch[aria-pressed="true"] {
    background: var(--evs-action-bg, #000000) !important;
    background-color: var(--evs-action-bg, #000000) !important;
    background-image: none !important;
    border-color: transparent !important;
    color: #FFFFFF !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Tamanho continua 100% circular também no hover/ativo. */
body.single-product form.variations_form button.evs-swatch.evs-swatch--size:hover:not(:disabled):not(.is-disabled):not([aria-disabled="true"]),
body.single-product form.variations_form button.evs-swatch.evs-swatch--size:focus-visible:not(:disabled):not(.is-disabled):not([aria-disabled="true"]),
body.single-product form.variations_form button.evs-swatch.evs-swatch--size:active:not(:disabled):not(.is-disabled):not([aria-disabled="true"]),
body.single-product form.variations_form button.evs-swatch.evs-swatch--size.is-selected,
body.single-product form.variations_form button.evs-swatch.evs-swatch--size.is-active,
body.single-product form.variations_form button.evs-swatch.evs-swatch--size.selected,
body.single-product form.variations_form button.evs-swatch.evs-swatch--size[aria-checked="true"],
body.single-product form.variations_form button.evs-swatch.evs-swatch--size[aria-pressed="true"] {
    border-radius: 50% !important;
}

/* O texto acompanha o fundo verde em todos os estados interativos. */
body.single-product form.variations_form button.evs-swatch:hover:not(:disabled):not(.is-disabled):not([aria-disabled="true"]) .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch:focus-visible:not(:disabled):not(.is-disabled):not([aria-disabled="true"]) .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch:active:not(:disabled):not(.is-disabled):not([aria-disabled="true"]) .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch.is-selected .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch.is-active .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch.selected .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch[aria-checked="true"] .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch[aria-pressed="true"] .evs-swatch__label {
    color: #FFFFFF !important;
}

/* A miniatura ativa usa uma borda branca sólida de 1px. */
body.single-product form.variations_form button.evs-swatch.evs-swatch--image:hover:not(:disabled):not(.is-disabled):not([aria-disabled="true"]) .evs-swatch__image-wrap,
body.single-product form.variations_form button.evs-swatch.evs-swatch--image:focus-visible:not(:disabled):not(.is-disabled):not([aria-disabled="true"]) .evs-swatch__image-wrap,
body.single-product form.variations_form button.evs-swatch.evs-swatch--image:active:not(:disabled):not(.is-disabled):not([aria-disabled="true"]) .evs-swatch__image-wrap,
body.single-product form.variations_form button.evs-swatch.evs-swatch--image.is-selected .evs-swatch__image-wrap,
body.single-product form.variations_form button.evs-swatch.evs-swatch--image.is-active .evs-swatch__image-wrap,
body.single-product form.variations_form button.evs-swatch.evs-swatch--image.selected .evs-swatch__image-wrap,
body.single-product form.variations_form button.evs-swatch.evs-swatch--image[aria-checked="true"] .evs-swatch__image-wrap,
body.single-product form.variations_form button.evs-swatch.evs-swatch--image[aria-pressed="true"] .evs-swatch__image-wrap {
    border-color: #FFFFFF !important;
}

body.single-product form.variations_form button.evs-swatch:focus-visible:not(:disabled):not(.is-disabled) {
    outline: 2px solid rgba(0, 0, 0, .35) !important;
    outline-offset: 3px !important;
}

body.single-product form.variations_form button.evs-swatch:disabled,
body.single-product form.variations_form button.evs-swatch.is-disabled,
body.single-product form.variations_form button.evs-swatch[aria-disabled="true"] {
    border-color: #000000 !important;
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    color: #000000 !important;
    opacity: .28 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    transform: none !important;
}

body.single-product form.variations_form button.evs-swatch:disabled .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch.is-disabled .evs-swatch__label,
body.single-product form.variations_form button.evs-swatch[aria-disabled="true"] .evs-swatch__label {
    color: #000000 !important;
}

/* Mantém respiro antes da quantidade + botão, inclusive no JetWoo Builder. */
body.single-product form.variations_form .single_variation_wrap
> .woocommerce-variation-add-to-cart.variations_button {
    box-sizing: border-box !important;
    padding-top: 18px !important;
}


/* =========================================================
   8. PRODUCTS GRID - PRÉ-VISUALIZAÇÃO DAS VARIAÇÕES

   IMPORTANTE: este bloco foi preservado do plugin original.
   As alterações acima não usam seletores .evs-grid-*.
   ========================================================= */
/* =========================================================
   8. PRODUCTS GRID - PRÉ-VISUALIZAÇÃO DAS VARIAÇÕES

   Os itens abaixo são montados somente dentro dos cards
   .jet-woo-products__item do widget Products Grid do JetWoo.
   ========================================================= */

/* Faz a área de compra do card trabalhar em coluna quando houver
   pré-visualização de variações: bolinhas em cima, CTA embaixo. */
.jet-woo-products__item
.jet-woo-product-button.evs-has-grid-variations {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
}

/* Container do mini-carrossel. Sem overflow, ocupa uma única coluna.
   Quando o JS detecta overflow, abre espaço para as setas nas laterais. */
.jet-woo-products__item .evs-grid-variations {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 5px !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
}

.jet-woo-products__item .evs-grid-variations.is-overflowing {
    grid-template-columns: 20px minmax(0, 1fr) 20px !important;
}

/* Janela horizontal das bolinhas. Também permite swipe/toque diretamente
   caso o usuário esteja no celular. */
.jet-woo-products__item .evs-grid-variations__viewport {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 2px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    scrollbar-width: none !important;
    -ms-overflow-style: none !important;

    overscroll-behavior-x: contain !important;
    scroll-behavior: smooth !important;
    scroll-snap-type: x proximity !important;

    background: transparent !important;
    border: 0 !important;
    outline: 0 !important;
}

.jet-woo-products__item .evs-grid-variations__viewport::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* Mantém todas as variações em uma única linha.
   Reserva 28px de altura desde o estado fechado, que é exatamente a altura
   usada pela cápsula selecionada. Assim o padding vertical do estado aberto
   não aumenta a altura do carrossel/card ao clicar. */
.jet-woo-products__item .evs-grid-variations__track {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;

    width: max-content !important;
    min-width: max-content !important;
    min-height: 28px !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* Bolinhas do Products Grid. */
.jet-woo-products__item .evs-grid-swatch {
    display: block !important;
    flex: 0 0 22px !important;

    box-sizing: border-box !important;

    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;

    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    border: 1px solid rgba(4, 43, 24, 0.35) !important;
    border-radius: 50% !important;

    background: transparent !important;
    box-shadow: none !important;

    scroll-snap-align: start !important;

    transform: scale(1) !important;
    transform-origin: center !important;
    transition: transform 0.25s ease, border-color 0.25s ease !important;
}

.jet-woo-products__item .evs-grid-swatch:hover {
    border-color: #042B18 !important;
    transform: scale(1.10) !important;
}

.jet-woo-products__item .evs-grid-swatch__image {
    display: block !important;

    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;

    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    object-fit: cover !important;
    object-position: center !important;

    box-shadow: none !important;
}

/* Setas do mini-carrossel. Elas permanecem invisíveis quando todas as
   bolinhas cabem no card. */
.jet-woo-products__item button.evs-grid-variations__nav {
    all: unset !important;

    box-sizing: border-box !important;

    display: none !important;
    align-items: center !important;
    justify-content: center !important;

    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;

    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #042B18 !important;

    border: 1px solid #042B18 !important;
    border-radius: 50% !important;

    background: #FFFFFF !important;
    background-color: #FFFFFF !important;

    cursor: pointer !important;
    box-shadow: none !important;

    transition: background-color 0.25s ease, color 0.25s ease, opacity 0.25s ease, transform 0.25s ease !important;
}

.jet-woo-products__item
.evs-grid-variations.is-overflowing
button.evs-grid-variations__nav {
    display: inline-flex !important;
}

.jet-woo-products__item button.evs-grid-variations__nav:hover:not(:disabled) {
    color: #FFFFFF !important;
    background: #042B18 !important;
    background-color: #042B18 !important;
    transform: scale(1.08) !important;
}

.jet-woo-products__item button.evs-grid-variations__nav:disabled {
    opacity: 0.25 !important;
    cursor: default !important;
    transform: none !important;
}

.jet-woo-products__item button.evs-grid-variations__nav svg {
    display: block !important;
    width: 12px !important;
    height: 12px !important;

    margin: 0 !important;
    padding: 0 !important;

    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

/* Evita estilos globais de botões do Elementor nos pseudo-elementos das setas. */
.jet-woo-products__item button.evs-grid-variations__nav::before,
.jet-woo-products__item button.evs-grid-variations__nav::after {
    content: none !important;
    display: none !important;
}

/* Garante que o CTA de produto variável continue abaixo do carrossel. */
.jet-woo-products__item
.jet-woo-product-button.evs-has-grid-variations
> a.button,
.jet-woo-products__item
.jet-woo-product-button.evs-has-grid-variations
> .button {
    flex: 0 0 auto !important;
}

@media (max-width: 767px) {
    .jet-woo-products__item .evs-grid-swatch {
        flex-basis: 20px !important;
        width: 20px !important;
        min-width: 20px !important;
        max-width: 20px !important;
        height: 20px !important;
        min-height: 20px !important;
        max-height: 20px !important;
    }

    .jet-woo-products__item .evs-grid-variations__track {
        gap: 5px !important;
    }
}

/* =========================================================
   8.1 PRODUCTS GRID - PREÇO DOS CARDS VARIÁVEIS (v1.6.11)
   ========================================================= */

/*
 * O Products Grid aplica a tipografia principal no wrapper .price. Nos cards
 * variáveis, o WooCommerce pode devolver o preço original dentro de <del> e o
 * preço promocional dentro de <ins>.
 *
 * O preço promocional (<ins>) deve reproduzir exatamente o estilo principal
 * aplicado ao wrapper .price no Elementor. Já o preço original (<del>) mantém
 * a mesma linguagem visual, porém com tamanho e intensidade levemente menores.
 * O bloco Pix permanece totalmente independente destas regras.
 */
.elementor-widget-jet-woo-products
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-price
.price > del {
    color: inherit !important;
    font-family: inherit !important;
    font-size: 0.84em !important;
    font-style: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    opacity: 0.72;
    letter-spacing: inherit !important;
    text-transform: inherit !important;
}

.elementor-widget-jet-woo-products
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-price
.price > del .woocommerce-Price-amount,
.elementor-widget-jet-woo-products
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-price
.price > del .woocommerce-Price-currencySymbol,
.elementor-widget-jet-woo-products
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-price
.price > del bdi {
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-style: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-transform: inherit !important;
}

/* O preço promocional replica integralmente o estilo principal do .price. */
.elementor-widget-jet-woo-products
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-price
.price > ins {
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-style: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-transform: inherit !important;
    opacity: 1 !important;
}

.elementor-widget-jet-woo-products
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-price
.price > ins .woocommerce-Price-amount,
.elementor-widget-jet-woo-products
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-price
.price > ins .woocommerce-Price-currencySymbol,
.elementor-widget-jet-woo-products
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-price
.price > ins bdi {
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-style: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-transform: inherit !important;
}

/* =========================================================
   9. PRODUCTS GRID - COMPRA DIRETA DE VARIAÇÃO (v1.5.1)
   ========================================================= */

/* Wrapper criado para o seletor + área de compra. */
.jet-woo-products__item .evs-grid-variable-ui {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* O link nativo "Ver opções" só é ocultado depois que o JS confirma
   que a compra direta no card foi inicializada corretamente. */
.jet-woo-products__item.evs-grid-variable-ready
.jet-woo-product-button
.evs-grid-native-variable-link,
.evs-grid-native-variable-description {
    display: none !important;
    visibility: hidden !important;
}

/* Agora a bolinha é um botão real. Neutraliza estilos globais do Elementor
   sem alterar o visual que já estava aprovado. */
.jet-woo-products__item button.evs-grid-swatch {
    --evs-grid-swatch-closed-width: 24px;
    --evs-grid-swatch-expanded-width: 24px;

    display: inline-flex !important;
    flex: 0 0 var(--evs-grid-swatch-closed-width) !important;
    box-sizing: border-box !important;
    width: var(--evs-grid-swatch-closed-width) !important;
    min-width: var(--evs-grid-swatch-closed-width) !important;
    max-width: 240px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 28px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(4, 43, 24, 0.35) !important;
    border-radius: 50px !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    cursor: pointer !important;
    scroll-snap-align: start !important;
    transform: none !important;
    transform-origin: left center !important;
    transition:
        width 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        flex-basis 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        height 0.32s ease,
        padding 0.32s ease,
        border-color 0.32s ease,
        background-color 0.32s ease,
        color 0.32s ease !important;
    -webkit-tap-highlight-color: transparent !important;
}

.jet-woo-products__item button.evs-grid-swatch:hover:not(:disabled) {
    border-color: #000000 !important;
    background: transparent !important;
    background-color: transparent !important;
    transform: none !important;
    cursor: pointer !important;
}

.jet-woo-products__item button.evs-grid-swatch.is-selected {
    flex: 0 0 var(--evs-grid-swatch-expanded-width) !important;
    width: var(--evs-grid-swatch-expanded-width) !important;
    min-width: var(--evs-grid-swatch-closed-width) !important;
    max-width: 240px !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 2px 9px 2px 2px !important;
    border: 1px solid #000000 !important;
    border-radius: 50px !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    color: #000000 !important;
}

.jet-woo-products__item .evs-grid-swatch__inner {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 5px !important;
    min-width: 0 !important;
    white-space: nowrap !important;
}

.jet-woo-products__item .evs-grid-swatch__image-wrap {
    display: block !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    border: 1px solid transparent !important;
    box-sizing: border-box !important;
}

.jet-woo-products__item .evs-grid-swatch__label {
    display: block !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #000000 !important;
    font-family: "Montserrat", Sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    opacity: 0 !important;
    transform: translateX(-4px) !important;
    transition: opacity 0.24s ease, transform 0.36s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.jet-woo-products__item button.evs-grid-swatch.is-selected .evs-grid-swatch__label {
    opacity: 1 !important;
    transform: translateX(0) !important;
}

.jet-woo-products__item button.evs-grid-swatch.is-selected .evs-grid-swatch__image-wrap {
    border: 1px solid #FFFFFF !important;
}

.jet-woo-products__item button.evs-grid-swatch:disabled,
.jet-woo-products__item button.evs-grid-swatch.is-disabled {
    opacity: 0.35 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

.jet-woo-products__item button.evs-grid-swatch::before,
.jet-woo-products__item button.evs-grid-swatch::after {
    content: none !important;
    display: none !important;
}

/* Área de quantidade + adicionar ao carrinho. Mantém a mesma estrutura
   de form.cart já usada pelos produtos simples do JetWoo. */
.jet-woo-products__item .evs-grid-purchase {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
}

/* Enquanto nenhuma variação estiver selecionada, os dois controles ficam
   visíveis, porém bloqueados. */
.jet-woo-products__item .evs-grid-purchase.is-locked .quantity,
.jet-woo-products__item .evs-grid-purchase.is-locked .evs-grid-add-to-cart {
    opacity: 0.48 !important;
}

.jet-woo-products__item .evs-grid-purchase .evs-grid-qty:disabled,
.jet-woo-products__item .evs-grid-purchase .evs-grid-add-to-cart:disabled {
    cursor: not-allowed !important;
}

.jet-woo-products__item .evs-grid-purchase .evs-grid-add-to-cart:disabled {
    pointer-events: none !important;
}

/* Reforça o cursor correto depois da seleção. */
.jet-woo-products__item .evs-grid-purchase:not(.is-locked) .evs-grid-qty,
.jet-woo-products__item .evs-grid-purchase:not(.is-locked) .evs-grid-add-to-cart {
    opacity: 1 !important;
}

@media (max-width: 767px) {
    .jet-woo-products__item button.evs-grid-swatch {
        --evs-grid-swatch-closed-width: 20px;
    }

    .jet-woo-products__item button.evs-grid-swatch:not(.is-selected) {
        flex-basis: var(--evs-grid-swatch-closed-width) !important;
        width: var(--evs-grid-swatch-closed-width) !important;
        min-width: var(--evs-grid-swatch-closed-width) !important;
        height: 20px !important;
        min-height: 20px !important;
        max-height: 20px !important;
    }
}

/* =========================================================
   10. PRODUCTS GRID - CAMADA DE COMPRA SOBRE A THUMBNAIL (v1.5.8)
   ========================================================= */

/* Preserva o recuo aprovado no desktop. Em tablet/mobile o recuo fixo
   ultrapassava a largura do card (o carrossel já tem width: 100%). */
.evs-grid-variable-ui .evs-grid-variations {
    margin-left: 18px !important;
}

@media (max-width: 1024px) {
    .jet-woo-products__item .evs-grid-variable-ui .evs-grid-variations {
        box-sizing: border-box !important;
        margin-left: 0 !important;
    }

    /* Remove a faixa branca inicial sem reduzir o espaço vertical das
       cápsulas selecionadas ou a área útil para gesto de deslizar. */
    .jet-woo-products__item .evs-grid-variations__viewport {
        box-sizing: border-box !important;
        padding: 2px 0 !important;
    }
}

/*
 * O host da overlay NÃO é mais a própria thumbnail.
 * O JS cria um wrapper dedicado em todos os cards variáveis.
 *
 * É essencial manter overflow:visible aqui. A thumbnail continua com seu
 * overflow:hidden normal, mas a máscara pode ultrapassar alguns pixels nas
 * laterais para cobrir a fresta causada pelo subpixel do Swiper.
 */
/*
 * O overscan precisa conseguir sair alguns pixels para fora da largura do card.
 * Alguns presets do JetWoo/Elementor aplicam overflow:hidden no item/inner-box;
 * isso recriaria o mesmo corte em subpixel em um nível acima do wrapper.
 */
.jet-woo-products__item.evs-grid-variable-ready,
.jet-woo-products__item.evs-grid-variable-ready > .jet-woo-products__inner-box,
.jet-woo-products__item.evs-grid-variable-ready .jet-woo-products__inner-box {
    overflow: visible !important;
}

.jet-woo-products__item .evs-grid-thumbnail-overlay-host,
.jet-woo-products__item .evs-grid-thumbnail-overlay-wrapper {
    position: relative !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
    isolation: isolate !important;
}

/*
 * A thumbnail continua sendo o elemento que recorta a FOTO.
 * Isso preserva o object-fit:cover e o comportamento do CSS personalizado
 * do widget, mas sem recortar a overlay.
 */
.jet-woo-products__item
.evs-grid-thumbnail-overlay-wrapper
> .jet-woo-product-thumbnail {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
}

.jet-woo-products__item
.evs-grid-thumbnail-overlay-wrapper
> .jet-woo-product-thumbnail img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/*
 * A viewport da camada é propositalmente 4px maior em cada lateral.
 * Assim o recorte/antialiasing fica FORA da borda visual da thumbnail.
 * A diferença é pequena o suficiente para não alterar a composição do card,
 * mas grande o bastante para cobrir arredondamentos de 1px em DPR diferentes.
 */
.jet-woo-products__item .evs-grid-purchase-overlay {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: -4px !important;
    right: -4px !important;
    z-index: 20 !important;

    box-sizing: border-box !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
    background: transparent !important;

    visibility: hidden !important;
    pointer-events: none !important;

    clip-path: none !important;
    transform: none !important;
}

.jet-woo-products__item .evs-grid-purchase-overlay.is-open {
    visibility: visible !important;
    pointer-events: none !important;
    background: transparent !important;
}

/*
 * O painel branco preenche toda a viewport maior da overlay.
 * Durante a abertura ele usa translateY para subir.
 */
.jet-woo-products__item .evs-grid-purchase-overlay__inner {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: -3px !important;

    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    gap: 10px !important;

    width: auto !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 30px 30px !important;

    background: #FDFDFD !important;

    /* Proteção extra contra antialiasing da borda de composição. */
    box-shadow:
        -4px 0 0 #FDFDFD,
        4px 0 0 #FDFDFD,
        0 4px 0 #FDFDFD !important;

    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;

    transform: translateY(calc(100% + 6px)) !important;
    transition:
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.25s ease,
        visibility 0s linear 0.42s !important;
}

.jet-woo-products__item
.evs-grid-purchase-overlay.is-open
.evs-grid-purchase-overlay__inner {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
    transition-delay: 0s !important;
}

/*
 * Depois da animação, o JS adiciona .is-settled.
 * transform:none é intencional: evita que o painel permaneça como uma camada
 * de composição independente enquanto o Swiper movimenta o slide.
 */
.jet-woo-products__item
.evs-grid-purchase-overlay.is-open.is-settled
.evs-grid-purchase-overlay__inner {
    transform: none !important;
    transition: none !important;
}

/* =========================================================
   10.1 SWATCHES DE TAMANHO NA CAMADA
   ========================================================= */

.jet-woo-products__item .evs-grid-size-picker {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
}

.jet-woo-products__item .evs-grid-size-picker__track {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;

    width: 100% !important;
    max-width: 100% !important;

    margin: 0 auto !important;
    padding: 0 !important;

    text-align: center !important;
}

/* Estilo-base propositalmente simples. Na próxima etapa podemos ajustar
   tamanho, bordas, cores, hover e estado selecionado. */
.jet-woo-products__item button.evs-grid-size-swatch {
    all: unset !important;

    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 35px !important;
    min-height: 35px !important;

    margin: 0 !important;
    padding: 3px 7px !important;

    border: 1px solid #000000 !important;
    border-radius: 100px !important;

    background: transparent !important;
    color: #000000 !important;

    font-family: "Montserrat", Sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;

    cursor: pointer !important;

    transition:
        background-color 0.25s ease,
        border-color 0.25s ease,
        color 0.25s ease,
        opacity 0.25s ease !important;
}

.jet-woo-products__item button.evs-grid-size-swatch:hover:not(:disabled),
.jet-woo-products__item button.evs-grid-size-swatch.is-selected {
    border-color: #000000 !important;
    background: #000000 !important;
    color: #FFFFFF !important;
}

.jet-woo-products__item button.evs-grid-size-swatch.is-selected {
    background: #000000 !important;
    color: #FFFFFF !important;
}

.jet-woo-products__item button.evs-grid-size-swatch:disabled,
.jet-woo-products__item button.evs-grid-size-swatch.is-disabled {
    opacity: 0.35 !important;
    cursor: not-allowed !important;
}

.jet-woo-products__item .evs-grid-size-swatch__label {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font-weight: 400 !important;
}

/* =========================================================
   10.2 QUANTIDADE + ADICIONAR AO CARRINHO
   ========================================================= */

/* Só definimos o layout. Aparência de input/botão continua livre para os
   estilos configurados no próprio widget Products Grid/Elementor. */
.jet-woo-products__item .evs-grid-purchase-overlay .evs-grid-purchase {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 8px !important;

    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

.jet-woo-products__item .evs-grid-purchase-overlay .evs-grid-purchase .quantity {
    flex: 0 0 auto !important;
    margin: 0 !important;
}


/*
 * Controle de quantidade personalizado.
 *
 * O input continua sendo type="number" e mantém min/max/step, mas os
 * steppers nativos do navegador são ocultados. Os botões +/- são criados
 * pelo JS para permitir estilização consistente em todos os navegadores.
 */
.jet-woo-products__item
.evs-grid-purchase-overlay
.evs-grid-purchase
.quantity.evs-grid-quantity-control {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-columns: 24px minmax(0, 1fr) 24px !important;
    align-items: center !important;

    overflow: hidden !important;

    min-width: 0 !important;
    min-height: 40px !important;

    padding: 0 4px !important;

    border: 0 !important;
    border-radius: 50px !important;

    background: #444444 !important;
    background-color: #444444 !important;
}

/* Número centralizado e sem o fundo anterior do input. */
.jet-woo-products__item
.evs-grid-purchase-overlay
.evs-grid-purchase
.quantity.evs-grid-quantity-control
input.evs-grid-qty {
    box-sizing: border-box !important;

    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;

    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;

    color: #FFFFFFC9 !important;
    -webkit-text-fill-color: #FFFFFFC9 !important;

    text-align: center !important;

    appearance: textfield !important;
    -moz-appearance: textfield !important;
}

/* Remove os controles nativos do input number no Chrome/Safari/Edge. */
.jet-woo-products__item
.evs-grid-purchase-overlay
.evs-grid-purchase
.quantity.evs-grid-quantity-control
input.evs-grid-qty::-webkit-outer-spin-button,
.jet-woo-products__item
.evs-grid-purchase-overlay
.evs-grid-purchase
.quantity.evs-grid-quantity-control
input.evs-grid-qty::-webkit-inner-spin-button {
    margin: 0 !important;
    -webkit-appearance: none !important;
}

/* Botões de diminuir/aumentar: mesma cor do número e sem fundo. */
.jet-woo-products__item
.evs-grid-purchase-overlay
.evs-grid-purchase
button.evs-grid-qty-step {
    all: unset !important;

    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 24px !important;
    min-width: 24px !important;
    height: 100% !important;
    min-height: 40px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    color: #FFFFFFC9 !important;

    font: inherit !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1 !important;

    cursor: pointer !important;
    box-shadow: none !important;

    transition: opacity 0.2s ease !important;
}

.jet-woo-products__item
.evs-grid-purchase-overlay
.evs-grid-purchase
button.evs-grid-qty-step:hover:not(:disabled),
.jet-woo-products__item
.evs-grid-purchase-overlay
.evs-grid-purchase
button.evs-grid-qty-step:focus-visible:not(:disabled) {
    background: transparent !important;
    background-color: transparent !important;
    color: #FFFFFFC9 !important;
    opacity: 1 !important;
}

.jet-woo-products__item
.evs-grid-purchase-overlay
.evs-grid-purchase
button.evs-grid-qty-step:disabled {
    background: transparent !important;
    background-color: transparent !important;
    color: #FFFFFFC9 !important;
    opacity: 0.35 !important;
    cursor: default !important;
}

.jet-woo-products__item .evs-grid-purchase-overlay .evs-grid-add-to-cart {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
}

/* O formulário permanece visível dentro da camada quando ela abre, mas
   continua bloqueado até que todas as escolhas necessárias sejam feitas. */
.jet-woo-products__item .evs-grid-purchase-overlay .evs-grid-purchase.is-locked .quantity,
.jet-woo-products__item .evs-grid-purchase-overlay .evs-grid-purchase.is-locked .evs-grid-add-to-cart {
    opacity: 0.48 !important;
}

@media (max-width: 767px) {
    .jet-woo-products__item .evs-grid-purchase-overlay {
        padding: 12px !important;
    }

    .jet-woo-products__item button.evs-grid-size-swatch {
        min-width: 30px !important;
        min-height: 28px !important;
        padding: 5px 8px !important;
    }
}

/* =========================================================
   AJUSTES DE PRODUTO INDIVIDUAL — 28/10/2026
   ========================================================= */

/* Só mostra aviso de disponibilidade quando a variação está esgotada.
   Não altera dados de estoque, compra ou a seleção nativa do WooCommerce. */
body.single-product form.variations_form .woocommerce-variation-availability .stock:not(.out-of-stock) {
    display: none !important;
}

body.single-product form.variations_form .woocommerce-variation-availability .stock.out-of-stock {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 8px 0 12px !important;
    padding: 8px 13px !important;
    border: 1px solid #000000 !important;
    border-radius: 4px !important;
    background: #F7F7F7 !important;
    color: #000000 !important;
    font-family: "Montserrat", sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
    letter-spacing: .02em !important;
}


/* Correção pontual do sticky da coluna de informações do template individual 1095.
   Elementor controlava essa coluna com fixed + spacer durante a rolagem.
   Mantemos o efeito sticky com posicionamento nativo, sem remount de DOM. */
@media (min-width: 1025px) {
    body.single-product .elementor-1095 .elementor-element-5395e81.evs-single-native-sticky {
        position: sticky !important;
        top: 0 !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        width: 100% !important;
        transform: none !important;
        align-self: flex-start !important;
    }
}