/*
 * Estofaria Variation Swatches
 * v1.4.4
 *
 * Objetivos visuais:
 * - remover o fundo da área de variações do WooCommerce/Elementor;
 * - remover a label nativa do atributo (ex.: "Cor");
 * - neutralizar estilos globais de button do Elementor/Hello;
 * - aplicar os swatches exatamente com fundo transparente, borda verde,
 *   Poppins 14px/600 e padding 7px 20px 7px 12px;
 * - adicionar bolinhas compactas de variação com mini-carrossel no Products Grid.
 */

/* =========================================================
   1. ESTRUTURA DO PICKER
   ========================================================= */
.evs-variation-picker {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Mantém o select original funcionando para o WooCommerce,
   mas fora da apresentação visual. */
.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;
}

/* =========================================================
   2. REMOVE O FUNDO CINZA / LAYOUT DE TABELA NATIVO
   ========================================================= */
.elementor-widget-woocommerce-product-add-to-cart,
.elementor-widget-woocommerce-product-add-to-cart > .elementor-widget-container,
.elementor-widget-woocommerce-product-add-to-cart .elementor-add-to-cart,
.elementor-widget-woocommerce-product-add-to-cart form.cart,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations > tbody,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations > tbody > tr,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations > tbody > tr > th,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations > tbody > tr > td {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

/* Neutraliza a tabela sem remover sua semântica do HTML. */
.elementor-widget-woocommerce-product-add-to-cart 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;
}

.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations > tbody,
.elementor-widget-woocommerce-product-add-to-cart 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;
}

/* Se houver mais de um atributo, mantém um pequeno espaço entre linhas. */
.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations > tbody > tr + tr {
    margin-top: 12px !important;
}

/* =========================================================
   3. REMOVE A LABEL NATIVA DO ATRIBUTO (EX.: "COR")
   ========================================================= */
.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations > tbody > tr > th.label,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations > tbody > tr > td.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;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
}

.elementor-widget-woocommerce-product-add-to-cart form.variations_form table.variations .label > label {
    display: none !important;
}

/* A célula que contém os swatches passa a ocupar toda a largura. */
.elementor-widget-woocommerce-product-add-to-cart 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;
}


/* =========================================================
   3.1 REMOVE O LINK NATIVO "LIMPAR"
   A desseleção agora é feita clicando novamente no swatch ativo.
   O link continua apenas como detalhe interno do WooCommerce, oculto
   visualmente para não interferir na lógica nativa de variações.
   ========================================================= */
.elementor-widget-woocommerce-product-add-to-cart form.variations_form a.reset_variations,
.woocommerce div.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;
}

/* =========================================================
   4. CONTAINER DOS SWATCHES
   ========================================================= */
.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;
    background: transparent !important;
}

/* =========================================================
   5. BOTÃO DE VARIAÇÃO
   Neutraliza primeiro os estilos globais do Elementor/Hello.
   ========================================================= */
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch,
.elementor-widget-woocommerce-product-add-to-cart 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: 0 !important;

    margin: 0 !important;
    padding: 7px 20px 7px 12px !important;

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

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

    color: #042B18 !important;

    font-family: "Poppins", Sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-decoration: none !important;
    text-align: left !important;
    white-space: nowrap !important;

    cursor: pointer !important;
    box-shadow: none !important;
    outline: 0 !important;
    transform: scale(1) !important;
    transform-origin: center !important;
    transition: background-color 0.4s ease, color 0.4s ease, border-color 0.4s ease, transform 0.4s ease, opacity 0.4s ease !important;
    -webkit-tap-highlight-color: transparent !important;
}

/* Evita pseudo-elementos herdados de estilos globais de botão. */
.elementor-widget-woocommerce-product-add-to-cart button.evs-swatch::before,
.elementor-widget-woocommerce-product-add-to-cart button.evs-swatch::after {
    content: none !important;
    display: none !important;
}

/* =========================================================
   5.1 ESTADOS HOVER / ATIVO / SELECIONADO

   IMPORTANTE:
   Os seletores abaixo repetem a mesma cadeia de alta especificidade
   usada no estado normal do botão. Isso impede que a regra normal
   "background: transparent !important" e "transform: scale(1) !important"
   vença os estados :hover e .is-selected.
   ========================================================= */

/* Hover, clique e opção selecionada: fundo verde e conteúdo branco. */
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch:hover:not(:disabled),
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch:active:not(:disabled),
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch.is-selected,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch:hover:not(:disabled),
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch:active:not(:disabled),
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch.is-selected {
    background: #042B18 !important;
    background-color: #042B18 !important;
    background-image: none !important;
    color: #FFFFFF !important;
    border-color: #042B18 !important;
    box-shadow: none !important;
}

/* Texto branco no hover/ativo/selecionado. */
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch:hover:not(:disabled) .evs-swatch__label,
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch:active:not(:disabled) .evs-swatch__label,
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch.is-selected .evs-swatch__label,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch:hover:not(:disabled) .evs-swatch__label,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch:active:not(:disabled) .evs-swatch__label,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch.is-selected .evs-swatch__label {
    color: #FFFFFF !important;
}

/* Borda branca de 2px na bolinha no hover/ativo/selecionado. */
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch:hover:not(:disabled) .evs-swatch__image-wrap,
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch:active:not(:disabled) .evs-swatch__image-wrap,
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch.is-selected .evs-swatch__image-wrap,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch:hover:not(:disabled) .evs-swatch__image-wrap,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch:active:not(:disabled) .evs-swatch__image-wrap,
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch.is-selected .evs-swatch__image-wrap {
    border-color: #FFFFFF !important;
}

/* Hover: Grow 1.08. A alta especificidade é necessária para vencer
   o transform: scale(1) !important do estado normal. */
.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart form.cart button.evs-swatch:hover:not(:disabled),
.elementor-widget-woocommerce-product-add-to-cart form.variations_form button.evs-swatch:hover:not(:disabled) {
    transform: scale(1.08) !important;
}

/* Foco por teclado. */
.elementor-widget-woocommerce-product-add-to-cart button.evs-swatch:focus-visible:not(:disabled) {
    outline: 2px solid #042B18 !important;
    outline-offset: 3px !important;
}

/* Indisponível. */
.elementor-widget-woocommerce-product-add-to-cart button.evs-swatch:disabled,
.elementor-widget-woocommerce-product-add-to-cart button.evs-swatch.is-disabled {
    opacity: 0.35 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* =========================================================
   6. CONTEÚDO INTERNO: IMAGEM + TEXTO
   ========================================================= */
.evs-swatch__inner {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.evs-swatch__image-wrap {
    display: block !important;
    flex: 0 0 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 2px solid transparent !important;
    border-radius: 50% !important;
    background: transparent !important;
    transition: border-color 0.4s ease !important;
}

.evs-swatch__image {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !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;
}

.evs-swatch__label {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #042B18 !important;
    transition: color 0.4s ease !important;
    font-family: "Poppins", Sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    white-space: nowrap !important;
}


/* =========================================================
   7. ESPAÇO ENTRE AS VARIAÇÕES E A ÁREA DE COMPRA
   O bloco visível de quantidade + botão é .variations_button.
   O padding é aplicado nele para não depender de margin collapsing
   nem do layout da tabela de variações.
   ========================================================= */
.woocommerce div.product
.elementor-widget-woocommerce-product-add-to-cart
form.variations_form.cart
.single_variation_wrap
> .woocommerce-variation-add-to-cart.variations_button,
.elementor-widget-woocommerce-product-add-to-cart
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

   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. */
.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;

    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;
    }
}

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

/* 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 {
    display: inline-flex !important;
    flex: 0 0 24px !important;
    box-sizing: border-box !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !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.4s ease, flex-basis 0.4s ease, border-color 0.4s ease, background-color 0.4s ease, color 0.4s ease !important;
    -webkit-tap-highlight-color: transparent !important;
}

.jet-woo-products__item button.evs-grid-swatch:hover:not(:disabled) {
    border-color: #042B18 !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 auto !important;
    width: max-content !important;
    min-width: 24px !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 #042B18 !important;
    border-radius: 50px !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    transform: none !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: none !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #042B18 !important;
    font-family: "Poppins", Sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.jet-woo-products__item button.evs-grid-swatch.is-selected .evs-grid-swatch__label {
    display: block !important;
}

.jet-woo-products__item button.evs-grid-swatch.is-selected .evs-grid-swatch__image-wrap {
    border-color: transparent !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:not(.is-selected) {
        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;
    }
}