/* ==========================================================
CHECKOUT CLASSIQUE WOOCOMMERCE
Structure générale
========================================================== */

body.woocommerce-checkout .woocommerce {
	font-family: var(--typo-secondaire);
	color: var(--couleur-secondaire);
}

body.woocommerce-checkout .fl-post-title,
body.woocommerce-checkout .woocommerce h3,
body.woocommerce-checkout #order_review_heading {
	margin: 0 0 18px;

	font-family: var(--typo-principale);
	font-weight: var(--regular);
	color: var(--couleur-secondaire);
}

body.woocommerce-checkout form.checkout {
	display: block;
	width: 100%;
}

body.woocommerce-checkout #customer_details {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 32px;
	margin-bottom: 40px;
}

body.woocommerce-checkout #customer_details .col-1,
body.woocommerce-checkout #customer_details .col-2 {
	width: 100%;
	padding: 0;
}
.woocommerce .col2-set::after, .woocommerce .col2-set::before, .woocommerce-page .col2-set::after, .woocommerce-page .col2-set::before {
	content: none !important;
}

/* ==========================================================
CHECKOUT
Blocs formulaires
========================================================== */

body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .woocommerce-additional-fields,
body.woocommerce-checkout #order_review {
	padding: 16px;

	background: #fff;
	border: 1px solid rgba(28, 28, 28, 0.12);
	border-radius: 4px;
}

body.woocommerce-checkout .woocommerce-additional-fields {
	margin-top: 24px;
}

body.woocommerce-checkout .form-row {
	margin: 0 0 16px;
	padding: 0;
}

body.woocommerce-checkout .form-row label {
	display: block;
	margin: 0 0 6px;

	font-family: var(--typo-secondaire);
	font-size: 11px;
	font-weight: var(--medium);
	line-height: 1.2;
	letter-spacing: 0.05em;
	text-transform: uppercase;

	color: var(--couleur-secondaire);
}

body.woocommerce-checkout .required,
body.woocommerce-checkout .optional {
	font-size: 11px;
	font-weight: var(--regular);
	color: rgba(28, 28, 28, 0.55);
}

body.woocommerce-checkout input.input-text,
body.woocommerce-checkout textarea.input-text,
body.woocommerce-checkout select {
	width: 100%;
	min-height: 48px;
	padding: 12px 10px;

	font-family: var(--typo-secondaire);
	font-size: 14px;
	font-weight: var(--regular);

	color: var(--couleur-secondaire);
	background: #fff;

	border: 1px solid rgba(28, 28, 28, 0.18);
	border-radius: 6px;
	box-shadow: none;
}

body.woocommerce-checkout textarea.input-text {
	min-height: 96px;
	resize: vertical;
}

body.woocommerce-checkout input.input-text:focus,
body.woocommerce-checkout textarea.input-text:focus,
body.woocommerce-checkout select:focus {
	outline: none;
	border-color: var(--couleur-principale);
	box-shadow: 0 0 0 2px color-mix(
		in srgb,
		var(--couleur-principale) 22%,
		transparent
	);
}


/* ==========================================================
CHECKOUT
Case expédier à une adresse différente
========================================================== */

body.woocommerce-checkout #ship-to-different-address {
	margin: 0 0 18px;
}

body.woocommerce-checkout #ship-to-different-address label {
	display: flex;
	align-items: center;
	gap: 10px;

	margin: 0;

	font-family: var(--typo-secondaire);
	font-size: 13px;
	font-weight: var(--medium);
	letter-spacing: 0.04em;
	text-transform: uppercase;

	cursor: pointer;
}

body.woocommerce-checkout input[type="checkbox"],
body.woocommerce-checkout input[type="radio"] {
	accent-color: var(--couleur-principale);
}


/* ==========================================================
CHECKOUT
Code promo / messages info
========================================================== */

body.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
body.woocommerce-checkout .woocommerce-info {
	margin: 0 0 24px;
	padding: 16px;

	font-family: var(--typo-secondaire);
	font-size: 13px;
	line-height: 1.45;

	color: var(--couleur-secondaire);
	background: color-mix(
		in srgb,
		var(--couleur-principale) 8%,
		#fff
	);

	border: 1px solid color-mix(
		in srgb,
		var(--couleur-principale) 35%,
		transparent
	);
	border-top: 1px solid color-mix(
		in srgb,
		var(--couleur-principale) 35%,
		transparent
	);
	border-radius: 6px;
}

body.woocommerce-checkout .woocommerce-info::before {
	display: none;
	content: none;
}

body.woocommerce-checkout .woocommerce-info a {
	color: var(--couleur-secondaire);
	text-decoration: underline;
	text-underline-offset: 3px;
}

body.woocommerce-checkout .woocommerce-info a:hover {
	color: var(--couleur-principale);
}


/* ==========================================================
CHECKOUT
Récapitulatif commande
========================================================== */

body.woocommerce-checkout #order_review_heading {
	margin-top: 0;
}

body.woocommerce-checkout #order_review table.shop_table {
	width: 100%;
	margin: 0;

	border: 0;
	border-collapse: collapse;
	background: transparent !important;
}

body.woocommerce-checkout #order_review table.shop_table th,
body.woocommerce-checkout #order_review table.shop_table td {
	padding: 14px 0;

	font-family: var(--typo-secondaire);
	font-size: 14px;
	line-height: 1.4;

	color: var(--couleur-secondaire);
	border: 0;
	border-bottom: 1px solid rgba(28, 28, 28, 0.10);
}

body.woocommerce-checkout #order_review table.shop_table thead th {
	font-size: 12px;
	font-weight: var(--medium);
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

body.woocommerce-checkout #order_review table.shop_table .product-total,
body.woocommerce-checkout #order_review table.shop_table td:last-child {
	text-align: right;
}

body.woocommerce-checkout #order_review table.shop_table .order-total th,
body.woocommerce-checkout #order_review table.shop_table .order-total td {
	padding-top: 18px;
	padding-bottom: 0;

	font-family: var(--typo-principale);
	font-size: var(--size-titre-5);
	font-weight: var(--regular);

	border-bottom: 0;
}


/* ==========================================================
CHECKOUT
Modes de livraison GLS
========================================================== */

body.woocommerce-checkout #shipping_method {
	display: grid;
	gap: 10px;

	margin: 0;
	padding: 0;

	list-style: none;
}

body.woocommerce-checkout #shipping_method li {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: 10px;

	margin: 0;
	padding: 0;

	list-style: none;
}

body.woocommerce-checkout #shipping_method input.shipping_method {
	margin: 0;
}

body.woocommerce-checkout #shipping_method label {
	display: flex;
	align-items: center;
	gap: 12px;

	width: 100%;
	margin: 0;
	padding: 12px;

	font-family: var(--typo-secondaire);
	font-size: 13px;
	font-weight: var(--medium);
	line-height: 1.35;

	color: var(--couleur-secondaire);
	background: #fff;

	border: 1px solid rgba(28, 28, 28, 0.12);
	border-radius: 6px;

	cursor: pointer;

	transition:
		border-color 180ms ease,
		background-color 180ms ease;
}

body.woocommerce-checkout #shipping_method label:hover,
body.woocommerce-checkout #shipping_method input.shipping_method:checked + label {
	border-color: var(--couleur-principale);
	background: color-mix(
		in srgb,
		var(--couleur-principale) 8%,
		#fff
	);
}

body.woocommerce-checkout .gls-carrier-logo {
	width: 42px;
	height: 42px;

	object-fit: contain;
	border-radius: 4px;
}


/* ==========================================================
CHECKOUT
Bloc GLS
========================================================== */

body.woocommerce-checkout .gls-container {
	width: 100%;
	margin: 18px 0 0;
	padding: 18px;

	background: #fff;
	border: 1px solid rgba(28, 28, 28, 0.12);
	border-radius: 6px;
	box-shadow: none;
}

body.woocommerce-checkout .gls-mobile-container {
	margin-bottom: 18px;
}

body.woocommerce-checkout .gls-customer-mobile-label {
	margin-bottom: 6px;
}

body.woocommerce-checkout .gls-heading {
	margin: 0 0 18px;
	padding: 16px;

	color: var(--couleur-secondaire);
	background: color-mix(
		in srgb,
		var(--couleur-principale) 8%,
		#fff
	);

	border: 1px solid color-mix(
		in srgb,
		var(--couleur-principale) 35%,
		transparent
	);
	border-top: 1px solid color-mix(
		in srgb,
		var(--couleur-principale) 35%,
		transparent
	);
	border-radius: 6px;
}

body.woocommerce-checkout .gls-heading::before {
	display: none;
	content: none;
}

body.woocommerce-checkout .gls-heading .h4,
body.woocommerce-checkout .gls-heading .wc-block-components-title {
	margin: 0 0 8px;

	font-family: var(--typo-secondaire);
	font-size: 13px;
	font-weight: var(--semi-bold);
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

body.woocommerce-checkout .gls-sub-heading {
	font-family: var(--typo-secondaire);
	font-size: 13px;
	line-height: 1.45;
	font-weight: var(--regular);

	color: rgba(28, 28, 28, 0.72);
}

body.woocommerce-checkout .gls-sub-heading ul {
	margin: 8px 0 0;
	padding-left: 18px;
}

body.woocommerce-checkout .gls-sub-heading li {
	margin: 0 0 4px;
}


/* ==========================================================
CHECKOUT
Recherche point relais GLS
========================================================== */

body.woocommerce-checkout .gls-search-form-container {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
	gap: 12px;
	align-items: end;

	margin-bottom: 18px;
}

body.woocommerce-checkout .gls-search-form-container .form-row {
	margin: 0;
}

body.woocommerce-checkout .gls-search-relais-submit {
	min-height: 48px;
	padding: 0 22px !important;

	font-family: var(--typo-secondaire) !important;
	font-size: 12px !important;
	font-weight: var(--medium) !important;
	line-height: 1.2 !important;
	letter-spacing: 0.05em;
	text-transform: uppercase;

	color: #fff !important;
	background: var(--couleur-principale) !important;

	border: 1px solid var(--couleur-principale) !important;
	border-radius: 6px !important;
	box-shadow: none !important;

	cursor: pointer;
}

body.woocommerce-checkout .gls-search-relais-submit:hover,
body.woocommerce-checkout .gls-search-relais-submit:focus-visible {
	color: #fff !important;
	background: var(--couleur-principale) !important;
	border-color: var(--couleur-principale) !important;
	text-decoration: underline;
	text-underline-offset: 4px;
}


/* ==========================================================
CHECKOUT
Liste relais + carte
========================================================== */

body.woocommerce-checkout .gls-relais-result-container {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, 42%);
	gap: 18px;
	align-items: start;
}

body.woocommerce-checkout .gls-relais-list-container {
	display: grid;
	gap: 8px;

	max-height: 520px;
	padding-right: 4px;

	overflow: auto;
}

body.woocommerce-checkout .gls-relay-infos {
	margin: 0;

	background: #fff;
	border: 1px solid rgba(28, 28, 28, 0.12);
	border-radius: 6px;
	box-shadow: none;

	transition:
		border-color 180ms ease,
		background-color 180ms ease;
}

body.woocommerce-checkout .gls-relay-infos:hover,
body.woocommerce-checkout .gls-relay-infos:has(.gls-select-relay:checked) {
	border-color: var(--couleur-principale);
	background: color-mix(
		in srgb,
		var(--couleur-principale) 7%,
		#fff
	);
}

body.woocommerce-checkout .gls-relay-infos .card-body {
	padding: 14px;
}

body.woocommerce-checkout .gls-relay-infos .row {
	display: grid;
	grid-template-columns: 24px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
}

body.woocommerce-checkout .gls-select-relay-container {
	display: flex;
	align-items: center;
}

body.woocommerce-checkout .gls-select-relay {
	width: 18px;
	height: 18px;

	accent-color: var(--couleur-principale);
}

body.woocommerce-checkout .gls-relay-infos label {
	margin: 0;
	cursor: pointer;
}

body.woocommerce-checkout .gls-relay-name strong {
	font-family: var(--typo-secondaire);
	font-size: 13px;
	font-weight: var(--semi-bold);
	line-height: 1.3;
	letter-spacing: 0.03em;
	text-transform: uppercase;

	color: var(--couleur-secondaire);
}

body.woocommerce-checkout .separator,
body.woocommerce-checkout .gls-relay-label {
	font-size: 12px;
	color: rgba(28, 28, 28, 0.55);
}

body.woocommerce-checkout .gls-relay-address {
	margin-top: 4px;

	font-family: var(--typo-secondaire);
	font-size: 13px;
	font-weight: var(--regular);
	line-height: 1.4;

	color: rgba(28, 28, 28, 0.68);
}

body.woocommerce-checkout .gls-relay-distance {
	font-family: var(--typo-secondaire);
	font-size: 12px;
	font-weight: var(--medium);

	color: rgba(28, 28, 28, 0.55);
	white-space: nowrap;
}

body.woocommerce-checkout .gls-map-container {
	min-height: 420px;

	border: 1px solid rgba(28, 28, 28, 0.12);
	border-radius: 6px;
	overflow: hidden;
}


/* ==========================================================
CHECKOUT
Paiement + conditions
========================================================== */

body.woocommerce-checkout #payment {
	margin-top: 24px;

	background: transparent;
	border-radius: 0;
	border: 0 !important;
}

body.woocommerce-checkout #payment ul.payment_methods {
	margin: 0;
	padding: 18px;

	background: #fff;
	border: 1px solid rgba(28, 28, 28, 0.12);
	border-radius: 6px;
}

body.woocommerce-checkout #payment ul.payment_methods li {
	margin: 0;
}

body.woocommerce-checkout #payment label {
	font-family: var(--typo-secondaire);
	font-size: 13px;
	font-weight: var(--medium);

	color: var(--couleur-secondaire);
}

body.woocommerce-checkout #payment .input-checkbox {
	margin: 3px 0px 0 0 !important;
}

body.woocommerce-checkout #payment .payment_box {
	margin: 12px 0 0;
	padding: 14px;

	font-family: var(--typo-secondaire);
	font-size: 13px;
	line-height: 1.45;

	color: rgba(28, 28, 28, 0.72);
	background: var(--couleur-bg);

	border-radius: 6px;
}

body.woocommerce-checkout #payment .payment_box::before {
	display: none;
	content: none;
}

body.woocommerce-checkout .woocommerce-privacy-policy-text {
	margin: 0 0 24px 0 !important;
	padding: 0 !important;
	border: 0 !important;

	font-family: var(--typo-secondaire);
	font-size: 12px;
	line-height: 1.5;

	color: rgba(28, 28, 28, 0.72);
	background: #fff;
	border-radius: 4px;
}
body.woocommerce-checkout .woocommerce-privacy-policy-text p {
	margin: 0!important;
}
body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
	color: var(--couleur-secondaire);
	text-decoration: underline;
	text-underline-offset: 3px;
}

body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a:hover {
	color: var(--couleur-principale);
}

body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .form-row {
	margin-top: 16px;
}

body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper label.checkbox {
	display: flex;
	align-items: flex-start;
	gap: 6px;

	font-family: var(--typo-secondaire);
	font-size: 13px;
	line-height: 1.45;

	text-transform: none;
	letter-spacing: 0;
}


/* ==========================================================
CHECKOUT
Bouton commander
========================================================== */

body.woocommerce-checkout #place_order {
	width: 100%;
	min-height: 48px;
	margin-top: 20px;
	padding: 12px 18px !important;

	font-family: var(--typo-secondaire) !important;
	font-size: 12px !important;
	font-weight: var(--medium) !important;
	line-height: 1.2 !important;
	letter-spacing: 0.05em;
	text-transform: uppercase;

	color: #fff !important;
	background: var(--couleur-principale) !important;

	border: 1px solid var(--couleur-principale) !important;
	border-radius: 6px !important;
	box-shadow: none !important;

	cursor: pointer;
}

body.woocommerce-checkout #place_order:hover,
body.woocommerce-checkout #place_order:focus-visible {
	color: #fff !important;
	background: var(--couleur-principale) !important;
	border-color: var(--couleur-principale) !important;
	text-decoration: underline;
	text-underline-offset: 4px;
}


/* ==========================================================
CHECKOUT
Responsive
========================================================== */

@media (max-width: 1024px) {
	body.woocommerce-checkout #customer_details {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	body.woocommerce-checkout .gls-relais-result-container {
		grid-template-columns: 1fr;
	}

	body.woocommerce-checkout .gls-map-container {
		min-height: 360px;
	}
}

@media (max-width: 767px) {
	body.woocommerce-checkout .woocommerce-billing-fields,
	body.woocommerce-checkout .woocommerce-shipping-fields,
	body.woocommerce-checkout .woocommerce-additional-fields,
	body.woocommerce-checkout #order_review,
	body.woocommerce-checkout .gls-container {
		padding: 8px;
	}

	body.woocommerce-checkout .gls-search-form-container {
		grid-template-columns: 1fr;
	}

	body.woocommerce-checkout .gls-relay-infos .row {
		grid-template-columns: 16px minmax(0, 1fr);
	}

	body.woocommerce-checkout .gls-relay-distance {
		grid-column: 2;
	}

	body.woocommerce-checkout #shipping_method label {
		align-items: flex-start;
	}

	body.woocommerce-checkout table.shop_table,
	body.woocommerce-checkout table.shop_table tbody,
	body.woocommerce-checkout table.shop_table tfoot,
	body.woocommerce-checkout table.shop_table tr,
	body.woocommerce-checkout table.shop_table th,
	body.woocommerce-checkout table.shop_table td {
		display: block;
		width: 100%;
		text-align: left !important;
	}

	body.woocommerce-checkout table.shop_table tr {
		padding: 12px 0;
		border-bottom: 1px solid rgba(28, 28, 28, 0.10);
	}

	body.woocommerce-checkout table.shop_table th,
	body.woocommerce-checkout table.shop_table td {
		padding: 4px 0 !important;
		border-bottom: 0 !important;
	}
}