.nav a {
    transition: 0.3s ease-in-out; 
}

.nav a:hover{
    color: rgb(61, 214, 112);
}

.active{
    color: rgb(61, 214, 112);
}

footer + div{
    z-index: 0;
}

/* Onion Nexus styles: src/css/onion-nexus.css (linked in HTML) */

/* Styles pour l'icône du panier sur mobile */
#mobile-cart-icon {
    display: none;
}

@media (max-width: 1023px) {
    #mobile-cart-icon {
        display: flex;
    }
}

.cart-count {
    display: none;
}

ul.nav li {
    position: relative;
}

.cart-count-badge {
    position: absolute;
    top: -4px;
    right: -10px;
    background-color: #dc3545;
    color: white;
    border-radius: 50%;
    min-width: 20px;
    height: 20px;
    padding: 0 4px;
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: bold;
    line-height: 1;
    box-sizing: border-box;
    pointer-events: none;
}

/* Boutons Add to Cart (toutes les pages produits) */
button[onclick^="addToCart("],
button.add-to-cart-btn {
    cursor: pointer;
    transition:
        background-color 0.25s ease,
        transform 0.2s ease,
        box-shadow 0.25s ease,
        filter 0.2s ease;
}

button[onclick^="addToCart("]:hover,
button.add-to-cart-btn:hover {
    background-color: rgb(22, 101, 52) !important;
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 8px 20px rgba(22, 101, 52, 0.35);
    filter: brightness(1.05);
}

button[onclick^="addToCart("]:active,
button.add-to-cart-btn:active {
    transform: translateY(0) scale(0.98);
    box-shadow: 0 3px 8px rgba(22, 101, 52, 0.25);
}

button[onclick^="addToCart("]:focus-visible,
button.add-to-cart-btn:focus-visible {
    outline: 2px solid rgb(61, 214, 112);
    outline-offset: 2px;
}

@media (max-width: 1023px) {
    /* Bloc prix / select / bouton produit — centré sur mobile */
    section.flex.flex-col.gap-2.mt-10 > .text-center,
    section.flex.flex-col.gap-2.mt-10 > .flex.flex-col {
        align-items: center;
        width: 100%;
        text-align: center;
    }

    section.flex.flex-col.gap-2.mt-10 .text-center.flex.flex-col {
        align-items: center;
    }

    button[onclick^="addToCart("],
    button.add-to-cart-btn {
        margin-left: auto;
        margin-right: auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}


.hero-slider__dots {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    gap: 0.5rem;
}

.hero-slider__dot {
    width: 0.4rem;
    height: 0.4rem;
    padding: 0;
    border: none;
    border-radius: 9999px;
    background-color: rgba(255, 255, 255, 0.45);
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.hero-slider__dot--active {
    background-color: rgb(87, 121, 222);
    transform: scale(1.2);
}


.tags > a:hover{
    color: rgb(87, 121, 222);
}


img {
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
    user-select: none;
}

div{
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
    user-select: none;
}


.seo{
    opacity: 0;
    display: none;
    color: white;
}

/* Styles pour l'icône du panier sur mobile - version améliorée */
#mobile-cart-icon {
    position: fixed !important;
    bottom: 80px !important;
    right: 16px !important;
    background-color: #065f46 !important;
    color: white !important;
    border-radius: 50% !important;
    width: 60px !important;
    height: 60px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3) !important;
    z-index: 9999 !important;
    cursor: pointer !important;
    font-size: 24px !important;
}

.cart-count {
    position: absolute !important;
    top: -5px !important;
    right: -5px !important;
    background-color: #ef4444 !important;
    color: white !important;
    border-radius: 50% !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    font-weight: bold !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

/* Media query pour afficher l'icône sur mobile uniquement */
@media (max-width: 1023px) {
    #mobile-cart-icon {
        display: flex;
    }
}

/* Cacher l'icône sur desktop */
@media (min-width: 1024px) {
    #mobile-cart-icon {
        display: none !important;
    }
}