.elementor .elementor-2170101:hover {
    transform: translateY(-8px) !important; 
    cursor: pointer;
    box-shadow: 0 0px;
}

/* Mobile menu */
.mobile-menu-panel {
  position: fixed;
  top: 0;
  right: -100%;  
  width: 80%;    
  height: 100vh;
  background: #fff;
  z-index: 2000 !important;
  transition: right 0.3s ease !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.364) !important;
}

.mobile-menu-panel.open {
  right: 0;
}

.stickhead.scrolled {
  box-shadow: 0 2px 10px rgba(0,0,0,0.2) !important;
}

/* Le panier */
.elementor-cart__main,
.elementor-menu-cart__container {
  z-index: 150 !important;
}

/* La navbar */
#navbar,
.elementor-element.elementor-section:has(#navbar) {
  z-index: 90 !important;
}

.ce-product-name a {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}



/* ============================================================
   MODAL PANIER - LES PETITS FRUITS (FULL STYLE)
   ============================================================ */

/* 1. STRUCTURE GLOBALE & FOND */
#blockcart-modal .modal-content {
    border-radius: 20px;
    border: none;
    box-shadow: 0 15px 50px rgba(110, 63, 120, 0.2);
    overflow: hidden;
}

.modal-backdrop.show {
    opacity: 0.7;
    background-color: #3e2444; /* Overlay violet sombre */
}

/* 2. HEADER : TITRE ET BADGE ICONE */
#blockcart-modal .modal-header {
    background-color: #fdf7fe;
    border-bottom: 1px solid #eee;
    padding: 20px;
}

#blockcart-modal .modal-title {
    color: #6e3f78;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    text-transform: uppercase;
    font-size: 1.1rem;
    width: 100%;
}

/* Le petit badge circulaire avec le check */
#blockcart-modal .modal-title i {
    background: #6e3f78;
    color: #ffffff;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px !important;
    margin: 0;
}

/* 3. CORPS DE LA MODAL (PRODUIT & RÉCAP) */
#blockcart-modal .modal-body {
    padding: 30px;
}

#blockcart-modal .product-image {
    border-radius: 15px;
    max-width: 100%;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

#blockcart-modal .product-name {
    color: #6e3f78;
    font-weight: 800;
    font-size: 1.2rem;
    margin-bottom: 10px;
}

#blockcart-modal .divide-right {
    border-right: 2px solid #f5f5f5;
}

/* Résumé du panier */
#blockcart-modal .cart-content {
    padding-left: 20px;
}

#blockcart-modal .cart-products-count {
    font-weight: 700;
    color: #333;
    padding-bottom: 10px;
    border-bottom: 1px solid #f5f5f5;
}

#blockcart-modal .product-total {
    background: #fdf7fe;
    padding: 15px;
    border-radius: 10px;
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#blockcart-modal .product-total .label {
    font-weight: 800;
    color: #6e3f78;
}

#blockcart-modal .product-total .value {
    font-size: 1.3rem;
    color: #6e3f78;
    font-weight: 800;
}

/* 4. BOUTONS : ALIGNEMENT PARFAIT */
#blockcart-modal .cart-content-btn {
    display: flex;
    gap: 15px;
    margin-top: 30px;
    justify-content: center;
}

#blockcart-modal .btn {
    border-radius: 50px;
    padding: 14px 28px;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 13px;
    transition: all 0.3s ease;
    display: inline-flex;  /* Aligne icône et texte */
    align-items: center;   /* Centre verticalement */
    justify-content: center;
    line-height: 1;        /* Stabilise le texte */
    min-height: 50px;
}

/* Bouton secondaire (Continuer) */
#blockcart-modal .btn-secondary {
    background: white;
    color: #6e3f78;
    border: 2px solid #6e3f78;
    flex: 1;
}

#blockcart-modal .btn-secondary:hover {
    background: #fdf7fe;
    color: #6e3f78;
}

/* Bouton principal (Commander) */
#blockcart-modal .btn-primary {
    background: #6e3f78;
    color: white;
    border: 2px solid #6e3f78;
    flex: 1;
}

#blockcart-modal .btn-primary i {
    font-size: 20px;
    margin-right: 8px; /* Espace avec le texte "Commander" */
}

#blockcart-modal .btn-primary:hover {
    background: #5a3362;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(110, 63, 120, 0.3);
}

/* 5. RESPONSIVE MOBILE */
@media (max-width: 767px) {
    #blockcart-modal .divide-right {
        border-right: none;
        border-bottom: 2px solid #f5f5f5;
        padding-bottom: 20px;
        margin-bottom: 20px;
    }
    #blockcart-modal .cart-content-btn {
        flex-direction: column;
    }
}

/* ============================================================
   PANIER LATÉRAL (SIDE CART) - LES PETITS FRUITS
   ============================================================ */

/* 1. CONTENEUR PRINCIPAL */
.elementor-cart__main {
    padding: 25px !important;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Bouton de fermeture */
.elementor-cart__close-button {
    background-color: #fdf7fe;
    color: #6e3f78 !important;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.elementor-cart__close-button:hover {
    background-color: #6e3f78;
    color: #ffffff !important;
}

/* 2. LISTE DES PRODUITS */
.elementor-cart__products {
    margin-top: 20px;
    flex-grow: 1;
}

.elementor-cart__product {
    display: flex;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid #f5f5f5;
    position: relative;
    gap: 15px;
}

/* Image produit */
.elementor-cart__product-image img {
    border-radius: 12px;
    width: 70px !important;
    height: 70px !important;
    object-fit: cover;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

/* Nom du produit */
.elementor-cart__product-name a {
    color: #6e3f78 !important;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none;
    transition: opacity 0.3s;
}

.elementor-cart__product-name a:hover {
    opacity: 0.8;
}

/* Prix et Quantité */
.elementor-cart__product-price {
    font-size: 13px;
    color: #777;
    margin-top: 5px;
}

.elementor-cart__product-quantity {
    font-weight: 800;
    color: #333;
    background: #fdf7fe;
    padding: 2px 8px;
    border-radius: 5px;
    margin-right: 5px;
}

/* Bouton supprimer (la petite croix) */
.elementor-cart__product-remove {
    color: #ff4d4d !important;
    font-size: 18px;
    cursor: pointer;
    transition: transform 0.2s;
}

.elementor-cart__product-remove:hover {
    transform: scale(1.2);
}

/* 3. RÉSUMÉ (TOTAL) */
.elementor-cart__summary {
    background-color: #fdf7fe;
    border-radius: 15px;
    padding: 20px;
    margin: 20px 0;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
}

.elementor-cart__summary-label {
    color: #777;
    font-size: 14px;
}

.elementor-cart__summary-value {
    color: #333;
    font-weight: 700;
    text-align: right;
}

/* Le Total final */
strong.elementor-cart__summary-label, 
strong.elementor-cart__summary-value {
    color: #6e3f78 !important;
    font-size: 18px;
    font-weight: 800;
    margin-top: 5px;
    border-top: 1px solid #eee;
    padding-top: 10px;
}

/* 4. BOUTONS DU BAS */
.elementor-cart__footer-buttons {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.elementor-cart__footer-buttons .elementor-button {
    border-radius: 50px !important;
    padding: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s ease;
    text-align: center;
    font-size: 13px;
}

/* Bouton Voir le panier */
.elementor-button--view-cart {
    background-color: white !important;
    color: #6e3f78 !important;
    border: 2px solid #6e3f78 !important;
}

.elementor-button--view-cart:hover {
    background-color: #fdf7fe !important;
}

/* Bouton Commander */
.elementor-button--checkout {
    background-color: #6e3f78 !important;
    color: white !important;
    border: 2px solid #6e3f78 !important;
}

.elementor-button--checkout:hover {
    background-color: #5a3362 !important;
    box-shadow: 0 8px 20px rgba(110, 63, 120, 0.3);
    transform: translateY(-2px);
}

/* Customisation de la scrollbar pour le panier */
.ce-scrollbar-y--auto::-webkit-scrollbar {
    width: 5px;
}
.ce-scrollbar-y--auto::-webkit-scrollbar-track {
    background: #f1f1f1;
}
.ce-scrollbar-y--auto::-webkit-scrollbar-thumb {
    background: #6e3f78;
    border-radius: 10px;
}

a:focus {
    outline: none !important;
}

/* Uniquement le contenant de la carte */
.elementor-top-column.card-qsn {
    background-color: #ffffff !important;
    border: 1px solid #f2eae1 !important;
    border-radius: 24px !important; /* Arrondis doux de la page d'accueil */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03) !important;
    padding: 40px 30px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    margin: 0 15px !important; /* Ajoute 15px d'espace de chaque côté de chaque carte (soit 30px d'écart au milieu) */
}

/* Uniquement l'effet de soulèvement au survol */
.elementor-top-column.card-qsn:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 15px 35px rgba(128, 25, 45, 0.06) !important; /* Discret reflet bordeaux sous la carte */
}

/* Ajustement de l'espace interne sans toucher au style du texte */
.card-qsn .elementor-column-wrap,
.card-qsn .elementor-widget-wrap {
    padding: 0 !important;
    margin: 0 !important;
}

/* ==========================================================================
   DESIGN DES ONGLETS PRODUIT (STYLE ÉPURÉ - HORIZONTAL)
   ========================================================================== */

/* 1. Conteneur global de la barre d'onglets */
.elementor-tabs-wrapper {
    display: flex;
    border-bottom: 2px solid #69335a; /* Ligne de base aubergine sous tous les onglets */
    gap: 5px; /* Léger espace entre les onglets */
}

/* 2. Style général de chaque onglet (par défaut / inactif) */
.elementor-tabs .elementor-tab-desktop-title {
    background-color: #fcf6f2; /* Fond crème très léger pour les onglets en arrière-plan */
    border: 1px solid #e9dfd6;
    border-bottom: none; /* On enlève la bordure basse pour qu'elle repose sur la ligne aubergine */
    border-radius: 6px 6px 0 0; /* Arrondis subtils uniquement en haut */
    padding: 12px 25px !important;
    transition: all 0.3s ease;
}

/* Style du lien/texte à l'intérieur de l'onglet */
.elementor-tabs .elementor-tab-desktop-title a {
    color: #8c7685 !important; /* Couleur de texte plus discrète pour les onglets inactifs */
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase; /* Majuscules élégantes */
    letter-spacing: 0.5px;
    text-decoration: none !important;
    transition: color 0.3s ease;
}

/* 3. Comportement au Survol (Hover) */
.elementor-tabs .elementor-tab-desktop-title:hover {
    background-color: #f5eae1;
}
.elementor-tabs .elementor-tab-desktop-title:hover a {
    color: #69335a !important; /* Le texte s'assombrit au survol */
}

/* 4. ÉTAT ACTIF (L'onglet sélectionné) */
.elementor-tabs .elementor-tab-desktop-title.elementor-active {
    background-color: #69335a; /* Devient aubergine uni pour bien ressortir */
    border-color: #69335a;
    position: relative;
    z-index: 2;
}

.elementor-tabs .elementor-tab-desktop-title.elementor-active a {
    color: #ffffff !important; /* Écriture blanche sur fond aubergine */
}

/* 5. Conteneur du grand bloc de contenu en dessous */
.elementor-tabs-content-wrapper {
    background-color: #ffffff;
    border: 1px solid #e9dfd6;
    border-top: none; /* Jointure propre avec la ligne supérieure */
    border-radius: 0 0 6px 6px;
    box-shadow: 0 4px 15px rgba(105, 51, 90, 0.03); /* Très légère ombre aubergine diffuse */
}

/* Style des textes internes */
.elementor-tabs .elementor-tab-content {
    padding: 30px;
    color: #4a4a4a;
    font-size: 15px;
    line-height: 1.6;
}

/* ==========================================================================
   RESPONSIVE (Bascule en accordéon natif Elementor sur Mobile)
   ========================================================================== */
@media (max-width: 767px) {
    .elementor-tabs-wrapper {
        display: none; /* Masque les onglets horizontaux sur mobile */
    }
    
    .elementor-tabs .elementor-tab-mobile-title {
        background-color: #fcf6f2;
        border-bottom: 1px solid #e9dfd6 !important;
        color: #69335a !important;
        font-weight: 700;
        text-transform: uppercase;
        padding: 15px 20px !important;
    }
    
    .elementor-tabs .elementor-tab-mobile-title.elementor-active {
        background-color: #69335a;
        color: #ffffff !important;
    }
    
    .elementor-tabs-content-wrapper {
        border-top: 1px solid #e9dfd6;
    }
}