/* =========================================================================
   Compatibilité Kadence Blocks
   Le plugin reste actif après la migration : toutes les pages construites
   avec lui doivent rester présentables. Il attend les variables globales du
   thème Kadence, absentes ici — on les fournit, mappées sur notre palette.
   ========================================================================= */

/* Kadence Blocks injecte ses propres variables dans un <style> en ligne place
   APRES les feuilles du theme : a specificite egale, c'est lui qui gagne.
   :root:root vaut 0,2,0 contre 0,1,0 et reprend la main sans !important. */
:root:root {
	/* Palette attendue par les blocs */
	--global-palette1: #c24e2c;
	--global-palette2: #e8b04b;
	--global-palette3: #14312e;
	--global-palette4: #14312e;
	--global-palette5: #5c6a62;
	--global-palette6: #8a7b62;
	--global-palette7: #efe8d8;
	--global-palette8: #f6f1e7;
	--global-palette9: #ffffff;
	--global-palette9rgb: 255, 255, 255;

	--global-palette-highlight: #c24e2c;
	--global-palette-highlight-alt: #a9421f;
	--global-palette-highlight-alt2: #ffffff;

	--global-palette-btn-bg: #c24e2c;
	--global-palette-btn-bg-hover: #a9421f;
	--global-palette-btn: #ffffff;
	--global-palette-btn-hover: #ffffff;
	--global-palette-btn-sec-bg: #efe8d8;
	--global-palette-btn-sec-bg-hover: #14312e;
	--global-palette-btn-sec: #14312e;
	--global-palette-btn-sec-hover: #f6f1e7;

	/* Typographie */
	--global-body-font-family: var(--vt-font);
	--global-heading-font-family: var(--vt-display);
	--global-primary-nav-font-family: var(--vt-font);
	--global-fallback-font: sans-serif;
	--global-display-fallback-font: serif;

	/* Largeurs — reprend celles du site actuel */
	--global-content-width: 1290px;
	--global-content-wide-width: 1490px;
	--global-content-narrow-width: 780px;
	--global-content-edge-padding: 24px;
	--global-content-boxed-padding: 2rem;
	--global-calc-content-width: 1242px;
	--global-vw: calc(100vw - (0.5 * var(--scrollbar-offset, 0px)));
}

/* -------------------------------------------------------------------------
   Largeurs : les rangées doivent respirer, pas coller aux bords
   ---------------------------------------------------------------------- */

.wp-block-kadence-rowlayout > .kt-row-layout-inner > .kt-row-column-wrap {
	max-width: var(--vt-content);
	margin-inline: auto;
	padding-inline: var(--vt-edge);
	box-sizing: border-box;
}

.wp-block-kadence-rowlayout.alignfull > .kt-row-layout-inner {
	padding-inline: 0;
}

/* Les blocs pleine largeur s'échappent du conteneur de contenu */
.vt-home-content > .alignfull,
.vt-entry__content > .alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.vt-home-content > .alignwide,
.vt-entry__content > .alignwide {
	width: min(var(--vt-content), 100vw - 2 * var(--vt-edge));
	max-width: none;
	margin-left: 50%;
	transform: translateX(-50%);
}

/* -------------------------------------------------------------------------
   Titres
   ---------------------------------------------------------------------- */

.wp-block-kadence-advancedheading,
.kt-adv-heading-wrap h1,
.kt-adv-heading-wrap h2,
.kt-adv-heading-wrap h3 {
	font-family: var(--vt-display);
	font-weight: 400;
	letter-spacing: 0;
	color: var(--vt-ink);
	text-wrap: balance;
}

.wp-block-kadence-advancedheading mark.kt-highlight {
	color: var(--vt-cta);
	background: transparent;
}

/* -------------------------------------------------------------------------
   Boutons Kadence
   ---------------------------------------------------------------------- */

.wp-block-kadence-advancedbtn .kb-button,
.kt-button,
.kb-btn {
	font-family: var(--vt-font);
	font-weight: 800;
	border-radius: var(--vt-radius-sm);
	text-decoration: none;
}

/* -------------------------------------------------------------------------
   Tuiles de catégories — la rangée d'images cliquables de l'accueil
   ---------------------------------------------------------------------- */

.wp-block-kadence-infobox .kt-blocks-info-box-link-wrap {
	border-radius: 18px;
	overflow: hidden;
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.wp-block-kadence-infobox .kt-blocks-info-box-link-wrap:hover {
	transform: translateY(-3px);
}

.wp-block-kadence-infobox .kt-blocks-info-box-title {
	font-family: var(--vt-display);
	font-weight: 400;
}

.wp-block-kadence-image img,
.wp-block-kadence-infobox img {
	border-radius: 18px;
}

/* -------------------------------------------------------------------------
   Carrousels — flèches et images
   ---------------------------------------------------------------------- */

.kt-blocks-carousel,
.kb-slider,
.wp-block-kadence-carousel {
	max-width: var(--vt-content);
	margin-inline: auto;
	padding-inline: var(--vt-edge);
	box-sizing: border-box;
	position: relative;
}

/* Les images de carrousel n'ont aucune contrainte native : sans ça, une
   photo produit occupe tout l'écran. */
.kt-blocks-carousel img,
.kb-slider img,
.wp-block-kadence-carousel img {
	max-height: 340px;
	width: 100%;
	object-fit: contain;
	border-radius: 14px;
}

.kt-blocks-carousel .slick-slide,
.kb-slider .slick-slide {
	padding: 0 8px;
	box-sizing: border-box;
}

/* Flèches : rondes, discrètes, dans la palette. Par défaut ce sont des
   carrés blancs à bordure noire. */
.kt-blocks-carousel .slick-prev,
.kt-blocks-carousel .slick-next,
.kb-slider .slick-prev,
.kb-slider .slick-next,
.wp-block-kadence-carousel .slick-prev,
.wp-block-kadence-carousel .slick-next {
	width: 44px;
	height: 44px;
	border-radius: 999px;
	background: var(--vt-ink);
	color: var(--vt-sand);
	border: 0;
	box-shadow: 0 10px 24px -12px rgba(20, 49, 46, 0.6);
	opacity: 1;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s ease;
}

.kt-blocks-carousel .slick-prev:hover,
.kt-blocks-carousel .slick-next:hover,
.kb-slider .slick-prev:hover,
.kb-slider .slick-next:hover {
	background: var(--vt-cta);
	color: #fff;
}

.kt-blocks-carousel .slick-prev,
.kb-slider .slick-prev {
	left: -6px;
}

.kt-blocks-carousel .slick-next,
.kb-slider .slick-next {
	right: -6px;
}

.kt-blocks-carousel .slick-prev::before,
.kt-blocks-carousel .slick-next::before,
.kb-slider .slick-prev::before,
.kb-slider .slick-next::before {
	color: inherit;
	font-size: 17px;
	opacity: 1;
}

.kt-blocks-carousel .slick-dots li button::before,
.kb-slider .slick-dots li button::before {
	color: var(--vt-muted);
	opacity: 0.4;
}

.kt-blocks-carousel .slick-dots li.slick-active button::before,
.kb-slider .slick-dots li.slick-active button::before {
	color: var(--vt-cta);
	opacity: 1;
}

/* -------------------------------------------------------------------------
   Grille de produits Kadence
   ---------------------------------------------------------------------- */

.wp-block-kadence-postgrid .entry-content-wrap,
.kb-post-grid .entry-content-wrap {
	background: transparent;
	padding: 14px 2px 0;
}

.kb-product-title,
.kt-product-title {
	font-family: var(--vt-font);
	font-size: 14px;
	font-weight: 800;
	line-height: 1.3;
}

/* -------------------------------------------------------------------------
   Nettoyage visuel
   ---------------------------------------------------------------------- */

/* Bordures grises héritées, sans rapport avec la palette */
.kt-row-layout-inner[style*="border"],
.wp-block-kadence-column[style*="border-color: rgb(2"],
.wp-block-kadence-rowlayout[style*="border-color: rgb(2"] {
	border-color: var(--vt-line) !important;
}

/* Bandeau logos partenaires : hauteur uniforme, alignement centré */
.kt-blocks-logo-carousel img,
.kt-row-column-wrap img[src*="logo"] {
	max-height: 68px;
	width: auto;
	object-fit: contain;
	margin-inline: auto;
}

/* Fonds blancs durs posés dans l'éditeur : on les ramène au sable */
.kt-row-layout-inner[style*="background-color: rgb(255, 255, 255)"],
.kt-row-layout-inner[style*="background-color:#ffffff"] {
	background-color: var(--vt-sand) !important;
}

@media (max-width: 767px) {
	.kt-blocks-carousel img,
	.kb-slider img,
	.wp-block-kadence-carousel img {
		max-height: 240px;
	}

	.kt-blocks-carousel .slick-prev,
	.kb-slider .slick-prev {
		left: 2px;
	}

	.kt-blocks-carousel .slick-next,
	.kb-slider .slick-next {
		right: 2px;
	}
}