@charset "UTF-8";
/* CSS Document */

.shop-header {
	background-color: var( --color-accent-100);
}

.shop-title {
	/* encadrement + centrage */
	max-width: var(--cal-main-max);
	margin-inline: auto;

	/* respiration latérale (mobile/tablette) */
	padding-inline: var(--cal-pad-x);

	/* layout interne par défaut */
	display: flex;
	flex-direction: column;
 	gap: clamp(20px, 3vw, 32px);
	padding-block-start: var(--cal-gap-top);
}

/* Pages – titre principal */
.shop-title .elementor-widget-theme-archive-title h1.elementor-heading-title,
.shop-title .elementor-page-title h1.elementor-heading-title {
  text-align: left;
  font-family: var(--font-headings);
  font-size: var(--h1-size);
  font-weight: 800;
  color: var(--color-secondary);
  line-height: var(--lh-tight);
  margin: 0;
  padding-bottom: 0;
}

.shop-title .shop-subtitle {
	padding-bottom: 0.6rem;
	font-family: var(--font-headings);
	font-size: var(--h2-size);
	color: var(--color-secondary);
}

.shop-title .shop-auteur {
	font-family: var(--font-headings);
	font-size: var(--h3-size);
	color: var(--color-secondary-100);
	margin: 0;
	padding: 0;
    border-bottom: 1px solid var(--color-secondary-100); /* filet discret */
}

.collection {
	padding-bottom: var( --cal-gap-bc);
    border-bottom: 1px solid var(--color-secondary-100); /* filet discret */
}

/* 1) Prix (listing + single + widgets) */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce .widget_products .amount,
.woocommerce .widget_top_rated_products .amount,
.woocommerce .widget_recently_viewed_products .amount {
  color: var(--color-secondary);       /* ex: bleu pétrole */
  font-family: var(--font-headings);
  font-weight: 600;
}

/* Prix barré (ancien prix) */
.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
  color: var(--color-secondary-100);
  opacity: .9;
}

/* Prix remisé (ins) – le mettre en avant */
.woocommerce ul.products li.product .price ins,
.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins {
  color: var(--color-primary);         /* ex: framboise */
  font-weight: 700;
  text-decoration: none;               /* évite le souligné */
}

/* 2) Étiquettes promo (badge "Promo!") */
.woocommerce span.onsale {
  background: var(--color-primary);
  color: var(--color-white);
  font-family: var(--font-headings);
  text-transform: uppercase;
  letter-spacing: .04em;
  border-radius: 0;                     /* pas d’arrondi (préférence projet) */
  box-shadow: var(--shadow-1);
}

/* 3) Boutons (liste + single + mini-panier)
   -> Tu as déjà des styles globaux de boutons dans base.css ;
      ici on s’assure de la cohérence des classes Woo. */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .added_to_cart,
.woocommerce .single_add_to_cart_button,
.woocommerce .woocommerce-widget-layered-nav-dropdown__submit {
  background: var(--color-primary);
  color: var(--color-white);
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce .single_add_to_cart_button:hover {
  background: var(--color-primary-900);
  color: var(--color-white);
}

/* 4) Étoiles de notation */
.woocommerce .star-rating,
.woocommerce .star-rating::before,
.woocommerce .star-rating span::before {
  color: var(--color-accent-900);
}

/* 5) Liens divers (retours, navigation, mini-panier…) */
.woocommerce a,
.woocommerce-info a,
.woocommerce-message a {
 	color: var(--color-text); /* bleu pétrole pour les liens */
	text-decoration: underline;
	text-decoration-style: dashed;
}
.woocommerce a:hover,
.woocommerce-info a:hover,
.woocommerce-message a:hover {
  color: var(--color-primary);
}

/* 6) Formulaires (checkout, compte) – hérite de base.css, on affine un peu */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  font-family: var(--font-body);
  border-radius: 8px;
  border: 1px solid #E2E8F0;
  padding: .65em .8em;
  background: #fff;
  color: var(--color-text);
}
.woocommerce form .form-row input:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  outline: none;
  border-color: var(--color-secondary);
  box-shadow: 0 0 0 3px rgba(61,108,130,.18);
}

/* 7) Messages (notices) */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top-color: var(--color-secondary);
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  color: var(--color-secondary);
}

/* 8) Petits ajustements de grille produits */
.woocommerce ul.products li.product .button {
  margin-top: .6rem; /* petit air entre prix et bouton */
}

/* === Bouton Ajouter au panier (.button.alt), y compris variations non choisies === */

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles))
.single_add_to_cart_button.button.alt {
  background: var(--color-primary) !important;
  color: var(--color-white) !important;
  opacity: 1 !important;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles))
.single_add_to_cart_button.button.alt:is(:hover, :focus) {
  background: var(--color-primary-900) !important;
  color: var(--color-white) !important;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles))
.single_add_to_cart_button.button.alt:is(.disabled, :disabled, [disabled], .wc-variation-selection-needed) {
	background: var(--color-primary) !important;
	color: var(--color-white) !important;
	opacity: 1 !important;
}

/* Image mise en avant (produit) */
.shop-img img {
	display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 0;
  box-shadow: var(--shadow-1);
}

/* MESSAGE OUT OF STOCK > CALDOC */

.woocommerce div.product p.stock {
	font-family: var(--font-headings);
	font-size: 1em;
	color: var(--color-text);
}

/* Out of stock */

.badge-out-of-stock {
    position: absolute;
    top: -8px;
    right: -8px;
    background: #CA5860;
    color: white;
    width: 100px;
    height: 51.77px;
    font-size: 16px;
    font-weight: 500;
    font-family: 'Barlow', sans-serif;
    display: flex; /* activation flexbox */
    align-items: center; /* centrage vertical */
    justify-content: center; /* centrage horizontal */
    text-align: center;
    z-index: 10;
}

/* Citation dans les descriptions produit WooCommerce */
.woocommerce div.product blockquote {
	position: relative;
	margin: clamp(16px, 3vw, 28px) 0;
	padding: var(--g-quote-pad) var(--g-quote-pad) var(--g-quote-pad) calc(var(--g-quote-pad) + 8px);
	border-left: var(--g-quote-border) solid var(--g-quote-accent);
	background: var(--g-quote-bg);
	color: var(--g-quote-color);
	font-family: var(--g-quote-font);
	line-height: 1.55;
}

.woocommerce div.product blockquote p {
  margin: 0;
}

.woocommerce div.product blockquote::before {
  content: "“";
  font-size: 3em;
  line-height: 0;
  margin-right: 10px;
  vertical-align: -0.4em;
  color: var(--color-secondary);
}

/* HR Woocommerce */
.woocommerce div.product hr {
  border: none;
  height: 1px;
  background: rgba(106, 138, 127, 0.125);
  width: 60%;
  margin: 30px 0;
}

/* Bouton téléchargement PDF */
.woocommerce .download-pdf-direct,
.woocommerce-page .download-pdf-direct {
    display: inline-block !important;
    padding: 20px !important;
    background-color: rgb(182, 190, 149) !important;
    color: #fff !important;
	font-family: 'Barlow', sans-serif !important;
	font-size: 16px !important;
    text-decoration: none !important;
    border-radius: 0px !important;
    font-weight: 500 !important;
    transition: background-color 0.3s ease;
    margin: 20px 0 0 0 !important;
}

.woocommerce .download-pdf-direct:hover,
.woocommerce-page .download-pdf-direct:hover {
    background-color: #193A67 !important;
}

.woocommerce p:has(.download-pdf-direct),
.woocommerce-page p:has(.download-pdf-direct) {
    text-align: center !important;
}

/* PRODUCT META */
.product-meta {
	margin-top: var(--cal-gap-bc);
	border-top: 1px solid var(--color-accent-100);
	padding-top: var(--cal-gap-bc);
}

/* Icônes Elementor (héritent la couleur, dimension compacte) */
.product-meta .elementor-icon-list-icon{
  display: inline-flex;
  align-items: center;
  line-height: 1;
}
.product-meta .elementor-icon-list-icon svg{
  width: 0.85em; height: 0.85em;   /* taille relative au texte */
  fill: currentColor; stroke: currentColor;
}

/* Cas “standard” Elementor : <ul class="elementor-inline-items"> <li class="elementor-inline-item">… */
.product-meta .elementor-inline-items .elementor-inline-item:not(:last-child)::after{
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 1em;                                      /* même hauteur que le texte */
  border-left: 1px solid var(--color-secondary) !important;  /* comme brochures */
  margin: 0 .4em;
}

.product-meta .elementor-inline-items .elementor-inline-item:first-child{
  text-transform: capitalize;
}

.product-meta ..elementor-post-info > li:first-child{
  text-transform: capitalize;
}

/* Fallback si le widget ne pose pas .elementor-inline-items (rare) */
.product-meta .elementor-post-info > li:not(:last-child)::after{
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 1em;
  border-left: 1px solid var(--color-secondary) !important;
  margin: 0 .4em;
}
/* Responsive : resserrer un poil en mobile */
@media (max-width: 767px){
.product-meta{ gap: .4em .5em; font-size: .93rem; }
.product-metas .elementor-inline-item:not(:last-child)::after{
    margin: 0 .35em;
  }
}


/*****************************/
/* ARCHIVES PRODUITS         */
/*****************************/

.archive-produits h2 {
	margin-bottom: 0 !important;
}

.archive-produits .woocommerce ul.products li.product .woocommerce-loop-category__title, .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h3 {
     font-size: var(--h3-size);
}
