/**
 * VST43° — Disponibilité dans le panier et le panier latéral (correctif de recette, 21.10). Chargé sur la page panier et là où le panneau latéral existe.
 * Couleurs : variables globales Divi 5 (gcid-vst-*), avec le repli du brandbook ; aucune couleur en dur hors de ces variables.
 * Spécificité : « :is(.vst-srv, #vst-x#vst-y) » (même méthode que vst-service.css).
 */
:is(.vst-srv, #vst-x#vst-y), body:is(.vst-panier-page, .vst-commande-page) {
  --vd-rouge-fonce: var(--gcid-vst-rouge-fonce, #C41A1B);
  --vd-rouge: var(--gcid-vst-rouge, #E21F20);
  --vd-texte: var(--gcid-vst-texte, #575758);
  --vd-encre: var(--gcid-vst-encre, #232324);
  --vd-fond: var(--gcid-vst-fond, #FFF8F4);
  --vd-blanc: var(--gcid-vst-blanc, #FFFDFC);
  --vd-voile: var(--gcid-vst-voile, #FBE6DF);
  --vd-ligne: var(--gcid-vst-ligne, #E9DED7);
  --vd-erreur: var(--gcid-vst-erreur, #9F1C1C);
}

/* Ligne indisponible : photo et texte grisés ; la mention, « Retirer » et « Ajuster » restent à pleine opacité (lisibles et cliquables). */
:is(.vst-srv, #vst-x#vst-y) :is(.ligne, .pl-ligne).est-indispo :is(.ligne-img, .pl-img, .ligne-haut, .pl-haut, .attr, .pl-attr, .quantite, .pl-qte) { opacity: .45; filter: grayscale(1); }
:is(.vst-srv, #vst-x#vst-y) :is(.ligne, .pl-ligne).est-indispo :is(.quantite, .pl-qte) { pointer-events: none; }
:is(.vst-srv, #vst-x#vst-y) .vst-dispo-mention { display: inline-block; font: 600 13px/1.3 var(--font-corps); color: var(--vd-erreur); }
:is(.vst-srv, #vst-x#vst-y) .vst-dispo-mention.reduit { margin-right: 10px; }
:is(.vst-srv, #vst-x#vst-y) .vst-ajuster { display: inline-block; min-height: 44px; padding: 0 2px; border: 0; background: none; font: 400 13px/1 var(--font-corps); color: var(--vd-encre); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

/* Encadré au-dessus des lignes */
:is(.vst-srv, #vst-x#vst-y) .vst-dispo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 0 0 12px; padding: 14px 16px; background: var(--vd-blanc); border: 1px solid var(--vd-ligne); border-left: 4px solid var(--vd-rouge); border-radius: var(--rayon); color: var(--vd-texte); }
:is(.vst-srv, #vst-x#vst-y) .vst-dispo-txt { margin: 0; font: 600 14px/1.4 var(--font-corps); color: var(--vd-encre); }
:is(.vst-srv, #vst-x#vst-y) .vst-dispo .vst-retirer-indispo { height: 44px; padding: 0 16px; font-size: 13px; text-decoration: none; }
@media (max-width: 480px) { :is(.vst-srv, #vst-x#vst-y) .vst-dispo .vst-retirer-indispo { width: 100%; } }

/* Bouton « Valider la commande » inactif : aria-disabled, sans href, fond neutre lisible */
:is(.vst-srv, #vst-x#vst-y) .btn.vst-valider-inactif,
:is(.vst-srv, #vst-x#vst-y) .btn.vst-valider-inactif:hover { background: var(--vd-ligne); color: var(--vd-texte); cursor: not-allowed; box-shadow: none; }
:is(.vst-srv, #vst-x#vst-y) .vst-dispo-aide { margin: 6px 0 0; font: 400 13px/1.4 var(--font-corps); color: var(--vd-texte); text-align: center; }

/* Notices WooCommerce de la page panier : texte 4,5:1 minimum (texte #575758 ou encre sur fond clair, filet rouge).
   « !important » : les réglages WooCommerce de Divi (et-core-unified, « background / color … !important » sur les notices) posent du blanc ou du
   rouge-orangé sur fond orange ; seule la même force les surcharge. Portée : pages panier et commande (le snippet « Checkout promo » pose, sur la commande, un fond transparent « !important » : la spécificité plus haute de body:is() le dépasse). */
body:is(.vst-panier-page, .vst-commande-page) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) { background: var(--vd-fond) !important; color: var(--vd-texte) !important; border: 1px solid var(--vd-ligne) !important; border-left: 4px solid var(--vd-rouge) !important; border-radius: var(--gvid-vst-rayon, 4px); }
body:is(.vst-panier-page, .vst-commande-page) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) :is(li, p, span, strong) { color: var(--vd-texte) !important; }
body:is(.vst-panier-page, .vst-commande-page) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) a { color: var(--vd-encre) !important; text-decoration: underline; }
body:is(.vst-panier-page, .vst-commande-page) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info)::before { color: var(--vd-rouge) !important; }

/* Bouton « Voir le panier » et autres boutons dans une notice : lien souligné, pas de bloc rouge flottant à droite. */
body:is(.vst-panier-page, .vst-commande-page) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) a.button { float: none !important; display: inline !important; margin: 0 0 0 12px !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; color: var(--vd-encre) !important; font: 600 14px/1.5 var(--font-corps, "Open Sans", sans-serif) !important; text-decoration: underline !important; text-underline-offset: 3px; }
body:is(.vst-panier-page, .vst-commande-page) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) { margin: 0 0 12px !important; padding: 12px 16px !important; font: 400 14px/1.5 var(--font-corps, "Open Sans", sans-serif) !important; }
body:is(.vst-panier-page, .vst-commande-page) :is(.woocommerce-error, .woocommerce-message, .woocommerce-info)::before { display: none !important; }
body:is(.vst-panier-page, .vst-commande-page) .woocommerce-error li { margin: 0; padding: 0; }
body:is(.vst-panier-page, .vst-commande-page) .woocommerce-error { list-style: none; }

/* Notices du panier (21.10, passe 2) : même conteneur que la liste des lignes (gouttière 20 px, 40 px dès 960 px, 1440 px max), puis, en deux colonnes,
   même largeur que la colonne des lignes (1 colonne moins l'espace 64 px et le récapitulatif 400 px). Elles sont dans .woocommerce-notices-wrapper, hors du formulaire. */
body.vst-panier-page .woocommerce-notices-wrapper { max-width: 1440px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
body.vst-panier-page .woocommerce-notices-wrapper :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) { box-sizing: border-box !important; width: 100%; max-width: none !important; margin: 12px 0 0 !important; }
@media (min-width: 960px) {
	body.vst-panier-page .woocommerce-notices-wrapper { padding: 0 40px; }
	body.vst-panier-page .woocommerce-notices-wrapper :is(.woocommerce-error, .woocommerce-message, .woocommerce-info) { width: calc(100% - 464px); }
}

/* ——— Code promo et carte cadeau : un seul champ (21.10) ———
   Le champ du gabarit (« Code promo ou carte cadeau ») accepte les deux : PW Gift Cards, réglage pwgc_redeem_coupon_code = yes.
   Le snippet n° 5 « Checkout promo » (Code Snippets, actif sur le clone et en prod, inactif sur le devsite) ajoute « Vous avez un code promo ? »
   et masque le champ du panier : on neutralise ses ajouts ici, et les formulaires de PW Gift Cards sont retirés dans inc/vst-commande.php. */
body:is(.vst-panier-page, .vst-commande-page) :is(.vst-coupon-link, .vst-coupon-row, .woocommerce-form-coupon-toggle, .checkout_coupon, .checkout_pw_gift_card, #pwgc-redeem-gift-card-form) { display: none !important; }
:is(.vst-srv, #vst-x#vst-y) .ligne-code.coupon { display: grid !important; }
:is(.vst-srv, #vst-x#vst-y) .vst-code-msg, :is(.vst-srv, #vst-x#vst-y) #vst-code-message { margin: 0; padding: 0 0 6px; font: 400 13px/1.45 var(--font-corps); color: var(--vd-texte); }
:is(.vst-srv, #vst-x#vst-y) .vst-code-msg:empty, :is(.vst-srv, #vst-x#vst-y) #vst-code-message:empty { display: none; }
:is(.vst-srv, #vst-x#vst-y) :is(.vst-code-msg, #vst-code-message).erreur { color: var(--vd-erreur); font-weight: 600; }
:is(.vst-srv, #vst-x#vst-y) .ligne-code input[aria-invalid="true"] { border-color: var(--vd-erreur); }
/* Mobile : le récapitulatif de la colonne de droite est masqué ; seul le champ de code reste, au-dessus du formulaire. */
@media (max-width: 959.98px) {
  :is(.vst-srv, #vst-x#vst-y) .commande-grille .recap { display: block; order: -1; }
  :is(.vst-srv, #vst-x#vst-y) .commande-grille .recap > :not(.recap-carte), :is(.vst-srv, #vst-x#vst-y) .commande-grille .recap-carte > :not(details.code) { display: none; }
  :is(.vst-srv, #vst-x#vst-y) .commande-grille .recap-carte { padding: 0; border: 0; background: none; display: block; }
  :is(.vst-srv, #vst-x#vst-y) .commande-grille details.code { padding: 0 16px; background: var(--vd-blanc); border: 1px solid var(--vd-ligne); border-radius: var(--rayon); }
  :is(.vst-srv, #vst-x#vst-y) .commande-grille details.code[open] { padding-bottom: 10px; }
}

/* ——— Commande : relevé de recette du 21.10 ——— */
/* Étapes d'avancement : taille 14 px, étape courante en gras, étapes à venir en #575758 (6,9:1 sur #FFF8F4). */
:is(.vst-srv, #vst-x#vst-y) .etapes-tunnel { font-size: 14px; color: var(--vd-texte) !important; }
:is(.vst-srv, #vst-x#vst-y) .etapes-tunnel :is([data-fait], a) { color: var(--vd-encre) !important; text-decoration: underline; text-underline-offset: 3px; }
:is(.vst-srv, #vst-x#vst-y) .etapes-tunnel [aria-current="step"] { color: var(--vd-encre) !important; font-weight: 700; }

/* Bouton principal : #E21F20, texte blanc (4,7:1) ; inactif : fond neutre, texte #575758 (6,9:1), jamais un bouton rouge pâli. */
:is(.vst-srv, #vst-x#vst-y) :is(#payment #place_order, .btn.checkout-button:not(.vst-valider-inactif)) { background: var(--vd-rouge) !important; color: var(--vd-blanc) !important; border: 0 !important; opacity: 1; text-shadow: none; }
:is(.vst-srv, #vst-x#vst-y) :is(#payment #place_order, .btn.checkout-button:not(.vst-valider-inactif)):hover { background: var(--vd-rouge-fonce) !important; color: var(--vd-blanc) !important; }
:is(.vst-srv, #vst-x#vst-y) #payment #place_order:is(:disabled, [aria-disabled="true"]) { background: var(--vd-ligne) !important; color: var(--vd-texte) !important; opacity: 1; cursor: not-allowed; }
:is(.vst-srv, #vst-x#vst-y) #payment #place_order:disabled:hover { background: var(--vd-ligne) !important; color: var(--vd-texte) !important; }

/* Moyens de paiement : fond, couleur et marges de WooCommerce et de Divi neutralisés ; radio visible ; description lisible (7:1). */
:is(.vst-srv, #vst-x#vst-y) #payment ul.payment_methods > li { margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; }
:is(.vst-srv, #vst-x#vst-y) #payment .option > label { color: var(--vd-encre) !important; font-size: 14px; }
:is(.vst-srv, #vst-x#vst-y) #payment .option > input.input-radio { width: 20px !important; height: 20px !important; border: 1.5px solid var(--vd-texte) !important; background: var(--vd-blanc) !important; opacity: 1 !important; position: static; }
:is(.vst-srv, #vst-x#vst-y) #payment .option > input.input-radio:checked { border-color: var(--vd-encre) !important; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box { background: none !important; color: var(--vd-texte) !important; padding: 0 !important; margin: 8px 0 0 !important; font-size: 14px; line-height: 1.5; border: 0; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box :is(p, span, label, li) { color: var(--vd-texte) !important; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box::before, :is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box::after { display: none !important; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box :is(input, select, textarea) { color: var(--vd-encre); background: var(--vd-blanc); border: 1px solid var(--vst-ligne-ui, #9C7763); border-radius: var(--rayon); min-height: 44px; padding: 0 12px; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box a { color: var(--vd-encre) !important; text-decoration: underline; }
:is(.vst-srv, #vst-x#vst-y) #payment .woocommerce-notice, :is(.vst-srv, #vst-x#vst-y) #payment li > .woocommerce-info { color: var(--vd-texte) !important; }

/* CGV : le texte et l'astérisque restent sur la même ligne (le libellé WooCommerce contient un espace insécable et un <abbr> que la grille mettait sur une 2e ligne). */
:is(.vst-srv, #vst-x#vst-y) .woocommerce-terms-and-conditions-wrapper label.checkbox { display: block; position: relative; padding-left: 32px; }
:is(.vst-srv, #vst-x#vst-y) .woocommerce-terms-and-conditions-wrapper label.checkbox > input[type="checkbox"] { position: absolute; left: 0; top: 2px; margin: 0; }
:is(.vst-srv, #vst-x#vst-y) .woocommerce-terms-and-conditions-wrapper label.checkbox > :is(span, abbr) { display: inline; }
:is(.vst-srv, #vst-x#vst-y) .woocommerce-terms-and-conditions-wrapper abbr.required { text-decoration: none; border: 0; color: var(--vd-erreur); font-weight: 600; }
:is(.vst-srv, #vst-x#vst-y) .woocommerce-terms-and-conditions-wrapper a { color: var(--vd-encre) !important; text-decoration: underline !important; text-underline-offset: 3px; font-weight: 600; }
:is(.vst-srv, #vst-x#vst-y) .woocommerce-privacy-policy-text, :is(.vst-srv, #vst-x#vst-y) .woocommerce-privacy-policy-text p { color: var(--vd-texte); }

/* Point relais Colissimo : bouton secondaire de la DA (contour #232324, texte #232324), toujours visible. */
:is(.vst-srv, #vst-x#vst-y) :is(#lpc_pick_up_widget_show_map, .lpc_pick_up_widget_show_map, .lpc_pick_up_webservice_show_map, #lpc_layer_pickup_selection_button button) { display: inline-flex !important; visibility: visible !important; align-items: center; justify-content: center; min-height: 44px; height: auto; margin: 8px 0 0; padding: 10px 20px; border: 1px solid var(--vd-encre) !important; border-radius: var(--rayon); background: transparent !important; color: var(--vd-encre) !important; font: 600 12px/1.2 var(--font-titre) !important; letter-spacing: .14em; text-transform: uppercase; text-decoration: none !important; text-shadow: none; box-shadow: none; opacity: 1 !important; cursor: pointer; }
:is(.vst-srv, #vst-x#vst-y) :is(#lpc_pick_up_widget_show_map, .lpc_pick_up_widget_show_map, .lpc_pick_up_webservice_show_map, #lpc_layer_pickup_selection_button button):is(:hover, :focus-visible) { background: var(--vd-encre) !important; color: var(--vd-blanc) !important; }
:is(.vst-srv, #vst-x#vst-y) #lpc_layer_error_message:not(:empty) { margin-top: 8px; color: var(--vd-erreur); font-weight: 600; font-size: 13px; }
:is(.vst-srv, #vst-x#vst-y) #lpc_pick_up_info { margin-top: 8px; font-size: 13px; line-height: 1.45; color: var(--vd-texte); }

/* Newsletter (Mailchimp for WooCommerce, case posée au crochet woocommerce_after_checkout_billing_form) : même case que les CGV. */
:is(.vst-srv, #vst-x#vst-y) .mailchimp-newsletter { margin: 12px 0 0; padding: 0; }
:is(.vst-srv, #vst-x#vst-y) .mailchimp-newsletter label { display: block; position: relative; padding-left: 32px; margin: 0; font: 400 14px/1.5 var(--font-corps); color: var(--vd-encre); cursor: pointer; }
:is(.vst-srv, #vst-x#vst-y) .mailchimp-newsletter input[type="checkbox"] { -webkit-appearance: none; appearance: none; position: absolute; left: 0; top: 2px; width: 20px; height: 20px; margin: 0; border: 1.5px solid var(--vd-texte); border-radius: 3px; background: var(--vd-blanc); display: grid; place-items: center; }
:is(.vst-srv, #vst-x#vst-y) .mailchimp-newsletter input[type="checkbox"]::after { content: ""; width: 10px; height: 5px; border-left: 2px solid var(--vd-encre); border-bottom: 2px solid var(--vd-encre); transform: rotate(-45deg) translate(1px, -1px); opacity: 0; }
:is(.vst-srv, #vst-x#vst-y) .mailchimp-newsletter input[type="checkbox"]:checked { border-color: var(--vd-encre); }
:is(.vst-srv, #vst-x#vst-y) .mailchimp-newsletter input[type="checkbox"]:checked::after { opacity: 1; }
:is(.vst-srv, #vst-x#vst-y) #mailchimp-gdpr-fields { font-size: 14px; color: var(--vd-texte); }

/* ——— Bloc paiement (passe 2, 22.10) ———
   Défaut vu sur le devsite (passerelle chèque seule) : quand il n'y a qu'un moyen, checkout.js de WooCommerce masque son bouton radio (display:none) et la grille
   de la carte (22 px + 1 colonne) laisse le titre et le texte dans la colonne étroite : mots coupés, texte superposé. On garde la pastille visible (cochée) et
   on place le contenu dans la 2e colonne dans tous les cas.
   Les règles suivantes visent le balisage réel de SogeCommerce (carte, multi : .payment_method_sogecommerce*, ul.sogecommerce*-view-top/-bottom, li.block, champs
   « …_card_type », formulaire embarqué .kr-*, #sogecommerce_iframe) et de PayPal Payments (.payment_method_ppcp-*, .ppc-button-wrapper, #ppc-button-*, .ppcp-messages),
   actifs seulement en production : non vérifiables sur le devsite. */
:is(.vst-srv, #vst-x#vst-y) #payment .option > input.input-radio { display: grid !important; }
:is(.vst-srv, #vst-x#vst-y) #payment .option > label { grid-column: 2 / -1; min-width: 0; }
:is(.vst-srv, #vst-x#vst-y) #payment .option > label b { overflow-wrap: anywhere; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box { grid-column: 2 / -1; min-width: 0; max-width: 100%; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box :is(input[type="radio"], input[type="checkbox"]) { min-height: 0; width: 20px; height: 20px; padding: 0; margin: 0 8px 0 0; vertical-align: middle; accent-color: var(--vd-encre); }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box :is(ul, ol) { list-style: none; margin: 0; padding: 0; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box li { margin-left: 0; padding-left: 0; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box :is(table, tbody, tr, td) { display: block; width: auto; padding: 0; border: 0; background: none; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box img { display: inline-block; max-width: 85px; max-height: 30px; width: auto; height: auto; margin: 0 4px 0 0; vertical-align: middle; float: none; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box :is(.kr-smart-form, .kr-embedded, #sogecommerce_iframe, iframe) { max-width: 100%; }
:is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box .kr-form-error, :is(.vst-srv, #vst-x#vst-y) #payment .option .payment_box .kr-form-error span { color: var(--vd-erreur) !important; font-weight: 600; }
:is(.vst-srv, #vst-x#vst-y) #payment :is(.payment_method_ppcp-gateway, [class*="payment_method_ppcp-"]) .option .payment_box { margin-top: 12px !important; }
:is(.vst-srv, #vst-x#vst-y) #payment :is(.ppc-button-wrapper, [id^="ppc-button-"]) { width: 100%; max-width: 100%; min-width: 0; }
:is(.vst-srv, #vst-x#vst-y) #payment .ppcp-messages { margin: 8px 0 0; font-size: 13px; color: var(--vd-texte); }
:is(.vst-srv, #vst-x#vst-y) .bloc-club .lien-simple { color: var(--vd-encre); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }