/* ==========================================================================
   Page de commande (WooCommerce) habillée aux couleurs du château :
   en-tête simplifié au nom du château en écriture script, étapes en DM Serif
   soulignées d'or, champs raffinés, récapitulatif sur marbre, bouton
   « Commander » noir et or avec son cadre décalé.
   ========================================================================== */

/* --------------------------------------------------------------------------
   L'en-tête simplifié de WooCommerce (pas de menu au moment de payer)
   -------------------------------------------------------------------------- */

body.woocommerce-checkout .wp-block-site-title {
	margin: 0;
	text-align: center;
}

body.woocommerce-checkout .wp-block-site-title a {
	color: var(--wp--preset--color--texte-clair) !important;
	font-family: var(--wp--preset--font-family--bonheur-royale);
	font-size: 2.3rem;
	font-weight: 400;
	text-decoration: none;
}

/* Pas de libellé vertical ici : la page reste sobre. */
body.woocommerce-checkout .tl-libelle-page {
	display: none;
}

body.woocommerce-checkout .wp-block-woocommerce-checkout {
	max-width: 1120px;
	margin-inline: auto;
	padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60);
}

/* --------------------------------------------------------------------------
   Les étapes : titres en DM Serif soulignés d'un filet doré
   -------------------------------------------------------------------------- */

.wc-block-components-checkout-step {
	margin-bottom: 2.5rem !important;
}

.wc-block-components-checkout-step__heading-container {
	margin-bottom: 1.25rem !important;
	padding-bottom: 0.6rem;
	border-bottom: 1px solid rgba(201, 162, 78, 0.6);
}

.wc-block-components-checkout-step__title {
	color: var(--wp--preset--color--noir-chaud) !important;
	font-family: var(--wp--preset--font-family--dm-serif-display) !important;
	font-size: 1.5rem !important;
	font-weight: 400 !important;
}

.wc-block-components-checkout-step__heading-content,
.wc-block-components-checkout-step__heading-content a {
	color: #8a7a6a;
	font-size: 0.85rem;
}

/* --------------------------------------------------------------------------
   Les champs : fond ivoire, bordure beige, bordure dorée à la saisie
   -------------------------------------------------------------------------- */

.wc-block-checkout :is(.wc-block-components-text-input input, .wc-block-components-combobox .components-combobox-control__input, .wc-block-components-select select, .wc-block-components-select-input select, textarea),
.wc-block-checkout .wc-blocks-components-select__select {
	border: 1px solid #c9b79c !important;
	border-radius: 0 !important;
	background-color: #fffaf3 !important;
	color: var(--wp--preset--color--noir-chaud) !important;
	box-shadow: none !important;
}

.wc-block-checkout :is(.wc-block-components-text-input input, .wc-block-components-combobox .components-combobox-control__input, textarea):focus,
.wc-block-checkout .wc-blocks-components-select__select:focus {
	border-color: var(--wp--preset--color--or) !important;
	outline: 1px solid var(--wp--preset--color--or) !important;
	outline-offset: 0;
}

.wc-block-checkout :is(.wc-block-components-text-input label, .wc-blocks-components-select__label, .wc-block-components-combobox label) {
	color: #8a7a6a !important;
}

.wc-block-checkout .wc-blocks-components-select__container {
	border-radius: 0 !important;
	background: transparent !important;
}

/* Cases à cocher et boutons d'option en doré. */
.wc-block-checkout :is(input[type="checkbox"], input[type="radio"]) {
	accent-color: #a8873f;
}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border-color: #c9b79c !important;
	border-radius: 0 !important;
	background: #fffaf3 !important;
}

.wc-block-components-checkbox .wc-block-components-checkbox__mark {
	fill: #a8873f !important;
}

/* Petits liens et textes (ajout d'appartement, conditions générales). */
.wc-block-checkout .wc-block-components-address-form__address_2-toggle,
.wc-block-checkout__terms a {
	color: #a8873f !important;
}

.wc-block-checkout__terms {
	color: #6b5d50;
	font-size: 0.85rem;
}

.wc-block-checkout__terms--with-separator {
	border-top-color: rgba(201, 162, 78, 0.45) !important;
}

/* Choix de livraison ou de retrait, et moyens de paiement. */
.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control-accordion-option {
	border-color: #d8cbb6 !important;
	border-radius: 0 !important;
	background: #fffaf3;
}

.wc-block-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option--checked-option-highlighted,
.wc-block-checkout .wc-block-components-radio-control-accordion-option--checked-option-highlighted {
	box-shadow: inset 0 0 0 1px var(--wp--preset--color--or) !important;
}

/* --------------------------------------------------------------------------
   Le bouton « Commander » : noir et or, cadre doré décalé
   -------------------------------------------------------------------------- */

.wc-block-checkout__actions_row {
	position: relative;
	isolation: isolate;
	padding: 0 14px 10px 0;
}

.wc-block-components-checkout-place-order-button {
	position: relative;
	min-height: 54px;
	border: 1px solid var(--wp--preset--color--noir-chaud) !important;
	border-radius: 0 !important;
	background: var(--wp--preset--color--noir-chaud) !important;
	color: var(--wp--preset--color--or) !important;
	font-family: var(--wp--preset--font-family--bodoni-moda) !important;
	font-size: 1rem !important;
	font-style: italic;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: color 0.3s ease;
}

.wc-block-components-checkout-place-order-button::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 10px;
	right: -14px;
	bottom: -10px;
	left: 48px;
	border: 1px solid var(--wp--preset--color--or);
	pointer-events: none;
}

.wc-block-components-checkout-place-order-button:hover {
	color: #ffffff !important;
}

/* Lien « Retour au panier », s'il est affiché. */
.wc-block-components-checkout-return-to-cart-button {
	color: #8a7a6a !important;
	font-size: 0.85rem;
}

/* --------------------------------------------------------------------------
   Le récapitulatif, sur un panneau de marbre
   -------------------------------------------------------------------------- */

.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block {
	border: 0 !important;
	border-radius: 0 !important;
	background:
		linear-gradient(rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.55)),
		#f4f3f1 var(--tl-marbre) center / 900px auto !important;
}

.wc-block-components-checkout-order-summary__title-text {
	color: #8a7a6a !important;
	font-size: 0.75rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.wc-block-checkout__sidebar .wc-block-components-totals-wrapper {
	border-color: rgba(201, 162, 78, 0.45) !important;
}

/* Les articles : nom en DM Serif, vignette sur fond ivoire. */
.wc-block-components-order-summary-item__description .wc-block-components-product-name {
	color: var(--wp--preset--color--noir-chaud) !important;
	font-family: var(--wp--preset--font-family--dm-serif-display);
	font-size: 1.05rem;
}

.wc-block-components-order-summary-item__image img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: #f7f2ea;
}

.wc-block-components-order-summary-item__quantity {
	border-color: var(--wp--preset--color--or) !important;
	background: var(--wp--preset--color--noir-chaud) !important;
	color: var(--wp--preset--color--or) !important;
	box-shadow: none !important;
}

/* Le total, en DM Serif. */
.wc-block-checkout__sidebar .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-checkout__sidebar .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--wp--preset--color--noir-chaud);
	font-family: var(--wp--preset--font-family--dm-serif-display);
	font-size: 1.35rem !important;
	font-weight: 400 !important;
}

/* Téléphone : le récapitulatif replié, en haut, garde le même habillage. */
@media (max-width: 781px) {
	body.woocommerce-checkout .wp-block-site-title a {
		font-size: 1.8rem;
	}
}
