




<style>
/* ===============================================
   VARIÁVEIS DE COR (COR EXATA)
   #EB9447 = RGB(235,148,71)
================================================ */
:root{
  --brand-orange:#EB9447;
  --brand-orange-dark:#d97835;
  --brand-orange-strong:#d55e28;
}

/* ===============================================
   ANIMAÇÃO DO CARD (A MESMA QUE VOCÊ TINHA)
================================================ */
body ul.products li.product{
    transition:transform .30s ease,box-shadow .30s ease;
}
body ul.products li.product:hover{
    transform:translateY(-8px);
    box-shadow:0 14px 28px rgba(0,0,0,0.12);
}

/* ===============================================
   BOTÃO “ADICIONAR AO CARRINHO” — ESTILO PREMIUM
   SOMENTE EM LISTAGENS (nunca dentro do produto)
================================================ */
body:not(.single-product) ul.products li.product a.button{
    display:flex!important;
    align-items:center;
    justify-content:center;
    gap:8px;

    background:#fff!important;
    border:2px solid var(--brand-orange)!important;
    color:var(--brand-orange)!important;

    font-weight:600!important;
    border-radius:8px!important;
    padding:10px 14px!important;
    font-size:0!important;
    transition:.25s ease!important;
}

/* Texto novo */
body:not(.single-product) ul.products li.product a.button::after{
    content:"Adicionar ao Carrinho";
    font-size:15px!important;
    color:var(--brand-orange)!important;
}

/* Ícone carrinho (desktop) */
body:not(.single-product) ul.products li.product a.button::before{
    content:"";
    display:inline-block;
    width:18px;
    height:18px;
    margin-right:6px;
    background-size:contain;
    background-repeat:no-repeat;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23EB9447' viewBox='0 0 24 24'><path d='M7 4h-2l-1 2h2l1-2zm2 0h9a1 1 0 0 1 .96 1.27l-1.8 7.2a3 3 0 0 1-2.92 2.23H9.4l-.64 2H5v-2h2.4l3.3-10H9L8 4zm-4 16a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm12 0a2 2 0 1 0 0-4 2 2 0 0 0 1 4z'/></svg>");
}

/* Hover */
body:not(.single-product) ul.products li.product a.button:hover{
    background:var(--brand-orange)!important;
    border-color:var(--brand-orange)!important;
    color:#fff!important;
    transform:translateY(-2px);
}

/* Ícone branco no hover */
body:not(.single-product) ul.products li.product a.button:hover::before{
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'><path d='M7 4h-2l-1 2h2l1-2zm2 0h9a1 1 0 0 1 .96 1.27l-1.8 7.2a3 3 0 0 1-2.92 2.23H9.4l-.64 2H5v-2h2.4l3.3-10H9L8 4zm-4 16a2 2 0 1 0 0-4 2 2 0 0 0 1 4zm12 0a2 2 0 1 0 0-4 2 2 0 0 0 1 4z'/></svg>");
}

/* Mobile: esconder carrinho */
@media(max-width:768px){
    body ul.products li.product a.button::before{
        display:none!important;
    }
}

/* ===============================================
   ESCONDER WISHLIST PADRÃO DO TI — SOMENTE LISTAGENS
   (não toca no produto individual)
================================================ */
body:not(.single-product) .tinvwl_add_to_wishlist,
body:not(.single-product) .tinvwl_add_to_wishlist_button,
body:not(.single-product) .tinvwl-loop-button-wrapper,
body:not(.single-product) .tinvwl_add_to_wishlist_container,
body:not(.single-product) .tinvwl_add_to_wishlist_button_add,
body:not(.single-product) .tinvwl_add_to_wishlist_button_exist{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    height:0!important;
    width:0!important;
}
body:not(.single-product) .tinvwl_add_to_wishlist *{
    display:none!important;
}

/* ===============================================
   CORAÇÃO SVG — FUNÇÃO WISHLIST NAS LISTAGENS
================================================ */
.custom-wishlist-heart{
    position:absolute;
    top:10px;
    right:12px;

    width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;

    cursor:pointer;
    z-index:200;

    color:var(--brand-orange);
    transition:transform .25s ease;
    background:none;
    border:none;
}

.custom-wishlist-heart svg{
    width:22px;
    height:22px;
    display:block;
}

.custom-wishlist-heart .heart-shape{
    fill:none;
    stroke:currentColor;
    stroke-width:1.6;
    transition:fill .25s ease,stroke .25s ease;
}

/* Hover (mesma animação que você tinha) */
.custom-wishlist-heart:hover{
    transform:scale(1.18);
    color:var(--brand-orange-dark);
}

/* Ativo */
.custom-wishlist-heart.active{
    transform:scale(1.25);
    color:var(--brand-orange-strong);
}
.custom-wishlist-heart.active .heart-shape{
    fill:currentColor;
    stroke:currentColor;
}
</style>


<script>
/* ==========================================================
   TI WISHLIST — CORAÇÃO SVG FUNCIONAL SOMENTE NAS LISTAGENS
========================================================== */
document.addEventListener("DOMContentLoaded",function(){

    function setupHeart(product){
        if(product.querySelector(".custom-wishlist-heart")) return;

        const realBtn = product.querySelector(
            "a.add_to_wishlist, \
             .tinvwl_add_to_wishlist_button, \
             .tinvwl-loop-button-wrapper a, \
             .tinvwl_add_to_wishlist a"
        );

        if(!realBtn) return;

        const heart=document.createElement("button");
        heart.type="button";
        heart.className="custom-wishlist-heart";
        heart.innerHTML=`
            <svg viewBox="0 0 24 24">
               <path class="heart-shape"
               d="M12 21s-6.5-4.7-9-8.2C-2 9.3 3 4 8 7c1.8 1 2 3 4 3s2.2-2 4-3c5-3 10 2.3 5 5.8-2.5 3.5-9 8.2-9 8.2z"/>
            </svg>
        `;

        /* Estado inicial */
        if(realBtn.classList.contains("tinvwl-product-in-list")){
            heart.classList.add("active");
        }

        /* Clique → aciona botão TI */
        heart.addEventListener("click",e=>{
            e.preventDefault();
            realBtn.click();
            heart.classList.toggle("active");
        });

        product.appendChild(heart);
    }

    function initAll(){
        document.querySelectorAll("body:not(.single-product) ul.products li.product")
        .forEach(setupHeart);
    }

    /* inicial */
    initAll();

    /* observar AJAX, filtros, paginação */
    const obs=new MutationObserver(initAll);
    obs.observe(document.body,{childList:true,subtree:true});
});
</script>




