/* Pages de la boutique WooCommerce (fiche produit, panier, commande, compte) aux couleurs ServAfrica (10 octobre 2026).
   Remplace le violet par defaut de WooCommerce par le vert de la charte ; titres en serif bleu nuit. */
.woocommerce{--sa-n:#0A2240;--sa-v:#13795B;--sa-v2:#0E5E46;--sa-or:#D4A843;--sa-clair:#F3F6FA;--sa-bord:#DCE3EC}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,
.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,.woocommerce #respond input#submit.alt,
.woocommerce a.button.disabled,.woocommerce button.button:disabled,.woocommerce button.button:disabled[disabled]{
  background:var(--sa-v);color:#fff;border:1px solid var(--sa-v);border-radius:8px;font-weight:700;padding:.75em 1.4em;min-height:44px;line-height:1.3}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce input.button.alt:hover{background:var(--sa-v2);border-color:var(--sa-v2);color:#fff}
.woocommerce a.button:focus-visible,.woocommerce button.button:focus-visible{outline:3px solid var(--sa-or);outline-offset:2px}
/* Fiche produit */
.woocommerce div.product .product_title{font-family:Georgia,"Times New Roman",serif;color:var(--sa-n);font-weight:700;line-height:1.2}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--sa-v);font-weight:700;font-size:1.5em}
.woocommerce div.product form.cart{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:1em}
.woocommerce div.product form.cart .quantity .qty{min-height:44px;border:1px solid var(--sa-bord);border-radius:8px}
.woocommerce div.product form.cart .button{flex:0 0 auto;font-size:1.05em;padding:.8em 1.8em}
.woocommerce div.product .woocommerce-tabs ul.tabs li{background:var(--sa-clair);border-color:var(--sa-bord);border-radius:8px 8px 0 0}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:#fff;border-bottom-color:#fff}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{color:var(--sa-n)}
.woocommerce div.product .woocommerce-tabs .panel h2,.woocommerce .related>h2,.woocommerce .upsells>h2{font-family:Georgia,"Times New Roman",serif;color:var(--sa-n)}
.woocommerce .product_meta a{color:var(--sa-v)}
/* Recommandations sous la fiche */
.woocommerce .related>h2{margin-top:1.4em}
.sa-reco-texte{color:#4A5568;margin:-.4em 0 1em;font-size:.95em}
.woocommerce ul.products li.product .woocommerce-loop-product__title{color:var(--sa-n);font-size:1em;line-height:1.35}
.woocommerce ul.products li.product .price{color:var(--sa-v);font-weight:700}
.woocommerce ul.products li.product .button{background:#fff;color:var(--sa-v);border:1px solid var(--sa-v)}
.woocommerce ul.products li.product .button:hover{background:var(--sa-v);color:#fff}
/* Messages */
.woocommerce-message,.woocommerce-info{border-top-color:var(--sa-v)}
.woocommerce-message::before,.woocommerce-info::before{color:var(--sa-v)}
.woocommerce span.onsale{background:var(--sa-or);color:var(--sa-n)}
/* Bouton desactive tant qu'une option n'est pas choisie (produit a variantes, ex. Soutenir) : vert attenue, plus de violet */
.woocommerce button.button.alt.disabled,.woocommerce button.button.alt.disabled:hover,.woocommerce button.button.alt:disabled,.woocommerce button.button.alt:disabled[disabled],.woocommerce button.button.alt:disabled:hover,
.woocommerce a.button.alt.disabled,.woocommerce a.button.alt.disabled:hover,.woocommerce button.button.disabled,.woocommerce button.button.disabled:hover{
  background:var(--sa-v);border-color:var(--sa-v);color:#fff;opacity:.55}
.woocommerce div.product form.cart .variations select{min-height:44px;border:1px solid var(--sa-bord);border-radius:8px;padding:0 10px}
.woocommerce div.product form.cart .reset_variations{color:var(--sa-v)}
/* Panier et validation de commande (blocs WooCommerce), 11 octobre 2026.
   Hello Elementor limite .site-main et le titre a 600 px entre 768 et 991 px de large (800 px jusqu'a 1199 px) :
   le bloc panier passait sous 700 px, le recapitulatif tombait sous les articles et la colonne produit etait ecrasee.
   On donne 1140 px a ces deux pages et on retire la marge negative de .alignwide, pour aligner titre et panier. */
body.woocommerce-cart main.site-main,body.woocommerce-checkout main.site-main,
body.woocommerce-cart .page-header .entry-title,body.woocommerce-checkout .page-header .entry-title{max-width:1140px}
@media (min-width:576px){body.woocommerce-cart main.site-main,body.woocommerce-checkout main.site-main{padding-inline:clamp(16px,3vw,40px);box-sizing:border-box}}
body.woocommerce-cart .site-main .alignwide,body.woocommerce-checkout .site-main .alignwide{margin-inline:0;max-width:100%;width:auto}
body.woocommerce-cart .site-main .alignfull,body.woocommerce-checkout .site-main .alignfull{margin-inline:0;max-width:100%}
/* Colonne produit : image plus grande, nom et description sur toute la largeur disponible */
body.woocommerce-cart .wc-block-cart-items .wc-block-cart-item__image{width:112px;padding-right:16px}
body.woocommerce-cart .wc-block-cart-items .wc-block-cart-item__image img{width:96px;max-width:96px;height:auto;border-radius:6px}
body.woocommerce-cart .wc-block-cart-items .wc-block-cart-item__product{min-width:0}
body.woocommerce-cart .wc-block-components-product-name{font-weight:700;color:var(--sa-n,#0A2240);text-decoration:none}
body.woocommerce-cart .wc-block-cart-item__wrap .wc-block-components-product-metadata{width:100%}
body.woocommerce-cart .wc-block-components-product-metadata__description{max-width:none}
/* Panier en colonne etroite (classes is-medium et is-mobile posees par WooCommerce) : grille 80 px + 132 px remplacee
   par l'image et toute la largeur restante pour le nom et la description. */
body.woocommerce-cart .is-medium table.wc-block-cart-items .wc-block-cart-items__row,
body.woocommerce-cart .is-mobile table.wc-block-cart-items .wc-block-cart-items__row,
body.woocommerce-cart .is-small table.wc-block-cart-items .wc-block-cart-items__row{grid-template-columns:112px minmax(0,1fr)}
/* Recapitulatif a droite des articles des 768 px de large (WooCommerce ne le fait qu'au-dela de 920 px de bloc) ;
   en dessous de 768 px il reste sous les articles. */
@media (min-width:768px){
  body.woocommerce-cart .wc-block-components-sidebar-layout{flex-direction:row;flex-wrap:nowrap;column-gap:32px}
  body.woocommerce-cart .wc-block-components-sidebar-layout .wc-block-components-main{flex:1 1 0%;width:auto;min-width:0}
  body.woocommerce-cart .wc-block-components-sidebar-layout .wc-block-components-sidebar{flex:0 0 300px;width:300px}
}
@media (min-width:1200px){
  body.woocommerce-cart .wc-block-components-sidebar-layout .wc-block-components-sidebar{flex-basis:360px;width:360px}
}
/* Bouton « Valider la commande » et « Commander » aux couleurs ServAfrica */
body .wc-block-cart__submit-button,body .wc-block-components-checkout-place-order-button,
body .wc-block-cart__submit-button:visited{background:#0A2240;color:#fff;border:1px solid #0A2240;border-radius:8px;
  font-weight:700;text-decoration:none;min-height:48px;box-shadow:none}
body .wc-block-cart__submit-button .wc-block-components-button__text,
body .wc-block-components-checkout-place-order-button .wc-block-components-button__text{text-decoration:none;color:#fff}
body .wc-block-cart__submit-button:hover,body .wc-block-cart__submit-button:focus,
body .wc-block-components-checkout-place-order-button:hover,body .wc-block-components-checkout-place-order-button:focus{background:#13795B;border-color:#13795B;color:#fff;text-decoration:none}
body .wc-block-cart__submit-button:focus-visible,body .wc-block-components-checkout-place-order-button:focus-visible{outline:3px solid #D4A843;outline-offset:2px}
/* Paiement Maketou : mot d'explication au client sous le moyen de paiement (13 octobre 2026) */
.sa-maketou-note{font-size:.9em;line-height:1.5;background:#F3F6FA;border-left:3px solid #13795B;padding:8px 12px;margin:8px 0 0;color:#0A2240}
/* Panier vide (bloc WooCommerce « Nouveau dans la boutique ») : boutons verts de la charte, sans soulignement (13 octobre 2026) */
body.woocommerce-cart .wc-block-grid__product-add-to-cart .wp-block-button__link,
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wp-block-button__link{background:#13795B;color:#fff;border:1px solid #13795B;border-radius:8px;font-weight:700;text-decoration:none}
body.woocommerce-cart .wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wp-block-button__link:hover{background:#0E5E46;border-color:#0E5E46;color:#fff}
body.woocommerce-cart .wc-block-grid__product-link,body.woocommerce-cart .wc-block-grid__product-title{text-decoration:none;color:#0A2240;font-weight:700}
