/* =========================
   Fond général et containers
   ========================= */
html,
body,
body.theme-default,
body#content,
#wrapper,
.page,
.container,
.content-wrapper,
#content {
  background-color: #fcc9cd !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

.page-content,
.images-container {
  background-color: #fabbc0 !important; 
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

#page,
.main,
#columns,
#columns .container,
#content,
.content-wrapper {
  background-color: #fcc9cd !important;
}
/* Autour des images cliquqbles de categories */
#subcategories ul li .subcategory-image a {
    display: block;
    padding: 9px;
    border:1px solid  #563d88 !important; /* violet */
}

/* Cible tous les boutons d'abonnement newsletter */
input.btn.btn-primary[name="submitNewsletter"] {
    background-color: #563d88 !important; /* violet */
    border-color: #563d88 !important;     /* bordure assortie */
    color: #ffffff !important;            /* texte en blanc */
}

/* Au survol */
input.btn.btn-primary[name="submitNewsletter"]:hover {
    background-color: #452b6b !important; /* violet plus foncé */
    border-color: #452b6b !important;
    color: #ffffff !important;
}
/* Conteneur de la loupe */
.layer.hidden-sm-down {
  background-color: #fcc9cd;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.layer.hidden-sm-down:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.layer.hidden-sm-down .zoom-in {
  color:#563d88  font-size: 20px;
}

/* =========================
   Fond spécifique des containers
   ========================= */
.container,
.container-fluid,
#wrapper .container,
#content .container {
  background-color: #fcc9cd !important;
}

/* =========================
   Menu Hamburger
   ========================= */
.hamburger-menu-container {
  background-color: #fabbc0 !important;
  border-bottom: none !important;
  text-align: center;
}

/* =========================
   Banniere logo
   ========================= */
.banner {
  background-color: #fcc9cd !important;
  text-align: center;
}

/* =========================
   Bloc principal - catégories rondes centré
   ========================= */
.home-subcategories-styled {
  padding: 40px 0;
  text-align: center;
  border: 2px solid #dcc6a2 !important;
  border-radius: 12px !important;
  box-sizing: border-box;
  transition: all 0.3s ease;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #fcc9cd !important;
}

.home-subcategories-list {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 35px;
  max-width: 1200px;
}

@keyframes fadeZoomIn {
  from { opacity: 0; transform: scale(0.7); }
  to { opacity: 1; transform: scale(1); }
}

.home-subcategories-list .home-subcategory-item {
  opacity: 0;
  transform: scale(0.8);
  animation: fadeZoomIn 0.8s ease forwards;
}

.home-subcategories-list .home-subcategory-item:nth-child(1) { animation-delay: 0.1s; }
.home-subcategories-list .home-subcategory-item:nth-child(2) { animation-delay: 0.2s; }
.home-subcategories-list .home-subcategory-item:nth-child(3) { animation-delay: 0.3s; }
.home-subcategories-list .home-subcategory-item:nth-child(4) { animation-delay: 0.4s; }
.home-subcategories-list .home-subcategory-item:nth-child(5) { animation-delay: 0.5s; }

.home-subcategories-list .home-subcategory-item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none !important;
  color: #222 !important;
  transition: color 0.3s ease !important;
}

.home-subcategories-list .home-subcategory-item a:hover {
  color: #ff6600 !important;
}

.home-subcategories-list .home-subcategory-item img {
  width: 150px !important;
  height: 150px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  transition: transform 0.5s ease, box-shadow 0.5s ease, filter 0.5s ease;
  transform: translateZ(0);
  backface-visibility: hidden;
}

.home-subcategories-list .home-subcategory-item a:hover img {
  transform: scale(1.12) rotateX(10deg) rotateY(-5deg);
  box-shadow: 0 20px 35px rgba(255, 102, 0, 0.35);
  filter: brightness(1.1) saturate(1.15);
}

.home-subcategories-list .home-subcategory-item .cat-name {
  margin-top: 12px;
  font-weight: 600;
  font-size: 15px;
  text-align: center;
   color: #563d88 !important; /* ton violet */
  letter-spacing: 0.3px;
  transition: color 0.3s ease, transform 0.3s ease;
}

.home-subcategories-list .home-subcategory-item a:hover .cat-name {
  color: #ff6600 !important;
  transform: translateY(3px);
}

/* Responsive mobile */
@media (max-width: 768px) {
  .home-subcategories-list {
    gap: 20px;
    justify-content: center;
  }
  .home-subcategories-list .home-subcategory-item img {
    width: 110px !important;
    height: 110px !important;
  }
  .home-subcategories-list .home-subcategory-item .cat-name {
    font-size: 13px;
  }
}

/* =========================
   Bloc texte personnalisé
   ========================= */
#custom-text,
#displayFooterBefore {
  background-color: #fcc9cd !important;
  padding: 20px !important;
  box-sizing: border-box;
  border: none !important;
  border-radius: 0 !important;
}

#custom-text span,
#displayFooterBefore span {
  font-size: 22px !important;
  font-family: 'Shantell Sans', serif !important;
}

/* =========================
   Produits (fond uni + contour)
   ========================= */
.product-miniature,
.product-container,
.featured-products,
.thumbnail-container,
.products,
.product-list,
.product-grid,
.product-cover,
.product-cover img{
  background-color: #fabbc0!important;
  border-radius: 8px;
  padding: 12px;
  transition: all 0.3s ease, box-shadow 0.3s ease;
  box-sizing: border-box;
}
.product-description{
  background-color: #fcc9cd!important;
  border-radius: 8px;
  padding: 12px;
  transition: all 0.3s ease, box-shadow 0.3s ease;
  box-sizing: border-box;
}

/* Miniature sélectionnée ou survolée */
.images-container .product-images > li.thumb-container > .thumb.selected,
.images-container .product-images > li.thumb-container > .thumb:hover {
  border: 3px solid #fabbc0 !important;
  border-radius: 10px;
}

.thumbnail-container {
  border: 2px solid #563d88 !important;
}

.thumbnail-container:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15) !important;
  border-color: #ff9261 !important;
}

.products .product-miniature,
.product-list .product-miniature,
.product-grid .product-miniature {
  margin-bottom: 10px;
  background-color: #fcc9cd!important;
}
/* =========================
   fiche produit
   ========================= */

.card {
  background-color: #fcc9cd !important;
  color:#563d88 !important;
}

.quickview .modal-content {
    background-color: #fcc9cd!important;
    border-radius: 10px;
}
button.close,
button.close span {
  color: #563d88 !important; /* ton violet */
  opacity: 1 !important;
}
/* =========================
   bouton rupture de stock
   ========================= */
.product-flags .product-flag.out_of_stock {
  background-color: #563d88 !important;  /* fond violet */
  color: #ffffff !important;             /* texte blanc */
  border-radius: 12px;                   /* arrondi des coins */
  padding: 4px 10px;                     /* espace interne */
  font-weight: 600;                      /* texte un peu plus gras */
  font-size: 0.85rem;                    /* taille du texte */
  text-transform: uppercase;             /* mettre le texte en majuscules */
}

.product-flag.new {
    background-color: #563d88 !important;  /* fond violet */
  color: #ffffff !important;             /* texte blanc */
  border-radius: 12px;                   /* arrondi des coins */
  padding: 4px 10px;                     /* espace interne */
  font-weight: 600;                      /* texte un peu plus gras */
  font-size: 0.85rem;                    /* taille du texte */
  text-transform: uppercase;             /* mettre le texte en majuscules */
}
.block-categories a.h6  {
  
  color:#563d88 !important;
}

.block-categories  {
  background-color: #fabbc0 !important; 
}

/* Catégories principales */
.block-categories .category-top-menu > li > a {
  color: #563d88 !important;
     font-family: 'Alegreya', serif !important;
    
}

/* Sous-catégories */
.block-categories .category-sub-menu a {
  color: #563d88 !important;
}
.subcategory,
.subcategory-heading {
  background-color: #fabbc0!important;
}

.row {
    margin-bottom: 0.75rem;
    background:#fcc9cd!important;
}

/* =========================
   Footer
   ========================= */
#footer,
#footer .footer-top,
#footer .footer-bottom,
#footer .row {
  background-color: #fabbc0 !important;
}

#ps_socialfollow li.facebook a,
#ps_socialfollow li.facebook a:visited {
  color: #fabbc0 !important;
}

#ps_socialfollow li.facebook a:hover {
  color: #0d47a1 !important;
}

#ps_socialfollow li.twitter a,
#ps_socialfollow li.twitter a:visited {
  color: #1da1f2 !important;
}

#ps_socialfollow li.twitter a:hover {
  color: #0c85d0 !important;
}

#ps_socialfollow li.instagram a,
#ps_socialfollow li.instagram a:visited {
  color: #e1306c !important;
}

#ps_socialfollow li.instagram a:hover {
  color: #ad1457 !important;
}

/* =========================
   Header corrigé : flex rétabli
   ========================= */
.header-main.container {
  display: flex !important;
  justify-content: space-between !important; /* burger à gauche, modules à droite */
  align-items: center !important;
  width: 100% !important; /* force à prendre toute la largeur */
  max-width: 100% !important;
  margin: 0 !important; /* supprime le centrage automatique */
  padding: 10px 20px; /* ajustable selon ton design */
  box-sizing: border-box;
}

/* Partie gauche */
.header-left {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* Partie droite */
.header-right {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important; /* aligne à droite */
  gap: 15px;
  margin-left: auto !important; /* pousse à l’extrême droite */
}

/* Modules individuels */
.header-right > * {
  margin: 0 !important;
}


/* Reste du CSS inchangé (flocons, modals, sous-catégories, boutons, liens, etc.) */


/* FORCER LES RONDS DES CATEGORIES */
.home-subcategories-list .home-subcategory-item img,
.subcategory-image img,
.category-cover img {
  width: 150px !important;
  height: 150px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 50% !important;  /* Rond parfait */
  object-fit: cover !important;
  display: block !important;
  margin: 0 auto !important;
}

#subcategories {
border-top: solid #fcc9cd;
}

.block-category   {
color:red !important;
}

/* Uniformiser le fond header + contenu principal avec le footer */
.header-main.container,
#content {
    background-color: #fabbc0 !important; /* même couleur que le footer */
}

#content-wrapper{
    background-color: #fcc9cd !important; /* même couleur que le footer */
}

/* Masquer l’onglet "Détails du produit" */
#product .nav-tabs .nav-item a[href="#product-details"] {
  display: none !important;

}


/* ================= TITRES ================= */
/* Tous les titres h1-h6 sauf h3 */
h1, h2, h4, h5, h6,
.h1, .h2, .h4, .h5, .h6 {
    font-family: 'Alegreya', serif;
    color: #563d88 !important;/* violet */
    font-weight: normal; /* optionnel */
}

/* H3 différent */
h3, .h3 {
    font-family: 'Shantell Sans', serif;
    color: #563d88; /* violet */
    font-size: 1.8em; /* ajuste selon besoin */
}
h3 strong {
    font-weight: bold !important;
}


/* ================= TEXTE NORMAL ================= */
p, .product-description, .cat-name, .subcategory-name {
    font-family: 'Shantell Sans', serif;
    color: #563d88 !important;
    font-size: 1em; /* ajuste selon besoin */
    line-height: 1.5;
}

/* ================= LISTES ================= */
ul, ol, li {
    font-family: 'Shantell Sans', serif;
    color: #563d88;
}


p strong, li strong, .product-description strong {
    font-weight: bold !important;
}

/* Texte normal */
p,  a, li, span {
    font-family: 'Shantell Sans', serif !important;
    color: #563d88 !important;
    font-size: 17px; /* taille légèrement plus grande que par défaut */
    line-height: 1.6; /* espace entre les lignes pour plus de lisibilité */
}
.product-price .current-price-value,
.current-price .current-price-value,
.product-prices .tax-shipping-delivery-label {
  font-size: 1.5625rem !important;
  color: #563d88 !important;
}



/* ================= BLOCS CIBLES ================= */
/* Menu et panier gardent leur couleur et traduction par défaut */
.header-user-info a,
#header .search-box input,
#header .cart,
.block-categories a,
.category-sub-menu a {
    font-family: inherit; /* reprend police par défaut thème */
    color: inherit;       /* reprend couleur thème */
}
/* panier infos persos */
body#checkout section.checkout-step {
     background-color: #fcc9cd !important;

}
#header, #header .header-top {
     background-color: #fcc9cd !important;
}

/* ================= EXCEPTIONS ================= */
/* Si certains blocs héritent de body globalement, on peut restreindre */
body {
    font-family: inherit;
    color: inherit;
}


/* ================= BLOC CATEGORIES ================= */
.block-categories {
    background-color: #fabbc0 !important; 
    padding: 10px;
    color: #563d88 !important;
}

.block-category .block-category-inner #category-description p, .block-category .block-category-inner #category-description .page-content.page-cms ul, .page-content.page-cms .block-category .block-category-inner #category-description ul, .block-category .block-category-inner #category-description strong {
  
    color: #563d88 !important;
}

/* =========================
   Onglets (tabs) harmonisés
   ========================= */

/* Fond général des tabs */
.nav-tabs {
  border-bottom: none !important;
  background-color: #fcc9cd !important;
}

/* Onglet individuel */
.nav-tabs .nav-link {
  background-color: #fcc9cd !important;
  border: none !important;
  color: #563d88 !important;
  font-family: 'Alegreya', serif !important;
}

/* Onglet actif */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  background-color: #fabbc0 !important;
  border: none !important;
  color: #563d88 !important;
}

/* Hover */
.nav-tabs .nav-link:hover {
  background-color: #fabbc0 !important;
  color: #563d88 !important;
}

/* Contenu des tabs */
.tabs,
.tab-content {
  background-color: #fcc9cd !important;
  border: none !important;
  color: #563d88 !important;
}

#subcategories ul li:hover .subcategory-image a {
    padding: 5px;
    border:5px solid #fabbc0 !important;
}



/* Centrer l'image de couverture du produit */
.product-cover,
.product-cover img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Centrer les vignettes / aperçus d'images */
.product-thumbnails,
.product-thumbnails img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

/* Optionnel : limiter la taille maximale pour uniformité */
.product-cover img,
.product-thumbnails img {
    max-width: 100%;
    height: auto;
}

/*achats */



/*affichage suite a ajout dans panier */
#blockcart-modal .modal-title {
    font-size: 1rem;
    font-weight: 400;
   color: #563d88 !important;
   font-family: 'Alegreya', serif !important;
}
#blockcart-modal .modal-header {
background: #fabbc0  !important;/* rose plus sombre */
}
#blockcart-modal .modal-body{
background-color: #fcc9cd!important; /* rose du site */
}



/* Changer la couleur de fond du bouton Ajouter au panier */
button.btn-primary.add-to-cart {
    background-color: #563d88 !important; /* violet */
    border-color: #563d88 !important; /* même couleur pour la bordure */
    color: #ffffff !important; /* texte en blanc */
}

/* Changer la couleur au survol */
button.btn-primary.add-to-cart:hover {
    background-color: #452b6b !important; /* violet plus foncé */
    border-color: #452b6b !important;
}


/* Changer la couleur de fond du bouton continuer achats*/
button.btn-secondary {
   background: #fabbc0  !important;/* rose plus sombre */
   border-color: #563d88 !important; /* même couleur pour la bordure */
    color: #563d88 !important; /* texte en blanc */
}

/* Changer la couleur au survol */
button.btn-secondary :hover {
    background-color: #452b6b !important; /* violet plus foncé */
    border-color: #452b6b !important;
}
/* Bouton Commander (lien) */
a.btn.btn-primary {
    background-color: #563d88 !important; /* violet */
    border-color: #563d88 !important;     /* bordure même couleur */
    color: #ffffff !important;            /* texte en blanc */
    text-decoration: none !important;     /* supprime le soulignement */
}

/* Au survol */
a.btn.btn-primary:hover {
    background-color: #452b6b !important; /* violet plus foncé */
    border-color: #452b6b !important;
    color: #ffffff !important;            /* garde le texte blanc au survol */
}


/* ===============================
   FIX CHROME / EDGE UNIQUEMENT
   (Safari exclu)
   =============================== */

@supports not (-webkit-touch-callout: none) {

  body {
    zoom: 1; /* ajuste entre 0.88 et 0.92 si besoin */
  }

}


h1 {
    font-size: 30px !important; /* titre principal */
    font-weight: 600; /* plus gras */
}

h2 {
    font-size: 22px !important; /* sous-titre */
    font-weight: 500; /* légèrement gras */
    margin-top: 20px; /* espace au-dessus */
    margin-bottom: 12px; /* espace en dessous */
}


.product-description p {
    font-size: 17px !important;
    line-height: 1.7;
}

#product .product-description li {
    font-size: 17px !important;
    line-height: 1.7;
}

/* =============================
   Bannière et logo mobile
   ============================= */
@media (max-width: 768px) {
  .banner-wrapper {
    width: 100%;
    height: 220px;          /* ajustable selon ton goût */
    position: relative;
    overflow: hidden;
  }

  .banner-image {
    width: 100%;
    height: 100%;
    object-fit: cover;       /* zoom léger pour remplir le conteneur */
    display: block;
  }

.banner-text {
  text-align: justify;
}




  /* On ne touche pas à .banner-text ni au custom text */
  /* Ils restent exactement comme sur desktop */
#custom-text span,
#displayFooterBefore span {
  font-size: 13px !important;
  font-family: 'Shantell Sans', serif !important;
  text-align: justify;
}
#custom-text,
#displayFooterBefore {
  background-color: #fcc9cd !important;
  padding: 20px !important;
  font-size: 13px !important;
  box-sizing: border-box;
  border: none !important;
  border-radius: 0 !important;
}


  /* Réduction des ronds des catégories sur mobile */
  .home-subcategories-list .home-subcategory-item img,
  .subcategory-image img,
  .category-cover img {
    width: 100px !important;   /* taille réduite */
    height: 100px !important;  /* garder le ratio carré */
  }

  .home-subcategories-list .home-subcategory-item .cat-name {
    font-size: 12px !important; /* texte plus petit si besoin */
  }


  /* =========================
   Titres globaux sur mobile
   ========================= */

  h1, .h1 {
    font-size: 1.4em !important; /* ~22px */
  }

  h2, .h2 {
    font-size: 1.2em !important; /* ~18-20px */
  }

  h3, .h3 {
    font-size: 1.1em !important;  /* ~16px */
  }

  

}