/* ==============================================================
   Furzo Checkout Redesign — v3.0 (2-Col PC + Mobile Stepper)
   Police : Outfit | Palette HSL Furzo | Sans Glassmorphism
   ============================================================== */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;800&display=swap');

/* ****** Partie 1 : Variables & Design System ******** */
.woocommerce-checkout {
    --primary-color: #f3764a;
    --primary-hover: #e06337;
    --success-color: #2ec4b6;
    --success-hover: #25a89c;
    --text-color: #2b2d42;
    --text-muted: #6c757d;
    --border-color: rgba(243, 118, 74, 0.15);
    --border-light: #eef1f6;
    --bg-card: #ffffff;
    --bg-page: #f8fafc;
    --shadow-premium: 0 20px 45px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.02);
    --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

body.woocommerce-checkout {
    font-family: 'Outfit', 'Roboto', sans-serif !important;
    color: var(--text-color) !important;
    background-color: var(--bg-page) !important;
}

/* ****** Partie 2 : Layout 2 Colonnes PC ******** */
/* Wrapper global du checkout */
body.woocommerce-checkout .woocommerce {
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* Formulaire principal : flex row */
body.woocommerce-checkout form.checkout.woocommerce-checkout {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 30px !important;
    width: 100% !important;
    float: none !important;
    clear: both !important;
}

/* Colonne gauche : détails client (60%) */
body.woocommerce-checkout form.checkout.woocommerce-checkout .col2-set {
    flex: 0 0 calc(58% - 15px) !important;
    max-width: calc(58% - 15px) !important;
    width: auto !important;
    float: none !important;
    margin: 0 !important;
}

/* Colonne droite : résumé commande + paiement (40%) */
body.woocommerce-checkout form.checkout.woocommerce-checkout #order_review_heading,
body.woocommerce-checkout form.checkout.woocommerce-checkout #order_review {
    flex: 0 0 calc(42% - 15px) !important;
    max-width: calc(42% - 15px) !important;
    width: auto !important;
    float: none !important;
    margin: 0 !important;
}

/* Titre du résumé */
body.woocommerce-checkout form.checkout.woocommerce-checkout #order_review_heading {
    display: none !important; /* On intègre le titre dans le card #order_review */
}

/* ****** Partie 3 : Cartes Premium ******** */
.woocommerce-checkout .col-1,
.woocommerce-checkout .col-2,
.woocommerce-checkout #order_review {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 24px !important;
    padding: 40px !important;
    box-shadow: var(--shadow-premium) !important;
    box-sizing: border-box !important;
    margin-bottom: 24px !important;
    width: 100% !important;
    float: none !important;
}

/* Résumé commande sticky sur PC */
.woocommerce-checkout #order_review {
    position: sticky !important;
    top: 100px !important;
}

/* Code promo : card légère */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
    order: -1; /* avant les colonnes */
    flex: 0 0 100% !important;
    max-width: 100% !important;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle,
body.woocommerce-checkout form.checkout_coupon.woocommerce-form-coupon {
    flex: 0 0 100% !important;
    width: 100% !important;
}

/* Titres de sections dans les cartes */
.woocommerce-checkout .col-1 h3,
.woocommerce-checkout .col-2 h3,
.woocommerce-checkout #order_review h3,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper ~ h3 {
    font-family: 'Outfit', sans-serif !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    color: var(--text-color) !important;
    margin-top: 0 !important;
    margin-bottom: 28px !important;
    padding-bottom: 18px !important;
    border-bottom: 1.5px solid var(--border-light) !important;
    text-transform: none !important;
    letter-spacing: -0.3px !important;
}

/* Sous-titre de section dans les cartes */
.woocommerce-checkout .shipping-methods-step2-wrapper h3 {
    font-size: 17px !important;
    padding-bottom: 14px !important;
}

/* ****** Partie 4 : Coupon Zone Premium ******** */
.woocommerce-form-coupon-toggle .woocommerce-info {
    background: #fff !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 16px !important;
    color: var(--text-color) !important;
    padding: 18px 24px !important;
    font-size: 14.5px !important;
    font-family: 'Outfit', sans-serif !important;
    margin-bottom: 20px !important;
    line-height: 1.5 !important;
    box-shadow: var(--shadow-premium) !important;
}

.woocommerce-form-coupon-toggle .woocommerce-info::before {
    display: none !important;
}

.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon {
    color: var(--primary-color) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: var(--transition-smooth) !important;
}

.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon:hover {
    color: var(--primary-hover) !important;
    text-decoration: underline !important;
}

form.checkout_coupon.woocommerce-form-coupon {
    background: #fff !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 20px !important;
    padding: 30px !important;
    margin-bottom: 24px !important;
    box-shadow: var(--shadow-premium) !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    display: none;
}

form.checkout_coupon.woocommerce-form-coupon p {
    font-size: 14px !important;
    color: var(--text-muted) !important;
    margin-bottom: 15px !important;
}

form.checkout_coupon.woocommerce-form-coupon input.input-text {
    width: auto !important;
    min-width: 250px !important;
    display: inline-block !important;
    margin-bottom: 0 !important;
    vertical-align: middle !important;
}

form.checkout_coupon.woocommerce-form-coupon button.button {
    background: #eef1f6 !important;
    border: none !important;
    color: var(--text-color) !important;
    border-radius: 12px !important;
    padding: 14px 28px !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    cursor: pointer !important;
    transition: var(--transition-smooth) !important;
    vertical-align: middle !important;
    margin-left: 10px !important;
}

form.checkout_coupon.woocommerce-form-coupon button.button:hover {
    background: #e2e7f0 !important;
}

/* ****** Partie 5 : Formulaires, Labels & Saisie ******** */
.woocommerce-checkout .form-row label {
    display: block !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: var(--text-muted) !important;
    margin-bottom: 8px !important;
    letter-spacing: 0.2px !important;
}

.woocommerce-checkout .form-row label .required {
    color: var(--primary-color) !important;
}

.woocommerce-checkout input.input-text,
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout textarea {
    width: 100% !important;
    padding: 14px 18px !important;
    font-size: 15px !important;
    font-family: 'Outfit', sans-serif !important;
    border-radius: 12px !important;
    border: 1.5px solid #dcdcdc !important;
    background: #fff !important;
    color: var(--text-color) !important;
    -webkit-text-fill-color: var(--text-color) !important;
    caret-color: var(--primary-color) !important;
    transition: var(--transition-smooth) !important;
    box-sizing: border-box !important;
    outline: none !important;
}

.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout input[type="text"]:focus,
.woocommerce-checkout input[type="email"]:focus,
.woocommerce-checkout input[type="tel"]:focus,
.woocommerce-checkout input[type="password"]:focus,
.woocommerce-checkout textarea:focus {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 4px rgba(243, 118, 74, 0.15) !important;
    outline: none !important;
}

/* Correction Autofill Chrome/Safari/Edge */
.woocommerce-checkout input:-webkit-autofill,
.woocommerce-checkout input:-webkit-autofill:hover,
.woocommerce-checkout input:-webkit-autofill:focus,
.woocommerce-checkout input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    box-shadow: 0 0 0 1000px #fff inset !important;
    -webkit-text-fill-color: var(--text-color) !important;
    color: var(--text-color) !important;
    caret-color: var(--text-color) !important;
    transition: background-color 5000s ease-in-out 0s !important;
}

/* Champs côte-à-côte dans la col-1 */
.woocommerce-checkout .col-1 .form-row-first,
.woocommerce-checkout .col-1 .form-row-last,
.woocommerce-checkout .col-2 .form-row-first,
.woocommerce-checkout .col-2 .form-row-last {
    width: calc(50% - 10px) !important;
    float: left !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout .col-1 .form-row-first,
.woocommerce-checkout .col-2 .form-row-first {
    margin-right: 20px !important;
}

.woocommerce-checkout .form-row-wide {
    clear: both !important;
    width: 100% !important;
}

/* ****** Partie 6 : Sélecteur Pays/Région (Select2) ******** */
.woocommerce-checkout .select2-container--default .select2-selection--single {
    height: 52px !important;
    border: 1.5px solid #dcdcdc !important;
    border-radius: 12px !important;
    background: #fff !important;
    display: flex !important;
    align-items: center !important;
    transition: var(--transition-smooth) !important;
}

.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--single,
.woocommerce-checkout .select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 4px rgba(243, 118, 74, 0.15) !important;
    outline: none !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--text-color) !important;
    font-size: 15px !important;
    font-family: 'Outfit', sans-serif !important;
    padding-left: 18px !important;
    line-height: 52px !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 52px !important;
    right: 15px !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: var(--text-muted) transparent transparent transparent !important;
    border-width: 6px 5px 0 5px !important;
}

/* ****** Partie 7 : Cases à Cocher Premium ******** */
.woocommerce-checkout input[type="checkbox"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    border: 2px solid #dcdcdc !important;
    border-radius: 6px !important;
    background-color: #fff !important;
    cursor: pointer !important;
    transition: var(--transition-smooth) !important;
    position: relative !important;
    outline: none !important;
    vertical-align: middle !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
}

.woocommerce-checkout input[type="checkbox"]:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(243, 118, 74, 0.12) !important;
}

.woocommerce-checkout input[type="checkbox"]:checked {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 10px rgba(243, 118, 74, 0.18) !important;
}

.woocommerce-checkout input[type="checkbox"]:checked::after {
    content: "" !important;
    position: absolute !important;
    left: 6px !important;
    top: 2px !important;
    width: 6px !important;
    height: 11px !important;
    border: solid #fff !important;
    border-width: 0 2.5px 2.5px 0 !important;
    transform: rotate(45deg) !important;
}

/* Boutons Radio */
.woocommerce-checkout input[type="radio"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    border: 2px solid #dcdcdc !important;
    border-radius: 50% !important;
    background-color: #fff !important;
    cursor: pointer !important;
    transition: var(--transition-smooth) !important;
    position: relative !important;
    outline: none !important;
    vertical-align: middle !important;
    margin-right: 12px !important;
}

.woocommerce-checkout input[type="radio"]:hover {
    border-color: var(--primary-color) !important;
}

.woocommerce-checkout input[type="radio"]:checked {
    border-color: var(--primary-color) !important;
}

.woocommerce-checkout input[type="radio"]:checked::after {
    content: "" !important;
    position: absolute !important;
    width: 10px !important;
    height: 10px !important;
    background: var(--primary-color) !important;
    border-radius: 50% !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

/* Correction spécifique Stripe & WooCommerce saved tokens */
.wc-stripe-saved-payment-methods-list-item input[type="radio"],
.woocommerce-SavedPaymentMethods input[type="radio"],
#payment input[type="checkbox"] {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    cursor: pointer !important;
}

.wc-stripe-saved-payment-methods-list-item,
.woocommerce-SavedPaymentMethods-token {
    display: flex !important;
    align-items: center !important;
    padding: 15px !important;
    border: 1px solid var(--border-light) !important;
    border-radius: 12px !important;
    margin-bottom: 12px !important;
    background: #f8fafc !important;
    transition: var(--transition-smooth) !important;
}

.wc-stripe-saved-payment-methods-list-item:hover,
.woocommerce-SavedPaymentMethods-token:hover {
    border-color: rgba(243, 118, 74, 0.3) !important;
}

/* ****** Partie 8 : Récapitulatif de Commande ******** */

/* En-tête du résumé avec titre intégré */
.woocommerce-checkout #order_review::before {
    content: "🛒 Votre commande";
    display: block !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    color: var(--text-color) !important;
    margin-bottom: 28px !important;
    padding-bottom: 18px !important;
    border-bottom: 1.5px solid var(--border-light) !important;
}

table.woocommerce-checkout-review-order-table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-bottom: 20px !important;
}

table.woocommerce-checkout-review-order-table th,
table.woocommerce-checkout-review-order-table td {
    padding: 14px 10px !important;
    border-bottom: 1.5px solid var(--border-light) !important;
    color: var(--text-color) !important;
    font-size: 14.5px !important;
    vertical-align: middle !important;
}

table.woocommerce-checkout-review-order-table thead th {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: var(--text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

table.woocommerce-checkout-review-order-table .product-name strong.product-quantity {
    color: var(--text-muted) !important;
    font-weight: 600 !important;
}

/* Variation (Vendeur, couleur, taille) */
table.woocommerce-checkout-review-order-table dl.variation {
    margin: 6px 0 0 !important;
    font-size: 13px !important;
}

table.woocommerce-checkout-review-order-table dl.variation dt,
table.woocommerce-checkout-review-order-table dl.variation dd {
    display: inline !important;
    color: var(--text-muted) !important;
    font-size: 13px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

table.woocommerce-checkout-review-order-table dl.variation dt::after {
    content: " " !important;
}

/* Sous-total & Total en orange */
table.woocommerce-checkout-review-order-table .cart-subtotal th,
table.woocommerce-checkout-review-order-table .cart-subtotal td {
    font-weight: 600 !important;
    color: var(--text-muted) !important;
}

table.woocommerce-checkout-review-order-table .order-total th,
table.woocommerce-checkout-review-order-table .order-total td {
    font-size: 20px !important;
    font-weight: 800 !important;
    border-bottom: none !important;
    padding-top: 20px !important;
    color: var(--primary-color) !important;
}

/* Permettre d'afficher la ligne de livraison dans le résumé sur grand écran */
@media (min-width: 769px) {
    table.woocommerce-checkout-review-order-table tr.shipping {
        display: table-row !important;
    }
}

@media (max-width: 768px) {
    table.woocommerce-checkout-review-order-table tr.shipping {
        display: table-row !important; /* Afficher la ligne pour voir le prix de livraison */
    }
    
    /* Masquer la liste de sélection des transporteurs dans la review order table sur mobile (puisqu'elle est dans l'étape 2) */
    table.woocommerce-checkout-review-order-table tr.shipping ul#shipping_method {
        display: none !important;
    }
}

/* ****** Partie 9 : Section Paiement ******** */
#payment {
    background: transparent !important;
    margin-top: 24px !important;
    border-top: 1.5px solid var(--border-light) !important;
    padding-top: 24px !important;
}

#payment ul.payment_methods {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 20px !important;
}

#payment ul.payment_methods li {
    display: block !important;
    padding: 14px 18px !important;
    border: 1.5px solid var(--border-light) !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
    background: #fff !important;
    transition: var(--transition-smooth) !important;
    cursor: pointer !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#payment ul.payment_methods li:hover {
    border-color: rgba(243, 118, 74, 0.35) !important;
}

#payment ul.payment_methods li.wc_payment_method.payment_method_stripe {
    display: block !important;
}

#payment ul.payment_methods li label {
    font-weight: 700 !important;
    font-size: 15px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex: 1 !important;
}

#payment ul.payment_methods li .payment_method_icons {
    display: flex !important;
    gap: 6px !important;
    margin-left: auto !important;
}

#payment div.payment_box {
    background: #f8fafc !important;
    border: 1px solid var(--border-light) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-top: 10px !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: var(--text-muted) !important;
    width: 100% !important;
}

#payment div.payment_box::before {
    display: none !important;
}

/* Politique de confidentialité */
.woocommerce-checkout .woocommerce-privacy-policy-text {
    font-size: 13px !important;
    color: var(--text-muted) !important;
    line-height: 1.5 !important;
    margin: 15px 0 !important;
}

.woocommerce-checkout .woocommerce-privacy-policy-text a {
    color: var(--primary-color) !important;
    text-decoration: none !important;
}

/* Accepter CGV */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
    display: block !important;
    background: #f8fafc !important;
    border-radius: 12px !important;
    padding: 16px !important;
    margin: 15px 0 !important;
    border: 1px solid var(--border-light) !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ****** Partie 10 : Bouton CTA — Shimmer Animé ******** */
@keyframes furzo-shimmer {
    0% {
        background-position: -200% center;
    }
    100% {
        background-position: 200% center;
    }
}

.woocommerce-checkout button#place_order {
    width: 100% !important;
    background: linear-gradient(
        90deg,
        #f3764a 0%,
        #f8a882 40%,
        #f3764a 60%,
        #e06337 100%
    ) !important;
    background-size: 200% auto !important;
    animation: furzo-shimmer 3s linear infinite !important;
    border: none !important;
    color: #fff !important;
    border-radius: 14px !important;
    padding: 18px 30px !important;
    font-weight: 800 !important;
    font-size: 16px !important;
    font-family: 'Outfit', sans-serif !important;
    box-shadow: 0 8px 25px rgba(243, 118, 74, 0.3) !important;
    cursor: pointer !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: block !important;
    text-align: center !important;
    letter-spacing: 0.3px !important;
    margin-top: 20px !important;
}

.woocommerce-checkout button#place_order:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 30px rgba(243, 118, 74, 0.4) !important;
}

.woocommerce-checkout button#place_order:active {
    transform: translateY(0) !important;
    box-shadow: 0 6px 16px rgba(243, 118, 74, 0.25) !important;
}

/* ****** Partie 11 : Transporteurs / Livraison ******** */
.shipping-methods-step2-wrapper {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1.5px solid var(--border-light);
}

.shipping-methods-step2-wrapper h3 {
    font-size: 18px !important;
    margin-bottom: 18px !important;
}

#furzo-shipping-methods-step2 ul#shipping_method {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#furzo-shipping-methods-step2 ul#shipping_method li {
    display: flex !important;
    align-items: center !important;
    padding: 15px 20px !important;
    border: 1.5px solid var(--border-light) !important;
    border-radius: 12px !important;
    margin-bottom: 12px !important;
    background: #fff !important;
    transition: var(--transition-smooth) !important;
}

#furzo-shipping-methods-step2 ul#shipping_method li:hover {
    border-color: rgba(243, 118, 74, 0.3) !important;
    transform: translateY(-1px) !important;
}

/* ****** Partie 12 : Boxtal — Widget Carte & Points Relais ******** */
/* Zone sélecteur de transporteur Boxtal */
.woocommerce-checkout .woocommerce-shipping-fields .woocommerce-additional-fields,
.woocommerce-checkout #bw_checkout_widget,
.woocommerce-checkout [class*="bw_"] {
    font-family: 'Outfit', sans-serif !important;
}

/* Conteneur général du widget Boxtal */
.woocommerce-checkout .bw-checkout-widget-container,
.woocommerce-checkout [id^="bw-"] {
    border-radius: 16px !important;
    overflow: hidden !important;
    border: 1.5px solid var(--border-light) !important;
    margin-top: 20px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04) !important;
}

/* Boutons du widget Boxtal */
.woocommerce-checkout .bw-button,
.woocommerce-checkout [class*="bw-btn"] {
    background: var(--primary-color) !important;
    border-radius: 10px !important;
    color: #fff !important;
    border: none !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
    transition: var(--transition-smooth) !important;
}

.woocommerce-checkout .bw-button:hover,
.woocommerce-checkout [class*="bw-btn"]:hover {
    background: var(--primary-hover) !important;
}

/* Liste des transporteurs Boxtal */
.woocommerce-checkout .bw-carrier-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.woocommerce-checkout .bw-carrier-item,
.woocommerce-checkout [class*="bw-carrier"] {
    border: 1.5px solid var(--border-light) !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
    padding: 14px 18px !important;
    background: #fff !important;
    transition: var(--transition-smooth) !important;
}

.woocommerce-checkout .bw-carrier-item:hover,
.woocommerce-checkout [class*="bw-carrier"]:hover {
    border-color: rgba(243, 118, 74, 0.35) !important;
}

.woocommerce-checkout .bw-carrier-item.selected,
.woocommerce-checkout [class*="bw-carrier"].selected {
    border-color: var(--primary-color) !important;
    background: rgba(243, 118, 74, 0.03) !important;
}

/* Inputs Boxtal */
.woocommerce-checkout .bw-input,
.woocommerce-checkout [class*="bw-input"] {
    border-radius: 10px !important;
    border: 1.5px solid #dcdcdc !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 15px !important;
    padding: 12px 16px !important;
    transition: var(--transition-smooth) !important;
}

.woocommerce-checkout .bw-input:focus,
.woocommerce-checkout [class*="bw-input"]:focus {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 4px rgba(243, 118, 74, 0.15) !important;
    outline: none !important;
}

/* Correctifs de la carte Boxtal (modal et bouton de fermeture) */
#bw-map {
    border-radius: 20px !important;
    overflow: visible !important;
    border: none !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15) !important;
}

#bw-map-inner {
    border-radius: 20px !important;
    overflow: visible !important; /* Permet à la croix en absolute d'être affichée à l'extérieur */
    background: #fff !important;
    padding: 15px !important;
}

#bw-map-inner .bw-close {
    position: absolute !important;
    top: -15px !important;
    right: -15px !important;
    width: 34px !important;
    height: 34px !important;
    background-color: #fff !important;
    border: 2px solid var(--border-light) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 99999 !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important;
    transition: var(--transition-smooth) !important;
}

#bw-map-inner .bw-close::before,
#bw-map-inner .bw-close::after {
    content: '' !important;
    position: absolute !important;
    width: 14px !important;
    height: 2px !important;
    background-color: var(--text-color) !important;
}

#bw-map-inner .bw-close::before {
    transform: rotate(45deg) !important;
}

#bw-map-inner .bw-close::after {
    transform: rotate(-45deg) !important;
}

#bw-map-inner .bw-close:hover {
    background-color: #fff0eb !important;
    border-color: var(--primary-color) !important;
}


/* ****** Partie 13 : Validation Visuelle ******** */
.woocommerce-checkout .woocommerce-invalid input.input-text,
.woocommerce-checkout .woocommerce-invalid select,
.woocommerce-checkout .woocommerce-invalid .select2-selection--single {
    border-color: #e63946 !important;
    background-color: rgba(230, 57, 70, 0.02) !important;
    box-shadow: 0 0 0 4px rgba(230, 57, 70, 0.1) !important;
}

.woocommerce-checkout .woocommerce-invalid-required-field label {
    color: #e63946 !important;
}

/* ****** Partie 14 : Stepper Mobile (Barre de Progression) ******** */
/* Sur PC, le stepper est caché */
.furzo-mobile-stepper {
    display: none !important;
}

/* ****** Partie 15 : Transition Wizard Mobile ******** */
.furzo-wizard-step {
    transition: opacity 0.25s ease-in-out;
}

.wizard-hidden {
    display: none !important;
}


/* Boutons Navigation Wizard */
.wizard-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 24px;
    gap: 16px;
}

#nav-step-1 {
    justify-content: flex-end;
}

#nav-step-3 {
    margin-top: 20px !important;
    border-top: 1.5px solid var(--border-light) !important;
    padding-top: 20px !important;
    justify-content: flex-start !important;
}

.btn-wizard-primary {
    background: var(--primary-color) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 12px !important;
    padding: 14px 28px !important;
    font-weight: 800 !important;
    font-size: 15px !important;
    font-family: 'Outfit', sans-serif !important;
    box-shadow: 0 8px 20px rgba(243, 118, 74, 0.15) !important;
    cursor: pointer !important;
    transition: var(--transition-smooth) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.btn-wizard-primary:hover {
    background: var(--primary-hover) !important;
    box-shadow: 0 10px 25px rgba(243, 118, 74, 0.22) !important;
    transform: translateY(-2px) !important;
}

.btn-wizard-secondary {
    background: #eef1f6 !important;
    border: none !important;
    color: var(--text-color) !important;
    border-radius: 12px !important;
    padding: 14px 28px !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    font-family: 'Outfit', sans-serif !important;
    cursor: pointer !important;
    transition: var(--transition-smooth) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.btn-wizard-secondary:hover {
    background: #e2e7f0 !important;
}

/* ****** Partie 16 : Responsive — Mobile (< 768px) ******** */
@media (max-width: 768px) {

    /* Sur mobile : layout 1 colonne */
    body.woocommerce-checkout form.checkout.woocommerce-checkout {
        flex-direction: column !important;
        gap: 16px !important;
    }

    body.woocommerce-checkout form.checkout.woocommerce-checkout .col2-set {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    body.woocommerce-checkout form.checkout.woocommerce-checkout #order_review_heading,
    body.woocommerce-checkout form.checkout.woocommerce-checkout #order_review {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    /* Sur mobile : sticky désactivé */
    .woocommerce-checkout #order_review {
        position: static !important;
    }

    /* Sur mobile : Stepper visible */
    .furzo-mobile-stepper {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        position: relative;
        margin: 0 0 20px;
        padding: 0 10px;
    }

    .furzo-mobile-stepper::before {
        content: '';
        position: absolute;
        top: 22px;
        left: 40px;
        right: 40px;
        height: 3px;
        background: #eef1f6;
        z-index: 1;
    }

    .furzo-mobile-stepper .step {
        position: relative;
        z-index: 2;
        display: flex;
        flex-direction: column;
        align-items: center;
        cursor: default;
        flex: 1;
    }

    .furzo-mobile-stepper .step-number {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: #fff;
        border: 2px solid #eef1f6;
        color: var(--text-muted);
        font-weight: 700;
        font-size: 15px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: var(--transition-smooth);
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
    }

    .furzo-mobile-stepper .step-label {
        margin-top: 8px;
        font-size: 12px;
        font-weight: 700;
        color: var(--text-muted);
        transition: var(--transition-smooth);
        text-align: center;
    }

    .furzo-mobile-stepper .step.active .step-number {
        background: var(--primary-color);
        border-color: var(--primary-color);
        color: #fff;
        box-shadow: 0 8px 16px rgba(243, 118, 74, 0.25);
        transform: scale(1.1);
    }

    .furzo-mobile-stepper .step.active .step-label {
        color: var(--primary-color);
    }

    .furzo-mobile-stepper .step.completed .step-number {
        background: var(--success-color);
        border-color: var(--success-color);
        color: #fff;
        box-shadow: 0 8px 16px rgba(46, 196, 182, 0.25);
    }

    .furzo-mobile-stepper .step.completed .step-label {
        color: var(--success-color);
    }

    /* Cartes sur mobile */
    .woocommerce-checkout .col-1,
    .woocommerce-checkout .col-2,
    .woocommerce-checkout #order_review {
        padding: 24px 20px !important;
        border-radius: 16px !important;
    }

    /* Champs côte-à-côte → 1 colonne sur mobile */
    .woocommerce-checkout .col-1 .form-row-first,
    .woocommerce-checkout .col-1 .form-row-last,
    .woocommerce-checkout .col-2 .form-row-first,
    .woocommerce-checkout .col-2 .form-row-last {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
    }

    /* Coupon mobile */
    form.checkout_coupon.woocommerce-form-coupon input.input-text {
        width: 100% !important;
        margin-bottom: 12px !important;
    }

    form.checkout_coupon.woocommerce-form-coupon button.button {
        width: 100% !important;
        margin-left: 0 !important;
    }

    /* Boutons navigation wizard mobile */
    .wizard-navigation {
        flex-direction: column-reverse;
        gap: 10px;
    }

    .btn-wizard-primary,
    .btn-wizard-secondary {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* ****** Partie 17 : Corrections Stripe Saved Tokens ******** */
/* Override du style inline width:auto sur les inputs radio Stripe */
.woocommerce-checkout .wc-saved-payment-methods input[type="radio"],
.woocommerce-checkout .woocommerce-SavedPaymentMethods-tokenInput {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    flex-shrink: 0 !important;
}

/* Layout horizontal radio + label pour les tokens Stripe */
.woocommerce-checkout .woocommerce-SavedPaymentMethods-token {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    border: 1.5px solid var(--border-light) !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
    background: #fff !important;
    transition: var(--transition-smooth) !important;
    cursor: pointer !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout .woocommerce-SavedPaymentMethods-token:hover {
    border-color: rgba(243, 118, 74, 0.3) !important;
    background: #fefefe !important;
}

.woocommerce-checkout .woocommerce-SavedPaymentMethods-token label {
    color: var(--text-color) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    margin: 0 !important;
    flex: 1 !important;
    width: auto !important;
    white-space: normal !important;
}

/* Lien "Utiliser un nouveau moyen de paiement" */
.woocommerce-checkout .woocommerce-SavedPaymentMethods-saveNew {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 16px !important;
    margin-top: 8px !important;
    background: #f8fafc !important;
    border: 1.5px dashed var(--border-light) !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    color: var(--text-muted) !important;
    transition: var(--transition-smooth) !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout .woocommerce-SavedPaymentMethods-saveNew:hover {
    border-color: rgba(243, 118, 74, 0.3) !important;
    color: var(--primary-color) !important;
}

/* ****** Partie 18 : Icônes Cartes de Paiement ******** */
#payment ul.payment_methods li img {
    max-height: 28px !important;
    width: auto !important;
    border-radius: 4px !important;
    vertical-align: middle !important;
    margin-left: 8px !important;
}

/* Forcer l'affichage du formulaire Stripe CC quand "nouveau moyen de paiement" est coché */
.woocommerce-checkout #wc-dokan-stripe-connect-cc-form {
    display: none; /* Masqué par défaut si une carte existante est sélectionnée */
}

/* Règle spécifique pour forcer l'affichage si le radio "new" est coché */
.woocommerce-checkout #wc-dokan-stripe-connect-payment-token-new:checked ~ #wc-dokan-stripe-connect-cc-form,
.woocommerce-checkout #wc-dokan-stripe-connect-payment-token-new:checked + #wc-dokan-stripe-connect-cc-form,
.woocommerce-checkout #wc-dokan-stripe-connect-payment-token-new:checked ~ fieldset.wc-credit-card-form,
.woocommerce-checkout #wc-dokan-stripe-connect-payment-token-new:checked + fieldset.wc-credit-card-form {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    opacity: 1 !important;
}

/* Section "Données de sécurité" dans la card résumé */
.woocommerce-checkout .woocommerce-privacy-policy-text p,
.woocommerce-checkout .woocommerce-privacy-policy-text {
    font-size: 12.5px !important;
    color: var(--text-muted) !important;
    line-height: 1.5 !important;
    margin: 12px 0 !important;
}

.woocommerce-checkout .woocommerce-privacy-policy-text a {
    color: var(--primary-color) !important;
    font-weight: 600 !important;
}

/* ****** Partie 19 : Section "Expédier à une adresse différente" ******** */


.woocommerce-checkout #ship-to-different-address:hover {
    border-color: rgba(243, 118, 74, 0.3) !important;
}

.woocommerce-checkout #ship-to-different-address label {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--text-color) !important;
    margin: 0 !important;
    cursor: pointer !important;
}

.woocommerce-checkout #ship-to-different-address label span {
    display: inline-block !important;
}

/* ****** Partie 20 : Correction du Stepper sur grand écran ******** */
/* Le stepper DOIT rester caché sur PC (déjà géré en Partie 14) */
@media (min-width: 769px) {
    .furzo-mobile-stepper {
        display: none !important;
    }

    /* Sur PC : s'assurer que toutes les sections sont visibles */
    .woocommerce-checkout .col-1,
    .woocommerce-checkout .col-2,
    .woocommerce-checkout #order_review {
        opacity: 1 !important;
        position: static !important;
    }

    /* Override du wizard-hidden sur PC */
    body.woocommerce-checkout form.checkout.woocommerce-checkout .col-2,
    body.woocommerce-checkout form.checkout.woocommerce-checkout .col-1,
    body.woocommerce-checkout form.checkout.woocommerce-checkout .wizard-hidden {
        display: block !important;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        height: auto !important;
        overflow: visible !important;
        pointer-events: auto !important;
        opacity: 1 !important;
    }
}

/* ****** Partie 21 : Séparateur de section formulaire ******** */
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* CGV acceptance */
.woocommerce-checkout #terms-and-conditions-checkbox-text,
.woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text {
    font-size: 14px !important;
    color: var(--text-muted) !important;
    line-height: 1.5 !important;
}

.woocommerce-checkout #terms-and-conditions-checkbox-text a,
.woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text a {
    color: var(--primary-color) !important;
    font-weight: 600 !important;
}

/* CGV block layout fix */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper p.form-row {
    display: flex !important;
    align-items: flex-start !important;
    margin-top: 15px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper p.form-row label.checkbox {
    display: flex !important;
    align-items: flex-start !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper p.form-row label.checkbox span {
    flex: 1 !important;
    width: auto !important;
    display: inline-block !important;
    white-space: normal !important;
}

/* Fix "Expédier à une adresse différente ?" toggle native ID and layout */
.woocommerce-checkout #ship-to-different-address {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 16px 20px !important;
    background: #f8fafc !important;
    border: 1.5px solid var(--border-light) !important;
    border-radius: 14px !important;
    margin-bottom: 24px !important;
    cursor: pointer !important;
    transition: var(--transition-smooth) !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout #ship-to-different-address:hover {
    border-color: rgba(243, 118, 74, 0.3) !important;
}

.woocommerce-checkout #ship-to-different-address label {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--text-color) !important;
    margin: 0 !important;
    cursor: pointer !important;
    width: 100% !important;
}

.woocommerce-checkout #ship-to-different-address label span {
    display: inline-block !important;
}

/* Payment options and Stripe tokens container layout (1-column internally to avoid ugly columns wrap) */
.woocommerce-checkout #payment ul.payment_methods,
.woocommerce-checkout .wc-saved-payment-methods {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
}

.woocommerce-checkout .woocommerce-SavedPaymentMethods-token,
.woocommerce-checkout .woocommerce-SavedPaymentMethods-new,
.woocommerce-checkout .wc-stripe-saved-payment-methods-list-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    gap: 12px !important;
    background: #fff !important;
    padding: 12px 16px !important;
    border: 1.5px solid var(--border-light) !important;
    border-radius: 12px !important;
    margin-bottom: 8px !important;
    cursor: pointer !important;
    transition: var(--transition-smooth) !important;
}

.woocommerce-checkout .woocommerce-SavedPaymentMethods-token:hover,
.woocommerce-checkout .woocommerce-SavedPaymentMethods-new:hover {
    border-color: rgba(243, 118, 74, 0.3) !important;
}

.woocommerce-checkout .woocommerce-SavedPaymentMethods-token label,
.woocommerce-checkout .woocommerce-SavedPaymentMethods-new label {
    margin: 0 !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    color: var(--text-color) !important;
    cursor: pointer !important;
    flex: 1 !important;
}

/* Surcharge Select2 Dropdown Options Box */
.select2-dropdown {
    border: 1.5px solid var(--primary-color) !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
    overflow: hidden !important;
    z-index: 999999 !important;
    background: #fff !important;
    font-family: 'Outfit', sans-serif !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1.5px solid var(--border-light) !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    outline: none !important;
    font-family: 'Outfit', sans-serif !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--primary-color) !important;
}

.select2-container--default .select2-results__option {
    padding: 10px 16px !important;
    font-size: 14.5px !important;
    color: var(--text-color) !important;
}

.select2-container--default .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--primary-color) !important;
    color: #fff !important;
}


/* Notices d'erreur/succès Woo */
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-info {
    border-radius: 14px !important;
    padding: 16px 20px !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 14.5px !important;
    margin-bottom: 20px !important;
}

.woocommerce-checkout .woocommerce-error {
    background: rgba(230, 57, 70, 0.05) !important;
    border-color: rgba(230, 57, 70, 0.3) !important;
    color: #c62828 !important;
}

.woocommerce-checkout .woocommerce-message {
    background: rgba(46, 196, 182, 0.05) !important;
    border-color: rgba(46, 196, 182, 0.3) !important;
    color: #1a7a73 !important;
}

/* Style for desktop shipping selection list in order review table */
@media (min-width: 769px) {
    table.woocommerce-checkout-review-order-table tr.shipping td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    table.woocommerce-checkout-review-order-table tr.shipping th {
        display: block !important;
        width: 100% !important;
        border-bottom: none !important;
        padding-bottom: 0 !important;
        font-weight: 700 !important;
    }
    
    table.woocommerce-checkout-review-order-table tr.shipping ul#shipping_method {
        list-style: none !important;
        padding: 0 !important;
        margin: 10px 0 0 0 !important;
    }
    
    table.woocommerce-checkout-review-order-table tr.shipping ul#shipping_method li {
        display: block !important;
        padding: 12px 14px !important;
        border: 1.5px solid var(--border-light) !important;
        border-radius: 12px !important;
        margin-bottom: 8px !important;
        background: #fff !important;
        transition: var(--transition-smooth) !important;
    }
    
    table.woocommerce-checkout-review-order-table tr.shipping ul#shipping_method li:hover {
        border-color: rgba(243, 118, 74, 0.3) !important;
    }
    
    table.woocommerce-checkout-review-order-table tr.shipping ul#shipping_method li label {
        display: inline !important;
        font-size: 13.5px !important;
        font-weight: 600 !important;
        color: var(--text-color) !important;
        cursor: pointer !important;
    }
}