/** BADGE EXTENSION ** /

/* ——— 0) Masquer les badges natifs du thème/DCP ——— */
.woocommerce .onsale,
.dcp_single_woo_product_sale_badge,
.dcp_single_woo_product_new_badge,
.badge-new,
.product-new-badge { display: none !important; }

/* ——— 1) Référentiels pour position absolue ——— */
.wc-thumb-badge-wrap,
.woocommerce ul.products li.product .et_shop_image,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
  position: relative;
}

/* ——— 2) Badge HTML injecté (archives + carrousels) ——— */
.wc-badge.wc-badge--extension{
  position: absolute;
  top: 5px;
  right: 5px;                 /* à droite partout */
  z-index: 99;
  display: inline-block;
  padding: 6px 10px;
  font-size: 14px;
  line-height: 1;
  font-weight: 600;
  text-transform: none;        /* pas en majuscules */
  border-radius: 6px;
  background: #EC8319;         /* orange harmonisé */
  color: #fff;
  letter-spacing: .2px;
  pointer-events: none;
}

/* ——— 3) Fallback CSS (si pas de badge HTML) ——— */
/* Nécessite la classe JS .has-ext-badge déjà ajoutée aux <li> qui ont un vrai badge */
.woocommerce ul.products li.product.product_tag-extension:not(.has-ext-badge) .et_shop_image::after{
  content: "Extension";
  position: absolute;
  top: 5px;
  right: 5px;                 /* à droite comme le HTML */
  z-index: 99;
  display: inline-block;
  padding: 6px 10px;
  font-size: 14px;
  line-height: 1;
  font-weight: 600;
  text-transform: none;        /* pas en majuscules */
  border-radius: 6px;
  background: #EC8319;         /* orange harmonisé */
  color: #fff;
  letter-spacing: .2px;
  pointer-events: none;
}

/* ——— 4) SINGLE PRODUIT ——— */
/* On n'utilise pas d'injection HTML sur l'image principale (reste gérée par CSS ci-dessous) */
.single-product .wc-badge--extension { display: unset !important; } /* autorise les badges des carrousels sous la fiche */

/* Badge CSS sur la galerie du produit (si le produit a le tag extension) */
.single-product .woocommerce-product-gallery { position: relative; }
body.single-product.product_tag-extension .woocommerce-product-gallery::after,
.single-product .product.product_tag-extension .woocommerce-product-gallery::after,
.single-product [class*="product_tag-extension"] .woocommerce-product-gallery::after {
  content: "Extension";
  position: absolute;
  top: 12px;
  left: 12px;                 /* à gauche sur la fiche produit aussi */
  z-index: 99;
  padding: 6px 10px;
  font-size: 14px;
  line-height: 1;
  font-weight: 600;
  text-transform: none;
  border-radius: 6px;
  background: #EC8319;
  color: #fff;
  letter-spacing: .2px;
  pointer-events: none;
}
.single-product .woocommerce-product-gallery,
.single-product .woocommerce-product-gallery__image { overflow: visible; }

/* ——— 5) Divers ——— */
/* Évite que des overlays passent au-dessus du badge */
.woocommerce ul.products li.product .et_overlay { z-index: 1; }

/* Certains conteneurs coupent l’overflow : on lève la garde */
.woocommerce ul.products li.product a img,
.dcp-woo-products .dcp-product .product-thumbnail,
.dcp_single_woo_product img,
.woocommerce ul.products li.product {
  overflow: visible;
}
/** FIN BADGE EXTENSION ** /

/* pour eviter le chevauchement du menu déroulant */
#left-area {
  position: relative;
  z-index: 1;
}


/** ORDRE PAGE ACCUEIL SUR MOBILE ** /

/* ordre colonnes sur mobile */
@media all and (max-width: 980px) {
   /* envelopper la rangée dans une flexbox */
   .custom_row {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-flex-wrap: wrap; /* Safari 6.1+ */
      flex-wrap: wrap;
   }
   /* classes personnalisées qui désigneront l'ordre
   des colonnes dans la ligne de la flexbox */
   .first-on-mobile {
      -webkit-order: 1;
      order: 1;
	   margin-bottom: 30px!important;
   }
   .second-on-mobile {
      -webkit-order: 2;
      order: 2;
   }
   .third-on-mobile {
      -webkit-order: 3;
      order: 3;
   }
   .fourth-on-mobile {
      -webkit-order: 4;
      order: 4;
   }
   /* ajoute une marge à la dernière colonne 
   .custom_row:last-child .et_pb_column:last-child {
      margin-bottom: 30px;
   }*/
}


/** TAILLE DES IMAGES ** /

/** TAILLE DES IMAGES POUR DCP **/


/* Case carrée uniforme */
.dcp_single_woo_product_thumbnail {
  aspect-ratio: 1 / 1;         /* carré */
  width: 100%;
  overflow: hidden;
  display: block;
  position: relative;
}

/* Le lien occupe toute la case */
.dcp_single_woo_product_thumbnail > a {
  display: block;
  width: 100%;
  height: 100%;
}

/* L'image remplit la case, sans déformation (crop si nécessaire) */
.dcp_single_woo_product_thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;            /* clé pour un rendu homogène */
  object-position: center;      /* centre le crop */
  display: block;
}

/* Optionnel : évite les sauts de mise en page autour de la vignette */
.dcp_single_woo_product_thumbnail_wrapper {
  contain: content;             /* limite l'impact du layout */
}

/* TAILLES DES IMAGES POUR WOO */


/* Bloc image carré et propre */
.woocommerce ul.products li.product .et_shop_image {
  aspect-ratio: 1 / 1;
  display: block;
  position: relative;
  overflow: hidden;
}

/* Le conteneur qui entoure <img> et le badge */
.woocommerce ul.products li.product .et_shop_image .wc-thumb-badge-wrap {
  display: block;         /* remplace inline-block */
  width: 100%;
  height: 100%;
  position: relative;     /* base pour le badge */
}

/* L’image remplit la case, crop centré */
.woocommerce ul.products li.product .et_shop_image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}



/** HARMONISATION HAUTEURS BLOCS **/

body.woocommerce-shop ul.products[class*="columns-"],
body.tax-product_tag ul.products[class*="columns-"],
body.tax-product_brand ul.products[class*="columns-"],
body[class*="tax-pa_"] ul.products[class*="columns-"],
body.post-type-archive-product ul.products[class*="columns-"],
.et-db #et-boc .et-l .et_pb_shop ul.products[class*="columns-"],
.et_pb_wc_related_products ul.products[class*="columns-"] {
    align-items: stretch; 
	display: flex !important;
    flex-wrap: wrap !important;
}

/* Boutique + archives natives (tags, attributs, archive produit) */
@media (min-width: 320px) and (max-width: 640px) {
  body.woocommerce-shop ul.products[class*="columns-"],
  body.tax-product_tag ul.products[class*="columns-"],
  body.tax-product_brand ul.products[class*="columns-"],
  body[class*="tax-pa_"] ul.products[class*="columns-"],
  body.post-type-archive-product ul.products[class*="columns-"] {
    display: flex !important;
    flex-wrap: wrap !important;
  }
  body.woocommerce-shop ul.products[class*="columns-"]  > li.product,
  body.tax-product_tag ul.products[class*="columns-"] > li.product,
  body.tax-product_brand ul.products[class*="columns-"] > li.product,
  body[class*="tax-pa_"] ul.products[class*="columns-"] > li.product,
  body.post-type-archive-product ul.products[class*="columns-"] > li.product {
    box-sizing: border-box;
    flex: 0 0 50% !important;
    max-width: 46% !important;
    padding: 12px !important;
    margin: 0 !important;
    width: auto !important;
    float: none !important;
	margin: 0 4% 11.5% 0% !important;
	/*background-color:red!important;*/
  }
}
/* Produits par catégories */

@media (max-width: 320px) {
	.et-db #et-boc .et-l .et_pb_shop ul.products[class*="columns-"] li.product {
	width: 100% !important;
	}
}


/* EVENEMENTS */

.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-month__day {
    min-height: 60px;
}

:root {
	--tec-font-family-sans-serif: 'Quicksand', Helvetica, Arial, Lucida, sans-serif; /* */
    --tec-grid-gutter: 48px;
    --tec-grid-gutter-negative: calc(var(--tec-grid-gutter) * -1);
    --tec-grid-gutter-half: calc(var(--tec-grid-gutter) / 2);
    --tec-grid-gutter-half-negative: calc(var(--tec-grid-gutter-half) * -1);
    --tec-grid-gutter-small: 42px;
    --tec-grid-gutter-small-negative: calc(var(--tec-grid-gutter-small) * -1);
    --tec-grid-gutter-small-half: calc(var(--tec-grid-gutter-small) / 2);
    --tec-grid-gutter-small-half-negative: calc(var(--tec-grid-gutter-small-half) * -1);
    --tec-grid-gutter-page: 42px;
    --tec-grid-gutter-page-small: 19.5px;
    --tec-grid-width-default: 1176px;
    --tec-grid-width-min: 320px;
    --tec-grid-width: calc(var(--tec-grid-width-default) + var(--tec-grid-gutter-page) * 2);
    --tec-grid-width-1-of-2: 50%;
    --tec-grid-width-1-of-3: 33.333%;
    --tec-grid-width-1-of-4: 25%;
    --tec-grid-width-1-of-5: 20%;
    --tec-grid-width-1-of-7: 14.285%;
    --tec-grid-width-1-of-8: 12.5%;
    --tec-grid-width-1-of-9: 11.111%;
    --tec-spacer-0: 4px; /* 4px */
    --tec-spacer-1: 8px;
    --tec-spacer-2: 12px;
    --tec-spacer-3: 16px;
    --tec-spacer-4: 20px;
    --tec-spacer-5: 24px;
    --tec-spacer-6: 28px;
    --tec-spacer-7: 32px;
    --tec-spacer-8: 40px;
    --tec-spacer-9: 48px;
    --tec-spacer-10: 56px;
    --tec-spacer-11: 64px;
    --tec-spacer-12: 80px;
    --tec-spacer-13: 96px;
    --tec-spacer-14: 160px;
    --tec-z-index-spinner-container: 100;
    --tec-z-index-views-selector: 30;
    --tec-z-index-dropdown: 30;
    --tec-z-index-events-bar-button: 20;
    --tec-z-index-search: 10;
    --tec-z-index-filters: 9;
    --tec-z-index-scroller: 7;
    --tec-z-index-week-event-hover: 5;
    --tec-z-index-map-event-hover: 5;
    --tec-z-index-map-event-hover-actions: 6;
    --tec-z-index-multiday-event: 5;
    --tec-z-index-multiday-event-bar: 2;
    --tec-color-text-primary: #505a64; /* #141827 */
    --tec-color-text-primary-light: #505a649e; /* #141827 */
    --tec-color-text-secondary: #5d5d5d;
    --tec-color-text-disabled: #d5d5d5;
    --tec-color-text-events-title: var(--tec-color-text-primary);
    --tec-color-text-event-title: var(--tec-color-text-events-title);
    --tec-color-text-event-date: var(--tec-color-text-primary);
    --tec-color-text-secondary-event-date: var(--tec-color-text-secondary);
    --tec-color-icon-primary: #5d5d5d;
    --tec-color-icon-primary-alt: #757575;
    --tec-color-icon-secondary: #bababa;
    --tec-color-icon-active: #505a64; /* #141827 */
    --tec-color-icon-disabled: #d5d5d5;
    --tec-color-icon-focus: #007fc2;/* #334aff;*/
    --tec-color-icon-error: #da394d;
    --tec-color-event-icon: #505a64; /* #141827 */
    --tec-color-event-icon-hover: #007fc2; /* #334aff;*/
    --tec-color-accent-primary: #007fc2; /* #334aff;*/
    --tec-color-accent-primary-hover: #007fc2cc; /* #334affcc;*/
    --tec-color-accent-primary-active: #007fc2e6; /* #334aff;*/
    --tec-color-accent-primary-background: #007fc212; /* #334aff;*/
    --tec-color-accent-secondary: #505a64; /* #141827 */
    --tec-color-accent-secondary-hover: #505a64cc; /* #141827 */
    --tec-color-accent-secondary-active: #505a64e6; /* #141827 */
    --tec-color-accent-secondary-background: #505a6412; /* #141827 */
    --tec-color-button-primary: var(--tec-color-accent-primary);
    --tec-color-button-primary-hover: var(--tec-color-accent-primary-hover);
    --tec-color-button-primary-active: var(--tec-color-accent-primary-active);
    --tec-color-button-primary-background: var(--tec-color-accent-primary-background);
    --tec-color-button-secondary: var(--tec-color-accent-secondary);
    --tec-color-button-secondary-hover: var(--tec-color-accent-secondary-hover);
    --tec-color-button-secondary-active: var(--tec-color-accent-secondary-active);
    --tec-color-button-secondary-background: var(--tec-color-accent-secondary-background);
    --tec-color-link-primary: var(--tec-color-text-primary);
    --tec-color-link-accent: var(--tec-color-accent-primary);
    --tec-color-link-accent-hover: #007fc2cc; /* #334aff;*/
    --tec-color-border-default: #d5d5d5;
    --tec-color-border-secondary: #e4e4e4;
    --tec-color-border-tertiary: #7d7d7d;
    --tec-color-border-hover: #5d5d5d;
    --tec-color-border-active: #505a64; /* #141827 */
    --tec-color-background: #fff;
    --tec-color-background-events: #0000;
    --tec-color-background-transparent: #fff9;
    --tec-color-background-secondary: #f7f6f6;
    --tec-color-background-messages: #505a6412; /* #141827 */
    --tec-color-background-secondary-hover: #f0eeee;
    --tec-color-background-error: #da394d14;
    --tec-color-box-shadow: rgba(#000, 0.14);
    --tec-color-box-shadow-secondary: rgba(#000, 0.1);
    --tec-color-scroll-track: rgba(#000, 0.25);
    --tec-color-scroll-bar: rgba(#000, 0.5);
    --tec-color-background-primary-multiday: #49c6e6bf; /* font event #334aff3d;*/
    --tec-color-background-primary-multiday-hover: #49c6e657; /* font event #334aff57;*/
    --tec-color-background-secondary-multiday: #505a643d; /* #141827 */
    --tec-color-background-secondary-multiday-hover: #505a6457; /* #141827 */
    --tec-color-accent-primary-week-event: #007fc21a; /* #334aff;*/
    --tec-color-accent-primary-week-event-hover: #007fc233; /* #334aff;*/
    --tec-color-accent-primary-week-event-featured: #007fc20a; /* #334aff;*/
    --tec-color-accent-primary-week-event-featured-hover: #007fc224; /* #334aff;*/
    --tec-color-background-secondary-datepicker: var(--tec-color-background-secondary);
    --tec-color-accent-primary-background-datepicker: var(--tec-color-accent-primary-background);
}

@media (min-width: 980px) {
	.tribe-events-calendar-list__event-date-tag-datetime{
		background-color: #49c6e6bf;
		height: 4vw!important;
		width: 4vw!important;
		border-radius: 2px;
	}
	
	.tribe-events .tribe-events-calendar-list__event-date-tag-datetime {
		padding-top: 16px;
	}

	.tribe-events .tribe-events-calendar-list__event-date-tag-weekday {
		margin-bottom: calc(var(--tec-spacer-0) * -0.2);
	}	
	
}

