/**
 * Styles pour la page checkout WooCommerce
 * Page: Checkout WooCommerce (/commander)
 * Fichier: checkout-styles.css
 *
 * Contient tous les styles CSS pour :
 * - Modals de confirmation de suppression
 * - Styles généraux du checkout
 * - WooCommerce customizations
 * - Champs et formulaires
 * - Méthodes de livraison et paiement
 */
.el-b2c-customer #billing_saved_addresses_field,
.el-b2c-customer .el-filters-title,
.el-b2c-customer .filters-section,
.el-b2c-customer .el-notice-need-toolbox,
.el-b2c-customer .shipping_saved_addresses_field,
.el-b2c-customer .billing_saved_addresses_field,
.el-hide-fields-b2b {
	display: none !important;
}
.el-b2c-customer .el-hide-fields-b2b {
	display: block !important;
}
.woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper {
	margin-top: .8rem !important;
}

/* ========================================
	 MODALS DE CONFIRMATION DE SUPPRESSION
======================================== */
header {
  z-index: 1;
}
/* Titre des modals */
#modal-toolbox-confirm .modal-title,
#modal-credits-confirm .modal-title {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: center;
}

/* Icônes spécifiques pour chaque modal */
#modal-toolbox-confirm .modal-title::before {
	content: "⚠️";
	font-size: 1.5rem;
}

#modal-credits-confirm .modal-title::before {
	content: "💳";
	font-size: 1.5rem;
}

/* Corps des modals */
#modal-toolbox-confirm .modal-body,
#modal-credits-confirm .modal-body {
	padding: 24px;
	background: white;
}

/* Messages de confirmation */
#modal-toolbox-confirm #toolbox-confirm-message,
#modal-credits-confirm #credits-confirm-message {
	font-size: 1rem;
	color: #374151;
	line-height: 1.6;
	margin-bottom: 0;
}

/* Actions des modals */
#modal-toolbox-confirm .modal-actions,
#modal-credits-confirm .modal-actions {
	display: flex;
	gap: 12px;
	justify-content: flex-end;
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid #e5e7eb;
}

/* BOUTONS DE SUPPRESSION COMMUNS */
#modal-credits-confirm #credits-confirm-yes,
#modal-toolbox-confirm #toolbox-confirm-yes {
	background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
	color: white;
	border: none;
	padding: 12px 24px;
	border-radius: 8px;
	font-weight: 600;
	font-size: 0.95rem;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 140px;
	justify-content: center;
	box-shadow: 0 4px 6px -1px rgba(220, 38, 38, 0.3);
}

#modal-credits-confirm #credits-confirm-yes::before,
#modal-toolbox-confirm #toolbox-confirm-yes::before {
	content: "";
	display: inline-block;
	width: 18px;
	height: 18px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAACXBIWXMAAAsTAAALEwEAmpwYAAAD00lEQVR4nO2abYgVVRjHBxfDXCP9EC6KYiqFGOaqH0RWEZJgQYnERRAKNRE/VEIJqwtilIsaJG2UoKjFQhSrISJY4RusEiIqRhiELyGEoujiCypI9YtDB7z3YZ7Z2fU8pzvb/OF8+9197vnd2eecOTNJUqZMGesAY4C9wF16j2P2AS8mA2jyt+h7etxnk6KHf3/5/qYrKXrId9lruZMUPYiE5ms+DGQBwFPAeKAJaAFage3AIeA8cJ8nzyPgKnDa9QRgM7ASWABMB4ZZTvBpP8F5vqgr3ukneAn4k9pIjxd0wP8Arf4HcYJGPYmAAZFSQH/D/11AmTKPA9zzV9RD33V7/PJ0yY/zvhO7ccKvFId8Z+7yo9N3aTc6/Krixge+c7ux2q84brzpu3mLX/bm+dHkO7wbk/1KNQoY4ceQJHSACxQnly0EdFOc/GQhoIvi5DsLAR0UJ19YCGijOFlvIWAZxckKCwHNGQW/B6YC44APgb9zfMlPgJF+bM3B/+WvwrHADOBYBrvAQkBjRsGRgr3R22xS/n5v+V3wbu3XMsNCQENGwQmC/c1AwBnBv5zBjrYQUJdx/19lHDhpIOCw4Odm/KsMDi7ABbimFH01qYjvCaEF7BH8QoW7nlgFOKsUXSy4rw0EbBf8Wwr3s6WAg0rRVYL73EDAZsGvUbgfLAXsVoquE9xHBgJaBd+ucF9ZCmhXin4suPcMBKwU/DaF22Qp4F2l6E7BLTUQsEjw3yrcaksBLXnuvoDXDAS8Ivgf8zTk0AJmK0WPCm6OgYBpgj+lcHMsBUxUip4T3EsGAsYJ/qLCvWApoF4pekVwow0EPCt47Z2DZ8wEiMPRytxNKgIMDSzAbcEHVbCDlG35/cQ66IejVftvf3ocSsBNwQ5XuIsxBHQrxZ/Led/QHwEXBPu8wh2PIaArT/MBfg0o4JRgp+W5YbIS0KEUnym4EwEFVO3v/cORtHwWQ0CbUrxZcAcCCvgm54asLYaAZUrxJYLrDChgm2DdY7O0LI8hoFkp/rbgPg0oYKNg1+a5Cq0ENOY5iwc2BBTwvmC3KFxjDAENSvGtOe8c+yOg6tIGdihcQwwBdcou7EvBvRFQwOuC3ZPCuO9UZy4gY5OzP6kIMD+ggLmCPZLCXEtihfTD0W7BzAooYEqO+mdjzD3rcPQXwUwKKKDqrXH3lCiFOZjECumHo3/04UlSXwVUvQ0K3E5hdsWYe9bh6IOU12hDCHiU0oTTHr62J7FCL0vcf5R3YgpoofayKKaA2dRemmIKmEjtZUJMAfXUXuqjCShTpkyZMsnAyD9nH5jyYdvQiwAAAABJRU5ErkJggg==");
}

#modal-credits-confirm #credits-confirm-yes:hover,
#modal-toolbox-confirm #toolbox-confirm-yes:hover {
	background: linear-gradient(135deg, #b91c1c 0%, #991b1b 100%);
	transform: translateY(-2px);
	box-shadow: 0 8px 15px -3px rgba(220, 38, 38, 0.4);
}

#modal-credits-confirm #credits-confirm-yes:active,
#modal-toolbox-confirm #toolbox-confirm-yes:active {
	transform: translateY(0);
	box-shadow: 0 2px 4px -1px rgba(220, 38, 38, 0.3);
}

#modal-credits-confirm #credits-confirm-yes:focus,
#modal-toolbox-confirm #toolbox-confirm-yes:focus {
	outline: 2px solid #dc2626;
	outline-offset: 2px;
}

/* BOUTONS D'ANNULATION COMMUNS */
#modal-credits-confirm #credits-confirm-no,
#modal-toolbox-confirm #toolbox-confirm-no {
	background: white;
	color: #6b7280;
	border: 2px solid #d1d5db;
	padding: 10px 24px;
	border-radius: 8px;
	font-weight: 500;
	font-size: 0.95rem;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 120px;
	justify-content: center;
}

#modal-credits-confirm #credits-confirm-no::before,
#modal-toolbox-confirm #toolbox-confirm-no::before {
	content: "✕";
	font-size: 0.9rem;
	font-weight: bold;
}

#modal-credits-confirm #credits-confirm-no:hover,
#modal-toolbox-confirm #toolbox-confirm-no:hover {
	background: #f9fafb;
	border-color: #9ca3af;
	color: #374151;
	transform: translateY(-1px);
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

#modal-credits-confirm #credits-confirm-no:active,
#modal-toolbox-confirm #toolbox-confirm-no:active {
	transform: translateY(0);
	box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.05);
}

#modal-credits-confirm #credits-confirm-no:focus,
#modal-toolbox-confirm #toolbox-confirm-no:focus {
	outline: 2px solid #6b7280;
	outline-offset: 2px;
}

/* RESPONSIVE */
@media (max-width: 640px) {
	#modal-toolbox-confirm .modal-actions,
	#modal-credits-confirm .modal-actions {
		flex-direction: column-reverse;
		gap: 8px;
	}

	#modal-toolbox-confirm #toolbox-confirm-yes,
	#modal-toolbox-confirm #toolbox-confirm-no,
	#modal-credits-confirm #credits-confirm-yes,
	#modal-credits-confirm #credits-confirm-no {
		width: 100%;
		min-width: unset;
	}

	#modal-toolbox-confirm .modal-content,
	#modal-credits-confirm .modal-content {
		margin: 20px;
		max-width: calc(100vw - 40px);
	}
}

/* ANIMATION D'APPARITION DES MODALS */
#modal-toolbox-confirm,
#modal-credits-confirm {
	backdrop-filter: blur(4px);
}

#modal-toolbox-confirm.modal,
#modal-credits-confirm.modal {
	animation: modalFadeIn 0.3s ease-out;
}

@keyframes modalFadeIn {
	from {
		opacity: 0;
		transform: scale(0.9) translateY(-20px);
	}
	to {
		opacity: 1;
		transform: scale(1) translateY(0);
	}
}

/* LOADING STATE POUR LES BOUTONS DE SUPPRESSION */
#modal-toolbox-confirm #toolbox-confirm-yes.loading,
#modal-credits-confirm #credits-confirm-yes.loading {
	pointer-events: none;
	opacity: 0.7;
	position: relative;
}

#modal-toolbox-confirm #toolbox-confirm-yes.loading::after,
#modal-credits-confirm #credits-confirm-yes.loading::after {
	content: "";
	position: absolute;
	width: 16px;
	height: 16px;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	border-top-color: white;
	animation: spin 1s ease-in-out infinite;
	right: 12px;
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

/* ========================================
	 STYLES GÉNÉRAUX CHECKOUT WOOCOMMERCE
======================================== */

/* Masquer certains éléments du panier standard */
#sla .cart_item,
.woocommerce-checkout .cart-items-wrapper .el-product-subtotal,
/*.woocommerce-checkout .cart-items-wrapper .product-remove,*/
.woocommerce-checkout .cart-items-wrapper .product-quantity {
	display: none !important;
}

.el-checkout-select-products-info button {
	padding: 14px;
}

/* Styles pour les wrappers de champs */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
	margin-top: 0;
	width: 100% !important;
	gap: 0;
}

/* Styles pour les titres des sections */
.payment-section h3,
.shipping-methods h3 {
	color: #101828 !important;
}

/* Bouton de commande principal */
#place_order {
	justify-content: center;
	width: 100% !important;
}

/* Texte des conditions générales */
.woocommerce-terms-and-conditions-checkbox-text {
	font-size: 14px;
	font-weight: 400px;
}

/* Fix pour le mode paiement */
.paiement-mode:checked:before {
	border: none !important;
}

/* Fix pour les champs de quantité WooCommerce */
.woocommerce .quantity .qty {
	width: 4rem !important;
	text-align: center !important;
	padding: 0.5rem !important;
	border: 1px solid #d1d5db !important;
	border-radius: 0.375rem !important;
}

/* Masquer les éléments de panier standard dans le checkout */
.woocommerce-checkout .cart-collaterals {
	display: none !important;
}

/* ========================================
	MÉTHODES DE LIVRAISON
======================================== */
.woocommerce ul#shipping_method, .shipping-methods ul, .woocommerce-shipping-methods, ul.woocommerce-shipping-methods {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: block !important;
	flex-direction: column !important;
}

.woocommerce ul#shipping_method li, .shipping-methods ul li, .woocommerce-shipping-methods li, ul.woocommerce-shipping-methods li {
	margin-bottom: 0.75rem !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
	display: block !important;
	width: 100% !important;
	float: none !important;
	clear: both !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}

.woocommerce ul#shipping_method li label, .shipping-methods ul li label, .woocommerce-shipping-methods li label, ul.woocommerce-shipping-methods li label {
	display: inline-flex !important;
	align-items: center !important;
	cursor: pointer !important;
	font-size: 0.875rem !important;
	color: #374151 !important;
	padding: 0.5rem 0 !important;
	line-height: 1.5 !important;
	border: none !important;
	background: none !important;
	width: 100% !important;
	margin: 0 !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	flex-direction: initial !important;
	justify-content: flex-start;
}


.woocommerce ul#shipping_method li input[type="radio"], .shipping-methods ul li input[type="radio"], .woocommerce-shipping-methods li input[type="radio"], ul.woocommerce-shipping-methods li input[type="radio"] {
	display: inline-block !important;
	visibility: visible !important;
	opacity: 1 !important;
	position: relative !important;
	width: 16px !important;
	height: 16px !important;
	margin-right: 0.5rem !important;
	margin-left: 0 !important;
	flex-shrink: 0 !important;
	appearance: radio !important;
	-webkit-appearance: radio !important;
	-moz-appearance: radio !important;
	background: white !important;
	border: 1px solid #d1d5db !important;
	border-radius: 50% !important;
	z-index: 10 !important;
}

.woocommerce ul#shipping_method li input[type="radio"]:checked,
.shipping-methods ul li input[type="radio"]:checked,
.woocommerce-shipping-methods li input[type="radio"]:checked,
ul.woocommerce-shipping-methods li input[type="radio"]:checked {
	background: #2563eb !important;
	border-color: #2563eb !important;
}

/* Styles pour les images et icônes dans les labels des méthodes d'expédition */
.woocommerce ul#shipping_method li label img,
.shipping-methods ul li label img,
.woocommerce-shipping-methods li label img,
ul.woocommerce-shipping-methods li label img {
	width: 24px !important;
	height: 24px !important;
	margin-right: 0.5rem !important;
	margin-left: 0 !important;
	vertical-align: middle !important;
	flex-shrink: 0 !important;
	object-fit: contain !important;
}

/* Masquer les pseudo-éléments potentiellement problématiques */
.woocommerce ul#shipping_method li label::before,
.shipping-methods ul li label::before,
.woocommerce-shipping-methods li label::before,
ul.woocommerce-shipping-methods li label::before,
.woocommerce ul#shipping_method li label::after,
.shipping-methods ul li label::after,
.woocommerce-shipping-methods li label::after,
ul.woocommerce-shipping-methods li label::after {
	display: none !important;
}


/* ========================================
	MÉTHODES DE PAIEMENT
======================================== */

ul.wc_payment_methods li {
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
}

ul.wc_payment_methods input[type="radio"] {
	padding: 5px !important;
	display: inline-block !important;
	width: 16px !important;
	height: 16px !important;
}

ul.wc_payment_methods label {
	display: inline-block !important;
	vertical-align: middle;
}

/*
.woocommerce ul.wc_payment_methods, .wc_payment_methods ul, .wc_payment_methods, ul.wc_payment_methods {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: block !important;
	flex-direction: column !important;
}


.woocommerce ul.wc_payment_methods li, .wc_payment_methods ul li, .wc_payment_methods li, ul.wc_payment_methods li {
	margin-bottom: 0.75rem !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
	display: block !important;
	width: 100% !important;
	float: none !important;
	clear: both !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}

.woocommerce ul.wc_payment_methods li label,
.wc_payment_methodss ul li label,
.wc_payment_methods li label,
ul.wc_payment_methods li label {
	display: inline-flex !important;
	align-items: center !important;
	cursor: pointer !important;
	font-size: 0.875rem !important;
	color: #374151 !important;
	padding: 0.5rem 0 !important;
	line-height: 1.5 !important;
	border: none !important;
	background: none !important;
	width: 100% !important;
	margin: 0 !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	flex-direction: initial !important;
	justify-content: flex-start;
}

.woocommerce ul.wc_payment_methods li input[type="radio"],
.wc_payment_methods ul li input[type="radio"],
.wc_payment_methods li input[type="radio"],
ul.wc_payment_methods li input[type="radio"] {
	display: inline-block !important;
	visibility: visible !important;
	opacity: 1 !important;
	position: relative !important;
	width: 16px !important;
	height: 16px !important;
	margin-right: 0.5rem !important;
	margin-left: 0 !important;
	flex-shrink: 0 !important;
	appearance: radio !important;
	-webkit-appearance: radio !important;
	-moz-appearance: radio !important;
	background: white !important;
	border: 1px solid #d1d5db !important;
	border-radius: 50% !important;
	z-index: 10 !important;
}*/

/* ========================================
	 FORMULAIRE DE COUPON
======================================== */

/* Styles pour le formulaire de coupon - Design intégré */
.coupon-section {
	padding-bottom: 1.5rem !important;
	border-bottom: 1px solid #e5e7eb !important;
}

.coupon-form {
	position: relative !important;
	display: block !important;
	width: 100% !important;
}

.coupon-form input[type="text"] {
	width: 100% !important;
	padding: 0.75rem 1rem !important;
	padding-left: 3rem !important; /* Espace pour l'icône à gauche */
	padding-right: 100px !important; /* Espace pour le bouton */
	border: 1px solid #d1d5db !important;
	border-radius: 0.5rem !important;
	font-size: 14px !important;
	transition: border-color 0.3s ease !important;
	background: white !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M21.3 10.8404C21.69 10.8404 22 10.5304 22 10.1404V9.21035C22 5.11035 20.75 3.86035 16.65 3.86035H7.35C3.25 3.86035 2 5.11035 2 9.21035V9.68035C2 10.0704 2.31 10.3804 2.7 10.3804C3.6 10.3804 4.33 11.1104 4.33 12.0104C4.33 12.9104 3.6 13.6304 2.7 13.6304C2.31 13.6304 2 13.9404 2 14.3304V14.8004C2 18.9004 3.25 20.1504 7.35 20.1504H16.65C20.75 20.1504 22 18.9004 22 14.8004C22 14.4104 21.69 14.1004 21.3 14.1004C20.4 14.1004 19.67 13.3704 19.67 12.4704C19.67 11.5704 20.4 10.8404 21.3 10.8404ZM9 8.88035C9.55 8.88035 10 9.33035 10 9.88035C10 10.4304 9.56 10.8804 9 10.8804C8.45 10.8804 8 10.4304 8 9.88035C8 9.33035 8.44 8.88035 9 8.88035ZM15 15.8804C14.44 15.8804 13.99 15.4304 13.99 14.8804C13.99 14.3304 14.44 13.8804 14.99 13.8804C15.54 13.8804 15.99 14.3304 15.99 14.8804C15.99 15.4304 15.56 15.8804 15 15.8804ZM15.9 9.48035L9.17 16.2104C9.02 16.3604 8.83 16.4304 8.64 16.4304C8.45 16.4304 8.26 16.3604 8.11 16.2104C7.82 15.9204 7.82 15.4404 8.11 15.1504L14.84 8.42035C15.13 8.13035 15.61 8.13035 15.9 8.42035C16.19 8.71035 16.19 9.19035 15.9 9.48035Z' fill='%23788197'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: 12px center !important;
	background-size: 20px 20px !important;
}

.coupon-form input[type="text"]:focus {
	border-color: var(--primary-color) !important;
	outline: none !important;
	box-shadow: 0 0 0 2px rgba(var(--primary-color-rgb), 0.2) !important;
}

.coupon-form button {
	position: absolute !important;
	right: 4px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	padding: 0.5rem 1rem !important;
	background: white !important;
	color: #00d3aa !important;
	border-radius: 0.375rem !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	cursor: pointer !important;
	transition: all 0.3s ease !important;
	white-space: nowrap !important;
}

.coupon-form button:hover {
	background: #f9fafb !important;
	color: var(--primary-color) !important;
}

.coupon-form button:disabled {
	opacity: 0.5 !important;
	cursor: not-allowed !important;
}

/* Responsive pour le formulaire de coupon */
@media (max-width: 640px) {
	.coupon-form input[type="text"] {
		padding-left: 2.5rem !important; /* Icône plus proche sur mobile */
		padding-right: 90px !important;
		background-position: 8px center !important; /* Icône plus proche du bord */
		background-size: 18px 18px !important; /* Icône légèrement plus petite */
	}

	.coupon-form button {
		font-size: 13px !important;
		padding: 0.4rem 0.8rem !important;
	}
}

/* ========================================
	 ORDER REVIEW ET TABLEAUX
======================================== */

/* Styles pour le conteneur order review */
#order_review {
	width: 100% !important;
	max-width: 100% !important;
	overflow: visible !important;
}

.woocommerce-checkout-review-order {
	width: 100% !important;
	max-width: 100% !important;
}

/* Styles pour l'order review table */
#order_review .shop_table,
.woocommerce-checkout-review-order-table {
	width: 100% !important;
	max-width: 100% !important;
	table-layout: fixed !important;
	border-collapse: collapse !important;
	margin: 0 !important;
}

#order_review .shop_table td,
#order_review .shop_table th,
.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
	padding: 0.75rem !important;
	border-bottom: 1px solid #e5e7eb !important;
	word-wrap: break-word !important;
}

#order_review .shop_table .product-name,
.woocommerce-checkout-review-order-table .product-name {
	width: 60% !important;
	max-width: 60% !important;
}

#order_review .shop_table .product-total,
.woocommerce-checkout-review-order-table .product-total {
	width: 40% !important;
	max-width: 40% !important;
	text-align: right !important;
}
#order_review .shop_table tfoot th {
	width: 60% !important;
	max-width: 60% !important;
	text-align: left;
}
#order_review .shop_table tfoot td {
	width: 40% !important;
	max-width: 40% !important;
	text-align: right;
}

/* ========================================
	 CHAMPS DE FORMULAIRE
======================================== */

/* Conteneurs pour les groupes de champs */
.name-container {
	display: flex !important;
	gap: 1rem !important;
	margin-bottom: 1rem !important;
}

.name-container .form-row {
	flex: 1 !important;
	margin-bottom: 0 !important;
}

/* SOLUTION CSS-ONLY POUR LES CHAMPS 50/50 AVEC CLASSES WOOCOMMERCE NATIVES */
/* Champs prénom/nom en 50/50 */
.woocommerce-checkout .form-row-first.form-row {
	float: left !important;
	width: calc(50% - 0.5rem) !important;
	margin-right: 1rem !important;
	margin-bottom: 1rem !important;
	clear: both !important;
}

.woocommerce-checkout .form-row-last.form-row {
	float: right !important;
	width: calc(50% - 0.5rem) !important;
	margin-left: 0 !important;
	margin-bottom: 1rem !important;
	clear: none !important;
}

/* Clear fix pour éviter les problèmes de layout après les champs 50/50 */
.woocommerce-checkout .form-row-last::after {
	content: '' !important;
	display: block !important;
	clear: both !important;
}

/* S'assurer que les champs suivants recommencent sur une nouvelle ligne */
.woocommerce-checkout .form-row:not(.form-row-first):not(.form-row-last) {
	clear: both !important;
	width: 100% !important;
	float: none !important;
}

/* Responsive pour mobile */
@media (max-width: 768px) {
	.name-container {
		flex-direction: column !important;
		gap: 0 !important;
	}

	.name-container .form-row {
		margin-bottom: 1rem !important;
	}

	/* Responsive pour les classes WooCommerce natives */
	.woocommerce-checkout .form-row-first.form-row,
	.woocommerce-checkout .form-row-last.form-row {
		float: none !important;
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		margin-bottom: 1rem !important;
		clear: both !important;
	}
}

/* Styles pour les champs de saisie */
.woocommerce-checkout .el-form-row input[type="text"],
.woocommerce-checkout .el-form-row input[type="email"],
.woocommerce-checkout .el-form-row input[type="tel"],
.woocommerce-checkout .el-form-row select,
.woocommerce-checkout .el-form-row textarea,
.woocommerce-checkout .form-row input[type="text"],
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"],
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
	width: 100% !important;
	padding: 0.75rem !important;
	border: 1px solid #d1d5db !important;
	border-radius: 0.375rem !important;
	font-size: 0.875rem !important;
	transition: border-color 0.2s ease !important;
	color: #000000!important;
}

.woocommerce-checkout .el-form-row input:focus,
.woocommerce-checkout .el-form-row select:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
	border-color: var(--primary-color) !important;
	outline: none !important;
	box-shadow: 0 0 0 2px rgba(var(--primary-color-rgb), 0.2) !important;
}

/* Amélioration de l'espacement des champs */
.woocommerce-checkout .el-form-row,
.woocommerce-checkout .form-row {
	margin-bottom: 1rem !important;
}

/* Styles pour les labels des champs */
.woocommerce-checkout .el-form-row label,
.woocommerce-checkout .el-form-row .checkout-field-label,
.woocommerce-checkout .form-row label,
.woocommerce-checkout .form-row .checkout-field-label {
	display: block !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	color: #374151 !important;
	margin-bottom: 0.5rem !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* S'assurer que tous les labels sont visibles */
.woocommerce-checkout label {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* ========================================
	 SELECT2 CUSTOMIZATIONS
======================================== */

/* STYLES POUR SELECT2 (champs pays) */
.woocommerce-checkout .select2-container {
	width: 100% !important;
	display: block !important;
}

.woocommerce-checkout .select2-container .select2-selection {
	height: 48px !important;
	border: 1px solid #d1d5db !important;
	border-radius: 0.375rem !important;
	background-color: white !important;
	transition: border-color 0.2s ease !important;
}

.woocommerce-checkout .select2-container .select2-selection:focus-within {
	border-color: var(--primary-color) !important;
	box-shadow: 0 0 0 2px rgba(var(--primary-color-rgb), 0.2) !important;
}

.woocommerce-checkout .select2-container .select2-selection__rendered {
	line-height: 46px !important;
	padding-left: 12px !important;
	color: #374151 !important;
}

.woocommerce-checkout .select2-container .select2-selection__arrow {
	height: 46px !important;
	right: 12px !important;
}

.woocommerce-checkout .select2-container .select2-selection__arrow::before {
	content: '' !important;
	display: inline-block !important;
	width: 0 !important;
	height: 0 !important;
	border-left: 4px solid transparent !important;
	border-right: 4px solid transparent !important;
	border-top: 4px solid #6b7280 !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
}

.woocommerce-checkout .select2-container .select2-selection__arrow b {
	display: none !important;
}

/* Icône de recherche pour Select2 */
.woocommerce-checkout .select2-container .select2-selection__arrow::after {
	content: '' !important;
	display: inline-block !important;
	width: 16px !important;
	height: 16px !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'/%3E%3C/svg%3E") !important;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	position: absolute !important;
	top: 50% !important;
	right: 8px !important;
	transform: translateY(-50%) !important;
}

/* Fix pour l'alignement des checkbox de sauvegarde des méthodes de paiement */
.woocommerce-SavedPaymentMethods-saveNew {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	margin: 0 !important;
}

.woocommerce-SavedPaymentMethods-saveNew input[type="checkbox"] {
	width: auto !important;
	margin: 0 !important;
	flex-shrink: 0 !important;
}

.woocommerce-SavedPaymentMethods-saveNew label {
	display: inline !important;
	margin: 0 !important;
	line-height: 1.5 !important;
	font-size: 14px !important;
}

.woocommerce-checkout fieldset .form-row.woocommerce-SavedPaymentMethods-saveNew {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
}

.woocommerce-checkout fieldset .form-row.woocommerce-SavedPaymentMethods-saveNew label {
	font-size: 13px !important;
}

/* Styles pour le select des adresses sauvegardées avec Select2 */
#billing_saved_addresses {
	width: 100% !important;
	max-width: 100% !important;
}

/* Container parent du select des adresses */
#billing_saved_addresses_field {
	width: 100% !important;
	max-width: 100% !important;
	flex: 1 !important;
}

.select2-container {
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
}

/* Force Select2 container spécifiquement pour le billing_saved_addresses */
#billing_saved_addresses + .select2-container {
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
	box-sizing: border-box !important;
}

#billing_saved_addresses + .select2-container .select2-selection {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

/* Force tous les containers Select2 dans le billing */
.woocommerce-billing-fields .select2-container {
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
}

/* Assurer que le container parent prend toute la largeur */
.woocommerce-billing-fields__field-wrapper > div:first-child {
	width: 100% !important;
}

.select2-container--default .select2-selection--single {
	height: 48px !important;
	padding: 8px 12px !important;
	border: 1px solid #d1d5db !important;
	border-radius: 6px !important;
	background-color: white !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #374151 !important;
	line-height: 32px !important;
	padding-left: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
	color: #9ca3af !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 46px !important;
	right: 8px !important;
}

.select2-container--default.select2-container--open .select2-selection--single {
	border-color: var(--primary-color) !important;
	box-shadow: 0 0 0 2px rgba(var(--primary-color-rgb), 0.2) !important;
}

.select2-dropdown {
	border: 1px solid #d1d5db !important;
	border-radius: 6px !important;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}

.woocommerce-checkout .select2-container--default .select2-results__option--highlighted[aria-selected],
.woocommerce-checkout.select2-container--default .select2-results__option--highlighted[data-selected] {
	background-color: #00d3aa !important;
	color: white !important;
}

/* S'assurer que le champ prend toute la largeur disponible */
.form-row.form-row-wide.select2-enabled {
	width: 100% !important;
	max-width: 100% !important;
	flex: 1 1 100% !important;
}

.form-row.form-row-wide.select2-enabled select {
	width: 100% !important;
	max-width: 100% !important;
}

/* Container flex qui contient le select des adresses */
.woocommerce-billing-fields__field-wrapper .w-full:first-child {
	width: 100% !important;
	max-width: 100% !important;
}

/* Force le select2 container à prendre toute la largeur */
.form-row.select2-enabled .select2-container {
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
}

.select2-container {
	width: 100% !important;
}

/* ========================================
	 MASQUAGE SHIPPING SECTIONS QUAND PAS DE TB
======================================== */
/*.moba-force-hidden {
	display: none !important;
}*/

/* ========================================
Masquage du produit dummy quand panier vide
======================================== */
.cart-items-wrapper .cart-item.instant-checkout-dummy {
	display: none !important;
}

/* ========================================
Masquage des notifications lié aux coupons
======================================== */
.woocommerce-message {
	display: none!important;
}

.remove-coupon-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 15px;
	height: 15px;
	margin-left: 8px;
	color: #e05656ff;
	cursor: pointer;
	font-weight:bold;
}

.payment_methods {
	gap: 1rem!important;
}

#billing_yweu_vat-description {
	font-size: 12px;
	color: #374151;
}

.checkout-inline-error-message {
	font-size: 12px;
	color: #e05656ff;
}
