/* ====================================
   BOUTONS
   ==================================== */

.btn,
.btn-green,
.btn-blue,
.btn-grey,
.btn-shop-brest,
.btn-shop-lorient,
.btn-cart,
.btn-payer,
.btn-auth,
.btn-save,
.btn-envoyer,
.btn-promo,
.btn-voir {
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease !important;
}

.btn:hover,
.btn-green:hover,
.btn-blue:hover,
.btn-grey:hover,
.btn-shop-brest:hover,
.btn-shop-lorient:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

.btn-cart:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(20, 122, 131, 0.3);
}

.btn-payer:hover,
.btn-auth:hover,
.btn-save:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(20, 122, 131, 0.25);
}

.btn-envoyer:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.btn-voir:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(20, 122, 131, 0.3);
}


/* ====================================
   CARTES PRODUITS
   ==================================== */

.product-card {
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
}

.product-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 32px rgba(20, 122, 131, 0.14) !important;
    border-color: #147a83 !important;
}

.product-card:hover .product-img img {
    transform: scale(1.05);
    transition: transform 0.35s ease;
}

/* Cartes "récemment consultés" */
.recently-card {
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
}

.recently-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 32px rgba(20, 122, 131, 0.14) !important;
}


/* ====================================
   LIENS DU MENU NAV
   ==================================== */

.menu a {
    position: relative;
    transition: color 0.2s ease;
}

/* Soulignement animé */
.menu a::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 50%;
    width: 0;
    height: 2px;
    background: #147a83;
    border-radius: 2px;
    transition: width 0.25s ease, left 0.25s ease;
}

.menu a:hover::after,
.menu a.menu-active::after {
    width: 100%;
    left: 0;
}

.menu a:hover {
    color: #147a83;
}


/* ====================================
   CERCLES CATÉGORIES
   ==================================== */

/* Accessoires */
.acc-cat-circle {
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.acc-cat-item:hover .acc-cat-circle {
    transform: scale(1.1) translateY(-3px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}

.acc-cat-item:hover span {
    background: #147a83;
    color: #fff;
    transition: background 0.2s ease, color 0.2s ease;
}

/* Pièces détachées */
.pieces-cat-circle {
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.pieces-cat-item:hover .pieces-cat-circle {
    transform: scale(1.1) translateY(-3px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}

.pieces-cat-item:hover span {
    background: #147a83;
    color: #fff;
    transition: background 0.2s ease, color 0.2s ease;
}



/* ====================================
   ICÔNES HEADER
   ==================================== */

.icons a {
    transition: transform 0.2s ease, color 0.2s ease;
    display: inline-flex;
}

.icons a:hover {
    transform: translateY(-2px);
    color: #147a83;
}

.icons a i {
    transition: color 0.2s ease;
}

.icons a:hover i {
    color: #ffffff;
}


/* ====================================
   LOGO
   ==================================== */

.logo img {
    transition: transform 0.25s ease;
}

.logo:hover img {
    transform: scale(1.04);
}


/* ====================================
   PARTENAIRES (LOGOS SLIDER)
   ==================================== */

.partner .logo-circle {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.partner:hover .logo-circle {
    transform: scale(1.08);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}


/* ====================================
   DÉSACTIVER SUR MOBILE (performances)
   ==================================== */

@media (max-width: 767px) {
    .product-card:hover {
        transform: none !important;
    }

    .btn:hover,
    .btn-cart:hover,
    .btn-payer:hover {
        transform: none !important;
        box-shadow: none !important;
    }
}