/*
    -------------------------------------------
    ESTILOS GERAIS & MODAL (Mantidos)
    -------------------------------------------
*/
.evo-modal-wrap{position:fixed;inset:0;background:rgba(2,6,23,.55);z-index:99999;padding:20px;display:flex;align-items:center;justify-content:center;}
.evo-modal-card{max-width:460px;width:90%;background:#f9f9f9;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 20px 50px rgba(2,6,23,.25);padding:18px 18px 16px;position:relative;}
.evo-modal-x{position:absolute;right:10px;top:10px;background:transparent;border:0;font-size:22px;line-height:1;cursor:pointer;color:#6b7280}
.evo-modal-x:hover{color:#111827}
.evo-modal-titulo{margin:6px 0 4px;font-size:20px;font-weight:700;color:#111827;margin-bottom: 20px;}
.evo-modal-sub{margin:0 0 12px;color:#4b5563;font-size:14px}
.evo-label{color:#374151;font-size:13px;display:block;margin-bottom: 8px;}
.evo-input{width:100%;max-width: 400px;padding:12px 14px;border:1px solid #d1d5db;border-radius:10px;background:#fefefe;color:#111827;outline:none;margin-bottom:20px;}
.evo-input:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12)}
.evo-modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;}
.evo-btn{border:1px solid transparent;border-radius:12px;padding:11px 16px;font-weight:700;cursor:pointer;line-height:1;display:inline-flex;align-items:center;gap:10px}
.evo-btn-sec{background:#f3f4f6;border-color:#e5e7eb;color:#111827}
.evo-btn-sec:hover{background:#e5e7eb}
.evo-btn-pri{background:#22c55e;color:#fff}
.evo-btn-pri:hover{background:#16a34a}
.evo-btn-pri .evo-ico img{width:18px;height:18px;display:block}

#evo-modal-interesses { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
#evo-modal-interesses p { flex-basis: 100%; margin: 0 0 12px; }
#evo-modal-interesses label { display: inline-flex; align-items: center; margin: 0; white-space: nowrap; }

.evo-toast-wrap{position: fixed;inset: 0;z-index: 99999;display: flex;justify-content: center;align-items: center;flex-direction: column;pointer-events: none;padding: 20px;}
.evo-toast{min-width: 240px;max-width: 360px;background: #111827;color: #fff;padding: 10px 12px;border-radius: 12px;box-shadow: 0 10px 25px rgba(0,0,0,.25);font-weight: 600;font-size: 14px;opacity: 0;transform: scale(0.9);animation: evoToastIn .3s cubic-bezier(.25,.8,.25,1) forwards;}
@keyframes evoToastIn{from{opacity:0;transform: scale(0.9);}to{opacity:.98;transform: scale(1);}}

@media only screen and (max-width: 767px) { .evo-modal-card { top: -5%; } }
@media only screen and (min-width: 768px) { .evo-modal-card { max-width: 460px; } .evo-input { max-width: 400px; } }

/* ==========================================================================
   BOTÃO PILL & BOTÃO CARD (Design Aprovado)
   ========================================================================== */
.wpp-pill, .wpp-card-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 10px !important;
    border: none !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    font-weight: 700 !important;
    background-image: linear-gradient(to bottom, rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.1) 100%) !important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.2) !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.wpp-pill { border-radius: 10px !important; }
.wpp-card-btn { border-radius: 8px !important; /*width: 100% !important;*/ margin-top: 15px !important; }

.wpp-card-text { display: block; text-align: left; line-height: 1.2 !important; }
.wpp-card-text br { display: block; content: ""; margin-top: 2px; }

/* FORÇAR REMOÇÃO DO PILL NAS CATEGORIAS */
/*.archive .wpp-pill, .product-category .wpp-pill, .shop-page .wpp-pill, .related.products .wpp-pill, .upsells.products .wpp-pill {
    display: none !important;
}*/

/* ==========================================================================
   BOTÃO BUBBLE (FLUTUANTE) - FIEL AO ORIGINAL COM CORES DINÂMICAS
   ========================================================================== */
#evo-bubble-notificar {
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    z-index: 9999 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    display: none; /* Controlado pelo JS */
    align-items: center !important;
    justify-content: center !important;
    padding: 6px !important;
    border-radius: 999px !important; /* Formato Circular */
    box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

#evo-bubble-notificar:hover {
    transform: scale(1.1) !important;
    filter: brightness(110%) !important;
}

#evo-bubble-notificar img {
    display: block !important;
    object-fit: contain !important;
    border-radius: 50% !important;
}

/* Se houver label no flutuante */
#evo-bubble-notificar.wpp-has-label {
    padding: 10px 20px !important;
    border-radius: 50px !important;
}

#evo-bubble-notificar.wpp-has-label .wpp-float-label {
    margin-left: 10px;
    font-weight: 700;
    white-space: nowrap;
    color: inherit;
}

/* ==========================================================================
   BOTÃO PILL & BOTÃO CARD (Design Aprovado e Corrigido)
   ========================================================================== */

/* Estilos compartilhados */
.wpp-pill, .wpp-card-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    font-weight: 700 !important;
    background-image: linear-gradient(to bottom, rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.1) 100%) !important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.15), inset 0 1px 0 rgba(255,255,255,0.2) !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

/* --- Botão Pill (Padrão) --- */
.wpp-pill {
    padding: 5px 10px !important;
    border-radius: 10px !important;
}

/* --- Botão Card (Ajuste de Elegância) --- */
.wpp-card-btn {
    border-radius: 8px !important;
    margin-top: 15px !important;
    
    /* Layout Flexbox para alinhar Ícone + Texto */
    display: flex !important;
    flex-direction: row !important; /* Garante lado a lado */
    align-items: center !important; /* Centraliza verticalmente */
    justify-content: center !important; /* Centraliza o bloco todo no botão */
    gap: 12px !important; /* Espaço elegante entre ícone e texto */
    
    /* Preenchimento e Largura */
    padding: 10px 20px !important;
    width: 100% !important; /* Ocupa a largura do container do Woo */
    max-width: 100%;
}

/* Container do Ícone (Evita distorção) */
.wpp-card-icon-wrap {
    flex-shrink: 0 !important; /* IMPEDE que o ícone seja esmagado */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 0 !important;
}

/* O Ícone em si (Imagem ou SVG) */
.wpp-card-icon, 
.wpp-card-icon-wrap img, 
.wpp-card-icon-wrap svg {
    object-fit: contain !important; /* Mantém a proporção real */
    display: block !important;
    /* Removemos width/height fixos aqui pois o PHP já injeta o tamanho inline, 
       mas o object-fit garante que não distorça */
}

/* Texto do Botão */
.wpp-card-text { 
    display: block; 
    text-align: left !important; /* Texto alinhado à esquerda (próximo ao ícone) */
    line-height: 1.2 !important; 
    flex-grow: 1; /* Ocupa o espaço restante se necessário */
}

/* Ajuste fino para quebra de linha no texto */
.wpp-card-text br { 
    display: block; 
    content: ""; 
    margin-top: 2px; 
}

/* ==========================================================================
   CORREÇÃO MOBILE (CELULARES) - FINAL
   - Centraliza o texto
   - Remove espaços em branco excessivos (Squash)
   ========================================================================== */
@media only screen and (max-width: 600px) {
    
    .wpp-card-btn {
        /* Reduz o preenchimento interno */
        padding: 6px 8px !important; 
        gap: 6px !important;
        
        /* [IMPORTANTE] Reduz o espaço acima do botão (era 15px) */
        margin-top: 5px !important; 
    }

    .wpp-card-text {
        /* Força alinhamento central */
        text-align: center !important;
        
        /* Fonte menor para caber */
        font-size: 13px !important; 
        line-height: 1.1 !important; 
        
        /* Garante centralização do bloco */
        width: auto !important;
        flex-grow: 0 !important;
    }

    /* Reduz ícone */
    .wpp-card-icon-wrap img, 
    .wpp-card-icon-wrap svg {
        width: 20px !important; 
        height: 20px !important;
    }

    /* [NOVO] ESMAGA O ESPAÇO DO WOOCOMMERCE 
       Isso remove a margem excessiva abaixo do Título e do Preço/Badges */
    .woocommerce ul.products li.product .woocommerce-loop-product__title,
    .woocommerce ul.products li.product .price,
    .woocommerce ul.products li.product .wpp-badges { /* Se houver badges */
        margin-bottom: 4px !important;
        padding-bottom: 0 !important;
    }
}