/*
 * Charte appliquée au site en ligne (inc/charte.php).
 *
 * Constat du 2026-10-13 : les boutons d'achat, le filtre et les liens actifs
 * étaient dans le bleu par défaut d'Astra (#0084d6), hors de toute charte
 * Kadef, avec un texte blanc à 3,98:1 (sous le minimum AA de 4,5:1). Le fil
 * d'Ariane gris clair et les prix barrés manquaient aussi de contraste.
 * Les couleurs d'Astra sont ramenées aux variables Kadef : tout ce qui
 * utilise la palette Astra (thème, WooCommerce, Elementor) suit la charte.
 * Contrastes vérifiés par tests/e2e/charte.spec.ts.
 */

:root {
	--ast-global-color-0: var(--kadef-ink);        /* Boutons, liens actifs (bleu Astra) */
	--ast-global-color-1: var(--kadef-ink-soft);   /* Survol des boutons et liens */
	--ast-global-color-2: var(--kadef-ink);        /* Titres */
	--ast-global-color-3: var(--kadef-ink-soft);   /* Texte courant */
	--ast-global-color-4: var(--kadef-cream-soft); /* Fonds de section (gris bleuté) */
	--ast-global-color-5: var(--kadef-white);
	--ast-global-color-6: var(--kadef-ndop-indigo);
	--ast-global-color-7: var(--kadef-ink);
	--ast-global-color-8: var(--kadef-line);
}

/*
 * Les mêmes couleurs transmises par Astra à Elementor (« Couleurs globales »
 * des widgets) : déclarées en valeurs fixes par Astra (bleu #0084d6...),
 * elles échappaient à la palette ci-dessus (constat du 2026-10-18 : filet
 * bleu sous « Ausgewählte Produkte »). Spécificité doublée : la déclaration
 * d'Astra est aussi sur :root.
 */
:root:root {
	--e-global-color-astglobalcolor0: var(--ast-global-color-0);
	--e-global-color-astglobalcolor1: var(--ast-global-color-1);
	--e-global-color-astglobalcolor2: var(--ast-global-color-2);
	--e-global-color-astglobalcolor3: var(--ast-global-color-3);
	--e-global-color-astglobalcolor4: var(--ast-global-color-4);
	--e-global-color-astglobalcolor5: var(--ast-global-color-5);
	--e-global-color-astglobalcolor6: var(--ast-global-color-6);
	--e-global-color-astglobalcolor7: var(--ast-global-color-7);
	--e-global-color-astglobalcolor8: var(--ast-global-color-8);
}

/* Filets séparateurs d'Elementor : or Kadef (décor, jamais du texte). */
.elementor .elementor-element.elementor-widget-divider.elementor-widget {
	--divider-color: var(--kadef-gold);
}

/*
 * Texte : 16 px partout. Astra le réduisait à 14,6 px sous 922 px (texte
 * produit trop petit sur téléphone) ; sous 16 px, Safari iOS zoome aussi à
 * chaque saisie dans un champ (recherche, quantité, commande).
 */
@media (max-width: 921px) {
	html {
		font-size: 100%;
	}
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
	font-size: max(1rem, 16px);
}

/* Fil d'Ariane : gris de charte (7,6:1) au lieu du gris clair Astra (4,2:1). */
.woocommerce .woocommerce-breadcrumb,
.woocommerce .woocommerce-breadcrumb a {
	color: var(--kadef-ink-soft);
}

/*
 * Prix : en promotion, l'ancien prix s'efface (plus petit, barré, gris
 * lisible) et le nouveau ressort en rouge de charte.
 */
.woocommerce .price del,
.woocommerce .price del .amount {
	color: var(--kadef-ink-soft);
	font-size: 0.9em;
	font-weight: 400;
	opacity: 1;
}

/* Catégorie sous le nom du produit : Astra l'éclaircit (opacité 0,6, ~3:1). */
.woocommerce ul.products li.product .ast-woo-product-category,
.woocommerce-page ul.products li.product .ast-woo-product-category {
	color: var(--kadef-ink-soft);
	opacity: 1;
}

.woocommerce .price ins {
	color: var(--kadef-danger);
	font-weight: 700;
	text-decoration: none;
}

.woocommerce ul.products li.product .price {
	color: var(--kadef-ink);
}

/*
 * Titre de page sur les pages en pleine largeur (Elementor) : Astra le
 * colle au bord de l'écran. Il reprend la largeur du contenu, de l'air, et le
 * point de couture or sous les titres du pied de page.
 */
.ast-page-builder-template .entry-header:not(.ast-no-title) {
	max-width: var(--ast-normal-container-width, 1200px);
	margin: 0 auto;
	padding: clamp(2rem, 6vw, 3.5rem) 20px clamp(1.5rem, 4vw, 2.5rem);
}

.ast-page-builder-template .entry-header .entry-title {
	margin: 0;
	color: var(--kadef-ink);
	line-height: 1.2;
}

.ast-page-builder-template .entry-header .entry-title::after {
	content: "";
	display: block;
	width: 3rem;
	margin-top: 0.6em;
	border-top: 1px dashed var(--kadef-gold);
}