/* ========================================================================== WF Panier & Compte — Alta Cuir Charte : marine #151B33, lime #C4F994, gris #5B6076, surface #F3F4F8, bord #E3E5EE Arrondis : boutons 14px, cartes 20px ========================================================================== */ :root { --wf-ink: #151B33; --wf-muted: #5B6076; --wf-surface: #F3F4F8; --wf-border: #E3E5EE; --wf-accent: #C4F994; --wf-font: Montserrat, sans-serif; } .wf-ico { width: 20px; height: 20px; flex-shrink: 0; } /* Boutons génériques (tableau de bord) */ .wf-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 48px; padding: 0 22px; border-radius: 14px; font: 700 14px/1 var(--wf-font); text-decoration: none !important; transition: transform .15s ease, box-shadow .15s ease; } .wf-btn:active { transform: translateY(1px); } .wf-btn--primaire { background: var(--wf-ink); color: #FFFFFF !important; } .wf-btn--primaire:hover { background: #1E2542; } .wf-btn--secondaire { border: 2px solid var(--wf-ink); color: var(--wf-ink) !important; background: transparent; } /* ========================================================================== 1. PAGE PANIER (widget Elementor Pro « Panier », deux colonnes) ========================================================================== */ .elementor-widget-woocommerce-cart { font-family: var(--wf-font); color: var(--wf-ink); } /* En-tête : étapes + titre */ .wf-panier-head { margin: 0 0 28px; } .wf-etapes { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 24px; font: 600 13px/1 var(--wf-font); color: var(--wf-muted); } .wf-etapes__item { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px 7px 7px; border-radius: 999px; border: 1.5px solid var(--wf-border); } .wf-etapes__item.is-current { background: var(--wf-ink); color: #FFFFFF; border-color: var(--wf-ink); } .wf-etapes__num { width: 22px; height: 22px; border-radius: 999px; border: 1.5px solid #C9CDE0; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 800; } .wf-etapes__item.is-current .wf-etapes__num { background: var(--wf-accent); color: var(--wf-ink); border-color: var(--wf-accent); } .wf-etapes__sep { width: 28px; height: 2px; background: var(--wf-border); } .wf-panier-head__titre { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; } .wf-panier-head__titre h1 { margin: 0; font-family: var(--wf-font); font-style: italic; font-weight: 800; font-size: 40px !important; line-height: 1.15 !important; letter-spacing: -.5px; color: var(--wf-ink); } .wf-panier-head__count { font-size: 16px; font-weight: 500; color: var(--wf-muted); } /* Deux colonnes */ .elementor-widget-woocommerce-cart .e-cart__container { display: flex !important; flex-wrap: wrap; gap: 32px; align-items: flex-start; } .elementor-widget-woocommerce-cart .e-cart__column-start { flex: 999 1 560px !important; min-width: 0; width: auto !important; max-width: none !important; } .elementor-widget-woocommerce-cart .e-cart__column-end { flex: 1 1 340px !important; max-width: 400px; width: auto !important; } .elementor-widget-woocommerce-cart .e-cart__column-inner { padding: 0 !important; } /* Livraison offerte */ .wf-franco { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; background: var(--wf-surface); border-radius: 20px; padding: 18px 24px; margin: 0 0 16px; font-family: var(--wf-font); } .wf-franco__ico { width: 44px; height: 44px; border-radius: 999px; background: var(--wf-accent); color: var(--wf-ink); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .wf-franco__ico .wf-ico { width: 22px; height: 22px; } .wf-franco__body { flex: 1 1 240px; min-width: 0; display: flex; flex-direction: column; gap: 10px; } .wf-franco__txt { margin: 0 !important; font-size: 15px; font-weight: 500; line-height: 1.4; color: var(--wf-ink); } .wf-franco__txt strong { font-weight: 800; } .wf-franco__bar { height: 8px; border-radius: 999px; background: var(--wf-border); overflow: hidden; } .wf-franco__bar span { display: block; height: 100%; border-radius: 999px; background: var(--wf-accent); transition: width .4s ease; } .wf-franco--compact { border-radius: 14px; padding: 12px 16px; gap: 12px; margin: 4px 0 8px; } .wf-franco--compact .wf-franco__ico { width: 36px; height: 36px; } .wf-franco--compact .wf-franco__ico .wf-ico { width: 18px; height: 18px; } .wf-franco--compact .wf-franco__txt { font-size: 13px; } .wf-franco--compact .wf-franco__bar { height: 6px; } /* Lignes produits en cartes */ .elementor-widget-woocommerce-cart .e-shop-table { background: transparent !important; border: 0 !important; padding: 0 !important; border-radius: 0 !important; box-shadow: none !important; } .elementor-widget-woocommerce-cart table.cart { border: 0 !important; margin: 0 !important; width: 100%; border-collapse: separate; border-spacing: 0; background: transparent; } .elementor-widget-woocommerce-cart table.cart thead { display: none; } .elementor-widget-woocommerce-cart table.cart tbody { display: flex; flex-direction: column; gap: 16px; } .elementor-widget-woocommerce-cart table.cart tr.cart_item { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 20px; padding: 20px; background: #FFFFFF; border: 1px solid var(--wf-border) !important; border-radius: 20px; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td { display: block; padding: 0 !important; border: 0 !important; background: transparent !important; width: auto; text-align: left; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td[data-title]::before { display: none !important; } .elementor-widget-woocommerce-cart table.cart td.product-thumbnail { order: 1; flex: 0 0 96px; } .elementor-widget-woocommerce-cart table.cart td.product-thumbnail a { display: block; } .elementor-widget-woocommerce-cart table.cart td.product-thumbnail img { width: 96px !important; height: 96px; max-width: none; object-fit: contain; border-radius: 16px; background: var(--wf-surface); padding: 8px; box-sizing: border-box; display: block; } .elementor-widget-woocommerce-cart table.cart td.product-name { order: 2; flex: 1 1 220px; min-width: 0; font-size: 16px; font-weight: 700; line-height: 1.3; } .elementor-widget-woocommerce-cart table.cart td.product-name a { color: var(--wf-ink) !important; text-decoration: none; } .elementor-widget-woocommerce-cart table.cart td.product-name a:hover { color: var(--wf-muted) !important; } .elementor-widget-woocommerce-cart table.cart td.product-name dl.variation { display: flex; flex-wrap: wrap; gap: 4px; margin: 6px 0 0; font-size: 13px; font-weight: 400; color: var(--wf-muted); } .elementor-widget-woocommerce-cart table.cart td.product-name dl.variation dt, .elementor-widget-woocommerce-cart table.cart td.product-name dl.variation dd { margin: 0; padding: 0; float: none; display: inline; font-weight: 400; border: 0; } .elementor-widget-woocommerce-cart table.cart td.product-name dl.variation dd p { margin: 0; display: inline; } .elementor-widget-woocommerce-cart table.cart td.product-price { order: 3; font-size: 14px; font-weight: 600; white-space: nowrap; } .elementor-widget-woocommerce-cart table.cart td.product-price::after { content: " l'unité"; font-weight: 400; color: var(--wf-muted); } .elementor-widget-woocommerce-cart table.cart td.product-quantity { order: 4; } .elementor-widget-woocommerce-cart table.cart td.product-subtotal { order: 5; font-size: 18px; font-weight: 800; min-width: 84px; text-align: right !important; white-space: nowrap; } .elementor-widget-woocommerce-cart table.cart td.product-remove { order: 6; } .elementor-widget-woocommerce-cart table.cart td.product-remove a.remove { width: 44px; height: 44px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: var(--wf-muted) !important; background: transparent !important; font-size: 0; line-height: 0; } .elementor-widget-woocommerce-cart table.cart td.product-remove a.remove:hover { background: var(--wf-surface) !important; color: var(--wf-ink) !important; } .elementor-widget-woocommerce-cart table.cart td.product-remove a.remove::before { content: ""; width: 20px; height: 20px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3'/%3E%3C/svg%3E") no-repeat center / contain; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3'/%3E%3C/svg%3E") no-repeat center / contain; } .elementor-widget-woocommerce-cart table.cart tr:not(.cart_item) { display: block; height: 0; overflow: hidden; } .elementor-widget-woocommerce-cart table.cart td.actions { padding: 0 !important; border: 0 !important; } .elementor-widget-woocommerce-cart .e-clear { display: none; } /* Stepper de quantité (JS) */ .elementor-widget-woocommerce-cart .quantity.wf-stepper { display: inline-flex; align-items: center; border: 1.5px solid var(--wf-border); border-radius: 14px; height: 44px; overflow: hidden; background: #FFFFFF; } .elementor-widget-woocommerce-cart .quantity.wf-stepper input.qty { width: 44px !important; height: 44px; border: 0 !important; border-radius: 0 !important; text-align: center; font: 700 15px var(--wf-font); color: var(--wf-ink); background: transparent !important; padding: 0 !important; margin: 0; box-shadow: none !important; -moz-appearance: textfield; appearance: textfield; } .elementor-widget-woocommerce-cart .quantity.wf-stepper input.qty::-webkit-outer-spin-button, .elementor-widget-woocommerce-cart .quantity.wf-stepper input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .wf-stepper__btn { width: 44px; height: 44px; border: 0; background: transparent; color: var(--wf-ink); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; border-radius: 0; } .wf-stepper__btn:hover { background: var(--wf-surface); } .wf-stepper__btn svg { width: 16px; height: 16px; } /* Code promo + continuer mes achats */ .elementor-widget-woocommerce-cart .coupon.e-cart-section { background: transparent !important; border: 0 !important; padding: 16px 0 0 !important; margin: 0 !important; border-radius: 0 !important; box-shadow: none !important; } .elementor-widget-woocommerce-cart .coupon .coupon-col { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; } .elementor-widget-woocommerce-cart .coupon .coupon-col::before { content: "Code promo"; font: 600 14px var(--wf-font); color: var(--wf-ink); margin-right: 4px; } .elementor-widget-woocommerce-cart .coupon .coupon-col-start { flex: 0 1 200px; min-width: 140px; } .elementor-widget-woocommerce-cart .coupon .coupon-col-end { flex: 0 0 auto; } .elementor-widget-woocommerce-cart .coupon #coupon_code { width: 100%; height: 44px; border: 1.5px solid var(--wf-border) !important; border-radius: 14px !important; padding: 0 14px !important; font: 500 14px var(--wf-font); color: var(--wf-ink); background: #FFFFFF !important; box-sizing: border-box; box-shadow: none !important; } .elementor-widget-woocommerce-cart .coupon .e-apply-coupon { height: 44px; padding: 0 18px !important; border-radius: 14px !important; border: 2px solid var(--wf-ink) !important; background: transparent !important; color: var(--wf-ink) !important; font: 700 14px var(--wf-font) !important; cursor: pointer; } .elementor-widget-woocommerce-cart .coupon .e-apply-coupon:hover { background: var(--wf-ink) !important; color: #FFFFFF !important; } .wf-continuer { display: inline-flex; align-items: center; gap: 6px; margin-top: 20px; font: 600 14px var(--wf-font); color: var(--wf-ink) !important; text-decoration: none !important; } .wf-continuer .wf-ico { width: 18px; height: 18px; } .wf-continuer:hover { color: var(--wf-muted) !important; } /* Récapitulatif */ .elementor-widget-woocommerce-cart .e-cart-totals { background: transparent !important; border: 0 !important; padding: 0 !important; border-radius: 0 !important; box-shadow: none !important; } .elementor-widget-woocommerce-cart .cart-collaterals { width: 100%; } .elementor-widget-woocommerce-cart .cart_totals { width: 100% !important; float: none !important; background: #FFFFFF; border: 1px solid var(--wf-border); border-radius: 20px; padding: 28px; box-sizing: border-box; box-shadow: 0 12px 32px rgba(21, 27, 51, .06); } .elementor-widget-woocommerce-cart .cart_totals h2 { margin: 0 0 12px !important; font: italic 800 22px/1.2 var(--wf-font) !important; color: var(--wf-ink) !important; } .elementor-widget-woocommerce-cart .cart_totals table { border: 0 !important; margin: 0 !important; width: 100%; border-collapse: collapse; } .elementor-widget-woocommerce-cart .cart_totals th, .elementor-widget-woocommerce-cart .cart_totals td { border: 0 !important; padding: 9px 0 !important; background: transparent !important; font-family: var(--wf-font); font-size: 15px; vertical-align: top; } .elementor-widget-woocommerce-cart .cart_totals tr { display: table-row !important; } .elementor-widget-woocommerce-cart .cart_totals th { display: table-cell !important; font-weight: 500 !important; color: var(--wf-muted) !important; text-align: left; width: auto !important; } .elementor-widget-woocommerce-cart .cart_totals td { display: table-cell !important; text-align: right; font-weight: 600 !important; color: var(--wf-ink) !important; } .elementor-widget-woocommerce-cart .cart_totals td[data-title]::before { display: none !important; } .elementor-widget-woocommerce-cart .cart_totals tr.shipping td { font-size: 13px; font-weight: 500 !important; } .elementor-widget-woocommerce-cart .cart_totals tr.shipping .e-checkout-message { display: block; font-size: 14px; font-weight: 600; color: var(--wf-ink); margin: 0; } .elementor-widget-woocommerce-cart .cart_totals tr.shipping .shipping-calculator-button { display: inline-block; margin-top: 4px; font-size: 12px; font-weight: 500; color: var(--wf-muted) !important; text-decoration: underline; } .elementor-widget-woocommerce-cart .cart_totals tr.shipping .shipping-calculator-form { text-align: left; margin-top: 8px; } .elementor-widget-woocommerce-cart .cart_totals tr.shipping ul#shipping_method { text-align: left; } .elementor-widget-woocommerce-cart .cart_totals tr.order-total th, .elementor-widget-woocommerce-cart .cart_totals tr.order-total td { border-top: 1px solid var(--wf-border) !important; padding-top: 16px !important; } .elementor-widget-woocommerce-cart .cart_totals tr.order-total th { font-size: 16px !important; font-weight: 700 !important; color: var(--wf-ink) !important; } .elementor-widget-woocommerce-cart .cart_totals tr.order-total td { font-size: 28px !important; font-weight: 800 !important; letter-spacing: -.5px; line-height: 1.1; } .elementor-widget-woocommerce-cart .cart_totals tr.order-total td .includes_tax, .elementor-widget-woocommerce-cart .cart_totals tr.order-total td .tax_label { display: block; font-size: 12px !important; font-weight: 400 !important; color: var(--wf-muted) !important; letter-spacing: 0; margin-top: 4px; } .elementor-widget-woocommerce-cart .wc-proceed-to-checkout { padding: 0 !important; margin: 16px 0 0 !important; } .elementor-widget-woocommerce-cart .wc-proceed-to-checkout a.checkout-button { display: flex !important; align-items: center; justify-content: center; width: 100%; height: 56px; box-sizing: border-box; margin: 0 !important; padding: 0 24px !important; border-radius: 14px !important; border: 0 !important; background: var(--wf-accent) !important; color: var(--wf-ink) !important; font: 800 16px var(--wf-font) !important; text-decoration: none; transition: filter .15s ease; } .elementor-widget-woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover { filter: brightness(.96); } .elementor-widget-woocommerce-cart .wc-proceed-to-checkout a.checkout-button::after { content: ""; width: 20px; height: 20px; margin-left: 10px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; } .wf-paiement-secure { margin: 12px 0 0 !important; font: 500 12px var(--wf-font); color: var(--wf-muted); display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; text-align: center; } .wf-paiement-secure .wf-ico { width: 14px; height: 14px; } .wf-reassurance { list-style: none; margin: 16px 0 0 !important; padding: 20px 24px; background: var(--wf-surface); border-radius: 20px; display: flex; flex-direction: column; gap: 14px; font: 400 14px/1.4 var(--wf-font); color: var(--wf-ink); } .wf-reassurance li { display: flex; align-items: center; gap: 12px; margin: 0; } .wf-reassurance li > span:last-child { display: flex; flex-direction: column; } .wf-reassurance li strong { font-weight: 700; } .wf-reassurance li span span { color: var(--wf-muted); } .wf-reassurance__ico { width: 36px; height: 36px; border-radius: 999px; background: #FFFFFF; color: var(--wf-ink); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .wf-reassurance__ico .wf-ico { width: 18px; height: 18px; } /* Panier vide (modèle Elementor « Panier vide ») */ .wf-panier-vide h2.elementor-heading-title { text-transform: none !important; font-size: 32px !important; line-height: 1.15 !important; } @media (max-width: 767px) { .wf-panier-vide h2.elementor-heading-title { font-size: 26px !important; } } /* Notices WooCommerce dans le panier */ .elementor-widget-woocommerce-cart .woocommerce-message, .elementor-widget-woocommerce-cart .woocommerce-info, .elementor-widget-woocommerce-cart .woocommerce-error { border-radius: 14px; font-family: var(--wf-font); } /* Mobile */ @media (max-width: 767px) { .wf-panier-head__titre h1 { font-size: 30px !important; } .wf-etapes__item { padding: 6px 10px 6px 6px; font-size: 12px; } .wf-etapes__sep { width: 14px; } .elementor-widget-woocommerce-cart table.cart tr.cart_item { padding: 14px; gap: 12px; position: relative; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td::before { display: none !important; content: none !important; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td { text-align: left !important; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td.product-thumbnail { flex: 0 0 72px; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td.product-thumbnail img { width: 72px !important; height: 72px; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td.product-name { flex: 1 1 140px; font-size: 14px; padding-right: 40px !important; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td.product-price { flex: 1 1 100%; font-size: 13px; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td.product-quantity { order: 4; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td.product-subtotal { order: 5; margin-left: auto; text-align: right !important; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td.product-remove { position: absolute; top: 8px; right: 8px; } .elementor-widget-woocommerce-cart table.cart tr.cart_item td.product-remove a.remove { width: 40px; height: 40px; } .elementor-widget-woocommerce-cart .cart_totals { padding: 20px; } .elementor-widget-woocommerce-cart .cart_totals tr.order-total td { font-size: 24px !important; } .elementor-widget-woocommerce-cart .coupon .coupon-col::before { flex: 0 0 100%; } .elementor-widget-woocommerce-cart .coupon .coupon-col-start { flex: 1 1 140px; } } /* ========================================================================== 2. PANNEAU LATÉRAL (widget Elementor Pro « Menu panier », type side cart) ========================================================================== */ .elementor-widget-woocommerce-menu-cart .elementor-button-icon-qty { background: var(--wf-accent) !important; color: var(--wf-ink) !important; font-weight: 800; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle .elementor-button-text { display: none; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__main { top: 0; bottom: 0; height: 100%; width: 440px !important; max-width: 100vw !important; background: #FFFFFF !important; padding: 0 !important; margin: 0 !important; display: flex; flex-direction: column; box-shadow: -24px 0 60px rgba(10, 20, 50, .35) !important; font-family: var(--wf-font); color: var(--wf-ink); overflow: hidden; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__main::before { content: "Votre panier"; display: block; flex: 0 0 auto; padding: 22px 72px 16px 24px; font: italic 800 22px/1.2 var(--wf-font); color: var(--wf-ink); border-bottom: 1px solid var(--wf-border); } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__close-button { position: absolute !important; top: 14px; right: 16px; width: 44px !important; height: 44px !important; margin: 0 !important; padding: 0 !important; border-radius: 999px; background: var(--wf-surface); color: var(--wf-ink); display: block; cursor: pointer; z-index: 2; align-self: auto !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__close-button:hover { background: var(--wf-border); } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__close-button::before, .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__close-button::after { background: var(--wf-ink) !important; width: 18px !important; height: 2px !important; left: 50% !important; margin-left: -9px; margin-top: -1px; } .elementor-widget-woocommerce-menu-cart .widget_shopping_cart_content { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__products { flex: 1 1 auto; min-height: 0; overflow: auto !important; padding: 14px 24px 8px !important; margin: 0 !important; max-height: none !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product { display: grid !important; grid-template-columns: 64px minmax(0, 1fr) 36px; grid-template-rows: auto auto; gap: 6px 14px; align-items: center; padding: 14px 0 !important; margin: 0 !important; border: 0 !important; border-bottom: 1px solid var(--wf-border) !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-image { grid-column: 1; grid-row: 1 / span 2; width: 64px !important; max-width: 64px !important; padding: 0 !important; margin: 0 !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-image img { width: 64px !important; height: 64px; object-fit: contain; border-radius: 14px; background: var(--wf-surface); padding: 6px; box-sizing: border-box; display: block; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name { grid-column: 2; grid-row: 1; padding: 0 !important; margin: 0 !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name a { font: 700 14px/1.3 var(--wf-font) !important; color: var(--wf-ink) !important; text-decoration: none; text-transform: none !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name dl.variation { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0 0; font-size: 12px; font-weight: 400; color: var(--wf-muted); } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name dl.variation dt, .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name dl.variation dd { margin: 0; padding: 0; display: inline; float: none; font-weight: 400; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-name dl.variation dd p { margin: 0; display: inline; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-price { grid-column: 2; grid-row: 2; padding: 0 !important; margin: 0 !important; font: 800 15px var(--wf-font) !important; color: var(--wf-ink) !important; text-transform: none !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-price .product-quantity { font-weight: 500; color: var(--wf-muted); font-size: 13px; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-remove { grid-column: 3; grid-row: 1 / span 2; position: relative !important; width: 36px !important; height: 36px !important; padding: 0 !important; margin: 0 !important; border-radius: 999px; background: var(--wf-surface); display: block; overflow: hidden; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-remove:hover { background: var(--wf-border); } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-remove a { position: absolute !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; margin: 0 !important; color: var(--wf-ink) !important; display: block; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-remove a::before, .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-remove a::after { content: ""; position: absolute !important; top: 50% !important; left: 50% !important; width: 14px !important; height: 2px !important; margin: -1px 0 0 -7px !important; background: var(--wf-ink) !important; border-radius: 1px; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-remove a::before { transform: rotate(45deg); } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__product-remove a::after { transform: rotate(-45deg); } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__products { overflow-x: hidden !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__subtotal { padding: 18px 24px 0 !important; margin: 0 !important; border-top: 1px solid var(--wf-border); display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font: 700 15px var(--wf-font) !important; color: var(--wf-ink) !important; text-align: left !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__subtotal .amount { font-size: 24px; font-weight: 800; color: var(--wf-ink); } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons { display: flex !important; flex-direction: column-reverse; gap: 10px; padding: 14px 24px 24px !important; margin: 0 !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons .elementor-button { width: 100%; margin: 0 !important; display: flex !important; align-items: center; justify-content: center; box-sizing: border-box; text-transform: none !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons .elementor-button--checkout { height: 52px; border-radius: 14px !important; border: 0 !important; background: var(--wf-accent) !important; color: var(--wf-ink) !important; font: 800 15px var(--wf-font) !important; } .elementor-widget-woocommerce-menu-cart .elementor-menu-cart__footer-buttons .elementor-button--view-cart { height: 48px; border-radius: 14px !important; background: transparent !important; border: 2px solid var(--wf-ink) !important; color: var(--wf-ink) !important; font: 700 14px var(--wf-font) !important; } .elementor-widget-woocommerce-menu-cart .woocommerce-mini-cart__empty-message { padding: 32px 24px; font: 500 15px var(--wf-font); color: var(--wf-muted); text-align: center; } .wf-cart-toast { display: none; align-items: center; gap: 10px; margin: 16px 24px 0; padding: 12px 16px; border-radius: 14px; background: var(--wf-accent); color: var(--wf-ink); font: 700 14px/1.3 var(--wf-font); } .wf-cart-toast.is-visible { display: flex; } .wf-cart-toast .wf-ico { width: 18px; height: 18px; stroke-width: 3; } /* ========================================================================== 3. ESPACE CLIENT (page Mon compte, widget Elementor Pro « Mon compte ») ========================================================================== */ /* -- Connexion (déconnecté) -- */ .wf-compte-card .e-my-account-tab > .woocommerce > h2 { display: none; } .wf-login-head { display: flex; align-items: center; gap: 12px; margin: 0 0 4px; } .wf-login-head__ico { width: 40px; height: 40px; border-radius: 999px; background: var(--wf-ink); color: var(--wf-accent); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .wf-login-head__titre { font: italic 800 24px/1.1 var(--wf-font); color: var(--wf-ink); } .wf-compte-card form.woocommerce-form-login { border: 0 !important; padding: 0 !important; margin: 0 !important; border-radius: 0; display: flex; flex-direction: column; gap: 18px; font-family: var(--wf-font); } .wf-compte-card form.woocommerce-form-login .form-row { margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 8px; width: 100%; float: none; } .wf-compte-card form.woocommerce-form-login label { font: 700 13px var(--wf-font); color: var(--wf-ink); } .wf-compte-card form.woocommerce-form-login label .required { color: var(--wf-muted); text-decoration: none; } .wf-compte-card form.woocommerce-form-login .input-text { width: 100%; height: 52px; box-sizing: border-box; border: 1.5px solid var(--wf-border) !important; border-radius: 14px !important; padding: 0 16px !important; font: 500 15px var(--wf-font) !important; color: var(--wf-ink) !important; background: var(--wf-surface) !important; box-shadow: none !important; } .wf-compte-card form.woocommerce-form-login .input-text:focus { border-color: var(--wf-ink) !important; outline: none; background: #FFFFFF !important; } .wf-compte-card form.woocommerce-form-login .password-input { display: block; position: relative; width: 100%; } .wf-compte-card form.woocommerce-form-login .password-input .input-text { padding-right: 56px !important; } .wf-compte-card form.woocommerce-form-login .show-password-input { top: 50% !important; right: 6px !important; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 10px; } .wf-compte-card form.woocommerce-form-login .woocommerce-LostPassword { order: 3; margin: -6px 0 0 !important; padding: 0 !important; text-align: right; } .wf-compte-card form.woocommerce-form-login .woocommerce-LostPassword a { font: 700 13px var(--wf-font); color: var(--wf-ink) !important; text-decoration: none; } .wf-compte-card form.woocommerce-form-login .woocommerce-LostPassword a:hover { text-decoration: underline; } .wf-compte-card form.woocommerce-form-login .form-row:has(.woocommerce-form-login__submit) { order: 4; gap: 14px; } .wf-compte-card form.woocommerce-form-login .woocommerce-form-login__rememberme { display: inline-flex !important; align-items: center; gap: 8px; font: 500 13px var(--wf-font); color: var(--wf-ink); } .wf-compte-card form.woocommerce-form-login .woocommerce-form-login__rememberme input { width: 18px; height: 18px; margin: 0; accent-color: var(--wf-ink); } .wf-compte-card form.woocommerce-form-login .woocommerce-form-login__submit { width: 100%; height: 56px; border-radius: 14px !important; border: 0 !important; background: var(--wf-ink) !important; color: #FFFFFF !important; font: 800 16px var(--wf-font) !important; cursor: pointer; margin: 0 !important; transition: background .15s ease; } .wf-compte-card form.woocommerce-form-login .woocommerce-form-login__submit:hover { background: #1E2542 !important; } .wf-login-secure { order: 5; margin: 0 !important; font: 500 12px var(--wf-font); color: var(--wf-muted); display: flex; align-items: center; gap: 6px; } .wf-login-secure .wf-ico { width: 14px; height: 14px; } .wf-compte-card .woocommerce-notices-wrapper .woocommerce-error, .wf-compte-card .woocommerce-notices-wrapper .woocommerce-message, .wf-compte-card .woocommerce-notices-wrapper .woocommerce-info { border-radius: 14px; font-family: var(--wf-font); margin-bottom: 18px; } /* Titres de la page (le thème force la taille des h1/h2 en !important) */ .wf-compte-intro h1.elementor-heading-title { font-size: 38px !important; line-height: 1.15 !important; text-transform: none !important; letter-spacing: -.5px !important; } .wf-nouveau-client h2.elementor-heading-title { font-size: 24px !important; line-height: 1.1 !important; text-transform: none !important; } .wf-tdb h3.elementor-heading-title { text-transform: none !important; font-size: 16px !important; line-height: 1.3 !important; } .wf-tdb-aide h3.elementor-heading-title { font-size: 17px !important; } @media (max-width: 767px) { .wf-compte-intro h1.elementor-heading-title { font-size: 28px !important; } } /* Carte connexion : colonne « Nouveau client » */ @media (min-width: 768px) { .wf-nouveau-client { border-left: 1px solid var(--wf-border); padding-left: 48px !important; } } @media (max-width: 767px) { .wf-nouveau-client { border-top: 1px solid var(--wf-border); padding-top: 28px !important; } } .wf-nouveau-client .elementor-icon-list-icon { width: 24px; height: 24px; border-radius: 999px; background: var(--wf-surface); display: inline-flex !important; align-items: center; justify-content: center; } .wf-nouveau-client .elementor-icon-list-icon i { margin: 0; } /* -- Connecté : la page passe en tableau de bord -- */ body.logged-in .wf-compte-intro, body.logged-in .wf-nouveau-client { display: none !important; } body.logged-in .wf-compte-card { background: transparent !important; box-shadow: none !important; padding: 0 !important; border: 0 !important; max-width: 100% !important; } body.logged-in .wf-compte-form { flex: 1 1 100% !important; width: 100% !important; max-width: 100% !important; } body.logged-in .elementor-widget-woocommerce-my-account .e-my-account-tab > .woocommerce { display: flex !important; flex-wrap: wrap; gap: 28px; align-items: flex-start; } body.logged-in .elementor-widget-woocommerce-my-account .e-my-account-tab > .woocommerce > .woocommerce-notices-wrapper { flex: 1 1 100%; } body.logged-in .elementor-widget-woocommerce-my-account .e-my-account-tab > .woocommerce > .woocommerce-notices-wrapper:empty { display: none; } .wf-compte-side { flex: 0 1 280px; width: 280px; background: #FFFFFF; border: 1px solid var(--wf-border); border-radius: 20px; padding: 16px; box-sizing: border-box; font-family: var(--wf-font); } .wf-compte-user { display: flex; align-items: center; gap: 12px; padding: 6px 8px 18px; border-bottom: 1px solid var(--wf-border); margin: 0 0 8px; } .wf-compte-user__avatar { width: 44px; height: 44px; border-radius: 999px; background: var(--wf-accent); color: var(--wf-ink); font: 800 15px/1 var(--wf-font); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .wf-compte-user__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .wf-compte-user__txt strong { font-size: 15px; font-weight: 700; color: var(--wf-ink); } .wf-compte-user__txt span { font-size: 12px; color: var(--wf-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation { width: 100% !important; float: none !important; margin: 0 !important; padding: 0 !important; } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 6px; } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li { margin: 0 !important; padding: 0 !important; border: 0 !important; } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li a { display: flex !important; align-items: center; gap: 12px; height: 48px; padding: 0 14px !important; border-radius: 14px; font: 600 14px var(--wf-font) !important; color: var(--wf-ink) !important; text-decoration: none !important; background: transparent; } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li a:hover { background: var(--wf-surface); } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.is-active a { background: var(--wf-ink) !important; color: #FFFFFF !important; font-weight: 700 !important; } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li a::before { content: ""; width: 20px; height: 20px; flex-shrink: 0; background: currentColor; -webkit-mask: var(--wf-nav-ico) no-repeat center / contain; mask: var(--wf-nav-ico) no-repeat center / contain; } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--dashboard a { --wf-nav-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='8' height='8' rx='2'/%3E%3Crect x='13' y='3' width='8' height='8' rx='2'/%3E%3Crect x='3' y='13' width='8' height='8' rx='2'/%3E%3Crect x='13' y='13' width='8' height='8' rx='2'/%3E%3C/svg%3E"); } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--orders a { --wf-nav-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8 12 3 3 8v8l9 5 9-5z'/%3E%3Cpath d='M3 8l9 5 9-5M12 13v8'/%3E%3C/svg%3E"); } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--downloads a { --wf-nav-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M7 10l5 5 5-5M4 21h16'/%3E%3C/svg%3E"); } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--edit-address a { --wf-nav-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.2 7-11a7 7 0 0 0-14 0c0 4.8 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--edit-account a { --wf-nav-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--payment-methods a { --wf-nav-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='3'/%3E%3Cpath d='M2 10h20'/%3E%3C/svg%3E"); } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 6px !important; padding-top: 6px !important; border-top: 1px solid var(--wf-border) !important; } .elementor-widget-woocommerce-my-account nav.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a { --wf-nav-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17l5-5-5-5M15 12H3M13 3h6v18h-6'/%3E%3C/svg%3E"); color: var(--wf-muted) !important; } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content { flex: 1 1 360px; min-width: 0; width: auto !important; float: none !important; margin: 0 !important; font-family: var(--wf-font); } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content-wrapper { padding: 0 !important; border: 0 !important; background: transparent !important; } body.logged-in .elementor-widget-woocommerce-my-account .e-my-account-tab__dashboard--custom .woocommerce-MyAccount-content-wrapper > .elementor { margin: 0; } body.logged-in .elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard) .woocommerce-MyAccount-content-wrapper { background: #FFFFFF !important; border: 1px solid var(--wf-border) !important; border-radius: 20px; padding: 24px 28px !important; } /* Pages internes du compte (commandes, adresses, informations) */ body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content a:not(.button):not(.wf-btn) { color: var(--wf-ink) !important; font-weight: 700; } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content .button, body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content button[type="submit"] { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 18px; border-radius: 12px !important; border: 0 !important; background: var(--wf-ink) !important; color: #FFFFFF !important; font: 700 13px var(--wf-font) !important; text-decoration: none !important; } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content table.shop_table { border: 0 !important; border-collapse: collapse; font-family: var(--wf-font); } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content table.shop_table th { font: 700 13px var(--wf-font); color: var(--wf-ink); border-bottom: 1px solid var(--wf-border) !important; } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content table.shop_table td { font-size: 14px; color: var(--wf-ink); border-bottom: 1px solid var(--wf-border) !important; border-top: 0 !important; } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content h2, body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content h3 { font-family: var(--wf-font) !important; font-style: italic; font-weight: 800; color: var(--wf-ink); text-transform: none !important; } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content .input-text, body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content select { border: 1.5px solid var(--wf-border) !important; border-radius: 14px !important; min-height: 48px; padding: 0 14px !important; font-family: var(--wf-font); background: #FFFFFF !important; box-shadow: none !important; } body.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content .woocommerce-Address { background: var(--wf-surface); border-radius: 16px; padding: 18px 20px; box-sizing: border-box; } /* Tableau de bord : modèle Elementor (tuiles, bloc d'aide) */ body.logged-in .wf-compte-card { --width: 100% !important; width: 100% !important; } .wf-tdb-tuiles > .e-con { width: calc(33.333% - 11px) !important; --width: calc(33.333% - 11px); } @media (max-width: 1024px) { .wf-tdb-tuiles > .e-con { width: calc(50% - 8px) !important; --width: calc(50% - 8px); } } @media (max-width: 767px) { .wf-tdb-tuiles > .e-con { width: 100% !important; --width: 100%; } } .wf-tdb-tuile { text-decoration: none !important; transition: box-shadow .15s ease, transform .15s ease; } .wf-tdb-tuile:hover { box-shadow: 0 12px 32px rgba(21, 27, 51, .08); transform: translateY(-2px); } .wf-tdb-aide .elementor-widget-icon { width: auto !important; flex: 0 0 auto; } .wf-tdb-aide .e-con .e-con { width: auto !important; --width: auto; flex: 1 1 0 !important; min-width: 0; } @media (max-width: 767px) { .wf-tdb-aide > .e-con { width: 100% !important; --width: 100%; } } /* Tableau de bord : titre, dernière commande */ .wf-compte-bonjour { display: flex; flex-direction: column; gap: 6px; margin: 0 0 8px; font-family: var(--wf-font); } .wf-compte-bonjour__eyebrow { font: 700 12px var(--wf-font); letter-spacing: 3px; text-transform: uppercase; color: var(--wf-muted); } .wf-compte-bonjour__titre { margin: 0 !important; font-family: var(--wf-font) !important; font-style: italic; font-weight: 800; font-size: 38px !important; line-height: 1.15 !important; letter-spacing: -.5px; color: var(--wf-ink); } .wf-compte-bonjour__titre span { box-shadow: inset 0 -.4em 0 var(--wf-accent); } .wf-derniere { background: #FFFFFF; border: 1px solid var(--wf-border); border-radius: 20px; padding: 24px 28px; display: flex; flex-direction: column; gap: 18px; font-family: var(--wf-font); color: var(--wf-ink); } .wf-derniere__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; } .wf-derniere__head > div { display: flex; flex-direction: column; gap: 4px; } .wf-derniere__eyebrow { font: 700 12px var(--wf-font); letter-spacing: 2px; text-transform: uppercase; color: var(--wf-muted); } .wf-derniere__titre { margin: 0 !important; font: italic 800 22px/1.2 var(--wf-font) !important; color: var(--wf-ink); } .wf-derniere__titre span { font-size: 14px; font-weight: 500; font-style: normal; color: var(--wf-muted); } .wf-derniere__texte { margin: 0; font-size: 15px; line-height: 1.5; color: var(--wf-muted); } .wf-derniere__statut { display: inline-flex; align-items: center; gap: 6px; background: var(--wf-surface); color: var(--wf-ink); font: 800 13px var(--wf-font); padding: 8px 14px; border-radius: 999px; } .wf-derniere__statut.wf-statut--completed, .wf-derniere__statut.wf-statut--lpc_transit, .wf-derniere__statut.wf-statut--lpc_delivered, .wf-derniere__statut.wf-statut--lpc_ready_to_ship { background: var(--wf-accent); } .wf-derniere__corps { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; } .wf-derniere__thumbs { display: flex; gap: 8px; } .wf-derniere__thumb { width: 64px; height: 64px; border-radius: 14px; background: var(--wf-surface); display: inline-flex; align-items: center; justify-content: center; overflow: hidden; } .wf-derniere__thumb img { width: 64px; height: 64px; object-fit: contain; padding: 6px; box-sizing: border-box; display: block; } .wf-derniere__infos { display: flex; flex-direction: column; gap: 4px; flex: 1 1 200px; } .wf-derniere__infos strong { font-size: 15px; font-weight: 700; } .wf-derniere__infos span { font-size: 13px; color: var(--wf-muted); } .wf-derniere__actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; } .wf-derniere__toutes { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font: 700 14px var(--wf-font); color: var(--wf-ink) !important; text-decoration: none !important; } .wf-derniere__toutes .wf-ico { width: 18px; height: 18px; } .wf-derniere__toutes:hover { color: var(--wf-muted) !important; } @media (max-width: 767px) { .wf-compte-side { flex: 1 1 100%; width: 100%; } .wf-compte-bonjour__titre { font-size: 30px !important; } .wf-derniere { padding: 18px; } } /* ================================================================== */ /* Page Commande */ /* ================================================================== */ .wf-commande-head { margin: 0 0 28px; } .wf-commande-head .wf-etapes { margin-bottom: 24px; } .wf-etapes__item.is-done { background: #FFFFFF; color: var(--wf-ink); text-decoration: none !important; } .wf-etapes__item.is-done .wf-etapes__num { background: var(--wf-accent); border-color: var(--wf-accent); color: var(--wf-ink); } .wf-etapes__item.is-done .wf-etapes__num .wf-ico { width: 12px; height: 12px; } .wf-etapes__item.is-done:hover { border-color: var(--wf-ink); } .wf-commande-head__titre { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; } .wf-commande-head__titre h1 { margin: 0; font-family: var(--wf-font); font-style: italic; font-weight: 800; font-size: 40px !important; line-height: 1.1 !important; letter-spacing: -.5px; color: var(--wf-ink); text-transform: none !important; } .wf-commande-head__retour { display: inline-flex; align-items: center; gap: 4px; font: 600 14px var(--wf-font); color: var(--wf-ink) !important; text-decoration: none !important; } .wf-commande-head__retour .wf-ico { width: 18px; height: 18px; transform: rotate(180deg); } .wf-commande-head__retour:hover { color: var(--wf-muted) !important; } /* Colonnes */ .woocommerce-checkout .e-checkout__container { display: flex !important; flex-wrap: wrap; gap: 32px !important; align-items: flex-start; } .woocommerce-checkout .e-checkout__column-start { flex: 999 1 560px !important; min-width: 0; width: auto !important; display: flex; flex-direction: column; gap: 20px; } .woocommerce-checkout .e-checkout__column-end { flex: 1 1 340px !important; max-width: 400px; width: auto !important; min-width: 0; } .woocommerce-checkout .e-checkout__column-inner.e-sticky-right-column { position: sticky; top: 24px; } /* Cartes */ .wf-co-card, .woocommerce-checkout #customer_details .col-1 { background: #FFFFFF; border: 1px solid var(--wf-border); border-radius: 20px; padding: 28px; display: flex; flex-direction: column; gap: 18px; width: 100% !important; max-width: none !important; float: none !important; box-sizing: border-box; margin: 0 !important; } .woocommerce-checkout #customer_details { display: flex; flex-direction: column; gap: 20px; margin: 0; } .woocommerce-checkout #customer_details::before, .woocommerce-checkout #customer_details::after { display: none; } .woocommerce-checkout #customer_details .col-2 { width: 100% !important; float: none !important; margin: 0; } .woocommerce-checkout #customer_details .col-2.wf-co-vide { display: none; } /* En-têtes de carte */ .wf-co-head, .wf-co-sub { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .wf-co-num { width: 32px; height: 32px; border-radius: 999px; background: var(--wf-ink); color: #FFFFFF; font: 800 13px/1 var(--wf-font); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .wf-co-head h3, .wf-co-sub__titre, .woocommerce-checkout .woocommerce-billing-fields > h3 { margin: 0 !important; font-family: var(--wf-font) !important; font-style: italic; font-weight: 800 !important; font-size: 22px !important; line-height: 1.2 !important; color: var(--wf-ink) !important; text-transform: none !important; letter-spacing: 0; } .woocommerce-checkout .woocommerce-billing-fields > h3 { display: flex; align-items: center; gap: 12px; } .woocommerce-checkout .woocommerce-billing-fields > h3::before { content: "1"; width: 32px; height: 32px; border-radius: 999px; background: var(--wf-ink); color: #FFFFFF; font: 800 13px/1 var(--wf-font); font-style: normal; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .wf-co-sub__aide, .wf-co-head__aide { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font: 600 12px var(--wf-font); color: var(--wf-muted); } .wf-co-head__aide .wf-ico { width: 14px; height: 14px; } .wf-co-head__aide--lime { background: var(--wf-accent); color: var(--wf-ink); font-weight: 800; padding: 6px 12px; border-radius: 999px; } /* Grilles de champs */ .woocommerce-checkout .woocommerce-billing-fields__field-wrapper, .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper, .woocommerce-checkout .wf-co-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper::before, .woocommerce-checkout .woocommerce-billing-fields__field-wrapper::after, .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper::before, .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper::after { display: none; } .woocommerce-checkout .wf-co-grid > .wf-co-sub, .woocommerce-checkout .form-row { grid-column: 1 / -1; } .woocommerce-checkout .form-row { float: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 8px; box-sizing: border-box; } .woocommerce-checkout .form-row.form-row-first, .woocommerce-checkout .form-row.form-row-last { grid-column: span 1; } .woocommerce-checkout .form-row label { margin: 0; font: 700 13px/1.3 var(--wf-font); color: var(--wf-ink); display: block; } .woocommerce-checkout .form-row label .required { color: var(--wf-muted); text-decoration: none; border: 0; } .woocommerce-checkout .form-row label .optional { font-weight: 500; color: var(--wf-muted); } .woocommerce-checkout .form-row .woocommerce-input-wrapper { display: block; width: 100%; } .woocommerce-checkout .form-row .input-text, .woocommerce-checkout .form-row select, .woocommerce-checkout .form-row textarea { width: 100%; height: 52px; border: 1.5px solid var(--wf-border); border-radius: 14px; padding: 0 16px; font: 500 15px var(--wf-font); color: var(--wf-ink); background: #FFFFFF; box-sizing: border-box; box-shadow: none; outline: none; transition: border-color .15s ease, box-shadow .15s ease; } .woocommerce-checkout .form-row textarea { height: auto; min-height: 96px; padding: 14px 16px; line-height: 1.5; resize: vertical; } .woocommerce-checkout .form-row .input-text::placeholder, .woocommerce-checkout .form-row textarea::placeholder { color: #8A8FA6; } .woocommerce-checkout .form-row .input-text:focus, .woocommerce-checkout .form-row select:focus, .woocommerce-checkout .form-row textarea:focus { border-color: var(--wf-ink); box-shadow: 0 0 0 3px rgba(21, 27, 51, .08); } .woocommerce-checkout .form-row.woocommerce-invalid .input-text, .woocommerce-checkout .form-row.woocommerce-invalid .select2-selection { border-color: #D9534F !important; } .woocommerce-checkout .form-row.woocommerce-validated .input-text { border-color: var(--wf-border); } .woocommerce-checkout .form-row .select2-container .select2-selection--single { height: 52px; border: 1.5px solid var(--wf-border); border-radius: 14px; background: #FFFFFF; } .woocommerce-checkout .form-row .select2-container--open .select2-selection--single, .woocommerce-checkout .form-row .select2-container--focus .select2-selection--single { border-color: var(--wf-ink); } .woocommerce-checkout .form-row .select2-container .select2-selection--single .select2-selection__rendered { line-height: 50px; padding: 0 40px 0 16px; font: 500 15px/50px var(--wf-font); color: var(--wf-ink); } .woocommerce-checkout .form-row .select2-container .select2-selection--single .select2-selection__arrow { height: 50px; right: 12px; } .select2-dropdown { border: 1.5px solid var(--wf-border) !important; border-radius: 14px !important; overflow: hidden; font-family: var(--wf-font); } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--wf-ink) !important; } .woocommerce-checkout #billing_email_field::after { content: "La confirmation de commande et le suivi du colis sont envoyés à cette adresse e-mail."; grid-column: 1 / -1; font: 500 12px/1.5 var(--wf-font); color: var(--wf-muted); } /* Livrer à une autre adresse */ .woocommerce-checkout .woocommerce-shipping-fields { display: flex; flex-direction: column; gap: 16px; } .woocommerce-checkout h3#ship-to-different-address { margin: 0 !important; font: 500 14px/1.4 var(--wf-font) !important; text-transform: none !important; letter-spacing: 0; color: var(--wf-ink); } .woocommerce-checkout h3#ship-to-different-address label { display: inline-flex !important; align-items: center; gap: 10px; cursor: pointer; font: inherit; margin: 0; } .woocommerce-checkout h3#ship-to-different-address input[type=checkbox] { width: 18px; height: 18px; margin: 0; accent-color: var(--wf-ink); position: static; opacity: 1; } .woocommerce-checkout .shipping_address { padding-top: 16px; border-top: 1px solid var(--wf-border); } /* Consigne de livraison */ .woocommerce-checkout .wf-co-card--livraison .woocommerce-additional-fields { padding-top: 16px; border-top: 1px solid var(--wf-border); } .woocommerce-checkout .woocommerce-additional-fields > h3 { display: none; } .woocommerce-checkout #order_comments_field label { font-weight: 600; font-size: 14px; } /* Cartes radio : livraison */ .wf-co-options { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 10px; } .wf-co-options + .wf-co-options { margin-top: 10px !important; } .wf-co-opt label { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border: 1.5px solid var(--wf-border); border-radius: 16px; background: #FFFFFF; cursor: pointer; margin: 0; font-family: var(--wf-font); transition: border-color .15s ease, background .15s ease; } .wf-co-opt label:hover { border-color: #B9BDD0; } .wf-co-opt.is-selected label { border: 2px solid var(--wf-ink); padding: 15px 17px; background: var(--wf-surface); } .wf-co-opt__radio { width: 20px !important; height: 20px !important; margin: 0 !important; accent-color: var(--wf-ink); flex-shrink: 0; } .wf-co-opt__ico { width: 40px; height: 40px; border-radius: 12px; background: var(--wf-surface); color: var(--wf-ink); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } .wf-co-opt.is-selected .wf-co-opt__ico { background: #FFFFFF; } .wf-co-opt__txt { display: flex; flex-direction: column; gap: 2px; flex: 1 1 0; min-width: 0; } .wf-co-opt__titre { font-size: 15px; font-weight: 700; color: var(--wf-ink); } .wf-co-opt__desc { font-size: 13px; color: var(--wf-muted); } .wf-co-opt__prix { font-size: 15px; font-weight: 800; color: var(--wf-ink); white-space: nowrap; } .wf-co-opt__prix .woocommerce-Price-amount { font-weight: 800; } .wf-co-livraison__msg { margin: 0 !important; display: flex; align-items: center; gap: 12px; padding: 16px 18px; border: 1.5px dashed var(--wf-border); border-radius: 16px; font: 500 14px/1.4 var(--wf-font); color: var(--wf-muted); } .wf-co-livraison--vide { display: none; } .wf-co-card--livraison:has(.wf-co-livraison--vide) .wf-co-head { display: none; } /* Paiement */ .wf-co-card--paiement .e-checkout__order_review-2 { width: 100%; } .woocommerce-checkout #payment { background: transparent !important; border-radius: 0; } .woocommerce-checkout #payment ul.wc_payment_methods { list-style: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; display: flex; flex-direction: column; gap: 10px; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method { margin: 0 !important; padding: 0 !important; border: 1.5px solid var(--wf-border); border-radius: 16px; background: #FFFFFF; line-height: 1.4; transition: border-color .15s ease, background .15s ease; overflow: hidden; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method:hover { border-color: #B9BDD0; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method.is-selected { border: 2px solid var(--wf-ink); background: var(--wf-surface); } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > input.input-radio { position: absolute; opacity: 0; width: 0; height: 0; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label { position: relative; display: flex !important; align-items: center; gap: 14px; padding: 16px 18px; margin: 0 !important; cursor: pointer; font: 700 15px/1.3 var(--wf-font) !important; color: var(--wf-ink); } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method.is-selected > label { padding: 15px 17px; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label::before { content: ""; position: absolute; left: 18px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; border-radius: 999px; border: 2px solid #C9CDE0; box-sizing: border-box; background: #FFFFFF; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method.is-selected > label::before { border: 6px solid var(--wf-ink); } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label::after { content: ""; width: 40px; height: 40px; border-radius: 12px; background-color: var(--wf-surface); flex-shrink: 0; order: -1; margin-left: 34px; background-repeat: no-repeat; background-position: center; background-size: 22px 22px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23151B33' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3C/svg%3E"); } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method.is-selected > label::after { background-color: #FFFFFF; } .woocommerce-checkout #payment li.payment_method_sogecommercestd > label::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23151B33' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='3'/%3E%3Cpath d='M2 10h20M6 15h4'/%3E%3C/svg%3E"); } .woocommerce-checkout #payment li.payment_method_bacs > label::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23151B33' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10 12 4l9 6M5 10v8M10 10v8M14 10v8M19 10v8M3 20h18'/%3E%3C/svg%3E"); } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label img { max-height: 24px; width: auto; margin-left: auto; float: none; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label a.about_paypal { font-weight: 500; font-size: 12px; color: var(--wf-muted); margin-left: 8px; } .woocommerce-checkout #payment div.payment_box { margin: 0 !important; padding: 0 18px 16px 72px !important; background: transparent !important; font: 500 13px/1.5 var(--wf-font); color: var(--wf-muted); border-radius: 0; } .woocommerce-checkout #payment div.payment_box::before { display: none !important; } .woocommerce-checkout #payment div.payment_box p { margin: 0; } .woocommerce-checkout #payment div.payment_box p + p { margin-top: 6px; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method:not(.is-selected) div.payment_box { display: none; } /* Conditions + bouton */ .woocommerce-checkout #payment .form-row.place-order { display: flex; flex-direction: column; gap: 16px; padding: 18px 0 0 !important; margin: 18px 0 0 !important; border-top: 1px solid var(--wf-border); } .woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { font: 500 12px/1.5 var(--wf-font); color: var(--wf-muted); } .woocommerce-checkout .woocommerce-privacy-policy-text p { margin: 0; font: 500 12px/1.5 var(--wf-font); color: var(--wf-muted); } .woocommerce-checkout .woocommerce-privacy-policy-text a, .woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text a { color: var(--wf-ink) !important; text-decoration: underline; } .woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .validate-required { margin-top: 12px !important; } .woocommerce-checkout .woocommerce-form__label-for-checkbox { display: flex !important; align-items: flex-start; gap: 10px; font: 500 14px/1.5 var(--wf-font) !important; color: var(--wf-ink); } .woocommerce-checkout .woocommerce-form__label-for-checkbox input[type=checkbox] { width: 18px; height: 18px; margin: 3px 0 0; accent-color: var(--wf-ink); flex-shrink: 0; position: static; opacity: 1; } .woocommerce-checkout .woocommerce-form__label-for-checkbox .woocommerce-terms-and-conditions-checkbox-text { font: inherit; } .woocommerce-checkout #payment .form-row.place-order .woocommerce-terms-and-conditions { display: none !important; } .woocommerce-checkout #place_order, .woocommerce-checkout #payment .form-row.place-order button.button { width: 100% !important; height: 60px !important; border: 0 !important; border-radius: 14px !important; background: var(--wf-accent) !important; color: var(--wf-ink) !important; font: 800 17px/1 var(--wf-font) !important; letter-spacing: 0; text-transform: none !important; display: inline-flex !important; align-items: center; justify-content: center; gap: 10px; cursor: pointer; margin: 0 !important; padding: 0 24px !important; box-shadow: none !important; transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; float: none !important; } .woocommerce-checkout #place_order:hover { filter: brightness(.96); box-shadow: 0 10px 24px rgba(196, 249, 148, .45) !important; } .woocommerce-checkout #place_order::after { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; } .woocommerce-checkout .wf-paiement-secure { margin: 0 !important; } .woocommerce-checkout .ppc-button-wrapper { margin-top: 12px; } /* Colonne droite : récapitulatif */ .woocommerce-checkout .e-checkout__column-inner { background: #FFFFFF; border: 1px solid var(--wf-border); border-radius: 20px; padding: 28px; display: flex; flex-direction: column; gap: 16px; box-shadow: 0 12px 32px rgba(21, 27, 51, .06); box-sizing: border-box; } .woocommerce-checkout .e-checkout__order_review { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; display: flex; flex-direction: column; gap: 16px; } .woocommerce-checkout .wf-co-recap-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .woocommerce-checkout #order_review_heading { margin: 0 !important; font-family: var(--wf-font) !important; font-style: italic; font-weight: 800 !important; font-size: 22px !important; line-height: 1.2 !important; color: var(--wf-ink) !important; text-transform: none !important; letter-spacing: 0; } .woocommerce-checkout .wf-co-modifier { font: 600 13px var(--wf-font); color: var(--wf-ink) !important; text-decoration: none !important; } .woocommerce-checkout .wf-co-modifier:hover { color: var(--wf-muted) !important; } .woocommerce-checkout #order_review { margin: 0; } .woocommerce-checkout table.woocommerce-checkout-review-order-table { display: block; width: 100%; border: 0 !important; margin: 0 !important; border-collapse: collapse; font-family: var(--wf-font); } .woocommerce-checkout table.woocommerce-checkout-review-order-table thead { display: none; } .woocommerce-checkout table.woocommerce-checkout-review-order-table tbody, .woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot { display: flex; flex-direction: column; } .woocommerce-checkout table.woocommerce-checkout-review-order-table tbody { gap: 14px; } .woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--wf-border); gap: 10px; } .woocommerce-checkout table.woocommerce-checkout-review-order-table tr { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .woocommerce-checkout table.woocommerce-checkout-review-order-table th, .woocommerce-checkout table.woocommerce-checkout-review-order-table td { border: 0 !important; padding: 0 !important; background: transparent !important; font-family: var(--wf-font); text-align: left; vertical-align: middle; line-height: 1.3; } .woocommerce-checkout tr.cart_item td.product-name { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 12px; align-items: center; flex: 1 1 0; min-width: 0; position: relative; font: 600 14px/1.3 var(--wf-font); color: var(--wf-ink); } .woocommerce-checkout tr.cart_item .wf-co-thumb { grid-row: 1 / span 2; width: 56px; height: 56px; border-radius: 12px; background: var(--wf-surface); overflow: hidden; display: inline-flex; align-items: center; justify-content: center; } .woocommerce-checkout tr.cart_item .wf-co-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; } .woocommerce-checkout tr.cart_item .wf-co-name { grid-column: 2; } .woocommerce-checkout tr.cart_item .product-quantity { position: absolute; left: 44px; top: -6px; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--wf-ink); color: #FFFFFF; font: 800 11px/20px var(--wf-font); text-align: center; box-sizing: border-box; } .woocommerce-checkout tr.cart_item dl.variation { grid-column: 2; margin: 2px 0 0 !important; font: 500 12px/1.4 var(--wf-font); color: var(--wf-muted); display: flex; flex-wrap: wrap; gap: 0 6px; } .woocommerce-checkout tr.cart_item dl.variation dt, .woocommerce-checkout tr.cart_item dl.variation dd { margin: 0 !important; padding: 0; font-weight: 500; } .woocommerce-checkout tr.cart_item dl.variation dd p { margin: 0; display: inline; } .woocommerce-checkout tr.cart_item td.product-total { font: 800 14px var(--wf-font); color: var(--wf-ink); white-space: nowrap; } .woocommerce-checkout tfoot tr th { font: 500 15px var(--wf-font); color: var(--wf-muted); } .woocommerce-checkout tfoot tr td { font: 600 15px var(--wf-font); color: var(--wf-ink); text-align: right !important; } .woocommerce-checkout tfoot tr.order-total { margin-top: 6px; padding-top: 16px; border-top: 1px solid var(--wf-border); align-items: baseline; } .woocommerce-checkout tfoot tr.order-total th { font: 700 16px var(--wf-font); color: var(--wf-ink); } .woocommerce-checkout tfoot tr.order-total td { font: 800 28px/1 var(--wf-font); letter-spacing: -.5px; } .woocommerce-checkout tfoot tr.order-total td strong { font-weight: 800; } .woocommerce-checkout tfoot tr.order-total td small.includes_tax { display: block; margin-top: 6px; font: 500 12px/1.3 var(--wf-font); color: var(--wf-muted); letter-spacing: 0; } .woocommerce-checkout tfoot tr.order-total td small.includes_tax .woocommerce-Price-amount { font-weight: 600; } /* Livraison dans le récapitulatif : seule la méthode choisie, en texte */ .woocommerce-checkout tr.woocommerce-shipping-totals td { font-weight: 600; } .woocommerce-checkout tr.woocommerce-shipping-totals ul#shipping_method { list-style: none !important; margin: 0 !important; padding: 0 !important; } .woocommerce-checkout tr.woocommerce-shipping-totals ul#shipping_method li { margin: 0 !important; padding: 0 !important; display: none; } .woocommerce-checkout tr.woocommerce-shipping-totals ul#shipping_method li:has(input:checked), .woocommerce-checkout tr.woocommerce-shipping-totals ul#shipping_method li:has(input[type=hidden]) { display: block; } .woocommerce-checkout tr.woocommerce-shipping-totals ul#shipping_method li input.shipping_method { position: absolute; opacity: 0; width: 0; height: 0; } .woocommerce-checkout tr.woocommerce-shipping-totals ul#shipping_method li label { display: inline; margin: 0; font: 600 14px/1.3 var(--wf-font); color: var(--wf-ink); cursor: default; } .woocommerce-checkout tr.woocommerce-shipping-totals .woocommerce-shipping-destination, .woocommerce-checkout tr.woocommerce-shipping-totals .woocommerce-shipping-calculator { display: none; } .woocommerce-checkout tr.woocommerce-shipping-totals td > p, .woocommerce-checkout tr.woocommerce-shipping-totals td small { margin: 0; font: 500 13px/1.4 var(--wf-font); color: var(--wf-muted); } .woocommerce-checkout tr.cart-discount td .woocommerce-remove-coupon { font-size: 12px; margin-left: 6px; color: var(--wf-muted) !important; } /* Code promo (Elementor) */ .woocommerce-checkout .e-coupon-box { margin: 0 !important; padding: 16px 0 0 !important; border: 0 !important; border-top: 1px solid var(--wf-border) !important; background: transparent !important; } .woocommerce-checkout .e-coupon-box .e-woocommerce-coupon-nudge { display: none !important; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor { display: flex !important; gap: 8px; align-items: center; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor #coupon_code { flex: 1 1 120px; min-width: 0; height: 44px; border: 1.5px solid var(--wf-border); border-radius: 14px; padding: 0 14px; font: 500 14px var(--wf-font); color: var(--wf-ink); background: #FFFFFF; box-sizing: border-box; width: auto; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor #coupon_code:focus { border-color: var(--wf-ink); outline: none; box-shadow: 0 0 0 3px rgba(21, 27, 51, .08); } .woocommerce-checkout .e-coupon-box .e-coupon-anchor .e-apply-coupon { height: 44px !important; padding: 0 16px !important; border-radius: 14px !important; border: 2px solid var(--wf-ink) !important; background: transparent !important; color: var(--wf-ink) !important; font: 700 13px/1 var(--wf-font) !important; text-transform: none !important; letter-spacing: 0; cursor: pointer; white-space: nowrap; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor .e-apply-coupon:hover { background: var(--wf-ink) !important; color: #FFFFFF !important; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor-description { display: none; } /* Messages WooCommerce (erreurs de validation) */ .woocommerce-checkout .woocommerce-NoticeGroup-checkout, .woocommerce-checkout .woocommerce-error, .woocommerce-checkout .woocommerce-message, .woocommerce-checkout .woocommerce-info { border-radius: 14px; font-family: var(--wf-font); } /* Récapitulatif repliable (mobile) */ .wf-co-toggle { display: none; } @media (max-width: 767px) { .wf-commande-head { margin-bottom: 20px; } .wf-commande-head__titre h1 { font-size: 30px !important; } .woocommerce-checkout .e-checkout__container { gap: 20px !important; } .woocommerce-checkout .e-checkout__column-end { max-width: none; flex: 1 1 100% !important; } .wf-co-card, .woocommerce-checkout #customer_details .col-1, .woocommerce-checkout .e-checkout__column-inner { padding: 20px; border-radius: 16px; } .woocommerce-checkout .e-checkout__column-inner { box-shadow: none; } .wf-co-head h3, .wf-co-sub__titre, .woocommerce-checkout .woocommerce-billing-fields > h3, .woocommerce-checkout #order_review_heading { font-size: 19px !important; } .wf-co-head__aide--lime { font-size: 11px; padding: 5px 10px; } .woocommerce-checkout .form-row.form-row-first, .woocommerce-checkout .form-row.form-row-last { grid-column: 1 / -1; } .woocommerce-checkout .form-row .input-text, .woocommerce-checkout .form-row select { height: 48px; } .woocommerce-checkout .form-row .select2-container .select2-selection--single { height: 48px; } .woocommerce-checkout .form-row .select2-container .select2-selection--single .select2-selection__rendered { line-height: 46px; } .woocommerce-checkout .form-row .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; } .wf-co-opt label { padding: 14px; gap: 12px; } .wf-co-opt.is-selected label { padding: 13px; } .wf-co-opt__ico { width: 36px; height: 36px; } .woocommerce-checkout #payment div.payment_box { padding-left: 18px !important; } /* Récapitulatif replié en haut */ .woocommerce-checkout .e-checkout__column-end.is-mobile .e-checkout__column-inner { display: none; border-top-left-radius: 0; border-top-right-radius: 0; border-top: 0; } .woocommerce-checkout .e-checkout__column-end.is-mobile.is-open .e-checkout__column-inner { display: flex; } .woocommerce-checkout .e-checkout__column-end.is-mobile .wf-co-toggle { display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px 16px; border: 1px solid var(--wf-border); border-radius: 16px; background: #FFFFFF; color: var(--wf-ink); font-family: var(--wf-font); text-align: left; cursor: pointer; } .woocommerce-checkout .e-checkout__column-end.is-mobile.is-open .wf-co-toggle { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .wf-co-toggle__txt { display: flex; flex-direction: column; gap: 2px; flex: 1 1 0; min-width: 0; } .wf-co-toggle__txt strong { font-size: 14px; font-weight: 700; } .wf-co-toggle__txt span { font-size: 12px; color: var(--wf-muted); } .wf-co-toggle__total { font-size: 16px; font-weight: 800; white-space: nowrap; } .wf-co-toggle .wf-ico { width: 18px; height: 18px; transform: rotate(90deg); transition: transform .2s ease; } .woocommerce-checkout .e-checkout__column-end.is-mobile.is-open .wf-co-toggle .wf-ico { transform: rotate(-90deg); } .woocommerce-checkout tfoot tr.order-total td { font-size: 24px; } } /* Commande — corrections de spécificité (styles du widget Elementor) */ .woocommerce-checkout .e-checkout__container .form-row .input-text, .woocommerce-checkout .e-checkout__container .form-row select, .woocommerce-checkout .e-checkout__container .form-row textarea, .woocommerce-checkout .e-checkout__container .e-coupon-box #coupon_code { background: #FFFFFF !important; border: 1.5px solid var(--wf-border) !important; border-radius: 14px !important; color: var(--wf-ink) !important; font-family: var(--wf-font) !important; font-size: 15px !important; box-shadow: none !important; } .woocommerce-checkout .e-checkout__container .form-row .input-text, .woocommerce-checkout .e-checkout__container .form-row select { height: 52px !important; padding: 0 16px !important; } .woocommerce-checkout .e-checkout__container .form-row textarea { padding: 14px 16px !important; min-height: 96px; } .woocommerce-checkout .e-checkout__container .e-coupon-box #coupon_code { height: 44px !important; padding: 0 14px !important; font-size: 14px !important; } .woocommerce-checkout .e-checkout__container .form-row .input-text:focus, .woocommerce-checkout .e-checkout__container .form-row textarea:focus, .woocommerce-checkout .e-checkout__container .e-coupon-box #coupon_code:focus { border-color: var(--wf-ink) !important; box-shadow: 0 0 0 3px rgba(21, 27, 51, .08) !important; } .woocommerce-checkout .e-checkout__container .form-row.woocommerce-invalid .input-text { border-color: #D9534F !important; } .woocommerce-checkout .e-checkout__container .form-row label { font: 700 13px/1.3 var(--wf-font) !important; color: var(--wf-ink) !important; margin: 0 !important; padding: 0 !important; } .woocommerce-checkout .e-checkout__container .form-row label.checkbox, .woocommerce-checkout .e-checkout__container .woocommerce-form__label-for-checkbox { font: 500 14px/1.5 var(--wf-font) !important; } .woocommerce-checkout table.woocommerce-checkout-review-order-table td, .woocommerce-checkout table.woocommerce-checkout-review-order-table th { width: auto !important; } .woocommerce-checkout tr.cart_item td.product-name { font-size: 0 !important; flex: 1 1 0 !important; } .woocommerce-checkout tr.cart_item td.product-name > * { font-size: 14px; } .woocommerce-checkout tr.cart_item td.product-name dl.variation { font-size: 12px; } .woocommerce-checkout tr.cart_item td.product-total { flex: 0 0 auto; } .woocommerce-checkout tr.woocommerce-shipping-totals { align-items: flex-start !important; } .woocommerce-checkout tr.woocommerce-shipping-totals th { flex: 0 0 auto; } .woocommerce-checkout tr.woocommerce-shipping-totals td { flex: 0 1 62%; font: 500 13px/1.4 var(--wf-font) !important; color: var(--wf-muted) !important; } .woocommerce-checkout tr.woocommerce-shipping-totals td ul#shipping_method li label { font-size: 14px !important; color: var(--wf-ink) !important; font-weight: 600 !important; } .woocommerce-checkout .e-checkout__column-inner .woocommerce-checkout-review-order-table tfoot th { font-weight: 500 !important; color: var(--wf-muted) !important; font-size: 15px !important; } .woocommerce-checkout .e-checkout__column-inner .woocommerce-checkout-review-order-table tfoot tr.order-total th { font-weight: 700 !important; color: var(--wf-ink) !important; font-size: 16px !important; } .woocommerce-checkout .e-checkout__column-inner .woocommerce-checkout-review-order-table tfoot td { font-size: 15px !important; color: var(--wf-ink) !important; } .woocommerce-checkout .e-checkout__column-inner .woocommerce-checkout-review-order-table tfoot tr.order-total td { font-size: 28px !important; } .woocommerce-checkout .e-checkout__column-inner .woocommerce-checkout-review-order-table tfoot tr.order-total td small { font-size: 12px !important; } @media (max-width: 767px) { .woocommerce-checkout .e-checkout__column-inner .woocommerce-checkout-review-order-table tfoot tr.order-total td { font-size: 24px !important; } .woocommerce-checkout .e-checkout__container .form-row .input-text { height: 48px !important; } } .woocommerce-checkout table.woocommerce-checkout-review-order-table td, .woocommerce-checkout table.woocommerce-checkout-review-order-table th { max-width: none !important; } .woocommerce-checkout tr.woocommerce-shipping-totals td { max-width: 62% !important; } @media (min-width: 768px) { .woocommerce-checkout .e-checkout__column-end { flex: 0 0 380px !important; max-width: 380px; } } .woocommerce-checkout .e-checkout__container .form-row::before, .woocommerce-checkout .e-checkout__container .form-row::after { display: none !important; content: none !important; } .woocommerce-checkout .e-checkout__container .form-row .woocommerce-input-wrapper { margin: 0 !important; } .woocommerce-checkout table.woocommerce-checkout-review-order-table tr { padding: 0 !important; border: 0 !important; } .woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot tr.order-total { padding-top: 16px !important; border-top: 1px solid var(--wf-border) !important; } @media (min-width: 768px) { .woocommerce-checkout #billing_postcode_field, .woocommerce-checkout #billing_city_field, .woocommerce-checkout #shipping_postcode_field, .woocommerce-checkout #shipping_city_field { grid-column: span 1 !important; } } .woocommerce-checkout h3#ship-to-different-address span, .woocommerce-checkout h3#ship-to-different-address label { font: 500 14px/1.4 var(--wf-font) !important; color: var(--wf-ink) !important; text-transform: none !important; } .woocommerce-checkout h3#ship-to-different-address { padding: 0 !important; } .woocommerce-checkout .wf-co-card .woocommerce-additional-fields, .woocommerce-checkout .wf-co-card .e-checkout__order_review-2, .woocommerce-checkout .wf-co-card #payment { border: 0 !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; background: transparent !important; box-shadow: none !important; } .woocommerce-checkout .wf-co-card .woocommerce-additional-fields { padding-top: 16px !important; border-top: 1px solid var(--wf-border) !important; } .woocommerce-checkout .wf-co-card .woocommerce-additional-fields__field-wrapper { margin: 0 !important; padding: 0 !important; } .woocommerce-checkout .e-checkout__container #customer_details .col-1, .woocommerce-checkout .e-checkout__container .wf-co-card { padding: 28px !important; } .woocommerce-checkout .e-checkout__container .woocommerce-billing-fields { display: flex; flex-direction: column; gap: 22px; } .woocommerce-checkout .wf-co-note { grid-column: 1 / -1; margin: -6px 0 0 !important; font: 500 12px/1.5 var(--wf-font); color: var(--wf-muted); } @media (max-width: 767px) { .woocommerce-checkout .e-checkout__container #customer_details .col-1, .woocommerce-checkout .e-checkout__container .wf-co-card { padding: 20px !important; } } @media (min-width: 768px) { .woocommerce-checkout .e-checkout__column-end { align-self: stretch !important; } .woocommerce-checkout .e-checkout__column-inner.e-sticky-right-column { position: sticky !important; top: 24px !important; } } .wf-commande-head__retour .wf-ico { transform: none !important; } .woocommerce-checkout #customer_details .col-1 > :empty, .woocommerce-checkout .wf-co-card > :empty { display: none !important; } .woocommerce-checkout .e-checkout__container #customer_details .col-1, .woocommerce-checkout .e-checkout__container .wf-co-card { border-radius: 20px !important; border: 1px solid var(--wf-border) !important; } @media (max-width: 767px) { .woocommerce-checkout .e-checkout__container #customer_details .col-1, .woocommerce-checkout .e-checkout__container .wf-co-card { border-radius: 16px !important; } .wf-commande-head .wf-etapes { gap: 6px; flex-wrap: nowrap; } .wf-commande-head .wf-etapes__item:not(.is-current) { font-size: 0; padding: 5px; gap: 0; } .wf-commande-head .wf-etapes__item:not(.is-current) .wf-etapes__num { font-size: 11px; } .wf-commande-head .wf-etapes__sep { width: 12px; flex-shrink: 0; } .wf-commande-head__titre { flex-direction: column; align-items: flex-start; gap: 8px; } } @media (max-width: 767px) { .woocommerce-checkout .e-checkout__column-end.is-mobile #order_review_heading { visibility: hidden; height: 0; } .woocommerce-checkout .e-checkout__column-end.is-mobile .wf-co-recap-head { justify-content: flex-end; margin-bottom: -8px; } } @media (max-width: 767px) { .wf-co-toggle .wf-ico { transform: rotate(-90deg) !important; } .woocommerce-checkout .e-checkout__column-end.is-mobile.is-open .wf-co-toggle .wf-ico { transform: rotate(90deg) !important; } .woocommerce-checkout .e-checkout__column-end.is-mobile .wf-co-recap-head { margin-bottom: 0; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor { flex-direction: row !important; flex-wrap: nowrap !important; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor > * { width: auto !important; margin: 0 !important; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor .coupon-container-grid, .woocommerce-checkout .e-coupon-box .e-coupon-anchor .form-row { flex: 1 1 auto; } } .woocommerce-checkout .e-coupon-box .e-coupon-anchor .form-row { flex: 1 1 auto; width: 100% !important; } .woocommerce-checkout .e-coupon-box .coupon-container-grid { display: flex !important; gap: 8px !important; align-items: center; width: 100%; } .woocommerce-checkout .e-coupon-box .coupon-container-grid .coupon-col-1 { flex: 1 1 auto; min-width: 0; width: auto !important; } .woocommerce-checkout .e-coupon-box .coupon-container-grid .coupon-col-2 { flex: 0 0 auto; width: auto !important; } .woocommerce-checkout .e-coupon-box .coupon-container-grid #coupon_code { width: 100% !important; } .woocommerce-checkout .e-coupon-box .e-coupon-anchor > .clear { display: none; } .woocommerce-checkout #customer_details wc-order-attribution-inputs { display: none !important; }