/* ============================================================
   WCSE Checkout — layout 2 colonnes Shopify-like
   ============================================================ */

body.woocommerce-checkout {
    background: var(--wcse-bg);
    font-family: var(--wcse-font-body);
    color: var(--wcse-text);
}

body.woocommerce-checkout .page-title,
body.woocommerce-checkout .entry-header,
body.woocommerce-checkout .woocommerce-breadcrumb {
    display: none !important;
}

/* Grid 2 colonnes */
.wcse-checkout-grid {
    max-width: 1200px;
    margin: 32px auto 60px;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 40px;
    align-items: start;
}
.wcse-checkout-col-left { min-width: 0; }
.wcse-checkout-col-right { min-width: 0; }
.wcse-checkout-sticky { position: sticky; top: 20px; }

/* Titre order review */
#order_review_heading {
    font-family: var(--wcse-font-heading);
    font-size: 20px;
    font-weight: 700;
    color: var(--wcse-text);
    margin: 0 0 16px;
}

/* Cards colonnes gauche (customer details) */
.wcse-checkout-col-left .woocommerce-billing-fields,
.wcse-checkout-col-left #customer_details > div {
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--wcse-text) 8%, transparent);
    border-radius: var(--wcse-radius,12px);
    padding: 24px;
    margin-bottom: 16px;
}
.wcse-checkout-col-left h3 {
    font-family: var(--wcse-font-heading);
    font-size: 18px;
    font-weight: 700;
    color: var(--wcse-text);
    margin: 0 0 20px;
}

/* Colonne droite order review */
.wcse-checkout-col-right #order_review {
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--wcse-text) 8%, transparent);
    border-radius: var(--wcse-radius,12px);
    padding: 24px;
}
.wcse-checkout-col-right .shop_table {
    width: 100%;
    border: 0;
    border-collapse: collapse;
    margin-bottom: 16px;
}
.wcse-checkout-col-right .shop_table th {
    padding: 8px 0;
    font-size: 12px;
    color: var(--wcse-secondary);
    font-weight: 500;
    text-align: left;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--wcse-text) 6%, transparent);
}
.wcse-checkout-col-right .shop_table td {
    padding: 10px 0;
    font-size: 14px;
    color: var(--wcse-text);
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--wcse-text) 6%, transparent);
}
.wcse-checkout-col-right .shop_table .product-name { font-weight: 500; }
.wcse-checkout-col-right .shop_table .product-total { text-align: right; font-weight: 600; }
.wcse-checkout-col-right .shop_table .order-total th,
.wcse-checkout-col-right .shop_table .order-total td {
    padding-top: 14px;
    font-size: 18px;
    font-weight: 700;
    color: var(--wcse-text);
    border-bottom: 0;
}
.wcse-checkout-col-right .shop_table .order-total td { text-align: right; }

/* Delivery estimate */
.wcse-checkout-delivery {
    display: flex; align-items: center; gap: 14px;
    padding: 14px 16px;
    background: color-mix(in srgb, var(--wcse-primary) 6%, #fff);
    border: 1px solid color-mix(in srgb, var(--wcse-primary) 20%, transparent);
    border-radius: var(--wcse-radius,10px);
    margin: 16px 0;
}
.wcse-checkout-delivery-icon { color: var(--wcse-primary); display: flex; }
.wcse-checkout-delivery-icon svg { width: 24px; height: 24px; }
.wcse-checkout-delivery-label {
    font-size: 12px;
    color: var(--wcse-secondary);
    display: flex; align-items: center; gap: 6px;
}
.wcse-checkout-delivery-badge {
    background: var(--wcse-primary);
    color: #fff;
    padding: 2px 8px;
    border-radius: var(--wcse-radius-sm,4px);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.wcse-checkout-delivery-date { font-size: 15px; margin-top: 2px; color: var(--wcse-text); }
.wcse-checkout-delivery-date strong { font-weight: 700; }

/* Champs floating labels */
.woocommerce-checkout .form-row {
    position: relative;
    margin-bottom: 16px;
}
.woocommerce-checkout .form-row label {
    position: absolute;
    top: 14px;
    left: 14px;
    font-size: 14px;
    color: var(--wcse-secondary);
    pointer-events: none;
    transition: all 0.15s;
    background: #fff;
    padding: 0 4px;
}
.woocommerce-checkout .form-row.wcse-checkout-has-value label,
.woocommerce-checkout .form-row.wcse-checkout-is-focused label {
    top: -8px;
    font-size: 11px;
    color: var(--wcse-primary);
    font-weight: 600;
}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select {
    width: 100%;
    padding: 14px;
    border: 1px solid color-mix(in srgb, var(--wcse-text) 15%, transparent);
    border-radius: var(--wcse-radius-sm,8px);
    font-size: 14px;
    font-family: inherit;
    background: #fff;
    color: var(--wcse-text);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus {
    border-color: var(--wcse-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--wcse-primary) 15%, transparent);
    outline: none;
}
.woocommerce-checkout .form-row .required {
    color: var(--wcse-accent);
}

/* Payment box */
#payment {
    background: color-mix(in srgb, var(--wcse-primary) 3%, #fff);
    border-radius: var(--wcse-radius,10px);
    padding: 16px;
    margin-top: 16px;
}
#payment ul.payment_methods {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
}
#payment ul.payment_methods li {
    padding: 10px 0;
    border-bottom: 1px solid color-mix(in srgb, var(--wcse-text) 6%, transparent);
}
#payment ul.payment_methods li:last-child { border-bottom: 0; }
#payment ul.payment_methods label {
    font-weight: 500;
    color: var(--wcse-text);
    display: inline-flex; align-items: center; gap: 8px;
}
#payment .payment_box {
    background: #fff;
    padding: 12px;
    border-radius: var(--wcse-radius-sm,6px);
    margin-top: 10px;
    font-size: 13px;
    color: var(--wcse-secondary);
}

/* Bouton commander */
#place_order {
    display: block;
    width: 100%;
    padding: 16px 24px;
    background: var(--wcse-primary) !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: var(--wcse-radius,10px)!important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: none;
    letter-spacing: 0;
    cursor: pointer;
    margin-top: 20px;
}
#place_order:hover { background: var(--wcse-text) !important; }

/* Responsive */
@media (max-width: 900px) {
    .wcse-checkout-grid { grid-template-columns: 1fr; gap: 20px; padding: 0 16px; }
    .wcse-checkout-sticky { position: static; }
}


/* ============================================================
   v4.1.6 — verrouillage contre Hello Elementor / WooCommerce
   ============================================================ */
/* Facturation et infos complémentaires empilées dans la colonne gauche (au lieu de 2 x 48 % en float) */
body .wcse-checkout-col-left .col2-set{display:block!important;width:100%!important}
body .wcse-checkout-col-left .col2-set .col-1,
body .wcse-checkout-col-left .col2-set .col-2{float:none!important;width:100%!important;max-width:100%!important;padding:0!important;margin:0 0 16px!important}
body .wcse-checkout-col-left .col2-set::after{content:none!important}
/* Une seule carte par bloc : la carte va sur .col-1 / .col-2, plus sur les fieldsets internes */
body .wcse-checkout-col-left #customer_details > div{background:#fff!important;border:1px solid color-mix(in srgb,var(--wcse-text) 8%,transparent)!important;border-radius:var(--wcse-radius,14px)!important;padding:24px!important}
body .wcse-checkout-col-left .woocommerce-billing-fields,
body .wcse-checkout-col-left .woocommerce-shipping-fields,
body .wcse-checkout-col-left .woocommerce-additional-fields{background:transparent!important;border:0!important;border-radius:0!important;padding:0!important;margin:0!important;box-shadow:none!important}
body .wcse-checkout-col-left h3{margin:0 0 18px!important}
body .wcse-checkout-col-left .woocommerce-additional-fields h3{margin-top:0!important}
/* Champs sur toute la largeur, prénom/nom côte à côte */
body .woocommerce-checkout .form-row{width:100%!important;float:none!important;clear:both!important;margin:0 0 12px!important;padding:0!important}
body .woocommerce-checkout .form-row-first,
body .woocommerce-checkout .form-row-last{width:calc(50% - 6px)!important;float:left!important;clear:none!important}
body .woocommerce-checkout .form-row-last{float:right!important}
body .woocommerce-checkout .form-row textarea{min-height:110px!important;resize:vertical!important}
body .woocommerce-checkout .form-row.wcse-checkout-has-value textarea::placeholder,
body .woocommerce-checkout .form-row.wcse-checkout-is-focused textarea::placeholder{color:transparent!important}
body .woocommerce-checkout .select2-container .select2-selection--single{height:52px!important;border:1px solid color-mix(in srgb,var(--wcse-text) 15%,transparent)!important;border-radius:var(--wcse-radius,10px)!important;display:flex!important;align-items:center!important;padding:0 14px!important}
body .woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow{height:50px!important;right:10px!important}
/* Récap commande : tableau sans bordures de thème */
body .wcse-checkout-col-right #order_review{padding:24px!important;background:#fff!important}
body .wcse-checkout-col-right .shop_table,
body .wcse-checkout-col-right .shop_table th,
body .wcse-checkout-col-right .shop_table td{background:transparent!important}
body .wcse-checkout-col-right .shop_table th,
body .wcse-checkout-col-right .shop_table td{border-left:0!important;border-right:0!important;border-top:0!important}
body .wcse-checkout-col-right .shop_table .product-name{font-size:14px!important;line-height:1.35!important}
body .wcse-checkout-col-right .shop_table .product-total,
body .wcse-checkout-col-right .shop_table .cart-subtotal td,
body .wcse-checkout-col-right .shop_table .order-total td{white-space:nowrap!important;text-align:right!important}
/* Zone paiement : plus de fond gris WooCommerce */
body .woocommerce-checkout #payment,
body .wcse-checkout-col-right #payment{background:transparent!important;border-radius:0!important;padding:0!important;margin-top:20px!important}
body .woocommerce-checkout #payment ul.payment_methods{border:0!important;padding:0!important;margin:0 0 16px!important}
body .woocommerce-checkout #payment ul.payment_methods li{list-style:none!important;background:#fff!important;border:1px solid color-mix(in srgb,var(--wcse-text) 12%,transparent)!important;border-radius:var(--wcse-radius,12px)!important;padding:14px 16px!important;margin:0 0 10px!important}
body .woocommerce-checkout #payment div.payment_box{background:color-mix(in srgb,var(--wcse-primary) 5%,#fff)!important;border-radius:var(--wcse-radius,10px)!important;color:var(--wcse-text)!important;margin:10px 0 0!important}
body .woocommerce-checkout #payment div.payment_box::before{display:none!important}
body .woocommerce-checkout #payment .woocommerce-notice,
body .woocommerce-checkout #payment .woocommerce-info{background:color-mix(in srgb,var(--wcse-accent) 8%,#fff)!important;border:1px solid color-mix(in srgb,var(--wcse-accent) 35%,transparent)!important;border-radius:var(--wcse-radius,12px)!important;color:var(--wcse-text)!important;padding:16px 18px!important;margin:0 0 16px!important}
body .woocommerce-checkout #payment .woocommerce-info::before{color:var(--wcse-accent)!important}
body .woocommerce-checkout #payment .place-order{padding:0!important}
body .woocommerce-checkout #place_order{width:100%!important;border-radius:var(--wcse-radius-pill,100px)!important;padding:16px 20px!important;font-size:16px!important}
body .woocommerce-checkout .woocommerce-privacy-policy-text{font-size:12.5px!important;color:var(--wcse-secondary)!important;margin:12px 0!important}
@media (max-width:900px){
  .wcse-checkout-grid{grid-template-columns:1fr!important;gap:20px!important}
  .wcse-checkout-sticky{position:static!important}
  body .woocommerce-checkout .form-row-first,body .woocommerce-checkout .form-row-last{width:100%!important;float:none!important}
}

/* v4.1.7 — le label flottant remplace le placeholder : on masque toujours le placeholder natif */
body .woocommerce-checkout .form-row textarea::placeholder,
body .woocommerce-checkout .form-row input.input-text::placeholder{color:transparent!important;opacity:0!important}
body .woocommerce-checkout .form-row textarea{padding-top:26px!important}

/* v4.4.4 — pays unique : WooCommerce rend <strong>France</strong> + input caché, sans champ.
   Le label flottant n'a rien sur quoi flotter : on l'affiche en étiquette au-dessus et on habille le texte comme un champ en lecture seule. */
body .woocommerce-checkout .form-row:has(> .woocommerce-input-wrapper > strong) label,body .woocommerce-checkout .form-row:has(> strong) label{position:static!important;display:block;top:auto!important;left:auto!important;padding:0 0 6px!important;font-size:12px!important;font-weight:600!important;color:var(--wcse-secondary)!important;background:transparent!important;transform:none!important}
body .woocommerce-checkout .form-row .woocommerce-input-wrapper > strong,body .woocommerce-checkout .form-row > strong{display:block;width:100%;padding:14px;border:1px solid color-mix(in srgb, var(--wcse-text) 15%, transparent);border-radius:var(--wcse-radius-sm,8px);font-size:14px;font-weight:500;color:var(--wcse-text);background:color-mix(in srgb, var(--wcse-text) 3%, #fff);line-height:1.4}
body .woocommerce-checkout .form-row:has(> .woocommerce-input-wrapper > strong) .woocommerce-input-wrapper{display:block}

/* v4.4.6 — même correctif, sans :has() : la classe wcse-checkout-static est posée par le JS du module */
body .woocommerce-checkout .form-row.wcse-checkout-static label,body .woocommerce-checkout .form-row.wcse-checkout-static.wcse-checkout-has-value label{position:static!important;display:block!important;top:auto!important;left:auto!important;padding:0 0 6px!important;font-size:12px!important;font-weight:600!important;color:var(--wcse-secondary)!important;background:transparent!important;transform:none!important;line-height:1.3!important}
body .woocommerce-checkout .form-row.wcse-checkout-static strong{display:block!important;width:100%!important;padding:14px!important;border:1px solid color-mix(in srgb, var(--wcse-text) 15%, transparent)!important;border-radius:var(--wcse-radius-sm,8px)!important;font-size:14px!important;font-weight:500!important;color:var(--wcse-text)!important;background:color-mix(in srgb, var(--wcse-text) 3%, #fff)!important;line-height:1.4!important}
body .woocommerce-checkout .form-row.wcse-checkout-static .woocommerce-input-wrapper{display:block!important}

/* v4.4.7 — champ pays en lecture seule */
body .woocommerce-checkout .form-row input.wcse-country-display{background:color-mix(in srgb, var(--wcse-text) 3%, #fff)!important;cursor:default!important;color:var(--wcse-text)!important}

/* v4.4.8 — Pays unique, WooCommerce récent : <select class="country_to_state--single"> à une seule option,
   que WooCommerce affiche en texte gras sans cadre (ce n'est pas un <strong>). On lui rend un cadre de champ :
   le label flottant retrouve un champ sur lequel flotter. */
body .woocommerce-checkout .form-row select.country_to_state--single{appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;display:block!important;width:100%!important;height:auto!important;min-height:0!important;padding:14px!important;margin:0!important;border:1px solid color-mix(in srgb, var(--wcse-text) 15%, transparent)!important;border-radius:var(--wcse-radius-sm,8px)!important;background:color-mix(in srgb, var(--wcse-text) 3%, #fff)!important;background-image:none!important;font-size:14px!important;font-weight:500!important;font-family:inherit!important;color:var(--wcse-text)!important;line-height:1.4!important;box-shadow:none!important;text-indent:0!important;pointer-events:none;cursor:default}
body .woocommerce-checkout .form-row select.country_to_state--single:focus{outline:none!important}

/* v4.4.9 — Pays à choix (plusieurs pays) : WooCommerce habille le select avec selectWoo (.select2-container).
   1) le label flottant passe au-dessus du cadre (il était peint derrière le conteneur select2) ;
   2) le select2 prend exactement la taille et la typo des autres champs. */
body .woocommerce-checkout .form-row label{z-index:3}
body .woocommerce-checkout .form-row .select2-container{width:100%!important;display:block!important;z-index:1}
body .woocommerce-checkout .form-row .select2-container .select2-selection--single{height:46px!important;min-height:0!important;border:1px solid color-mix(in srgb,var(--wcse-text) 15%,transparent)!important;border-radius:var(--wcse-radius-sm,8px)!important;background:#fff!important;box-shadow:none!important;display:block!important;padding:0!important}
body .woocommerce-checkout .form-row .select2-container .select2-selection--single .select2-selection__rendered{line-height:44px!important;height:44px!important;padding:0 40px 0 14px!important;font-size:14px!important;font-family:inherit!important;color:var(--wcse-text)!important}
body .woocommerce-checkout .form-row .select2-container .select2-selection--single .select2-selection__arrow{height:44px!important;width:32px!important;right:6px!important;top:0!important}
body .woocommerce-checkout .form-row .select2-container .select2-selection--single .select2-selection__arrow b{border-width:5px 4px 0 4px!important;border-color:var(--wcse-secondary) transparent transparent transparent!important;margin-left:-4px!important}
body .woocommerce-checkout .form-row .select2-container--open .select2-selection--single{border-color:var(--wcse-primary)!important}
body .woocommerce-checkout .form-row select.country_to_state:not(.country_to_state--single):not(.select2-hidden-accessible){height:46px!important;padding:0 14px!important;font-size:14px!important;font-family:inherit!important;background:#fff!important;border:1px solid color-mix(in srgb,var(--wcse-text) 15%,transparent)!important;border-radius:var(--wcse-radius-sm,8px)!important}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--wcse-primary)!important}
.select2-dropdown{border:1px solid color-mix(in srgb,var(--wcse-text) 15%,transparent)!important;border-radius:var(--wcse-radius-sm,8px)!important;font-family:var(--wcse-font-body)!important;font-size:14px!important}