/*
Plugin : PJF Boutique Enhancer
Version : 2.6.0
Base commune — ne modifie jamais le header ni le footer Kadence.
*/

body.pjf-be {
	--pjf-blue: #0874ff;
	--pjf-blue-dark: #0454c7;
	--pjf-blue-light: #6aaeff;
	--pjf-blue-soft: rgba(8, 116, 255, 0.14);
	--pjf-bg: #101827;
	--pjf-surface: #151f2f;
	--pjf-surface-2: #1a273a;
	--pjf-surface-3: #0d1624;
	--pjf-border: rgba(255, 255, 255, 0.10);
	--pjf-border-strong: rgba(78, 150, 255, 0.48);
	--pjf-text: #ffffff;
	--pjf-muted: #aab6c7;
	--pjf-success: #45c780;
	--pjf-danger: #ff6f7b;
	--pjf-warning: #ffbd4a;
	--pjf-radius-sm: 8px;
	--pjf-radius: 13px;
	--pjf-radius-lg: 17px;
	--pjf-shadow-sm: 0 10px 26px rgba(0, 0, 0, 0.18);
	--pjf-shadow: 0 18px 48px rgba(0, 0, 0, 0.25);
	--pjf-transition: 180ms ease;
}

/* Le fond de la zone de contenu peut être sombre, mais Kadence conserve
   entièrement la largeur du conteneur, le header et le footer. */
body.pjf-be main#main,
body.pjf-be .site-main {
	min-width: 0;
	background: var(--pjf-bg);
}

body.pjf-be .entry-content {
	min-width: 0;
	overflow: visible;
}

/* Zone élargie indépendante du conteneur Kadence. */
.pjf-shell {
	--pjf-shell-max: 1180px;
	box-sizing: border-box;
	width: min(var(--pjf-shell-max), calc(100vw - 40px));
	max-width: none;
	margin: 32px 0 68px 50%;
	padding: 0;
	color: var(--pjf-text);
	transform: translateX(-50%);
}

.pjf-shop-shell {
	--pjf-shell-max: 1500px;
}

.pjf-product-shell {
	--pjf-shell-max: 1320px;
}

.pjf-commerce-shell {
	--pjf-shell-max: 1180px;
}

/* =====================================================
   FOND CONTINU BOUTIQUE ET FICHES PRODUIT
   Le fond sombre appartient a toute la zone de contenu. Les wrappers Kadence
   restent transparents afin qu'aucun rectangle plus fonce ne se dessine
   derriere le produit ou le catalogue. Le footer demeure intact.
   ===================================================== */
body.pjf-be-shop .site-content,
body.pjf-be-product .site-content {
	background: var(--pjf-bg) !important;
}

body.pjf-be-shop .content-area,
body.pjf-be-shop #primary,
body.pjf-be-shop main#main,
body.pjf-be-shop .site-main,
body.pjf-be-shop article.entry,
body.pjf-be-shop .entry-content-wrap,
body.pjf-be-shop .entry-content,
body.pjf-be-shop .content-bg,
body.pjf-be-product .content-area,
body.pjf-be-product #primary,
body.pjf-be-product main#main,
body.pjf-be-product .site-main,
body.pjf-be-product article.entry,
body.pjf-be-product .entry-content-wrap,
body.pjf-be-product .entry-content,
body.pjf-be-product .content-bg {
	background: transparent !important;
	box-shadow: none !important;
}

body.pjf-be-shop article.entry,
body.pjf-be-shop .entry-content-wrap,
body.pjf-be-product article.entry,
body.pjf-be-product .entry-content-wrap {
	border: 0 !important;
}

/* =====================================================
   FOND UNIFIE PANIER / COMMANDE / MON COMPTE
   Kadence peut ajouter un fond propre au conteneur de l'article, ce qui
   créait un rectangle plus foncé derrière les cartes WooCommerce.
   On garde un seul fond premium sur toute la zone de contenu et on rend
   les wrappers internes transparents.
   ===================================================== */
body.pjf-be-commerce .site-content {
	background:
		radial-gradient(circle at 50% 0%, rgba(11, 95, 255, 0.07), transparent 34%),
		linear-gradient(180deg, #222c3b 0%, #1e2836 48%, #1b2431 100%) !important;
}

body.pjf-be-commerce .content-area,
body.pjf-be-commerce #primary,
body.pjf-be-commerce main#main,
body.pjf-be-commerce .site-main,
body.pjf-be-commerce article.entry,
body.pjf-be-commerce .entry-content-wrap,
body.pjf-be-commerce .entry-content,
body.pjf-be-commerce .content-bg {
	background: transparent !important;
	box-shadow: none !important;
}

body.pjf-be-commerce article.entry,
body.pjf-be-commerce .entry-content-wrap {
	border: 0 !important;
}

.pjf-shell,
.pjf-shell *,
.pjf-shell *::before,
.pjf-shell *::after {
	box-sizing: border-box;
}

.pjf-shell h1,
.pjf-shell h2,
.pjf-shell h3,
.pjf-shell h4,
.pjf-shell h5,
.pjf-shell h6,
.pjf-shell p,
.pjf-shell li,
.pjf-shell label,
.pjf-shell legend,
.pjf-shell th,
.pjf-shell td {
	color: inherit;
}

.pjf-shell a {
	color: var(--pjf-blue-light);
}

.pjf-shell a:hover {
	color: #a6ceff;
}

.pjf-shell :focus-visible {
	outline: 3px solid rgba(106, 174, 255, 0.72);
	outline-offset: 3px;
}

/* Boutons communs — ciblage limité à la zone PJF. */
.pjf-shell .button,
.pjf-shell button:not(.wc-block-components-quantity-selector__button),
.pjf-shell .woocommerce-button,
.pjf-shell .wc-block-components-button {
	min-height: 42px;
	padding: 10px 17px;
	color: #fff;
	font-weight: 800;
	line-height: 1.2;
	text-decoration: none;
	background: linear-gradient(90deg, var(--pjf-blue-dark), var(--pjf-blue));
	border: 1px solid rgba(101, 164, 255, 0.72);
	border-radius: var(--pjf-radius-sm);
	box-shadow: 0 9px 22px rgba(0, 91, 220, 0.18);
	transition: filter var(--pjf-transition), transform var(--pjf-transition), box-shadow var(--pjf-transition);
}

.pjf-shell .button:hover,
.pjf-shell button:not(.wc-block-components-quantity-selector__button):hover,
.pjf-shell .woocommerce-button:hover,
.pjf-shell .wc-block-components-button:hover {
	color: #fff;
	filter: brightness(1.12);
	transform: translateY(-1px);
	box-shadow: 0 13px 29px rgba(0, 91, 220, 0.28);
}

.pjf-shell .button:disabled,
.pjf-shell button:disabled,
.pjf-shell .wc-block-components-button:disabled {
	cursor: not-allowed;
	opacity: 0.55;
	filter: grayscale(0.25);
	transform: none;
}

/* Champs communs. */
.pjf-shell input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.pjf-shell select,
.pjf-shell textarea {
	min-height: 46px;
	padding: 11px 13px;
	color: var(--pjf-text);
	background: var(--pjf-surface-3);
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: var(--pjf-radius-sm);
	box-shadow: none;
	transition: border-color var(--pjf-transition), box-shadow var(--pjf-transition), background var(--pjf-transition);
}

.pjf-shell textarea {
	min-height: 120px;
}

.pjf-shell input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):focus,
.pjf-shell select:focus,
.pjf-shell textarea:focus {
	color: var(--pjf-text);
	background: #111d2e;
	border-color: var(--pjf-blue);
	box-shadow: 0 0 0 3px rgba(8, 116, 255, 0.17);
	outline: 0;
}

.pjf-shell input::placeholder,
.pjf-shell textarea::placeholder {
	color: #7f8da0;
	opacity: 1;
}

/* Les listes natives doivent rester lisibles sous Windows/Chrome. */
.pjf-shell select {
	color-scheme: dark;
}

.pjf-shell select option {
	color: #eef4fb;
	background: #0f1a2a;
}

.pjf-shell input[type="checkbox"],
.pjf-shell input[type="radio"] {
	accent-color: var(--pjf-blue);
}

/* Avis WooCommerce. */
.pjf-shell .woocommerce-message,
.pjf-shell .woocommerce-info,
.pjf-shell .woocommerce-error,
.pjf-shell .wc-block-components-notice-banner {
	margin: 0 0 22px;
	padding: 15px 18px;
	color: var(--pjf-text);
	background: var(--pjf-surface);
	border: 1px solid var(--pjf-border);
	border-left: 4px solid var(--pjf-blue);
	border-radius: 10px;
	box-shadow: var(--pjf-shadow-sm);
}

.pjf-shell .woocommerce-error,
.pjf-shell .wc-block-components-notice-banner.is-error {
	border-left-color: var(--pjf-danger);
}

.pjf-shell .woocommerce-message,
.pjf-shell .wc-block-components-notice-banner.is-success {
	border-left-color: var(--pjf-success);
}

.pjf-shell table,
.pjf-shell .shop_table {
	color: var(--pjf-text);
	background: transparent;
	border-color: var(--pjf-border);
}

.pjf-shell th,
.pjf-shell td {
	border-color: var(--pjf-border);
}

/* Parcours Panier → Commande → Confirmation. */
.pjf-checkout-progress {
	margin: 0 0 28px;
	padding: 18px 22px;
	background: linear-gradient(180deg, rgba(23, 35, 54, 0.98), rgba(17, 27, 43, 0.98));
	border: 1px solid var(--pjf-border);
	border-radius: var(--pjf-radius);
	box-shadow: var(--pjf-shadow-sm);
}

.pjf-checkout-progress ol {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pjf-checkout-progress__step {
	position: relative;
}

.pjf-checkout-progress__step:not(:last-child)::after {
	position: absolute;
	top: 17px;
	left: calc(50% + 25px);
	width: calc(100% - 50px);
	height: 2px;
	content: "";
	background: rgba(255, 255, 255, 0.12);
}

.pjf-checkout-progress__step.is-complete:not(:last-child)::after {
	background: linear-gradient(90deg, var(--pjf-blue), rgba(8, 116, 255, 0.36));
}

.pjf-checkout-progress__item {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	color: var(--pjf-muted);
	font-size: 13px;
	font-weight: 800;
	text-align: center;
	text-decoration: none;
}

.pjf-checkout-progress__number {
	display: inline-flex;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	align-items: center;
	justify-content: center;
	color: #dbe6f5;
	background: var(--pjf-surface-3);
	border: 1px solid var(--pjf-border);
	border-radius: 999px;
}

.pjf-checkout-progress__step.is-current .pjf-checkout-progress__item,
.pjf-checkout-progress__step.is-complete .pjf-checkout-progress__item {
	color: #fff;
}

.pjf-checkout-progress__step.is-current .pjf-checkout-progress__number,
.pjf-checkout-progress__step.is-complete .pjf-checkout-progress__number {
	color: #fff;
	background: var(--pjf-blue);
	border-color: var(--pjf-blue);
	box-shadow: 0 0 0 4px rgba(8, 116, 255, 0.15);
}

@media (prefers-reduced-motion: reduce) {
	.pjf-shell *,
	.pjf-shell *::before,
	.pjf-shell *::after {
		scroll-behavior: auto !important;
		transition-duration: 0.001ms !important;
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
	}
}