/* Remoção suave de item do carrinho */
.fade-out {
    animation: fadeOut 300ms ease forwards;
}
@keyframes fadeOut {
    from { opacity: 1; transform: translateY(0); }
    to { opacity: 0; transform: translateY(8px); }
}
/* ========================================
   NATAL NA DOLCE DIVINO
   Estilos Personalizados
======================================== */

/* Scroll Suave */
html {
    scroll-behavior: smooth;
}

/* Estilo da Logo */
nav img {
    transition: all 0.3s ease;
}

nav img:hover {
    transform: scale(1.05);
    filter: drop-shadow(0 4px 8px rgba(180, 83, 9, 0.3));
}

/* Background Pattern Natalino */
body {
    background-color: #fefce8;
    background-image: 
        radial-gradient(at 20% 30%, rgba(251, 191, 36, 0.05) 0px, transparent 50%),
        radial-gradient(at 80% 70%, rgba(217, 119, 6, 0.05) 0px, transparent 50%);
}

/* Animação Fade In */
.fade-in {
    animation: fadeIn 0.3s ease-in;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Estilo da Scrollbar do Carrinho */
.cart-scroll::-webkit-scrollbar {
    width: 6px;
}

.cart-scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.cart-scroll::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 3px;
}

.cart-scroll::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Feedback Visual ao Adicionar no Carrinho */
.btn-added {
    animation: btnPulse 0.6s ease-in-out;
    background: linear-gradient(to right, #16a34a, #15803d) !important;
}

@keyframes btnPulse {
    0% { 
        transform: scale(1);
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    }
    50% { 
        transform: scale(1.05);
        box-shadow: 0 20px 25px -5px rgba(22, 163, 74, 0.4), 0 10px 10px -5px rgba(22, 163, 74, 0.2);
    }
    100% { 
        transform: scale(1);
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    }
}

/* Melhorias Mobile - Áreas de Toque */
@media (max-width: 768px) {
    button, a, .cursor-pointer {
        min-height: 44px;
        min-width: 44px;
    }
}