/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/* Importation des polices Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display&family=Cormorant+Garamond&family=Lora&family=Poppins&display=swap');


/*************** ADD CUSTOM CSS HERE.   ***************/
/* Palette de couleurs */
:root {
  /* Couleur noir et blanc */
  --fond-principal: #FAF8F5;
  --fond-blanc: #FFFFFF;
  --texte-principal: #333333;

  /* Couleurs de fond principalement */
  --accent-doux: #fff0f5;
  --accent-secondaire: #A4D4C1;

  /* Couleurs pour texte principalement */
  --accent-rose-vif:#d63384;
  --accent-violet: #880e4f;

  /*  pas dans ma charte */
  --accent-vert: #4CAF50;

  /* Polices */
  --font-titres: 'Playfair Display', 'Cormorant Garamond', serif;
  --font-textes: 'Lora', serif;
  --font-menu: 'Poppins', sans-serif;
}
/* Reset de base */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  /*Cela est généralement utile pour s'assurer que tous les éléments suivent un même modèle de boîte et éviter des espacements inattendus, mais il est important de vérifier qu'il n'y a pas de conflits avec d'autres règles spécifiques. S'il y a des styles de padding ou margin ailleurs dans votre CSS qui sont essentiels, vous devrez peut-être ajuster ce reset.*/
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Styles Globaux */

/* attention modif à checker police */
body {
  margin: 0;
  font-family: var(--font-textes);
  background-color: var(--fond-principal);
  line-height: 1.6;
}


section p {
  font-family: var(--font-textes) !important;
  font-size: 1.25rem !important;
  line-height: 1.6;
  color: var(--texte-principal) !important;
  margin-bottom: 1.5rem;
  text-align: justify; /* ou left selon ton choix */
}

.p-header {
  color: var(--accent-doux) !important;
  text-align: center;
}

.li-index {
  font-family: var(--font-textes) !important;
  font-size: 1.25rem !important;
}

/* Tablettes / écrans moyens (≤1024px) */
@media screen and (max-width: 1024px) {
  section p {
    font-size: 1.15rem !important; /* un peu plus petit */
  }
  .li-index {
    font-size: 1.15rem !important;
  }
}

/* Petits écrans / smartphones (≤768px) */
@media screen and (max-width: 768px) {
  section p {
    font-size: 1.05rem !important; /* encore plus petit pour lisibilité */
  }
  .li-index {
    font-size: 1.05rem !important;
  }
}

/* Très petits écrans / mobiles très étroits (≤480px) */
@media screen and (max-width: 480px) {
  section p {
    font-size: 0.95rem !important;
  }
  .li-index {
    font-size: 0.95rem !important;
  }
}

.features-text ul {
  text-align: left;      /* garde les puces alignées à gauche */
  padding-left: 1.5rem;  /* espace pour les puces */
  margin-bottom: 1.5rem; /* même espacement que les paragraphes */
}

.features-text ul li {
  font-family: var(--font-textes); /* même police que les paragraphes */
  font-size: 1.25rem;              /* même taille que les paragraphes */
  line-height: 1.6;                /* même interligne */
}

@media (max-width: 768px) {
  .features-text {
    text-align: left !important;  /* assure que le texte reste aligné à gauche */
  }
}

h3.highlight {
  color: var(--accent-rose-vif) !important;
  font-size: 2rem !important;
}

.features.section h2 {
  font-family: var(--font-titres);
  font-size: 2.5rem;
  margin-bottom: 20px;
  color: var(--fond-principal);
  text-shadow: 1px 1px 2px #880e4f;
  text-align: center;
  display: block;
}

h3.section-title {
  color: #880e4f;
  margin-top: 30px;
  font-weight: 700;
  font-family: var(--font-titres);
  font-size: 2.5rem;
  margin-bottom: 20px;
  display: block;
  text-align: center;
}

h2.main-title {
    text-align: center;
    display: block;
}

h2.section-title.main-title {
  font-size: 2.5rem; /* taille spécifique au premier titre */
}

h2.section-title {
  font-family: var(--font-titres);
  font-size: 2.5rem;
  margin-bottom: 20px;
  color: var(--accent-violet);
  text-shadow: 1px 1px 2px #880e4f;
  text-align: center;}

h1 {
    font-family: var(--font-titres);
    font-size: 3.2rem;
    font-weight: 400;
    margin-top:50px;
    font-weight: bold;
  letter-spacing: 1px;
  color: var(--fond-blanc);
  font-family: var(--font-titres);
}

p {
  line-height: 1.6;
  text-decoration: none;
  font-size: 1.25rem;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  margin-bottom: 2rem; /* Donne un peu d'espace sous le paragraphe */
  line-height: 1.6;
  font-size: 1.55rem;
}

.section {
  padding: 4rem 2rem;
  max-width: 1200px;
  margin: auto;
  display: block;
}

/* HEADER + NAV */
.header {
  background-color: var(--accent-doux);
  /*background-image: url('../img/fleurs-cerisier-transparent.png');*/
  background-repeat: repeat;
  background-size: 300px auto;
  background-position: top center;
  padding: 1rem 2rem;
  border-bottom: 1px solid #eee;
  position: relative;
  z-index: 100;
  overflow: visible;
}

.header * {
  position: relative;
  z-index: 1;
}

.nav-container {
  max-width: 1400px;
  margin: auto;
  padding: 0 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.nav-logo img {
  background-color: transparent;
  object-fit: contain;
  height: 90px
}

nav .main-nav-link:hover::before {
  opacity: 1;
}

nav .main-nav-link {
  /*color: #880e4f; */ /*cette ligne ne semble pas faire effet et la couleur n'existe pas dans la charte */
  font-weight: 600;
  position: relative;
  text-decoration: none;
  transition: color 0.3s ease;
  font-size: 1rem;
}

nav .main-nav-link,
.nav-user-icons a {
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
}

nav .main-nav-link:hover {
  color: #c2185b;
}

.dropdown-menu li a::before {
  content: none;
}

.dropdown-menu li a:hover {
  background-color: #fbe4ec;
  color: #880e4f;
}

.main-nav {
  flex: 1;
}

.nav-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.nav-links li {
  position: relative;
}

.nav-links li.dropdown {
  position: relative;
}

ul, li {
  list-style: none;
  padding: 0;
  margin: 0;
}

.nav-links a {
  text-decoration: none;
  font-family: var(--font-menu);
  font-weight: 600;
  font-size: 1.2rem;
  transition: color 0.3s ease;
  color: var(--texte-principal);
}

.nav-links a:hover {
  color: var(--accent-violet);
}

.li-choice {
  color: var( --accent-rose-vif);
  font-size: 1.2em;
  font-weight: bold;
  padding-left: 15px;
}

.nav-links a,
.nav-user-icons a i.fa-search {
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  transition: transform 0.3s ease, text-shadow 0.3s ease;
}

.nav-links a:hover,
.nav-user-icons a i.fa-search:hover {
  transform: scale(1.08);
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}

.nav-user-icons {
  display: flex;
  align-items: center;
  gap: 15px;
  flex-wrap: nowrap;
}

.nav-user-icons a {
  font-size: 1.4rem;
  color: var(--texte-principal);
  transition: color 0.3s ease;
}

.nav-user-icons a:hover {
  color: #a6537d;
}

.nav-sommaire {
  /*background-color: #f8f8f8; */
  padding: 0.2em 2em;
  border-left: 4px solid #d63384;
  margin: 2em 0.5em;
}

.dropdown-menu {
  display: none;
  position: absolute;
  left: 0;
  background: var(--fond-principal);
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 0.5rem 0;
  min-width: 220px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  padding-top: 10px;
  margin-top: -10px;    /* remonte le sous-menu visuellement */
  pointer-events: none; /* on enfile pointer-events sur l’espace transparent */
  transition: opacity 0.2s ease;
  opacity: 0;
  /* petit espace pour respirer sous le lien */
  margin-top: 8px; 
  padding-top: 0;      /* on enlève le tunnel transparent */
}

/* Repositionnement du dropdown pour qu’il ne chevauche plus la navbar */
li.dropdown {
  position: relative;
}

li.dropdown:hover > .dropdown-menu {
  opacity: 1;
}

.dropdown-menu > * {
  pointer-events: auto; /* ré-active le clic sur les vrais items */
}
.dropdown:hover .dropdown-menu {
  display: block;
}

li.dropdown:hover > .dropdown-menu,
li.dropdown .dropdown-menu:hover {
  display: block;
}

.dropdown-menu li {
  width: 100%;
}

.dropdown-menu li a {
  display: block;
  padding: 0.75rem 1rem;
  text-decoration: none;
  color: var(--texte-principal);
  font-family: var(--font-menu);
  font-size: 1rem;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.dropdown-menu li a:hover {
  background-color: var(--accent-doux);
  color: var(--accent-violet);
}

.dropdown-menu strong {
  display: block;
  padding: 0.5rem 1rem 0.2rem;
  color: #880e4f;
  font-weight: 600;
  font-size: 0.9rem;
  border-top: 1px solid #f1d9e0;
  margin-top: 0.5rem;
}

.dropdown-menu strong:first-of-type {
  border-top: none;
  margin-top: 0;
}

.nav-user-icons {
  display: flex;
  align-items: center;
  gap: 15px;
}

.nav-user-icons a {
  font-size: 1.3rem;
  color: var(--texte-principal);
  transition: color 0.3s ease;
  margin-left: 8px;
}

/* Par défaut, cacher le sous-menu */
.dropdown ul {
  display: none;
}

/* Quand .open est appliqué, montrer le sous-menu */
.dropdown.open ul {
  display: block;
}

.nav-user-icons a:hover {
  color: #a6537d;
}

/* Ajout de la transition pour l'effet de zoom */
.nav-user-icons a i {
  color: var(--texte-principal);
  transition: transform 0.2s ease, color 0.3s ease;
}


/* FOOTER GLOBAL */
.footer {
  padding: 50px 20px 30px;
  background-color: #fff;
}

/* GRID */
.footer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

/* SECTIONS */
.footer-section h4 {
  margin-bottom: 15px;
  font-size: 1.1rem;
  font-weight: 600;
  font-family: var(--font-titres);
}

.footer-section ul {
  list-style: none;
  padding: 0;
}

.footer-section li {
  margin-bottom: 8px;
}

.footer-section a, .footer-all-articles-link a {
  text-decoration: none;
  color: #333;
  font-size: 1rem;
  font-weight: 500;
  transition: opacity 0.3s ease;
  font-family: var(--font-menu);
}

.footer-section a:hover,
.footer-all-articles-link a:hover {
  color: var(--accent-rose-vif);
  opacity: 0.9;
  font-weight: 600;
}

.footer-reassurance-p{
  font-family: var(--font-menu);
  text-shadow: 1px 1px var(--fond-blanc);
  color: var(--accent-violet) !important;
  font-weight: 500;
  text-align:center;
  text-transform: none !important;
}

/* PAIEMENT */
.footer-payment {
  text-align: center;
  margin-top: 20px;
}

.footer-payment-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-top: 10px;
}

.footer-payment-logos img {
  height: 50px !important; /* 👈 force si conflit */
  width: auto;
  object-fit: contain;
  opacity: 0.9;
}

/* HOVER (léger, premium) */
.footer-payment-logos img:hover {
  opacity: 1;
  transform: translateY(-1px);
}

/* BLOG LINK */
.footer-all-articles-link {
  margin-top: 10px;
}

.footer-extra {
  text-align: center;
  padding: 30px 0;
  margin-top: 40px;
  position: relative;
}

.footer-extra::before {
  content: "";
  display: block;
  width: 60%;
  height: 1px;
  margin: 0 auto 20px;
  background: linear-gradient(
    to right,
    transparent,
    #f3cdd3,
    transparent
  );
}

.ombre {
  text-shadow: 2px 2px var(--accent-rose-vif)!important;
}

/* TEXTE */
.footer-reassurance p, .footer-payment p {
  margin: 5px 0;
  font-size: 1.1rem;
  color: #666;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-family: var(--font-textes);
}

.footer-payment p {
  color: var(--texte-principal) !important;
  font-weight: 600 !important
}
/* PAIEMENT */
.footer-payment {
  margin-top: 15px;
}

.footer-payment img {
  height: 20px;
  margin: 0 8px;
  opacity: 0.7;
  transition: opacity 0.3s ease;
}

.footer-payment img:hover {
  opacity: 1;
}

/* COPYRIGHT */
.footer-bottom {
  text-align: center;
  margin-top: 20px;
  font-size: 0.8rem;
  color: #888;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .footer-grid {
    grid-template-columns: 1fr;
    text-align: center;
  }
}

/* fin addition footer */

/* Icônes : panier, compte, réseaux sociaux */
.user-actions a i,
.social-icons a i {
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  transition: transform 0.3s ease, text-shadow 0.3s ease, color 0.3s ease;
}

/* Animation au survol */
.user-actions a i:hover,
.social-icons a i:hover {
  opacity: 0.8;
  color: #880E4F; /* ou #d63384 selon le groupe */
  transform: scale(1.08); /* effet de zoom subtil */
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}

.user-actions, .social-icons {
  display: flex;
  gap: 10px;
}

.user-actions a i {
  color: var(--texte-principal);
}

.social-icons a i {
  color: var(--texte-principal);
}




.icon-separator {
  width: 2px;
  height: 30px;
  background: linear-gradient(to bottom, transparent, var(--texte-principal), transparent);
  /* background-color: rgba(136, 14, 79, 0.4); /* transparence ici uniquement */
  /* background-color: var(--texte-principal); /* light grey */;
  /* opacity: 0.7; */
  margin: 0 12px;
  border-radius: 10px;
}

.newsletter-container {
  max-width: 1200px;
  padding: 20px;
  margin: 0 auto; /* Centrer la section horizontalement */
  text-align: center;
}

.newsletter-container h2 {
  font-family: var(--font-titres); /* Applique une police similaire à celles des titres */
  color: #880e4f;
  margin-bottom: 1rem; /* Ajoute un espace sous le titre */
}

.newsletter-section h2,
.new-collection h2 {
  margin-top: 30px;
  font-size: 2rem; /* adapte à la taille que tu veux exactement */
  font-family: var(--font-titres);
  font-weight: 700;
  line-height: 1.2;
  color: var(--accent-violet);
}

.newsletter-section {
  background-color: var(--fond-principal);
}

.newsletter-section p {
  font-size: 1.40rem;
}

.newsletter-form {
  display: flex;
  flex-direction: column;
  align-items: center; /* Centrer le formulaire */
  justify-content: center;
  gap: 10px; /* Espace entre le champ et le bouton */
}

.newsletter-form input[type="email"] {
  padding: 10px;
  font-size: 1rem;
  width: 100%; /* Prendre toute la largeur disponible */
  max-width: 400px; /* Limiter la largeur du champ */
  border: 1px solid #ddd;
  border-radius: 5px;
}

input:focus, textarea:focus, select:focus {
  outline: none; /* supprime le contour bleu par défaut */
  box-shadow: 0 0 4px #d63384; /* ajoute un effet lumineux subtil autour */
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translate(-50%, -45%);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%);
  }
}

/* A SUPPRIMER POUR NETTOYAGE QUAND LE POPUP SERA VISUELLEMENT PARFAIT */
.newsletter-popup {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--accent-doux);
  padding: 2.5rem 2rem;
  border-radius: 30px;
  border: 2px solid var(--fond-blanc); 
  width: 90%;
  max-width: 480px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
  color: var(--texte-principal);
  animation: fadeIn 0.5s ease;
  text-align: center;
  text-align: justify;
  line-height: 1.6;
  font-weight: 500;
  transition: opacity 0.3s ease, transform 0.3s ease;
}


.popup{
  display: none;
  position: fixed;
  z-index: 9999;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--accent-doux);
  padding: 2.5rem 2rem;
  border-radius: 30px;
  border: 2px solid var(--fond-blanc); 
  width: 90%;
  max-width: 480px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
  color: var(--texte-principal);
  animation: fadeIn 0.5s ease;
  text-align: center;
  text-align: justify;
  line-height: 1.6;
  font-weight: 500;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.popup h2 {
  font-family: var(--font-titres);
  font-size: 1.6rem;
  margin-bottom: 10px;
  text-align: left;
  color: var(--accent-rose-vif);
  font-weight: bold;
  text-shadow: 1px 2px var(--fond-blanc);
}
    

.newsletter-popup.show {
    display: block;
    opacity: 1;
}

/* Supprimer ultérieurement */
.newsletter-popup h2 {
  font-family: var(--font-titres);
  font-size: 1.5rem;
  margin-bottom: 10px;
  text-align: left;
  color: var(--texte-principal);
}

.newsletter-popup p {
  font-family: var(--texte-principal);
  color: var(--texte-principal);
  font-size: 1.4rem;
  line-height: 1.2;
  }

.newsletter-popup.show {
  display: block;
}



.newsletter-popup input {
  background-color: #fff;
  border-radius: 25px;
  border: 2px solid var(--accent-doux);
  padding: 0.8rem 1rem;
  font-family: var(--font-menu);
  font-size: 1rem;
  width: 80%;
  margin: 0.5rem auto;
  display: block;
  box-sizing: border-box;
}

body .popup .newsletter-popup input[type="email"] {
  background-color: #fff !important;
  border-radius: 25px !important;
  border: 2px solid var(--accent-doux) !important;
  padding: 0.8rem 1rem !important;
  font-family: var(--font-menu) !important;
  font-size: 1rem !important;
  width: 80% !important;
  margin: 0.5rem auto !important;
  display: block !important;
  box-sizing: border-box !important;
}

input.custom-newsletter-input {
  all: unset;
  background-color: var(--fond-blanc) !important;
  border-radius: 25px !important;
  padding: 0.6rem 0.8rem !important;
  font-family: var(--font-menu) !important;
  font-size: 1.1rem !important;
  width: 70% !important;
  margin: 0.5rem auto !important;
  display: block !important;
  box-sizing: border-box !important;
  border: 3px solid var(--accent-violet) !important;
  transition: border 0.3s ease, box-shadow 0.3 ease !important;
  color: var(--accent-rose-vif) !important;
}

input.custom-newsletter-input::placeholder {
  color: var(--texte-principal) !important;
  font-size: 1.1remp !important;
  opacity: 1 !important; /* certains navigateurs mettent une opacité par défaut */
}

input.custom-newsletter-input:focus, input.custom-newsletter-input:hover {
  outline: none !important;
  border-color: var(--accent-doux) !important;
  box-shadow: 0 0 0 3px rgba(236, 72, 153, 0.4) !important; /* halo rose */
  color: var(--accent-rose-vif) !important;
  font-size: 1.1remp !important;
}
    

.newsletter-popup button {
  font-family: var(--font-menu);
  font-size: 1rem;
  padding: 0.8rem 1rem;
  border-radius: 25px;
  border: none;
  width: 80%;
  margin: 0.5rem auto;
  display: block;
  cursor: pointer;
}

.popup .champ-newsletter:focus {
  border: 2px solid var(--accent-doux) !important;
  box-shadow:
    0 0 0 4px rgba(228, 158, 201, 0.4),    /* halo doux autour */
    0 0 8px rgba(228, 158, 201, 0.6),      /* halo diffus supplémentaire */
    inset 0 0 4px rgba(228, 158, 201, 0.3) !important; /* ombre interne légère */
  outline: none !important;
}

.newsletter-popup-btn {
  background-color: var(--accent-violet);
  color: var(--fond-blanc);
  cursor: pointer;
  transition: background-color 0.3s;
  font-family: var(--font-menu);
  font-size: 1rem;
  padding: 0.6rem 0.8rem;
  border-radius: 25px;
  border: none;
  width: 70%;
  margin: 0.5rem auto;
  display: block;
  font-weight: bold;
}

.custom-newsletter-input:focus {
    outline: none !important;
    border-color: var(--accent-doux) !important;
    box-shadow: 0 0 0 3px rgba(236, 72, 153, 0.4) !important;
}



.newsletter-popup-btn:hover {
  background-color: var(--accent-rose-vif);
  transform: scale(1.05);
}

.close-btn {
  color: var(--accent-violet);
  float: right;
  font-size: 30px;
  position: absolute;
  top: 15px;
  right: 20px;
  cursor: pointer;
  transition: transform 0.3s ease-in-out; /* Transition pour l'effet de rotation */
  font-weight: bold;
  border-radius: 50%; /* Cercle autour de la croix */
  border: 2px solid var(--accent-violet); /* Liseré de la couleur du bouton */
}

.close-btn:hover {
  color: var(--accent-violet);
  transform: rotate(90deg); /* Rotation de 90 degrés */
}

.newsletter-popup input,
.newsletter-popup button {
  font-family: var(--font-menu);
  font-size: 1rem;
  padding: 0.8rem 1rem;
  border-radius: 25px;
  border: none;
  width: 80%;
  margin: 0.5rem auto;
  display: block;
}

.newsletter-popup input::placeholder {
  color: #aaa;
  font-style: italic;
}

.newsletter-popup input {
  background-color: #fff;
}

.newsletter-popup button {
  background-color: var(--accent-violet);
  color: var(--fond-blanc);
  cursor: pointer;
  transition: background-color 0.3s;
}

.newsletter-popup button:hover {
  background-color: var(--accent-rose-vif);
  transform: scale(1.05);
}

.newsletter-popup p {
  font-size: 1rem; /* Augmente la taille de la police */
  line-height: 1.5;  /* Améliore l'espacement entre les lignes */
}


@media (max-width: 768px) {
  .nav-container {
    flex-direction: column;
    align-items: center;
  }

  .nav-links {
    flex-direction: column;
    gap: 10px;
  }

  .nav-user-icons {
    margin-top: 10px;
  }

  .dropdown-menu {
  position: relative;
  top: auto;
  left: auto;
  box-shadow: none;
  border: none;
  padding: 0.5rem 1rem;
}

  .dropdown:hover .dropdown-menu {
    display: block;
  }

  .newsletter-form input[type="email"] {
    max-width: 100%; /* S'assurer que le champ s'ajuste bien */
  }

    
  .newsletter-form button {
    width: 100%; /* Le bouton prend toute la largeur */
  }
}

/* HERO */
.hero {
  /*background-color: var(--accent-doux);*/
  /*background-image: url('http://localhost/atelier-sakura-wp/wp-content/uploads/2025/06/hero-accueil.png');*/
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  text-align: center;
  color: #fff;
  z-index: 10;
  font-weight: bold;
  position: relative;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 65vh;
  padding: 4rem 2rem;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.1); /* moins opaque */
  backdrop-filter: blur(0.5px); /* ou remove */
  z-index: 0;
  background: rgba(0, 0, 0, 0.2); /* noir avec 20% d’opacité */
  top: 0; left: 0; right: 0; bottom: 0;
}

.hero-content {
  position: relative;
  z-index: 1;
  max-width: 800px;
  margin: auto;
}

.hero h1 {
  font-family: var(--font-titres);
  font-size: 3.2rem;
  margin-bottom: 1rem;
  color: var(--accent-doux);
  text-shadow: 1px 1px var(--accent-rose-vif);
}

.hero p {
  font-size: 1.55rem;
  margin-bottom: 2rem;
  color: var(--fond-principal);
  text-decoration: none;
  font-weight: none;
}

#a-propos-p-2{
  color: var(--texte-principal) !important;
  text-shadow: 2px 1px var(--accent-doux) !important;
  font-weight: bold !important;
  font-size: 2rem !important;

}

.hero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  position: relative;
  border: 2px solid var(--accent-violet);
  border-radius: 30px;
  padding: 12px 30px 12px 2.7rem;
  background-color: var(--fond-blanc);
  color: var(--texte-principal);
  font-family: var(--font-menu);
  font-size: 1.1rem;
  font-weight: 500;
  cursor: pointer;
  /* RESET Flatsome */
  box-shadow: none !important;
  outline: none !important;
  border-image: none !important;
  transition: background-color 0.35s ease, color 0.25s ease;
  /* important pour animation fleur */
  overflow: visible;
}

.hero-btn-purple {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  position: relative;
  border: 2px solid var(--accent-violet);
  border-radius: 30px;
  padding: 12px 30px 12px 2.7rem;
  background-color: var(--accent-violet);
  color: var(--fond-blanc);
  font-family: var(--font-menu);
  font-size: 1.1rem;
  font-weight: 500;
  cursor: pointer;
  /* RESET Flatsome */
  box-shadow: none !important;
  outline: none !important;
  border-image: none !important;
  transition: background-color 0.35s ease, color 0.25s ease;
  /* important pour animation fleur */
  overflow: visible;
}
/* =========================
   Bouton Hero pour Nouvelle Collection
   ========================= */
.new-collection .hero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 2px solid var(--accent-violet);
  border-radius: 30px;
  background-color: var(--fond-blanc);
  color: var(--texte-principal);
  font-family: var(--font-menu);
  font-size: 1.1rem;
  font-weight: 500;
  cursor: pointer;
  /* RESET Flatsome */
  box-shadow: none !important;
  outline: none !important;
  border-image: none !important;
  transition: background-color 0.35s ease, color 0.25s ease;
  position: relative;          /* pour que ::before soit positionné correctement */
  padding: 12px 30px 12px 2.7rem; /* espace pour la fleur à gauche */
  overflow: visible;           /* permet à la fleur de dépasser si nécessaire */
}
}

.hero-btn:hover {
  box-shadow: inset 0 0 0 2px var(--accent-violet);
  background-color: var(--accent-doux);
  color: var(--texte-principal);
}


.hero-btn-purple:hover{
  box-shadow: inset 0 0 0 2px var(--accent-violet);
  background-color: var(--accent-doux);
  color: var(--accent-violet);
}

/* Hover : couleur et box-shadow */
.new-collection .hero-btn:hover {
  background-color: var(--accent-doux);  /* même comportement que header */
  color: var(--texte-principal);
  box-shadow: inset 0 0 0 2px var(--accent-violet);
}


/* 🌸 icône */
.hero-btn::before {
  content: "🌸";
  margin-right: 0.5rem;   /* espace entre icône et texte */
  font-size: 1.2rem;
  display: inline-block;  /* flux flex normal */
  opacity: 0.85;
  transform-origin: center;
  transition: transform 0.35s ease;
}
/* 🌸 icône avant le texte */
.new-collection .hero-btn::before {
  content: "🌸";
  margin-right: 0.5rem;  /* espace entre icône et texte */
  font-size: 1.2rem;
  display: inline-block;
  opacity: 0.85;
  transform-origin: center;
  transition: transform 0.35s ease;
}


/* Optionnel : petite animation de la fleur */
.hero-btn:hover::before {
 transform: scale(1.2);
}
/* Hover icône : grossissement */
.new-collection .hero-btn:hover::before {
    transform: translateY(-50%) scale(1.2); /* grossit sans descendre */
}

/* Assurer que les parents n'empêchent pas le overflow */
.new-collection .collection-content {
  overflow: visible;
}

.hero-btn[type="submit"],
button.hero-btn {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: var(--fond-blanc);
  border: 2px solid var(--accent-violet);
  border-radius: 30px;
  font-family: var(--font-menu);
  font-size: 1.1rem;
  font-weight: 500;
  cursor: pointer;
  overflow: hidden;
  text-transform: none;
  padding: 12px 30px 12px 2.7rem;
  box-shadow: 0 1px 2px var(--accent-violet);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  color: var(--texte-principal);
  text-decoration: none;
  transition: background 0.3s ease;
}


/*
.yellow-bg{
  background-color: #FAF8F5;
}
*/
.hero-btn.yellow-bg:hover{
  background-color: #FBC531;
  color: #333333;
  border: none;
}

/* Effet de l'icône lors du survol */
.hero-btn:hover::before {
  opacity: 1; /* rendre l'icône pleinement visible */
}

.hero-btn:hover {
  background-color: var(--accent-doux);
  box-shadow: 0 1px 2px var(--accent-doux);
}

.image-hover img {
  width: 100%;
  max-width: 300px; /*taille max d'une image*/
  height: auto;
  border-radius: 10px;
  transition: transform 0.3s ease, filter 0.3s ease;
  box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

.image-hover:hover img {
  transform: scale(1.03);
  filter: brightness(110%);
}

.image-hover img:hover {
  transform: scale(1.05); /* petit zoom au survol */
}


.cta-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background-color: var(--accent-doux);
  color: var(--texte-principal);
  font-weight: bold;
  text-decoration: none;
  border-radius: 0.5rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.cta-button:hover {
  background-color: #e5c661; /* version légèrement plus claire de #D4AF37 */
  transform: translateY(-2px);
}

.cta-icon {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}

.nav-icons {
  display: flex;
  gap: 12px;
  align-items: center;
}

.nav-icons a {
  color: var(--texte-principal);
  font-size: 1.1rem;
  transition: color 0.3s ease;
}

.nav-icons a:hover {
  color: #a6537d;
}

.new-collection {

@media (max-width: 768px) {
  .nav-container {
    flex-direction: column;
    align-items: center;
  }

  .nav-links {
    flex-direction: column;
    gap: 10px;
  }

  .nav-user-icons {
    margin-top: 10px;
  }

  .dropdown-menu {
  position: relative;
  top: auto;
  left: auto;
  box-shadow: none;
  border: none;
  padding: 0.5rem 1rem;
}

  .dropdown:hover .dropdown-menu {
    display: block;
  }

  .newsletter-form input[type="email"] {
    max-width: 100%; /* S'assurer que le champ s'ajuste bien */
    border-radius: 25px; 
    border: none;
    border-radius: 25px !important;
  }

  .newsletter-form button {
    width: 100%; /* Le bouton prend toute la largeur */
  }
}

/* HERO */
.hero {
  /*background-color: var(--accent-doux);*/
  background-image: url('../img/washi-et-bijoux-plus.png');
  background-size: cover;
  background-position: center;
  padding: 6rem 2rem;
  text-align: center;
  color: #fff;
  position: relative;
  z-index: 10;
  font-weight: bold;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(2px);
  z-index: 0;
}

.hero-content {
  position: relative;
  z-index: 1;
  max-width: 800px;
  margin: auto;
}

.hero h1 {
  font-family: var(--font-titres);
  font-size: 3rem;
  margin-bottom: 1rem;
  color: var(--accent-violet);
}

.hero p {
  font-size: 1.40rem;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  text-decoration: none;
}

.hero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--accent-violet);
  border-radius: 30px;
  gap: 0.5rem; /* espacement automatique entre la fleur et le texte */
  font-family: var(--font-menu);
  font-size: 1.1rem;
  font-weight: 500;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 2px var(--accent-violet);
  padding: 12px 30px 12px 2.7rem; /* 🪷 Ajoute de l’espace à gauche */
  background: var(--fond-blanc);
  color: var(--texte-principal);
  text-decoration: none;
  transition: background 0.3s ease;
}


.hero-btn::before {
  content: "🌸";
  position: absolute;
  top: 50%;
  left: 12px; /* espace entre le bord gauche du bouton et la fleur */
  transform: translateY(-50%);
  font-size: 1.2rem;
  opacity: 0.8;
  pointer-events: none;
  transition: opacity 0.3s ease; /* effet de transition pour l'icône */
}

/*
.yellow-bg{
  background-color: #FAF8F5;
}
*/

.hero-btn.yellow-bg:hover{
  background-color: #FBC531;
  color: #333333;
  border: none;
}

/* Effet de l'icône lors du survol */
.hero-btn:hover::before {
  opacity: 1; /* rendre l'icône pleinement visible */
}

.image-hover img {
  width: 100%;
  max-width: 300px; /*taille max d'une image*/
  height: auto;
  border-radius: 10px;
  transition: transform 0.3s ease, filter 0.3s ease;
  box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

.image-hover:hover img {
  transform: scale(1.03);
  filter: brightness(110%);
}

.image-hover img:hover {
  transform: scale(1.05); /* petit zoom au survol */
}


.cta-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background-color: var(--accent-doux);
  color: var(--texte-principal);
  font-weight: bold;
  text-decoration: none;
  border-radius: 0.5rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.cta-button:hover {
  background-color: #e5c661; /* version légèrement plus claire de #D4AF37 */
  transform: translateY(-2px);
}

.cta-icon {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}

.nav-icons {
  display: flex;
  gap: 12px;
  align-items: center;
}

.nav-icons a {
  color: var(--texte-principal);
  font-size: 1.1rem;
  transition: color 0.3s ease;
}

.nav-icons a:hover {
  color: #a6537d;
}
  padding: 80px 20px;
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(6px);
  border-radius: 20px;
  margin: 60px auto;
  max-width: 1200px;
  color: var(--fond-blanc);
  background-color: var(--accent-secondaire); /* turquoise très clair */
  color: var(--texte-principal); /* texte foncé pour lisibilité */
  padding: 4rem 2rem;
  text-align: center;
}

/* Images de la nouvelle collection */
.new-collection-images {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  margin-top: 2rem;
}

.new-collection-images img {
  width: 250px;
  max-width: 100%;
  border-radius: 15px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease;
}

.new-collection-images img:hover {
  transform: scale(1.05);
}

/* Texte de la section */
.new-collection h2, .new-collection p {
  color: var(--texte-principal); /* assure le contraste */
}

.new-collection p {
  font-size: 1.40rem;
}

/* Séparation fleurie à la fin de la section */
.separator {
  background: url('../img/separateur-fleuri.png') no-repeat center;
  background-size: contain;
  height: 60px;
  margin-top: 3rem;
}

.collection-container {
  display: flex;
  flex-direction: column;
  gap: 40px;
 /* max-width: 1100px;
  width: 100%;
  align-items: center;
  justify-content: center;
  text-align: center;*/
}

.collection-content {
  /*max-width: 600px;
  margin: 0 auto;*/
  text-align: center;
}

.collection-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
}

.collection-name {
  font-size: 1.1rem;
  color: var(--texte-principal);
  text-decoration: none;
  transition: color 0.3s ease, transform 0.3s ease;
}

.collection-name:hover {
  color: #880e4f;
  transform: scale(1.05);
}

.collection-content h2 {
  font-family: var(--font-titres);
  font-size: 2.5rem;
  margin-bottom: 20px;
}

.collection-content .highlight{
  color: var(--fond-principal);
  text-shadow: 1px 1px 2px #880e4f;
}

.blog-preview h2{
  text-shadow: none !important;
}

.collection-content {
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 30px;
}

.collection-content p {
  color: var(--texte-principal);
  text-shadow: 1px 1px 2px var(--fond-principal);
}


/* mes collections, boucles ... */
.categories {
  background-color: #FAF8F5;
  padding-top: 60px;
  padding-bottom: 40px;
}

.categories-section {
  padding: 2rem;
  text-align: center;
}

.section-title {
  font-size: 1.8rem;
  margin-bottom: 2rem;
  font-weight: bold;
  color: var(--accent-violet);
  text-align: center;
  display: block;
  width: 100%;
}

/* Grilles responsive */
.cards-grid {
  display: grid;
  gap: 2rem; /* anciennement 1.5rem */
  justify-content: center;
  margin-bottom: 3rem;
  padding: 0 1rem;
}

.cards-3 {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  max-width: 1000px;
  margin: 0 auto;
  margin-bottom: 80px;
}

.cards-2 {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  max-width: 800px;
  margin: 0 auto;
}

.cards-5 {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  max-width: 1100px;
  margin: 0 auto;
}

/* Carte de catégorie */
.card {
  position: relative;
  width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 250px;
  text-align: center;
  color: white;
  font-size: 1.2rem;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  transition: transform 0.3s ease;
  text-decoration: none;
  --bg-url: none; /* Valeur par défaut */
  text-align: center;
}

.card::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--bg-url);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: transform 0.5s ease;
  z-index: 0;
  will-change: transform;
}

.cards-grid .card span {
  font-family: var(--font-titres);
  letter-spacing: 0.02em; /* Ajuste cette valeur si nécessaire */
  line-height: 1.3;        /* Assure un bon espacement vertical aussi */
  font-size: 1.30rem;
}


.card:hover::before {
  transform: scale(1.05);
}

.card:hover {
  transform: scale(1.03);
}

.card span {
  color: var(--fond-blanc);
}
.card:hover span {
  color: white;
}

.card span,
.card-title {
  position: relative;
  z-index: 1;
  background-color: rgba(0, 0, 0, 0.4);
  padding: 0.5rem 1rem;
  border-radius: 8px;
  font-size: 1.2rem;
  font-weight: 600;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
}

/* Responsive mobile */
@media (max-width: 500px) {
  .section-title {
    font-size: 1.5rem;
  }

  .card-title {
    font-size: 1rem;
    padding: 0.4rem 0.8rem;
  }

  .card {
    height: 150px;
  }
}

/* Texte complémentaire */
.highlight {
  color: #d63384;
  font-weight: bold;
  padding: 0 4px;
  border-radius: 4px;

}

.short-description {
  font-size: 1.1rem;
  margin-bottom: 1rem;
  color: #5c5c5c;
  font-weight: 500;
}

/* Section image de collection */
.collection-images {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 20px;
}

.collection-images img {
  width: 100%;
  max-width: 400px;
  height: auto;
}

.features-container {
  display: flex;
  flex-direction: row;
  align-items: center
  gap: 40px;
  flex-wrap: wrap;
  max-width: 1100px;
  margin: 0 auto;
}

/* Section conception */
.features {
  background-color: var(--accent-doux);
  padding: 80px 20px;
}

.features-container {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 40px;
  max-width: 1100px;
  margin: 0 auto;
  flex-wrap: nowrap;
  background-color: transparent;/*var(--accent-doux);*/
}

.features.section > h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 2rem;
}

.features.section h2{
  color: var(--accent-violet);
}

.features-wrapper {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1rem;
}

.features-image {
  flex: 0 0 300px;
}

.features-image img {
  width: 100%;
  max-width: 300px; /* reduced width */
  max-height: 300px; /* to prevent excessive height*/
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.features-text {
  flex: 1;
}

.features-text h2 {
  font-size: 2rem;
  margin-bottom: 1rem;
}

.features-text p {
  margin-bottom: 1.2rem;
  line-height: 1.6;
  font-size: 1.25rem;
  color: var(--texte-principal);
  text-align: justify;
}

.bullet-points {
  list-style-type: none;
  font-size: 2rem;
  padding: 0;
  color: var(--texte-principal);
  margin-bottom: 30px;
}

.bullet-points li {
  margin-bottom: 0.5rem;
  position: relative;
  padding-left: 2em;
  color: var(--texte-principal);
  font-size: 1.25rem;
}


.bullet-points li::before {
  content: "🌸";/*"✓";*/
  color: #e91e63;
  position: absolute;
  left: 0;
  top: 0;
  line-height: 1.2;
  font-size: 1.2em;
  text-shadow: 1px 1px 2px #FAF8F5;
}

.zoom-on-hovering:hover {
  transition: transform 0.5s ease;
  transform: scale(1.03);
}

@media (max-width: 768px) {
  .features-container {
    flex-direction: column;
  }

  .features-image,
  .features-text {
    text-align: center;
  }

  .features-text h2 {
    font-size: 1.6rem;
  }

  .features-text p {
    font-size: 1rem;
  }
}

/* Responsive pour la section "Un savoir-faire artisanal" */
@media (max-width: 768px) {
  .features-container {
    flex-direction: column;      /* image au-dessus, texte en dessous */
    align-items: center;         /* centre horizontalement l'image et le texte */
    gap: 20px;                   /* espace entre image et texte */
  }

  .features-image {
    width: 100%;                 /* image prend toute la largeur dispo */
    max-width: 400px;            /* limite la taille max pour ne pas être trop grande */
    text-align: center;          /* centre l'image si nécessaire */
  }

  .features-image img {
    display: block;
    margin: 0 auto;              /* centre l'image horizontalement */
  }

  .features-text {
    width: 100%;                 /* texte prend toute la largeur disponible */
    text-align: center;          /* centre texte et bouton sur mobile */
  }
}

/* Section Zoom sur le papier Washi */
.focus-washi {
  background-color: var(--accent-secondaire);
  padding: 40px 20px 80px;
}

/*
.focus-washi.section {
  background-color: #FAF8F5;
  padding: 80px 20px;
}
*/

.focus-washi h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 40px;
  font-family: var(--font-titres);
  color: var(--fond-blanc);
  text-shadow: 2px 2px 2px var(--texte-principal);/*#880e4f*/
}

.focus-washi-content {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
}

.focus-washi-image {
  flex: 1 1 55%;
  min-width: 300px;
  max-width: 500px;
 /* text-align: center; */
}

.focus-washi-image img {
  width: 100%;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  object-fit: cover;
}

.focus-washi-image img:hover {
  transition: transform 0.5s ease;
  transform: scale(1.03);
}

.focus-washi-text {
  flex: 1 1 40%;
  line-height: 1.6;
  margin-bottom: 20px;
  font-size: 1.25rem;
  color: var(--texte-principal);
  display: flex;
  flex-direction: column;
  align-items: center; /* centre horizontalement tout ce qui est dans ce bloc */
}

.focus-washi-text p {
  margin-bottom: 20px;
  line-height: 1.6;
  font-size: 1.25rem;
  color: var(--texte-principal);
  text-align: justify; /* laisse le texte justifié comme tu veux */
  width: 100%;
}

.focus-washi-text .hero-btn {
  margin-top: 1.5rem; /* espace entre le texte et le bouton */
}
/* début responsive washi section */

/* Responsive pour mobile / petits écrans */
@media (max-width: 768px) {
  .focus-washi-content {
    flex-direction: column; /* image au-dessus, texte en dessous */
    align-items: center;    /* centre le contenu horizontalement */
    gap: 20px;              /* espace entre image et texte */
  }

  .focus-washi-text {
    width: 100%;            /* prend toute la largeur disponible */
    align-items: center;    /* centre le bouton et le texte si nécessaire */
    text-align: center;     /* texte centré sur mobile */
  }

  .focus-washi-text p {
    width: 100%;            /* texte prend toute la largeur */
    text-align: justify;    /* tu peux garder justify si tu veux */
  }

  .focus-washi-image {
    width: 100%;            /* image pleine largeur */
    max-width: 400px;       /* limite la taille max pour éviter trop grande */
  }

  .focus-washi-text .hero-btn {
    margin-top: 1.5rem;     /* garde l'espace entre texte et bouton */
  }
}
/* FIN RESPONSIVE */


.collection-intro {
  font-weight: bold;
  font-size: 1.1em;
  margin-top: 30px;
  margin-bottom: 20px;
  color: #333;
}

.cta-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: flex-start;
}

.hero-btn.secondary {
  background-color: transparent;
  color: var(--accent-violet);
}

.hero-btn.secondary:hover {
  background-color: var(--accent-violet);
  color: var(--fond-blanc);
  transition: background 0.3s ease;
  box-shadow: 0 1px 2px var(--accent-doux);
  border: 3px solid var(--accent-violet);
}


/* Responsive design */
@media (max-width: 768px) {
  .focus-washi-content {
    flex-direction: column;
    text-align: center;
  }

  .focus-washi h2 {
    font-size: 2rem;
  }

  .focus-washi-text {
    font-size: 1rem;
  }
}

/* Section témoignages */
.testimonials {
  background-color: #FAF8F5;
  text-align: center;
  padding: 80px 20px;
}

.testimonials h2 {
  color: var(--accent-rose-vif);
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 40px;
  font-family: var(--font-titres);
}

.carousel-container {
  position: relative;
  overflow: hidden;
  max-width: 900px;
  margin: 0 auto;
}

.carousel-track {
  display: flex;
  transition: transform 0.5s ease-in-out;
  width: 100%;
  transform: translateX(0); /* ← AJOUTE CETTE LIGNE */
  min-height: 300px;
}

.testimonial-slide {
  flex: 0 0 100%;
  box-sizing: border-box;
  padding: 20px 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--texte-principal);
  max-width: 100%;
}

.testimonial-slide img {
  width: 110px;
  height: 110px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 20px;
 /* background-color: #eee;*/
}

.testimonial-slide img:hover {
  transition: transform 0.5s ease;
  transform: scale(1.03);
}

.testimonial-slide p {
  font-style: italic;
  font-size: 1.2em;
  margin-bottom: 10px;
  text-align: center;
  color: var(--texte-principal);
}

.testimonial-slide span {
  display: block;
  font-weight: bold;
  margin-top: 10px;
  color: var(--texte-principal);
  font-size: 1.1em;
}

.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: var(--accent-violet);
  border: none;
  padding: 10px 15px;
  cursor: pointer;
  color: white;
  font-size: 1.5rem;
  border-radius: 50%;
  z-index: 2;
}

.carousel-btn:hover {
  background-color: var(--accent-rose-vif);
}

.carousel-btn.prev {
  left: 20px;
}

.carousel-btn.next {
  right: 20px;
}

.carousel-btn.hidden {
  display: none !important;
}
/* fin témoignages */

/* Qui suis je */
.portrait-container {
  text-align: center;
  margin: 20px 0;
}

.portrait-round {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  border: 2px solid #eaeaea;
}

.portrait-round:hover {
  transition: transform 0.5s ease;
  transform: scale(1.03);
}

.about-section .signature {
 font-family: 'Dancing Script', cursive !important;
  font-size: 1.9rem !important;
  line-height: 1.2;
  color: var(--texte-principal);
  margin-top: 0.5rem;
}


.signature {
  font-family: 'Dancing Script', cursive !important;
  font-size: 1.9rem !important;
  line-height: 1.2;
  color: var(--texte-principal);
  margin-top: 0.5rem;
}

.signature-role {
  font-family: var(--font-principale);
  font-size: 1.5rem !important;
  opacity: 0.8;
  display: block;
  margin-top: 4px;
  text-align: left !important;
}

.signature::after {
  content: "";
  display: block;
  width: 60%;
  height: 1px;
  margin-top: 5px;
}

.signature::before {
  content: "🌸";
  margin-right: 0.5rem;      /* espace entre la fleur et le texte */
  font-size: 1.2rem;         /* même taille que le texte pour rester harmonieux */
}

/* Ajustement responsive pour tablettes / petits écrans */
@media screen and (max-width: 1024px) {
  .signature {
    font-size: 1.1rem;
  }
  .signature::before {
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 768px) {
  .signature {
    font-size: 1rem;
  }
  .signature::before {
    font-size: 1rem;
  }
}

@media screen and (max-width: 480px) {
  .signature {
    font-size: 0.95rem;
  }
  .signature::before {
    font-size: 0.95rem;
  }
}


.about-section .devise {
  font-size: 1.3rem;
  font-weight: 500;
  margin-top: 2rem;
  font-style: italic;
  text-align: center;
  color: #880e4f; /* ou var(--accent-principal) si tu en as défini un */
}

/* A GARDER CELA UNIQUEMENT POUR .new-collection*/
/* SECTION (fond pleine largeur) */
.new-collection {
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

.new-collection .container {
  background-color: transparent !important;
}


/* CONTENEUR CENTRÉ */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 2rem;
}

/* LAYOUT 2 COLONNES */
.new-collection .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

/* TEXTE */
.collection-content {
  flex: 1;
}

/* IMAGES */
.new-collection-images {
  flex: 1;
  justify-content: centerflex-direction: column;
  gap: 20px; /* espace entre les deux images */
}

@media (max-width: 768px) {
  .container {
    flex-direction: column;
  }
}

/* CARTES */
.new-collection-images .collection-item {
  width: 180px;
}

.about-preview {
  background-color: var(--accent-secondaire);
  width: 100%;
  padding: 4rem 0;
}

.section-content {
  max-width: 1200px;
  margin: auto;
  padding: 0 2rem;
}



.about-preview h2 {
  font-family: var(--font-titres);
  font-size: 2.5rem;
  margin-bottom: 20px;
  color: var(--fond-principal);
  text-shadow: 1px 1px 2px #880e4f;
  text-align: center;
}

.about-preview p {
 font-size: 1.25rem;
  color: var(--texte-principal);
  text-align: justify;
}

.blog-preview h2 {
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 40px;
  font-family: var(--font-titres);
  color: var(--accent-violet);
  text-shadow: 1px 1px 2px var(--accent-rose-vif);/*#880e4f*/
}
/* fin de qui suis-je section

/* Page de blog - Article Washi */
article {
  max-width: 800px;
  margin: auto;
  padding: 2rem;
}

.blog-h1 {
  font-family: var(--font-titres);
  font-size: 2.4rem;
  margin-bottom: 20px;
  margin-top: 30px;
  font-weight: 700;
  line-height: 1.2;
  color: #FAF8F5;/*var(--texte-principal);*/
  margin: 0;
  text-shadow: 1px 1px #FAF8F5;
}

.blog-h1-rose {
  font-family: var(--font-titres);
  font-weight: 500;
  padding: 0 4px;
  color: #d63384;
}

.blog-h2 {
  font-size: 2rem;
  margin-top: 2rem;
  color: var(--font-titres);
}

.blog-sommaire-lien {
  color: #d63384;
  font-weight: bold;
  text-decoration: none;
  font-size: 1.25rem;
  margin-bottom: 2rem;
  line-height: 1.6;
  font-family: var(--font-textes);
  position: relative; /* Ajout important */
  padding-left: 2rem; /* Pour éviter que le texte chevauche la fleur */
}

.blog-sommaire-lien::before {
  content: "🌸";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  font-size: 1.2rem;
  opacity: 0.8;
  pointer-events: none;
}

.blog-sommaire-lien:hover {
  color: var(--texte-principal);
  text-shadow: 1px 1px var(--texte-principal);
 text-shadow: 0px 0px 0px transparent;
}

.blog-h3-titre-rubrique {
  color: #880e4f;
  text-shadow: 2px 1px 1px var(--texte-principal);
  margin-top: 30px;
  font-weight: 700;
  font-family: var(--font-titres);
  font-size: 2rem;
  margin-bottom: 20px;
  text-align: left;
  margin-top: 35px;
}

.custom-hr {
  margin: 2em auto;
  border: none;
  border-top: 1px solid #C2185B; /* rose soutenu */
  width: 65%;
  box-shadow: 1px 1px 1px var(--accent-rose-vif);
  margin-top: 40px !important;
  margin-top: 40px !important;
}

.blog-p {
  text-align: justify;
  font-family: var(--texte-principal);
}



.faq h2 {
  color: var(--accent-rose-vif);
  text-align: center;
  font-size: 2.5rem;
  margin-bottom: 40px;
  font-family: var(--font-titres);
}

figure {
  margin: 2rem 0;
  text-align: center;
}

article img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.blog-li {
  position: relative;  /*  Nécessaire pour ancrer le ::before */
  padding-left: 2em; /*  Pour éviter que le texte chevauche la fleur */
  text-decoration: none;
  font-size: 1.20rem;
  color: var(--texte-principal);
  margin-bottom: 2rem;
  line-height: 1.6;
  font-family: var(--font-textes);
}

.blog-li::before {
  content: "🌸";
  position: absolute;
  font-size: 1.20rem;
  top: 0.8em;
  left: 0; /* espace entre le bord gauche du bouton et la fleur */
  transform: translateY(-50%);
  opacity: 0.8;
  line-height: 1;
  pointer-events: none;
  transition: opacity 0.3s ease; /* effet de transition pour l'icône */
}

.blog-liens-vers-la-boutique {
  color: #880E4F;
  font-weight: bold;
  font-size: 1.20rem;
  text-decoration: none;
  margin-bottom: 2rem;
  line-height: 1.6;
  font-family: var(--font-textes);
  position: relative;
  padding-left: 2rem;
}

.blog-liens-vers-la-boutique:hover{
  color: #A4D4C1;
  text-shadow: 1px 1px var(--texte-principal);
}

.blog-hero-figcaption {
  font-style: italic;
  margin-top: 0.5em;
  font-size: 1.4rem;
  color: #FAF8F5;
  max-width: none;
  width: auto;
  display: inline-block;
  white-space: nowrap;
  font-weight: 600;
}

.image-centree {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 80%;
  height: auto;
  border-radius: 8px;
}

hr {
  margin: 2em 0;
  border: none;
  border-top: 1px solid #ccc;
  opacity: 0.5;
}

.blog-a-violet, .blog-a-rose {
  text-decoration: none;
  font-weight: bold;
}

.blog-a-violet {
  color: var(--accent-violet);
}

.blog-a-violet:hover {
  color: var(--accent-rose-vif);
  /*text-shadow: 1px 1px var(--texte-principal)*/
    text-decoration: none;
}

.blog-a-rose {
  color: var(--accent-rose-vif);
}

.blog-a-rose:hover {
  color: var(--accent-violet);
  /*text-shadow: 1px 1px var(--texte-principal);*/
  text-decoration: none;
}

article a:hover {
  text-decoration: none;
}

.cta-links {
  text-align: center;
  margin-top: 2em;
}

.cta-links a {
  display: inline-block;
  margin: 0.5em;
  padding: 0.6em 1.2em;
  background: #f3f0ff;
  border: 1px solid #ccc;
  border-radius: 8px;
  color: #4B2E83;
  font-weight: bold;
  text-decoration: none;
  transition: background 0.3s;
}

.cta-links a:hover {
  background: #e2ddff;
}

/* Blog article - Personnalisation de la partie WordPress Flatsome Laisser un commentaire */
/* Zone globale du formulaire */
.comment-respond {
  background-color: var(--accent-doux) !important;
  border: 1px solid var(--accent-violet);
  padding: 2rem;
  border-radius: 10px;
  color: var(--texte-principal);
  margin-bottom: 50px; 
  font-size: 1.2em;
}

#comments {
  font-family: var(--font-titres);
  font-size: 1.1em;
  text-align: center;
}


#email-notes {
    color: var(--accent-violet);
    font-family: var(--font-textes);
    font-size: 1.2em;
    font-weight: bold;
}

.comment-respond label{
    margin-top: 10px; 
    font-size: 1em;
    font-family: var(--font-textes);
}

.required-field-message, #email-notes {
    color: var(--accent-violet);
    font-family: var(--font-textes);
    font-size: 1em;
    font-weight: bold;
}

.post-navigation {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1em;
  flex-wrap: wrap;
  padding: 0 2em;
  max-width: 1200px;
  margin: 2em auto;
}

.post-navigation .prev-post,
.post-navigation .next-post {
  flex: 1; /* les deux prennent la même largeur */
  text-align: center;
  min-width: 150px;
}


@media (max-width: 600px) {
  .post-navigation {
    flex-wrap: nowrap;
    flex-direction: column;
  }

  .post-navigation .prev-post,
  .post-navigation .next-post {
    width: 100%;
    margin-bottom: 0.5em;
  }
}


.top-navigation {
  margin-top: 2em;
  margin-bottom: 2em;
}

.post-navigation a {
  font-size: 1.1rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--texte-principal) !important; 
  padding: 0.5em 1em;
  transition: all 0.3s ease;
  background-color: var(--accent-doux);
  border-radius: 6px;
  box-shadow: 0 3px 2px var(--accent-rose-vif)!important; 
}

.post-navigation a:hover {
  color: #fff !important;
  background-color: var(--accent-violet, #b5004c);
  border-radius: 6px;
}

/* Flèches plus stylisées avec pseudo-éléments */
.prev-post a::before {
  content: " \1F844 " !important; 
  /*font-size: 1.8rem !important;
  font-weight: bold !important;*/
}

.next-post a::after {
  content: "\1F846" !important;
  /*font-size: 1.8rem !important;
  font-weight: bold !important;*/
}


.logged-in-as {
    color: var(--texte-principal);
    font-family: var(--font-textes);
    font-size: 1em;
    font-weight: bold;
}

.comment-form p.logged-in-as {
  line-height: 1.4;
}

/* Affiche "Se déconnecter ?" sur une nouvelle ligne */
.comment-form p.logged-in-as a[href*="logout"] {
  display: block;
  margin-top: 0.3em;
}

/* Appliquer une couleur personnalisée à tous les liens */
.comment-form p.logged-in-as a {
  color: var(--accent-rose-vif); /* ou remplace par une couleur hexadécimale */
  text-decoration: none;
}

.comment-form p.logged-in-as a[href*="logout"] {
  color: var(--texte-principal);
  text-decoration: none;
  font-weight: bold; 
  font-style: italic;
}


/* Titre du formulaire (ex : "Laisser un commentaire") */
.comment-respond h3,
.comment-respond h2 {
  font-family: var(--font-menu);
  font-size: 1.8rem;
  color: var(--texte-principal);
  margin-bottom: 1rem;
}

.post-navigation {
  display: flex;
  justify-content: space-between;
  margin-top: 3em;
}



/* Champs de texte */
.comment-respond input[type="text"],
.comment-respond input[type="email"],
.comment-respond input[type="url"],
.comment-respond textarea {
  background-color: var(--fond-blanc);
  border: 1px solid var(--accent-doux);
  border-radius: 5px;
  padding: 0.75rem;
  width: 100%;
  font-family: 'Arial', sans-serif;
  color: var(--texte-principal);
  margin-bottom: 1rem;
}

/* Lien général */
.post-navigation a {
  font-size: 1.1rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--accent-rose-vif, #b5004c);
  padding: 0.6em 1.2em;
  background-color: var(--accent-doux, #fbeff3);
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
}

/* Flèche gauche */
.prev-post a::before {
  content: "←";
  font-size: 1.3em;
  font-weight: bold;
  line-height: 1;
}

/* Flèche droite */
.next-post a::after {
  content: "→";
  font-size: 1.3em;
  font-weight: bold;
  line-height: 1;
}

/* Champs de texte : base */
.comment-respond input[type="text"],
.comment-respond input[type="email"],
.comment-respond input[type="url"],
.comment-respond textarea {
  background-color: var(--fond-blanc);
  border: 1px solid var(--accent-doux);
  border-radius: 5px;
  padding: 0.75rem;
  width: 100%;
  font-family: 'Arial', sans-serif;
  color: var(--texte-principal);
  margin-bottom: 1rem;
  transition: box-shadow 0.3s ease, border-color 0.3s ease;
}

/* Effet de halo rose au hover ET focus */
.comment-respond input[type="text"]:hover,
.comment-respond input[type="text"]:focus,
.comment-respond input[type="email"]:hover,
.comment-respond input[type="email"]:focus,
.comment-respond input[type="url"]:hover,
.comment-respond input[type="url"]:focus,
.comment-respond textarea:hover,
.comment-respond textarea:focus {
  box-shadow: 0 0 0 2px var(--accent-violet); /* halo rose clair */
  border-color: #c98fa4;
  outline: none;
}

/* Bouton d'envoi */
.comment-respond input[type="submit"] {
  background-color: var(--accent-violet);
  color: var(--fond-blanc);
  border: none;
  padding: 0.30rem 1.3rem;
  border-radius: 15px;
  font-weight: bold;
  font-family: var(--font-menu);
  cursor: pointer;
  transition: background-color 0.3s ease;
}

/* Style du bouton avec fleur */
.comment-respond .submit {
  background-color: var(--accent-violet);
  color: var(--fond-principal);
  border: none;
  padding: 0.45rem 1.3rem;
  border-radius: 30px;
  font-weight: bold;
  font-family: var(--font-menu);
  cursor: pointer;
  transition: background-color 0.3s ease, color 0.3s ease;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.comment-respond .submit:hover,
.comment-respond .submit:active {
  background-color: var(--fond-blanc);
  color: var(--accent-violet); /* violet doux */
  border: 2px solid var(--accent-violet);
}

/* Fleur dans le bouton */
.bouton-fleur {
  font-size: 1.2rem;
}


/* Hover et actif – fond blanc, texte violet */
.comment-respond input[type="submit"]:hover,
.comment-respond input[type="submit"]:active {
  background-color: var(--accent-rose-vif);
  color: var(--fond-blanc) !important; /* violet doux */
  border-color: #7c4f72;
}



.comment-respond input[type="submit"]:hover {
  background-color: #b16e89;
}

/* Texte sous les champs (aide, RGPD, etc.) */
.comment-form-cookies-consent label,
.comment-notes {
  font-size: 1.1rem;  
  color: var(--texte-principal);
  font-weight: normal;
  font-family: var(--font-menu);
}

/* Message après validation */
.comment-awaiting-moderation {
  font-style: italic;
  color: #995d75;
}




/* fin de l'article de blog Washi */

/* CGV */
.cgv-section {
  background-color: var(--fond-blanc);
  display: flex;
  justify-content: center; /* Centre horizontalement le container */
  padding: 40px 20px; /* Ajoute du padding autour */
}

.cgv-container {
  max-width: 800px; /* Taille plus lisible sur grand écran */
  width: 100%;
  text-align: justify;
  font-family: var(--font-paragraphe); /* Facultatif : homogénéité avec le reste du site */
  color: var(--texte-principal); /* Assure la cohérence visuelle */
}

.cgv-h1 {
  font-family: var(--font-titres);
  font-size: 2.7rem;
  margin-bottom: 1.5rem;
  color: var(--accent-violet);
  text-align: center;
  margin-top: 0;
}

.cgv-date {
  font-weight: bold;
  color: var(--texte-principal);
  font-size: 1.4rem;
  margin-bottom: 2rem;
  text-align: center;
}

.cgv-h2 {
  color: var(--accent-rose-vif);
  margin-top: 60px;
  margin-bottom: 15px;
  font-size: 1.6em;
  font-weight: 700;
  font-style: normal;
  line-height: 1.3;
}

.cgv-p {
  font-size: 1.30em;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  margin-bottom: 2rem;
  line-height: 1.6;
  text-align: justify;
  font-family: var(--font-textes);
}

.cgv-li {
  font-family: var(--font-textes);
  font-size: 1.30em;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  margin-bottom: 2rem;
  line-height: 1.6;
  text-align: justify;
  /* color: #d63384; */
  text-decoration: none;
  line-height: 1.6;
  position: relative; /* Ajout important */
  padding-left: 2rem; /* Pour éviter que le texte chevauche la fleur */
}

.cgv-li::before {
  content: "🌸";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  font-size: 1.2rem;
  opacity: 0.8;
  pointer-events: none;
}

.bold {
font-weight: bold;
}

/* end of cvg section */

/* scroll to top */
#scrollToTop {
  position: fixed;
  bottom: 30px;
  right: 30px;
  display: none; /* caché par défaut */
  border: none;
  border-radius: 50%;
  padding: 12px 16px;
  font-size: 1.5rem;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  z-index: 1000;
  transition: background-color 0.3s, transform 0.3s;
  background-color: var(--accent-violet) !important;
}

#scrollToTop:hover {
  background-color: #b02a6e !important; /* un rose plus foncé au survol */
  transform: scale(1.1);
}
/* End of the scroll to the top code */

/*CIBLER LE BACKGROUND COLOR DE LA PAGE CGU INTEGRALEMENT */
body.page-template-page-conditions-generales-d-utilisation,
body.page-template-page-conditions-generales-d-utilisation #wrapper,
body.page-template-page-conditions-generales-d-utilisation .page-wrapper {
  background-color: var(--fond-blanc)!important;
}

/*FIN --- CIBLER LE BACKGROUND COLOR DE LA PAGE CGU INTEGRALEMENT */


/* page blog générale */
/* Main */
.blog-content {
  max-width: 800px;
  margin: 2rem auto;
  padding: 0 1rem;
  padding-top: 50px;
}

.blog-h2 {
  margin-top: 60px;
  font-weight: 700;
  font-family: var(--font-titres);
  font-size: 2.5rem;
  margin-bottom: 20px;
  text-align: center;
  color: var(--accent-rose-vif) !important;
  font-size: 2rem !important;
}

.blog-intro p {
  margin-bottom: 1.2rem;
}

.blog-categories ul {
  list-style: none;
  padding: 0;
}

.blog-categories li {
  margin: 0.8rem 0;
  padding-left: 3rem;
  position: relative;
}

/* ================================
   Media Queries pour responsive
   ================================ */

/* Tablettes */
@media (max-width: 992px) {
  .hero-blog-title {
    font-size: 2.2rem !important;
  }
  .blog-p {
    font-size: 1.2rem !important;
  }
  .blog-li {
    font-size: 1.2rem !important;
  }
}

/* Mobiles */
@media (max-width: 768px) {
  .hero-blog-title {
    font-size: 1.8rem !important;
  }
  .blog-p {
    font-size: 1.2rem !important;
  }
  .blog-li {
    font-size: 1.2rem !important;
  }

  /* Pour réduire les marges et garder le texte lisible */
  .blog-intro {
    padding: 0 1rem;
  }

  .blog-content {
    padding-top: 0px !important;
  }
  .shop-layout-container {
    flex-direction: column; /* sidebar sous les produits */
    gap: 1.5rem;
  }

  .shop-sidebar {
    width: 100%;
  }

  .shop-products {
    width: 100%;
  }
}

/* ===============================
   Responsive pour shop + sidebar
   =============================== */

.shop-layout-container {
  display: flex;
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem 4rem;
  box-sizing: border-box;
}

.shop-sidebar {
  width: 220px;
  flex-shrink: 0;
  background: #f9f9f9;
  padding: 1rem;
  border-radius: 6px;
  box-shadow: 0 0 5px rgba(0,0,0,0.1);
}

.shop-products {
  flex: 1;
}

/* ===============================
   Media Queries
   =============================== */

/* Tablettes */
@media (max-width: 992px) {
  .shop-layout-container {
    flex-direction: column; /* sidebar sous les produits */
    gap: 1.5rem;
  }

  .shop-sidebar {
    width: 100%;
  }

  .shop-products {
    width: 100%;
  }
}

/* Mobiles */
@media (max-width: 768px) {
  .shop-layout-container {
    flex-direction: column;
    gap: 1rem;
    padding: 0 0.5rem 2rem;
  }

  .shop-sidebar {
    padding: 0.5rem;
    border-radius: 4px;
    box-shadow: none;
  }

  .shop-products {
    width: 100%;
  }

  /* Ajuste les marges des produits si nécessaire */
  .products-grid {
    gap: 1rem; /* espace entre produits */
  }
}

.shop-sidebar {
    display: none !important;
}

ul.products, ul.columns-1{
text-align: center !important;
  margin: auto !important;
}

.shop-products-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    max-width: 1200px;
    margin: 0 auto; /* centre la grille */
}

@media (max-width:1024px){
    .shop-products-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:768px){
    .shop-products-grid { grid-template-columns: 1fr; }
}

/* Hero pour la page blog */
.hero-blog {
 /* background-image: url('../img/blog-hero');*/
  background-size: cover;
  background-position: center;
  height: 50vh;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-blog-overlay {
  background-color: rgba(0, 0, 0, 0.2);
  padding: 2rem;
  width: 100%;
  height: 100%;
  text-align: center;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hero-blog-title {
  font-size: 3.7rem;
  font-weight: bold;
  letter-spacing: 1px;
  color: var(--fond-blanc);
  font-family: var(--font-titres);
  text-shadow: 3px 1px black !important;
}


.hero-blog-subtitle {
  font-size: 1.6rem !important;
  max-width: 700px;
  margin: 0 auto;
  color: var(--accent-doux) !important;
  font-weight: bold;
  text-shadow: 1px 2px var(--texte-principal)!important;
  text-align: center;
  text-shadow: 2px 2px black !important;
}

.blog-p {
  text-decoration: none;
  font-size: 1.3rem;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  margin-bottom: 2rem;
  line-height: 1.6;
  text-align: justify;
  font-family: var(--font-textes);
  text-align: justify;
}

.blog-categories ul {
  list-style-type: none;
}

.blog-li {
  font-family: var(--font-textes);
  font-size: 1.25em;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  text-align: justify;
  text-decoration: none;
  line-height: 1.6;
  position: relative; /* Ajout important */
  padding-left: 2rem; /* Pour éviter que le texte chevauche la fleur */
}

.blog-li::before {
  content: "🌸";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  font-size: 1.2rem;
  opacity: 0.8;
  pointer-events: none;
  font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif;
}

.blog-categories {
  margin-bottom: 1rem;
}

.blog-preview {
  padding-top: 0rem;
}

/* iPad mini – portrait & paysage */
@media only screen
  and (min-width: 768px)
  and (max-width: 1024px) {

  .blog-p,
  .blog-li,
  .blog-intro p {
    font-size: 1.2rem !important;
    line-height: 1.6 !important;
  }
}

.blog-card {
  background-color: var(--fond-clair);
  border: 1px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.2s ease-in-out;
  display: flex;
  flex-direction: column;
  height: 100%;
  box-shadow: 0 0 10px rgba(0,0,0,0.05);
}

.blog-card:hover {
  transform: translateY(-5px);
}

.blog-card-link {
  color: inherit;
  text-decoration: none;
  display: block;
  height: 100%;
}

.blog-card-image {
  height: 200px;
  /*background-size: cover;
  background-position: center;*/
  overflow: hidden;
}

.blog-card-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-bottom: 1px solid #eee;
  height: 100%;
  width: 100%;
  object-fit: cover;
}


.blog-card-text {
  padding: 1rem;
}

.blog-card-date {
  font-size: 0.85rem;
  color: #666;
  margin-bottom: 0.3rem;
  display: block;
}

.blog-card-title {
  font-size: 1.1rem;
  font-weight: bold;
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  padding: 1rem;
  flex-grow: 1;
}

.blog-card-excerpt {
  padding: 1rem;
  flex-grow: 1;
}

.blog-card-excerpt {
  font-size: 0.95rem;
  color: #444;
}


.hero-divider {
  width: 150px;
  height: 3px;
  background-color: var(--accent-doux);
  margin: 1.5rem auto;
  border-radius: 3px;
  opacity: 1;
  box-shadow: 0 0 8px rgba(255, 255, 255, 0.2); /* effet de lumière subtil */
  margin: auto !important
}

.hero-blog .hero-contact {
  margin: auto !important;
}

.vert {
 color: var(--accent-secondaire) !important;
 text-shadow: 1px 2px var(--texte-principal) !important;
 font-weight: bold !important;
}

.blog-card-link:hover {
  text-decoration: none !important;
}


figure img,
.entry-content img,
.post img {
  transition: transform 0.3s ease, filter 0.3s ease;
}

figure img:hover,
.entry-content img:hover,
.post img:hover {
  transform: scale(1.05);
  filter: brightness(110%);
}

.figcaption-text {
  font-size: 1rem;
  color: var(--texte-principal);
  font-family: var(--font-menu);
  /*font-style: italic;*/
  margin-top: 15px;
}

.figcaption-texte-specifique-big-pic {
  font-size: 1rem;
  color: var(--texte-principal);
  font-family: var(--font-menu);
  /*font-style: italic;*/
  margin-top: 30px;
}

/* fin de la page blog générale */

/* FOOTER */
.footer {
  background-color: var(--accent-doux);
  padding: 4rem 2rem 2rem;
  font-family: var(--font-textes);
  color: var(--texte-principal);
  font-size: 1rem;
  border-top: 1px solid #f3cdd3;
}

.footer-grid {
  display: flex;
  flex-direction: column;
  max-width: 1200px;
  margin: 0 auto;
}

.footer-section h4 {
  font-size: 1.1rem;
  color: var(--accent-violet);
  margin-bottom: 1rem;
}

.footer-section ul {
  list-style: none;
  padding: 0;
}

.footer-section ul li {
  margin-bottom: 0.5rem;
}

.footer-section ul li a {
  color: var(--texte-principal);
  text-decoration: none;
  transition: color 0.3s ease;
}

.footer-section ul li a:hover {
  color: var(--accent-rose-vif);
  font-weight: 600;
}

.footer-bottom {
  text-align: center;
  margin-top: 3rem;
  color: #880e4f;
  font-weight: 500;
}

/* Responsive grid */
@media (min-width: 768px) {
@media (min-width: 768px) {
  .footer-grid {
    flex-direction: row;
    justify-content: space-around; /* meilleur espacement à 3 */
    gap: 2rem;
  }

  .footer-section {
    flex: 1 1 30%; /* largeur plus appropriée pour 3 colonnes */
  }
}

   .collection-container {
    gap: 20px;
  }

  .collection-images {
    flex-direction: column;
    align-items: center;
  }
}

@media (min-width: 1024px) { /* Applique cette règle uniquement sur les écrans de taille PC */
  .newsletter-popup p {
    font-size: 1.4rem; /* Taille plus grande sur les grands écrans */
  }
}


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

/* ---------- Dropdown menu corrigé sans gap ---------- */
li.dropdown {
  position: relative;
}

.dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;               /* pile sous le lien */
  left: 50%;               /* milieu du parent */
  transform: translateX(-50%); /* centré horizontalement */
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  min-width: 220px;        /* à adapter si besoin */
  background: var(--fond-principal);
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transition: opacity 0.2s ease;
  z-index: 1000;
  margin: 0;  /* on supprime tout espace interne */
  padding: 0;  /* espacements verticaux internes */
  box-sizing: border-box;   /* inclusif */
  overflow: hidden; 
  border: 1px solid #ddd;
  min-width: 220px;
}

/* Chaque lien prend exactement 100% de la largeur disponible */
.dropdown-menu li {
  margin: 0;    /* aucun décalage latéral */
}

/* On l’affiche dès qu’on survole le parent OU le menu lui-même */
li.dropdown:hover > .dropdown-menu,
li.dropdown .dropdown-menu:hover {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

/* Stylisation des items du dropdown */
.dropdown-menu li a {
  display: block;
  padding: 0.75rem 1rem;
  box-sizing: border-box;
  color: var(--texte-principal);
  font-family: var(--font-menu);
  transition: background-color 0.2s ease, color 0.2s ease;
  width: 100%;
  text-decoration: none;
      
}
.dropdown-menu li a:hover {
  background-color: var(--accent-doux);
  color: var(--accent-violet);
}

@media screen and (max-width: 768px) {
  .dropdown-menu {
    position: static;
    transform: none;
    visibility: visible;
    opacity: 1;
    display: none;
    border: none;
    box-shadow: none;
    margin-top: 0.5rem;
    padding: 0;
  }

  li.dropdown:hover > .dropdown-menu,
  li.dropdown .dropdown-menu:hover {
    display: block;
    position: static;
  }

  .nav-links {
    flex-direction: column;
    align-items: flex-start;
  }

  .nav-links li {
    width: 100%;
  }
}


.h2-404 {
  font-size: 2rem;
  margin-bottom: 2rem;
  font-weight: bold;
  text-align: center;
  color: var(--accent-rose-vif) !important;
}

.p-404 {
  text-decoration: none;
  font-size: 1.25rem;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  margin-bottom: 2rem;
  line-height: 1.6;
  text-align: center;
  font-family: var(--font-textes);
}

/* Supprimer la flèche du bouton "Voir tous les articles" uniquement */
.no-arrow::after {
  content: none !important;
}

.next-post a.no-arrow::after {
  content: none !important;
}


/* page de contact */

.contact-form-input {
  all: unset;
  background-color: var(--fond-blanc) !important;
  border-radius: 15px 5px !important;
  padding: 0.6rem 0.8rem !important;
  font-family: var(--font-menu) !important;
  font-size: 1rem !important;
  width: 70% !important;
  margin: 0.5rem auto !important;
  display: block !important;
  box-sizing: border-box !important;
  border: 2px solid var(--accent-rose-vif) !important;
  color: var(--accent-rose-vif) !important;
  box-shadow: 0 0 0 2px rgba(236, 72, 153, 0.15) !important;
}

.contact-form-input:active, .contact-form-input:hover {
  outline: none !important;
  border-color: var(--accent-doux) !important;
  box-shadow: 0 0 0 3px rgba(236, 72, 153, 0.4) !important; /* halo rose */
  color: var(--accent-rose-vif) !important;
  font-size: 1.1remp !important;
  box-shadow: 0 0 0 3px rgba(236, 72, 153, 0.4) !important;
}

contact-form-input::placeholder {
  color: var(--texte-principal) !important;
  font-size: 1.1remp !important;
  opacity: 1 !important; /* certains navigateurs mettent une opacité par défaut */
}

.form-group {
  margin-bottom: 30px; /* adapte la valeur à ton design */
}

.contact-form-submit {
  background-color: var(--accent-violet) !important;
  color: var(--fond-blanc) !important;
  cursor: pointer !important;
  transition: background-color 0.3s !important;
  all: unset;
  border-radius: 15px 5px !important;
  padding: 0.6rem 0.8rem !important;
  font-family: var(--font-menu) !important;
  font-size: 1rem !important;
  width: 70% !important;
  margin: 0.5rem auto !important;
  display: block !important;
  box-sizing: border-box !important;
  transition: border 0.3s ease, box-shadow 0.3 ease !important;
}

.contact-form-submit:hover {
  background-color: var(--accent-rose-vif) !important;
  transform: scale(1.05) !important;
}

.contact-email-section {
  text-align: center !important;
}

.contact-p {
  text-align: center;
  text-decoration: none;
  font-size: 1.25rem;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  margin-bottom: 2rem;
  line-height: 1.6;
  font-family: var(--font-textes);
}

.hero-contact {
  padding: 2rem;
  width: 100%;
  height: 100%;
  text-align: center;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* page à propos */
.a-propos-hero-p-primaire {
    text-shadow: 2px 3px var(--texte-principal) !important;
    color: var(--accent-secondaire) !important;
    font-size: 1.80rem !important;
    text-align: center;
}

#a-propos-hero-p-primaire-2{
    font-size: 1.60rem !important;
}

.a-propos-hero-p-secondaire {
    text-shadow: 2px 3px var(--texte-principal) !important;
    color: #E5B663 !important;
    font-size: 1.80rem !important;
    text-align: center;
}

.a-propos-h2 {
  color: #d63384; 
  font-weight: bold;
  padding: 0 4px;
  border-radius: 4px;
  /*color: #880e4f;*/
  margin-bottom: 1rem; /* Ajoute un espace sous le titre */
  font-size: 2rem;
  font-family: var(--font-titres);
  text-align: center;
  margin-top: 45px;
}

/* footer copyright */
.copyright {
  font-family: var(--font-menu);
  font-style: normal;
  font-weight: normal;
  font-size: 1rem;
  color: var(--texte-principal);
  text-align: center;
      }

/* page Ma Boutique */
/* 1. WRAPPER GLOBAL – même largeur que blog-intro */
.shop-page-wrapper {
  display: flex;
  gap: 1.2rem;
  justify-content: center;
  max-width: 1200px;
  margin: 0 auto 4rem;
  padding: 0 1rem;
  box-sizing: border-box;
  /*align-items: flex-start;*/
}

/* Effet hover sur chaque ligne d'élément filtrage (ajuste la classe selon ta structure) */
.shop-sidebar .widget ul li,
.shop-sidebar .widget li {
  transition: background-color 0.3s ease;
  cursor: pointer;
  padding: 0.4rem 0.6rem;
  border-radius: 4px;
  color: var(--texte-principal);
}

.shop-sidebar .widget ul li:hover,
.shop-sidebar .widget li:hover {
  background-color: rgba(255, 240, 245, 0.9);
  color: var(--texte-principal);
}

/* Grille avec 2 à 3 colonnes */
.products-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
  padding: 0;
  margin: 0;
  list-style: none;
}

/* S'assurer que chaque produit prend la largeur de la colonne */
.products-grid li.product {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0;
  box-sizing: border-box;
}

/* Le bloc central texte reste à 800px (comme chez toi) */
.blog-content {
  max-width: 800px;
  margin: 2rem auto;
  padding: 0 1rem;
  padding-top: 35px;
}

.widget > ul > li + li, ul.menu > li + li {
    border: none;
}

.price_slider, .ui-slider, .ui-corner-all {
    background-color: var(--accent-violet) !important;
}
    

/* 2. SIDEBAR – étroite, à gauche */
.shop-sidebar {
  width: 345px !important;
  flex-shrink: 0;
  background-color: var(--fond-principal);
  color: var(--texte-principal);
  border-radius: 6px;
}

aside.shop-sidebar {
  background-color: rgba(255, 240, 245, 0.9) !important; /* rose clair */
  box-shadow: 3px 4px 15px rgba(0, 0, 0, 0.5), 0 0 3px rgba(255, 192, 203, 0.9) !important; /* garde ou garde pas ? */
  padding: 1.5rem !important;
  border-radius: 8px !important;
  position: relative !important;
  z-index: 1 !important;
}

span.widget-title.shop-sidebar {
    background-color: transparent !important;
    color: var(--accent-violet);
    font-weight: bold; 
    font-size: 1.05rem;
    font-family: var(--font-menu);
}



/* 3. ZONE PRODUITS – prend l’espace restant */
.shop-products {
 width: 800px;
}

.is-divider {
    background-color: var(--accent-violet);
        }

/* 4. GRILLE DE PRODUITS */
.shop-products ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, 380px);
  justify-content: center;
  gap: 2rem;
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 800px; 
  justify-content: center;
}

.shop-products ul.products li.product {
  max-width: 380px;
  justify-self: center;
}

/* 5. CARTE PRODUIT */
.shop-products ul.products li.product {
  margin: 0 !important;
  width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

/* 6. Neutralise les colonnes WooCommerce par défaut */
.woocommerce ul.products li.product[class*="columns"] {
  width: 100% !important;
  float: none !important;
}

/* Style par défaut unifié */
.widget > ul > li > a,
.widget > ul > li.current-cat > a,
ul.menu > li > a,
ul.menu > li.current-menu-item > a {
  display: block;
  width: 100%; /* occupe toute la largeur disponible */
  padding: 0.4em 1em;
  border-radius: 8px;
  font-weight: bold;
  font-family: var(--font-menu);
  font-size: 1em;
  color: var(--texte-principal);
  background-color: transparent;
  transition: background-color 0.3s ease, color 0.3s ease;
  box-sizing: border-box;
}

.widget_price_filter .price_slider_amount .button {
  background-color: var(--accent-violet); 
  color: var(--fond-blanc);
  font-weight: bold;
  font-size: 1em;
  font-family: var(--font-menu);
  margin-top: 30px;
}

.widget .current-cat > a, 
.widget > ul > li > a {
  font-weight: bold !important;
  font-family: var(--font-menu) !important;
  font-size: 1em !important; 
  color: var(--texte-principal) !important;
  background-color: transparent !important;
}

/* SURVOL */
.widget > ul >li.current-cat > a:hover,
.widget > ul > li > a:hover,
ul.menu > li > a:hover,
ul.menu > li.current-menu-item > a:hover {
  background-color: rgba(255, 255, 255, 0.6) !important; /* plus visible */
  color: var(--accent-rose-vif) !important;
}

ul.products li.product {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  text-align: center;
  font-family: var(--font-menu);
}

.price_label, .price_lable span {
  font-size: 1em;
  font-family: var(--font-menu);
  text-align: right !important; 
  font-weight: bold;
}

.widget_layered_nav li .count,
.widget_product_categories li .count {
  display: none !important;
}

.grid-tools a {
  color: var(--fond-blanc) !important; 
  font-family: var(--font-menu) !important;
  font-size: 1em !important;
  background-color: var(--accent-violet) !important;
    }

.box-text a:not(.button), .box-text h1, .box-text h2, .box-text h3, .box-text h4, .box-text h5, .box-text h6 {
    color: var(--accent-violet);
    font-family: var(--font-titres) !important;
    font-weight: 600 !importnat;
    font-size: 1em !important;
}


.category,
.uppercase,
.is-smaller,
.no-text-overflow,
.product-cat op-7 {
    font-family: var(--font-textes) !important;
    color: var(--texte-principal) !important;
    font-size: 1em !important;
    font-weight: bold !important;
    opacity: 1 !important;
    letter-spacing: 0.1rem !important;
} 

bdi {
    font-family: var(--font-textes) !important;
    color: var(--texte-principal) !important;
    font-size: 1.1em !important;
    font-weight: bold !important;
    opacity: 1 !important;
    letter-spacing: normal !important;
}

.box-image {
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background-color: var(--fond-blanc);
  border: none; /* supprime la bordure */
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08); /* ombre douce et diffuse */
}

.product-small.box:hover {
  transform: translateY(-5px);
}

/* ✅ Effet zoom sur l'image au survol */
.product-small .box-image img {
  transition: transform 0.4s ease;
  will-change: transform;
}

.product-small.box:hover .box-image img {
  transform: scale(1.05);
}

.product-small .grid-tools a {
  background-color: var(--accent-violet);
  color: var(--fond-blanc);
  border-radius: 0;
  font-weight: 600;
  font-size: 0.75rem;
  opacity: 0.8 !important;
  text-transform: uppercase;
  padding: 0.5em 0;
  transition: all 0.3s ease;
}

.product-small .grid-tools a:hover {
  background-color: var(--accent-violet);
  opacity: 0.5 !important;
}
/* fin page Ma Boutique */ 


/* Page d'un produit de la boutique */
.breadcrumbs a {
 color: var(--accent-rose-vif);
 font-weight: bold;
 font-family: var(--font-menu);
 font-size: 1em;
}

h1.product-title {
  font-family: var(--font-titres);
  font-size: 2.4rem;
  font-weight: 400;
  margin-top: 30px;
}

.is-divider.small {
    max-width: 30px;
}

/* PAGE COLLIERS */
.h2-smaller {
  font-size: 2.1rem;
  font-weight: bold;
  color: var(--accent-violet);
  text-align: center;
  display: block;
  width: 100%;
}

.shop-products ul.products > .col, 
.shop-products ul.products > .columns {
  width: auto !important;
  max-width: 380px !important;
  flex: 0 0 380px !important;
  padding: 0 !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

.shop-products ul.products > .col {
  min-width: 380px !important;
  max-width: 380px !important;
}

.shop-products ul.products .col {
  width: auto !important;
  max-width: 380px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.shop-products ul.products-grid li.product > .col.columns {
  width: auto !important;
  max-width: 380px !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

.shop-products ul.products li.product > .col {
  width: auto !important;
  max-width: 380px !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

/* Cibler la vraie div problématique de Flatsome à l'intérieur des cartes produit */
.shop-products ul.products-grid li.product .col.product-small.box {
  width: auto !important;
  max-width: 380px !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

body.woocommerce-page .shop-products ul.products-grid li.product .col.product-small.box {
  width: auto !important;
  max-width: 380px !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

/* Style pour "Voir tous les produits" identique aux autres filtres */
.voir-tous-produits {
  list-style: none;
  position: relative;
  padding-left: 1.5em;
  margin-bottom: 0.5em;
}

.reset-filter-link {
  display: block;
  margin-top: 10px;
  color: var(--accent-violet);
  text-shadow: none; /* ou mets une valeur fixe */
  text-decoration: none;
  font-weight: bold; /* uniforme */
  font-size: 1em;
  letter-spacing: 1px;
  font-family: var(--font-menu);
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0.4em 1em;
  border-radius: 8px;
}

.reset-filter-link:hover {
  color: var(--accent-rose-vif) !important;
  background-color: rgba(255, 255, 255, 0.6) !important;
  font-weight: 600;
}

.section-divider {
  width: 100vw;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  display: block;
}


/* //////////////////////////// ATTENTION  */

/* 7. RESPONSIVE : la sidebar passe en haut */
/* Responsive */
@media (max-width: 900px) {
  .shop-page-wrapper {
    flex-direction: column;
    align-items: center;
  }

  .shop-sidebar {
    width: 100%;
    margin-bottom: 2rem;
  }

  .shop-products {
    width: 100%;
  }

  .shop-products ul.products {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  }
    
   /* Carte produit – effet général */
/* Carte produit – effet général */
ul.products li.product {
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  background-color: #fff !important;
  display: flex !important;
  flex-direction: column !important;
  text-align: center !important;
  font-family: var(--font-menu) !important;
  position: relative !important;
}

/* Grille produit */
.shop-products ul.products-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 2rem;
  list-style: none;
  padding: 0;
  margin: 0 auto;
  max-width: 800px;
  justify-content: center;
}

/* Chaque carte produit garde sa taille et est centrée même si 1 seul produit */
.shop-products ul.products-grid li.product {
  max-width: 380px !important;
  justify-self: center;
}

/* Zoom sur l’image au survol */
ul.products li.product img {
  transition: transform 0.4s ease !important;
  object-fit: cover !important;
}

ul.products li.product:hover img {
  transform: scale(1.05) !important;
}
    
    /* Neutraliser les classes parents Flatsome qui forcent le 100% */
ul.products .col,
ul.products .columns,
ul.products .gallery-item {
  width: auto !important;
  max-width: 380px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
    
/* Centrage du texte (titre, prix) */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .price {
  text-align: center !important;
  font-family: var(--font-menu) !important;
}

/* Bouton Aperçu ou Ajouter au panier */
ul.products li.product .button {
  background-color: transparent !important;
  border: 2px solid var(--accent-rose-vif) !important;
  color: var(--accent-rose-vif) !important;
  font-weight: bold !important;
  font-family: var(--font-menu) !important;
  padding: 0.5rem 1rem !important;
  margin-top: 1rem !important;
  transition: background-color 0.3s ease, color 0.3s ease !important;
  border-radius: 6px !important;
  opacity: 1 !important;
  visibility: visible !important;
}

    
    /* Hover du bouton */
    ul.products li.product .button:hover {
      background-color: var(--accent-rose-vif) !important;
      color: var(--texte-principal) !important;
    }
}
    
  
    /* Responsive – empile sur mobile */
@media (max-width: 768px) {
  .products-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .shop-sidebar {
    display: none !important;
  }

  .shop-products ul.products {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 1.5rem !important;
  }
}

/* PAGE D'UN PRODUIT */
.breadcrumbs a {
  color: #333;
  font-weight: bold;
  font-family: var(--font-textes) !important;
  font-size: 1.1rem !important;
  text-transform: initial !important;
}

.breadcrumbs a:hover {
    color: var(--accent-rose-vif);  
}

h1.product-title {
  font-family: var(--font-textes);
  font-size: 2.2em;
  font-weight: 400;
  margin-top: 60px;
}

/* TESTO !!!!! */
.carousel-nav-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 50px;
  color: var(--accent-violet);
  cursor: pointer;
  z-index: 1000;
  user-select: none;
}

.carousel-nav-arrow.left {
  left: -30px;
}

.carousel-nav-arrow.right {
  right: -30px;
}

.carousel-nav-arrow:hover {
  color: var(--accent-rose-vif);
}

.carousel-btn {
  position: absolute;
  top: 40%; /* remonte les flèches */
  transform: translateY(-50%);
  font-size: 50px;
  color: var(--accent-violet);
  cursor: pointer;
  z-index: 1000;
  user-select: none;
}

.carousel-btn.prev {
  left: 0px;
}

.carousel-btn.next {
  right: 0px;
}

/* fin */





/* --- Titre produit --- */
.product_title {
  font-family: var(--font-menu);
  font-size: 2.2rem;
  font-weight: 500;
  color: var(--accent-violet);
  margin-bottom: 0.5em;
}

/* --- Prix --- */
.price {
  font-size: 1.4rem;
  color: var(--accent-rose-vif);
  font-weight: 600;
  margin-bottom: 1em;
}

.woocommerce-Price-amount bdi {
  font-family: var(--font-textes) !important;
  color: var(--texte-principal) !important;
  font-size: 0.9em !important;
  font-weight: bold !important;
  opacity: 1 !important;
  letter-spacing: normal !important;
}

.woocommerce-Price-amount bdi {
    font-size: 0.8em !important;
}

/* --- Description courte --- */
.product-short-description {
  font-size: 1.1rem;
  color: #444;
  line-height: 1.6;
  margin-bottom: 1.5em;
}

.product-short-description p {
  text-decoration: none;
  font-size: 1.25rem;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  margin-bottom: 2rem;
  line-height: 1.6;
  font-size: 1.3rem;
  text-align: justify;
  margin-top: 30px;
      }

/* --- Bouton Ajouter au panier --- */
.single_add_to_cart_button {
  background-color: var(--accent-violet);
  border: none;
  color: white;
  font-weight: 500;
  padding: 0.9em 1.5em;
  border-radius: 8px;
  transition: background-color 0.3s ease;
  font-weight: bold;
  margin-top: 35px !important;
}

.single_add_to_cart_button:hover {
  background-color: var(--accent-rose-vif);
}

.product_meta > span {
  font-size: 1rem;
  color: var(--accent-violet);
  font-style: normal;
  font-family: var(--font-textes);
  font-weight: 500;
}

.product_meta > span a {
    color: var(--texte-principal);
    text-align: justify;
    line-height: 220% !important;
}

.button.is-outline {
    color: var(--accent-rose-vif);
}

.button.icon {
    background-color: var(--accent-doux);
}

body.single-product .woocommerce-breadcrumb::after {
  content: none !important;
}

/* correspond à l'intérieur de la bulle des liens vers les réseaux sociaux */
.button.icon.circle > i:only-child, .button.icon.round > i:only-child {
    color: var(--texte-principal);
    /* color: var(--accent-rose-vif); */    
}

.woocommerce-breadcrumb .divider {
    color: var(--texte-principal) !important;
    opacity: 1;
    }

.woocommerce-Tabs-panel p {
    font-family: var(--font-textes);
    font-size: 1.2rem;
    font-weight: normal;
    color: var(--texte-principal);
    text-align: justify;
}

/* Supprimer le trait par défaut autour de la section "produits similaires" */
.related.products {
  border-top: none !important;
  margin-top: 3em;
}

/* Harmoniser le titre */
.product-section-title-related {
  padding: 1.5em 0 0.5em !important;
  border-top: 2px solid var(--accent-doux) !important;
  font-family: var(--font-textes) !important;
  font-weight: 600 !important;
  font-size: 1.2rem !important;
  color: var(--accent-rose-vif) !important;
  letter-spacing: 0.5px !important;
  text-transform: none !important;
  margin-left: 5px;
 }

.product-section-title-related .underline-text {
  display: inline-block;              /* Important pour que la bordure ne prenne que la largeur du texte */
  border-bottom: 2px solid var(--accent-rose-vif);
  padding-bottom: 6px;                /* Espace entre texte et trait */
  margin-bottom: 20px;                /* Espace sous la ligne */
  line-height: 1.2;
  vertical-align: bottom;             /* Pour bien aligner la bordure */
}

/* Changer la couleur du soulignement des onglets */
.product-tabs.nav-line > li.active > a {
  border-color: var(--accent-rose-vif) !important;
}

.product-tabs.nav-line > li > a {
  border-bottom: 2px solid transparent;
}

.product-tabs.nav-line > li.active > a {
  border-bottom-color: var(--accent-rose-vif) !important;
}

/* Onglets - liens (Description, Informations...) */
.product-tabs.nav > li > a {
  font-family: var(--font-textes); 
  font-weight: 600; 
  font-size: 1.2rem;
  color: var(--accent-rose-vif); 
  letter-spacing: 0.5px;
  text-transform: none; 
  margin-right: 30px;
}

/* --- Éléments metadata (catégories / tags) --- */
.product_meta {
  font-size: 0.9rem;
  color: #777;
  margin-top: 2em;
  font-style: italic;
}
.product_meta a {
  color: var(--accent-violet);
  text-decoration: none;
}
.product_meta a:hover {
  color: var(--accent-rose-vif);
}

/* --- Galerie image : réduction des ombres Flickity --- */
.woocommerce-product-gallery {
  box-shadow: none;
}

/* --- Onglets bas de page --- */
.woocommerce-tabs {
  margin-top: 3em;
      }

.woocommerce-tabs .tabs li {
  font-family: var(--font-menu);
  font-size: 1rem;
  transition: none !important;
}

/* Garde le soulignement rose vif sur le texte du lien (si déjà défini ailleurs) */
.woocommerce-tabs .tabs li a:hover {
  color: var(--accent-rose-vif);
  text-decoration: none;
}

ul.wc-tabs.product-tabs {
  border-top: 2px solid var(--accent-doux) !important;
}

ul.wc-tabs.product-tabs:hover {
    border-top:none;
}

.woocommerce-Tabs-panel {
  font-size: 1rem;
  line-height: 1.7;
  padding-top: 1em;
}

/* Conteneur */
.ux-quantity.quantity {
  display: inline-flex;
  align-items: center;
  border: 1px solid #ccc;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  height: 38px;
  font-family: var(--font-menu);
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

/* Boutons + et - */
.ux-quantity__button {
  background-color: var(--accent-violet); /* ton violet principal */
  color: white;
  padding: 0 0.8em;
  font-size: 1.3rem;
  font-weight: bold;
  height: 100%;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.ux-quantity__button:hover {
  background-color: var(--accent-rose-vif) !important;
}

.quantity .button.minus {
    color: var(--fond-blanc);
    background-color: var(--accent-violet);
    border: none;
    font-size: 1.5em;    
}


/* button + */
.quantity .button.plus {
  color: var(--fond-blanc);
  background-color: var(--accent-violet);
  border: none;
  font-size: 1.5em;
}

.ux-quantity .qty.input-text {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: textfield !important;
  background-color: white !important;
  padding: 0.5em 0.75em !important;
  border-radius: 6px !important;
  height: 42px !important;
  line-height: 1.2;
  font-size: 1rem !important;
  text-align: center !important;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.1) !important;
  transition: box-shadow 0.3s ease;
}

/* Empêche les flèches +/- natives (Chrome/Safari) */
.ux-quantity .qty::-webkit-inner-spin-button,
.ux-quantity .qty::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

/* Supprime complètement les effets au focus */
.ux-quantity .qty:focus {
  outline: none !important;
  border: none !important;
  box-shadow: 0 0 6px rgba(164, 212, 193, 0.5) !important; /* couleur accent doux */
}

.ux-quantity input.qty:focus {
  outline: none;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: inset 0 0 0 1px var(--accent-violet);
}

/* Supprimer les flèches internes sur les navigateurs */
.ux-quantity input.qty::-webkit-outer-spin-button,
.ux-quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.ux-quantity input.qty[type=number] {
  -moz-appearance: textfield;
}

.ux-quantity input.qty:focus {
  outline: none;
  box-shadow: none;
  background: transparent;
}

.newsletter-popup-btn{
 background-color: var(--fond-blanc); /* fond blanc au départ */
  color: var(--accent-violet); /* texte violet */
  cursor: pointer;
  font-family: var(--font-menu);
  font-size: 1rem;
  padding: 0.3rem 1rem; /* moins d’espace vertical */
  border-radius: 30px; /* radius modifié */
  border: 2px solid var(--accent-violet); /* contour violet */
  width: auto; /* s’adapte au texte */
  margin: 0.5rem auto;
  display: inline-flex; /* pour aligner icône + texte */
  align-items: center;
  justify-content: center;
  position: relative;
  transition: all 0.35s ease; /* transition douce */
}

/* ICI */
.newsletter-popup-btn-pink{
  background-color: var(--accent-doux); /* fond blanc au départ */
  color: var(--texte-principal); /* texte violet */
  cursor: pointer;
  font-family: var(--font-menu);
  font-size: 1rem;
  padding: 0.3rem 1rem; /* moins d’espace vertical */
  border-radius: 30px; /* radius modifié */
  border: 2px solid var(--accent-violet); /* contour violet */
  width: auto; /* s’adapte au texte */
  margin: 0.5rem auto;
  display: inline-flex; /* pour aligner icône + texte */
  align-items: center;
  justify-content: center;
  position: relative;
  transition: all 0.35s ease; /* transition douce */
  font-weight: bold;
}

.newsletter-popup-btn-pink:hover {
  transform: scale(1.05);
}

/* Optionnel : petite animation de la fleur */
.newsletter-popup-btn:hover::before {
  transform: scale(1.2);
}

.newsletter-popup-btn:hover{
  background-color: var(--accent-violet); /* fond violet au hover */
  color: var(--fond-blanc); /* texte blanc au hover */
}

.newsletter-popup-btn-pink:hover{
  background-color: var(--accent-violet); /* fond violet au hover */
  color: var(--fond-blanc); /* texte blanc au hover */
}

/* Fleur avant le texte */
.newsletter-popup-btn::before {
  content: "🌸";
  margin-right: 0.5rem;
  font-size: 1.2rem;
  display: inline-block;
  opacity: 0.9;
  transition: transform 0.35s ease;
}


/* Fleur avant le texte */
.newsletter-popup-btn-pink::before {
  content: "🌸";
  margin-right: 0.5rem;
  font-size: 1.2rem;
  display: inline-block;
  opacity: 0.9;
  transition: transform 0.35s ease;
}

.single_add_to_cart_button/*.newsletter-popup-btn*/ {
  background-color: var(--accent-violet);
  color: var(--fond-blanc);
  cursor: pointer;
  transition: background-color 0.3s;
  font-family: var(--font-menu);
  font-size: 1rem;
  padding: 0.6rem 0.8rem;
  border-radius: 25px;
  border: none;
  width: 70%;
  margin: 0.5rem auto;
  display: block;
}

.single_add_to_cart_button/*.newsletter-popup-btn:hover*/ {
  background-color: var(--accent-rose-vif);
  transform: scale(1.05);
}

.woocommerce div.product div.images img,
.woocommerce-page div.product div.images img {
    border-radius: 20px !important; 
}

form.cart {
  display: flex;
  flex-wrap: nowrap;
  align-items: center; /* Les enfants s'étirent pour même hauteur */
  gap: 1rem;
}

form.cart .single_add_to_cart_button,
form.cart .ux-quantity {
  height: 100%;
  margin: 0 !important;
  padding: 0.75em 1.5em;   
  line-height: normal;     
  vertical-align: middle; 
}


form.cart > .ux-quantity,
form.cart > .single_add_to_cart_button {
  flex: 0 0 auto !important;
  background-color: var(--accent-violet);
}

form.cart .single_add_to_cart_button:hover {
  background-color: var(--accent-rose-vif) !important;
}

/* Cible uniquement le bouton Ajouter au panier dans le formulaire produit */
form.cart .single_add_to_cart_button {
  border-radius: 12px; /* Radius plus petit pour s'harmoniser */
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Effet au survol : simple changement de teinte */
form.cart .single_add_to_cart_button:hover {
  background-color: var(--accent-doux); /* remplace si tu veux une autre teinte */
  color: var(--fond-blanc); /* ou ce qui convient */
  transform: none; /* annule l'effet grossissant si existant */
}

form.cart > .ux-quantity {
    border: 2px solid var(--accent-violet);
}



/* Fixe une hauteur commune aux deux blocs */
form.cart > .ux-quantity,
form.cart > .single_add_to_cart_button {
  height: 48px; /* ou la hauteur que tu veux */
}

/* Bouton ajouter au panier */
form.cart > .single_add_to_cart_button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 1em;
  min-width: 150px;
  white-space: nowrap;
}

.custom-product-navigation {
  position: relative;
  min-height: 40px; /* laisse de la place pour les boutons */
}

.custom-product-navigation .button {
  position: absolute;
  top: 10px; /* ajuste verticalement */
  z-index: 10;
  background: var(--fond-blanc); /* ou transparent selon ton design */
  padding: 0.4em 0.4em;
  font-size: 0.9em; /* réduit l'icône */
  line-height: 1;
}

.custom-product-navigation .prev-product {
  left: -50px; /* ajuste horizontalement selon ton thème */
}

.custom-product-navigation .next-product {
  right: -50px; /* ajuste horizontalement selon ton thème */
}

.custom-product-navigation .button:hover {
  background: var(--accent-violet) !important; /* fond violet */
  color: #fff !important; /* flèche blanche */
}

li.prod-dropdown {
  display: none !important;
}

.button.icon.circle, .button.icon.round {
    margin-top: 30px;
}

.custom-product-navigation .button:hover i {
      color: #fff !important;
}

.box-text a:not(.button), .box-text h1, .box-text h2, .box-text h3, .box-text h4, .box-text h5, .box-text h6 
{
    font-size: 0.9em !important;
}

/*
.slider-nav-reveal .flickity-prev-next-button,
.slider-nav-reveal .flickity-prev-next-button:hover {
  background-color: transparent !important;
  box-shadow: none !important;
}

.flickity-prev-next-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.flickity-prev-next-button .arrow,
.flickity-prev-next-button svg {
  fill: var(--accent-violet);
  color: var(--accent-violet);
}



.flickity-prev-next-button .arrow, .flickity-prev-next-button svg {
    left: -10px !important
}

button::-moz-focus-inner, input::-moz-focus-inner {
    display: none;
}
*/

/* Conteneur parent relatif si pas déjà */
.related .slider {
  position: relative;
}

/* Boutons Flickity */
.related .flickity-prev-next-button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: transparent !important;
  box-shadow: none !important;
  width: 36px;
  height: 36px;
  z-index: 2;
  padding: 0;
  border: none;
}

/* Position spécifique des boutons */
.related .flickity-prev-next-button.previous {
  left: 10px;
}
.related .flickity-prev-next-button.next {
  right: 10px;
}

/* Icônes : violet par défaut */
.related .flickity-button-icon {
  fill: var(--accent-violet);
  transition: fill 0.3s, background 0.3s;
  display: none !important;
}

/* Hover : fond violet, icône blanche */
.related .flickity-prev-next-button:hover {
  color: var(--accent-violet) !important;
}
.related .flickity-prev-next-button:hover .flickity-button-icon {
  fill: #fff;
}

.image-tools.grid-tools .quick-view i,
.image-tools.grid-tools .quick-view svg,
.image-tools.grid-tools .quick-view .icon-angle-right {
  display: none !important;
}

.comment-respond h3, .comment-respond h2 {
  font-family: var(--font-menu) !important;
  font-size: 1.5rem !important;
  color: var(--texte-principal) !important;
  margin-bottom: 1rem !important;
  text-align: center !important;
}

.comment-respond label {
    font-family: var(--font-menu) !important;
    font-size: 1em !important;
}

.stars a.active::after, .stars a:hover::after {
    color: var(--accent-rose-vif)!important;
        }

.stars a {
    color: rgba(51,51,51,0.9);
}

.stars a::after {
    color: rgba(51,51,51,0.9);
}

.star-rating span::before {
    color: var(--accent-rose-vif);
}

.uppercase, h6, span.widget-title, th {
  line-height: 1.05;
  text-transform: uppercase;
  font-family: var(--font-textes) !important;
}

.woocommerce-product-attributes-item__value a {
  font-family: var(--font-textes) !important;
  color: var(--texte-principal) !important;
}

.woocommerce-product-attributes-item__value a:hover {
  color: var(--accent-rose-vif) !important;
}

h1, h2, h3, h4, h5, h6, .heading-font, .banner h1, .banner h2 {
    font-weight: 500;
}

.product-main {
 padding: 20px 0;
}

.product-sidebar-small {
    display: none;
}
/* page à propos ajustements */
#titre-a-propos {
    margin-top: 70px;
    text-align: center;
    color: var(--accent-violet);
    font-weight: bold;
    text-transform: normal;
    font-size: 1.9em;
}

.success-color {
  color: var(--accent-rose-vif) !important;
  font-weight: bold;
  font-family: var(--font-textes) !important;
  font-size: 1.1em;
  margin-top: 20px !important;
  background-color: var(--accent-doux);
  text-align: center;
  border: 2px solid var(--accent-violet);
  border-radius: 25px 25px;
  padding-top: 3px;
  padding-bottom: 3px;
}

.product_meta .tagged_as a[href*="eclats-dokinawa"],
.product_meta .tagged_as a[href*="rivieres-enchantees"],
.product_meta .tagged_as a[href*="voyage-a-osaka"],
.product_meta .tagged_as a[href*="voyage-turquoise"],
.product_meta .tagged_as a[href*="voyage-a-osaka"],
.product_meta .tagged_as a[href*="danse-de-kingyo"] {
  text-transform: capitalize !important;
}

th.product-name, th.product-price, th.product-quantity, th.product-subtotal {
    color: var(--accent-violet) !important;
    font-family: var(--font-titres) !important;
    font-size: 1em;
}

.cart_totals tbody th, .woocommerce-Price-amount bdi, td a {
  color: var(--texte-principal) !important;
  font-family: var(--font-textes) !important;
  font-size: 1.1em !important;
  font-weight: 500 !important;
}

a.remove {
  border: 2px solid;
  border-radius: 100%;
  display: block;
  font-size: 20px !important;
  font-weight: 700 !important;
  height: 24px;
  line-height: 19px !important;
  text-align: center;
  width: 24px;
  color: var(--accent-violet) !important;
}

a.remove:hover {
 color: var(--accent-rose-vif) !important;
}

.cart_totals .button {
    background-color: var(--accent-violet) !important;
    border-radius: 15px !important;
    color: var(--fond-blanc) !important;
}

.cart_totals .button:hover {
    border-radius: 15px !important;
    background-color: var(--accent-rose-vif) !important;
    color: var(--fond-blanc) !important;
}

.widget-title {
    font-family: var(--font-textes) !important;
    font-size: 0.9em;
}

.widget-title i {
    opacity: 0.9;
}

.button, button, fieldset, input, select, textarea  {
  background-color: var(--accent-violet) !important;
  border-radius: 10px;
  color: var(--fond-blanc) !important;
  font-family: var(--font-textes) !important;
  font-weight: 600 !important;
  font-size: 1.1em !important;
  text-shadow: none !important;
  text-transform: none !important;
      }

.button-continue-shopping, .button, .primary, .is-outline {
  height: 30px !important
  border-radius: 10px;
  color: var(--fond-blanc) !important;
  font-family: var(--font-textes) !important;
  font-weight: 600 !important;
  font-size: 1.1em !important;
  text-shadow: none !important;
  text-transform: none !important;
}

.is-outline:hover {
  background-color: var(--accent-rose-vif) !important;
  color: var(--fond-blanc) !important;
      }

.button.disabled, .button[disabled], button.disabled, button[disabled] {
  height: 30px !important;
  background-color: var(--texte-principal) !important;
  opacity: 1 !important;
}

.button:hover, .disabled:hover {
 background-color: var(--accent-rose-vif) !important;   
}

.woocommerce-cart .cart-collaterals .coupon input#coupon_code{
  background-color: var(--fond-blanc) !important;
  color: var(--accent-rose-vif) !important;
  border-radius: 10px;
}

.ux-quantity .qty.input-text {
    color: var(--texte-principal) !important;
}

.blog-sommaire-lien-black {
  color: var(--texte-principal);
  font-weight: bold;
  text-decoration: none;
  font-size: 1.25rem;
  margin-bottom: 2rem;
  line-height: 1.6;
  font-family: var(--font-textes);
  position: relative; /* Ajout important */
  padding-left: 2.5rem; /* Pour éviter que le texte chevauche la fleur */
}

.blog-sommaire-lien-black::before {
  content: "🌸";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  font-size: 1.2rem;
  opacity: 0.8;
  pointer-events: none;
  color: var(--texte-principal);
}

.blog-sommaire-lien-black:hover {
  color: var(--accent-violet);
  text-shadow: 1px 1px var(--texte-principal);
  text-shadow: 0px 0px 0px transparent;
}

.faq-titres-rubriques {
  color: var(--accent-rose-vif);
  text-shadow: 2px 1px 1px var(--texte-principal);
  margin-top: 30px;
  font-weight: 700;
  font-size: 1.8em;
  margin-bottom: 20px !important;
  text-align: left;
  margin-top: 60px;
  text-transform: none !important;
}

.question {
  text-align: justify;
  font-family: var(--texte-principal);
  text-decoration: none;
  font-size: 1.25rem;
  margin-bottom: 2rem;
  color: var(--accent-violet);
  margin-bottom: 2rem;
  line-height: 1.6;
  text-align: justify;
  font-family: var(--font-textes);
  font-weight: bold;
  margin-top: 30px;
}

.answer {
  text-align: justify;
  font-family: var(--texte-principal);
  text-decoration: none;
  font-size: 1.25rem;
  margin-bottom: 2rem;
  color: var(--texte-principal);
  margin-bottom: 2rem;
  line-height: 1.6;
  text-align: justify;
  font-family: var(--font-textes);
  margin-left: 30px;
}

.answer-puces {
  position: relative; /* permet au ::before d'être positionné par rapport à ce <li> */
  padding-left: 90px; /* espace total à gauche pour la fleur + l'espace texte */
  font-family: var(--font-textes);
  font-size: 1.25rem;
  color: var(--texte-principal);
  line-height: 1.6;
  text-align: justify;
  margin-bottom: 1rem;
}

.answer-puces::before {
  content: "🌸";
  left: 50px; 
  position: absolute;
  top: 0.55; /* ajustement vertical précis */
  transform: translateY(0.1em); /* affine l’alignement vertical */
  font-size: 1.1rem;
  color: var(--accent-rose-vif); /* facultatif si tu veux la colorer */
  opacity: 0.9;
  line-height: 1;
  pointer-events: none;
}

form.checkout h3 {
  font-size: 1.4em !important;
  font-weight: bold;
  overflow: hidden;
  padding-top: 10px;
  text-transform: uppercase;
  color: var(--accent-violet) !important;
  font-family: var(--font-textes) !important;
      }

input#billing_first_name.input-text, input#billing_last_name.input-text, input#billing_company.input-text, input#billing_address_1.input-text, input#billing_address_2.input-text, input#billing_postcode.input-text, input#billing_city.input-text, input#billing_phone.input-text, input#billing_email.input-text, textarea#order_comments.input-text  {
  height: 40px !important;
  border-radius: 10px !important;
  font-size: 0.8em !important;  
  background-color: white !important;
  color: var(--accent-violet) !important;
}

#billing_address_1::placeholder, #billing_address_1::placeholder, #billing_address_2::placeholder, textarea#order_comments::placeholder {
    color: rgba(214, 51, 132, 0.7) !important;
    font-size: 0.8em !important;
}


.message-container a:hover {
  color: var(--accent-rose-vif) !important;
  font-weight: bold !important;
}

label {
  color: var(--texte-principal) !important;
  font-family: var(--font-textes) !important;
  font-size: 0.8em !important;
}

div.cart-container, .container, .page-wrapper, .page-checkout, .woocommerce, .wp-singular {
    background-color: var(--fond-blanc) !important;  
}

th.product-name, th.product-price, th.product-quantity, th.product-subtotal {
  color: var(--texte-principal) !important;   
  font-size: 1.1em;
}

td.product-name, td.product-quantity  {
    color: var(--texte-principal) !important;
    font-family: var(--font-textes) !important;
    font-size: 1.1em;
}

.woocommerce-checkout, .checkout {
  font-family: var(--font-textes) !important;
}

.product-quantity {
    font-weight: normal !important;
}

.medium-text-center {
  font-size: 1.1em;
  font-family: var(--font-textes) !important;
  color: var(--texte-principal) !important;
  font-style: italic !important;
  text-align: justify !important;
}

form p {
  font-size: 1.1em !important;
  font-family: var(--font-textes) !important;
  text-align: justify !important;
      }

span.page-numbers.current {
  color: var(--accent-violet) !important;
  font-weight: bold;
  font-size: 1em !important;
}

.nav-pagination > li > .current, .nav-pagination > li > a:hover, .nav-pagination > li > span:hover {
background-color: var(--accent-violet);
color: var(--fond-blanc);
}

a.page-numbers {
    color: var(texte-principal);
    margin-right: 15px;
    margin-left: 15px;
    font-weight: bold;
    font-size: 1.1em !important;
}

a.page-numbers:hover {
    color: var(--accent-rose-vif) !important;
}

.page-numbers {
  display: inline-block;
  transition: transform 0.2s ease, color 0.2s ease;
}

.page-numbers:hover {
  transform: scale(1.1);
}

.page-numbers.current {
  transform: scale(1.2);
  color: var(--accent-rose-vif);
}

/* page suivante et flèche */
a.next.page-numbers {
 margin-left: 15px;
 margin right: 5px;
 font-weight: bold;
 color: var(--texte-principal) !important;
}

a.next.page-numbers:hover {
 color: var(--accent-rose-vif) !important;
}

.blog-pagination {
    text-align: center !important;
}

.h2-haut-page-hors-bandeau-purple {
  font-size: 1.6rem;
  color: var(--accent-violet);
  font-family: var(--font-titres);
  text-align: center;
}

.h2-haut-page-hors-bandeau-pink {
   font-size: 1.6rem;
  color: var(--accent-rose-vif);
  font-family: var(--font-titres);
  text-align: center;
}


/* menu navigation loupe */
.search-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  display: none;
  justify-content: center;
  z-index: 9999;
  align-items: flex-start;
  padding-top: 190px;
}

.search-overlay.active {
  display: flex;
}

.search-overlay-content input {
  width: 500px;
  padding: 12px 15px;
  font-size: 1.2rem;
  border: none;
  outline: none;
  background-color: var(--accent-doux) !important;
  color: var(--texte-principal) !important;
  border: 1px solid #f3dce4 !important;
  border-radius: 30px;
  outline: none !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.2) !important;
  transition: all 0.25s ease;
}

.search-overlay-content input:focus {
  /*border: 2px solid #e8b6c6 !important;*/
  box-shadow: 0 0 0 5px var(--accent-secondaire) !important;
  background-color: var(--fond-blanc) !important
}

.search-overlay-content input::placeholder {
  color: var(--texte-principal) !important;
}

.more-link, .button, .primary, .is-outline, .is-smaller{
  color: black !important;
  text-decoration: none !important;
}

/* header blog */
/* ------------ HERO IMAGE -------------- */
.hero-image {
  position: relative;
  width: 100%;
  margin: 0;
}

.hero-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ------------ OVERLAY + TEXTE -------------- */
/*.hero-text {
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  text-align: center;
  padding: 20px;

  /* Fond sombre semi-transparent pour lisibilité */
  /*background: rgba(0, 0, 0, 0.35);
  border-radius: 12px;
}*/

.blog-h1 {
  color: #ffffff;
  font-size: clamp(1.2rem, 4vw, 2.8rem); /* RESPONSIVE MAGIC */
  line-height: 1.3;
  margin: 0;
}

.blog-h1-rose {
  color: #ffb7d9; /* Rose lisible sur fond sombre */
}

/* Caption (facultatif) */
.blog-hero-figcaption {
  text-align: center;
  font-size: 14px;
  margin-top: 8px;
  color: #666;
}

/* ------------ VERSION MOBILE -------------- */
@media screen and (max-width: 480px) {
  .hero-text {
    bottom: 5%;
    background: rgba(0, 0, 0, 0.45); /* un peu plus sombre sur mobile */
    padding: 14px;
  }
}

.atelier-shop-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.atelier-products-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 2rem;
}

@media(max-width:1024px){
    .atelier-products-grid { grid-template-columns: repeat(2,1fr); }
}
@media(max-width:640px){
    .atelier-products-grid { grid-template-columns: 1fr; }
}

.atelier-filters-wrapper {
  max-width: 1200px;
  margin: 0 auto 2rem;
  text-align: center;
}

.atelier-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.filter-cat {
  padding: 8px 16px;
  border-radius: 999px;
  border: none;
  background: #eee;
  cursor: pointer;
  font-weight: 600;
}

.filter-cat.active {
  background: #880e4f;
  color: #fff;
}

.products.loading {
  opacity: .5;
  pointer-events: none;
}

.filter-drawer {
  position: fixed;
  inset: 0;
  background: #fff;
  z-index: 9999;
  transform: translateY(100%);
  transition: transform .3s ease;
  display: flex;
  flex-direction: column;
  box-shadow: 0 8px 30px rgba(0,0,0,0.25); /* ombre sur tout le pourtour */
  border: 2px solid #880e4f; /* bordure violette */
  border-radius: 12px; /* coins arrondis */
  padding: 20px;
  max-width: 400px; /* largeur max du drawer */
}

.filter-drawer.open {
  transform: translateY(0);
}

@media (min-width: 1024px) {
  .filter-drawer {
    width: 360px;
    left: auto;
    transform: translateX(100%);
  }
  .filter-drawer.open {
    transform: translateX(0);
  }
}

.filter-content {
  padding: 16px;
  overflow-y: auto;
}

.color-swatches {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(36px, 1fr));
  gap: 12px;
}

.color-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid #ccc;
  background: var(--color);
  cursor: pointer;
  position: relative;
  padding: 0;
}

/* === COULEURS FILTRES – OVERRIDE FLATSOME === */
.color-dot {
  display: inline-block;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-color: var(--color) !important;
  border: 1px solid #999;
  cursor: pointer;
  padding: 0;
}

/* Blanc / beige visibles */
.color-dot[style*="#FFFFFF"],
.color-dot[style*="#F5F5DC"] {
  border: 1px solid #666;
}

/* Sélection */
.color-dot.active {
  outline: 2px solid #8B5CF6;
  outline-offset: 2px;
}

/* Hover */
.color-dot:hover {
  transform: scale(1.1);
}

button.color-dot,
.color-dot {
  /* déjà existant : */
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--color) !important;
  border: 1px solid #999;
  cursor: pointer;

  /* AMÉLIORATIONS VISUELLES */
  display: inline-block;
  box-sizing: border-box;
  -webkit-backface-visibility: hidden;  /* fluidité */
  -webkit-transform: translateZ(0);     /* anti-pixelation */
  transform: translateZ(0);
  image-rendering: auto;
}

.color-dot {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.color-dot:hover,
.color-dot.active {
  transform: scale(1.1);
  box-shadow: 0 0 5px rgba(0,0,0,0.3);
}

/* ======================= */
/* Bandeau filtres visuels  */
/* ======================= */
.filter-section {
  background-color: #fff0f5;
  padding: 10px 0;
  text-align: center;
}

.filter-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
  align-items: center;
}

.filter-item {
  text-align: center;
  cursor: pointer;
}

.filter-item img.filter-img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 5px;
  transition: transform 0.2s ease;
}

.filter-item img.filter-img:hover {
  transform: scale(1.1);
}

.filter-item span {
  display: block;
  font-size: 11px;
  color: #333333;
}

/* Bouton Filtrer */
.filter-item button#openFilters {
  padding: 4px 8px !important;
  border-radius: 6px !important;
  border: 2px solid #333333 !important;
  background-color: transparent !important;
  color: #333333 !important;
  cursor: pointer;
  font-weight: bold;
  transition: background-color 0.2s ease;
}

/* ======================= */
/* Bandeau filtres visuels  */
/* ======================= */
.filter-section {
  background-color: #fff0f5;
  padding: 10px 0;
  text-align: center;
}

.filter-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
  align-items: center;
}

.filter-item {
  text-align: center;
  cursor: pointer;
  padding: 8px; /* espace autour de chaque icône */
  border-radius: 10px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Images avec padding interne pour que le motif respire */
.filter-item img.filter-img {
  width: 55px !important;
  height: 55px !important;
  padding: 8px; /* espace autour de l'image */
  /*border-radius: 50%;*/
  object-fit: contain;
  background-color: #fff0f5; /* optionnel pour bien voir le padding */
  margin-bottom: 5px;
  box-sizing: border-box;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Hover plus doux et élégant */
.filter-item:hover img.filter-img {
  transform: scale(1.2);
  box-shadow: 0 4px 20px rgba(255, 192, 203, 0.6); /* halo rose clair */
}

/* Texte sous l'image */
.filter-item span {
  display: block;
  font-size: 12px;
  color: #333333;
}

/* Bouton Filtrer */
.filter-item button#openFilters {
  padding: 4px 8px !important;
  border-radius: 6px !important;
  border: 2px solid #333333 !important;
  background-color: transparent !important;
  color: #333333 !important;
  cursor: pointer;
  font-weight: bold;
  transition: background-color 0.2s ease;
}

.filter-item button#openFilters:hover {
  background-color: #e0e0e0;
}

/* Responsive */
@media (max-width: 768px) {
  .filter-buttons {
    gap: 10px;
  }

  .filter-item img.filter-img {
    width: 35px;
    height: 35px;
    padding: 6px;
  }

  .filter-item span {
    font-size: 10px;
  }

  .filter-item button#openFilters {
    padding: 6px 10px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .filter-buttons {
    gap: 8px;
  }

  .filter-item img.filter-img {
    width: 30px;
    height: 30px;
    padding: 4px;
  }

  .filter-item span {
    font-size: 9px;
  }

  .filter-item button#openFilters {
    padding: 5px 8px;
    font-size: 12px;
  }
}

/* Bouton Filtrer hover – transition adoucie */
#openFilters {
  transition: background-color 0.4s ease, transform 0.4s ease !important; /* durée plus longue, easing doux */
}

#openFilters:hover {
  background-color: #ffe0f0 !important; /* léger fond rose */
  transform: scale(1.05) !important;     /* petit zoom */
}

/* Bandeau filtres visuels – arrondi et ombre */
.filter-section {
  background-color: #fff0f5;  /* rose clair */
  padding: 15px 0;
  text-align: center;
  border-radius: 12px;              /* arrondi des coins */
  box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* ombre douce */
}

/* Responsive – tablettes petites et mobiles */
@media (max-width: 768px) {
  .filter-buttons {
    gap: 12px;
    flex-wrap: wrap; /* permet aux icônes de passer sur plusieurs lignes si nécessaire */
    justify-content: center;
  }

  .filter-item img.filter-img {
    width: 45px;   /* agrandissement par rapport aux 40px précédents */
    height: 45px;
    padding: 6px;
  }

  .filter-item span {
    font-size: 10px;
  }
}

@media (max-width: 480px) {
  .filter-buttons {
    gap: 8px;
  }

  .filter-item img.filter-img {
    width: 40px;   /* un peu plus grand que les 35px précédents */
    height: 40px;
    padding: 4px;
  }

  .filter-item span {
    font-size: 9px;
  }
}

@media (max-width: 768px) {
  .filter-item:hover img.filter-img {
    transform: scale(1.1); /* moins agressif sur petit écran */
  }
}

/* iPad mini portrait et tablettes similaires */
@media (max-width: 768px) {
  .filter-buttons {
    display: flex;
    flex-wrap: wrap;   /* permet aux icônes de passer sur plusieurs lignes */
    justify-content: center;
    gap: 12px;         /* ajuste l'espacement si nécessaire */
  }

  .filter-item img.filter-img {
    width: 45px;   /* légèrement plus grand que mobile */
    height: 45px;
    padding: 6px;
  }

  .filter-item span {
    font-size: 10px;
  }
}

/* Centrer le message d'absence de produit */
.products.shop-products-grid > p {
    display: block !important;    /* se comporte comme un bloc */
    text-align: center !important;
    width: 100% !important;
    margin: 2rem auto !important;
    font-size: 1.1rem;
    color: #333;
}


.no-products-message {
    text-align: center !important;
    width: 100% !important;
    margin: 2rem auto;
}

/* Header du drawer */
.filter-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}

/* Bouton fermer X */
#closeFilters {
  font-size: 16px; /* taille réduite */
  padding: 4px 8px;
  cursor: pointer;
  background: none;
  border: 1px solid #880e4f;
  border-radius: 6px;
  color: #880e4f;
  transition: background-color 0.2s ease;
}

#closeFilters:hover {
  background-color: rgba(136, 14, 79, 0.1);
}

/* Contenu des filtres */
.filter-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Footer du drawer : centrage des boutons */
.filter-footer {
  display: flex;
  justify-content: center; /* centrage horizontal */
  gap: 15px; /* espacement entre les boutons */
  margin-top: 20px;
}

/* Boutons Réinitialiser et Voir les résultats */
.filter-footer button {
  padding: 6px 12px; /* taille réduite */
  font-size: 13px; /* texte plus petit */
  border-radius: 6px;
  border: 2px solid #880e4f;
  background-color: #fff;
  color: #880e4f;
  cursor: pointer;
  font-weight: bold;
  transition: all 0.2s ease;
}

.filter-footer button:hover {
  background-color: #880e4f;
  color: #fff;
  border-color: #880e4f;
}

/* Optionnel : labels checkbox un peu plus espacés */
.filter-group label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
}

.button /*, button, fieldset, input, select, textarea */ {
  background-color: var(--accent-doux) !important;
  border: 2px solid #333333 !important;
}

.custom-product-navigation .button:hover {
  background: #333 !important;
  color: var(--accent-doux) !important;
}

.zoom-button:hover {
  background-color: #333333 !important;
}

i.icon-expand:hover {
  color: var(--accent-doux) !important;
}

.li-margin {
margin-bottom: 10px;
margin-top: 10px;
}

.quantity .button.plus {
  color: var(--fond-blanc);
  background-color: var(--accent-violet) !important;
  border: none !important;
  font-size: 1.4em !important;
}

.quantity .minus, .quantity .plus {
  padding-left: .4em;
  padding-right: .4em;
  background-color: var(--accent-violet) !important;
  border: none !important;
}

.quantity,
.button.plus,
.quantity .minus
{
background-color: var(--accent-violet) !important;
  border: none !important;
}


form.cart > .single_add_to_cart_button {
  background-color: var(--accent-violet) !important;
}

.h2-type-produit {
  color: var(--accent-violet);
  text-shadow: 1px solid var(--fond-blanc);
  font-size: 1.8rem !important;
  text-align: center;
}

.h3-type-produit {
  color: var(--texte-principal);
  font-size: 1.4rem !important;
  text-align: left;
  font-weight: bold;
}

.h3-type-produit::before {
  content: "🌸";
  margin-right: 0.5rem;   /* espace entre icône et texte */
  font-size: 1.2rem;
  display: inline-block;  /* flux flex normal */
  opacity: 0.85;
  transform-origin: center;
  transition: transform 0.35s ease;
}

.bienvenue-a-propos::before {
  content: "🌸";
  margin-right: 0.5rem;   /* espace entre icône et texte */
  font-size: 1.2rem;
  display: inline-block;  /* flux flex normal */
  opacity: 0.85;
  transform-origin: center;
  transition: transform 0.35s ease;
}

.a-propos-hero-p-secondaire {
 color: #A4D4C1 !important;
}

.a-propos-hero-p-primaire {
 color: var(--accent-doux) !important;
}

/*
span.a-propos-hero-p-secondaire, span.a-propos-hero-p-primaire {
  text-align: center !important;
}
*/

#titre-a-propos {
  color: var(--accent-violet) !important;
  text-shadow: 1px solid var(--fond-blanc) !important;
  font-size: 1.8rem !important;
}

.lola {
  font-weight: bold;
}

.lola::before {
  content: "🌸";
  margin-right: 0.5rem;   /* espace entre icône et texte */
  font-size: 1.2rem;
  display: inline-block;  /* flux flex normal */
  opacity: 0.85;
  transform-origin: center;
  transition: transform 0.35s ease;
}

@media (max-width: 374px) {
  .question,
  .answer,
  li.answer-puces {
    font-size: 0.95rem;
  }
}

@media (min-width: 375px) and (max-width: 767px) {
  .question,
  .answer,
  li.answer-puces {
    font-size: 1rem;
  }
}

@media (min-width: 768px) and (max-width: 899px) {
  .question,
  .answer,
  li.answer-puces {
    font-size: 1.05rem;
  }
}

@media (min-width: 900px) and (max-width: 1024px) {
  .question,
  .answer,
  li.answer-puces {
    font-size: 1.1rem;
  }
}

@media (max-width: 1024px) {
  .woocommerce-product-gallery {
    max-width: 90%;
    margin: 0 auto 2rem;
  }

  .woocommerce-product-gallery img {
    max-height: 420px;
    object-fit: contain;
  }
}

@media (max-width: 480px) {
  .woocommerce-product-gallery img {
    max-height: 320px;
  }
}

@media (max-width: 1024px) {
  .prev-product,
  .next-product {
    display: none !important;
  }
}

@media (max-width: 1024px) {
  .single_add_to_cart_button {
    padding: 0.8rem 1.2rem !important;
    width: auto;
    max-width: 100%;
  }
}

@media (max-width: 1024px) {
  form.cart {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .quantity {
    margin-bottom: 1rem;
  }

  .single_add_to_cart_button {
    width: 90%;
    text-align: center;
  }
}

@media (max-width: 768px) {
  .product-main,
  .product-info,
  .woocommerce-product-details__short-description,
  .product-description {
    padding-left: 1.2rem;
    padding-right: 1.2rem;
  }
}

@media (max-width: 768px) {
  .woocommerce-Tabs-panel,
  .entry-content {
    padding-left: 1.2rem;
    padding-right: 1.2rem;
  }
}

/* ===================================================== */
/* SUPPRIMER UNIQUEMENT LE BREADCRUMB FLATSOME */
/* ===================================================== */

/* Breadcrumb Flatsome = hors de .atelier-breadcrumb */
.single-product nav.woocommerce-breadcrumb:not(.atelier-breadcrumb nav),
.single-product .breadcrumbs:not(.atelier-breadcrumb .breadcrumbs),
.single-product .breadcrumbs.uppercase:not(.atelier-breadcrumb .breadcrumbs.uppercase) {
    display: none !important;
}

.atelier-breadcrumb {
    margin: 1rem 0 1.5rem; /* espace au-dessus et en dessous */
    padding-top: 0.5rem;
}

.single-product .product-main {
    padding-top: 1.5rem;
}

@media (min-width: 1025px) {
    .atelier-breadcrumb {
        margin-top: 1.5rem;
        margin-bottom: 2rem;
    }
}

@media (max-width: 1024px) {
    .atelier-breadcrumb {
        margin-top: 0.75rem;
        margin-bottom: 1.25rem;
    }
}



.atelier-breadcrumb {
    line-height: 1.6;
    letter-spacing: 0.02em;
}

/* ===================================================== */
/* BOUTON ADD TO CART AJAX – STYLE FINAL */
/* ===================================================== */

/* Bouton normal : violet */
.button.add_to_cart_button.ajax_add_to_cart {
    background-color: var(--accent-violet) !important;
    color: #fff !important;
    border: none; /* plus de bordure */
    padding: 0.35em 0.9em; /* bouton plus petit */
    border-radius: 0.3em;
    font-weight: 600;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(0,0,0,0.15); /* shadow douce */
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

/* Survol : rose vif + léger zoom + shadow */
.button.add_to_cart_button.ajax_add_to_cart:hover {
    background-color: var(--texte-principal) !important;
    transform: scale(1.05);
    box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}

/* État ajouté : vert + texte blanc + légère translation + shadow */
.button.add_to_cart_button.ajax_add_to_cart.added {
    background-color: var(--accent-vert) !important;
    color: #fff !important;
    transform: translateX(-2px);
    box-shadow: 0 6px 12px rgba(0,0,0,0.25);
    border: none !important;
}

/* Coche uniquement avant le texte, pas après */
.button.add_to_cart_button.ajax_add_to_cart.added::after {
    content: none !important;
}

.button.add_to_cart_button.ajax_add_to_cart.added::before {
    color: #fff;
    font-weight: 700;
    margin-right: 6px;
}

/* Icône à l'intérieur */
.button.add_to_cart_button.ajax_add_to_cart i {
    font-size: 1em;
    transition: transform 0.25s ease;
}

.button.add_to_cart_button.ajax_add_to_cart:hover i {
    transform: scale(1.1);
}

/* Forcer le style Add to Cart sur mobile & tablette */
@media (max-width: 1024px) {
  .button.add_to_cart_button.ajax_add_to_cart {
    background-color: var(--accent-violet) !important;
    color: #fff !important;
    border: none !important;
  }
}

@media (max-width: 1024px) {
  .button.add_to_cart_button.ajax_add_to_cart:active {
    background-color: #333 !important;
    color: #fff !important;
    transform: scale(1.02);
  }
}

@media (max-width: 1024px) {
  .button.add_to_cart_button.ajax_add_to_cart.added {
    background-color: var(--accent-vert) !important;
    color: #fff !important;
    border: none !important;
  }
}

@media (max-width: 1024px) {
  .button.add_to_cart_button.ajax_add_to_cart,
  .button.add_to_cart_button.ajax_add_to_cart:hover,
  .button.add_to_cart_button.ajax_add_to_cart:active {
    background-image: none !important;
    box-shadow: 0 3px 10px rgba(0,0,0,0.15) !important;
  }
}

/* ============================= */
/* FIX ADD TO CART – TOUS ÉCRANS */
/* ============================= */

.woocommerce ul.products li.product
.button.add_to_cart_button.ajax_add_to_cart,
.woocommerce ul.products li.product
.button.add_to_cart_button.ajax_add_to_cart.alt,
.woocommerce ul.products li.product
.button.add_to_cart_button.ajax_add_to_cart.is-outline {
  background-color: var(--accent-violet) !important;
  color: #fff !important;
  border: none !important;
  background-image: none !important;
}

.woocommerce ul.products li.product
.button.add_to_cart_button.ajax_add_to_cart:hover {
  background-color: #333 !important;
  color: #fff !important;
}

.woocommerce ul.products li.product
.button.add_to_cart_button.ajax_add_to_cart:active {
  background-color: #333 !important;
  color: #fff !important;
}

.woocommerce ul.products li.product
.button.add_to_cart_button.ajax_add_to_cart.added {
  background-color: var(--accent-vert) !important;
  color: #fff !important;
  border: none !important;
}

.woocommerce ul.products li.product
.button.add_to_cart_button.ajax_add_to_cart.alt:active,
.woocommerce ul.products li.product
.button.add_to_cart_button.ajax_add_to_cart.is-outline:active {
  background-color: #333 !important;
  color: #fff !important;
}


/* ===================================================== */
/* BOUTON VOIR LE PANIER */
.button.wc-forward {
    font-weight: 700; /* texte en gras */
    color: #fff;
    background-color: var(--accent-vert);
    border: none !important;
    border-radius: 0.3em;
    padding: 0.35em 0.9em;
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(0,0,0,0.15);
    transition: color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.button.wc-forward:hover {
    color: var(--accent-violet);
    transform: scale(1.05);
    box-shadow: 0 6px 12px rgba(0,0,0,0.2);
}


/* Enlever les étoiles sur les cartes produits */
ul.products li.product .star-rating {
    display: none !important;
}

/* ===============================
   BOUTONS FILTRES – TAILLE RÉDUITE
   =============================== */
.filter-footer button {
    background-color: var(--accent-violet) !important; /* violet initial */
    color: #fff !important;
    border: none !important;
    border-radius: 0.35em;
    padding: 0.3em 0.8em;       /* réduit hauteur et largeur */
    font-weight: 600;
    font-size: 0.8rem;          /* texte plus petit */
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

/* Survol : gris foncé + léger zoom + ombre */
.filter-footer button:hover {
    background-color: #333333 !important;
    transform: scale(1.03);
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* Optionnel : clic plus doux */
.filter-footer button:active {
    transform: scale(0.97);
}

/* ===============================
   BOUTONS FILTRES – HAUTEUR RÉDUITE ET LARGEUR ADAPTÉE
   =============================== */
.filter-footer button {
    background-color: var(--accent-violet) !important; /* violet initial */
    color: #fff !important;
    border: none !important;
    border-radius: 0.35em;
    padding: 0.25em 0.9em;   /* moins haut, plus large */
    font-weight: 600;
    font-size: 0.8rem;       /* texte plus petit */
    min-width: 6ch;          /* minimum pour Réinitialiser */
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;      /* éviter que le texte se coupe */
}

/* Survol : gris foncé + léger zoom + ombre */
.filter-footer button:hover {
    background-color: #333333 !important;
    transform: scale(1.03);
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* Optionnel : clic plus doux */
.filter-footer button:active {
    transform: scale(0.97);
}

/* ===============================
   BOUTONS FILTRES – CONTENU AUTO
   =============================== */
/* ===============================
   BOUTONS FILTRES – VERSION COMPACTE
   =============================== */
.filter-footer button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.55rem;           /* texte plus petit pour tenir dans le bouton */
    padding: 0.35em 0.8em;        /* padding juste le nécessaire */
    width: auto;                  /* s’adapte au texte */
    white-space: nowrap;          /* empêche le texte de se couper */
    border-radius: 0.25em;
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
}

/* Ajustement bouton "Voir les résultats" */
.filter-footer button#applyFilters {
    font-size: 0.52rem;        /* texte un peu plus petit pour tenir */
    padding-left: 2em;         /* padding gauche minimal nécessaire */
    padding-right: 2em;        /* padding droite minimal nécessaire */
    min-width: 0;              /* pour éviter contraintes de largeur */
}

/* Conteneur des boutons */
.filter-footer {
    display: flex;              /* boutons en ligne */
    gap: 0.3em;                 /* espace minimal entre eux */
    flex-wrap: wrap;            /* si l’écran est trop petit, les boutons passent à la ligne */
}

/* Boutons filtres */
.filter-footer button {
    flex: 1 1 auto;             /* chaque bouton prend l’espace nécessaire, mais pas plus */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.55rem;         /* texte réduit */
    padding: 0.35em 0.6em;      /* padding minimal */
    white-space: nowrap;         /* empêche le texte de se couper */
    border-radius: 0.25em;
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
}

/* Survol : gris foncé + léger zoom + ombre */
.filter-footer button:hover {
    background-color: #333333 !important;
    transform: scale(1.03);
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* Option clic plus doux */
.filter-footer button:active {
    transform: scale(0.97);
}

/* Survol : gris foncé + léger zoom + ombre */
.filter-footer button:hover {
    background-color: #333333 !important;
    transform: scale(1.02);
    box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}

/* Clic plus doux */
.filter-footer button:active {
    transform: scale(0.97);
}


/* Optionnel : clic plus doux */
.filter-footer button:active {
    transform: scale(0.97);
}

/* Hover : même effet que les autres boutons */
#closeFilters:hover {
    background-color: #333333 !important;
    transform: scale(1.03);
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

a.button-continue-shopping {
  background-color: var(--accent-violet) !important;
  border: none !important;
  border: 2px solid black !important;
  font-weight: bold; !important;
}

a.button-continue-shopping:hover {
  background-color: var(--accent-doux) !important;
  color: #333 !important;
  border: 2px solid black !important;
  font-weight: bold; !important;
}

.button.disabled, .button[disabled], button.disabled, button[disabled] {
  color: var(--fond-blanc);
  background-color: var(--texte-principal);
  border: 2px solid black !important;
  font-weight: bold; !important;
}
/*
.button.disabled:hover, .button[disabled]:hover, button.disabled:hover, button[disabled]:hover {
  color: var(--texte-principal) !important;
  background-color: var(--fond-blanc) !important;
  border: 2px solid black !important;
  font-weight: bold !important;
  opacity: 1 !important;
}

*/

/* Bouton add to cart de la page cart */
.woocommerce-cart button[name="update_cart"] {
  background-color: #000;
  color: #fff;
  border: 2px solid #000;
  font-weight: bold;
  cursor: pointer;

  /* 🔑 neutralisation thème */
  background-image: none !important;
  box-shadow: none !important;
}

.woocommerce-cart button[name="update_cart"]:hover {
  background-color: #fff !important;
  color: #000 !important;

  /* 🔑 idem au hover */
  background-image: none !important;
  box-shadow: none !important;
}

/* page cart message Vous voulez annuler la surppression de l'article ? */
.message-container.success-color {
  display: flex;
  justify-content: center;   /* centrage horizontal */
  align-items: center;       /* centrage vertical */
  text-align: center;
  gap: 8px;                  /* espace entre l’icône et le texte */
}

.message-container.success-color {
  flex-wrap: wrap;
}

.message-container a {
  color: var(--accent-violet) !important;
}

.woocommerce-cart th.product-quantity {
  text-align: center;
  font-weight: inherit;
  font-size: inherit;
}

.woocommerce-cart th.product-quantity,
.woocommerce-cart td.product-quantity {
  vertical-align: middle;
}

@media (max-width: 768px) {
  .woocommerce-cart table.shop_table th.product-quantity {
    display: table-cell !important;
  }
}

/* Uniformiser TOUS les th du panier */
.woocommerce-cart table.shop_table thead th {
  vertical-align: middle;
  line-height: 1.4;
}

/* Forcer Quantité à se comporter comme les autres */
.woocommerce-cart table.shop_table th.product-quantity {
  display: table-cell !important;
  padding: inherit;
  vertical-align: middle;
  line-height: 1.4;
  color: var(--texte-principal) !important;
  font-size: 1.1em;
  font-weight: bold !important;
}

.woocommerce-cart table.shop_table th.product-quantity {
  width: auto !important;
  min-width: auto !important;
}

.button.wc-forward {
  color: var(--fond-blanc) !important;
  background-color: var(--accent-violet) !important;
  font-weight: bold !important;
  border: 2px solid #333 !important;
}

.button.wc-forward:hover {
  color: var(--texte-principal) !important;
  background-color: var(--accent-doux) !important;
  font-weight: bold !important;
 /* transform: scale(1.02) !important;*/
  border: 2px solid #333 !important;
}

.button.wc-forward,
.button.wc-forward:hover {
  transform: none !important;
  box-shadow: none !important;
  filter: none !important;
}

.button.is-form {
  background-color: var(--accent-violet) !important;
}

.button.is-form:hover {
  background-color: var(--fond-blanc) !important;
  color: var(--fond-principal);
}

.button.is-form {
  position: relative;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

.button.is-form::before,
.button.is-form::after {
  content: none !important;
  display: none !important;
}

.button.is-form:hover {
  background-color: var(--fond-blanc) !important;
  color: var(--texte-principal) !important;
}

.woocommerce-cart .cart-collaterals .coupon input#coupon_code {
  color: var(--accent-violet) !important;
}

.woocommerce-cart .message-container {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.woocommerce-cart .message-container.container {
  max-width: 100%;
  text-align: center;
}

.woocommerce-cart .message-container {
  display: flex;
  justify-content: center;
  text-align: center;
  margin-bottom: 30px;
  font-weight: bold;
  color: var(--accent-rose-vif) !important;
}

.woocommerce-cart .return-to-shop .button {
  background: var(--accent-violet) !important;
  background-image: none !important;
  color: #fff !important;
  border: 2px solid #333;
  font-size: inherit;
  font-weight: inherit;
}

.woocommerce-cart .return-to-shop .button:hover {
  background: var(--accent-rose-vif) !important;
  background-image: none !important;
}

/* Espèce de bordure droite, gauche et dessous bleue
due au navigateur dans le cart lorsqu'on n'applique un code promo inexistant */
/* Suppression complète du focus visuel sur les messages WooCommerce */
.woocommerce-error,
.woocommerce-error:focus,
.woocommerce-error:focus-visible,
.woocommerce-error:focus-within {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* Cas spécifique des éléments avec tabindex */
.woocommerce-error[tabindex],
.woocommerce-error[tabindex]:focus {
  outline: 0 !important;
  box-shadow: none !important;
}

/* Sécurité : wrapper Flatsome */
.message-wrapper:focus,
.message-wrapper:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.woocommerce-cart .checkout-button.wc-forward {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* croix pour supprimer un produit dans le panier */
/* ===================================================== */
/* PANIER – FIX CROIX SUR IMAGE (MOBILE SEULEMENT) */
/* ===================================================== */

@media (max-width: 768px) {

  /* On crée de l’espace pour que la croix ne chevauche pas l’image */
  .woocommerce-cart td.product-thumbnail {
    padding-left: 36px !important;
  }

  /* On décale légèrement l’image vers la droite */
  .woocommerce-cart td.product-thumbnail img {
    margin-left: 10px;
    display: block;
  }
}

/* Centrage vertical de la croix dans la ligne panier */
.woocommerce-cart td.product-thumbnail {
  vertical-align: middle;
}

@media (max-width: 768px) {
  .woocommerce-cart td.product-thumbnail {
    display: table-cell;
    vertical-align: middle;
  }
}

/* ===================================================== */
/* CHAMP CODE PROMO – OVERRIDE TOTAL FLATSOME / MOBILE */
/* ===================================================== */

/* Base – TOUS écrans */
input#coupon_code.input-text,
.woocommerce input#coupon_code,
.woocommerce-cart input#coupon_code,
.woocommerce-checkout input#coupon_code {
    background: #ffffff !important;
    color: var(--accent-violet) !important;
    border: 2px solid var(--accent-violet) !important;
    box-shadow: none !important;
    outline: none !important;
    caret-color: var(--accent-rose-vif) !important;

    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Placeholder */
input#coupon_code::placeholder {
    color: var(--accent-violet) !important;
    opacity: 0.6 !important;
}

/* Focus / clic / écriture */
input#coupon_code:focus,
input#coupon_code:focus-visible,
input#coupon_code:active {
    background: #ffffff !important;
    color: var(--accent-rose-vif) !important;
    border-color: var(--accent-rose-vif) !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Mobile Safari / Chrome (OBLIGATOIRE) */
@media screen and (max-width: 900px) {
    input#coupon_code.input-text {
        background: #ffffff !important;
        color: var(--accent-violet) !important;
        border-color: var(--accent-violet) !important;
    }

    input#coupon_code.input-text:focus,
    input#coupon_code.input-text:active {
        color: var(--accent-rose-vif) !important;
        border-color: var(--accent-rose-vif) !important;
    }
}



/* ===================================================== */
/* BOUTON APPLIQUER LE CODE PROMO – STYLE FINAL */
/* ===================================================== */

.woocommerce-cart button[name="apply_coupon"],
.woocommerce-checkout button[name="apply_coupon"] {
    background-color: var(--accent-violet) !important;
    color: #ffffff !important;
    border: 2px solid var(--accent-violet) !important;
    font-weight: 600;
    cursor: pointer;

    box-shadow: none !important;
    outline: none !important;

    transition: background-color 0.25s ease, border-color 0.25s ease;
    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Hover + focus + clic (desktop & mobile) */
.woocommerce-cart button[name="apply_coupon"]:hover,
.woocommerce-cart button[name="apply_coupon"]:focus,
.woocommerce-cart button[name="apply_coupon"]:active,
.woocommerce-checkout button[name="apply_coupon"]:hover,
.woocommerce-checkout button[name="apply_coupon"]:focus,
.woocommerce-checkout button[name="apply_coupon"]:active {
    background-color: var(--texte-principal) !important;
    color: #ffffff !important;
    border-color: var(--texte-principal) !important;

    box-shadow: none !important;
    outline: none !important;
}

/* Sécurité mobile (Safari / Chrome) */
@media (max-width: 900px) {
    .woocommerce-cart button[name="apply_coupon"],
    .woocommerce-checkout button[name="apply_coupon"] {
        background-color: var(--accent-violet) !important;
        color: #ffffff !important;
        border-color: var(--accent-violet) !important;
    }

    .woocommerce-cart button[name="apply_coupon"]:active,
    .woocommerce-checkout button[name="apply_coupon"]:active {
        background-color: var(--texte-principal) !important;
        border-color: var(--texte-principal) !important;
    }
}

/* ===================================================== */
/* SELECT PAYS – SUPPRESSION LIGNE VIOLETTE AFFREUSE */
/* ===================================================== */

/* Champ de recherche interne Select2 */
.select2-container .select2-search__field {
    background: #ffffff !important;
    color: var(--texte-principal) !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Empêche la ligne colorée au focus */
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Supprime toute surbrillance violette parasite */
.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: #ccc !important;
    box-shadow: none !important;
}

/* ===================================================== */
/* SELECT PAYS – AJOUT ICÔNE LOUPE DANS LA RECHERCHE */
/* ===================================================== */

/* Champ de recherche Select2 */
.select2-container .select2-search__field {
    background-color: #ffffff !important;
    color: var(--texte-principal) !important;
    padding-left: 2.2em !important; /* espace pour la loupe */
    font-size: 0.95rem;
}

/* Icône loupe */
.select2-container .select2-search--dropdown {
    position: relative;
}

.select2-container .select2-search--dropdown::before {
    content: "";
    width: 20px;
    height: 20px;
    background: currentColor;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9.5 3a6.5 6.5 0 015.19 10.49l5.66 5.66-1.41 1.41-5.66-5.66A6.5 6.5 0 119.5 3zm0 2a4.5 4.5 0 100 9 4.5 4.5 0 000-9z'/%3E%3C/svg%3E") center / contain no-repeat;
    position: absolute;
    left: 0.7em;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0.4;
    pointer-events: none;
}

/* Focus propre */
.select2-container .select2-search__field:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* Mobile sécurité */
@media (max-width: 900px) {
    .select2-container .select2-search__field {
        font-size: 1rem;
    }
}

/* ===================================================== */
/* FORMULAIRES CHECKOUT / PANIER – FOCUS PROPRE */
/* ===================================================== */

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection {
    border: 2px solid #ccc !important;
    box-shadow: none !important;
    outline: none !important;
    transition: border-color 0.2s ease;
}

/* Focus / clic */
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.select2-container--focus .select2-selection,
.select2-container--open .select2-selection {
    border-color: #999 !important; /* neutre */
    box-shadow: none !important;
    outline: none !important;
}

/* Mobile Safari / Chrome */
input.input-text:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

/* ===================================================== */
/* PANIER – HARMONISATION SOUS-TOTAL / TOTAL */
/* ===================================================== */

/* Texte des produits (référence) */
.woocommerce-cart .shop_table td,
.woocommerce-cart .shop_table th {
    font-size: inherit;
    font-weight: inherit;
}

/* Sous-total */
.woocommerce-cart .cart-subtotal th,
.woocommerce-cart .cart-subtotal td {
    font-size: inherit !important;
    font-weight: inherit !important;
}

/* Total */
.woocommerce-cart .order-total th,
.woocommerce-cart .order-total td {
    font-size: inherit !important;
    font-weight: inherit !important;
}

.woocommerce-cart .order-total td,
.woocommerce-cart .order-total th {
    font-weight: 600 !important;
}

.woocommerce-cart .order-total .amount,
.woocommerce-cart .cart-subtotal .amount {
    font-size: inherit !important;
}

/* ===================================================== */
/* PANIER – FORCER TAILLE IDENTIQUE PRODUITS / TOTAUX */
/* ===================================================== */

/* Taille de référence = lignes produits */
.woocommerce-cart .shop_table tbody td {
    font-size: 1rem !important;
}

/* Sous-total */
.woocommerce-cart .cart-subtotal th,
.woocommerce-cart .cart-subtotal td,
.woocommerce-cart .cart-subtotal .amount {
    font-size: 1rem !important;
    font-weight: inherit !important;
}

/* Total */
.woocommerce-cart .order-total th,
.woocommerce-cart .order-total td,
.woocommerce-cart .order-total .amount {
    font-size: 1rem !important;
    font-weight: inherit !important;
}

.woocommerce-cart .woocommerce-Price-amount {
    font-size: 1rem !important;
}


/* ===================================================== */
/* CHECKOUT – MESSAGE AUCUN MOYEN DE PAIEMENT */
/* ===================================================== */

.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-notice,
.woocommerce-checkout .woocommerce-notice--info {
    font-style: normal !important;
    color: var(--accent-violet) !important;
}

.woocommerce-checkout .woocommerce-info em,
.woocommerce-checkout .woocommerce-info i {
    font-style: normal !important;
}

.woocommerce-checkout .woocommerce-info {
     font-style: normal !important;
    color: var(--accent-violet) !important;
    border-left: 4px solid var(--accent-violet);
    padding: 0.8em 1em 0.8em 1.2em; /* ← espace entre texte et bordure */
}

/* ===================================================== */
/* CHECKOUT – BOUTON VALIDER LA COMMANDE */
/* ===================================================== */

button#place_order {
    background-color: var(--accent-violet) !important;
    color: #ffffff !important;
    border: 2px solid var(--accent-violet) !important;

    font-size: 1.2em;
    line-height: 1.2;
    padding: 0.6em 1em;
    width: 100%;
    white-space: normal;
    cursor: pointer;

    box-shadow: none !important;
    outline: none !important;

    transition: background-color 0.25s ease, border-color 0.25s ease;
    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Hover / focus / clic */
button#place_order:hover,
button#place_order:focus,
button#place_order:active {
    background-color: var(--texte-principal) !important;
    border-color: var(--texte-principal) !important;
    color: #ffffff !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Sécurité mobile */
@media (max-width: 900px) {
    button#place_order:active {
        background-color: var(--texte-principal) !important;
        border-color: var(--texte-principal) !important;
    }
}


/* ===================================================== */
/* CHECKOUT – HARMONISATION PLACEHOLDERS */
/* ===================================================== */

/* Placeholders champs classiques */
.woocommerce-checkout input::placeholder,
.woocommerce-checkout textarea::placeholder {
    color: #999 !important;           /* gris neutre */
    font-size: 0.95rem !important;    /* taille cohérente */
    opacity: 1 !important;            /* évite le gris trop pâle */
}

/* Placeholders Select2 (Pays) */
.select2-container--default
.select2-selection--single
.select2-selection__placeholder {
    color: #999 !important;
    font-size: 0.95rem !important;
    opacity: 1 !important;
}

/* Mobile Safari / Chrome */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #999 !important;
    font-size: 0.95rem !important;
}

.woocommerce-checkout input:focus::placeholder,
.woocommerce-checkout textarea:focus::placeholder {
    color: #aaa !important;
}

@media (max-width: 768px) {

  /* Conteneur parent du bouton "Poursuivre les achats" */
  .woocommerce-cart .actions p.return-to-shop {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 !important;
      text-align: center !important;
  }

  /* Boutons empilés et pleine largeur */
  .woocommerce-cart .actions button[name="update_cart"],
  .woocommerce-cart .actions a.button.wc-backward {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      float: none !important;
      margin: 0.5em 0 !important;
      text-align: center !important;
  }

}



/* --- Header image + texte superposé --- */
.hero-image {
  position: relative;
  width: 100%;
  max-height: 450px; /* Hauteur pour desktop */
  overflow: hidden;
}

.hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hero-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  padding: 0 20px;
  background: rgba(0,0,0,0.3); /* optionnel : légère transparence pour lisibilité */
  border-radius: 8px;
}

.blog-h1 {
  font-size: 2.5rem;
  line-height: 1.2;
  margin: 0;
}

.blog-h1-rose {
  font-size: 1.8rem;
  color: #D47BA1;
}

.blog-hero-figcaption {
  margin-top: 10px;
  font-size: 1rem;
  color: #f5eaea;
}

/* --- Sommaire desktop --- */
.nav-sommaire {
  margin: 30px 0;
  padding: 20px;
  border-left: 4px solid #D4A5B9;
  background-color: #fdf5f9;
}

.nav-sommaire h2 {
  margin-top: 0;
}

.nav-sommaire ul {
  padding-left: 15px;
  list-style: none;
}

.nav-sommaire li {
  margin-bottom: 10px;
}

.nav-sommaire a {
  text-decoration: none;
  color: #6b2b5e;
  transition: color 0.3s;
}

.nav-sommaire a:hover {
  color: #D47BA1;
}

/* --- Responsive mobile --- */
@media (max-width: 768px) {

  /* Header */
  .hero-image {
    max-height: 280px;
  }
  .blog-h1 {
    font-size: 1.6rem;
  }
  .blog-h1-rose {
    font-size: 1.2rem;
  }
  .blog-hero-figcaption {
    font-size: 0.9rem;
  }

  /* Sommaire */
  .nav-sommaire {
    border-left: none;
    border-top: 2px solid #D4A5B9;
    padding: 10px;
  }
  .nav-sommaire ul {
    padding-left: 0;
  }
  .nav-sommaire li {
    margin-bottom: 6px;
  }
}

.blog-h3-titre-rubrique {
  font-size: 1.8rem !important;
}

@media (max-width: 768px) {
  /* Aligner le sommaire à gauche */
  .nav-sommaire {
    border-left: none !important;
    border-top: 2px solid #D4A5B9 !important;
    padding: 10px !important;
    text-align: left !important;
  }

  /* Supprimer les fleurs sur mobile */
  .nav-sommaire li::before {
    content: "" !important;
    margin-right: 0 !important;
  }

  .nav-sommaire li {
    margin-bottom: 6px !important;
  }
}

.collection-buttons {
  text-align: center;
}

.collection-buttons a.newsletter-popup-btn {
  display: inline-block !important;
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  margin: 0 6px;
}

.hero-btn-frontpage-zoom {
  display: inline-block;
  transition: transform 0.25s ease;
  transform-origin: center;
}

.hero-btn-frontpage-zoom:hover {
  transform: scale(1.05);
}

/* COPYRIGHT */
.footer-bottom {
  text-align: center;
  margin-top: 10px;
  font-size: 0.85rem;
  color: #666;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .footer-extra {
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }
}

.footer-section ul li a {
  display: flex;
  align-items: center;
  gap: 10px;
}

.footer-section ul li a i.fab {
  font-size: 1.2rem;
}

.footer-section ul li a:hover i {
  color: var(--accent-rose-vif);
  transform: scale(1.2);
  transition: all 0.2s ease;
}

.cgv-link {
  color: var(--accent-rose-vif);
}

.cgv-link:hover {
  text-decoration: none;
  color: var(--accent-violet);
}

.h1-mon-compte {
  font-family: var(--font-titres);
  font-size: 2.5rem;
  font-weight: bold;
  padding: 0 4px;
  color: var(--accent-rose-vif);
  text-align: center;
  padding-top: none;
  margin-bottom: 40px !important;
}

.blog-content {
  padding-top: 0px !important;
}

.p-mon-compte {
  font-family: var(--font-textes) !important;
  font-size: 1.25rem !important;
  color: var(--texte-principal) !important;
  text-align: justify !important;
  padding-top: none;
  margin-top: none;
}

.p-mon-compte strong {
  color: var(--accent-violet);
}

.account-dashboard {
  max-width: 1000px;
  margin: 2rem auto;
  padding: 1rem;

  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* CARDS */
.account-card {
  flex: 1;
  min-width: 180px;
  max-width: 220px;

  padding: 14px 16px;
  border-radius: 14px;

  background: #fff;
  text-decoration: none;
  text-align: center;

  color: var(--accent-violet);
  font-weight: bold;
  font-size: 1rem;
  font-family: var(--font-menu);

  border: none;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);

  transition: all 0.25s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* HOVER VIOLET */
.account-card:hover {
  background: var(--accent-violet);
  color: var(--fond-blanc);
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.15);
}

/* LOGOUT = nouvelle ligne + style différent */
.account-card.logout {
  flex-basis: 100%;
  max-width: 220px;
  margin: 10px auto 0 auto;
  font-size: 1rem;
  font-family: var(--font-menu);
  background: var(--accent-rose-vif);
  color: var(--fond-blanc);
  font-weight: bold;
  text-shadow: 1px 1px var(--texte-principal) ;
}

.account-card.logout:hover {
  background: var(--accent-violet);
  color: #fff;
}

.h2-mon-compte {
  font-size: 1.3rem;
  font-weight: bold;
  font-family: var(--font-textes);
  color: var(--texte-principal);
  margin-top: 20px;
}


.account-form {
  max-width: 600px;
  margin: 2rem auto;
  padding: 2rem;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  padding-bottom: 20px !important;
  margin-bottom: -30px !important;
}

/* grille */
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

/* champs pleine largeur */
.form-field.full {
  grid-column: span 2;
}

/* labels */
.form-field label {
  display: block;
  font-size: 0.9rem;
  margin-bottom: 6px;
  color: var(--texte-secondaire);
}

/* inputs */
.form-field input {
  width: 100%;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #eee;
  background: var(--accent-doux)!important;
  transition: 0.3s;
  font-size: 1rem;

}

.form-field input:focus {
  outline: none;
  border: 4px solid var(--fond-blanc);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(255, 105, 180, 0.15);
}

/* bouton */
.btn-save {
  margin-top: 20px;
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: 12px;
  background: var(--accent-rose-vif);
  color: #fff;
  font-weight: bold;
  cursor: pointer;
  transition: 0.3s;
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

.btn-save:hover {
  transform: translateY(-2px);
  opacity: 0.9;
}

/* responsive */
@media (max-width: 768px) {
  .form-grid {
    grid-template-columns: 1fr;
  }

  .form-field.full {
    grid-column: auto;
  }
}

.form-field label {
  display: block;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
  color: var(--accent-rose-vif);
  opacity: 0.85;
  text-transform: uppercase;
  font-family: var(--font-menu) !important;
}

.form-field input {
  color: var(--texte-principal) !important;
  font-weight: normal;
  font-family: var(--texte-principal);
}

.auth-footer {
  margin-top: 20px;
  text-align: center;
  font-size: 0.95rem;
}

.auth-switch {
  margin-top: 10px;
}

.auth-switch a {
  color: var(--accent-rose-vif);
  text-decoration: none;
  font-weight: 600;
}

.auth-switch a:hover {
  text-decoration: underline;
}

.bold {
  font-weight: bold;
  text-decoration: none;
}

body.woocommerce-account .account-form .form-field input {
  background: var(--accent-doux) !important;
  color: #333 !important;
  border: 1px solid rgba(0,0,0,0.1) !important;
  box-shadow: none !important;
}

/* focus propre */
body.woocommerce-account .account-form .form-field input:focus {
  background: #fff !important;
  border-color: var(--accent-rose-vif) !important;
  box-shadow: 0 0 0 4px rgba(200,120,160,0.15) !important;
}

.account-form input {
  transition: all 0.2s ease;
}

/* =========================
   INPUT RESET TOTAL (ATELIER SAKURA)
========================= */

.account-form input,
.account-form input[type="text"],
.account-form input[type="email"],
.account-form input[type="password"] {
    background: var(--accent-doux) !important;
    border: 2px solid transparent;
    color: var(--texte-principal) !important;
    padding: 12px 14px;
    border-radius: 10px;
    outline: none;
}

/* focus propre */
.account-form input:focus {
    border: 2px solid var(--accent-rose-vif) !important;
    background: white !important;
}

/* 🔥 SUPPRESSION DU JAUNE AUTOFILL CHROME */
.account-form input:-webkit-autofill,
.account-form input:-webkit-autofill:hover,
.account-form input:-webkit-autofill:focus,
.account-form input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px var(--accent-doux) inset !important;
    -webkit-text-fill-color: var(--texte-principal) !important;
    transition: background-color 9999s ease-in-out 0s;
}


/* =========================
   BOUTON LOGIN / FORM
========================= */

.account-form button,
.account-form .btn-save,
.account-form input[type="submit"] {

    background: var(--accent-violet) !important;
    color: #fff !important;

    border: none !important;
    border-radius: 12px;

    padding: 12px 22px;
    font-size: 1rem;
    font-weight: 600;

    cursor: pointer;

    box-shadow: 0 6px 18px rgba(0,0,0,0.06);

    transition: all 0.25s ease;

    display: inline-block;
    margin-top: 15px;
}

/* HOVER */
.account-form button:hover,
.account-form .btn-save:hover,
.account-form input[type="submit"]:hover {

    background: var(--accent-rose-vif) !important;
    color: #fff !important;

    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.12);
}

/* ACTIVE (clic) */
.account-form button:active,
.account-form .btn-save:active,
.account-form input[type="submit"]:active {

    background: var(--accent-rose-vif) !important;
    color: #fff !important;

    transform: translateY(0px);
    box-shadow: 0 5px 12px rgba(0,0,0,0.1);
}

/* FOCUS accessibilité */
.account-form button:focus,
.account-form .btn-save:focus,
.account-form input[type="submit"]:focus {

    outline: 2px solid var(--accent-violet);
    outline-offset: 3px;
}

.bold {
  text-decoration: none !important;
}

/* =========================
   MESSAGE ERREUR COMPTE
========================= */

.account-error {
    background-color: var(--fond-principal)!important;
    font-weight: bold;
    color: #C62828 !important;

    max-width: 500px;
    margin: 20px auto;

    padding: 12px 16px;
    border-radius: 10px;

    text-align: center;

    font-weight: 500;
    font-size: 1.2rem;
}

.account-message {
    max-width: 500px;
    margin: 0 auto 20px auto;
    text-align: center;
    padding: 12px 16px;
    border-radius: 10px;
}

.account-message {
    font-size: 1.3rem;   /* 👉 taille du texte */
    font-weight: 600;    /* 👉 plus lisible */
    padding: 14px 18px;  /* 👉 plus d’espace */
    border-radius: 12px;
    text-align: center;
    font-weight: bold;
    color: var(--accent-violet);
}

.input-error {
    border: 2px solid #b42318 !important;
    background: #fff5f5;
}

.error-msg {
    color: #b42318;
    font-size: 13px;
    margin-top: 5px;
}

.account-message.account-success {
    color: var(--texte-principal) !important;
    background-color: var(--accent-doux)!important;
    font-weight: bold;
    text-align: center;
    padding: 15px 20px;
    border-radius: 10px;
    margin-bottom: 20px;
}

.account-message.account-success .success-icon {
    color: var(--accent-violet) !important;
    background-color: var(--fond-principal)!important;
    border-radius: 50%;
    padding: 4px 8px;
    margin-right: 8px;
    font-size: 14px;
}


.same-address-wrapper {
    width: 100%;
    margin-bottom: 20px;
    text-align: left;
}

/* LABEL */
.same-address-checkbox {
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    gap: 10px;

    width: 100%;

    font-size: 16px;
    font-weight: 500;
    color: #333;

    text-align: left !important;

    cursor: pointer;
}

/* CHECKBOX */
.same-address-checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0;
    flex-shrink: 0;
}

/* TEXTE */
.same-address-checkbox span {
    text-align: left;
    line-height: 1.4;
}

.h2-mon-compte-pink{
  color: var(--accent-rose-vif);
}


.btn-mon-compte {
    display: block;
    padding: 12px 20px;
    background-color: var(--accent-rose-vif);
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
    font-weight: bold;
    width: fit-content;
    margin: 0 auto;
}

.btn-mon-compte:hover {
    background-color: var(--accent-violet);
    color: var(--fond-blanc);
    transform: translateY(-1px);
    font-weight: bold;
}

.header-search-form,
.ux-search-form {
    display: none;
}

.header-search-form.active,
.ux-search-form.active {
    display: block;
}

.search-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  z-index: 9999;
}

.search-overlay form,
.search-overlay .search-form,
.search-overlay .search-wrapper {
    margin-top: -140px; /* ajuste ici */
}


.search-overlay.active {
  opacity: 1;
  visibility: visible;
}

.search-box {
  background: white;
  padding: 30px;
  border-radius: 12px;
  width: 90%;
  max-width: 500px;
}

.search-box input {
  width: 100%;
  padding: 12px;
  border: 1px solid #ddd;
  margin-bottom: 10px;
}

.search-box button {
  width: 100%;
  padding: 12px;
  background: #A4D4C1;
  border: none;
  cursor: pointer;
}

.products {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

/* Carte générale */
.product-item {
    list-style: none;
    margin-bottom: 30px;
}

/* Label (Produit / Article) */
.search-label {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 8px;
    margin-bottom: 10px;
    border-radius: 4px;
    text-transform: uppercase;
}

.search-label {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 8px;
    margin-bottom: 10px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.search-label.produit {
    background: var(--accent-doux);
    color: #3b3b3b;
}

.search-label.article {
    background: var(--accent-secondaire);
    color: #2d3f38;
}
.product-item.article h2 {
    font-size: 16px;
    margin-bottom: 8px;
}

.product-item.article p {
    font-size: 14px;
    color: #666;
}

.search-label {
    font-weight: 500;
    letter-spacing: 0.06em;
    border: 1px solid rgba(0,0,0,0.06);
}

.form-field select {
    width: 100%;
    background: var(--accent-doux) !important;
    border: 1px solid #ddd;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 15px;
    color: var(--texte-principal) !important;
    appearance: none;
}

.checkbox-line {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    font-weight: 500;
    width: 100%;
    padding: 10px 0;
    margin-bottom: 30px;
}

.checkbox-line span {
    display: block;
    line-height: 1.4;
}


button[name="save_address"] {
    display: block;
    margin: auto;
    padding: 12px 28px;
    background: var(--accent-secondaire);
    border: none;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    transition: 0.2s;
}

button[name="save_address"]:hover {
    background-color: var(--accent-rose-vif) !important;
}

.form-grid button[name="save_address"],
.form-grid .checkbox-line {
    grid-column: 1 / -1;
}

.form-grid {
    align-items: start;
}

.form-grid h2 {
  font-family: var(--font-titres);
  color: var(--texte-principal);
}

input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--accent-secondaire);
    transition: transform 0.15s ease, filter 0.15s ease;
}

/* hover = rose doux */
input[type="checkbox"]:hover {
    transform: scale(1.10);
    filter: brightness(1.10);
}

/* focus = pas d'effet bleu ou sombre */
input[type="checkbox"]:focus {
    outline: none;
    box-shadow: none;
}

/* active (clic) = évite effet "foncé" */
input[type="checkbox"]:active {
    filter: brightness(1);
}

/* checked = stable (pas d'assombrissement navigateur) */
input[type="checkbox"]:checked {
    accent-color: var(--accent-doux);
    filter: none;
}


.woocommerce-message,
.woocommerce-error,
.woocommerce-info {

    background: var(--accent-doux) !important;

    border: none !important;
    box-shadow: none !important;

    font-style: normal !important;
    text-decoration: none !important;
    color: var(--texte-principal) !important;

    position: relative !important;
}

.woocommerce-message::before,
.woocommerce-message::after,
.woocommerce-error::before,
.woocommerce-error::after,
.woocommerce-info::before,
.woocommerce-info::after {

    display: none !important;
    content: none !important;
}

.buttons-row {
    display: flex !important;
    gap: 15px;
    flex-wrap: wrap;
}

/* CONTAINER GLOBAL */
.woocommerce-view-order .woocommerce {
    max-width: 1000px;
    margin: 0 auto 4rem;
    padding: 40px;
}

/* TYPO (adapte avec ta police) */
.woocommerce-view-order {
    font-family: var(--font-textes), sans-serif;
}

.woocommerce-view-order .order-status,
.woocommerce-view-order .order-date,
.woocommerce-view-order .order-number {
  background-color: var(--accent-doux);
}


.woocommerce-view-order address {
    font-style: normal;
}

.woocommerce-view-order .woocommerce-order {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.woocommerce-view-order table {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce-view-order th,
.woocommerce-view-order td {
    padding: 10px;
    border-bottom: 1px solid #eee;
}

.woocommerce-view-order h2 {
    font-size: 22px; /* ajuste selon ton design */
    color: var(--accent-rose-vif);
    margin-top: 40px; /* espace au-dessus */
    margin-bottom: 15px;
    font-family: var(--font-titres);
}

.woocommerce-view-order .woocommerce-column {
    padding: 20px;
    border: 1px solid #eee;
    border-radius: 10px;
}

.woocommerce-view-order .woocommerce-customer-details .woocommerce-column {
    flex: 1 1 48%;
    max-width: 48%;
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #eee;
}

@media (max-width: 768px) {
    .woocommerce-view-order .woocommerce-customer-details .woocommerce-column {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

.woocommerce-view-order .woocommerce-customer-details--email::before {
    content: "Email : ";
    font-weight: 600;
}

.woocommerce-view-order .woocommerce-customer-details--phone::before {
    content: "Téléphone : ";
    font-weight: 600;
}

.woocommerce-view-order {
    font-family: var(--texte-principal), sans-serif;
    font-size: 15px;
    line-height: 1.6;
    color: #333;
}

.woocommerce-view-order span,
.woocommerce-view-order p,
.woocommerce-view-order li,
.woocommerce-view-order td,
.woocommerce-view-order th,
.woocommerce-view-order address,
.woocommerce-view-order div {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.woocommerce-view-order address {
    font-size: 16px;
    line-height: 1.6;
}

.woocommerce-view-order .woocommerce-customer-details--email,
.woocommerce-view-order .woocommerce-customer-details--phone {
    font-size: 16px;
    opacity: 0.8; /* optionnel, effet plus discret */
}



/* Email + téléphone plus léger */
.woocommerce-view-order .woocommerce-customer-details--email,
.woocommerce-view-order .woocommerce-customer-details--phone {
    font-size: 13px;
    color: #777;
}

.woocommerce-view-order p {
    font-size: 20px;
    line-height: 1.6;
    font-family: var(--texte-principal);
}

.woocommerce-view-order address {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
}

.woocommerce-view-order .woocommerce-customer-details p {
    margin: 0;
}



.woocommerce-view-order .woocommerce-customer-details strong {
    font-weight: 500;
    color: #333;
}
.woocommerce-view-order .woocommerce-table {
    font-size: 14px;
}

.woocommerce-view-order .woocommerce-table th {
    font-size: 14px;
    font-weight: 600;
}

.woocommerce-view-order .woocommerce-table td {
    font-size: 14px;
}

.woocommerce-view-order .woocommerce-customer-details--email,
.woocommerce-view-order .woocommerce-customer-details--phone {
    font-size: 16px !important;
    color: var(--texte-principal) !important;
}

.woocommerce-view-order .woocommerce-customer-details address {
    margin-bottom: 20px !important;
    display: block !important;
}.woocommerce-view-order .woocommerce-customer-details address {
    margin-bottom: 15px !important;
}

.woocommerce-view-order .woocommerce-customer-details p {
    margin: 5px 0 !important;
}

/* CONTENEUR GLOBAL */
.woocommerce-order {
    max-width: 1000px;
    margin: 30px auto !important;
    padding: 0 20px;
}

.woocommerce-order h2 {
      font-size: 22px; /* ajuste selon ton design */
    color: var(--accent-rose-vif);
    margin-top: 40px; /* espace au-dessus */
    margin-bottom: 15px;
    font-family: var(--font-titres);
}

.woocommerce-order section {
    margin-bottom: 30px;
}

.woocommerce-order .woocommerce-notice {
    font-size: 18px;
    margin-bottom: 30px;
    color: #2e7d32; /* ou ton rose si tu préfères */
}

.woocommerce-order .woocommerce-notice {
    font-size: 18px;
    margin-bottom: 30px;
    color: #2e7d32; /* ou ton rose si tu préfères */
}

.woocommerce-order .woocommerce-order-overview {
    margin-bottom: 30px;
}

.woocommerce-order .woocommerce-order-overview li {
    margin-bottom: 8px;
    font-size: 14px;
}

.woocommerce-order {
    background: #fff;
    border-radius: 12px;
    padding: 30px;
}

/* Livraison */
.woocommerce-order small.shipped_via {
    font-size: 16px !important;
    font-family: var(--font-textes);
    color: var(--texte-principal);
}

/* Paiement */
.woocommerce-order .woocommerce-table tfoot tr:last-child td{
    font-size: 16px !important;
    font-family: var(--font-textes);
    color: var(--texte-principal);
}

/* Note client */
.woocommerce-order .woocommerce-table tfoot td{
    font-size: 16px !important;
    font-family: var(--font-textes);
    color: var(--texte-principal);
}

/* =========================================================
   BLOCS ADRESSES - PAGE ORDER RECEIVED
========================================================= */

/* CONTENEUR */
.woocommerce-order .woocommerce-customer-details {
    display: flex !important;
    flex-wrap: wrap;
}

/* BLOCS */
.woocommerce-order .woocommerce-customer-details .col-1,
.woocommerce-order .woocommerce-customer-details .col-2 {
    float: none !important;
    width: calc(50% - 15px) !important; /* 50% - moitié de l'espace */
    box-sizing: border-box;

    background: #fff;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.05);
}

/* ESPACE ENTRE LES BLOCS */
.woocommerce-order .woocommerce-customer-details .col-1 {
    margin-right: 30px;
}

@media (max-width: 768px) {
    .woocommerce-order .woocommerce-customer-details .col-1,
    .woocommerce-order .woocommerce-customer-details .col-2 {
        width: 100% !important;
        margin-right: 0;
    }
}

/* BLOCS ADRESSES */
.woocommerce-order address {
    font-style: normal !important;              /* ❌ enlève italique */
    font-family: "TonFontTexte", sans-serif;    /* ✏️ choisis ta police ici */
    font-size: 15px;
    line-height: 1.8;
}

/* EMAIL + TELEPHONE (même style que le reste) */
.woocommerce-order .woocommerce-customer-details--phone,
.woocommerce-order .woocommerce-customer-details--email {
    font-family: inherit !important;
    font-size: inherit !important;
    color: inherit !important;
    margin-top: 10px; /* espace au-dessus */
}

/* ADRESSE : pas d'italique + police harmonisée */
.woocommerce-order address {
    font-style: normal !important;
    font-family: "Poppins", sans-serif; /* change ici si besoin */
    font-size: 15px;
    line-height: 1.6;
}

/* TELEPHONE + EMAIL */
.woocommerce-order .woocommerce-customer-details--phone,
.woocommerce-order .woocommerce-customer-details--email {
    display: block;
    font-family: inherit;
    font-size: 14px;
    color: inherit;
    margin-top: 10px; /* 👈 ESPACE AVANT CHAQUE BLOC */
}

.woocommerce-order address p {
    margin: 8px 0 0;
}

/* TELEPHONE */
.woocommerce-order .woocommerce-customer-details--phone::before {
    content: "Téléphone : ";
    font-weight: 500;
}

/* EMAIL */
.woocommerce-order .woocommerce-customer-details--email::before {
    content: "Email : ";
    font-weight: 500;
}


/* =========================================================
   BLOCS ADRESSES - ORDER RECEIVED (ROBUSTE)
========================================================= */

/* CONTENEUR */
.woocommerce-order .woocommerce-customer-details .col2-set.addresses {
    font-size: 0; /* supprime l'espace inline-block */
}

/* BLOCS */
.woocommerce-order .woocommerce-customer-details .col-1,
.woocommerce-order .woocommerce-customer-details .col-2 {
    display: inline-block !important;
    vertical-align: top;

    width: 50% !important;

    box-sizing: border-box;

    font-size: 15px; /* remet texte normal */

    background: #fff;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.05);
}

/* espace entre les 2 */
.woocommerce-order .woocommerce-customer-details .col-1 {
    padding-right: 15px;
}

.woocommerce-order .woocommerce-customer-details .col-2 {
    padding-left: 15px;
}

/* MOBILE */
@media (max-width: 768px) {
    .woocommerce-order .woocommerce-customer-details .col-1,
    .woocommerce-order .woocommerce-customer-details .col-2 {
        display: block !important;
        width: 100% !important;
        padding: 25px !important;
    }
}


/* =========================================================
   PAGE "ORDER RECEIVED" - MESSAGE + OVERVIEW
========================================================= */

/* MESSAGE "Merci..." */
.woocommerce-order .woocommerce-thankyou-order-received {
    background: #fff;
    padding: 20px 25px;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.05);

    font-size: 16px;
    font-weight: 500;

    margin-bottom: 20px;
}

/* CONTENEUR INFOS COMMANDE */
.woocommerce-order .woocommerce-order-overview {
    background: #fff;
    padding: 20px 25px;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.05);

    list-style: none;
    margin: 0 0 30px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

/* CHAQUE ITEM */
.woocommerce-order .woocommerce-order-overview li {
    flex: 1 1 200px;
    font-size: 14px;
    line-height: 1.5;
}

/* TITRES DANS LES ITEMS (commande, date, statut, etc.) */
.woocommerce-order .woocommerce-order-overview li strong {
    display: block;
    font-weight: 600;
    margin-bottom: 4px;
}

.woocommerce-order {
    font-family: "Poppins", sans-serif;
}



/* SUPPRESSION FLATSOME BOX */
.woocommerce-order .is-well.col-inner.entry-content {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border: none !important;
}

/* TITRE */
.thankyou-title {
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 30px 0;
    text-align: left;
    font-family: var(--font-textes);
    color: var(--accent-violet);

}

/* CACHE ANCIEN MESSAGE WOOCOMMERCE */
.woocommerce-thankyou-order-received {
    display: none !important;
}


.thankyou-title span {
    background-color: var(--accent-doux);
    padding: 3px 8px;
    border-radius: 6px;
    display: inline-block;
}

.woocommerce-price-suffix {
  color: var(--texte-principal);
  font-weight: normal;
}

form.cart > .ux-quantity, form.cart > .single_add_to_cart_button {
  background-color: var(--accent-doux) !important;
}


/* BOUTONS + ET - */
.ux-quantity__button--plus,
.ux-quantity__button--minus {
    background-color: var(--accent-doux) !important;
    border: none !important;
}

/* ICÔNE + / - (Flatsome utilise souvent pseudo-element) */
.ux-quantity__button--plus:before,
.ux-quantity__button--minus:before {
    background: transparent !important;
    color: #000 !important;
}


/* ===== BOUTONS QUANTITÉ (INPUT FLATSOME) ===== */

input.ux-quantity__button {
    background-color: var(--accent-doux) !important;
    border: none !important;
    box-shadow: none !important;

    color: #000 !important;
}



/* ===== QUANTITÉ FLATSOME (FORCE ABSOLUE) ===== */

input.ux-quantity__button,
input.minus.is-form,
input.plus.is-form {
    background-color: var(--accent-doux) !important;
    background: var(--accent-doux) !important;
    border: none !important;
    box-shadow: none !important;
}

/* ciblage ULTRA SPÉCIFIQUE pour le + */
input.ux-quantity__button--plus.button.plus.is-form {
    background-color: var(--accent-doux) !important;
    background: var(--accent-doux) !important;
}


/* taille */
input.ux-quantity__button {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    font-weight: 600;
}

input.ux-quantity__button:hover,
input.plus.is-form:hover,
input.minus.is-form:hover,
input.ux-quantity__button--plus:hover,
input.ux-quantity__button--minus:hover {
    background: var(--accent-doux) !important;
    background-color: var(--accent-doux) !important;
    opacity: 1 !important;
}

form.cart .single_add_to_cart_button {
  border: none !important;
}


form.cart .single_add_to_cart_button:hover {
  color: var(--fond-blanc) !important;
  background-color: var(--accent-violet) !important;
}

.flickity-button {
    background: var(--texte-principal) !important;
}

#review_form .has-border {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

#review_form #reply-title {
    font-size: 24px !important;
    font-weight: 500 !important;
    line-height: 1.5;
    font-family: var(--font-titres) !important;
    color: var(--texte-principal) !important;
    margin-bottom: 30px !important
}

#review_form textarea {
    background: white !important;
    /*border: 1px solid #ddd !important;*/
    box-shadow: none !important;

    font-size: 14px !important;
    font-weight: 400 !important;

    padding: 12px;
}


#review_form label {
    font-size: 16px !important;
    font-weight: 400 !important;
    font-family: var(--font-textes);
    color: var(--texte-principal);
}

#review_form .form-submit {
    text-align: center;
}

#review_form {
    font-size: 14px;
    color: inherit;
}

#review_form #reply-title {
    margin-top: 30px !important;
    margin-bottom: 15px !important;
}


/* RESET COMPLET DU BOUTON */
#review_form button,
#review_form input[type="submit"],
#review_form .button {
    all: unset; /* supprime les styles Flatsome conflictuels */
    display: inline-block;

    padding: 10px 18px;
    background: var(--accent-doux);
    color: #fff;
    border-radius: 8px;
    cursor: pointer;

    transition: all 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

/* HOVER DOUX */
#review_form button:hover,
#review_form input[type="submit"]:hover,
#review_form .button:hover {
    transform: translateY(-2px);
    background-color: var(--accent-rose-vif)!important;
}


#review_form textarea {
    color: var(--texte-principal) !important;
    background: #fff !important;
    border: 1px solid #e6e6e6 !important;
    border-radius: 8px;
    font-family: var(--font-textes) !important;
    caret-color: var(--accent-doux);
}


#review_form textarea,
#review_form .comment-form-comment textarea,
#review_form #comment {
    color: var(--texte-principal) !important;
    background: #fff !important;
    border: 1px solid #e6e6e6 !important;
    border-radius: 8px;

    font-family: var(--font-textes) !important;
    font-size: 18px !important;
    line-height: 1.6 !important;

    caret-color: var(--accent-doux);
}


/* test */

.single-product form.variations_form.cart {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}


.single-product form.variations_form .variations {
    width: 100%;
    margin-bottom: 10px;
}



.single-product form.variations_form .quantity {
    flex: 0 0 auto;
}

.single-product form.variations_form .single_add_to_cart_button {
    flex: 1 1 200px;
}

.single-product .single_add_to_cart_button {
    width: 100%;
    margin-top: 10px;
}



.single-product:not(.product-type-variable) .single_add_to_cart_button {
    width: auto !important;
    display: inline-flex;
    padding: 12px 18px;
    min-width: unset !important;
}


.single-product.product-type-variable .single_add_to_cart_button {
    width: auto !important;
    display: inline-flex;
    padding: 12px 18px;
}

.button, button, fieldset, input, select, textarea {
  background-color: var(--accent-doux) !important;
  color: var(--texte-principal) !important;
}


.single-product table.variations tr {
    display: flex;
    flex-direction: column;
    margin-bottom: 12px;
}

.single-product table.variations th.label {
    display: block;
    text-align: left;
    margin-bottom: 6px;
}

.single-product table.variations td.value {
    width: 100%;
}


.single-product .ux-quantity,
.single-product .buttons_added {
    background: #fff !important;
    box-shadow: none !important;
    border: 1px solid #e6e6e6 !important;
    border-radius: 8px;
}

/* SUPPRESSION DU VIOLET SUR FOCUS */
.single-product input:focus,
.single-product select:focus,
.single-product .ux-quantity input:focus {
    outline: none !important;
    box-shadow: none !important;
    border-color: #ddd !important;
}


.single_add_to_cart_button.disabled {
    opacity: 1 !important;
    background: var(--accent-doux) !important;
    color: #fff !important;
}


.single-product table.variations th.label label {
    font-size: 18px !important;
    font-weight: 600 !important;
    display: block !important;
}


/* =========================================================
   VARIATIONS + QUANTITÉ (FLATSOME CLEAN FIX)
========================================================= */

/* CONTENEUR VARIATIONS */
.single-product.product-type-variable .woocommerce-variation-add-to-cart {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* SUPPRESSION BORDURES GLOBALES */
.single-product .ux-quantity,
.single-product .buttons_added,
.single-product .woocommerce-variation-add-to-cart {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* =========================================================
   QUANTITÉ : + / - PARFAITEMENT IDENTIQUES
========================================================= */

.single-product .ux-quantity__button {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;

    box-sizing: border-box !important;

    font-size: 16px !important;
    line-height: 1 !important;

    font-family: inherit !important;

    background: var(--accent-doux) !important;
    border: none !important;
}

/* UNIFORMISATION STRICTE + ET - */
.single-product .ux-quantity__button--plus,
.single-product .ux-quantity__button--minus {
    font-weight: 400 !important;
}

/* =========================================================
   HOVER FLUIDE
========================================================= */

.single-product .ux-quantity__button {
    transition: all 0.3s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.single-product .ux-quantity__button:hover {
    transform: translateY(-1px);
    opacity: 0.9;
}

/* =========================================================
   BOUTON AJOUT AU PANIER
========================================================= */


.single-product.product-type-variable .woocommerce-variation-add-to-cart {
    display: flex !important;
    align-items: stretch !important;
    gap: 12px;
    flex-wrap: wrap;
}


.single-product .ux-quantity {
    display: flex !important;
    align-items: stretch !important;
    height: 38px;
}


.single-product .ux-quantity__button {
    width: 38px !important;
    height: 38px !important;

    min-width: 38px !important;
    max-width: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;

    font-size: 16px !important;
    line-height: 1 !important;

    box-sizing: border-box !important;
}


.single-product .single_add_to_cart_button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #111 !important; /* <-- ton noir */
    background: var(--accent-doux) !important;

    line-height: 1 !important;
    text-align: center !important;

    flex: 1;
    min-height: 38px;
}


.single-product .single_add_to_cart_button {
    align-self: stretch;
}


.single-product .ux-quantity__button {
    width: 38px !important;
    height: 38px !important;

    font-size: 15px !important;
    font-family: system-ui, sans-serif !important;
    font-weight: 400 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    line-height: 1 !important;
}


input.ux-quantity__button--plus.button.plus.is-form {
  font-size: 0.9rem !important;
}

.woocommerce-variation-add-to-cart {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ux-quantity {
  display: flex;
  align-items: center;
  height: 42px; /* ajuste selon ton bouton ajouter au panier */
}

.woocommerce-variation-add-to-cart {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px;
}

.ux-quantity,
.single_add_to_cart_button {
  height: 42px;
}

.single-product form.variations_form .quantity {
  padding: 0px !important;
}


.single-product form.variations_form .quantity {
  margin-right: 2px !important;
}

body:not(.has-nuance) .ux-quantity input.qty {
  font-size: 0.9rem !important;
}
.ux-quantity {
  display: flex;
  align-items: stretch;
  height: 42px; /* ajuste si ton bouton ATC est plus haut */
}

.ux-quantity input.qty {
  height: 100% !important;
  line-height: 42px !important;
  text-align: center;
}

form.cart {
  display: flex !important;
  align-items: center !important;
  gap: 10px;
  flex-wrap: wrap;
}

form.cart > .ux-quantity,
form.cart > .single_add_to_cart_button {
  height: 42px !important;
  display: flex !important;
  align-items: center !important;
}

.ux-quantity input.qty {
  height: 100% !important;
  text-align: center !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

.woocommerce-message,
.message-container.success-color {
  border: none !important;
  border-radius: 0 !important;
  background-color: var(--accent-doux) !important;
  padding: 12px 16px !important;
  max-width: 600px;
  margin: 10px auto !important;
}

.woocommerce-message {
  display: flex;
  align-items: center;
  gap: 10px;
}


.woocommerce-message .button.wc-forward {
  background-color: var(--accent-violet) !important;
  border: none !important;
  color: var(--fond-blanc) !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  transition: all 0.2s ease;
}

.woocommerce-message .button.wc-forward:hover {
  background-color: var(--texte-principal) !important;
  color: var(--fond-blanc) !important;
}

.woocommerce-message .button.wc-forward:hover {
  color: var(--fond-blanc) !important;
}

.woocommerce-message .button.wc-forward {
  transition: background-color 0.25s ease, color 0.25s ease;
}

/* AJUSTEMENTS RESPONSIVE POUR MOBILE FOOTER */

.footer-section,
.footer-section ul,
.footer-section li,
.footer-section a,
.footer-all-articles-link {
  text-align: left !important;
}

.footer-section ul {
  padding-left: 0 !important;
  margin-left: 0 !important;
  list-style: none !important;
}

@media (max-width: 849px) {
  .footer-grid,
  .footer-section {
    text-align: left !important;
    align-items: flex-start !important;
  }
}

.footer-section li {
  margin-bottom: 8px;
}

.cgv-p,
.cgv-li {
  font-size: 1.30em;
  color: var(--texte-principal);
  line-height: 1.6;
  font-family: var(--font-textes);
}

.cgv-content ul {
  padding-left: 20px;
  margin-bottom: 2rem;
}

@media (max-width: 849px) {
  .cgv-p,
  .cgv-li {
    font-size: 1rem !important;
    line-height: 1.6;
  }
}

.cgv-p,
.cgv-li {
  font-size: 1rem;
}


/* remaniement responsive titre pages obligatoires */
.cgv-h1 {
  font-family: var(--font-titres);
  font-size: 2.7rem;
  margin-bottom: 1.5rem;
  color: var(--accent-violet);
  text-align: center;
  margin-top: 0;
}

/* Mobile portrait + paysage */
@media (max-width: 849px) {
  .cgv-h1 {
    font-size: 1.9rem;
    line-height: 1.3;
  }
}

/* Tablette portrait uniquement */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .cgv-h1 {
    font-size: 2.1rem;
    line-height: 1.3;
  }
}

/* responsive liens dans les pages légales */

/* Mobile portrait + paysage */
@media (max-width: 849px) {
  .blog-sommaire-lien {
    font-size: 0.95rem;
    padding-left: 1.5rem;
    line-height: 1.6;
  }

  .blog-sommaire-lien::before {
    font-size: 0.95rem;
  }
}

/* Tablette portrait uniquement */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .blog-sommaire-lien {
    font-size: 1rem;
    padding-left: 1.6rem;
    line-height: 1.6;
  }

  .blog-sommaire-lien::before {
    font-size: 1rem;
  }
}


/* RESPONSIVE taille reponse li faq */
@media (min-width: 768px) and (max-width: 899px) {
  .question, .answer, li.answer-puces {
    font-size: 1.20rem;
  }
}

@media (min-width: 900px) and (max-width: 1024px) {
  .question, .answer, li.answer-puces {
    font-size: 1.2rem !important;
  }
}


/* ajustement image washi sur page accueil pour tablette RESPONSIVE */

/* Tablette portrait uniquement */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .focus-washi-content {
    flex-direction: column;
    text-align: center;
  }

  .focus-washi-image img {
    max-width: 75%;
    margin: 0 auto;
  }
}


@media (max-width: 849px) and (orientation: portrait) {
  .p-header {
    font-size: 1.10rem !important;
    line-height: 1.6;
  }
}

/* Mobile portrait uniquement */
@media (max-width: 849px) and (orientation: portrait) {
  .hero-btn-purple.hero-btn-frontpage-zoom {
    min-height: 52px;
    padding: 12px 20px;
    font-size: 0.95rem;
    line-height: 1.4;
  }
}


/* FIN */

section.new-collection {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

section.new-collection .container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}


/* souci de header page Blog */

/* Page blog uniquement */
.hero-blog .hero-divider {
  margin-top: 0.8rem !important;
  margin-bottom: 0.8rem !important;
}

/* Réduction des marges du titre */
.hero-blog .hero-blog-title {
  margin-bottom: 0.5rem !important;
}

/* Réduction des marges du sous-titre */
.hero-blog .hero-blog-subtitle {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Mobile portrait + paysage */
@media (max-width: 849px) {
  .hero-blog .hero-divider {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  .hero-blog .hero-blog-title {
    margin-bottom: 0.3rem !important;
  }
}


/* RESPONSIVE page boucles d'oreilles */

/* Réduire UNIQUEMENT l'espace haut / bas en responsive */

@media (max-width: 849px) {
  .shop-container .hero-blog {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: auto !important;
  }

  .shop-container .hero-blog-overlay {
    padding-top: 0.8rem !important;
    padding-bottom: 0.8rem !important;
    padding-left: 1.2rem !important;
    padding-right: 1.2rem !important;
  }
}

/* Le vrai problème vient souvent du h1 + p + section qui gardent des marges par défaut */

@media (max-width: 849px) {
  .shop-container .hero-blog {
    margin: 0 !important;
    padding: 0 !important;
    min-height: auto !important;
  }

  .shop-container .hero-blog-overlay {
    padding: 0.8rem 1.2rem !important;
    margin: 0 !important;
  }

  /* supprime l'espace au-dessus de "Nos Boucles..." */
  .shop-container .hero-blog-title {
    margin-top: 0 !important;
    margin-bottom: 0.4rem !important;
    padding-top: 0 !important;
  }

  /* réduit l'espace sous le divider */
  .shop-container .hero-divider {
    margin: 0.4rem auto !important;
  }

  /* supprime l'espace sous "japonais" */
  .shop-container .hero-blog-subtitle {
    margin-top: 0.4rem !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* parfois Flatsome ajoute un p par défaut */
  .shop-container .hero-blog p {
    margin-bottom: 0 !important;
  }
}

@media (max-width: 1024px) {

  .shop-container .hero-blog {
    position: relative;
    min-height: 280px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
  }

  .shop-container .hero-blog-overlay {
    position: absolute !important;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    width: 100%;
    height: 100%;

    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    padding: 1rem 1.2rem !important;
    margin: 0 !important;

    background: rgba(0, 0, 0, 0.4) !important;
  }

  .shop-container .hero-blog-title {
    margin: 0 0 0.5rem 0 !important;
    padding: 0 !important;
  }

  .shop-container .hero-divider {
    margin: 0.5rem auto !important;
  }

  .shop-container .hero-blog-subtitle {
    margin: 0.5rem 0 0 0 !important;
    padding: 0 !important;
    text-align: center;
  }

}


/* Téléphones uniquement */
@media (max-width: 849px) {

  .shop-container .hero-blog {
    min-height: 320px !important;
  }

  .shop-container .hero-blog-overlay {
    padding: 1.4rem 1.2rem !important;
    justify-content: center !important;
  }

  /* H1 bien distinct du paragraphe */
  .shop-container .hero-blog-title {
    font-size: 1.9rem !important;
    line-height: 1.25 !important;
    margin: 0 0 0.6rem 0 !important;
    padding: 0 !important;
  }

  /* Divider toujours visible */
  .shop-container .hero-divider {
    display: block !important;
    width: 55px !important;
    height: 2px !important;
    min-height: 2px !important;
    margin: 0.4rem auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: var(--fond-blanc) !important;
  }

  /* Paragraphe plus petit que le H1 */
  .shop-container .hero-blog-subtitle {
    font-size: 1rem !important;
    line-height: 1.5 !important;
    margin: 0.4rem 0 0 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

}

@media (max-width: 430px) {
  .shop-container .hero-blog-subtitle {
    font-size: 1.09rem !important;
  }
}

@media (min-width: 768px) and (max-width: 1366px) {
  .shop-container .hero-blog-subtitle {
    font-size: 1.25rem !important;
    line-height: 1.5 !important;
  }
}

/* FIN */
.blog-intro {
  max-width: 1000px;
  margin: 0 auto 4rem auto;
}
/**/


/* section marges insuffisantes dans le doc boucles d'oreilles RESPONSIVE */
@media (min-width: 768px) and (max-width: 1366px) {

  .blog-content .blog-intro {
    max-width: 1000px !important;
    margin: 0 auto 4rem auto !important;

    padding-left: 2rem !important;
    padding-right: 2rem !important;

    box-sizing: border-box !important;
  }

  .blog-content .blog-p {
    font-size: 1.1rem !important;
    line-height: 1.7 !important;
  }
}

/* Responsive images sur Les Boucles d'oreilles */

/* Tablettes : image plus petite sans casser l’alignement du texte */

@media (min-width: 744px) and (max-width: 1024px) {

  /* on réduit toute la carte, pas seulement l'image */
  .products-grid .product-small .col-inner {
    max-width: 65% !important;
    margin: 0 auto !important;
  }

  /* image responsive */
  .products-grid .product-small .box-image img {
    width: 100% !important;
    height: auto !important;
    display: block;
  }

  /* on annule les anciens décalages éventuels */
  .products-grid .product-small .box-text,
  .products-grid .product-small .title-wrapper,
  .products-grid .product-small .price-wrapper {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

}

/* iPad Pro 11" : images un peu plus grandes */

@media (min-width: 834px) and (max-width: 1194px) {

  .products-grid .product-small .col-inner {
    max-width: 82% !important;
    margin: 0 auto !important;
  }

  .products-grid .product-small .box-image img {
    width: 100% !important;
    height: auto !important;
    display: block;
  }

}


/* Galaxy Tab S9 + Samsung mobiles : images encore plus petites */

@media (max-width: 1024px) {

  .products-grid .product-small .col-inner {
    max-width: 54% !important;
    margin: 0 auto !important;
  }

  .products-grid .product-small .box-image img {
    width: 100% !important;
    height: auto !important;
    display: block;
  }

}

/* Galaxy Tab S9 : plus petit */
@media (min-width: 744px) and (max-width: 1024px) {

  .products-grid .product-small .col-inner {
    max-width: 52% !important;
    margin: 0 auto !important;
  }

}

/* Galaxy S10 / S10+ / S25 : un peu plus grand */
@media (max-width: 430px) {

  .products-grid .product-small .col-inner {
    max-width: 75% !important;
    margin: 0 auto !important;
  }

}

/* iPad 10th gen portrait : image un peu plus grande */

@media (min-width: 810px) and (max-width: 834px) and (orientation: portrait) {

  .products-grid .product-small .col-inner {
    max-width: 78% !important;
    margin: 0 auto !important;
  }

}


/* 404 ET RESPONSIVE 404 */
/* Desktop (inchangé) */
.hero-blog {
  height: 50vh;
}

/* Tablettes */
@media (max-width: 1024px) {
  .hero-blog {
    height: 30vh !important;
  }
}

/* Téléphones */
@media (max-width: 480px) {
  .hero-blog {
    height: 22vh !important;
  }
}

.hero-blog {
  min-height: 220px;
  height: 50vh;
  max-height: 420px;
}

/* CART */

.woocommerce-cart-form__contents th.product-name,
.woocommerce-cart-form__contents th.product-price,
.woocommerce-cart-form__contents th.product-quantity,
.woocommerce-cart-form__contents th.product-subtotal {
  font-family: var(--font-titres) !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  color: var(--texte-principal) !important;
}

.woocommerce-cart-form__contents td,
.woocommerce-cart-form__contents td a,
.woocommerce-cart-form__contents td span {
  font-family: var(--font-textes) !important;
  color: var(--texte-principal) !important;
}


.variation dt,
.variation dd {
  display: inline-block;
  vertical-align: top;
  margin: 0;
}

.variation {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 0.5rem;
  row-gap: 0.3rem;
}

.variation dt {
  font-weight: 600;
  color: var(--texte-principal);
}

.variation dd {
  margin: 0;
  color: var(--texte-principal);
}


.woocommerce-cart table.shop_table {
  font-family: var(--font-textes) !important;
  color: var(--texte-principal) !important;
}

.woocommerce-cart table.shop_table td,
.woocommerce-cart table.shop_table th,
.woocommerce-cart table.shop_table p,
.woocommerce-cart table.shop_table span {
  font-family: var(--font-textes) !important;
  color: var(--texte-principal) !important;
}

.woocommerce-cart table.shop_table td a {
  color: var(--accent-rose-vif) !important;
  font-weight: 700 !important;
  text-decoration: none;
}

.woocommerce-cart table.shop_table td a:hover {
  opacity: 0.8;
}

.woocommerce-cart table.shop_table th {
  font-family: var(--font-titres) !important;
}

.woocommerce-cart .variation dd p {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.4;
}

.woocommerce-cart .variation dt,
.woocommerce-cart .variation dd {
  margin: 0 !important;
}

.woocommerce-cart .variation {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 0.5rem;
  row-gap: 0.3rem;
  align-items: start;
}

.woocommerce-cart .variation dd p {
  display: inline;
}

.woocommerce-cart .variation dt,
.woocommerce-cart .variation dd,
.woocommerce-cart .variation dd p {
  font-family: var(--font-textes) !important;
  font-size: 0.95rem !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

.woocommerce-cart .variation dt,
.woocommerce-cart .variation dd,
.woocommerce-cart .variation dd p {
  font-family: var(--font-textes) !important;
  font-size: 0.95rem !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

.woocommerce-cart .variation dt {
  font-weight: 600;
}

.woocommerce-cart .variation dd p {
  font-weight: 400;
}

.woocommerce-cart .variation dt,
.woocommerce-cart .variation dd p {
  line-height: 1.6 !important;
}

.woocommerce-cart .variation {
  row-gap: 0.9rem;
  column-gap: 0.8rem;
}

.woocommerce-cart .variation dt,
.woocommerce-cart .variation dd p {
  line-height: 1.7;
}

/* TRANSFORMATION DESIGN CART GENERALE TOUT EN VERTICAL CENTRE */
.woocommerce-cart .shop_table {
  width: 100% !important;
}

.woocommerce-cart .cart-collaterals,
.woocommerce-cart .woocommerce-cart-form {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

.woocommerce-cart .shop_table,
.woocommerce-cart .cart-collaterals,
.woocommerce-cart .woocommerce-cart-form {
  display: block !important;
}

.woocommerce-cart .cart-wrapper {
  max-width: 1000px;
  margin: 0 auto;
}

.woocommerce-cart .col.large-7,
.woocommerce-cart .col.large-5 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

.woocommerce-cart .cart-wrapper,
.woocommerce-cart .cart-collaterals {
  margin-top: 2rem;
}

.cart_totals {
  max-width: 500px;
  margin: 2rem auto;
  padding: 1.5rem;
}

/* AJOUT D'UN TITRE AU PANIER */
.cart-title {
  font-family: var(--font-titres);
  color: var(--accent-rose-vif);
  text-align: left;
  font-size: 2.4rem;
  margin: 1.5rem 0 2rem;
  margin-top: 35px;
}

/* RESET GLOBAL STEP QTY FLATSOME */
.ux-quantity,
.quantity.buttons_added {
  border: 1px solid rgba(0,0,0,0.12) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
}

.ux-quantity__button,
.quantity.buttons_added input[type="button"] {
  /*background: #fff !important;*/
  border: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 38px;
  height: 38px;
  font-size: 1.1rem;
  color: var(--texte-principal);
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
}

.quantity input.qty {
  border: none !important;
  background: transparent !important;
  text-align: center;
  width: 45px;
  font-family: var(--font-textes);
  color: var(--texte-principal);
  outline: none !important;
  box-shadow: none !important;
}

.is-form {
  background: transparent !important;
  box-shadow: none !important;
}

.is-form {
  background: transparent !important;
  box-shadow: none !important;
}

.ux-quantity__button {
  background: #fff !important;
  border: none !important;
  box-shadow: none !important;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
}

.ux-quantity__button--minus,
.ux-quantity__button--plus {
  color: var(--accent-doux) !important;
}


.ux-quantity__button {
    transition: all 0.2s ease;
}

.ux-quantity__button:hover {
    color: var(--accent-doux);
    transform: scale(1.05);
}





/* CART BUTTONS */

.continue-shopping a.button-continue-shopping,
.continue-shopping a.button-continue-shopping:visited {
    transition: all 0.2s ease !important;
    font-weight: bold !important;
    background-color: var(--accent-doux) !important;
    color: var(--texte-principal) !important;
    border: none !important;
}

.continue-shopping a.button-continue-shopping:hover {
    background-color: var(--accent-violet) !important;
    color: var(--fond-blanc) !important;
    transform: scale(1.03);
}

.continue-shopping .button {
    transition: all 0.2s ease;
}

.continue-shopping .button:hover {
    transform: scale(1.03);
}


.continue-shopping .button-continue-shopping span {
    display: none !important;
}

.continue-shopping a.button-continue-shopping::before,
.continue-shopping a.button-continue-shopping::after {
    display: none !important;
}

.continue-shopping a.button-continue-shopping {
    background-color: var(--accent-doux) !important;
    color: var(--texte-principal) !important;
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease !important;
    position: relative;
    overflow: hidden;
}

.continue-shopping a.button-continue-shopping:hover {
    background-color: var(--accent-violet) !important;
    color: var(--fond-blanc) !important;
    transform: scale(1.03);
}

.continue-shopping a.button-continue-shopping::before,
.continue-shopping a.button-continue-shopping::after {
    display: none !important;
    content: none !important;
}

.continue-shopping a.button-continue-shopping {
    transition: none !important;
}

.continue-shopping a.button-continue-shopping {
    background-color: var(--accent-doux) !important;
    color: var(--texte-principal) !important;
    font-weight: bold !important;
}

.continue-shopping a.button-continue-shopping:hover {
    background-color: var(--accent-violet) !important;
    color: var(--fond-blanc) !important;
    transform: scale(1.03);
}

.woocommerce-cart button[name="update_cart"] {
  background-color: var(--texte-principal) !important;
  color: var(--fond-blanc) !important;
  font-weight: bold !important;
}

.woocommerce-cart button[name="update_cart"]:hover {
  background-color: var(--accent-rose) !important;
  color: var(--texte-principal) !important;
  font-weight: bold !important;
}

.woocommerce-cart .checkout-button.wc-forward {
background-color: var(--accent-doux) !important;
  color: var(--texte-principal) !important;
  border: none !important;
}

.woocommerce-cart .checkout-button.wc-forward:hover {
    background-color: var(--accent-violet) !important;
    color: var(--fond-blanc) !important;
    transform: scale(1.03);
}


.cross-sells .products.row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 18px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Carte produit */
.cross-sells .product-small {
    width: 100% !important;
    max-width: none !important;
    padding: 10px !important;
    box-sizing: border-box !important;
}

/* Reset Flatsome interne */
.cross-sells .col-inner {
    padding: 0 !important;
    max-width: none !important;
}

/* IMAGE = 2x plus petite */
.cross-sells .box-image {
    width: 60% !important;   /* clé du rendu plus petit */
    margin: 0 auto !important;
}

.cross-sells .box-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
}

/* TITRE lisible */
.cross-sells .product-title {
    font-size: 15px !important;
    line-height: 1.4 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-align: center;
}

/* PRIX propre */
.cross-sells .price {
    white-space: nowrap !important;
    text-align: center;
}

/* Hover léger */
.cross-sells .product-small {
    transition: transform 0.2s ease !important;
}

.cross-sells .product-small:hover {
    transform: scale(1.02);
}

.cross-sells .products.row {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 18px !important;
    margin: 0 !important;
}

/* Reset Flatsome */
.cross-sells .product-small,
.cross-sells .col-inner,
.cross-sells .product-small .box {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Structure propre verticale */
.cross-sells .product-small .box {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

/* IMAGE centrée */
.cross-sells .box-image {
    width: 60% !important;
    margin: 0 auto !important;
}

.cross-sells .box-image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: contain !important;
}

/* 🔥 TEXTE TITRE centré */
.cross-sells .product-title {
    text-align: center !important;
}

/* 🔥 PRIX centré */
.cross-sells .price {
    text-align: center !important;
}

/* 🔥 IMPORTANT : LE P (corrige ton problème) */
.cross-sells p {
    text-align: left !important;   /* ou initial si tu veux reset complet */
    align-self: flex-start !important;
    width: 100% !important;
}

/* Hover propre */
.cross-sells .product-small {
    transition: transform 0.2s ease !important;
}

.cross-sells .product-small:hover {
    transform: scale(1.02);
}

.cross-sells p.category.uppercase.is-smaller.no-text-overflow.product-cat.op-8 {
    text-align: center !important;
    width: 100% !important;
    display: block !important;
    margin: 0 auto !important;
}

/* Bloc Code promo centré + plus petit */
.woocommerce-cart .coupon {
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px;
}

/* Titre "Code promo" */
.woocommerce-cart .coupon .widget-title {
    font-size: 18px !important; /* diminue la taille */
    margin-bottom: 8px !important;
    text-align: center !important;
}

/* Champ input */
.woocommerce-cart .coupon .input-text {
    max-width: 280px !important;
    width: 100% !important;
    text-align: center !important;
}

/* Bouton */
.woocommerce-cart .coupon .button {
    max-width: 280px !important;
    width: 100% !important;
    font-size: 14px !important; /* texte plus petit */
    text-align: center !important;
}

.cart-sidebar .widget-title {
  border-bottom: none !important;
}

input#coupon_code::placeholder {
  color: var(--texte-principal) !important;
}

/* Supprime l’espace au-dessus du bloc cart-collaterals */
.woocommerce-cart .cart-collaterals {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Aligner le bloc Total panier à gauche */
.woocommerce-cart .cart-sidebar,
.woocommerce-cart .cart-sidebar .cart_totals,
.woocommerce-cart .cart-sidebar .cart_totals table,
.woocommerce-cart .cart-sidebar .cart_totals h2 {
    text-align: left !important;
    margin-left: 0 !important;
}

/* Assure que les cellules restent bien alignées */
.woocommerce-cart .cart-sidebar th,
.woocommerce-cart .cart-sidebar td {
    text-align: left !important;
}

/* Bloc Code promo aligné à gauche */
.woocommerce-cart .coupon,
.woocommerce-cart .coupon .widget-title,
.woocommerce-cart .coupon .input-text,
.woocommerce-cart .coupon .button {
    text-align: left !important;
    margin-left: 0 !important;
}

/* Garde la structure propre */
.woocommerce-cart .coupon {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px;
}

/* Largeur du champ et du bouton */
.woocommerce-cart .coupon .input-text,
.woocommerce-cart .coupon .button {
    width: 100% !important;
    max-width: 280px !important;
}


/* PAGE PANIER : recentrer le contenu */
.woocommerce-cart .woocommerce {
    max-width: 1400px;
    margin: 0 auto;
}

/* Centre les colonnes panier + sidebar */
.woocommerce-cart .woocommerce .row {
    justify-content: center;
}

/* Centre le contenu interne */
.woocommerce-cart .cart-wrapper,
.woocommerce-cart .cart-sidebar,
.woocommerce-cart .cart-collaterals {
    margin-left: auto;
    margin-right: auto;
}

/* Garde le titre de page aligné à gauche */
.woocommerce-cart .shop-page-title,
.woocommerce-cart .page-title,
.woocommerce-cart h1 {
    text-align: left;
}

/* Optionnel : évite que certains blocs collent trop à gauche */
.woocommerce-cart .cart-collaterals {
    padding-left: 20px;
}

/* Centre réellement tout le bloc coupon */
.custom-cart-coupon {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center; /* centre horizontalement */
    justify-content: center;
    margin: 0 auto 25px;
    text-align: center;
}

/* Centre la ligne input + bouton */
.custom-cart-coupon .coupon-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    width: 100%;
    max-width: 500px; /* ajuste si besoin */
    margin: 12px auto 0;
}

/* Champ texte */
.custom-cart-coupon .input-text {
    flex: 1;
    min-width: 0;
    margin: 0;
}

/* Bouton */
.custom-cart-coupon .button {
    margin: 0;
    white-space: nowrap;
    width: auto;
    min-width: 140px;
    flex-shrink: 0;
}

/* Titre */
.custom-cart-coupon .widget-title {
    text-align: center;
    width: 100%;
}

input#coupon_code::placeholder {
  color: var(--texte-principal) !important;
}


#coupon-error-notice {
  color: var(--accent-violet) !important;
  font-weight: bold !important;
  display: block !important;
  width: 100% !important;
  text-align: center !important;
}

html body.woocommerce-cart td.actions.clear .coupon.custom-cart-coupon button.button.primary[name="apply_coupon"] {
    background: var(--accent-violet) !important;
    color: #fff !important;
    font-weight: bold !important;
    border: none !important;
    box-shadow: none !important;
    text-align: center !important;
}

body.woocommerce-cart .apply-coupon-btn {
    /* taille identique Flatsome */
    height: 42px !important;
    min-height: 42px !important;

    padding: 0 18px !important;

    /* typo identique */
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    /* forme EXACTE type Flatsome */
    border-radius: 99px !important;

    /* alignement parfait */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    /* reset des différences Woo */
    margin: 0 !important;
    box-shadow: none !important;
    text-transform: none !important;
}



html body.woocommerce-cart td.actions.clear .coupon.custom-cart-coupon button.button.primary[name="apply_coupon"]
{
  background-color: var(--accent-violet) !important;
  height: 42px !important;
  min-height: 45px !important;
  padding: 0 18px !important;
  border-radius: 12px !important;
  font-size: 16px !important;
  font-weight: bold !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-transform: none !important;
  box-shadow: none !important;
}

html body.woocommerce-cart td.actions.clear .coupon.custom-cart-coupon button.button.primary[name="apply_coupon"]:hover {

  background-color: var(--accent-rose-vif) !important;
  color: #ffffff !important;
  transform: scale(1.03) !important;
  transition: all 0.2s ease !important;
}

input#coupon_code::placeholder {
  color: var(--texte-principal) !important;
  border: 1px solid var(--accent-violet) !important;
  border-radius: 12px !important;
}

html body.woocommerce-cart td.actions.clear .coupon.custom-cart-coupon input.input-text {
    border-radius: 12px !important;

    color: #000000 !important;

    border: 1px solid var(--accent-violet) !important;

    box-shadow: none !important;
}

html body.woocommerce-cart td.actions.clear .coupon.custom-cart-coupon input.input-text:focus {
    border-color: var(--accent-violet) !important;
    border-width: 2px !important;

    outline: none !important;
    box-shadow: none !important;
}

body.woocommerce-cart .continue-shopping {
  display: none !important;
}

body.woocommerce-cart button[name="update_cart"] {
  display: block !important;
  margin: 40px auto 0 auto !important;
  float: none !important;
  text-align: center !important;
}

body.woocommerce-cart .woocommerce.row {
  max-width: none !important;
}

body.woocommerce-cart .woocommerce.row {
  max-width: 100% !important;
  width: 100% !important;
  display: block !important;
}

body.woocommerce-cart .large-7,
body.woocommerce-cart .large-12 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

body.woocommerce-cart .cart-collaterals {
  width: 100% !important;
  max-width: 100% !important;
}

body.woocommerce-cart .shop_table th,
body.woocommerce-cart .shop_table td,
body.woocommerce-cart .woocommerce-Price-amount,
body.woocommerce-cart .woocommerce-Price-currencySymbol {
  font-family: inherit !important;
  color: var(--texte-principal) !important;
  font-size: 16px !important;
}

body.woocommerce-cart .shop_table {
  font-size: 16px !important;
  color: var(--texte-principal) !important;
}



body.woocommerce-cart .cross-sells .row {
  display: flex !important;
  flex-wrap: wrap !important;
}

/* RESET COMPLET FLATSOME GRID */

body.woocommerce-cart .cross-sells .col {
  padding: 6px !important;
}

body.woocommerce-cart .cross-sells .row {
  margin: 0 -6px !important;
}

.woocommerce .product-small .box-text {
  display: flex;
  flex-direction: column;
}

.woocommerce .product-small .star-rating {
  margin: 0 auto 5px auto !important;
  display: block !important;
  text-align: center !important;
}

.woocommerce .product-small .box-text {
  display: flex;
  flex-direction: column;
}

.woocommerce .product-small .star-rating {
  margin: 0 auto 5px auto !important;
  display: block !important;
  text-align: center !important;
}

.star-rating {
  display: inline-block !important;
  vertical-align: middle !important;
  margin-top: -2px !important;
}

/* à partir d'ici responsive cross sells - validé */


/* =========================
   CROSS-SELLS RESET TOTAL
========================= */
body.woocommerce-cart .cross-sells .products.row {
  display: flex !important;
  flex-wrap: wrap !important;
}

/* on neutralise Flatsome columns */
body.woocommerce-cart .cross-sells .products {
  max-width: 1100px;
  margin: 0 auto;
}


/*==============================*/
/* CART RESPONSIVE */
/*==============================*/

/* ========================================= */
/* MOBILE PORTRAIT – CART EN MODE CARTE */
/* vraie solution responsive WooCommerce */
/* ========================================= */

@media screen and (max-width: 768px) {

  /* supprime le scroll horizontal */
  .cart-wrapper.sm-touch-scroll {
    overflow-x: visible !important;
  }

  /* cache l'en-tête du tableau */
  .woocommerce-cart-form__contents thead {
    display: none !important;
  }

  /* chaque produit devient une carte */
  .woocommerce-cart-form__contents tr.cart_item {
    display: block !important;
    width: 100% !important;
    margin-bottom: 24px !important;
    padding: 16px !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 12px !important;
    background: #fff !important;
  }

  /* toutes les cellules en bloc */
  .woocommerce-cart-form__contents tr.cart_item td {
    display: block !important;
    width: 100% !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 0 10px 0 !important;
    text-align: left !important;
  }

  /* suppression image produit */
  .woocommerce-cart-form__contents td.product-thumbnail {
    display: none !important;
  }

  /* bouton supprimer */
  .woocommerce-cart-form__contents td.product-remove {
    width: auto !important;
    margin-bottom: 12px !important;
  }

  .woocommerce-cart-form__contents td.product-remove .remove {
    font-size: 22px !important;
    line-height: 1 !important;
  }

  /* nom produit */
  .woocommerce-cart-form__contents td.product-name > a {
    display: block !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin-bottom: 10px !important;
    line-height: 1.4 !important;
  }

  /* variations bien empilées */
  .woocommerce-cart-form__contents dl.variation,
  .woocommerce-cart-form__contents dl.variation dt,
  .woocommerce-cart-form__contents dl.variation dd {
    display: block !important;
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .woocommerce-cart-form__contents dl.variation {
    font-size: 13px !important;
    line-height: 1.5 !important;
    margin-bottom: 14px !important;
  }

  .woocommerce-cart-form__contents dl.variation dt {
    font-weight: 600 !important;
    margin-top: 6px !important;
  }

  .woocommerce-cart-form__contents dl.variation dd {
    margin-bottom: 6px !important;
  }

  .woocommerce-cart-form__contents dl.variation dd p {
    margin: 0 !important;
  }

  /* prix / sous-total avec label */
  .woocommerce-cart-form__contents td.product-price::before {
    content: "Prix : ";
    font-weight: 600;
  }

  .woocommerce-cart-form__contents td.product-subtotal::before {
    content: "Sous-total : ";
    font-weight: 600;
  }

  .woocommerce-cart-form__contents td.product-price,
  .woocommerce-cart-form__contents td.product-subtotal {
    font-size: 14px !important;
    margin-bottom: 10px !important;
  }

  /* quantité */
  .woocommerce-cart-form__contents td.product-quantity::before {
    content: "Quantité : ";
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
  }

  /* quantité compacte */
  .woocommerce-cart-form__contents .ux-quantity {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    max-width: 140px !important;
  }

  .woocommerce-cart-form__contents .input-text.qty {
    width: 60px !important;
    text-align: center !important;
  }

  /* sous-total un peu plus visible */
  .woocommerce-cart-form__contents td.product-subtotal {
    padding-top: 8px !important;
    border-top: 1px solid #eee !important;
    font-weight: 600 !important;
  }

}

/* ========================================= */
/* MOBILE PORTRAIT – CART EN MODE CARTE */
/* version plus élégante */
/* ========================================= */

@media screen and (max-width: 768px) {

  /* carte produit plus premium */
  .woocommerce-cart-form__contents tr.cart_item {
    display: block !important;
    width: 100% !important;
    margin-bottom: 24px !important;
    padding: 18px !important;
    border: none !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.06) !important;
  }

  /* cellules */
  .woocommerce-cart-form__contents tr.cart_item td {
    display: block !important;
    width: 100% !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 0 12px 0 !important;
    text-align: left !important;
  }

  /* croix supprimer avec espace */
  .woocommerce-cart-form__contents td.product-remove {
    margin-bottom: 14px !important;
  }

  .woocommerce-cart-form__contents td.product-remove .remove {
    font-size: 24px !important;
    line-height: 1 !important;
    display: inline-block !important;
  }

  /* on réaffiche l’image mais plus grande */
  .woocommerce-cart-form__contents td.product-thumbnail {
    display: block !important;
    margin-bottom: 14px !important;
  }

  .woocommerce-cart-form__contents td.product-thumbnail img {
    width: 90px !important;
    max-width: 90px !important;
    height: auto !important;
    border-radius: 10px !important;
    display: block !important;
  }

  /* quantité : suppression des liserés parasites */
  .woocommerce-cart-form__contents .ux-quantity {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0 !important;
    max-width: unset !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .woocommerce-cart-form__contents .ux-quantity__button {
    width: 36px !important;
    min-width: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 1px solid #ddd !important;
    box-shadow: none !important;
    background: #fff !important;
  }

  .woocommerce-cart-form__contents .input-text.qty {
    width: 52px !important;
    min-width: 52px !important;
    height: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-top: 1px solid #ddd !important;
    border-bottom: 1px solid #ddd !important;
    border-left: 0 !important;
    border-right: 0 !important;
    text-align: center !important;
    box-shadow: none !important;
    background: #fff !important;
  }
  .woocommerce-cart .woocommerce {
  margin: auto !important;
  }
}

/* ===================================== */
/* CROIX SUPPRIMER NON SUPERPOSÉE */
/* mobile + tablette portrait */
/* ===================================== */

@media screen and (max-width: 1024px) {

  /* on casse le comportement flottant de WooCommerce */
  .woocommerce-cart-form__contents td.product-remove {
    display: block !important;
    float: none !important;
    clear: both !important;
    position: static !important;
    width: 100% !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  /* la croix elle-même */
  .woocommerce-cart-form__contents td.product-remove .remove {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    font-size: 24px !important;
    line-height: 1 !important;
    margin: 0 !important;
  }

  /* image bien séparée sous la croix */
  .woocommerce-cart-form__contents td.product-thumbnail {
    display: block !important;
    clear: both !important;
    margin-top: 8px !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
  }

  .woocommerce-cart-form__contents td.product-thumbnail img {
    display: block !important;
    width: 110px !important;
    max-width: 110px !important;
    height: auto !important;
    border-radius: 12px !important;
  }

}


/*=============================================================================*/
/*====================== responsive cart partie panier tablette portrait et téléphone paysage */
/*=============================================================================*/

/* ===================================== */
/* CART RESPONSIVE */
/* MOBILE PORTRAIT + MOBILE PAYSAGE */
/* + TABLETTE PORTRAIT jusqu'à 1024px */
/* vrai mode cartes */
/* ===================================== */

@media screen and (max-width: 1024px) {

  /* supprime le scroll horizontal */
  .cart-wrapper.sm-touch-scroll {
    overflow-x: visible !important;
  }

  /* IMPORTANT :
     on casse complètement la structure table */
  table.woocommerce-cart-form__contents,
  .woocommerce-cart-form__contents tbody,
  .woocommerce-cart-form__contents tr.cart_item {
    display: block !important;
    width: 100% !important;
  }

  /* cache l'en-tête du tableau */
  .woocommerce-cart-form__contents thead {
    display: none !important;
  }

  /* centrage global */
  .woocommerce-cart .woocommerce {
    margin: auto !important;
  }

  /* chaque produit devient une vraie carte */
  .woocommerce-cart-form__contents tr.cart_item {
    width: 94% !important;
    max-width: 94% !important;
    margin: 0 auto 28px auto !important;
    padding: 18px !important;
    box-sizing: border-box !important;
    border: none !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.06) !important;
  }

  /* toutes les cellules en bloc */
  .woocommerce-cart-form__contents tr.cart_item td {
    display: block !important;
    width: 100% !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 0 12px 0 !important;
    text-align: left !important;
    box-sizing: border-box !important;
  }

  /* croix supprimer */
  .woocommerce-cart-form__contents td.product-remove {
    display: block !important;
    float: none !important;
    clear: both !important;
    position: static !important;
    width: 100% !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .woocommerce-cart-form__contents td.product-remove .remove {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    font-size: 24px !important;
    line-height: 1 !important;
    margin: 0 !important;
  }

  /* image */
  .woocommerce-cart-form__contents td.product-thumbnail {
    display: block !important;
    clear: both !important;
    margin-top: 8px !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
  }

  .woocommerce-cart-form__contents td.product-thumbnail img {
    display: block !important;
    width: 110px !important;
    max-width: 110px !important;
    height: auto !important;
    border-radius: 12px !important;
  }

  /* nom produit */
  .woocommerce-cart-form__contents td.product-name > a {
    display: block !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin-bottom: 10px !important;
    line-height: 1.4 !important;
  }

  /* variations */
  .woocommerce-cart-form__contents dl.variation,
  .woocommerce-cart-form__contents dl.variation dt,
  .woocommerce-cart-form__contents dl.variation dd {
    display: block !important;
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .woocommerce-cart-form__contents dl.variation {
    font-size: 13px !important;
    line-height: 1.5 !important;
    margin-bottom: 14px !important;
  }

  .woocommerce-cart-form__contents dl.variation dt {
    font-weight: 600 !important;
    margin-top: 6px !important;
  }

  .woocommerce-cart-form__contents dl.variation dd {
    margin-bottom: 6px !important;
  }

  .woocommerce-cart-form__contents dl.variation dd p {
    margin: 0 !important;
  }

  /* labels */
  .woocommerce-cart-form__contents td.product-price::before {
    content: "Prix : ";
    font-weight: 600;
  }

  .woocommerce-cart-form__contents td.product-subtotal::before {
    content: "Sous-total : ";
    font-weight: 600;
  }

  .woocommerce-cart-form__contents td.product-quantity::before {
    content: "Quantité : ";
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
  }

  /* prix */
  .woocommerce-cart-form__contents td.product-price,
  .woocommerce-cart-form__contents td.product-subtotal {
    font-size: 14px !important;
    margin-bottom: 10px !important;
  }

  .woocommerce-cart-form__contents td.product-subtotal {
    padding-top: 8px !important;
    border-top: 1px solid #eee !important;
    font-weight: 600 !important;
  }

  /* quantité */
  .woocommerce-cart-form__contents .ux-quantity {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0 !important;
    max-width: unset !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .woocommerce-cart-form__contents .ux-quantity__button {
    width: 36px !important;
    min-width: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 1px solid #ddd !important;
    box-shadow: none !important;
    background: #fff !important;
  }

  .woocommerce-cart-form__contents .input-text.qty {
    width: 52px !important;
    min-width: 52px !important;
    height: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-top: 1px solid #ddd !important;
    border-bottom: 1px solid #ddd !important;
    border-left: 0 !important;
    border-right: 0 !important;
    text-align: center !important;
    box-shadow: none !important;
    background: #fff !important;
  }

}

/*=============================================================================*/
/*====================== responsive tout support cart partie adresse et livraison */
/*=============================================================================*/

/* ===================================== */
/* CART SIDEBAR – casser la logique table */
/* TOTAL PANIER plus aéré sur tous supports */
/* sans changer typo / couleurs / tailles */
/* ===================================== */

/* conteneur principal */
.cart-sidebar .cart_totals {
  width: 100% !important;
}

/* tables principales */
.cart-sidebar .cart_totals table,
.cart-sidebar .cart_totals .shop_table,
.cart-sidebar .cart_totals .shipping__table {
  width: 100% !important;
  display: block !important;
  border-collapse: collapse !important;
  table-layout: auto !important;
}

/* tbody */
.cart-sidebar .cart_totals table tbody {
  display: block !important;
  width: 100% !important;
}

/* chaque ligne devient plus libre */
.cart-sidebar .cart_totals table tr {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  width: 100% !important;
  margin-bottom: 18px !important;
  box-sizing: border-box !important;
}

/* colonnes th / td */
.cart-sidebar .cart_totals table th,
.cart-sidebar .cart_totals table td {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  box-sizing: border-box !important;
  text-align: left !important;
  vertical-align: top !important;
}

/* les montants restent bien alignés */
.cart-sidebar .cart_totals table td {
  margin-left: auto !important;
  text-align: right !important;
}

/* ligne expédition spéciale */
.cart-sidebar .cart_totals .woocommerce-shipping-totals td.shipping__inner {
  width: 100% !important;
  margin-left: 0 !important;
  text-align: left !important;
}

/* bloc livraison */
.cart-sidebar .cart_totals .shipping__table tr {
  display: block !important;
  width: 100% !important;
}

.cart-sidebar .cart_totals .shipping__table th,
.cart-sidebar .cart_totals .shipping__table td {
  display: block !important;
  width: 100% !important;
  text-align: left !important;
}

/* adresse de livraison */
.cart-sidebar .cart_totals .woocommerce-shipping-destination {
  width: 100% !important;
  margin-top: 10px !important;
}

/* formulaire changement d'adresse */
.cart-sidebar .woocommerce-shipping-calculator {
  width: 100% !important;
}

.cart-sidebar .woocommerce-shipping-calculator .form-row,
.cart-sidebar .woocommerce-shipping-calculator input,
.cart-sidebar .woocommerce-shipping-calculator select {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ===================================== */
/* CART SIDEBAR – corrections expédition */
/* alignement + typo + point adresse */
/* ===================================== */

/* prix "Envoi soigné" aligné à droite */
.cart-sidebar .shipping__list_label {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
}

/* même typo que le reste */
.cart-sidebar .shipping__list_label,
.cart-sidebar .shipping__list_label * {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-transform: none !important;
}

/* ===================================== */
/* CORRECTION FORCÉE */
/* point adresse + couleur expédition */
/* ===================================== */

/* ------------------------------- */
/* 1. "Envoi soigné" + prix */
/* même couleur que le reste */
/* ------------------------------- */

.cart-sidebar .shipping__list,
.cart-sidebar .shipping__list li,
.cart-sidebar .shipping__list_label,
.cart-sidebar .shipping__list_label span,
.cart-sidebar .shipping__list_label .woocommerce-Price-amount,
.cart-sidebar .shipping__list_label .woocommerce-Price-currencySymbol {
  color: var(--fs-color-primary) !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: 400 !important;
  text-transform: none !important;
  opacity: 1 !important;
}

/* prix aligné à droite */
.cart-sidebar .shipping__list_label {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
}


/* ------------------------------- */
/* 2. suppression du point final */
/* après l’adresse */
/* ------------------------------- */

/* on supprime tous les pseudo éléments possibles */
.cart-sidebar .woocommerce-shipping-destination::before,
.cart-sidebar .woocommerce-shipping-destination::after,
.cart-sidebar .woocommerce-shipping-destination strong::before,
.cart-sidebar .woocommerce-shipping-destination strong::after {
  content: "" !important;
  display: none !important;
}

/* si le point est réellement dans le texte généré
   par le label, on masque uniquement le dernier caractère visuel */
.cart-sidebar .woocommerce-shipping-destination {
  position: relative !important;
}

/* cache le point final si Flatsome l’injecte */
.cart-sidebar .woocommerce-shipping-destination br + *::after {
  content: none !important;
}


/* ===================================== */
/* CORRECTION FORCÉE */
/* point adresse + couleur expédition */
/* ===================================== */

/* ------------------------------- */
/* 1. "Envoi soigné" + prix */
/* même couleur que le reste */
/* ------------------------------- */

.cart-sidebar .shipping__list,
.cart-sidebar .shipping__list li,
.cart-sidebar .shipping__list_label,
.cart-sidebar .shipping__list_label span,
.cart-sidebar .shipping__list_label .woocommerce-Price-amount,
.cart-sidebar .shipping__list_label .woocommerce-Price-currencySymbol {
  color: var(--texte-principal) !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  text-transform: none !important;
  opacity: 1 !important;
}

.cart-sidebar .shipping__list_label
 {
  opacity: 0.7 !important;

}

/* prix aligné à droite */
.cart-sidebar .shipping__list_label {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  color: var(--texte-principal) !important;
}


/* ===================================== */
/* CART SIDEBAR – SHIPPING FULL WIDTH */
/* casser aussi la table livraison */
/* desktop + tous supports */
/* ===================================== */

/* la ligne expédition doit occuper toute la largeur */
.cart-sidebar .woocommerce-shipping-totals,
.cart-sidebar .woocommerce-shipping-totals td.shipping__inner {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* vraie table interne livraison cassée */
.cart-sidebar .shipping__table,
.cart-sidebar .shipping__table tbody,
.cart-sidebar .shipping__table tr {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* th + td prennent toute la largeur */
.cart-sidebar .shipping__table th,
.cart-sidebar .shipping__table td {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 0 12px 0 !important;
  border: 0 !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

/* liste des méthodes d’expédition */
.cart-sidebar .shipping__list,
.cart-sidebar .shipping__list li {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* label sur toute la largeur */
.cart-sidebar .shipping__list_label {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  width: 100% !important;
}

/* adresse de livraison */
.cart-sidebar .woocommerce-shipping-destination {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

/* bouton modifier adresse */
.cart-sidebar .shipping-calculator-button {
  display: inline-block !important;
  margin-top: 8px !important;
}

/* reglage des boutons et coupon */
/* ===================================== */
/* CART ACTIONS – code promo + boutons */
/* mobile portrait + paysage + tablette portrait */
/* jusqu'à 1024px uniquement */
/* ===================================== */

@media screen and (max-width: 1024px) {

  /* on casse la logique table sur la ligne actions */
  .woocommerce-cart-form__contents tr td.actions {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    box-sizing: border-box !important;
    text-align: center !important;
  }

  /* bloc global */
  .woocommerce-cart-form__contents td.actions {
    clear: both !important;
  }

  /* coupon */
  .custom-cart-coupon {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 20px auto !important;
    text-align: center !important;
  }

  /* input + bouton coupon empilés */
  .custom-cart-coupon .coupon-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .custom-cart-coupon input.input-text,
  .custom-cart-coupon .apply-coupon-btn {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  /* bouton mise à jour */
  .woocommerce-cart-form__contents button[name="update_cart"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 16px auto !important;
    float: none !important;
  }

  /* poursuivre les achats */
  .continue-shopping {
    display: block !important;
    width: 100% !important;
    margin: 0 auto !important;
    float: none !important;
    text-align: center !important;
  }

  .continue-shopping .button-continue-shopping {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
  }

  /* suppression des pull-left Flatsome */
  .pull-left {
    float: none !important;
  }

/* hauteur input code promo */

.custom-cart-coupon input.input-text {
  min-height: 38px !important;
  padding-top: 9px !important;
  padding-bottom: 9px !important;
}
}

/* ===================================== */
/* CROSS-SELLS */
/* dernière carte alignée à gauche */
/* petits écrans */
/* ===================================== */

@media screen and (max-width: 1024px) {

  .cross-sells .products.row {
    justify-content: flex-start !important;
  }

}

/* ===================================== */
/* CROSS-SELLS */
/* centrage quand 1 carte par ligne */
/* mobile portrait */
/* ===================================== */

@media screen and (max-width: 549px) {

  /* on garde le conteneur centré */
  .cross-sells .products.row {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
  }

  /* chaque carte prend une largeur propre et se centre */
  .cross-sells .products .product-small.col {
    width: 100% !important;
    max-width: 320px !important;
    flex: 0 0 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
  }

}

/* ===================================== */
/* CROSS-SELLS */
/* cartes un peu plus larges */
/* petit écran */
/* ===================================== */

@media screen and (max-width: 1024px) {

  .cross-sells .products .product-small.col {
    max-width: 420px !important;
  }
}

/* ===================================== */
/* DESKTOP + TABLETTE PAYSAGE */
/* "Mettre à jour le panier" aligné à gauche */
/* ===================================== */

@media screen and (min-width: 768px) {

  /* td parent */
  .woocommerce-cart-form__contents td.actions {
    text-align: left !important;
  }

  /* bouton update cart */
  .woocommerce-cart-form__contents td.actions button[name="update_cart"] {
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 0 16px 0 !important;
    float: left !important;
    clear: both !important;
    margin-top: 20px !important;
  }

  /* neutralise le centrage hérité */
  .woocommerce-cart-form__contents td.actions .pull-left {
    float: left !important;
  }

}

/* version plus robuste */

.woocommerce-cart-form__contents td.actions .button[name="update_cart"] {
  display: inline-block !important;
}

.woocommerce-cart-form__contents td.actions .button[name="update_cart"] + * {
  margin-top: 45px !important;
}

/* CENTRAGE SIMPLE ET ROBUSTE DU BOUTON */

.woocommerce-cart-form__contents td.actions {
  text-align: center !important;
}

/* on neutralise UNIQUEMENT dans cette zone */
.woocommerce-cart-form__contents td.actions .pull-left {
  float: none !important;
}

/* centrage du bouton */
.woocommerce-cart-form__contents td.actions button[name="update_cart"] {
  display: inline-block !important;
  margin: 0 auto 20px auto !important;
}

/* FORÇAGE PROPRE DU CENTRAGE DANS LA CELLULE ACTIONS */

.woocommerce-cart-form__contents tr td.actions {
  text-align: center !important;
}

/* on neutralise tout comportement flottant interne */
.woocommerce-cart-form__contents tr td.actions * {
  float: none !important;
}

/* le bouton lui-même */
.woocommerce-cart-form__contents tr td.actions button[name="update_cart"] {
  display: inline-block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ON CASSE LE COMPORTEMENT TABLE UNIQUEMENT POUR ACTIONS */

.woocommerce-cart-form__contents tr:last-child td.actions {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
}

/* on centre en bloc pur */
.woocommerce-cart-form__contents tr:last-child td.actions > * {
  display: inline-block !important;
  float: none !important;
}


/* =============================== */
/* CART LEFT COLUMN FIX (PC + TABLETTE PAYSAGE) */
/* =============================== */

@media screen and (min-width: 1024px) {

  /* on laisse Flatsome gérer la grille */

  /* mais on force le contenu interne à utiliser toute la largeur */
  .woocommerce-cart .col.large-7 .cart-wrapper {
    width: 100% !important;
  }

  /* table prend toute la place */
  .woocommerce-cart table.shop_table {
    width: 100% !important;
  }

  /* actions (coupon + boutons) mieux réparties */
  .woocommerce-cart td.actions {
    width: 100% !important;
  }
}

.cart-actions-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 12px;
  width: 100%;
}

.cart-actions-wrapper .button {
  margin: 0 auto;
  display: inline-flex;
}

.woocommerce table.shop_table td.actions {
  text-align: center !important;
  padding: 20px !important;
}

.cart-actions-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  gap: 16px;
}

.custom-cart-coupon {
  width: 100% !important;
  max-width: 520px;
  margin: 0 auto !important;
}

.custom-cart-coupon .coupon-row {
  display: flex;
  gap: 10px;
  width: 100%;
  justify-content: center;
  flex-wrap: nowrap;
}

.custom-cart-coupon .input-text {
  flex: 1;
  min-width: 180px;
  height: 42px;
}

.cart-actions-wrapper .button {
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (min-width: 850px) and (max-width: 1200px) {
  .custom-cart-coupon .coupon-row {
    flex-direction: row;
    align-items: stretch;
  }

  .custom-cart-coupon .input-text {
    min-width: 240px;
  }
}

.woocommerce table.shop_table td.actions {
  padding-bottom: 24px !important;
}

.woocommerce table.shop_table td.actions .cart-actions-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
}

@media (min-width: 850px) {
  .woocommerce-cart-form__contents td.actions {
    display: table-cell !important;
  }

  .woocommerce-cart-form__contents td.actions .cart-actions-wrapper {
    display: flex !important;
  }
}

.woocommerce-cart-form tr td.actions {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-direction: column !important;
  text-align: center !important;
}

/* Conteneur interne */
.woocommerce-cart-form .cart-actions-wrapper {
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Coupon propre */
.woocommerce-cart-form .coupon.custom-cart-coupon {
  width: 100%;
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

  /* bloc coupon */
  .woocommerce-cart-form .coupon-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  /* INPUT : stop l’étirement */
  .woocommerce-cart-form .coupon-row input.input-text {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;

    padding: 0 10px !important;
    line-height: 38px !important;

    width: 100% !important;
    box-sizing: border-box !important;

    font-size: 14px !important;
  }

  /* bouton */
  .woocommerce-cart-form .apply-coupon-btn {
    height: 38px !important;
    line-height: 38px !important;
    width: 100% !important;
  }
}


@media (max-width: 1024px) {

  /* 1. ON ÉCRASE LE CONTENEUR PROBLÈME (table / flex / row) */
  .woocommerce-cart-form td.actions,
  .woocommerce-cart-form .coupon,
  .woocommerce-cart-form .coupon-row {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
  }

  /* 2. ON BLOQUE LE DÉBORDEMENT HORIZONTAL GLOBAL */
  .woocommerce-cart-form {
    overflow-x: hidden !important;
  }

  /* 3. INPUT = OBLIGÉ DE RESTER DANS LE FLUX */
  .woocommerce-cart-form .coupon input.input-text {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    float: none !important;
  }

  /* 4. BOUTON = FORCÉ SOUS INPUT */
  .woocommerce-cart-form .coupon button,
  .woocommerce-cart-form .coupon .button,
  .woocommerce-cart-form .apply-coupon-btn {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 10px !important;
    float: none !important;
  }

  /* 5. CRITIQUE : empêche flex hidden du thème */
  .woocommerce-cart-form .coupon * {
    min-width: 0 !important;
    max-width: 100% !important;
  }
}

/* 1. FORCER LE CONTENEUR */
.woocommerce-cart-form .coupon {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 2. INPUT = pleine largeur */
.woocommerce-cart-form .coupon input.input-text {
  flex: 1 1 100% !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* 3. BOUTONS = chacun sur sa ligne */
.woocommerce-cart-form .coupon button,
.woocommerce-cart-form .coupon .button {
  flex: 1 1 100% !important;
  width: 100% !important;
  display: block !important;
  box-sizing: border-box !important;
}/* CONTENEUR COUPON */
.woocommerce-cart-form .coupon {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* INPUT CODE PROMO */
.woocommerce-cart-form .coupon input.input-text {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: unset !important;
  display: block !important;
  box-sizing: border-box !important;
}

/* BOUTONS */
.woocommerce-cart-form .coupon button,
.woocommerce-cart-form .coupon .button {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  box-sizing: border-box !important;
}


/* ajustement responsive boutique pour portable en portrait */

@media (max-width: 480px) {
  .shop-products-grid li.product {
    width: 50%;
    float: left;
  }
}

@media (max-width: 480px) {

  /* GRILLE EN MODE LISTE */
  .shop-products-grid {
    display: block !important;
  }

  /* 1 PRODUIT = 100% LARGEUR */
  .shop-products-grid li.product,
  .shop-products-grid .product-small {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    float: none !important;
    display: block !important;
    box-sizing: border-box !important;
    margin-bottom: 14px !important;
  }

  /* CONTENEUR FLATSOME PROPRE */
  .shop-products-grid .col-inner {
    width: 100% !important;
  }

  /* IMAGE ET BOX */
  .shop-products-grid .box,
  .shop-products-grid .box-image {
    width: 100% !important;
  }

}

.filter-group h3 {
  color: var(--accent-rose-vif) !important;
  font-weight: bold !important;
}

#closeFilters {
    margin-top: 30px !important;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;

    border: 3px solid var(--accent-rose-vif);
    border-radius: 2px;

    background: var(--fond-blanc) !important;
    color: var(--accent-rose-vif) !important;

    font-size: 22px;
    font-weight: bold;
    line-height: 1;

    cursor: pointer;
    padding: 0;
    margin: 4px 0 0 0;

    box-shadow: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

#closeFilters:hover {
    background: var(--accent-doux) !important;
    transform: scale(1.08) rotate(90deg);
}

.filter-header h2 {
  margin-top: 30px !important;
}

.blog-intro .blog-li {
  font-size: 1.1rem !important;
}



/* pas forcément à garder */

.woocommerce-widget-layered-nav a.active-filter {
  font-weight: bold;
  color: #c2185b;
}

.woocommerce-widget-layered-nav ul li.chosen a {
  font-weight: bold;
  color: #c2185b;
}

.woocommerce-widget-layered-nav ul li.chosen a::after {
  content: " ✕";
  margin-left: 6px;
  font-weight: normal;
}


.filter-section {
  margin-bottom: 30px !important;
}


/* TRAVAIL RESPONSIVE PAGE PRODUIT AVEC FILTRES */

/* =========================
   GRILLE PRODUITS FLATSOME
========================= */

ul.products {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: space-between;
}

/* reset largeur Flatsome */
ul.products li.product {
  float: none !important;
  width: auto !important;
}

/* =========================
   PC - 3 COLONNES
========================= */
@media (min-width: 1025px) {
  ul.products li.product {
    width: calc(33.333% - 16px) !important;
  }
}

/* =========================
   TABLETTE PAYSAGE
========================= */
@media (min-width: 768px) and (max-width: 1024px) {
  ul.products li.product {
    width: calc(33.333% - 16px) !important;
  }
}

/* =========================
   TABLETTE PORTRAIT
========================= */
@media (min-width: 600px) and (max-width: 767px) {
  ul.products li.product {
    width: calc(50% - 12px) !important;
  }
}

/* =========================
   MOBILE PAYSAGE
========================= */
@media (min-width: 480px) and (max-width: 599px) {
  ul.products li.product {
    width: calc(50% - 10px) !important;
  }
}

/* =========================
   MOBILE PORTRAIT
========================= */
@media (max-width: 479px) {
  ul.products li.product {
    width: 100% !important;
  }
}

/* =========================
   DESIGN DES CARTES
========================= */

ul.products li.product .product-small {
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
  transition: all 0.3s ease;
}

/* hover élégant */
ul.products li.product:hover .product-small {
  transform: translateY(-6px);
  box-shadow: 0 14px 30px rgba(0,0,0,0.12);
}

/* image */
ul.products li.product .box-image img {
  border-radius: 16px 16px 0 0;
  transition: transform 0.4s ease;
}

ul.products li.product:hover .box-image img {
  transform: scale(1.05);
}

/* texte */
ul.products li.product .box-text {
  padding: 12px 14px;
}

/* titre produit */
ul.products li.product .product-title {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
}

/* prix */
ul.products li.product .price {
  font-weight: bold;
  color: #333;
}


/*==============================*/
/* RESPONSIVE PANIER ET FILTRES */
/*==============================*/


/* =========================
   GRILLE FLATSOME PRODUITS
========================= */

.shop-container .row,
.products .row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 24px;
}

/* RESET COL FLATSOME */
.shop-container .col {
  float: none !important;
}

/* =========================
   PC - 3 COLONNES
========================= */
@media (min-width: 1025px) {
  .shop-container .product-small.col {
    width: calc(33.333% - 16px) !important;
  }
}

/* =========================
   TABLETTE
========================= */
@media (min-width: 768px) and (max-width: 1024px) {
  .shop-container .product-small.col {
    width: calc(33.333% - 16px) !important;
  }
}

/* =========================
   MOBILE PAYSAGE
========================= */
@media (min-width: 480px) and (max-width: 767px) {
  .shop-container .product-small.col {
    width: calc(50% - 12px) !important;
  }
}

/* =========================
   MOBILE PORTRAIT
========================= */
@media (max-width: 479px) {
  .shop-container .product-small.col {
    width: 100% !important;
  }
}

/* =========================
   DESIGN CARTES (TON HTML)
========================= */

.product-small {
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 22px rgba(0,0,0,0.08);
  transition: all 0.3s ease;
}

.product-small:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 35px rgba(0,0,0,0.12);
}

/* image */
.product-small .box-image img {
  transition: transform 0.4s ease;
}

.product-small:hover .box-image img {
  transform: scale(1.05);
}

/* texte */
.box-text-products {
  padding: 14px;
}

/* titre */
.product-title a {
  font-size: 15px;
  font-weight: 500;
}

/* prix */
.price {
  font-weight: bold;
}


/*===============================*/
/* RESPONSIVE PANIER */
/*===============================*/



/* =========================
   CONTAINER FLEX PROPRE
========================= */

.shop-container .row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px;
}

/* =========================
   BASE CARTE
========================= */

.shop-container .product-small.col {
  box-sizing: border-box;
}

/* =========================
   PC + TABLETTE PAYSAGE → 3 COLS
========================= */
@media (min-width: 768px) {
  .shop-container .product-small.col {
    flex: 0 0 calc(33.333% - 14px) !important;
    max-width: calc(33.333% - 14px) !important;
  }
}

/* =========================
   MOBILE PAYSAGE → 2 COLS
========================= */
@media (min-width: 480px) and (max-width: 767px) {
  .shop-container .product-small.col {
    flex: 0 0 calc(50% - 10px) !important;
    max-width: calc(50% - 10px) !important;
  }
}

/* =========================
   MOBILE PORTRAIT → 1 COL
========================= */
@media (max-width: 479px) {
  .shop-container .product-small.col {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

.product-small .star-rating,
.product-small .star-rating--inline,
.woocommerce ul.products li.product .star-rating {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: hidden !important;
}

.widget_layered_nav h3,
.woocommerce-widget-layered-nav h3,
aside#filterDrawer h3 {
  font-size: 18px;
  font-weight: bold;
  color: var(--accent-rose-vif) !important;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid #f2c9d2; /* touche Sakura subtile */
  letter-spacing: 0.5px;
}



.woocommerce-widget-layered-nav-list__item--chosen a::before,
.woocommerce-widget-layered-nav-list__item.chosen a::before {
  content: none !important;
}



.widget_layered_nav li.chosen > a {
  color: #000 !important;
  font-weight: 600;
  padding-left: 14px;
}

.widget_layered_nav li.chosen > a::before {
  content: "";
  width: 6px;
  height: 6px;
  background: #c98aa0;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
  left: 0;
  top: 8px;
}


.widget_layered_nav .chosen a::after,
.woocommerce-widget-layered-nav-list__item--chosen a::after {
  content: none !important;
  display: none !important;
}


/* =========================
   ÉTAT NORMAL
========================= */
.widget_layered_nav ul li a {
  color: var(--texte-principal) !important;
  opacity: 1 !important;
  font-weight: 400;
  transition: all 0.2s ease;
  position: relative;
}

/* =========================
   HOVER (rose vif)
========================= */
.widget_layered_nav ul li a:hover {
  color: var(--accent-rose-vif) !important;
}


/* exemple couleur active via URL WooCommerce */
body.tax-product_cat .widget_layered_nav a {
  color: #111;
}

/* quand actif (WooCommerce ajoute classes au body) */
body.woocommerce .woocommerce-widget-layered-nav-list__item--chosen a {
  color: var(--texte-principal);
  font-weight: bold;
  background-color: var(--accent-doux) !important;
}

body .woocommerce-widget-layered-nav-list__item--chosen a::before {
  content: "✔";
  color: #7a4ccf;
  margin-right: 6px;
}


#closeFilters {
  position: relative;
  top: -12px;
}



#resetFiltersGlobal a {
  background: rgba(255, 255, 255, 0.6);
  border-radius: 20px;
  transition: all 0.2s ease;
}

#resetFiltersGlobal a:hover {
  background: #fff;
  color: #e8a6b8;
}


/* panier sur carte produit */
.quick-cart-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #ddd;
    position: absolute;
    bottom: 12px;
    right: 12px;
    transition: all 0.2s ease;
}

.quick-cart-icon:hover {
    transform: scale(1.1);
    background: #111;
    color: #fff;
}

.quick-cart-icon .dashicons {
    font-size: 18px;
}

.quick-cart-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #111;
    border: 1px solid #111;
    position: absolute;
    bottom: 12px;
    right: 12px;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    z-index: 5;
    box-sizing: border-box;
}

.quick-cart-icon {
    position: absolute !important;
    right: 12px !important;
    bottom: 12px !important;
    left: auto !important;

    width: 38px;
    height: 38px;

    display: flex !important;
    align-items: center;
    justify-content: center;

    border-radius: 50%;
    background: #111 !important;
    color: #fff !important;

    z-index: 10;
    box-sizing: border-box;

    transition: background 0.2s ease;
}

.add_to_cart_button.loading,
.add_to_cart_button.added {
    position: absolute !important;
    right: 12px !important;
    left: auto !important;
}

.woocommerce ul.products li.product {
    position: relative !important;
    overflow: hidden;
}


/* cart sur cartes produits */
.woocommerce ul.products li.product {
    position: relative !important;
    overflow: hidden !important;
}


/* cart */
.quick-cart-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid #ddd;
    position: absolute;
    bottom: 12px;
    right: 12px;
    transition: all 0.2s ease;
}

.quick-cart-icon:hover {
    background: #111;
    color: #fff;
}

.quick-cart-icon .dashicons {
    font-size: 18px;
}

.woocommerce ul.products li.product {
    position: relative;
}


/* pour enlever Aperçu sur les cartes produits de la page boutique */
.product-small .box-image .image-tools,
.product-small .box-image .quick-view,
.product-small .quick-view,
a.quick-view {
    display: none !important;
}



/* fil d'ariane */
.custom-breadcrumb-wrapper {
    font-family: var(--texte-principal) !important;
    font-size: 1.1em !important;
    max-width: 1200px;
    margin: 24px auto 36px;
    padding: 0 24px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--texte-principal) !important;
    font-weight: bold !important;
    opacity: 0.7 !important;
}

.custom-breadcrumb-wrapper nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

.custom-breadcrumb-wrapper a {
    color: var(--texte-principal);
    font-family: var(--texte-principal);
    font-size: 1.1em !important;
    font-weight: 400 !important;
    text-decoration: none;
    transition: all 0.2s ease;
    position: relative;
    opacity: 0.6 !important;
}

.custom-breadcrumb-wrapper a:hover {
    color: var(--accent-violet);
    opacity: 1 !important;
    font-weight: bold !important;
}

.custom-breadcrumb-wrapper .separator {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin: 0 8px;
    line-height: 1;
    vertical-align: middle;

    color: var(--texte-principal) !important;
    font-size: 16px;
    font-weight: 400;

    opacity: 0.6 !important;
}

.woocommerce-breadcrumb {
    margin: 0;
    font-size: inherit;
}

.custom-breadcrumb-wrapper strong,
.custom-breadcrumb-wrapper span:last-child {
    color: #222;
    font-weight: 500;
}


/* on garde ton bouton initial */
.quick-cart-icon.added {
    background: #5ea35f !important; /* vert */
    color: #fff !important;
}

/* on masque le bouton WooCommerce ajouté après clic */
a.added_to_cart.wc-forward {
    display: none !important;
}

/* on masque le texte "Ajouté" injecté */
.quick-cart-icon.added {
    font-size: 0 !important;
}

/* on affiche uniquement la coche */
.quick-cart-icon.added::after {
    content: "✓" !important;
    font-size: 18px !important;
    line-height: 1 !important;

    position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* On ne touche PAS à la largeur */
.term-description {
  padding: 0 1rem;
  margin-bottom: 2rem;
}

/* Style texte uniquement */
.term-description p {
  font-family: var(--font-textes) !important;
  font-size: 1.10rem;
  line-height: 1.9;
  color: var(--texte-principal);
  text-align: justify;
  margin-bottom: 1.5rem;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}



/* MOBILE PORTRAIT */
@media (max-width: 768px) and (orientation: portrait) {
 .blog-content .blog-p,
  .blog-content .term-description p,
  .blog-content .blog-intro ul li,
  .blog-content ul li.blog-li,
  .shop-container .term-description p {
    font-size: 1.2rem !important;
    line-height: 1.6;
    text-align: left;
  }
}


/* MOBILE PAYSAGE */
@media (max-width: 920px) and (orientation: landscape) {

  /* Paragraphes */
  .blog-content .blog-p,
  .blog-content .term-description p {
    font-size: 1.2rem !important;
    line-height: 1.7 !important;
  }

  /* Listes : on cible plus fort */
  .blog-content .blog-intro ul li,
  .blog-content ul li.blog-li,
    .shop-container .term-description p  {
    font-size: 1.2rem !important;
    line-height: 1.7 !important;
  }

}



/* TABLETTE PORTRAIT */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .blog-content .blog-p,
  .blog-content .blog-intro ul li,
  .blog-content ul li.blog-li,
  .shop-container .term-description p {
    font-size: 1.25rem !important;
    line-height: 1.7;
    max-width: 90%;
    margin: 0 auto;
  }
}


/* TABLETTE PAYSAGE */
@media (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {

  .blog-content p,
  .blog-content li.blog-li {
    font-size: 1.1rem !important;
    line-height: 1.7 !important;
  }

  .blog-content li.blog-li * {
    font-size: inherit !important;
  }

}


/* MOBILE PAYSAGE */
@media (min-width: 921px) and (max-width: 1366px) and (orientation: landscape) {
  .blog-content .blog-p,
  .blog-content .blog-intro ul li,
  .shop-container .term-description p {
    font-size: 1.2rem !important;
    line-height: 1.7 !important;
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 0.5rem;
  }

  .blog-content .blog-p,
  .shop-container .term-description p {
    margin-bottom: 1.2rem;
  }

  .blog-content .blog-intro ul {
    margin-bottom: 1.2rem;
    padding-left: 1rem;
  }

  .blog-content .blog-intro li {
    margin-bottom: 0.4rem;
  }

}





/* MOBILE PORTRAIT — corrige l’empilement + espacements */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  /* Force une pile verticale sur le conteneur réel */
  main.blog-content,
  .shop-container .term-description {
    display: block !important;        /* ⬅️ neutralise flex/grid éventuel */
  }

  /* Paragraphes (TOUS) */
  main.blog-content p,
  .shop-container .term-description p {
    display: block !important;
  margin-bottom: 1.5rem !important;
  font-size: 1.2rem !important;
    line-height: 1.8 !important;
    padding: 0 0.75rem;
  }

  /* Liste (bloc) */
  main.blog-content .blog-intro ul {
    display: block !important;
    margin: 1rem 0 1.5rem 0 !important;
    padding-left: 1.2rem !important;
  }

  /* Items */
  main.blog-content .blog-intro li {
    display: list-item !important;
    margin: 0 0 0.5rem 0 !important;
    font-size: 1.2rem !important;
    line-height: 1.8 !important;
  }
}

/* Items */
  main.blog-content .blog-intro li {
    display: list-item !important;
    margin: 0 0 0.5rem 0 !important;
    font-size: 1.2rem !important;
    line-height: 1.8 !important;
  }



/* LISTES AVEC FLEURS */

/* FIX PUCE FLEUR */
.blog-content .blog-intro li {
  position: relative;              /* ⬅️ indispensable */
  padding-left: 2rem;              /* ⬅️ espace pour la fleur */
}

.blog-content .blog-intro li::before {
  left: 0;
  top: 0.5em;                      /* ⬅️ ajuste verticalement */
  transform: translateY(-50%);     /* ⬅️ centre sur la ligne */
}

@media (min-width: 921px) and (orientation: landscape) {

  .blog-content .blog-intro li {
    padding-left: 2.2rem; /* un peu plus d’espace */
  }

}

/* FIX PUCES TABLETTES PAYSAGE */
@media (min-width: 1024px) and (orientation: landscape) {

  .blog-content .blog-intro ul {
    padding-left: 1.2rem !important;
  }

  .blog-content .blog-intro li {
    position: relative;
    padding-left: 1.6rem !important;
  }

  .blog-content .blog-intro li::before {
    left: 0 !important;
  }

}

/* TABLETTES PAYSAGE : largeur listes */
@media (min-width: 1024px) and (orientation: landscape) {

  .blog-content .blog-intro ul {
    padding-left: 1.2rem !important;
  }

  .blog-content .blog-intro li {
    position: relative;
    padding-left: 1.6rem !important;
  }

  .blog-content .blog-intro li::before {
    left: 0 !important;
  }

  .blog-content .blog-intro ul {
    max-width: 89% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .blog-content .blog-intro li {
    padding-left: 2rem !important;
  }

}

/* MOBILE PAYSAGE : largeur listes */
@media (max-width: 920px) and (orientation: landscape) {

  .blog-content .blog-intro ul {
    max-width: 95% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 2rem !important;
  }

  .blog-content .blog-intro li {
    padding-left: 1.4rem !important;
  }

  .blog-content .blog-intro li::before {
    left: -20px !important;
  }

}


/* Empêche le déplacement du bouton add to cart */
.add_to_cart_button,
.add_to_cart_button.added,
.add_to_cart_button.loading {

  width: 42px;
  height: 42px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0 !important;
  margin: 0 !important;

  box-sizing: border-box;

  transform: none !important;
}


/*Masquer l'UGS sur la page dans les produits */
.sku_wrapper {
  display: none !important;
}

/* Tablettes portrait + mobiles paysage */
@media (max-width: 1024px) {

  .quick-cart-icon {
    width: 34px !important;
    height: 34px !important;

    min-width: 34px !important;
    min-height: 34px !important;

    padding: 0 !important;

    display: flex;
    align-items: center;
    justify-content: center;
  }

  .quick-cart-icon .dashicons-cart {
    font-size: 15px !important;
    width: 15px !important;
    height: 15px !important;
    line-height: 15px !important;
  }



    .products-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1rem;
      }

      .products-grid .product-small.col {
        width: 100% !important;
        max-width: 100% !important;
      }

}


/* Téléphones paysage */
@media (max-width: 920px) and (orientation: landscape) {

  .products-grid {
    grid-template-columns: 1fr !important;
  }

}

/* PORTRAIT */
@media (max-width: 1024px) and (orientation: portrait) {

  .products-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.2rem;
  }

  .products-grid .product-small.col {
    width: 100% !important;
    max-width: 100% !important;
  }

}

/* TABLETTE PAYSAGE */
@media (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {

  .products-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.2rem;
  }

  .products-grid .product-small.col {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* UNE seule carte → centrage */
  .products-grid .product-small.col:only-child {
    grid-column: 1 / -1;
    max-width: 500px !important;
    margin: 0 auto !important;
  }
}


/* Centre une seule carte produit */
.products-grid .product-small.col:only-child {
  grid-column: 1 / -1;
  max-width: 500px !important;
  margin: 0 auto !important;
}


@media (max-width: 768px) and (orientation: portrait) {
  .blog-content .blog-p, .blog-content .term-description p, .blog-content .blog-intro ul li, .blog-content ul li.blog-li, .shop-container .term-description p {
    text-align: justify;
  }
}

@media (max-width: 900px) and (orientation: landscape) {

  .signature-name {
    font-size: 1.4rem;
  }

}

@media (max-width: 1000px) and (orientation: landscape) {

  .signature-name {
    font-size: 1.4rem;
  }

}

/* 📱 Téléphones */
@media (max-width: 900px) {
  .signature-name {
    font-size: 1.4rem;
  }
}

/* 💻 Tablettes paysage */
@media (min-width: 1000px) and (orientation: landscape) {
  .signature-name {
    font-size: 1.4rem;
  }
}



@media (max-width: 900px) and (orientation: landscape) {

  /* 1. Taille du lien = même que le paragraphe */
  .contact-email-section .contact-p a.blog-sommaire-lien {
    font-size: inherit !important;
  }

  /* 2. Fleur avant le lien */
  .contact-email-section .contact-p a.blog-sommaire-lien::before {
    margin-right: 6px; /* espace entre fleur et texte */
    display: inline-block;
  }

}

@media (max-width: 768px) {

  .contact-email-section .contact-p {
    font-size: 1.2rem !important;
    /*color: orange !important;*/
    line-height: 1.6;
  }

  .contact-email-section .contact-p a.blog-sommaire-lien {
    font-size: inherit;
  }

}


@media (max-width: 1024px) and (orientation: portrait) {

  .contact-email-section .contact-p {
    font-size: 1.25rem;
    line-height: 1.6;
  }

  .contact-email-section .contact-p a.blog-sommaire-lien {
    font-size: inherit;
  }

}

@media (max-width: 800px) {

  .account-dashboard {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }

  .account-card {
    display: flex;
  align-items: center;     /* 🔥 centre verticalement */
  justify-content: center; /* centre horizontalement */
  text-align: center;
    width: 100%;
    box-sizing: border-box;

    padding: 6px 8px !important; /* 🔥 réduit largeur */

    white-space: normal !important;
    overflow-wrap: anywhere !important;

    text-align: center;
  }

}


.account-form button {
  display: block;
  margin: 2px auto 0;
}

@media (max-width: 768px) and (orientation: portrait) {

  .account-form button {
    padding-top: 6px;
    padding-bottom: 6px;
  }

}

@media (max-width: 900px) and (orientation: landscape) {

  .account-form button {
    padding: 6px 16px;
  }

}

@media (min-width: 768px) and (max-width: 1200px) and (orientation: landscape) {

  .account-form button {
    padding: 8px 18px;
  }

}

.cgv-p,
.cgv-li {
  font-size: 1.1rem;
  line-height: 1.7;
}

/* mobile portrait */
@media (max-width: 768px) {

  .cgv-p,
  .cgv-li,
  .cgv-li * {
    font-size: 1rem !important;
    line-height: 1.6;
  }

  .faq-titres-rubriques {
    text-shadow: 1px px 1px var(--texte-principal) !important;
    font-size: 1.6em !important;
  }

  main.blog-content .blog-intro li {
    font-size: inherit !important;
  }

  .question {
    color: var(--accent-violet) !important;
    font-weight: bold !important;
    font-size: 1rem !important;
    text-shadow: 0px 1px var(--accent-violet) !important;
  }
}

/* mobile paysage */
@media (max-width: 900px) and (orientation: landscape) {

  .cgv-p,
  .cgv-li,
  .cgv-li * {
    font-size: 1rem !important;
    line-height: 1.6;
  }
  main.blog-content .blog-intro li {
    font-size: inherit !important;
  }

 .question {
    color: var(--accent-violet) !important;
    font-weight: bold !important;
    font-size: 1rem !important;
    text-shadow: 0px 1px var(--accent-violet) !important;
  }

}

/*
@media (max-width: 900px) and (orientation: landscape) {

  body .answer,
  body li.answer-puces {
    font-size: 1.1rem !important;
    line-height: 1.6 !important;
  }

  body .answer *,
  body li.answer-puces * {
    font-size: 1.1rem !important;
  }

}
*/

/* ATTENTION NOUVEAU pourrait poser des soucis, utilisé
pour taille puces dans faq à enlever si souci et à revoir dans la page concernée*/
html {
  -webkit-text-size-adjust: 100%;
}


@media (max-width: 900px) and (orientation: landscape) {

  body .blog-content ul li.answer-puces {
    font-size: 1.1rem !important;
  }

}



/* tablette portrait */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {

  .cgv-p,
  .cgv-li,
  .cgv-li * {
    font-size: 1.05rem !important;
    line-height: 1.6;
  }
}

/* tablette paysage */
@media (min-width: 768px) and (max-width: 1200px) and (orientation: landscape) {

  .cgv-p,
  .cgv-li,
  .cgv-li * {
    font-size: 1.05rem !important;
    line-height: 1.6 !important;
  }

}

@media (min-width: 800px) and (max-width: 1300px) and (max-height: 900px) {

  li.cgv-li,
  li.cgv-li * {
    font-size: 1.2rem !important;
  }

}


@media (max-width: 767px) and (orientation: portrait) {

  /* Alignement global */
  .nav-sommaire ul {
    text-align: left !important;
    padding-left: 1rem !important;
  }

  .nav-sommaire li {
    text-align: left !important;
  }

  /* 🔥 LIENS : taille + alignement */
  .blog-h2 {
    font-size: 1.9rem !important;
  }

  .nav-sommaire li a {
    display: inline !important;
    text-align: left !important;
    font-size: 1.2rem !important;
    line-height: 1.4 !important;
  }

  /* 🌸 FLEUR (pseudo-élément before) */
  .nav-sommaire li a::before {
    font-size: 1.1rem !important;
    margin-right: 6px !important; /* espace avec le texte */
  }

}

@media (max-width: 767px) {

  /* Alignement global */
  .nav-sommaire ul {
    text-align: left !important;
    padding-left: 0.8rem !important;
  }

  .nav-sommaire li {
    text-align: left !important;
  }

  /* TITRE */
  .blog-h2 {
    font-size: 1.4rem !important;
  }

  /* 🔥 LIENS */
  .nav-sommaire li a {
    display: inline !important;
    text-align: left !important;
    font-size: 1.1rem !important;
    line-height: 1.5 !important;
  }

  /* 🌸 FLEUR */
  .nav-sommaire li a::before {
    font-size: 0.95rem !important;
    margin-right: 5px !important;
  }

}

.mon-compte {
  text-align: center !important;
}




.question {
  color: var(--accent-violet) !important;
}


/* ipad */
@media (min-width: 1024px) and (max-width: 1366px) and (orientation: landscape) {

  .blog-content ul li.answer-puces {
    font-size: 1.1rem !important;
    line-height: 1.7 !important;
  }

  .blog-content ul li.answer-puces * {
    font-size: inherit !important;
  }

}

@media (min-width: 768px) and (max-width: 1366px) {

  body .blog-content ul li.answer-puces {
    font-size: 1.1rem !important;
    line-height: 1.7 !important;
  }

  body .blog-content ul li.answer-puces * {
    font-size: 1.1rem !important;
  }

}


/* Bannière de consentement des cookies complianz */
.breadcrumb {
  font-size: 0.8rem;
  opacity: 0.6;
  margin-bottom: 20px;
}

.breadcrumb a {
  text-decoration: none;
  color: #880e4f;
}

.breadcrumb a:hover {
  text-decoration: underline;
}



/* Page Cookies */
.cookie-policy #content {
  background-color: var(--fond-blanc);
  display: flex;
  justify-content: center;
  padding: 40px 20px;
}

.cookie-policy #cmplz-document {
  max-width: 800px;
  width: 100%;
}

.cmplz-document h1 {
  margin-bottom: 20px;
}

 .cmplz-document h2 {
  color: var(--accent-rose-vif) !important;
  margin-top: 50px !important;
  margin-bottom: 15px;
  font-size: 24px !important;
}

.cgv-breadcrumb {
  max-width: 900px;
  margin: 20px auto 0;
  padding: 0 40px;
}

#cmplz-document {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 20px;
  background: #fff;
}

#content {
  background: var(--fond-blanc);
}

/* date d'application */
#cmplz-document > p:first-of-type > i {
  font-style: normal !important;
  font-weight: bold !important;
  color: var(--texte-principal) !important;
  font-size: 1.1rem !important;
  margin-bottom: 2rem !important;
  text-align: center !important;
  font-family: var(--font-textes) !important;
}

/* ensemble des p */
#cmplz-document p {
  font-size: 1.2rem !important;
  margin-bottom: 2rem !important;
  color: var(--texte-principal) !important;
  margin-bottom: 2rem !important;
  line-height: 1.6 !important;
  text-align: justify !important;
  font-family: var(--font-textes) !important;
  font-weight: normal !important;
}


#cmplz-document p strong,
#cmplz-document p b {
  font-size: 1.30em !important;
  margin-bottom: 2rem !important;
  color: var(--texte-principal) !important;
  margin-bottom: 2rem !important;
  line-height: 1.6 !important;
  text-align: justify !important;
  font-family: var(--font-textes) !important;
  font-weight: bold !important;
}

#cmplz-document a {
  color: var(--accent-rose-vif);
  font-weight: bold;
  text-decoration:none;
}

#cmplz-document a:hover {
  text-decoration: none;
  color: var(--accent-violet);
}

/* comme un h3 */
#cmplz-document .cmplz-subtitle {
  font-size: 16px;
  font-weight: bold !important;
  color: var(--accent-violet) !important;
  margin-top: 25px;
  margin-bottom: 10px;
}

#cmplz-document li {
  font-size: 1.2rem !important;
  margin-bottom: 2rem !important;
  color: var(--texte-principal) !important;
  line-height: 1.6 !important;
  text-align: justify !important;
  font-family: var(--font-textes) !important;
  font-weight: normal !important;

  list-style: none;
  position: relative;

  /* espace pour la fleur */
  padding-left: 2.2rem;
}

#cmplz-document li::before {
  content: "🌸";
  position: absolute;
  left: 0;
  top: 0.1rem;
  font-size: 0.95rem;
  color: #7a5c7a;
}

@media (max-width: 768px) {

  #cmplz-document li {
    font-size: 1rem !important;
    margin-bottom: 1.2rem !important;
    padding-left: 1.8rem;
    text-align: left !important; /* mieux lisible sur mobile */
  }

  #cmplz-document li::before {
    font-size: 0.85rem;
    top: 0.05rem;
  }
}

.cmplz-obfuscate {
  display: none;
}

.cmplz-contact-email::after {
  content: "contact@atelier-sakura.fr";
  color: var(--accent-rose-vif);
  font-weight: bold;
  text-decoration:none;
}


#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active {
  font-size: var(--cmplz_category_header_active_font_size);
  color: #880e4f !important;
  font-weight: bold !important;
  opacity: 1 !important;
  font-size: 0.9rem !important;
}


#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category {
  background-color: #fff0f5 !important;
}


span .cmplz-category-title {
  color: #d63384 !important;
  font-size: 1rem !important;
}

#cmplz-document .cmplz-description-functional,
#cmplz-document .cmplz-description-marketing {
  color: var(--texte-principal) !important;
  font-size: 1rem !important;
  font-weight: normal !important;
}

.cmplz-category-header {
  background-color: var(--accent-doux) !important;
}

.cmplz-icon svg {
  fill: var(--texte-principal) !important;
}

#cmplz-document .cmplz-service-header {
  background-color: var(--accent-doux) !important;
}

.name-header h5, .retention-header h5, .function-header h5 {
  color: var(--accent-rose-vif) !important;
  text-align: center !important;
}

.name, .retention, .function {
  color: var(--texte-principal) !important;
}

#cmplz-cookies-overview * {
  font-family: var(--font-textes) !important;
}

#cmplz-cookies-overview p,
#cmplz-cookies-overview summary p {
  font-size: 15px !important;
  color: var(--texte-principal) !important;
}


/* responsiveness de la page cookies */

/* tablette portrait */
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {

#cmplz-document p {
   font-size: 1.1rem !important;
}

#cmplz-document p strong,
#cmplz-document p b {
   font-size: 1.1rem !important;
}
  #cmplz-document li {
    font-size: 1.1rem !important;
    line-height: 1.6 !important;
  }

#cmplz-document h2 {
  font-size: 20px !important;
}
}


/* tablette paysage */
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

  #cmplz-document p {
    font-size: 1rem !important;
  }

  #cmplz-document p strong,
  #cmplz-document p b {
    font-size: 1rem !important;
  }

  #cmplz-document li {
    font-size: 1rem !important;
    line-height: 1.6 !important;
  }

  #cmplz-document h2 {
    font-size: 19px !important;
  }

}

/* téléphones */
/* 📱 MOBILE PORTRAIT */
@media screen and (max-width: 767px) and (orientation: portrait) {

  #cmplz-document p {
    font-size: 1rem !important;
  }

  #cmplz-document p strong,
  #cmplz-document p b {
    font-size: 1rem !important;
  }

  #cmplz-document li {
    font-size: 1rem !important;
    line-height: 1.6 !important;
  }

  #cmplz-document h2 {
    font-size: 18px !important;
  }
  #cmplz-document h3 {
    font-size: 13px !important;
  }
  #cmplz-cookies-overview p, #cmplz-cookies-overview summary p {
  font-size: 13px !important;
  color: var(--texte-principal) !important;
  margin-top: 30px !important;
}

}


/* 📱 MOBILE PAYSAGE */
@media screen and (max-width: 767px) and (orientation: landscape) {

  #cmplz-document p {
    font-size: 0.95rem !important;
  }

  #cmplz-document p strong,
  #cmplz-document p b {
    font-size: 0.95rem !important;
  }

  #cmplz-document li {
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
  }

  #cmplz-document h2 {
    font-size: 17px !important;
  }

  #cmplz-document h2 {
    font-size: 18px !important;
  }

  #cmplz-document h3 {
    font-size: 13px !important;
  }

  #cmplz-cookies-overview p, #cmplz-cookies-overview summary p {
  font-size: 13px !important;
  color: var(--texte-principal) !important;
  margin-top: 30px !important;
  }
}





/* 📱 Tablettes + mobiles (portrait + paysage) */
@media screen and (max-width: 1200px),

/* 📱📲 Tous les paysages (mobiles + tablettes) */
screen and (orientation: landscape) and (max-width: 1600px) {

#cmplz-cookies-overview .cmplz-dropdown summary p, #cmplz-document .cmplz-dropdown summary p {
    margin-top: 30px !important;
    color: red !important;
  }
}


.page-id-1680 .atelier-breadcrumb {
  width: 100%;
  background: transparent;
  padding-left: 40px; /* ajuste selon rendu Mentions légales */
}


.woocommerce-account .woocommerce {
    font-family: var(--font-textes);
}

/* EXCEPTION TITRES */
.woocommerce-account .woocommerce h1,
.woocommerce-account .woocommerce h2,
.woocommerce-account .woocommerce h3 {
    font-family: inherit; /* ou ta font titres si tu en as une */
}

/* mise en forme de la page Voir ma commande */
body.woocommerce-view-order .woocommerce-MyAccount-content td.product-name,
body.woocommerce-view-order .woocommerce-MyAccount-content td.product-quantity {
  font-family: var(--font-textes) !important;
  font-size: 1.3em !important;
  font-weight: 500 !important;
  color: var(--texte-principal) !important;
}

.woocommerce-account .large-9 {
    width: 100% !important;
    max-width: 100% !important;
}



/* responsiveness du bandeau page accueil */

/* 📱 MOBILE PORTRAIT UNIQUEMENT */
@media (max-width: 767px) and (orientation: portrait) {

  .hero {
    min-height: 50vh;
    padding: 2.5rem 1.2rem;
  }

  .hero h1 {
    font-size: 1.9rem;
    line-height: 1.3;
  }

  .hero p {
    font-size: 1.1rem;
    /* color: blue !important; */
    font-family: var(--font-textes) !important;
    font-weight: normal !important;
    text-align: justify !important;
  }
}

/* PAYSAGE */
@media (orientation: landscape) {
   .hero {
    min-height: 40vh; /* plus bas car écran peu haut */
    padding: 1.5rem 1rem;
  }

  .hero h1 {
    font-size: 2.2rem !important;
    line-height: 1.2;
    /*color: red !important; /* DEBUG */
  }

  .hero p {
    font-size: 1rem !important;
    text-align: center !important;
  }
}

/* 📱 Mobile portrait (≤ 767px) */
@media (max-width: 767px) and (orientation: portrait) {

  .hero {
    min-height: 50vh;
    padding: 2.5rem 1.2rem;
  }

  .hero h1 {
    font-size: 1.9rem;
    line-height: 1.3;
  }

  .hero p {
    font-size: 1.1rem;
  }
}


/* 📱 Mobile paysage (≤ 767px + landscape) */
@media (max-width: 767px) and (orientation: landscape) {

  .hero {
    min-height: 40vh;
    padding: 1.5rem 1rem;
  }

  .hero h1 {
    font-size: 1.6rem;
    line-height: 1.2;
  }

  .hero p {
    font-size: 1rem;
  }
}

/* 📟 Tablette portrait (768px – 1024px) */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {

  .hero {
    min-height: 45vh; /* réduit fortement */
    max-height: 70vh; /* évite les hero trop grands */
    padding: 2.5rem 2rem;
  }

  .hero h1 {
    font-size: 2.2rem;
  }

  .hero p {
    font-size: 1.1rem;
  }
}

/* 📟 Tablette paysage (768px – 1024px + landscape) */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

  .hero {
    min-height: 38vh;   /* clé pour éviter l’effet “géant” */
    max-height: 60vh;
    padding: 2rem 2rem;
  }

  .hero h1 {
    font-size: 2rem;
  }

  .hero p {
    font-size: 1.05rem;
  }
}

/* 💻 Desktop (≥ 1025px) */
@media (min-width: 1025px) {

  .hero {
    min-height: 60vh;
    padding: 4rem 3rem;
  }

  .hero h1 {
    font-size: 2.9rem !important;
  }

  .hero p {
    font-size: 1.2rem !important;
  }
}


/* hero de la page boutique responsive et pc */

/* PC*/
.hero-blog {
  width: 100%;
  min-height: clamp(320px, 52vh, 620px);

  display: flex;
  align-items: center;
  justify-content: center;

  background-image: url("http://localhost/atelier-sakura-wp/wp-content/uploads/2025/06/hero-bijoux-1.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  margin-bottom: 3rem;
}

.hero-blog-overlay {
  background: rgba(0,0,0,0.3);
  padding: clamp(1.5rem, 3vw, 3rem);
  text-align: center;
  width: 100%;
}

.hero-blog-title {
  font-size: clamp(2rem, 3vw, 2.8rem);
  margin-bottom: 1rem;
}

.hero-blog-subtitle {
  font-size: clamp(1rem, 1.3vw, 1.2rem);
}



/* tablette */
@media (min-width: 768px) and (max-width: 1024px) {

  .hero-blog {
    min-height: 42vh;
  }

  .hero-blog-overlay {
    padding: 2rem;
  }
}


/* mobile portrait */
@media (max-width: 767px) {

  .hero-blog {
    min-height: 38vh;
    margin-bottom: 2rem;
  }
}

/* mobile paysage */
@media (max-width: 767px) and (orientation: landscape) {

  .hero-blog {
    min-height: 32vh;
  }
}

/* FIN PAGE BOUTIQUE */

/* PAGE A PROPOS */
/* VERSION PC */
.hero.hero-about {
  width: 100%;
  min-height: clamp(320px, 52vh, 620px);
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("http://localhost/atelier-sakura-wp/wp-content/uploads/2025/12/hero-a-propos.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-bottom: 3rem;
}

 .hero.hero-about .hero-content p.a-propos-hero-p-secondaire {
    font-size: 2rem !important;
    text-shadow: 2px 1px var(--texte-principal) !important;
    font-weight: bold !important;
    color: var(--accent-secondaire) !important;
  }

  p.a-propos-hero-p-secondaire span {
    font-size: 1.6rem !important;
  }


/* téléphone portrait */
@media screen and (max-width: 767px) and (orientation: portrait) {

  .hero.hero-about {
    min-height: 38vh; /* 🔥 identique page boutique */
    margin-bottom: 2rem;
    background-position: center top;
    align-items: flex-start; /* 🔥 clé : enlève centrage vertical */
    padding-top: 1rem;     /* contrôle l’espace en haut */
  }

  .hero.hero-about .hero-content h1 {
  padding-top: 0 !important;
  margin-top: 14px !important; /* léger + propre */
}

  .hero.hero-about .hero-content p.a-propos-hero-p-secondaire {
    font-size: 1.50rem !important;
    line-height: 1.25;
    text-align: center !important;
    text-shadow: 2px 1px var(--texte-principal) !important;
    font-weight: bold !important;
    color: var(--accent-secondaire) !important;
    max-width: 95%;        /* 🔥 laisse plus de largeur utile */
    margin: 0 auto;        /* centre proprement */
  }

  section.hero.hero-about .hero-content h1 {
    margin-top: 0px !important;
  }

  p.a-propos-hero-p-secondaire span {
    font-size: 1.3rem !important;
    text-align: center !important;
    text-shadow: 1px 1px var(--texte-principal) !important;
    margin-bottom: 4px !important; /* 🔥 petit espace contrôlé */
  }

  /* optionnel mais souvent nécessaire pour éviter “air vertical” */
  .hero-divider,
  .hero h1 {
    margin-bottom: 20px !important;
  }
}

/* fin ajustement a propos téléphone portrait */


/* ajustement responsiveness téléphone paysage */
/* mobile paysage */
@media screen and (max-width: 900px) and (max-height: 500px) {
  .hero.hero-about {
  min-height: auto;
  height: auto;
}

.hero.hero-about h1 {
  margin-bottom: 10px !important;
}

.hero.hero-about .hero-content p.a-propos-hero-p-secondaire {
  font-size: 1.2rem !important;
  line-height: 1.2;
}


.hero.hero-about .hero-divider {
   margin: 10px auto !important; /* 🔥 top/bottom + centrage */
}

  .hero.hero-about .hero-content p.a-propos-hero-p-secondaire {
    font-weight: bold !important;
    color: var(--accent-secondaire) !important;
    text-shadow: 2px 1px var(--texte-principal) !important;
    font-size: 1.7rem !important;
  }

  .hero.hero-about p.a-propos-hero-p-secondaire span {
  font-size: 1.4rem !important; /* 🔥 ajuste selon ton rendu */
}
}

/* Grande tablette comme l'ipad pro en portrait */
@media screen and (max-width: 1366px) and (min-width: 768px) {

 .hero.hero-about {
    min-height: 20vh !important; /* comme boutique mobile */
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .hero.hero-about .hero-content {
    padding: 0rem !important;
  }

  .hero.hero-about .hero-content p.a-propos-hero-p-secondaire {
    text-shadow: 2px 1px var(--texte-principal) !important;
    font-weight: bold !important;
    color: var(--accent-secondaire) !important;
  }
}

/* réglage paysage sur certains mobiles */
@media screen and (max-height: 500px) {
  .hero.hero-about {
    min-height: auto !important;
    height: auto !important;
  }

  .hero.hero-about .hero-content {
    min-height: auto !important;  /* 🔥 CRUCIAL */
    height: auto !important;
  }
  .hero.hero-about .hero-content p.a-propos-hero-p-secondaire {
  font-size: 1.5rem !important;
  line-height: 1.3 !important;
}

  .hero.hero-about .hero-content p.a-propos-hero-p-secondaire {
    font-size: 1.3rem !important;;
  }
}

/* fin réglages /*

/* PAGE CONTACT PC */
.hero.hero-about.hero-contact {
  width: 100%;
  min-height: clamp(320px, 52vh, 620px);
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("http://localhost/atelier-sakura-wp/wp-content/uploads/2025/06/contact.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-bottom: 3rem;
}

.hero h1 {
  color: var(--accent-doux) !important;
  text-shadow: 1px 1px var(--accent-rose-vif) !important;
}

.hero.hero-about .hero-content p.a-propos-hero-p-secondaire-contact {
  font-size: 1.7rem !important;
  font-weight: bold !important;
  color: var(--accent-secondaire) !important;
  text-shadow: 2px 1px var(--texte-principal) !important;
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

.hero.hero-about .hero-content p.a-propos-hero-p-secondaire-contact span {
  color: var(--accent-doux) !important;
  text-shadow: 2px 1px var(--texte-principal) !important;

}

p.a-propos-hero-p-secondaire-contact span {
    font-size: 1.6rem !important;
  }


/* responsiveness page Contact portable portrait */
@media screen and (max-width: 767px) and (orientation: portrait) {

  .hero.hero-contact {
    width: 100%;
    min-height: 38vh;
    margin-bottom: 2rem;

    display: flex;
    flex-direction: column;

    justify-content: flex-start;
    align-items: center;

    padding: 0.8rem 1rem !important; /* 🔥 FIX PRINCIPAL */

    background-position: center top;
  }

  .hero.hero-contact .hero-content {
    width: 100%;
    margin: 0 !important;
    padding: 0 15px !important;

    display: flex;
    flex-direction: column;
    align-items: center;

    min-height: auto; /* 🔥 important */
  }

  .hero.hero-contact h1 {
    margin: 15px 0 10px 0 !important; /* 🔥 comme blog */
    line-height: 1.1;
  }

  section.hero.hero-about.hero-contact .hero-content h1 {
      margin-top: 0px !important;
    }

  .hero.hero-contact .hero-divider {
    margin: 6px auto 10px auto !important;
  }

 .hero.hero-about.hero-contact .hero-content p.a-propos-hero-p-secondaire-contact {
    font-size: 1.4rem !important;
    line-height: 1.4;
    text-align: center !important;
    max-width: 85%; /* 🔥 meilleur confort tablette */
  }

  .hero.hero-about.hero-contact .hero-content p.a-propos-hero-p-secondaire-contact span {
    font-size: 1.4rem !important;
    line-height: 1.4;
    text-align: center !important;
    color: var(--accent-secondaire) !important;
    display: block;
    margin-top: 10px;
  }
}



/* responsiveness sur tablette portrait page contact */
@media screen and (max-width: 767px) and (orientation: portrait) {
  .hero.hero-contact {
    min-height: 42vh; /* 🔥 un peu plus d’espace que mobile */
    margin-bottom: 2rem;
    background-position: center top;

    display: flex;
    flex-direction: column;

    justify-content: flex-start;
    align-items: center;

    padding: 1rem 1.5rem;
  }

  .hero.hero-contact .hero-content {
    width: 100%;
    margin: 0;
    padding: 0 20px;

    display: flex;
    flex-direction: column;
    align-items: center;

    min-height: auto; /* 🔥 évite les bugs de débordement */
  }

  .hero.hero-contact h1 {
    margin: 20px 0 12px 0 !important;
    line-height: 1.15;
    font-size: 2rem; /* 🔥 légèrement plus grand que mobile */
  }

  .hero.hero-about .hero-content h1 {
    margin-top: 130px !important;
  }

  .hero.hero-contact .hero-divider {
    margin: 8px auto 12px auto !important;
  }

  .hero.hero-contact p.a-propos-hero-p-secondaire-contact {
    font-size: 1.5rem !important;
    line-height: 1.4;
    text-align: center !important;
    max-width: 85%; /* 🔥 meilleur confort tablette */
  }

  .hero.hero-contact p.a-propos-hero-p-secondaire-contact span {
    font-size: 1.3rem !important;
    line-height: 1.6;
    text-align: center !important;
  }
}

/* 📱 TABLETTE PORTRAIT */
@media screen and (orientation: portrait) and (min-width: 768px) {

  .hero.hero-contact {
    min-height: 42vh;
    margin-bottom: 2rem;

    display: flex;
    flex-direction: column;

    justify-content: flex-start; /* 🔥 cohérent avec mobile */
    align-items: center;

    padding: 1rem 2rem;
    background-position: center top;
  }

  .hero.hero-contact .hero-content {
    width: 100%;
    margin: 0;
    padding: 0 25px;

    display: flex;
    flex-direction: column;
    align-items: center;

    min-height: auto; /* 🔥 évite les bugs */
  }

  /* ===== TITRE ===== */
  .hero.hero-contact h1 {
    margin: 25px 0 15px 0 !important;
    line-height: 1.15;
    font-size: 2.2rem;
  }

  /* ===== DIVIDER ===== */
  .hero.hero-contact .hero-divider {
    margin: 8px auto 12px auto !important;
  }

  /* ===== TEXTE ===== */
  .hero.hero-contact p.a-propos-hero-p-secondaire-contact {
    font-size: 1.6rem !important;
    line-height: 1.45;
    text-align: center;

    max-width: 80%; /* 🔥 confort tablette */
  }

  .hero.hero-contact p.a-propos-hero-p-secondaire-contact span {
    font-size: 1.4rem !important;
    line-height: 1.6;
  }
}





/* page Blog générale PC */
.hero.hero-contact.hero-blog {
  width: 100%;
  min-height: clamp(320px, 52vh, 620px);

  display: flex;
  align-items: center;
  justify-content: center;

  background-image: url("http://localhost/atelier-sakura-wp/wp-content/uploads/2025/05/blog-hero.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  margin-bottom: 3rem;
}

.hero h1 {
  color: var(--accent-doux) !important;
  text-shadow: 2px 1px var(--accent-rose-vif) !important;
}

.hero.hero-about .hero-content p.a-propos-hero-p-secondaire-contact {
  font-size: 1.7rem !important;
  font-weight: bold !important;
  color: var(--fond-blanc) !important;
  text-shadow: 2px 1px black !important;
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

.hero.hero-about .hero-content p.a-propos-hero-p-secondaire-contact span {
  color: var(--accent-doux) !important;
  text-shadow: 2px 1px var(--texte-principal) !important;

}

p.a-propos-hero-p-secondaire-contact span {
    font-size: 1.6rem !important;
  }


 /* fin pc */

/* ajustements pour portable portrait */
/* 📱 BLOG - MOBILE PORTRAIT */
@media screen and (max-width: 767px) and (orientation: portrait) {

  .hero.hero-contact.hero-blog {
    width: 100%;
    min-height: 38vh;
    margin-bottom: 2rem;

    display: flex;
    flex-direction: column;

    justify-content: flex-start; /* 🔥 évite effet trop bas */
    align-items: center;

    padding: 0.8rem 1rem;

    background-size: cover;
    background-position: center top;
  }

  /* ===== TITRE ===== */
  section.hero.hero-blog h1 {
    font-size: 1.8rem;
    line-height: 1.2;
    margin: 15px 0 10px 0 !important;
    color: var(--accent-doux) !important;
    text-shadow: 2px 1px var(--accent-rose-vif) !important;
    text-align: center;
  }


.hero.hero-about.hero-contact.hero-blog .hero-content h1 {
  margin-top: 0px !important;
}

  /* ===== DIVIDER ===== */
  .hero.hero-contact.hero-blog .hero-divider {
    margin: 6px auto 10px auto !important;
  }

  /* ===== TEXTE ===== */
  .hero.hero-contact.hero-blog .hero-content p.a-propos-hero-p-secondaire-contact {
    font-size: 1.4rem !important;
    line-height: 1.4;

    font-weight: bold !important;
    color: var(--fond-blanc) !important;
    text-shadow: 2px 1px black !important;

    text-align: center;
    max-width: 95%;

    padding: 0;
    margin: 0;
  }

  /* ===== SPAN ===== */
  .hero.hero-contact.hero-blog p.a-propos-hero-p-secondaire-contact span {
    font-size: 1.1rem !important;
    line-height: 1.4;

    color: var(--accent-doux) !important;
    text-shadow: 2px 1px var(--texte-principal) !important;
  }
}
/* fin des ajustements */



/* responsiveness page matière papier washi */
@media (max-width: 849px) {
  .shop-container .hero-blog-subtitle {
    font-size: 1.2rem !important;
    }
}
/* fin responsiveness page matière papier washi */


/* refonte article de blog */
/* POUR PC */
/* HERO BLOG FULL WIDTH PC */

/* IMAGE */
.hero-image {
  position: relative;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  display: block; /* 🔥 important */
}

.hero-image img {
  width: 100%;
  height: auto;
  display: block;
}


.hero-text h1 {
  display: inline-block !important;
  padding: 0.5rem 1rem !important;
  border-radius: 6px !important;
  color: var(--fond-blanc) !important;
  text-shadow:
    1px 1px 3px rgba(0,0,0,0.6),
    0 0 10px rgba(0,0,0,0.4);
}

  .blog-h1-rose {
    color: var(--fond-blanc) !important;
    text-shadow: 3px 3px var(--accent-violet) !important;
  }

  .hero-text {
    padding-top: 20px !important;
  }


/* blog header boutons de navigation et breadcrumb */
.hero-article {
  height: 60vh;
  background-size: cover;
  background-position: center;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-overlay {
  background: rgba(0,0,0,0.35);
  padding: 40px;
  text-align: center;
  color: white;
}

.hero-image {
  position: relative;
  width: 100%;
  height: 60vh;
  overflow: hidden;
}

.hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: white;
}

.blog-h1 br {
  content: "" !important;
  display: block !important;
  margin-bottom: 10px !important;
}

.blog-h1 span,
.blog-h1-rose {
  display: block !important;
}

.hero-image {
  height: 60vh;
  overflow: hidden;
}

.hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.hero-image img {
  transform: none !important;
  transition: none !important;
}

.hero-image img:hover {
  transform: none !important;
}

.hero-image:hover,
.hero-image:hover * {
  filter: none !important;
  box-shadow: none !important;
}


.grid-images-sakura {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 40px 0;
}

.grid-images-sakura figure {
  text-align: center;
  margin: 0;
}

.grid-images-sakura img {
  width: 100%;
  height: auto;
  border-radius: 8px;
}

/* RESPONSIVENESS PAGE BLOG ARTICLE SUR MOBILE PORTRAIT */
/* hero mobile portrait */
@media (max-width: 768px) {

  .hero-text {
    width: 100%;
    max-width: 100%;
    padding: 0 15px !important;
    box-sizing: border-box;
    text-align: center;
  }

  .blog-h1 {
    display: block; /* important */
    width: 100%;
    font-size: 1.6rem;
    line-height: 1.3;
  }

  .blog-h1-rose {
    display: block; /* force le passage à la ligne propre */
    font-size: 1.2rem;
    margin-top: 8px;
  }

  /* fil d'ariane */
  .article-header {
    font-size: 0.9rem;
    line-height: normal;
  }

  .article-header a {
    font-size: 0.9rem;
  }

/* flèche navigation articles */
 .post-navigation {
    display: none;
  }

/* largeur du texte */
  .container {
    width: 100%;
    max-width: 100%;
    padding-left: 12px;
    padding-right: 12px;
  }

  /* taille du texte et justification */
  .blog-p {
    font-size: 1.2rem !important;
    line-height: 1.6;
    text-align: justify;
  }

  /* h3 */
  .blog-h3-titre-rubrique {
    font-size: 1.3rem !important;
    line-height: 1.4;
    margin-top: 20px;
    margin-bottom: 10px;
    text-shadow: none !important;
    font-weight: bold !important;
  }

  /* li */
   .blog-li {
    text-align: left !important;
  }
}


/* 📱 MOBILE PAYSAGE */
@media (max-width: 1024px) and (orientation: landscape) {
  /* HERO */
  .hero-text {
    width: 100%;
    max-width: 100%;
    padding: 0 20px !important;
    box-sizing: border-box;
    text-align: center;
  }

  .blog-h1 {
    display: block;
    width: 100%;
    font-size: 1.8rem; /* un peu plus petit qu'en portrait */
    line-height: 1.2;
  }

  .blog-h1-rose {
    display: block;
    font-size: 1.4rem;
    margin-top: 6px;
  }

  /* limiter la hauteur du hero (important paysage) */
  .hero-image {
    min-height: 220px;
  }

  /* FIL D’ARIANE */
  .article-header {
    font-size: 0.9rem;
  }

  .article-header a {
    font-size: 0.9rem;
  }

  /* NAVIGATION */
  .post-navigation {
    display: none;
  }

  /* CONTENU PLUS LARGE */
  .container {
    width: 100%;
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  /* TEXTE */
  .blog-p {
    font-size: 1.1rem !important;
    line-height: 1.6;
    text-align: justify; /* très important en paysage */
  }

  /* H3 */
  .blog-h3-titre-rubrique {
    font-size: 1.15rem !important;
    line-height: 1.4;
    margin-top: 18px;
    margin-bottom: 8px;
    text-shadow: none !important;
    font-weight: bold !important;
  }

  /* LISTES */
  .blog-li {
    text-align: left !important;
    font-size: 1.1rem !important;
  }

  /* liens du sommaire de l'article de blog */

}


@media (hover: none) and (pointer: coarse) {

  .post-navigation {
    display: none !important;
  }

}


/* réglage portable paysage pour la page FAQ */
/* 📱 MOBILE PAYSAGE */
@media (max-width: 1024px) and (orientation: landscape) {

  .hero-blog {
    min-height: 200px;
    margin-bottom: 2rem !important;
  }

  .hero-blog-overlay {
    padding: 1rem !important;
  }

  .hero-blog-title {
    font-size: 1.7rem !important;
    line-height: 1.2;
    margin-top: 5px !important;
  }

  .hero-blog-subtitle {
    font-size: 1.3rem !important;
    line-height: 1.4;
  }

  /* Page blog uniquement */
 .hero-blog .hero-divider {
    display: block !important;
    width: 80px;
    height: 2px;
    background-color: #ffffff !important;
    margin: 10px auto !important;
    opacity: 1 !important;
    visibility: visible !important;
  }


 .hero-blog-overlay {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: visible !important; /* 🔥 important */
  }

  .hero-divider {
    display: block !important;
    width: 60px;
    height: 2px;
    background: white !important;
    margin: 10px auto;
    flex-shrink: 0; /* 🔥 empêche qu'il disparaisse */
  }
}


/* responsiveness de la loupe */

/* 📱 Mobile portrait */
@media screen and (max-width: 480px) {

  body {
    overflow-x: hidden;
  }

  input[type="search"] {
    width: calc(100% - 24px) !important;
    margin: 0 12px !important;
  }

}

/* 📲 Tous les écrans (mobile + tablette) → réglage principal */
@media screen and (max-width: 1280px) {

  .search-overlay-content input {
    margin-top: -30vh !important;
  }

}

/* 🔄 Override paysage (mobile + tablette) */
@media screen and (max-width: 1280px) and (orientation: landscape) {

  .search-overlay-content input {
    margin-top: -6vh !important; /* ajuste ici */
  }

}

/* pc bouton image suivante et précédente au survol de l'image produit
sur la page produit */
.slider-show-nav .flickity-prev-next-button, .slider:hover .flickity-prev-next-button {
  fill: var(--fond-blanc) !important;
  color: var(--fond-blanc) !important;
}



/* =========================
 RESPONSIVENESS DES PUCES sur la page produit
========================= */
/* =========================
   TEXTE IDENTIQUE P + UL + LI
========================= */

/* =========================
   TEXTE BLOG IDENTIQUE
   P + UL + LI
========================= */

/* DESKTOP */
.blog-content .blog-p,
.blog-content .blog-intro ul li,
.blog-content .blog-li {
    font-size: 1.05rem !important;
    line-height: 1.9 !important;
    font-weight: 400;
}

/* TABLETTE */
@media screen and (max-width: 1024px) {

    .blog-content .blog-p,
    .blog-content .blog-intro ul li,
    .blog-content .blog-li {
        font-size: 1rem !important;
        line-height: 1.8 !important;
    }

}

/* MOBILE */
@media screen and (max-width: 768px) {

    .blog-content .blog-p,
    .blog-content .blog-intro ul li,
    .blog-content .blog-li {
        font-size: 0.98rem !important;
        line-height: 1.75 !important;
    }

}

/* PETIT MOBILE */
@media screen and (max-width: 480px) {

    .blog-content .blog-p,
    .blog-content .blog-intro ul li,
    .blog-content .blog-li {
        font-size: 0.95rem !important;
        line-height: 1.7 !important;
    }

}

.h2-blog {
  text-align: center !important;
  color: var(--accent-violet) !important;
  margin-bottom: 20px !important;
  line-height: 1.5 !important;
}

.blog-h4 {
  font-family: var(--font-titres);
  color: var(--accent-violet);
  font-size: 1.3rem;
}

.blog-h4-rose {
  font-family: var(--font-titres);
  color: var(--accent-rose-vif);
  font-size: 1.3rem;
}


/* Listes Atelier Sakura */

ul.modele-liste {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

ul.modele-liste li {
    position: relative;
    padding-left: 1.8em;
    margin-bottom: 0.6em;
    list-style: none;
}

ul.modele-liste li::before {
    content: "🌸";
    position: absolute;
    left: 0;
    top: 0;
}

header .nav-container .nav-logo a img {
    width: 130px !important;
    height: auto !important;
    max-width: none !important;
}