/**
 * Styles pour les modals de confirmation de suppression
 * Page: Checkout WooCommerce (/commander)
 * Fichier: checkout-modals.css
 */

/* === STYLES COMMUNS POUR LES MODALS DE CONFIRMATION === */

.woocommerce-checkout .blocker {
  z-index: 10 !important
}

.info-icon:hover {
	color: #29ddb9;
}

#spinner-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(255, 255, 255, 0.7);
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: wait;
}

.spinner {
	width: 60px;
	height: 60px;
	border: 6px solid #ccc;
	border-top-color: #29ddb9;
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
}

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

/* Suppression de la croix noire moche pour toute les modales*/
.jquery-modal .close-modal {
	display: none !important;
}

.modal {
	font-family: "Lato";
	font-weight: 400;
    font-family: "Lato", "Helvetica Neue", arial, sans-serif;
	font-size: 15px;
	line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    color: #272c30;
    margin: 0;
    padding: 15px!important;
	display:none;
	text-align: center !important;
}
.modal.large {
	max-width: 800px;
}

.modal .modal-content {
	padding: 5px;
}

.modal .modal-content ul {
	margin-left: 25px;
}
.modal .modal-content ul li {
	list-style-type: disc;
}
.modal .modal-content input {
	color: black !important;
}

.modal .modal-content .modal-header .modal-title {
	font-weight: 600;
}

.modal .modal-content .modal-body {
	text-align: justify;
	margin: 20px 10px 20px 10px;
}

.modal .modal-content .modal-body.center {
	text-align: center;
}
.modal .modal-content .modal-body.left {
	text-align: left;
}

.modal .modal-content .modal-body p {
	margin-top: 7px!important;
	margin-bottom: 7px!important;
}

.modal .modal-content a.close-btn {
	display: inline-block;
}

.modal .modal-content a.btn-error {
	padding: 10px 20px;
	border-radius: 5px;
	background: #D92D20;
	color: white;
}
.modal .modal-content a.btn-error:hover {
	background: #B42318;
}

.modal .modal-content a.cancel-btn {
	padding: 10px 20px;
	border-radius: 5px;
	background: #F2F4F7;
	color: #101828;
	border: 1px solid #ddd;
}
.modal .modal-content a.cancel-btn:hover {
	background: #E4E7EC;
}


.modal .modal-footer {
	text-align: center;
}