/**
 * Fiche produit abonnement.
 *
 * Volontairement minimal : structure et lisibilité seulement. La mise en forme
 * définitive viendra du thème, quand la maquette sera intégrée.
 */

.pd-subscription-options {
	margin: 1.5em 0;
}

.pd-subscription-options .pd-field {
	margin: 0 0 1.2em;
}

.pd-subscription-options label {
	display: block;
	margin-bottom: 0.35em;
	font-weight: 600;
}

.pd-subscription-options select,
.pd-subscription-options input[type="text"] {
	max-width: 22em;
}

.pd-subscription-options .description {
	display: block;
	margin-top: 0.3em;
	font-size: 0.875em;
	opacity: 0.75;
	font-weight: 400;
}

.pd-subscription-options fieldset {
	border: 1px solid rgba( 0, 0, 0, 0.14 );
	border-radius: 6px;
	padding: 1em 1.2em;
	margin: 0 0 1.2em;
}

.pd-subscription-options legend {
	font-weight: 600;
	padding: 0 0.4em;
}

/* Les radios restent sur une ligne, contrairement aux labels de champs. */
.pd-subscription-options fieldset > label {
	display: flex;
	align-items: baseline;
	gap: 0.5em;
	font-weight: 400;
	margin: 0.4em 0;
}

.pd-delivery-block,
.pd-pickup-block {
	margin: 0.6em 0 1em 1.7em;
	padding-left: 0.9em;
	border-left: 2px solid rgba( 0, 0, 0, 0.08 );
}

.pd-delivery-block label,
.pd-pickup-block label {
	font-weight: 400;
	font-size: 0.95em;
}

/*
 * Le thème et WooCommerce font flotter les boutons : sans ce garde-fou,
 * « Vérifier » se retrouve à gauche du champ qu'il valide.
 */
.pd-npa-line {
	display: flex;
	align-items: center;
	gap: 0.5em;
	margin-top: 0.2em;
}

.pd-npa-line input[type="text"],
.pd-npa-line .button {
	float: none;
	margin: 0;
}

.pd-delivery-block input[type="text"] {
	max-width: 7em;
}

.pd-npa-result {
	display: block;
	margin-top: 0.5em;
	font-size: 0.95em;
}

.pd-npa-result.pd-ok {
	color: #2c6e2f;
}

.pd-npa-result.pd-ko {
	color: #8a5300;
}

.pd-first-delivery {
	margin: 1.2em 0;
	padding: 0.9em 1.1em;
	background: rgba( 0, 0, 0, 0.03 );
	border-left: 3px solid #4a7c3f;
	border-radius: 0 4px 4px 0;
}

/*
 * Récapitulatif avant l ajout au panier.
 *
 * Structure seulement : quantité à gauche, total à droite, détail en dessous.
 * L habillage — fond, cadre, échelle typographique — appartient au thème.
 */
.pd-recap {
	margin: 1.4em 0;
}

.pd-recap__ligne {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1em;
	flex-wrap: wrap;
	margin: 0;
	font-size: 1.25em;
	font-weight: 700;
}

.pd-recap__detail {
	margin: 0.35em 0 0;
	font-size: 0.9em;
	font-weight: 400;
	opacity: 0.75;
}

/* Message affiché tant que le code postal n a pas été validé. */
.pd-npa-requis {
	margin: 0.6em 0 0;
	font-size: 0.95em;
	color: #8a5300;
}