/* 
Theme Name:		Créations Mira'Belle
Theme URI:		https://www.creations-mirabelle.fr
Description:	Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author:			Scarlett Odorico
Author URI:		https://www.scarlettohlala.fr/
Template:		hello-elementor
Version:		1.0.0
Text Domain:	hello-elementor-child
Tags:           flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*--------------------------------------------------------------
# Polices
--------------------------------------------------------------*/

.delete-margin-para p:last-child {
    margin-bottom: 0!important;
}


/*Titre appel à l'action surligné en rouge*/

.categories-titres-highlight {
    background-color: var(--e-global-color-primary);
    padding: 4px 8px;
    line-height: 2em;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.loop-conteneur-survol-anim:hover .categories-titres-highlight {
    box-shadow: 5px 5px var(--e-global-color-d66f91f);
}


/*--------------------------------------------------------------
# Bords festonnés
--------------------------------------------------------------*/

/*----- Bords festonnés bas -----*/

.bords-festonnes-bas {
  --mask: 
    linear-gradient(0,#0000 80px,#000 0),
    radial-gradient(80px,#000 calc(100% - 1px),#0000) bottom/130px 160px;
  -webkit-mask: var(--mask);
          mask: var(--mask);
}

/*----- Bords festonnés haut -----*/

.bords-festonnes-haut {
--mask: 
    linear-gradient(180deg,#0000 80px,#000 0),
    radial-gradient(80px,#000 calc(100% - 1px),#0000) top/148px 160px;
  -webkit-mask: var(--mask);
          mask: var(--mask);
}

/*--------------------------------------------------------------
# Boutons
--------------------------------------------------------------*/

/*----- Boutons : ombres avec survol -----*/

/*Couleur rose bubblegum - survol rose pop */

.bouton-shadow-1 .elementor-button {
    box-shadow: 7px 7px var(--e-global-color-d66f91f);
}

.bouton-shadow-1 .elementor-button:hover {
    box-shadow: 7px 7px var(--e-global-color-accent);
}


/*Couleur rouge baiser - survol rose bubblegum */

.bouton-shadow-2 .elementor-button {
    box-shadow: 7px 7px var(--e-global-color-primary);
}

.bouton-shadow-2 .elementor-button:hover {
    box-shadow: 7px 7px var(--e-global-color-d66f91f);
}

/*--------------------------------------------------------------
# Icônes
--------------------------------------------------------------*/

/*----- Animation icones coeur pulse -----*/

.icone-coeur-pulse .icon {
        animation: icone-coeur-pulse-anim 2s infinite;
}

@keyframes icone-coeur-pulse-anim {
    0% {
        transform: scale(0.7);
    }

    50% {
        transform: scale(1);
    }

    100% {
        transform: scale(0.7);
    }
}

/*--------------------------------------------------------------
# Bandeaux défilants - +feuille js dans le child thème
--------------------------------------------------------------*/

/*--- Div principale pour un alignement à l'horizontal ---*/

.defilant {
    overflow: hidden;  !important;
}

.defilant div {
    display: inline-block;
}


/*--- Défilant Karla - 16 ---*/

/*Style du texte*/

.defilant-contenu-karla-16, .defilant-contenu-karla-16 a {
font-family: var(--e-global-typography-b1a63c2-font-family), Sans-serif;
    font-size: var(--e-global-typography-b1a63c2-font-size);
    font-weight: var(--e-global-typography-b1a63c2-font-weight);
    color: var( --e-global-color-89e5287 );
}

/*Style des images coeur*/

.defilant-contenu-karla-16 .icon {
    font-size: 12px;
    color: var( --e-global-color-primary );
    margin-right: 40px;
    margin-left: 40px;
}

/*--- Défilant Karla - 18 ---*/

/*Style du texte*/

.defilant-contenu-karla-18, .defilant-contenu-karla-18 a {
    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);
    line-height: var(--e-global-typography-text-line-height);
    color: var( --e-global-color-89e5287 );
}

/*Style des images coeur*/

.defilant-contenu-karla-18 .icon {
    font-size: 12px;
    color: var( --e-global-color-primary );
    margin-right: 40px;
    margin-left: 40px;
}

/*--- Animation défilant par la droite ---*/

.defilant-droite {
    white-space: nowrap;
    animation: defilant-droite-anim 45s linear infinite;
}

@keyframes defilant-droite-anim {
    0% {
        margin-left: 0;
    }
    100% {
        margin-left: -50%;
    }
}

/*--- Animation défilant par la droite ---*/

.defilant-gauche {
    white-space: nowrap;
    animation: defilant-gauche-anim 45s linear infinite;
    animation-direction: reverse;
}

@keyframes defilant-gauche-anim {
    0% {
        margin-left: 0;
    }
    100% {
        margin-left: -50%;
    }
}

/*--------------------------------------------------------------
# Lightbox - Personnaliser la lightbox pour l'affichage des produits Woocommerce
--------------------------------------------------------------*/

/* Changer l'arrière-plan de la lightbox et de la toolbar */

.pswp__bg,
.pswp__top-bar {
    background-color:var( --e-global-color-2671874 )!important; /*Fond rose très clair*/
}

/*--- Style de la barre supérieure ---*/

/* Top bar toujours visible, même au clic sur mobile*/

.pswp__ui--hidden .pswp__top-bar {
    opacity:1!important;
}

/*Compteur en noir*/

.pswp__counter {
    color:#181818!important;
    font-size: 16px!important;
    font-weight: 600!important;
}

/*Icônes images en noir au lieu de blanc*/

.pswp__button--close,
.pswp__button--share,
.pswp__button--fs,
.pswp__button--zoom {
    filter: invert(100%)!important;
}

/* Opacité des icônes */

.pswp__button {
    opacity: 1 !important;
}

/* Style de la légende (caption) */
.pswp__caption {
    background: var( --e-global-color-2671874 )!important; /*Fond rose très clair*/
    color: #181818!important; /*Texte noir*/
    padding: 10px;
    border-top: 1px solid #A3A3A3!important; /*Bordure gris foncée*/
}

.pswp__caption__center {
    color: #181818!important; /*Texte noir*/
    font-family: var(--e-global-typography-b1a63c2-font-family), Sans-serif!important;
    font-size: var(--e-global-typography-b1a63c2-font-size)!important;
    font-weight: var(--e-global-typography-b1a63c2-font-weight)!important;
    line-height: var(--e-global-typography-b1a63c2-line-height)!important;
    text-align:center!important;
}

/* Style des flèches noires bordure noire */

button.pswp__button--arrow--left:before,
button.pswp__button--arrow--right:before {
    color:#181818!important;
    width: 50px!important;
    height: 50px!important;
    border: 1px solid #181818!important;
    border-radius: 50%!important;
    align-content: center;
}

/*Taille des flèches sur mobile*/

@media (max-width: 767px) {
    button.pswp__button--arrow--left:before,
    button.pswp__button--arrow--right:before {
    width: 35px!important;
    height: 35px!important;
    }
}

/* Remplacer par l'icône LSF */
button.pswp__button--arrow--left:before {
    content: '\e806'!important;
    font-family: "creationsmirabelle-pack-icones"!important;
    font-style: normal!important;
    font-weight: normal!important;
    background-image:none!important;
}

button.pswp__button--arrow--right:before {
    content: '\e807'!important;
    font-family: "creationsmirabelle-pack-icones"!important;
    font-style: normal!important;
    font-weight: normal!important;
    background-image:none!important;
}

/*Espacement des flèches sur ordinateur et tablette*/

@media (min-width: 768px) {
    button.pswp__button--arrow--left {
        left:2%!important;
    }

    button.pswp__button--arrow--right {
        right:2%!important;
    }
}

/*Espacement des flèches sur mobile*/

@media (max-width: 767px) {
    button.pswp__button--arrow--left {
        left:1%!important;
    }

    button.pswp__button--arrow--right {
        right:1%!important;
    }
}

/* Effet au survol */

.pswp__button--arrow--left:hover:before:not(:active),
.pswp__button--arrow--right:hover:before:not(:active) {
    background-color: rgba(255, 255, 255, 0.7) !important;
    transition: background-color 0.1s ease !important;
}

/* Lorsque le bouton est actif (clic en cours) */
.pswp__button--arrow--left:active:before,
.pswp__button--arrow--right:active:before {
    background-color: rgba(255, 255, 255, 0.9) !important; /* Option : accentuer au clic */
    transition: none; /* Pas d'animation pour l'effet de clic */
    transform: translateX(-3px); /* Décale vers la gauche ou la droite */
    transition: transform 0.1s ease;
}

/* Retirer l'effet lorsqu'il n'est plus survolé */
.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before {
    background-color: transparent !important;
    transition: background-color 0.2s ease !important;
}

/*Rendre les flèches visibles sur mobile*/

.pswp--touch .pswp__button--arrow--left,
.pswp--touch .pswp__button--arrow--right {
    visibility:visible!important;
}

/*Supprimer le fond gris autour des flèches au clic sur safari (mobile)*/

.pswp__button--arrow--left,
.pswp__button--arrow--right {
    -webkit-tap-highlight-color: transparent!important; /* Désactive l'effet surligné */
    outline: none!important; /* Supprime tout contour visible */
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

/*----- Passer le menu en pleine hauteur pour que le sous-menu s'aligne en bas -----*/

#header-menu-ordi {
    height: 100%!important;
}

#header-menu-ordi .elementor-nav-menu--layout-horizontal {
    display: flex;
    height: 100% !important;
}

/*Personnaliser le sous-menu*/

#header-menu-ordi .sub-menu {
    padding : 20px 30px!important;
}

#header-menu-ordi .elementor-nav-menu--dropdown a {
    border:none!important;
}

/*Chevron menu déroulant*/

#header-menu-ordi .sub-arrow .icon {
    font-size:11px;

}

/*Séparateur sous-menu*/

#header-menu-ordi .sousmenu-separation {
    border-top:1px solid var(--e-global-color-663c0cc)!important;
    margin-top:7px!important;
    padding-top:7px!important;
}

/*----- Header sticky on scroll -----*/

/*Réduire la taille du header*/

.header-sticky.elementor-sticky--effects {
    min-height: 60px;
    transition: min-height .45s cubic-bezier(.4, 0, .2, 1);
    -webkit-transition: min-height .45s cubic-bezier(.4, 0, .2, 1);
    -moz-transition: min-height .45s cubic-bezier(.4, 0, .2, 1);
}

/*Réduire la taille du logo*/
.header-sticky.elementor-sticky--effects .header-logo img {
    transform: scale(.8);
    transition: all .45s cubic-bezier(.4, 0, .2, 1);
    -webkit-transition: all .45s cubic-bezier(.4, 0, .2, 1);
    -moz-transition: all .45s cubic-bezier(.4, 0, .2, 1);
}

/*----- Menu ordi : une partie à droite, une partie à gauche - Classes css ajoutées dans l'apparence Wordpress > Menus -----*/

.header-menu-ordi-gauche .item-ordi-droite {
    display:none!important;
    
}

.header-menu-ordi-droite .item-ordi-gauche {
    display:none!important;
    
}

/*----- Modifier les icônes -----*/

/*Icône panier*/

.header-panier .elementor-menu-cart__toggle_button {
    line-height: 0!important;
    padding: 0!important;
}

.header-panier .elementor-button-icon-qty {
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;
    min-width: auto!important;
    position:absolute;
    left:0; !important;
    right:0!important;
    top: 35%!important;
    font-family: "Karla", Sans-serif!important;
}

/*Widget Icônes*/

.header-icon .elementor-icon {
    vertical-align: middle !important;
    display: block!important;
}

/*--------------------------------------------------------------
# Page d'accueil
--------------------------------------------------------------*/

/*----- Section hero : appel à l'action -----*/

/*Largeur et animation */

@media screen and (min-width: 1024px) {
    .accueil-hero .elementor-cta__content {
        max-width: var(--container-max-width)!important;
        margin: auto !important;

    }
}

.accueil-hero .elementor-cta__content {
    animation: accueil-hero-fadeInUp ease 2s;
    -webkit-animation: accueil-hero-fadeInUp ease 2s;
    -moz-animation: accueil-hero-fadeInUp ease 2s;
    -o-animation: accueil-hero-fadeInUp ease 2s;
    -ms-animation: accueil-hero-fadeInUp ease 2s;
}

@keyframes accueil-hero-fadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

/*Bouton*/

.accueil-hero .elementor-cta__button {
    box-shadow: 7px 7px var(--e-global-color-d66f91f);
}

.accueil-hero .elementor-cta__button:hover {
    box-shadow: 7px 7px var(--e-global-color-accent);
}

/*Ajout d'un Background noir pour une meilleure lisibilité sur fond clair*/

/*Sur ordi et tablette*/

@media (min-width: 768px) {
    .accueil-hero .elementor-cta__bg-overlay {
        background:  linear-gradient(45deg,rgba(0, 0, 0, 0.4) 0%, transparent 50%);
    }
}

/*Sur mobile*/

@media (max-width: 767px) {
        .accueil-hero .elementor-cta__bg-overlay {
        background:  linear-gradient(360deg,rgba(0, 0, 0, 0.4) 0%, transparent 60%);
    }
}


/*----- Section À propos de la marque -----*/

/*Logo secondaire : rotation infinie*/

.accueil-logo-secondaire-rotation img {
    animation: accueil-logo-rotate 12s linear infinite;
}

@keyframes accueil-logo-rotate {
  from {
      transform: rotate(0deg);
  }
  to {
      transform: rotate(360deg);
      
  }
}

/*--------------------------------------------------------------
# Page d'accueil - Loop grid Collections - Avec ajout d'un center focus via js
--------------------------------------------------------------*/

/*----- Loop grid : Animation zoom Image au survol -----*/


/*Cacher le dépasser du conteneur lors de l'animation zoom au survol*/
.loop-conteneur-survol-anim {
  overflow: hidden!important;
}

/*Animation zoom au survol de l'image*/
.loop-img-survol-anim img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 4s ease; /* Transition douce sur 5000ms */
}

.loop-img-survol-anim:hover img {
  transform: scale(1.1);
}

/*Ombre colorée sur le titre lors du survol du conteneur complet*/
.loop-conteneur-survol-anim:hover .loop-titre-survol-anim {
    box-shadow: 5px 5px var(--e-global-color-d66f91f);
}

/*--------------------------------------------------------------
# Page contact
--------------------------------------------------------------*/

/*Apparence de la phrase RGPD case à cocher*/

.contact-formulaire .elementor-field-type-acceptance a {
    color: var(--e-global-color-primary)!important;
}

/*--------------------------------------------------------------
# Woocommerce - Liste de produits Woocommerce - Grille alternée
--------------------------------------------------------------*/

/*----- Liste de produits - Grille alternée 3 puis 4 produits -----*/

/*Ordinateur et Tablette*/

@media (min-width: 768px) {
    
    .woo-liste-produits-grille-alternee .products {
        grid-template-columns: repeat(12, 1fr)!important; /* Ma grille fait 12 colonnes */
    }
    
 
    .woo-liste-produits-grille-alternee .products li {
        grid-column: span 4!important;    /* Par défaut, chaque produit occupe 4 colonnes - C'est à dire 4 colonnes x 3 produits = 12 colonnes */
    }
    
    .woo-liste-produits-grille-alternee .products li:nth-child(7n), /* Mon 7ème produit occupe 3 colonnes */
    .woo-liste-produits-grille-alternee .products li:nth-child(7n-3),  /* Mon 6ème produit occupe 3 colonnes */
    .woo-liste-produits-grille-alternee .products li:nth-child(7n-2),  /* Mon 5ème produit occupe 3 colonnes */
    .woo-liste-produits-grille-alternee .products li:nth-child(7n-1)  /* Mon 4ème produit occupe 3 colonnes */
    {
        grid-column: span 3!important; /* Donc les produits 4, 5, 6 et 7 occupent chacun 3 colonnes x 4 produits = 12 colonnes */
    }
}

/*Mobile*/

@media (max-width: 767px) {
    
    .woo-liste-produits-grille-alternee .products {
        grid-template-columns: repeat(12, 1fr)!important; /* Ma grille fait 12 colonnes */
    }
    
 
    .woo-liste-produits-grille-alternee .products li {
        grid-column: span 6!important;    /* Par défaut, chaque produit occupe 6 colonnes - C'est à dire 6 colonnes x 2 produits = 12 colonnes */
    }
    
    .woo-liste-produits-grille-alternee .products li:nth-child(1) {
        grid-column: span 12!important;   /* Mon 1ème produit occupe 12 colonnes */
    }
}


/*--------------------------------------------------------------
# Woocommerce - Archives produits - Listing des produits
--------------------------------------------------------------*/

/*----- Apparence du plugin des variations -----*/

/*Swatches couleurs : Supprimer l'arrière plan au survol*/

.variations_form td:hover {
    background-color: transparent !important;
}

/*Swatches couleurs : taille gap*/

.cfvsw-swatches-container {
    grid-gap: 2px!important;
}

/*Swatches couleurs : couleur bordure active */

.cfvsw-selected-swatch {
    border-color: #B8B8B8!important;
}

.cfvsw-swatches-option {
    background: transparent;
    border: 1px solid transparent;
    min-width: 22px!important;
    min-height: 22px!important;
}

/*----- Ajout du pourcentage de réduction à droite du prix, via le fichier functions.php -----*/

.woocommerce .products .pourcentage {
    background-color: var(--e-global-color-accent);
    color: var(--e-global-color-89e5287);
    font-family: var(--e-global-typography-b1a63c2-font-family), Sans-serif;
    font-size: var(--e-global-typography-b1a63c2-font-size);
    font-weight: var(--e-global-typography-b1a63c2-font-weight);
    line-height: var(--e-global-typography-b1a63c2-line-height);
    float: left;
    padding: 0 .3rem;
    margin-left: 10px;
}

.woocommerce .products .price {
    float:left!important;
}

/*----- Pagination des produits -----*/

.woocommerce-pagination ul {
    display: flex !important;
    justify-content: center;
    gap: 10px !important;
}

.woocommerce-pagination li .page-numbers {
    border: 1px solid #E0E0E0!important;
    min-width:3rem!important;
    min-height:3rem!important;
    align-content: center!important;
}

.woocommerce-pagination li .current {
    background-color: var(--e-global-color-primary)!important;
    color: #fff!important;
    border: 1px solid var(--e-global-color-primary)!important;
}

.woocommerce-pagination li .page-numbers:hover {
    background-color: var(--e-global-color-primary)!important;
    color: #fff!important;
    border: 1px solid var(--e-global-color-primary)!important;
}

/*--------------------------------------------------------------
# Woocommerce - Archives produits - Ajout de l'image au survol (1ère image de la galerie produit) via le fichier functions.php
--------------------------------------------------------------*/

/*Cacher l'image au survol*/
.woo-archives-product-hover-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
}

.woo-archives-product-hover-image:hover {
    opacity: 1;
}

/*Corriger l'affichage pour que les pastilles de couleur (du plugin de Variations swatches) restent cliquables avec l'ajout du hover*/

.cfvsw-shop-variations {
  position: relative!important;
  z-index: 10!important;
}


/*--------------------------------------------------------------
# Woocommerce - Archives produits et popup filtres - Filtres avec Jetsmartfilters
--------------------------------------------------------------*/

/*----- Filtres Jetsmartfilters -----*/

/*--- Apparence pour tous les filtres ---*/

/*Changer le chevron dépliant*/

.woo-jetsmartfilters .jet-filter-items-dropdown__label:after {
    font-family: "creationsmirabelle-pack-icones";
    font-style: normal;
    font-weight: normal;
    content: '\e805';
    font-size: 12px;
    border:none!important;
    top:1px;
    right:0;
}

/*--- Filtres Couleurs ---*/

.woo-jetsmartfilters-couleurs .jet-checkboxes-list-wrapper {
    display: grid!important;
    grid-template-columns: 1fr 1fr!important;
    column-gap: 0.3rem;
}

.woo-jetsmartfilters-couleurs .jet-checkboxes-list__button {
    justify-content: center!important;
}

/*--- Filtres actifs ---*/

.woo-jetsmartfilters-actifs .jet-active-tag__remove {
    position: relative !important;
    padding-left:5px;
}

/*--- Filtres sticky ---*/

.woo-filters-sticky.elementor-sticky--effects {
    border-bottom: 1px solid var(--e-global-color-2616d8d);
}

/*--------------------------------------------------------------
# Woocommerce - Fiche produit
--------------------------------------------------------------*/

/*----- Galerie produit verticale ordinateur et tablette : personnaliser l'affichage du plugin Crocoblock Jet Product Gallery Slider -----*/

/* Bordure autour de la miniature active */

.produit-galerie-croco-ordi .jet-gallery-swiper-thumb .swiper-slide-thumb-active {
    border: 1px solid var(--e-global-color-text)!important;
    padding: 4px;
    transition : padding .3s ease;
}

/* Containeur global */

.produit-galerie-croco-ordi .jet-woo-swiper {
    gap: 10px;
}

/*Conteneur des miniatures sur ordinateur*/

@media screen and (min-width: 1025px) {
    .produit-galerie-croco-ordi .jet-gallery-swiper-thumb {
        margin-top:80px;
    }
}

/*Conteneur des miniatures sur tablette*/

@media screen and (max-width: 1024px) {
    .produit-galerie-croco-ordi .jet-gallery-swiper-thumb {
        margin-top:30px;
    }
}

.produit-galerie-croco-ordi .jet-gallery-swiper-thumb .jet-woo-swiper-control-thumbs__item {
    height: auto!important;
}

/*----- Galerie produit horizontale mobile: personnaliser l'affichage du plugin Crocoblock Jet Product Gallery Slider -----*/

/* Bordure autour de la miniature active */

.produit-galerie-croco-mobile .jet-gallery-swiper-thumb .swiper-slide-thumb-active {
    border: 1px solid var(--e-global-color-text)!important;
    padding: 4px;
    transition : padding .3s ease;
}

/* Containeur global */

.produit-galerie-croco-mobile .jet-woo-swiper {
    gap: 10px;
}

/*Conteneur des miniatures*/

.produit-galerie-croco-mobile .jet-gallery-swiper-thumb {
    padding-left:40px;
    padding-right: 40px;
}

/*----- Galerie produit verticale ordinateur et tablette : personnaliser l'affichage du plugin Crocoblock Jet Product Gallery Slider -----*/

/* Bordure autour de la miniature active */

.produit-galerie-croco-ordi .jet-gallery-swiper-thumb .swiper-slide-thumb-active {
    border: 1px solid var(--e-global-color-text)!important;
    padding: 4px;
    transition : padding .3s ease;
}

/* Containeur global */

.produit-galerie-croco-ordi .jet-woo-swiper {
    gap: 10px;
}

/*Conteneur des miniatures sur ordinateur*/

@media screen and (min-width: 1025px) {
    .produit-galerie-croco-ordi .jet-gallery-swiper-thumb {
        margin-top:80px;
    }
}

/*Conteneur des miniatures sur tablette*/

@media screen and (max-width: 1024px) {
    .produit-galerie-croco-ordi .jet-gallery-swiper-thumb {
        margin-top:30px;
    }
}

.produit-galerie-croco-ordi .jet-gallery-swiper-thumb .jet-woo-swiper-control-thumbs__item {
    height: auto!important;
}

/*----- Galerie produit horizontale mobile: personnaliser l'affichage du plugin Crocoblock Jet Product Gallery Slider -----*/

/* Bordure autour de la miniature active */

.produit-galerie-croco-mobile .jet-gallery-swiper-thumb .swiper-slide-thumb-active {
    border: 1px solid var(--e-global-color-text)!important;
    padding: 4px;
    transition : padding .3s ease;
}

/* Containeur global */

.produit-galerie-croco-mobile .jet-woo-swiper {
    gap: 10px;
}

/*Conteneur des miniatures*/

.produit-galerie-croco-mobile .jet-gallery-swiper-thumb {
    padding-left:40px;
    padding-right: 40px;
}

/*----- Fil d'ariane Rank Math -----*/

/*Fil d'ariane widget Woocommerce Elementor*/

.woocommerce .woocommerce-breadcrumb {
    margin:0!important;
}

/*Fil d'ariane Shortcode Rank Math*/

.fil-ariane .rank-math-breadcrumb, .fil-ariane .rank-math-breadcrumb a {
    color: var(--e-global-color-e8a8e60);
    font-family: "Karla", Sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.2em;
}

.fil-ariane .rank-math-breadcrumb p {
    margin-bottom:0;
}

/*----- Variations -----*/

/*Encadrer*/

.single-product .produit-ajout-panier .variations {
    border: 1px solid var(--e-global-color-2616d8d) !important;
    padding: 20px!important;
    display: block!important;
    margin-bottom: 15px!important;
}

.single-product .produit-ajout-panier .variations tbody {
    display: block!important;
}

.single-product .produit-ajout-panier .variations:before {
    content: "Choisissez vos options";
    padding-bottom: 15px !important;
    display: block;
        color: var(--e-global-color-text);
    font-family: var(--e-global-typography-b1a63c2-font-family), Sans-serif;
    font-size: var(--e-global-typography-b1a63c2-font-size);
    font-weight: var(--e-global-typography-b1a63c2-font-weight);
    line-height: var(--e-global-typography-b1a63c2-line-height);
}

/*Apparence*/

.single-product .variations th,
.single-product .variations td {
    background-color: transparent!important;
    padding: 0!important;
}

.single-product .produit-ajout-panier .variations .label {
    margin-bottom: 6px!important;
}

.single-product .produit-ajout-panier .variations tr {
    display: block!important;
    margin-bottom: 11px!important;
}

.single-product .variations .cfvsw-selected-label {
    font-weight: 400!important;
}

/*Bouton effacer*/

.single-product .variations .reset_variations {
    color : var(--e-global-color-text)!important;
    font-family: "Karla", sans-serif!important;
    font-size: .9em !important;
    padding-left:5px;
}

/*Prix variations*/

.woocommerce-Price-amount bdi {
    color: var(--e-global-color-text);
    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);
    line-height: var(--e-global-typography-text-line-height);
}

/*Swatches (exemple: pastille de couleur)*/

.single-product .produit-ajout-panier .variations .cfvsw-swatches-option {
    min-width: 33px!important;
    min-height: 33px!important;
}

.single-product .variations .cfvsw-selected-swatch {
    border: 2px solid var(--e-global-color-text)!important;
}

/*----- Accordéon Informations complémentaires -----*/

/*Apparence ces titres de l'accordéon*/

.produit-infos-accordeon .e-n-accordion-item {
    border-bottom: 1px solid var(--e-global-color-663c0cc);
}

.produit-infos-accordeon .e-n-accordion-item:last-child {
    border:none!important;
}

.produit-infos-accordeon .e-n-accordion-item [aria-expanded="true"] {
    padding-bottom:10px!important;
}

/*Icônes titres accordéon*/

.produit-infos-accordeon .icon {
    font-size:18px;
    padding-right: 10px;
    color: var(--e-global-color-primary);
    vertical-align: middle;
}

/*Retirer le titre de l'onglet Avis produit*/

.produit-infos-accordeon .woocommerce-Reviews-title {
    display: none;
}

/*----- Avis produits/Commentaires -----*/

.woocommerce #reviews {
    color: var(--e-global-color-text);
    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);
    line-height: var(--e-global-typography-text-line-height);
}

/* Buttons */
.woocommerce #reviews .submit {
background-color: var( --e-global-color-primary )!important;
    font-family: var(--e-global-typography-accent-font-family), Sans-serif!important;
    font-size: var(--e-global-typography-accent-font-size)!important;
    font-weight: var(--e-global-typography-accent-font-weight)!important;
    line-height: var(--e-global-typography-accent-line-height)!important;
    color: var(--e-global-color-89e5287)!important;
    border-radius: 0!important;
    padding: 12px 20px 12px 20px!important;
    box-shadow: 7px 7px var(--e-global-color-d66f91f)!important;
}

/* Buttons hover */
.woocommerce #reviews .submit:hover {
  box-shadow: 7px 7px var(--e-global-color-accent)!important;
}

/*Étoiles*/

.woocommerce #reviews .stars a {
    color: var(--e-global-color-primary);
}


/*--------------------------------------------------------------
# Woocommerce - Page Panier, Commande, Mon compte
--------------------------------------------------------------*/

/*----- Bouton Page panier et commande -----*/

/*Bouton checkout */

.woocommerce .wc-proceed-to-checkout .checkout-button,
.woocommerce #payment #place_order {
    box-shadow: 7px 7px var(--e-global-color-d66f91f);
}

.woocommerce .wc-proceed-to-checkout .checkout-button:hover,
.woocommerce #payment #place_order:hover {
    box-shadow: 7px 7px var(--e-global-color-accent);
}

/*---------- Ajout des messages de livraison offerte sur la page panier et confirmation de commande via le fichier functions.php ----------*/

/* Style pour le message de livraison gratuite */
.livraison-gratuite-message {
    margin: 0 0 15px;
    padding: 15px;
    border: 1px solid #d5d8dc; /* Bordure gris clair */
    background-color: #FAFAFA; /* Fond gris très clair */
    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);
    line-height: var(--e-global-typography-text-line-height);
    color: var(--e-global-color-text); /* Texte noir*/
}

/*Livraison gratuite atteinte - ajout icône coeur*/

.livraison-gratuite-message .icon {
    color: var(--e-global-color-primary);
    padding-right: 5px;
    font-size: 16px;
}

/*---------- Ajout des labels de livraison offerte sur la page panier et confirmation de commande via le fichier functions.php ----------*/

.livraison-offerte {
    color: var(--e-global-color-primary);
}

/*----- Page panier -----*/

/*Header du tableau*/

.panier-contenu thead tr th {
    border-bottom: 1px solid var(--e-global-color-2616d8d) !important;
}

/*Titre produit*/

.panier-contenu .product-name a {
    font-weight: 600;
}

/*Taille image*/

.panier-contenu .product-thumbnail {
    width: 120px;
}

.panier-contenu .product-thumbnail img {
    width:auto!important;
}

/*Méthodes de livraison*/

.woocommerce-shipping-methods label {
    color: var(--e-global-color-text)!important;
}

/*----- Page Validation de commande -----*/

/*Code promo*/

.commande-contenu .e-coupon-box .e-coupon-anchor-description {
    font-weight : 400!important;
}

/*Cacher les titres inexistants*/

.commande-contenu .woocommerce-additional-fields h3 {
    display:none!important;
}

/*Méthodes d'expédition*/



/*Cases à cocher acceptation*/

.commande-contenu .woocommerce .cr-customer-consent label, 
.commande-contenu .woocommerce .validate-required label {
    line-height: 1em !important;
}

.commande-contenu .woocommerce-privacy-policy-text p {
    margin-top: 0 !important;
}

/*----- Messages d'erreur -----*/

.woocommerce-message,
.woocommerce-info {
    margin-bottom: 10px !important;
}

.single-product  .produit-notice-woo .woocommerce-message,
.single-product  .produit-notice-woo .woocommerce-info  {
    margin: 25px 0 !important;
}

.woocommerce-message:focus-visible {
    outline: none !important;
}

.woocommerce-message .button:hover {
    color: var(--e-global-color-primary)!important;
    border-color: var(--e-global-color-primary)!important;
}

.woocommerce-error li a, .woocommerce-error li a:hover {
    color: var(--e-global-color-primary)!important;
}

/*----- Page mon compte -----*/

/*Liens hypertextes*/

.woo-moncompte .woocommerce-MyAccount-content a {
    color: var( --e-global-color-text )!important;
    text-decoration: underline!important;
}

.woo-moncompte .woocommerce-MyAccount-content .button {
    color: var(--e-global-color-89e5287)!important;
    text-decoration:none!important;
    background-color: var(--e-global-color-primary)!important;
    border:none!important;
    border-radius:0!important;
}

.woo-moncompte .woocommerce-MyAccount-content .button:hover {
        background-color: var(--e-global-color-accent)!important;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

/*----- Formulaire inscription newsletter -----*/

.footer-newsletter .elementor-button {
    box-shadow: 7px 7px var(--e-global-color-primary);
    margin-top:10px!important;
}

.footer-newsletter .elementor-button:hover {
    box-shadow: 7px 7px var(--e-global-color-d66f91f);
}

.footer-newsletter label[for=form-field-RGPD] {
    font-size: 15px!important;
    vertical-align:top!important;
}

/*----- Menu footer sur mobile -----*/

@media (max-width: 767px) {

    .footer-menu .elementor-item {
    justify-content: center !important;
    }
}


/*--------------------------------------------------------------
# Polices Page classique - Mentions légales etc.
--------------------------------------------------------------*/

.page-classique p, .page-classique ul {
    margin-bottom: 20px;
}

/*Liens*/

.page-classique a {
    color: #FD0851!important; /*Couleur bleu ciel*/
}

/*Liste à puces et numérotées*/

.page-classique li {
    margin-bottom: 20px;
}

.page-classique ul li::marker {
    color: #FF5C9D; /*Couleur rose pop*/
}

.page-classique ol li::marker {
    color: #FF5C9D; /*Couleur rose pop*/ 
    font-weight: bold;
}

/*Citation*/

.page-classique .wp-block-quote {
    font-style: italic;
    border-left: 5px solid #FF5C9D; /*Couleur rose pop*/
    margin: 30px 0;
    padding-left: 25px;
}

.page-classique .wp-block-quote:before {
    content: "\275D";
    font-size: 50px;
    font-style: normal;
    color: #FFB3E4; /*Couleur rose bubble gum*/
}

.page-classique .wp-block-quote p {
    margin-top: 0;
}

/*--------------------------------------------------------------
# Politique de cookies - Plugin Complianz
--------------------------------------------------------------*/

#cmplz-document {
    max-width: max-content;
}

#cmplz-document p, #cmplz-document li {
    font-size: var(--e-global-typography-text-font-size);
}

#cmplz-cookies-overview h3 {
    font-family: var(--e-global-typography-accent-font-family), Sans-serif;
    font-size: var(--e-global-typography-accent-font-size);
    font-weight: var(--e-global-typography-accent-font-weight);
    line-height: var(--e-global-typography-accent-line-height);
}

/*--------------------------------------------------------------
# Palette de couleurs Gutenberg - Articles de blog
--------------------------------------------------------------*/

/*Couleur arrière-plan*/

.single .has-background {
    margin:30px 0;
}

.single .has-noir-background-color {
    background-color: #181818; /*Couleur noir charbon*/
}

.single .has-rougefolie-background-color {
    background-color: #FD0851; /*Couleur rouge folie*/
}

.single .has-rosepop-background-color {
    background-color: #FF5C9D; /*Couleur rose pop*/
}

.single .has-rosebonbon-background-color {
    background-color: #FF75D3; /*Couleur rose bonbon*/
}

.single .has-rosebubblegum-background-color {
    background-color: #FFB3E4; /*Couleur rose bubble gum*/
}

.single .has-rosepale-background-color {
    background-color: #FFDDE1; /*Couleur rose pâle*/
}

.single .has-blanc-background-color {
    background-color: #fff; /*Couleur blanc*/
}

/*Couleur texte*/
.single .has-noir-color, .has-noir-color {
    background-color: #181818; /*Couleur noir charbon*/
}

.single .has-rougefolie-color, .has-rougefolie-color {
    background-color: #FD0851; /*Couleur rouge folie*/
}

.single .has-rosepop-color, .has-rosepop-color {
    background-color: #FF5C9D; /*Couleur rose pop*/
}

.single .has-rosebonbon-color, .has-rosebonbon-color {
    background-color: #FF75D3; /*Couleur rose bonbon*/
}

.single .has-rosebubblegum-color, .has-rosebubblegum-color {
    background-color: #FFB3E4; /*Couleur rose bubble gum*/
}

.single .has-rosepale-color, .has-rosepale-color {
    background-color: #FFDDE1; /*Couleur rose pâle*/
}

.single .has-blanc-color, .has-blanc-color {
    background-color: #fff; /*Couleur blanc*/
}