/** * WehFiGO Commerce — WS-M (SOW §7) purchase-flow skin. * * Loaded only on WooCommerce surfaces (shop / product / cart / checkout / * order received / my account) by inc/wehfigo-commerce.php, which also adds * the `wehfigo-commerce` body class every selector here is scoped under — * Listeo's own woocommerce.min.css keeps loading, we simply out-specify it * without !important spam. Tokens: assets/css/wehfigo-tokens.css (+ page * palette vars from wehfigo-theme.css). Dark mode: html[data-theme="dark"]. * * Version: WEHFIGO_COMMERCE_VERSION (1.4.2) — independent of theme version. */ /* ========================================================= 0. Shared: typography, headings, notices, buttons ========================================================= */ body.wehfigo-commerce .woocommerce h1, body.wehfigo-commerce .woocommerce h2, body.wehfigo-commerce .woocommerce h3, body.wehfigo-commerce .woocommerce-page h1, body.wehfigo-commerce .woocommerce-page h2, body.wehfigo-commerce .woocommerce-page h3, body.wehfigo-commerce #titlebar h1, body.wehfigo-commerce #titlebar h2 { font-family: var(--font-family-brand); font-weight: 700; color: var(--color-page-heading); letter-spacing: -0.01em; } /* Primary Woo buttons → WehFiGO primary button language. background/color carry !important deliberately: Listeo paints Woo buttons via inline dynamic-color CSS + woocommerce.min.css .alt rules that both use !important (#F91942 / green), so tokens can never win without it. */ body.wehfigo-commerce .woocommerce .button, body.wehfigo-commerce .woocommerce button.button, body.wehfigo-commerce .woocommerce a.button, body.wehfigo-commerce .woocommerce input.button, body.wehfigo-commerce .woocommerce a.button.alt, body.wehfigo-commerce .woocommerce button.button.alt, body.wehfigo-commerce .woocommerce input.button.alt, body.wehfigo-commerce .woocommerce #respond input#submit.alt, body.wehfigo-commerce .woocommerce #respond input#submit, /* single product: .woocommerce sits on , not a wrapper div */ body.wehfigo-commerce.woocommerce div.product .button, body.wehfigo-commerce.woocommerce div.product button.button.alt { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: 44px; padding: 10px var(--space-5); border: 1px solid transparent; border-radius: var(--radius-md); background: var(--color-primary) !important; color: var(--color-brand-white) !important; font-family: var(--font-family-brand); font-size: var(--text-label); font-weight: 600; line-height: 1.2; letter-spacing: 0.01em; text-decoration: none; cursor: pointer; transition: background-color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-base) var(--ease-standard), transform var(--duration-fast) var(--ease-standard); } body.wehfigo-commerce .woocommerce .button:hover, body.wehfigo-commerce .woocommerce button.button:hover, body.wehfigo-commerce .woocommerce a.button:hover, body.wehfigo-commerce .woocommerce a.button.alt:hover, body.wehfigo-commerce .woocommerce button.button.alt:hover, body.wehfigo-commerce .woocommerce input.button.alt:hover, body.wehfigo-commerce.woocommerce div.product .button:hover, body.wehfigo-commerce .woocommerce input.button:hover { background: var(--color-primary-hover) !important; color: var(--color-brand-white) !important; box-shadow: var(--shadow-glow); } body.wehfigo-commerce .woocommerce .button:active, body.wehfigo-commerce .woocommerce a.button:active { transform: scale(0.98); } body.wehfigo-commerce .woocommerce .button:focus-visible, body.wehfigo-commerce .woocommerce a.button:focus-visible, body.wehfigo-commerce .woocommerce input.button:focus-visible { outline: none; box-shadow: var(--shadow-focus); } body.wehfigo-commerce .woocommerce .button:disabled, body.wehfigo-commerce .woocommerce .button.disabled { background: var(--color-page-border) !important; color: var(--color-page-muted) !important; cursor: not-allowed; box-shadow: none; } /* Secondary buttons (apply coupon, update cart) */ body.wehfigo-commerce .woocommerce button[name="apply_coupon"], body.wehfigo-commerce .woocommerce button[name="update_cart"] { background: transparent !important; border-color: var(--color-page-border); color: var(--color-page-heading) !important; } body.wehfigo-commerce .woocommerce button[name="apply_coupon"]:hover, body.wehfigo-commerce .woocommerce button[name="update_cart"]:hover { background: transparent !important; border-color: var(--color-page-heading); color: var(--color-page-heading) !important; box-shadow: none; } /* Notices — one calm banner language, AA in both modes */ body.wehfigo-commerce .woocommerce-message, body.wehfigo-commerce .woocommerce-info, body.wehfigo-commerce .woocommerce-error, body.wehfigo-commerce .woocommerce-noreviews, body.wehfigo-commerce p.no-comments { position: relative; margin: 0 0 var(--space-5); padding: var(--space-4) var(--space-5); border: 1px solid var(--color-page-border); border-left: 4px solid var(--color-primary); border-radius: var(--radius-md); background: var(--color-page-bg-alt); color: var(--color-page-heading); font-family: var(--font-family-body); font-size: var(--text-label); line-height: 1.55; box-shadow: none; list-style: none; } body.wehfigo-commerce .woocommerce-message { border-left-color: #1d8a4b; } body.wehfigo-commerce .woocommerce-error { border-left-color: var(--color-danger); } body.wehfigo-commerce .woocommerce-error li { margin: 0; } body.wehfigo-commerce .woocommerce-message .button, body.wehfigo-commerce .woocommerce-info .button, body.wehfigo-commerce .woocommerce-error .button { float: right; margin-left: var(--space-4); min-height: 36px; padding: 6px var(--space-4); } /* Form fields — the single most important trust surface */ body.wehfigo-commerce .woocommerce form .form-row label, body.wehfigo-commerce .woocommerce-page form .form-row label { font-family: var(--font-family-body); font-size: var(--text-label); font-weight: 500; color: var(--color-page-heading); margin-bottom: 6px; } body.wehfigo-commerce .woocommerce form .form-row .required { color: var(--color-danger); text-decoration: none; } body.wehfigo-commerce .woocommerce form .form-row input.input-text, body.wehfigo-commerce .woocommerce form .form-row textarea, body.wehfigo-commerce .woocommerce form .form-row select, body.wehfigo-commerce .woocommerce-page form .form-row input.input-text, body.wehfigo-commerce .woocommerce-page form .form-row textarea, body.wehfigo-commerce .woocommerce-page form .form-row select, body.wehfigo-commerce .woocommerce form .form-row .select2-container .select2-selection--single { min-height: 48px; padding: 12px var(--space-4); border: 1px solid var(--color-page-border); border-radius: var(--radius-md); background: var(--color-page-bg); color: var(--color-page-heading); font-family: var(--font-family-body); font-size: var(--text-label); line-height: 1.4; box-shadow: none; transition: border-color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard); } body.wehfigo-commerce .woocommerce form .form-row textarea { min-height: 96px; } body.wehfigo-commerce .woocommerce form .form-row input.input-text:focus, body.wehfigo-commerce .woocommerce form .form-row textarea:focus, body.wehfigo-commerce .woocommerce form .form-row select:focus { outline: none; border-color: var(--color-primary); box-shadow: var(--shadow-focus); } /* Woo inline validation states */ body.wehfigo-commerce .woocommerce form .form-row.woocommerce-invalid input.input-text, body.wehfigo-commerce .woocommerce form .form-row.woocommerce-invalid select { border-color: var(--color-danger); box-shadow: 0 0 0 3px var(--color-brand-red-muted); } body.wehfigo-commerce .woocommerce form .form-row.woocommerce-invalid label { color: var(--color-danger); } body.wehfigo-commerce .woocommerce form .form-row.woocommerce-validated input.input-text, body.wehfigo-commerce .woocommerce form .form-row.woocommerce-validated select { border-color: #1d8a4b; } /* Quantity steppers */ body.wehfigo-commerce.woocommerce .quantity .qty, body.wehfigo-commerce .woocommerce .quantity .qty { min-height: 48px; width: 84px; padding: 10px var(--space-3); border: 1px solid var(--color-page-border); border-radius: var(--radius-md); background: var(--color-page-bg); color: var(--color-page-heading); font-family: var(--font-family-brand); font-size: var(--text-label); font-weight: 600; text-align: center; } body.wehfigo-commerce.woocommerce .quantity .qty:focus, body.wehfigo-commerce .woocommerce .quantity .qty:focus { outline: none; border-color: var(--color-primary); box-shadow: var(--shadow-focus); } /* ========================================================= 1. Shop / catalog grid ========================================================= */ body.wehfigo-commerce.post-type-archive-product ul.products, body.wehfigo-commerce.tax-product_cat ul.products { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); margin: 0 0 var(--space-8); padding: 0; list-style: none; } @media (max-width: 1024px) { body.wehfigo-commerce.post-type-archive-product ul.products, body.wehfigo-commerce.tax-product_cat ul.products { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 640px) { body.wehfigo-commerce.post-type-archive-product ul.products, body.wehfigo-commerce.tax-product_cat ul.products { grid-template-columns: 1fr; gap: var(--space-4); } } /* Regular product card (Listeo markup: li > .mediaholder + section) */ body.wehfigo-commerce ul.products li.regular-product { width: auto; margin: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--color-page-border); border-radius: var(--radius-lg); background: var(--color-page-bg); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06); transition: box-shadow var(--duration-base) var(--ease-standard), transform var(--duration-base) var(--ease-standard), border-color var(--duration-base) var(--ease-standard); } body.wehfigo-commerce ul.products li.regular-product:hover { transform: translateY(-3px); border-color: var(--color-border-strong); box-shadow: var(--shadow-md); } body.wehfigo-commerce ul.products li.regular-product .mediaholder { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--color-page-bg-alt); } body.wehfigo-commerce ul.products li.regular-product .mediaholder img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) var(--ease-standard); } body.wehfigo-commerce ul.products li.regular-product:hover .mediaholder img { transform: scale(1.04); } body.wehfigo-commerce ul.products li.regular-product section { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4) var(--space-4) var(--space-5); } body.wehfigo-commerce ul.products li.regular-product .product-category { font-family: var(--font-family-brand); font-size: var(--text-chip); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-chip-ink); } body.wehfigo-commerce ul.products li.regular-product h5 { margin: 0; font-family: var(--font-family-brand); font-size: var(--text-card-title); font-weight: 700; line-height: 1.3; } body.wehfigo-commerce ul.products li.regular-product h5 a { color: var(--color-page-heading); text-decoration: none; } body.wehfigo-commerce ul.products li.regular-product h5 a:hover { color: var(--color-primary); } body.wehfigo-commerce ul.products li.regular-product .price { font-family: var(--font-family-brand); font-size: var(--text-card-title); font-weight: 700; color: var(--color-page-heading); } body.wehfigo-commerce ul.products li.regular-product .price del { color: var(--color-page-muted); font-weight: 500; margin-right: var(--space-2); } body.wehfigo-commerce ul.products li.regular-product .price ins { text-decoration: none; } /* Loop add-to-cart button sits over the media (Listeo hooks it there) */ body.wehfigo-commerce ul.products li.regular-product .mediaholder .button { position: absolute; inset-inline: var(--space-4); bottom: var(--space-4); opacity: 0; transform: translateY(6px); transition: opacity var(--duration-base) var(--ease-standard), transform var(--duration-base) var(--ease-standard), background-color var(--duration-fast) var(--ease-standard); } body.wehfigo-commerce ul.products li.regular-product:hover .mediaholder .button, body.wehfigo-commerce ul.products li.regular-product .mediaholder .button:focus-visible { opacity: 1; transform: translateY(0); } /* Touch devices: keep the button visible (no hover) */ @media (hover: none) { body.wehfigo-commerce ul.products li.regular-product .mediaholder .button { opacity: 1; transform: none; } } /* Masked price chip for gated tickets in the loop */ body.wehfigo-commerce .wehfigo-gate-price-masked { display: inline-flex; align-items: center; gap: var(--space-2); padding: 4px 10px; border-radius: var(--radius-pill); background: var(--color-chip-tint); color: var(--color-chip-ink); font-family: var(--font-family-body); font-size: var(--text-meta); font-weight: 500; line-height: 1.4; } /* Listing-package "plan" cards — keep Listeo layout, upgrade the finish */ body.wehfigo-commerce ul.products li.plan { border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-page-border); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06); } body.wehfigo-commerce ul.products li.plan .plan-price { background: var(--color-surface-elevated); } body.wehfigo-commerce ul.products li.plan .plan-price h3 { font-family: var(--font-family-brand); font-weight: 700; } /* ========================================================= 2. Single product ========================================================= */ body.wehfigo-commerce.single-product div.product .product_title { font-family: var(--font-family-brand); font-size: var(--text-h1); font-weight: 700; letter-spacing: -0.01em; color: var(--color-page-heading); margin-bottom: var(--space-3); } body.wehfigo-commerce.single-product div.product p.price { font-family: var(--font-family-brand); font-size: var(--text-h2); font-weight: 700; color: var(--color-page-heading); margin-bottom: var(--space-4); } body.wehfigo-commerce.single-product div.product p.price del { color: var(--color-page-muted); font-weight: 500; } body.wehfigo-commerce.single-product div.product p.price ins { text-decoration: none; } body.wehfigo-commerce.single-product div.product .woocommerce-product-details__short-description { font-size: var(--text-label); line-height: 1.65; color: var(--color-page-text); } body.wehfigo-commerce.single-product div.product form.cart { display: flex; align-items: stretch; gap: var(--space-3); margin: var(--space-5) 0; padding: var(--space-4); border: 1px solid var(--color-page-border); border-radius: var(--radius-lg); background: var(--color-page-bg-alt); } body.wehfigo-commerce.single-product div.product form.cart .button { flex: 1; min-height: 48px; } body.wehfigo-commerce.single-product div.product .woocommerce-product-gallery img { border-radius: var(--radius-lg); } /* Meta row (SKU / category) */ body.wehfigo-commerce.single-product .product_meta { padding-top: var(--space-4); border-top: 1px solid var(--color-page-border); font-size: var(--text-meta); color: var(--color-page-muted); } body.wehfigo-commerce.single-product .product_meta a { color: var(--color-chip-ink); } /* Tabs */ body.wehfigo-commerce.single-product .woocommerce-tabs ul.tabs li a { font-family: var(--font-family-brand); font-weight: 600; } /* ========================================================= 3. Pricing gate (SOW §7 email+phone wall) ========================================================= */ body.wehfigo-commerce .wehfigo-gate { margin: var(--space-5) 0; padding: var(--space-6) var(--space-5); border: 1px solid var(--color-page-border); border-radius: var(--radius-xl); background: radial-gradient(120% 140% at 100% 0%, var(--color-chip-tint) 0%, transparent 55%), var(--color-page-bg-alt); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06); } body.wehfigo-commerce .wehfigo-gate__eyebrow { display: inline-block; margin-bottom: var(--space-2); font-family: var(--font-family-brand); font-size: var(--text-chip); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-chip-ink); } body.wehfigo-commerce .wehfigo-gate__title { margin: 0 0 var(--space-2); font-family: var(--font-family-brand); font-size: var(--text-h3); font-weight: 700; color: var(--color-page-heading); } body.wehfigo-commerce .wehfigo-gate__sub { margin: 0 0 var(--space-5); font-size: var(--text-label); line-height: 1.6; color: var(--color-page-text); max-width: 46ch; } body.wehfigo-commerce .wehfigo-gate__form { display: flex; flex-direction: column; gap: var(--space-4); } /* Honeypot — visually removed, still in the DOM for bots */ body.wehfigo-commerce .wehfigo-gate__hp { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); margin: 0; } body.wehfigo-commerce .wehfigo-gate__field { display: flex; flex-direction: column; gap: 6px; } body.wehfigo-commerce .wehfigo-gate__field label { font-family: var(--font-family-body); font-size: var(--text-label); font-weight: 500; color: var(--color-page-heading); margin: 0; } body.wehfigo-commerce .wehfigo-gate__optional { font-weight: 400; color: var(--color-page-muted); font-size: var(--text-meta); } body.wehfigo-commerce .wehfigo-gate__required { color: var(--color-danger); } body.wehfigo-commerce .wehfigo-gate__field input { min-height: 48px; padding: 12px var(--space-4); border: 1px solid var(--color-page-border); border-radius: var(--radius-md); background: var(--color-page-bg); color: var(--color-page-heading); font-family: var(--font-family-body); font-size: var(--text-label); margin: 0; transition: border-color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard); } body.wehfigo-commerce .wehfigo-gate__field input:focus { outline: none; border-color: var(--color-primary); box-shadow: var(--shadow-focus); } body.wehfigo-commerce .wehfigo-gate__field--error input { border-color: var(--color-danger); box-shadow: 0 0 0 3px var(--color-brand-red-muted); } body.wehfigo-commerce .wehfigo-gate__error { font-size: var(--text-meta); font-weight: 500; color: var(--color-danger); } body.wehfigo-commerce .wehfigo-gate__submit { width: 100%; min-height: 48px; margin-top: var(--space-2); } body.wehfigo-commerce .wehfigo-gate__privacy { margin: 0; font-size: var(--text-meta); line-height: 1.5; color: var(--color-page-muted); } /* ========================================================= 3b. Page gates — auth welcome panel DNA (dark nightlife stage, left-aligned copy, pill CTAs. Not the login form card — welcome-panel layout only.) ========================================================= */ body.wehfigo-commerce .wehfigo-gate--page, body.wehfigo-pricing-gated .wehfigo-gate--page { --wehfigo-gate-font: "Montserrat", var(--font-family-body, system-ui, sans-serif); --wehfigo-gate-red: var(--color-brand-red, #d6001c); width: 100vw; max-width: 100vw; margin: 0 0 0 calc(50% - 50vw); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; box-sizing: border-box; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__stage, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__stage { position: relative; display: flex; align-items: center; justify-content: flex-start; width: 100%; min-height: clamp(22rem, 48vh, 34rem); padding: clamp(3.25rem, 7vh, 5rem) clamp(2rem, 7vw, 6.5rem) clamp(2.75rem, 5.5vh, 4.25rem); box-sizing: border-box; overflow: hidden; color: #ffffff; font-family: var(--wehfigo-gate-font); background-color: #000000; background-image: linear-gradient( 90deg, #000000 0%, #000000 26%, rgba(0, 0, 0, 0.9) 40%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0.22) 78%, rgba(0, 0, 0, 0.4) 100% ), var(--wehfigo-gate-bg, linear-gradient(145deg, #1a1a1a, #0a0a0a)); background-size: cover, cover; background-position: center, 74% center; background-repeat: no-repeat, no-repeat; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__dots, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__dots { position: absolute; top: clamp(1.5rem, 3.5vh, 2.5rem); left: 0; width: 4.75rem; height: 7.25rem; z-index: 2; pointer-events: none; background-image: radial-gradient(circle, var(--wehfigo-gate-red) 3px, transparent 3.35px); background-size: 1.35rem 1.35rem; background-repeat: repeat; background-position: 1.15rem 0.85rem; filter: drop-shadow(0 0 4px rgba(214, 0, 28, 0.55)); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__wave, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__wave { position: absolute; left: -1.5rem; bottom: -0.75rem; width: min(48vw, 26rem); height: auto; z-index: 1; pointer-events: none; color: var(--wehfigo-gate-red); opacity: 0.9; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__panel, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__panel { position: relative; z-index: 3; width: 100%; max-width: 42rem; margin: 0; margin-left: clamp(1.35rem, 4.5vw, 4.25rem); padding: 1.25rem 0 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; text-align: left; box-sizing: border-box; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__head, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__head { max-width: none; margin: 0; text-align: left; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__eyebrow, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__eyebrow { display: block; margin: 0 0 0.65rem; font-family: var(--wehfigo-gate-font); font-size: clamp(13px, 1.4vw, 15px); font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; color: #ff5a70; text-shadow: 0 2px 8px rgba(0, 0, 0, 0.95), 0 0 18px rgba(214, 0, 28, 0.38); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__title, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__title { margin: 0; font-family: var(--wehfigo-gate-font); font-size: clamp(32px, 4.8vw, 52px); font-weight: 800; line-height: 1.08; letter-spacing: -0.03em; color: #ffffff; text-shadow: 0 4px 18px rgba(0, 0, 0, 0.45); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__sub, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__sub { margin: 1.15rem 0 0; max-width: 34rem; font-family: var(--wehfigo-gate-font); font-size: clamp(16px, 1.8vw, 19px); font-weight: 500; line-height: 1.5; color: rgba(255, 255, 255, 0.9); text-align: left; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__login-cta, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__login-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.85rem 1rem; margin: 2.15rem 0 0; text-align: left; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__cta, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__cta { appearance: none; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; margin: 0; padding: 0.85rem 1.7rem; border-radius: 999px; font-family: var(--wehfigo-gate-font); font-size: 15px; font-weight: 700; letter-spacing: 0.02em; line-height: 1.2; text-decoration: none; cursor: pointer; transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__cta:focus-visible, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__cta:focus-visible { outline: 2px solid #ffffff; outline-offset: 3px; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__cta--primary, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__cta--primary { border: 0; background: var(--wehfigo-gate-red); color: #ffffff; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__cta--primary:hover, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__cta--primary:hover { background: var(--color-brand-red-hover, #b00018); color: #ffffff; transform: translateY(-1px); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__cta-arrow, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__cta-arrow { display: inline-block; line-height: 1; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__privacy, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__privacy { margin: 0.85rem 0 0; max-width: 30rem; font-family: var(--wehfigo-gate-font); font-size: clamp(14px, 1.4vw, 16px); font-weight: 500; line-height: 1.5; color: rgba(255, 255, 255, 0.78); text-align: left; opacity: 1; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__error, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__error { margin-top: 0.85rem; text-align: left; color: #ffb4b4; } /* Logged-in contact form on the same dark stage (not the auth login card). */ body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__form, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__form { display: flex; flex-direction: column; gap: var(--space-4); width: 100%; max-width: 28rem; margin: 1.75rem 0 0; text-align: left; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__field label, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__field label { color: rgba(255, 255, 255, 0.92); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__optional, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__optional { color: rgba(255, 255, 255, 0.55); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__field input, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__field input { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.28); color: #ffffff; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__field input::placeholder, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__field input::placeholder { color: rgba(255, 255, 255, 0.45); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__field input:focus, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__field input:focus { border-color: var(--wehfigo-gate-red); box-shadow: 0 0 0 3px rgba(214, 0, 28, 0.28); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__submit, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__submit { width: auto; align-self: flex-start; min-height: 0; margin-top: 0.35rem; padding: 0.85rem 1.7rem; border: 0; border-radius: 999px; background: var(--wehfigo-gate-red); color: #ffffff; font-family: var(--wehfigo-gate-font); font-size: 15px; font-weight: 700; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__form .wehfigo-gate__privacy, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__form .wehfigo-gate__privacy { text-align: left; max-width: 28rem; } html[data-theme="dark"] body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__stage, html[data-theme="dark"] body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__stage { background-color: #000000; } /* Pricing: one hero only (belt + suspenders vs pages-chrome) */ body.wehfigo-pricing-page #titlebar, body.wehfigo-pricing-page #titlebar.wehfigo-page-hero, body.wehfigo-pricing-gated #titlebar, body.wehfigo-pricing-gated #titlebar.wehfigo-page-hero { display: none !important; } html[data-theme="dark"] body.wehfigo-commerce .wehfigo-gate.wehfigo-gate--page { background: transparent; border: 0; box-shadow: none; } @media (max-width: 767px) { body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__stage, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__stage { align-items: flex-start; min-height: clamp(24rem, 62vh, 34rem); /* Clear sticky header + give the copy room to sit lower */ padding: calc(5.75rem + env(safe-area-inset-top, 0px)) 1.2rem 2.25rem; background-position: center, 62% center; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__panel, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__panel { margin-left: 0.65rem; margin-top: 0.75rem; max-width: 100%; padding-top: 1.15rem; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__dots, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__dots { top: calc(4.25rem + env(safe-area-inset-top, 0px)); width: 3.75rem; height: 5.75rem; background-size: 1.2rem 1.2rem; background-position: 0.85rem 0.65rem; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__wave, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__wave { width: min(72vw, 14rem); opacity: 0.7; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__title, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__title { font-size: clamp(28px, 8vw, 36px); } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__form, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__form { max-width: 100%; } body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__submit, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__submit { width: 100%; justify-content: center; } } @media (min-width: 768px) { body.wehfigo-commerce .wehfigo-gate--page .wehfigo-gate__form, body.wehfigo-pricing-gated .wehfigo-gate--page .wehfigo-gate__form { max-width: 30rem; } } /* ========================================================= Unlock confirmation strip ========================================================= */ body.wehfigo-commerce .wehfigo-gate-success { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); border: 1px solid rgba(29, 138, 75, 0.35); border-radius: var(--radius-md); background: rgba(29, 138, 75, 0.1); color: #14663a; font-family: var(--font-family-body); font-size: var(--text-label); font-weight: 500; } /* ========================================================= 3c. Pricing page package groups from the PDF ========================================================= */ body.wehfigo-pricing-page .wehfigo-pricing { background: radial-gradient(ellipse at 12% 0%, rgba(214, 0, 28, 0.07), transparent 34rem), var(--color-page-bg); } body.wehfigo-pricing-page .wehfigo-pricing__groups { display: grid; gap: clamp(2.25rem, 4vw, 3.75rem); } body.wehfigo-pricing-page .wehfigo-pricing__group { padding: clamp(1.15rem, 2vw, 1.75rem); border: 1px solid var(--color-page-border); border-radius: var(--radius-xl); background: linear-gradient(135deg, rgba(214, 0, 28, 0.055), transparent 42%), var(--color-page-bg-alt); box-shadow: 0 14px 38px rgba(15, 17, 17, 0.06); } body.wehfigo-pricing-page .wehfigo-pricing__group-head { max-width: 56rem; margin: 0 0 clamp(1.25rem, 2.8vw, 2rem); } body.wehfigo-pricing-page .wehfigo-pricing__group-title { margin: 0 0 0.45rem !important; font-family: var(--font-family-brand); font-size: clamp(1.45rem, 2.7vw, 2.15rem) !important; font-weight: 800; line-height: 1.12; letter-spacing: -0.03em; color: var(--color-page-heading) !important; } body.wehfigo-pricing-page .wehfigo-pricing__group-subline { margin: 0; max-width: 48rem; font-size: clamp(1rem, 1.45vw, 1.15rem); font-weight: 500; line-height: 1.55; color: var(--color-page-text); } body.wehfigo-pricing-page .wehfigo-pricing__group .wehfigo-pricing__grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: clamp(1rem, 2vw, 1.35rem); padding-top: 0; } body.wehfigo-pricing-page .wehfigo-pricing__group--event-media .wehfigo-pricing__grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); } body.wehfigo-pricing-page .wehfigo-pricing__card { min-height: 100%; border-color: color-mix(in srgb, var(--color-page-border) 82%, var(--color-primary)); background: var(--color-page-bg); box-shadow: 0 12px 28px rgba(15, 17, 17, 0.07); } body.wehfigo-pricing-page .wehfigo-pricing__name { font-size: clamp(1.18rem, 1.8vw, 1.55rem); line-height: 1.18; } body.wehfigo-pricing-page .wehfigo-pricing__price { align-items: flex-start; flex-direction: column; gap: 0.35rem; } body.wehfigo-pricing-page .wehfigo-pricing__amount { font-size: clamp(1.5rem, 2.6vw, 2rem); } body.wehfigo-pricing-page .wehfigo-pricing__period { font-weight: 700; line-height: 1.35; color: var(--color-page-muted); } body.wehfigo-pricing-page .wehfigo-pricing__features { gap: 0.72rem; } body.wehfigo-pricing-page .wehfigo-pricing__features li { font-size: clamp(0.98rem, 1.35vw, 1.05rem); } html[data-theme="dark"] body.wehfigo-pricing-page .wehfigo-pricing, body#dark-mode.wehfigo-pricing-page .wehfigo-pricing { background: radial-gradient(ellipse at 12% 0%, rgba(214, 0, 28, 0.18), transparent 34rem), var(--color-page-bg); } html[data-theme="dark"] body.wehfigo-pricing-page .wehfigo-pricing__group, body#dark-mode.wehfigo-pricing-page .wehfigo-pricing__group { background: linear-gradient(135deg, rgba(214, 0, 28, 0.12), transparent 42%), var(--color-page-bg-alt); border-color: var(--color-page-border); box-shadow: none; } html[data-theme="dark"] body.wehfigo-pricing-page .wehfigo-pricing__card, body#dark-mode.wehfigo-pricing-page .wehfigo-pricing__card { background: color-mix(in srgb, var(--color-page-bg-alt) 88%, #000); border-color: rgba(255, 255, 255, 0.13); box-shadow: none; } @media (max-width: 640px) { body.wehfigo-pricing-page .wehfigo-pricing__group { margin-inline: -0.35rem; padding: 1rem; border-radius: var(--radius-lg); } body.wehfigo-pricing-page .wehfigo-pricing__card { padding: 1.25rem; } } /* ========================================================= 4. Cart — Amazon / BigBuy clarity, WehFiGO brand ========================================================= */ /* Dokan empty Vendor variation row */ body.wehfigo-commerce .woocommerce dl.variation:has(> dd.variation-Vendor:empty) { display: none !important; } /* Theme tokens — light */ body.woocommerce-cart.wehfigo-commerce { --wf-cart-page: #f2f3f5; --wf-cart-surface: #ffffff; --wf-cart-surface-soft: #f7f8fa; --wf-cart-ink: #0f1111; --wf-cart-muted: #565959; --wf-cart-faint: #8a9199; --wf-cart-line: #d5d9d9; --wf-cart-line-soft: rgba(15, 17, 17, 0.08); --wf-cart-accent: #d6001c; --wf-cart-accent-hover: #b50018; --wf-cart-chip: #eef0f2; --wf-cart-shadow: 0 1px 2px rgba(15, 17, 17, 0.06), 0 8px 24px rgba(15, 17, 17, 0.06); } /* Theme tokens — dark (Listeo body#dark-mode + html data-theme) */ html[data-theme="dark"] body.woocommerce-cart.wehfigo-commerce, body#dark-mode.woocommerce-cart.wehfigo-commerce { --wf-cart-page: #0f1111; --wf-cart-surface: #1a1c1e; --wf-cart-surface-soft: #222528; --wf-cart-ink: #f5f6f7; --wf-cart-muted: #b0b6bd; --wf-cart-faint: #8d949c; --wf-cart-line: rgba(255, 255, 255, 0.14); --wf-cart-line-soft: rgba(255, 255, 255, 0.08); --wf-cart-accent: #ef1a36; --wf-cart-accent-hover: #ff3b54; --wf-cart-chip: #2a2e33; --wf-cart-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 12px 32px rgba(0, 0, 0, 0.35); } /* Cart + checkout: no Listeo titlebar — Amazon/BigBuy style goes straight to content */ body.woocommerce-cart.wehfigo-commerce #titlebar, body.woocommerce-cart.wehfigo-commerce #titlebar.wehfigo-page-hero, body.woocommerce-checkout.wehfigo-commerce #titlebar, body.woocommerce-checkout.wehfigo-commerce #titlebar.wehfigo-page-hero { display: none !important; } body.woocommerce-cart.wehfigo-commerce #wrapper, body.woocommerce-cart.wehfigo-commerce .wrapper, body.woocommerce-cart.wehfigo-commerce #content, body.woocommerce-cart.wehfigo-commerce .content { background-color: var(--wf-cart-page) !important; color: var(--wf-cart-ink); } body.woocommerce-cart.wehfigo-commerce #wrapper, body.woocommerce-cart.wehfigo-commerce .wrapper { background-image: radial-gradient(ellipse 50% 35% at 100% 0%, rgba(214, 0, 28, 0.06) 0%, transparent 55%) !important; } body.woocommerce-cart.wehfigo-commerce .woocommerce { max-width: 1180px; margin-left: auto; margin-right: auto; padding: 28px 16px 88px; color: var(--wf-cart-ink); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__heading { margin: 0 0 8px !important; font-family: var(--font-family-brand) !important; font-size: clamp(1.85rem, 3vw, 2.4rem) !important; font-weight: 800 !important; letter-spacing: -0.03em !important; line-height: 1.15 !important; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__intro { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 24px; margin: 0 0 28px; padding-bottom: 20px; border-bottom: 1px solid var(--wf-cart-line); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__lead { margin: 0; max-width: 40rem; font-size: 1.125rem; line-height: 1.5; font-weight: 500; color: var(--wf-cart-muted); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__trust { margin: 0; padding: 10px 14px; border-radius: 10px; background: var(--wf-cart-surface); border: 1px solid var(--wf-cart-line); font-size: 0.92rem; font-weight: 700; color: var(--wf-cart-ink); line-height: 1.35; box-shadow: var(--wf-cart-shadow); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.85fr); gap: 28px; align-items: start; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 16px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__section-title { margin: 0 !important; font-family: var(--font-family-brand); font-size: 1.35rem !important; font-weight: 800; letter-spacing: -0.02em; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__count { font-size: 1rem; font-weight: 700; color: var(--wf-cart-muted); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__items { display: flex; flex-direction: column; gap: 16px; border: 0; background: transparent; box-shadow: none; overflow: visible; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item { display: grid; grid-template-columns: 148px minmax(0, 1fr); gap: 20px; padding: 20px; border: 1px solid var(--wf-cart-line); border-radius: 14px; background: var(--wf-cart-surface); box-shadow: var(--wf-cart-shadow); color: var(--wf-cart-ink); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item:hover { border-color: color-mix(in srgb, var(--wf-cart-accent) 35%, var(--wf-cart-line)); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__media a, body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__media img { display: block; width: 100%; aspect-ratio: 1; height: auto; object-fit: cover; border-radius: 12px; background: var(--wf-cart-chip); border: 1px solid var(--wf-cart-line-soft); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__body { display: flex; flex-direction: column; gap: 16px; min-width: 0; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__top { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__title { margin: 0 0 10px !important; font-family: var(--font-family-brand); font-size: 1.28rem !important; font-weight: 800; letter-spacing: -0.02em; line-height: 1.3; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__title a { color: inherit !important; text-decoration: none; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__title a:hover { color: var(--wf-cart-accent) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__meta li { display: inline-flex; align-items: center; gap: 4px; padding: 6px 12px; border-radius: 999px; background: var(--wf-cart-chip); border: 1px solid var(--wf-cart-line-soft); font-size: 0.88rem; font-weight: 600; color: var(--wf-cart-ink); line-height: 1.25; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__meta-label { color: var(--wf-cart-faint); font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.72rem; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__meta-location::before { content: ""; width: 0.7em; height: 0.7em; margin-right: 2px; background: currentColor; opacity: 0.55; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='black' d='M128 16a88.1 88.1 0 0 0-88 88c0 75.3 80.2 131.1 83.6 133.4a8 8 0 0 0 8.8 0C135.8 235.1 216 179.3 216 104a88.1 88.1 0 0 0-88-88Zm0 56a32 32 0 1 1-32 32 32 32 0 0 1 32-32Z'/%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 256 256'%3E%3Cpath fill='black' d='M128 16a88.1 88.1 0 0 0-88 88c0 75.3 80.2 131.1 83.6 133.4a8 8 0 0 0 8.8 0C135.8 235.1 216 179.3 216 104a88.1 88.1 0 0 0-88-88Zm0 56a32 32 0 1 1-32 32 32 32 0 0 1 32-32Z'/%3E%3C/svg%3E") center / contain no-repeat; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item .product-name .variation, body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item .product-name dl.variation { margin-top: 10px; font-size: 0.95rem; color: var(--wf-cart-muted); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__price { flex-shrink: 0; text-align: right; font-family: var(--font-family-brand); font-size: 1.2rem; font-weight: 800; color: var(--wf-cart-ink) !important; white-space: nowrap; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__price .amount, body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__subtotal .amount { color: inherit !important; font-size: inherit !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__price-label, body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__qty-label, body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__subtotal-label { display: block; margin-bottom: 4px; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--wf-cart-faint); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__footer { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px 20px; padding-top: 14px; border-top: 1px solid var(--wf-cart-line-soft); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__qty { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 6px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item .quantity .qty { min-width: 72px !important; min-height: 48px !important; padding: 8px 10px !important; font-size: 1.125rem !important; font-weight: 800 !important; border-radius: 10px !important; border: 1.5px solid var(--wf-cart-line) !important; text-align: center; background: var(--wf-cart-surface) !important; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__subtotal { display: inline-flex; flex-direction: column; align-items: flex-end; margin-left: auto; font-family: var(--font-family-brand); font-size: 1.2rem; font-weight: 800; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__remove-link.remove { display: inline-flex !important; align-items: center; justify-content: center; width: auto !important; height: auto !important; min-height: 44px; padding: 10px 16px !important; border-radius: 10px !important; font-size: 0.95rem !important; font-weight: 700 !important; line-height: 1.2 !important; color: var(--wf-cart-muted) !important; border: 1.5px solid var(--wf-cart-line) !important; background: transparent !important; text-decoration: none !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__remove-link.remove:hover { color: #ffffff !important; background: var(--wf-cart-accent) !important; border-color: var(--wf-cart-accent) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__actions { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: 4px; padding: 18px 20px; border: 1px solid var(--wf-cart-line); border-radius: 14px; background: var(--wf-cart-surface-soft); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__coupon label { display: block; margin-bottom: 8px; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--wf-cart-muted); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__coupon-row { display: flex; flex-wrap: wrap; gap: 10px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__coupon .input-text { min-height: 48px !important; min-width: 200px; padding: 10px 16px !important; border-radius: 10px !important; border: 1.5px solid var(--wf-cart-line) !important; background: var(--wf-cart-surface) !important; color: var(--wf-cart-ink) !important; font-size: 1rem !important; font-weight: 600; } body.woocommerce-cart.wehfigo-commerce .woocommerce button[name="apply_coupon"], body.woocommerce-cart.wehfigo-commerce .woocommerce button[name="update_cart"] { min-height: 48px !important; padding: 12px 20px !important; border-radius: 10px !important; font-size: 1rem !important; font-weight: 700 !important; border: 1.5px solid var(--wf-cart-line) !important; background: var(--wf-cart-surface) !important; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .woocommerce button[name="apply_coupon"]:hover, body.woocommerce-cart.wehfigo-commerce .woocommerce button[name="update_cart"]:hover { border-color: var(--wf-cart-ink) !important; background: var(--wf-cart-ink) !important; color: var(--wf-cart-surface) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__aside { position: sticky; top: 96px; } body.wehfigo-commerce .woocommerce .cart_totals.wehfigo-order-summary, body.woocommerce-cart.wehfigo-commerce .woocommerce .cart_totals { border: 1px solid var(--wf-cart-line) !important; border-radius: 14px !important; background: var(--wf-cart-surface) !important; padding: 24px 22px 20px !important; box-shadow: var(--wf-cart-shadow); color: var(--wf-cart-ink); } body.woocommerce-cart.wehfigo-commerce .wehfigo-order-summary__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 8px; } body.wehfigo-commerce .woocommerce .cart_totals h2 { margin: 0 !important; font-family: var(--font-family-brand); font-size: 1.35rem !important; font-weight: 800; letter-spacing: -0.02em; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-order-summary__subhead { margin: 0 0 16px; font-size: 1.05rem; font-weight: 700; color: var(--wf-cart-muted); } body.woocommerce-cart.wehfigo-commerce .wehfigo-currency-chip { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--wf-cart-line); background: var(--wf-cart-chip); font-size: 0.85rem; font-weight: 600; color: var(--wf-cart-muted); line-height: 1; } body.woocommerce-cart.wehfigo-commerce .wehfigo-currency-chip__code { font-family: var(--font-family-brand); font-weight: 800; letter-spacing: 0.04em; color: var(--wf-cart-ink); } body.wehfigo-commerce .woocommerce .cart_totals table.shop_table { border: 0 !important; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; overflow: visible; width: 100%; } body.wehfigo-commerce .woocommerce .cart_totals table.shop_table th, body.wehfigo-commerce .woocommerce .cart_totals table.shop_table td { padding: 14px 0 !important; border: 0 !important; border-bottom: 1px solid var(--wf-cart-line-soft) !important; background: transparent !important; font-size: 1.05rem !important; font-weight: 600 !important; color: var(--wf-cart-ink) !important; vertical-align: middle; } body.wehfigo-commerce .woocommerce .cart_totals table.shop_table td { text-align: right; } body.wehfigo-commerce .woocommerce .cart_totals table.shop_table .amount { color: var(--wf-cart-ink) !important; font-weight: 700 !important; } body.wehfigo-commerce .woocommerce .cart_totals .order-total th, body.wehfigo-commerce .woocommerce .cart_totals .order-total td { border-bottom: 0 !important; padding-top: 18px !important; font-family: var(--font-family-brand); font-size: 1.35rem !important; font-weight: 800 !important; color: var(--wf-cart-ink) !important; } body.wehfigo-commerce .woocommerce .cart_totals .order-total .amount { font-size: 1.45rem !important; color: var(--wf-cart-ink) !important; } body.wehfigo-commerce .wehfigo-commerce-jmd-note { margin: 12px 0 0; font-size: 1.05rem; font-weight: 700; line-height: 1.35; color: var(--wf-cart-ink, #0f1111); } /* Deduplicate if a second JMD note appears in the DOM */ body.wehfigo-commerce .wehfigo-commerce-jmd-note ~ .wehfigo-commerce-jmd-note, body.woocommerce-checkout.wehfigo-commerce p.wehfigo-commerce-jmd-note + p.wehfigo-commerce-jmd-note { display: none !important; } html[data-theme="dark"] body.wehfigo-commerce .wehfigo-commerce-jmd-note, body#dark-mode.wehfigo-commerce .wehfigo-commerce-jmd-note { color: #f5f6f7; } /* Billing / shipping fields: select + Select2 must match .input-text exactly (Listeo/Woo Select2 defaults: white bg, #888 text, heavier weight, taller chrome). */ body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row input.input-text, body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row textarea, body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row select, body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-container .select2-selection--single, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row input.input-text, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row textarea, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row select, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-container .select2-selection--single, body.woocommerce-checkout.wehfigo-commerce #billing_country, body.woocommerce-checkout.wehfigo-commerce #billing_state, body.woocommerce-checkout.wehfigo-commerce #shipping_country, body.woocommerce-checkout.wehfigo-commerce #shipping_state { min-height: 48px !important; height: 48px !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; padding: 12px 16px !important; border: 1px solid var(--color-page-border) !important; border-radius: var(--radius-md, 8px) !important; background: var(--color-page-bg) !important; background-color: var(--color-page-bg) !important; color: var(--color-page-heading) !important; font-family: var(--font-family-body) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.4 !important; box-shadow: none !important; opacity: 1 !important; -webkit-appearance: none !important; appearance: none !important; } body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row textarea, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row textarea { height: auto !important; min-height: 96px !important; } /* Native country / parish selects: caret inset so padding matches text inputs */ body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row select, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row select, body.woocommerce-checkout.wehfigo-commerce #billing_country, body.woocommerce-checkout.wehfigo-commerce #billing_state, body.woocommerce-checkout.wehfigo-commerce #shipping_country, body.woocommerce-checkout.wehfigo-commerce #shipping_state { padding-right: 2.5rem !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1.4.6L6 5.2 10.6.6 12 2 6 8 0 2z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 16px center !important; background-size: 12px 8px !important; } body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-container, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-container { width: 100% !important; max-width: 100% !important; } body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-container .select2-selection--single, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-container .select2-selection--single { display: flex !important; align-items: center !important; padding: 0 16px !important; margin: 0 !important; } body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-selection__rendered, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-selection__rendered { padding: 0 !important; padding-left: 0 !important; padding-right: 1.75rem !important; line-height: 1.4 !important; color: var(--color-page-heading) !important; font-family: var(--font-family-body) !important; font-size: 15px !important; font-weight: 400 !important; } body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-selection__placeholder, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-selection__placeholder { color: var(--color-page-muted, #888) !important; font-weight: 400 !important; } body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-selection__arrow, body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-selection__arrow { height: 46px !important; top: 1px !important; right: 10px !important; } /* Validation visibility */ body.woocommerce-checkout.wehfigo-commerce .woocommerce-error, body.woocommerce-checkout.wehfigo-commerce .wehfigo-checkout-error-visible, body.woocommerce-checkout.wehfigo-commerce .wehfigo-checkout-client-errors { display: block !important; margin: 0 0 1.25rem !important; padding: 1rem 1.15rem !important; border: 2px solid #d6001c !important; border-radius: 10px !important; background: #fff5f6 !important; color: #12151a !important; font-size: 1rem !important; font-weight: 600 !important; } body.woocommerce-checkout.wehfigo-commerce .woocommerce-invalid input.input-text, body.woocommerce-checkout.wehfigo-commerce .woocommerce-invalid select, body.woocommerce-checkout.wehfigo-commerce .wehfigo-field-invalid input.input-text, body.woocommerce-checkout.wehfigo-commerce .wehfigo-field-invalid select, body.woocommerce-checkout.wehfigo-commerce .wehfigo-field-invalid .select2-selection { border-color: #d6001c !important; box-shadow: 0 0 0 2px rgba(214, 0, 28, 0.18) !important; } html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce .woocommerce-error, html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce .wehfigo-checkout-client-errors, body#dark-mode.woocommerce-checkout.wehfigo-commerce .woocommerce-error { background: #2a1216 !important; color: #ffe8eb !important; } /* Listeo blend: checkout place-order CTA */ body.woocommerce-checkout.wehfigo-commerce #place_order { min-height: 52px !important; border-radius: 999px !important; font-family: var(--font-family-brand, "Space Grotesk", sans-serif) !important; font-weight: 700 !important; font-size: 1.05rem !important; background: #d6001c !important; border-color: #d6001c !important; } body.wehfigo-commerce .woocommerce .wc-proceed-to-checkout a.checkout-button, body.woocommerce-cart.wehfigo-commerce .wehfigo-checkout-cta { display: flex !important; align-items: center; justify-content: center; width: 100% !important; min-height: 56px !important; margin: 8px 0 0 !important; padding: 16px 20px !important; font-size: 1.15rem !important; font-weight: 800 !important; letter-spacing: 0.01em; line-height: 1.2 !important; border-radius: 12px !important; border: 0 !important; background: var(--wf-cart-accent) !important; color: #ffffff !important; text-decoration: none !important; box-shadow: 0 10px 28px color-mix(in srgb, var(--wf-cart-accent) 35%, transparent); } body.wehfigo-commerce .woocommerce .wc-proceed-to-checkout a.checkout-button:hover, body.woocommerce-cart.wehfigo-commerce .wehfigo-checkout-cta:hover { background: var(--wf-cart-accent-hover) !important; color: #ffffff !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-order-summary__secure { margin: 12px 0 0; text-align: center; font-size: 0.92rem; font-weight: 600; line-height: 1.4; color: var(--wf-cart-muted); } body.woocommerce-cart.wehfigo-commerce .wehfigo-order-summary__explore { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 48px; margin-top: 12px; padding: 12px 16px; border-radius: 12px; border: 1.5px solid var(--wf-cart-line); background: transparent; color: var(--wf-cart-ink) !important; font-family: var(--font-family-brand); font-size: 1.02rem; font-weight: 700; text-decoration: none; text-align: center; transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease; } body.woocommerce-cart.wehfigo-commerce .wehfigo-order-summary__explore:hover { border-color: var(--wf-cart-ink); background: var(--wf-cart-ink); color: var(--wf-cart-surface) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover { margin-top: 52px; padding-top: 28px; border-top: 1px solid var(--wf-cart-line); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__eyebrow { margin: 0 0 4px; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wf-cart-accent); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__title { margin: 0 !important; font-family: var(--font-family-brand); font-size: 1.3rem !important; font-weight: 800; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__all { font-size: 1rem; font-weight: 700; color: var(--wf-cart-ink) !important; text-decoration: none; white-space: nowrap; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__all:hover { color: var(--wf-cart-accent) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__card a { display: block; text-decoration: none; color: inherit; border-radius: 12px; overflow: hidden; border: 1px solid var(--wf-cart-line); background: var(--wf-cart-surface); transition: transform 180ms ease, box-shadow 180ms ease; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__card a:hover { transform: translateY(-2px); box-shadow: var(--wf-cart-shadow); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__thumb { display: block; aspect-ratio: 4 / 3; background: var(--wf-cart-chip); overflow: hidden; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__thumb img { width: 100%; height: 100%; object-fit: cover; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__name { display: block; padding: 12px 14px 14px; font-family: var(--font-family-brand); font-size: 1rem; font-weight: 700; line-height: 1.35; color: var(--wf-cart-ink) !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__fallback { margin: 0; font-weight: 600; color: var(--wf-cart-muted); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__fallback a { color: var(--wf-cart-accent); text-decoration: none; } body.wehfigo-commerce:not(.woocommerce-cart) .woocommerce table.shop_table { border: 1px solid rgba(18, 21, 26, 0.1); border-radius: 16px; border-collapse: separate; border-spacing: 0; overflow: hidden; background: #ffffff; } body.wehfigo-commerce .woocommerce a.remove { width: 34px; height: 34px; line-height: 32px; border-radius: var(--radius-pill); color: var(--color-page-muted); border: 1px solid var(--color-page-border); background: var(--color-page-bg); font-weight: 500; } body.wehfigo-commerce .woocommerce a.remove:hover { color: var(--color-brand-white); background: var(--color-danger); border-color: var(--color-danger); } @media (max-width: 960px) { body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__layout { grid-template-columns: 1fr; gap: 22px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__aside { position: static; order: -1; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__main { order: 1; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 640px) { body.woocommerce-cart.wehfigo-commerce .woocommerce { padding: 18px 12px 110px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__heading { font-size: 1.7rem !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__lead { font-size: 1.02rem; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; padding: 14px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__title { font-size: 1.1rem !important; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__top { flex-direction: column; gap: 8px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__price { text-align: left; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__footer { flex-direction: column; align-items: stretch; gap: 12px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-item__subtotal { margin-left: 0; align-items: flex-start; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__actions { flex-direction: column; align-items: stretch; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__coupon-row { flex-direction: column; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart__coupon .input-text, body.woocommerce-cart.wehfigo-commerce .woocommerce button[name="apply_coupon"], body.woocommerce-cart.wehfigo-commerce .woocommerce button[name="update_cart"] { width: 100%; } body.woocommerce-cart.wehfigo-commerce .wehfigo-order-summary__cta { position: sticky; bottom: 10px; z-index: 40; margin: 0 -2px; padding: 12px; border-radius: 14px; background: color-mix(in srgb, var(--wf-cart-surface) 94%, transparent); backdrop-filter: blur(12px); box-shadow: 0 -10px 32px rgba(0, 0, 0, 0.18); border: 1px solid var(--wf-cart-line); } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__grid { grid-template-columns: 1fr 1fr; gap: 10px; } body.woocommerce-cart.wehfigo-commerce .wehfigo-cart-discover__head { flex-direction: column; align-items: flex-start; } } /* ========================================================= 5. Checkout — trustworthy and uncluttered ========================================================= */ /* Same readable canvas as cart (light + dark) */ body.woocommerce-checkout.wehfigo-commerce { --wf-checkout-page: #f2f3f5; --wf-checkout-ink: #0f1111; --wf-checkout-muted: #565959; --wf-checkout-surface: #ffffff; --wf-checkout-line: #d5d9d9; } html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce, body#dark-mode.woocommerce-checkout.wehfigo-commerce { --wf-checkout-page: #0f1111; --wf-checkout-ink: #f5f6f7; --wf-checkout-muted: #b0b6bd; --wf-checkout-surface: #1a1c1e; --wf-checkout-line: rgba(255, 255, 255, 0.14); } body.woocommerce-checkout.wehfigo-commerce #wrapper, body.woocommerce-checkout.wehfigo-commerce .wrapper, body.woocommerce-checkout.wehfigo-commerce #content, body.woocommerce-checkout.wehfigo-commerce .content { background-color: var(--wf-checkout-page) !important; color: var(--wf-checkout-ink); } body.wehfigo-commerce.woocommerce-checkout form.checkout .col2-set h3, body.wehfigo-commerce.woocommerce-checkout #order_review_heading { font-family: var(--font-family-brand); font-size: 1.35rem; font-weight: 800; color: var(--wf-checkout-ink) !important; } /* Order review = the anchor of trust: card it */ body.wehfigo-commerce.woocommerce-checkout #order_review { padding: 22px; border: 1px solid var(--wf-checkout-line); border-radius: 14px; background: var(--wf-checkout-surface); } body.wehfigo-commerce.woocommerce-checkout table.shop_table { border: 0; background: transparent; } body.wehfigo-commerce.woocommerce-checkout table.shop_table th, body.wehfigo-commerce.woocommerce-checkout table.shop_table td { background: transparent; padding: var(--space-3) 0; } body.wehfigo-commerce.woocommerce-checkout table.shop_table thead th { background: transparent; border-bottom: 1px solid var(--color-page-border); } body.wehfigo-commerce.woocommerce-checkout table.shop_table tr.order-total th, body.wehfigo-commerce.woocommerce-checkout table.shop_table tr.order-total td { font-family: var(--font-family-brand); font-size: var(--text-card-title); font-weight: 700; color: var(--color-page-heading); border-top: 1px solid var(--color-page-border); padding-top: var(--space-4); } /* Payment methods */ body.wehfigo-commerce.woocommerce-checkout #payment { background: transparent; border-radius: 0; } body.wehfigo-commerce.woocommerce-checkout #payment ul.payment_methods { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4) 0; border-bottom: 0; list-style: none; } body.wehfigo-commerce.woocommerce-checkout #payment ul.payment_methods li { margin: 0; padding: var(--space-4); border: 1px solid var(--color-page-border); border-radius: var(--radius-md); background: var(--color-page-bg); transition: border-color var(--duration-fast) var(--ease-standard); overflow: visible; box-sizing: border-box; } body.wehfigo-commerce.woocommerce-checkout #payment ul.payment_methods li:has(input:checked) { border-color: var(--color-primary); box-shadow: 0 0 0 1px var(--color-primary); } body.wehfigo-commerce.woocommerce-checkout #payment ul.payment_methods li label { font-family: var(--font-family-brand); font-size: var(--text-label); font-weight: 600; color: var(--color-page-heading); cursor: pointer; } body.wehfigo-commerce.woocommerce-checkout #payment div.payment_box { margin: var(--space-3) 0 0; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--color-page-bg-alt); color: var(--color-page-text); font-size: var(--text-meta); line-height: 1.55; box-sizing: border-box; width: 100%; max-width: 100%; overflow: hidden; position: relative; left: auto; right: auto; } body.wehfigo-commerce.woocommerce-checkout #payment div.payment_box::before { display: none; } body.wehfigo-commerce.woocommerce-checkout #payment div.payment_box p { margin: 0; } body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-secure { display: flex; flex-direction: column; gap: 0.65rem; } body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-secure__text { margin: 0; color: var(--color-page-muted); } body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-brand { display: flex; align-items: center; gap: 0.55rem; flex-wrap: wrap; } body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-brand--inline { display: inline-flex; align-items: center; gap: 0.35rem; margin-left: 0.5rem; vertical-align: middle; } body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-brand--inline .wehfigo-pay-brand__logo { height: 22px; width: auto; } body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-brand__logo { display: block; height: 28px; width: auto; border-radius: 4px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12); } body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-secure__3ds { margin: 0; font-size: 0.8125rem; font-weight: 600; color: var(--color-page-heading); } /* Place order — the one unmissable action */ body.wehfigo-commerce.woocommerce-checkout #payment button#place_order { width: 100%; min-height: 58px !important; padding: 16px 22px !important; font-size: 1.15rem !important; font-weight: 800 !important; border-radius: 12px !important; box-shadow: 0 10px 28px rgba(214, 0, 28, 0.28); } body.wehfigo-commerce.woocommerce-checkout #payment button#place_order:hover { box-shadow: var(--shadow-glow); } body.wehfigo-commerce.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { font-size: var(--text-meta); color: var(--color-page-muted); } /* ========================================================= 6. Order received (thank you) ========================================================= */ body.wehfigo-commerce .woocommerce-order .woocommerce-thankyou-order-received { font-family: var(--font-family-brand); font-size: var(--text-h2); font-weight: 700; color: var(--color-page-heading); margin-bottom: var(--space-5); } body.wehfigo-commerce .woocommerce-order ul.woocommerce-thankyou-order-details { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--space-3); margin: 0 0 var(--space-6); padding: 0; list-style: none; } body.wehfigo-commerce .woocommerce-order ul.woocommerce-thankyou-order-details li { margin: 0; padding: var(--space-4); border: 1px solid var(--color-page-border); border-right-width: 1px; border-radius: var(--radius-md); background: var(--color-page-bg-alt); font-size: var(--text-meta); text-transform: uppercase; letter-spacing: 0.05em; color: var(--color-page-muted); float: none; } body.wehfigo-commerce .woocommerce-order ul.woocommerce-thankyou-order-details li strong { display: block; margin-top: var(--space-2); font-family: var(--font-family-brand); font-size: var(--text-label); font-weight: 700; text-transform: none; letter-spacing: 0; color: var(--color-page-heading); } /* ========================================================= 7. My account ========================================================= */ body.wehfigo-commerce .woocommerce-MyAccount-navigation ul { display: flex; flex-direction: column; gap: var(--space-1); margin: 0; padding: var(--space-2); border: 1px solid var(--color-page-border); border-radius: var(--radius-lg); background: var(--color-page-bg-alt); list-style: none; } body.wehfigo-commerce .woocommerce-MyAccount-navigation ul li { margin: 0; position: relative; list-style: none; } /* Kill Listeo FA chevrons (li:before \f105) — clash with red active pill */ body.wehfigo-commerce .woocommerce-MyAccount-navigation ul li::before, body.wehfigo-commerce .woocommerce-MyAccount-navigation ul li:before { content: none !important; display: none !important; } body.wehfigo-commerce .woocommerce-MyAccount-navigation ul li a { display: block; padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); font-family: var(--font-family-brand); font-size: var(--text-label); font-weight: 600; color: var(--color-page-text); text-decoration: none; transition: background-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard); } body.wehfigo-commerce .woocommerce-MyAccount-navigation ul li a:hover { background: var(--color-chip-tint); color: var(--color-chip-ink); padding-left: var(--space-4); /* override Listeo hover padding-left: 22px */ } body.wehfigo-commerce .woocommerce-MyAccount-navigation ul li.is-active a { background: var(--color-primary); color: var(--color-brand-white); } body.wehfigo-commerce .woocommerce-MyAccount-content { font-size: var(--text-label); line-height: 1.65; color: var(--color-page-text); } body.wehfigo-commerce .woocommerce-MyAccount-content a:not(.button) { color: var(--color-chip-ink); } /* ========================================================= 8. Dark mode — html[data-theme="dark"] convention ========================================================= */ html[data-theme="dark"] body.wehfigo-commerce ul.products li.regular-product, html[data-theme="dark"] body.wehfigo-commerce ul.products li.plan, html[data-theme="dark"] body.wehfigo-commerce .woocommerce table.shop_table, html[data-theme="dark"] body.wehfigo-commerce .woocommerce a.remove { background: var(--color-page-bg-alt); border-color: var(--color-page-border); box-shadow: none; } html[data-theme="dark"] body.wehfigo-commerce .wehfigo-gate, html[data-theme="dark"] body.wehfigo-commerce .woocommerce .cart_totals, html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout #order_review, html[data-theme="dark"] body.wehfigo-commerce .woocommerce-message, html[data-theme="dark"] body.wehfigo-commerce .woocommerce-info, html[data-theme="dark"] body.wehfigo-commerce .woocommerce-error, html[data-theme="dark"] body.wehfigo-commerce .woocommerce-order ul.woocommerce-thankyou-order-details li, html[data-theme="dark"] body.wehfigo-commerce .woocommerce-MyAccount-navigation ul { background: var(--color-page-bg-alt); border-color: var(--color-page-border); box-shadow: none; } html[data-theme="dark"] body.wehfigo-commerce .wehfigo-gate:not(.wehfigo-gate--page) { background: radial-gradient(120% 140% at 100% 0%, var(--color-chip-tint) 0%, transparent 55%), var(--color-page-bg-alt); } html[data-theme="dark"] body.wehfigo-commerce .wehfigo-gate.wehfigo-gate--page { background: transparent; border: 0; box-shadow: none; } html[data-theme="dark"] body.wehfigo-commerce .woocommerce form .form-row input.input-text, html[data-theme="dark"] body.wehfigo-commerce .woocommerce form .form-row textarea, html[data-theme="dark"] body.wehfigo-commerce .woocommerce form .form-row select, html[data-theme="dark"] body.wehfigo-commerce .woocommerce form .form-row .select2-container .select2-selection--single, html[data-theme="dark"] body.wehfigo-commerce .wehfigo-gate:not(.wehfigo-gate--page) .wehfigo-gate__field input, html[data-theme="dark"] body.wehfigo-commerce .woocommerce .quantity .qty, html[data-theme="dark"] body.wehfigo-commerce.woocommerce .quantity .qty, html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout #payment ul.payment_methods li, body#dark-mode.wehfigo-commerce .woocommerce form .form-row input.input-text, body#dark-mode.wehfigo-commerce .woocommerce form .form-row textarea, body#dark-mode.wehfigo-commerce .woocommerce form .form-row select, body#dark-mode.wehfigo-commerce .woocommerce form .form-row .select2-container .select2-selection--single { background: var(--color-page-bg) !important; background-color: var(--color-page-bg) !important; border-color: var(--color-page-border) !important; color: var(--color-page-heading) !important; box-shadow: none !important; } html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row select, html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row select, html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce #billing_country, html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce #billing_state, html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce #shipping_country, html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce #shipping_state, body#dark-mode.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row select, body#dark-mode.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row select, body#dark-mode.woocommerce-checkout.wehfigo-commerce #billing_country, body#dark-mode.woocommerce-checkout.wehfigo-commerce #billing_state { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23c8cdd4' d='M1.4.6L6 5.2 10.6.6 12 2 6 8 0 2z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 16px center !important; background-size: 12px 8px !important; } html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-selection__rendered, html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-selection__rendered, body#dark-mode.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-selection__rendered, body#dark-mode.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-selection__rendered { color: var(--color-page-heading) !important; } html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-selection__placeholder, html[data-theme="dark"] body.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-selection__placeholder, body#dark-mode.woocommerce-checkout.wehfigo-commerce .woocommerce-billing-fields .form-row .select2-selection__placeholder, body#dark-mode.woocommerce-checkout.wehfigo-commerce .woocommerce-shipping-fields .form-row .select2-selection__placeholder { color: var(--color-page-muted, #8b94a3) !important; } html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout #payment div.payment_box { background: var(--color-page-bg-alt); color: var(--color-page-text); } html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-secure__text { color: var(--color-page-muted); } html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout #payment .wehfigo-pay-secure__3ds { color: var(--color-page-heading); } html[data-theme="dark"] body.wehfigo-commerce .wehfigo-gate-success { background: rgba(29, 138, 75, 0.18); border-color: rgba(80, 200, 130, 0.4); color: #7fdca6; } html[data-theme="dark"] body.wehfigo-commerce .woocommerce-message, html[data-theme="dark"] body.wehfigo-commerce .woocommerce-info, html[data-theme="dark"] body.wehfigo-commerce .woocommerce-error { color: var(--color-page-heading); } /* Kill Listeo's light-gray cell borders / backgrounds inside tables */ html[data-theme="dark"] body.wehfigo-commerce .woocommerce table.shop_table td, html[data-theme="dark"] body.wehfigo-commerce .woocommerce table.shop_table th, html[data-theme="dark"] body.wehfigo-commerce .cart_totals table td, html[data-theme="dark"] body.wehfigo-commerce .cart_totals table th { border-color: var(--color-page-border); } html[data-theme="dark"] body.wehfigo-commerce .woocommerce table.cart td.actions { background: var(--color-page-bg-alt); } /* Checkout order review: Listeo paints the heading + item rows white */ html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout #order_review_heading { background: transparent; color: var(--color-page-heading); } html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout table.shop_table tr.cart_item { background: transparent !important; /* Listeo dark-mode.css forces white */ } html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout table.shop_table th, html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout table.shop_table td { color: var(--color-page-heading) !important; /* ditto: forced #333 */ } html[data-theme="dark"] body.wehfigo-commerce.woocommerce-checkout table.shop_table .product-quantity { background: transparent !important; /* Listeo paints white-on-white */ color: var(--color-page-heading) !important; } /* ========================================================= 9. Mobile polish ========================================================= */ @media (max-width: 640px) { body.wehfigo-commerce.single-product div.product form.cart { flex-direction: column; } body.wehfigo-commerce.single-product div.product form.cart .quantity .qty { width: 100%; } body.wehfigo-commerce .wehfigo-gate { padding: var(--space-5) var(--space-4); } body.wehfigo-commerce.woocommerce-checkout #payment button#place_order, body.wehfigo-commerce .woocommerce .wc-proceed-to-checkout a.checkout-button { min-height: 52px; } /* Cart table collapses gracefully (Woo adds data-title attrs) */ body.wehfigo-commerce .woocommerce-cart table.cart td { font-size: var(--text-label); } } /* Reduced motion: kill the lifts and zooms */ @media (prefers-reduced-motion: reduce) { body.wehfigo-commerce ul.products li.regular-product, body.wehfigo-commerce ul.products li.regular-product .mediaholder img, body.wehfigo-commerce ul.products li.regular-product .mediaholder .button { transition: none; } body.wehfigo-commerce ul.products li.regular-product:hover { transform: none; } body.wehfigo-commerce ul.products li.regular-product:hover .mediaholder img { transform: none; } } /* Remember me: one Listeo custom box (hide any nested native ghost) */ /* rememberme checkout duplicate */ body.wehfigo-commerce .woocommerce-form-login .checkboxes input[type="checkbox"] { display: none !important; } body.wehfigo-commerce .woocommerce-form-login .checkboxes label { display: inline-block !important; position: relative !important; padding-left: 28px !important; cursor: pointer !important; margin: 8px 0 0 !important; line-height: 24px !important; } body.wehfigo-commerce .woocommerce-form-login .checkboxes input[type="checkbox"]:checked + label:before { content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 11px; line-height: 15px; text-align: center; color: #fff; background-color: var(--color-primary, #d6001c); border-color: var(--color-primary, #d6001c); }