/* =============================================
CARTE CHECKOUT GLOBALE
============================================= */
#express-checkout-form,
.radio-buttons-container {
background: #ffffff !important;
border: 1.5px solid #1d4ed8 !important;
border-radius: 12px !important;
box-shadow: 0 4px 20px rgba(29, 78, 216, 0.10) !important;
padding: 20px !important;
}
/* Titre "Informations client" */
.checkout-heading,
h2.checkout-heading {
color: #1d4ed8 !important;
font-size: 16px !important;
font-weight: 700 !important;
border-bottom: 2px solid #1d4ed8;
padding-bottom: 8px;
margin-bottom: 16px !important;
}
/* =============================================
CHAMPS TEXTE
============================================= */
[dir] input[type="text"],
[dir] input[type="tel"],
[dir] input[type="email"],
[dir] input[type="number"] {
border: 1.5px solid #cbd5e1 !important;
border-radius: 8px !important;
background-color: #f8fafc !important;
padding: 11px 14px !important;
font-size: 14px !important;
color: #1e293b !important;
transition: border-color 0.2s;
}
[dir] input[type="text"]:focus,
[dir] input[type="tel"]:focus,
[dir] input[type="email"]:focus {
border-color: #1d4ed8 !important;
background-color: #eff6ff !important;
outline: none !important;
}
/* =============================================
SELECTS (wilaya + methode)
============================================= */
.checkout-section .checkout .main .checkout-form .checkout-select select,
.checkout-select select {
border: 1.5px solid #cbd5e1 !important;
border-radius: 8px !important;
background-color: #f8fafc !important;
padding: 11px 14px !important;
font-size: 14px !important;
color: #1e293b !important;
cursor: pointer !important;
}
.checkout-section .checkout .main .checkout-form .checkout-select select:focus {
border-color: #1d4ed8 !important;
background-color: #eff6ff !important;
}
/* =============================================
LABELS
============================================= */
.checkout-section .checkout .main .checkout-form .checkout-groups .form-group > .form-label,
label.form-label {
font-size: 12px !important;
font-weight: 600 !important;
color: #475569 !important;
text-transform: uppercase !important;
letter-spacing: 0.04em !important;
margin-bottom: 5px !important;
}
/* =============================================
BOUTON PASSER LA COMMANDE
============================================= */
.single-submit,
button.single-submit,
input[type="submit"].single-submit {
background: linear-gradient(135deg, #1d4ed8, #2563eb) !important;
color: #ffffff !important;
border: none !important;
border-radius: 10px !important;
padding: 14px 20px !important;
font-size: 16px !important;
font-weight: 700 !important;
letter-spacing: 0.03em !important;
width: 100% !important;
cursor: pointer !important;
transition: opacity 0.2s, transform 0.1s !important;
box-shadow: 0 4px 14px rgba(29, 78, 216, 0.30) !important;
}
.single-submit:hover {
opacity: 0.92 !important;
transform: translateY(-1px) !important;
}
.single-submit:active {
transform: translateY(0) !important;
}
/* =============================================
QUANTITE +/-
============================================= */
.single-product .quantity .quantity-handler-left,
.single-product .quantity .quantity-handler-right {
border: 1.5px solid #1d4ed8 !important;
color: #1d4ed8 !important;
border-radius: 8px !important;
background: #fff !important;
font-weight: 700 !important;
}
.single-product .quantity .quantity-input {
border: 1.5px solid #e2e8f0 !important;
border-radius: 8px !important;
font-weight: 700 !important;
color: #1e293b !important;
}