/*
 * Charte Bagelstein — plugin « Fonctions personnalisées »
 *
 * Variables communes à tous les scripts Oxygen (liste, page produit, panier, paiement, compte,
 * recherche, actualités, approbations, 404…). Modifier une valeur ici la change partout.
 * Les couleurs principales suivent les couleurs globales d'Oxygen (--bde-…).
 *
 * Thème (WooCommerce > Réglages Bagelstein > Apparence) : attribut data-bgs-theme sur <html>
 *   « clair » (défaut), « auto » (selon l'appareil) ou « sombre ».
 */
:root {
	/* Couleurs */
	--bgs-accent: var(--bde-brand-primary-color, #c8102e);
	--bgs-accent-fonce: var(--bde-brand-primary-color-hover, color-mix(in srgb, var(--bgs-accent) 82%, #000));
	--bgs-texte: var(--bde-body-text-color, #1c1917);
	--bgs-titre: var(--bde-headings-color, var(--bgs-texte));
	--bgs-gris: #78716c;
	--bgs-bord: #e7e5e4;
	--bgs-fond: #f5f5f4;
	--bgs-carte: #ffffff;
	--bgs-page: transparent;           /* fond de page (laissé à Oxygen en thème clair) */
	--bgs-inverse: #1c1917;            /* boutons sombres */
	--bgs-sur-inverse: #ffffff;        /* texte sur les boutons sombres */
	--bgs-succes: #047857;
	--bgs-erreur: #dc2626;

	/* Formes */
	--bgs-rayon: 20px;
	--bgs-rayon-moyen: 16px;
	--bgs-rayon-petit: 12px;
	--bgs-ombre: 0 1px 2px rgba(28,25,23,.04), 0 4px 16px rgba(28,25,23,.06);
	--bgs-ombre-hover: 0 2px 4px rgba(28,25,23,.05), 0 16px 40px rgba(28,25,23,.12);
}

/* Thème sombre */
:root[data-bgs-theme="sombre"] {
	--bgs-texte: #ede9e4;
	--bgs-titre: var(--bde-headings-color, #ffffff);
	--bgs-gris: #a8a29e;
	--bgs-bord: #3a3532;
	--bgs-fond: #24201e;
	--bgs-carte: #1c1917;
	--bgs-page: #12100f;
	--bgs-inverse: #ede9e4;
	--bgs-sur-inverse: #1c1917;
	--bgs-succes: #34d399;
	--bgs-erreur: #f87171;
	--bgs-ombre: 0 1px 2px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.35);
	--bgs-ombre-hover: 0 2px 4px rgba(0,0,0,.45), 0 16px 40px rgba(0,0,0,.5);
	color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
	:root[data-bgs-theme="auto"] {
		--bgs-texte: #ede9e4;
		--bgs-titre: var(--bde-headings-color, #ffffff);
		--bgs-gris: #a8a29e;
		--bgs-bord: #3a3532;
		--bgs-fond: #24201e;
		--bgs-carte: #1c1917;
		--bgs-page: #12100f;
		--bgs-inverse: #ede9e4;
		--bgs-sur-inverse: #1c1917;
		--bgs-succes: #34d399;
		--bgs-erreur: #f87171;
		--bgs-ombre: 0 1px 2px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.35);
		--bgs-ombre-hover: 0 2px 4px rgba(0,0,0,.45), 0 16px 40px rgba(0,0,0,.5);
		color-scheme: dark;
	}
}

/* Fond de page en thème sombre (les sections Oxygen avec un fond défini gardent le leur) */
:root[data-bgs-theme="sombre"] body { background-color: var(--bgs-page); color: var(--bgs-texte); }
@media (prefers-color-scheme: dark) {
	:root[data-bgs-theme="auto"] body { background-color: var(--bgs-page); color: var(--bgs-texte); }
}