/* * Burnigan Core — Storefront Stylesheet * Version: 1.1.6 * Theme: Blocksy Free * Store: WooCommerce * * This file is loaded automatically by the Burnigan Core plugin * (see burnigan-core.php). Do NOT paste it into Appearance > * Customize > Additional CSS — that would double every rule. * * Section map (search the banners below): * 01 Design tokens * 02 Global WooCommerce foundation * 03 Shop / product archives * 05–21 Cart & Checkout (finalized layouts) * 07,24–35 My Account portal * 36–39 Header & mobile navigation * 40–47 Single product * 48–51 Product cards & header polish * 99 Migrated Customizer CSS * Footer V2 * 100 Global page spacing system (header→hero gap fix) — LAST * * --------------------------------------------------------------- * Engineering note — cart grid (retained from earlier debugging): * The cart grid is applied to `.ct-woocommerce-cart-form` (Blocksy's * real wrapper), NOT to `.cart-collaterals`, which classic WooCommerce * templates use but Blocksy does not render. Blocksy's cart markup is: * .woocommerce * > .woocommerce-notices-wrapper * > .ct-woocommerce-cart-form <- grid container (the two items below) * > form.woocommerce-cart-form <- product table * > .cart_totals <- totals box (direct sibling of form) */ /* ========================================================= 01. DESIGN TOKENS ========================================================= */ :root { --burnigan-black: #080808; --burnigan-black-soft: #171717; --burnigan-white: #ffffff; --burnigan-bg: #f4f4f1; --burnigan-bg-alt: #ecece8; --burnigan-border: rgba(8, 8, 8, 0.16); --burnigan-muted: #70706b; --burnigan-max: 1320px; --burnigan-font: Arial, Helvetica, sans-serif; } /* ========================================================= 02. GLOBAL WOOCOMMERCE FOUNDATION ========================================================= */ body.woocommerce, body.woocommerce-page { /* v36: `clip` instead of `hidden`. `hidden` makes the body a scroll container, which silently disables position:sticky on the desktop account sidebar. `clip` prevents the same horizontal overflow without that side effect. */ overflow-x: clip; background: var(--burnigan-bg); } body.woocommerce main#main, body.woocommerce-page main#main { background: var(--burnigan-bg); } body.woocommerce a, body.woocommerce-page a { text-underline-offset: 3px; } body.woocommerce button, body.woocommerce input, body.woocommerce select, body.woocommerce textarea, body.woocommerce-page button, body.woocommerce-page input, body.woocommerce-page select, body.woocommerce-page textarea { font-family: var(--burnigan-font); } body.woocommerce input:not([type="checkbox"]):not([type="radio"]), body.woocommerce select, body.woocommerce textarea, body.woocommerce-page input:not([type="checkbox"]):not([type="radio"]), body.woocommerce-page select, body.woocommerce-page textarea { border-radius: 0 !important; box-shadow: none !important; } body.woocommerce .woocommerce-notices-wrapper:empty, body.woocommerce .blocksy-woo-messages-default:empty, body.woocommerce-page .woocommerce-notices-wrapper:empty, body.woocommerce-page .blocksy-woo-messages-default:empty { display: none !important; width: 0 !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; } /* Notices */ body.woocommerce .woocommerce-message, body.woocommerce .woocommerce-info, body.woocommerce .woocommerce-error, body.woocommerce-page .woocommerce-message, body.woocommerce-page .woocommerce-info, body.woocommerce-page .woocommerce-error, body.woocommerce .wc-block-components-notice-banner, body.woocommerce-page .wc-block-components-notice-banner { margin: 0 0 28px !important; padding: 18px 20px !important; border: 1px solid var(--burnigan-black) !important; border-radius: 0 !important; background: var(--burnigan-white) !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; line-height: 1.6 !important; box-shadow: none !important; } body.woocommerce .woocommerce-error, body.woocommerce-page .woocommerce-error, body.woocommerce .wc-block-components-notice-banner.is-error, body.woocommerce-page .wc-block-components-notice-banner.is-error { border-color: #9f1d1d !important; } body.woocommerce .woocommerce-message::before, body.woocommerce .woocommerce-info::before, body.woocommerce-page .woocommerce-message::before, body.woocommerce-page .woocommerce-info::before { color: var(--burnigan-black) !important; } body.woocommerce .woocommerce-message a.button, body.woocommerce .woocommerce-info a.button, body.woocommerce-page .woocommerce-message a.button, body.woocommerce-page .woocommerce-info a.button { float: right; border: 0 !important; background: transparent !important; color: var(--burnigan-black) !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; } /* Shared primary buttons */ body.woocommerce a.button, body.woocommerce button.button, body.woocommerce input.button, body.woocommerce-page a.button, body.woocommerce-page button.button, body.woocommerce-page input.button, body.woocommerce .wc-block-components-button, body.woocommerce-page .wc-block-components-button { min-height: 48px; display: inline-flex !important; align-items: center; justify-content: center; padding: 14px 22px !important; border: 1px solid var(--burnigan-black) !important; border-radius: 0 !important; background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; box-shadow: none !important; font-family: var(--burnigan-font) !important; font-size: 10px !important; font-weight: 800 !important; line-height: 1 !important; letter-spacing: 0.14em !important; text-decoration: none !important; text-transform: uppercase !important; transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease; } body.woocommerce a.button:hover, body.woocommerce a.button:focus-visible, body.woocommerce button.button:hover, body.woocommerce button.button:focus-visible, body.woocommerce-page a.button:hover, body.woocommerce-page a.button:focus-visible, body.woocommerce-page button.button:hover, body.woocommerce-page button.button:focus-visible, body.woocommerce .wc-block-components-button:hover, body.woocommerce .wc-block-components-button:focus-visible, body.woocommerce-page .wc-block-components-button:hover, body.woocommerce-page .wc-block-components-button:focus-visible { background: transparent !important; color: var(--burnigan-black) !important; transform: translateY(-2px); } /* Shared page-title hero for WooCommerce utility pages */ body:is(.woocommerce-cart, .woocommerce-checkout, .woocommerce-account) .hero-section { position: relative; min-height: 220px !important; display: flex !important; align-items: center; justify-content: center; margin: 0 !important; padding: 50px 24px !important; overflow: hidden; background: radial-gradient(circle at 50% 45%, rgba(255, 255, 255, 0.08), transparent 38%), var(--burnigan-black) !important; color: var(--burnigan-white) !important; text-align: center; } body:is(.woocommerce-cart, .woocommerce-checkout, .woocommerce-account) .hero-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.25; background-image: linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px); background-size: 42px 42px; } body:is(.woocommerce-cart, .woocommerce-checkout, .woocommerce-account) .hero-section > * { position: relative; z-index: 1; } body:is(.woocommerce-cart, .woocommerce-checkout, .woocommerce-account) .hero-section h1 { margin: 0 !important; color: var(--burnigan-white) !important; font-family: var(--burnigan-font) !important; font-size: clamp(46px, 6vw, 78px) !important; font-weight: 900 !important; line-height: 0.92 !important; letter-spacing: -0.055em !important; text-transform: uppercase !important; } /* ========================================================= 03. SHOP + PRODUCT CATEGORY/TAG ARCHIVES ========================================================= */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) { background: var(--burnigan-bg); } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .hero-section { position: relative !important; min-height: 245px !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 !important; padding: 55px 24px !important; overflow: hidden; background: radial-gradient(circle at 50% 45%, rgba(255, 255, 255, 0.08), transparent 38%), #070707 !important; color: var(--burnigan-white) !important; text-align: center !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .hero-section::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0.25; background-image: linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px); background-size: 42px 42px; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .hero-section :is(.ct-container, .ct-container-full, .entry-header, .page-title) { position: relative !important; z-index: 2 !important; width: 100% !important; max-width: 1200px !important; min-height: 0 !important; margin: 0 auto !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .hero-section .entry-header::before { content: "BURNIGAN COLLECTION"; display: block; margin: 0 0 15px; color: rgba(255, 255, 255, 0.55); font-family: var(--burnigan-font); font-size: 9px; font-weight: 700; line-height: 1.4; letter-spacing: 0.32em; text-transform: uppercase; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .hero-section :is(h1, .page-title) { margin: 0 !important; color: var(--burnigan-white) !important; font-family: var(--burnigan-font) !important; font-size: clamp(52px, 6vw, 82px) !important; font-weight: 900 !important; line-height: 0.9 !important; letter-spacing: -0.055em !important; text-transform: uppercase !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .term-description { max-width: 620px; margin: 18px auto 0 !important; color: rgba(255, 255, 255, 0.68) !important; font-size: 14px !important; line-height: 1.7 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main { width: 100% !important; margin: 0 !important; padding: 0 !important; background: var(--burnigan-bg) !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { display: block !important; width: 100% !important; max-width: var(--burnigan-max) !important; margin: 0 auto !important; padding: 55px 28px 90px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main .woocommerce { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } /* Results + ordering */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count { float: left !important; margin: 13px 0 34px !important; color: var(--burnigan-muted) !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 800 !important; line-height: 1.4 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { float: right !important; margin: 0 0 34px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { min-width: 205px !important; height: 46px !important; padding: 0 40px 0 15px !important; border: 1px solid #d2d2cd !important; border-radius: 0 !important; background-color: var(--burnigan-white) !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 12px !important; font-weight: 600 !important; } /* Archive product grid */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { clear: both !important; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 48px 20px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::before, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::after { display: none !important; content: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product { position: relative !important; width: 100% !important; max-width: none !important; float: none !important; clear: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; text-align: left !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product a { text-decoration: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product img { display: block !important; width: 100% !important; height: auto !important; aspect-ratio: 4 / 5 !important; margin: 0 0 18px !important; object-fit: cover !important; object-position: center !important; border-radius: 0 !important; background: #e8e8e4 !important; transition: transform 0.4s ease, opacity 0.4s ease; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product:hover img { transform: scale(1.015); opacity: 0.95; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product :is( .product-category, .product-categories, .ct-product-categories, .ct-woo-card-extra, .entry-meta ) { display: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .woocommerce-loop-product__title { margin: 0 0 8px !important; padding: 0 !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.35 !important; letter-spacing: -0.01em !important; text-transform: uppercase !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .price { display: flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 7px !important; margin: 0 0 16px !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1.4 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .price del { font-size: 11px !important; opacity: 0.42 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .price ins { text-decoration: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .button { width: 100% !important; min-height: 46px !important; margin: 0 !important; padding: 14px 18px !important; font-size: 9px !important; letter-spacing: 0.15em !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .added_to_cart { display: block !important; margin-top: 12px !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .onsale { position: absolute !important; top: 12px !important; right: 12px !important; left: auto !important; z-index: 5 !important; min-width: auto !important; min-height: auto !important; margin: 0 !important; padding: 8px 10px !important; border: 0 !important; border-radius: 0 !important; background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 800 !important; line-height: 1 !important; letter-spacing: 0.13em !important; text-transform: uppercase !important; } /* Keep temporary 1–3 product grids balanced */ @media (min-width: 901px) { @supports selector(ul:has(li)) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:only-child) { grid-template-columns: minmax(250px, 310px) !important; justify-content: center !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(250px, 310px)) !important; justify-content: center !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(240px, 300px)) !important; justify-content: center !important; } } } /* Pagination */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) nav.woocommerce-pagination { margin-top: 65px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) nav.woocommerce-pagination ul { display: flex !important; justify-content: center; gap: 8px; margin: 0 !important; padding: 0 !important; border: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) nav.woocommerce-pagination li { border: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) nav.woocommerce-pagination :is(a, span) { min-width: 44px; min-height: 44px; display: inline-flex !important; align-items: center; justify-content: center; border: 1px solid var(--burnigan-black) !important; background: transparent !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 800 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) nav.woocommerce-pagination .current { background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; } /* ========================================================= 05. CART — BASE LAYOUT (grid is finalized in Section 10) ========================================================= */ body.woocommerce-cart main#main { width: 100% !important; margin: 0 !important; padding: 0 !important; background: var(--burnigan-bg) !important; } body.woocommerce-cart :is(.entry-content, .woocommerce) { width: 100% !important; max-width: none !important; min-width: 0 !important; } body.woocommerce-cart .woocommerce > :is( .woocommerce-notices-wrapper, .woocommerce-message, .woocommerce-info, .woocommerce-error ) { grid-column: 1 / -1 !important; width: 100% !important; max-width: 1100px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; } body.woocommerce-cart .woocommerce-cart-form { grid-column: 1 !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; } /* NOTE: sizing/position/float for .cart-collaterals and .cart_totals is intentionally NOT declared here anymore (v4). It previously conflicted with Section 10's values (390px/92px vs 400px/90px) and — critically — was the ONLY place `float: none` was ever set on these elements, at a specificity too low to reliably beat Blocksy's core float rules. That conflict caused the Cart Totals box to detach from its grid column and overlap the product table. All final positioning now lives in Section 10. */ /* Cart table */ body.woocommerce-cart table.shop_table { width: 100% !important; table-layout: auto !important; margin: 0 !important; border: 0 !important; border-collapse: collapse !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; } body.woocommerce-cart table.shop_table thead th { padding: 0 8px 16px !important; border: 0 !important; border-bottom: 1px solid var(--burnigan-black) !important; background: transparent !important; color: var(--burnigan-muted) !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 800 !important; line-height: 1.4 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; } body.woocommerce-cart table.shop_table tbody td { padding: 20px 8px !important; border: 0 !important; border-bottom: 1px solid var(--burnigan-border) !important; background: transparent !important; vertical-align: middle !important; } body.woocommerce-cart td.product-remove { width: 36px !important; min-width: 36px !important; text-align: center !important; } body.woocommerce-cart td.product-remove a.remove { width: 30px !important; height: 30px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border: 1px solid rgba(8, 8, 8, 0.24) !important; border-radius: 0 !important; background: transparent !important; color: var(--burnigan-black) !important; font-size: 18px !important; line-height: 1 !important; text-decoration: none !important; } body.woocommerce-cart td.product-remove a.remove:hover { background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; } /* Force useful thumbnail width; prevents Blocksy from collapsing it */ body.woocommerce-cart td.product-thumbnail { display: table-cell !important; width: 112px !important; min-width: 112px !important; max-width: 112px !important; } body.woocommerce-cart td.product-thumbnail a { display: block !important; width: 96px !important; min-width: 96px !important; } body.woocommerce-cart td.product-thumbnail img, body.woocommerce-cart .woocommerce-cart-form__cart-item .product-thumbnail img { display: block !important; width: 96px !important; min-width: 96px !important; max-width: 96px !important; height: 118px !important; object-fit: cover !important; object-position: center !important; border-radius: 0 !important; background: #e8e8e4 !important; } body.woocommerce-cart td.product-name { width: auto !important; min-width: 185px !important; padding-left: 4px !important; } body.woocommerce-cart td.product-name a { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.35 !important; text-decoration: none !important; text-transform: uppercase !important; } body.woocommerce-cart td.product-name a:hover { opacity: 0.58 !important; } body.woocommerce-cart td.product-name :is(dl.variation, .variation) { margin: 8px 0 0 !important; color: #666660 !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; line-height: 1.5 !important; } body.woocommerce-cart td.product-price, body.woocommerce-cart td.product-subtotal { width: 108px !important; min-width: 108px !important; white-space: nowrap !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 14px !important; font-weight: 700 !important; } body.woocommerce-cart td.product-quantity { width: 124px !important; min-width: 124px !important; } body.woocommerce-cart .quantity { width: 112px !important; min-width: 112px !important; height: 46px !important; display: flex !important; align-items: center !important; margin: 0 !important; border: 1px solid var(--burnigan-black) !important; border-radius: 0 !important; background: transparent !important; } body.woocommerce-cart .quantity input.qty { width: 100% !important; height: 44px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 700 !important; box-shadow: none !important; } /* Coupon + update */ body.woocommerce-cart td.actions { padding: 22px 0 0 !important; border-bottom: 0 !important; } body.woocommerce-cart td.actions .coupon { display: grid !important; grid-template-columns: minmax(170px, 220px) auto !important; gap: 9px !important; float: left !important; } body.woocommerce-cart td.actions .coupon input.input-text { width: 100% !important; min-height: 48px !important; margin: 0 !important; padding: 0 14px !important; border: 1px solid var(--burnigan-black) !important; border-radius: 0 !important; background: var(--burnigan-white) !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; box-shadow: none !important; } body.woocommerce-cart td.actions button[name="update_cart"] { float: right !important; } body.woocommerce-cart td.actions button:disabled { opacity: 0.42 !important; cursor: not-allowed !important; } /* Cart totals: typography only. Box model/position is Section 10. */ body.woocommerce-cart .cart_totals { border: 1px solid var(--burnigan-black) !important; background: var(--burnigan-white) !important; box-sizing: border-box !important; } body.woocommerce-cart .cart_totals h2 { width: 100% !important; margin: 0 0 24px !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: clamp(32px, 3vw, 46px) !important; font-weight: 900 !important; line-height: 0.95 !important; letter-spacing: -0.05em !important; text-transform: uppercase !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; } body.woocommerce-cart .cart_totals table { width: 100% !important; table-layout: fixed !important; margin: 0 !important; border: 0 !important; border-collapse: collapse !important; } body.woocommerce-cart .cart_totals table :is(th, td) { padding: 16px 0 !important; border: 0 !important; border-bottom: 1px solid var(--burnigan-border) !important; vertical-align: top !important; white-space: normal !important; word-break: normal !important; overflow-wrap: break-word !important; } body.woocommerce-cart .cart_totals table th { width: 35% !important; padding-right: 14px !important; color: var(--burnigan-muted) !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; } body.woocommerce-cart .cart_totals table td { width: 65% !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 14px !important; font-weight: 700 !important; } body.woocommerce-cart .cart_totals tr.order-total td { font-size: 19px !important; font-weight: 900 !important; } body.woocommerce-cart ul#shipping_method { margin: 0 !important; padding: 0 !important; list-style: none !important; } body.woocommerce-cart ul#shipping_method li { display: grid !important; grid-template-columns: 18px minmax(0, 1fr) !important; gap: 9px !important; align-items: start !important; margin: 0 0 12px !important; } body.woocommerce-cart ul#shipping_method input[type="radio"] { width: 16px !important; height: 16px !important; margin: 3px 0 0 !important; accent-color: var(--burnigan-black) !important; } body.woocommerce-cart ul#shipping_method label { margin: 0 !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.5 !important; } body.woocommerce-cart :is(.woocommerce-shipping-destination, .woocommerce-shipping-calculator) { color: #555550 !important; font-family: var(--burnigan-font) !important; font-size: 12px !important; line-height: 1.6 !important; } body.woocommerce-cart .shipping-calculator-button { color: var(--burnigan-black) !important; font-weight: 700 !important; text-decoration: underline !important; } body.woocommerce-cart .wc-proceed-to-checkout { margin: 26px 0 0 !important; padding: 0 !important; } body.woocommerce-cart .wc-proceed-to-checkout .checkout-button { width: 100% !important; min-height: 54px !important; margin: 0 !important; } /* Cart block */ body.woocommerce-cart .wc-block-cart { max-width: 1100px !important; margin: 0 auto !important; gap: 36px !important; } body.woocommerce-cart .wc-block-cart-items { border-collapse: collapse !important; } body.woocommerce-cart .wc-block-cart-items th { border-bottom: 1px solid var(--burnigan-black) !important; color: var(--burnigan-muted) !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; } body.woocommerce-cart .wc-block-cart-items td { padding-top: 22px !important; padding-bottom: 22px !important; border-bottom: 1px solid var(--burnigan-border) !important; } body.woocommerce-cart .wc-block-components-product-name { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 14px !important; font-weight: 800 !important; text-decoration: none !important; text-transform: uppercase !important; } body.woocommerce-cart .wc-block-components-quantity-selector { border: 1px solid var(--burnigan-black) !important; border-radius: 0 !important; } body.woocommerce-cart .wc-block-cart__sidebar { min-width: 0 !important; padding: 28px !important; border: 1px solid var(--burnigan-black) !important; background: var(--burnigan-white) !important; } body.woocommerce-cart .wc-block-cart__totals-title { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 26px !important; font-weight: 900 !important; letter-spacing: -0.03em !important; text-transform: uppercase !important; } body.woocommerce-cart .wc-block-cart__submit-button { width: 100% !important; } /* Empty cart */ body.woocommerce-cart :is(.cart-empty, .wc-block-cart__empty-cart__title) { margin: 0 0 24px !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: clamp(34px, 5vw, 58px) !important; font-weight: 900 !important; line-height: 1 !important; text-transform: uppercase !important; } body.woocommerce-cart .return-to-shop { margin-top: 25px !important; } /* ========================================================= 06. CHECKOUT — CLASSIC + CHECKOUT BLOCK ========================================================= */ body.woocommerce-checkout main#main > :is(.ct-container, .ct-container-full) { width: 100% !important; max-width: var(--burnigan-max) !important; margin: 0 auto !important; padding: 70px 28px 95px !important; } /* Classic checkout */ body.woocommerce-checkout form.checkout { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(360px, 0.72fr) !important; gap: 55px !important; align-items: start; } body.woocommerce-checkout form.checkout > :is(#customer_details, #order_review_heading, #order_review) { width: 100% !important; } body.woocommerce-checkout #customer_details { grid-column: 1; grid-row: 1 / span 2; } body.woocommerce-checkout #order_review_heading { grid-column: 2; margin: 0 !important; padding: 0 0 18px !important; } body.woocommerce-checkout #order_review { grid-column: 2; padding: 30px !important; border: 1px solid var(--burnigan-black); background: var(--burnigan-white); } body.woocommerce-checkout :is( .woocommerce-billing-fields > h3, .woocommerce-shipping-fields h3, #order_review_heading ) { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: clamp(28px, 3vw, 40px) !important; font-weight: 900 !important; letter-spacing: -0.04em !important; text-transform: uppercase !important; } body.woocommerce-checkout .form-row { margin-bottom: 18px !important; } body.woocommerce-checkout .form-row label { margin-bottom: 7px !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; } body.woocommerce-checkout .form-row :is(input, select, textarea), body.woocommerce-checkout .select2-container .select2-selection { min-height: 50px !important; border: 1px solid #c9c9c4 !important; border-radius: 0 !important; background: var(--burnigan-white) !important; } body.woocommerce-checkout #payment { border-radius: 0 !important; background: transparent !important; } body.woocommerce-checkout #payment ul.payment_methods { padding: 0 0 22px !important; border-bottom: 1px solid var(--burnigan-border) !important; } body.woocommerce-checkout #place_order { width: 100% !important; margin-top: 20px !important; } /* Checkout block */ body.woocommerce-checkout .wc-block-checkout { gap: 50px !important; } body.woocommerce-checkout .wc-block-components-checkout-step { margin-bottom: 28px !important; padding: 28px !important; border: 1px solid var(--burnigan-border); background: var(--burnigan-white); } body.woocommerce-checkout .wc-block-components-checkout-step__heading h2 { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 28px !important; font-weight: 900 !important; letter-spacing: -0.03em !important; text-transform: uppercase !important; } body.woocommerce-checkout :is( .wc-block-components-text-input input, .wc-block-components-combobox-control input, .wc-block-components-textarea ) { border: 1px solid #c9c9c4 !important; border-radius: 0 !important; background: var(--burnigan-white) !important; } body.woocommerce-checkout .wc-block-components-sidebar { padding: 30px !important; border: 1px solid var(--burnigan-black); background: var(--burnigan-white); } body.woocommerce-checkout .wc-block-components-order-summary__button-text, body.woocommerce-checkout .wc-block-components-totals-wrapper { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; } body.woocommerce-checkout .wc-block-components-checkout-place-order-button { width: 100% !important; } /* ========================================================= 07. MY ACCOUNT ========================================================= */ body.woocommerce-account main#main > :is(.ct-container, .ct-container-full) { width: 100% !important; max-width: var(--burnigan-max) !important; margin: 0 auto !important; padding: 70px 28px 95px !important; } body.woocommerce-account .woocommerce { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 55px; align-items: start; } body.woocommerce-account .woocommerce-notices-wrapper { grid-column: 1 / -1; } body.woocommerce-account .woocommerce-MyAccount-navigation { width: 100% !important; float: none !important; padding: 0 !important; border: 1px solid var(--burnigan-black); background: var(--burnigan-white); } body.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0 !important; padding: 0 !important; list-style: none !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li { margin: 0 !important; border-bottom: 1px solid var(--burnigan-border); } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child { border-bottom: 0; } body.woocommerce-account .woocommerce-MyAccount-navigation a { display: block; padding: 16px 18px; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: 0.12em !important; text-decoration: none !important; text-transform: uppercase !important; } body.woocommerce-account .woocommerce-MyAccount-navigation .is-active a, body.woocommerce-account .woocommerce-MyAccount-navigation a:hover { background: var(--burnigan-black); color: var(--burnigan-white) !important; } body.woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; float: none !important; padding: 34px !important; border: 1px solid var(--burnigan-border); background: var(--burnigan-white); } body.woocommerce-account .woocommerce-MyAccount-content h2, body.woocommerce-account .woocommerce-MyAccount-content h3 { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 28px !important; font-weight: 900 !important; text-transform: uppercase !important; } body.woocommerce-account .woocommerce-MyAccount-content table { border: 0 !important; border-collapse: collapse !important; } body.woocommerce-account .woocommerce-MyAccount-content th, body.woocommerce-account .woocommerce-MyAccount-content td { padding: 14px 10px !important; border-bottom: 1px solid var(--burnigan-border) !important; } body.woocommerce-account .woocommerce-form-login, body.woocommerce-account .woocommerce-form-register { padding: 32px !important; border: 1px solid var(--burnigan-black) !important; border-radius: 0 !important; background: var(--burnigan-white); } body.woocommerce-account .woocommerce-form :is(input[type="text"], input[type="email"], input[type="password"]) { min-height: 50px; border: 1px solid #c9c9c4 !important; background: var(--burnigan-white) !important; } /* Logged-out account screen should not force an empty navigation column */ body.woocommerce-account:not(.logged-in) .woocommerce { display: block; } body.woocommerce-account:not(.logged-in) .woocommerce > :is(#customer_login, .woocommerce-form-login) { max-width: 920px; margin: 0 auto; } /* ========================================================= 08. ORDER RECEIVED / THANK-YOU PAGE ========================================================= */ body.woocommerce-order-received .woocommerce-order { max-width: 1000px; margin: 0 auto; } body.woocommerce-order-received .woocommerce-thankyou-order-received { margin: 0 0 35px !important; padding: 30px !important; border: 1px solid var(--burnigan-black); background: var(--burnigan-white); color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: clamp(24px, 3vw, 38px) !important; font-weight: 900 !important; line-height: 1.2 !important; text-transform: uppercase !important; } body.woocommerce-order-received .woocommerce-order-overview { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0 0 40px !important; padding: 1px !important; border: 0 !important; background: var(--burnigan-border); } body.woocommerce-order-received .woocommerce-order-overview li { margin: 0 !important; padding: 20px !important; border: 0 !important; background: var(--burnigan-white); } body.woocommerce-order-received .woocommerce-order-overview li, body.woocommerce-order-received .woocommerce-order-overview strong { font-family: var(--burnigan-font) !important; } body.woocommerce-order-received .woocommerce-order-details, body.woocommerce-order-received .woocommerce-customer-details { margin-top: 45px !important; } body.woocommerce-order-received :is( .woocommerce-order-details__title, .woocommerce-column__title ) { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 28px !important; font-weight: 900 !important; text-transform: uppercase !important; } /* ========================================================= 09. RESPONSIVE RULES ========================================================= */ @media (max-width: 1050px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } body.single-product div.product { grid-template-columns: minmax(0, 1fr) minmax(320px, 0.9fr) !important; column-gap: 38px !important; } body.single-product div.product > .summary { position: static !important; } body.single-product .summary .product_title { font-size: 40px !important; } body.woocommerce-checkout form.checkout { gap: 35px !important; } body.woocommerce-account .woocommerce { grid-template-columns: 200px minmax(0, 1fr); gap: 30px; } } @media (max-width: 850px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding: 50px 22px 75px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } body.single-product main#main > :is(.ct-container, .ct-container-full) { padding: 24px 22px 80px !important; } body.single-product div.product { display: block !important; } body.single-product div.product > .woocommerce-product-gallery { margin-bottom: 36px !important; } body.single-product div.product > .woocommerce-tabs { margin-top: 60px !important; padding-top: 45px !important; } body.single-product :is(.related.products, .upsells.products) { margin-top: 60px !important; } body.single-product :is(.related.products, .upsells.products) ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } body.single-product #reviews { grid-template-columns: 1fr !important; gap: 40px !important; } body.woocommerce-checkout form.checkout { display: block !important; } body.woocommerce-checkout #order_review_heading { margin-top: 50px !important; } body.woocommerce-account .woocommerce { display: block; } body.woocommerce-account .woocommerce-MyAccount-navigation { margin-bottom: 28px; } body.woocommerce-order-received .woocommerce-order-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 600px) { body:is(.woocommerce-cart, .woocommerce-checkout, .woocommerce-account) .hero-section { min-height: 175px !important; padding: 40px 18px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .hero-section { min-height: 190px !important; padding: 42px 20px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .hero-section :is(h1, .page-title) { font-size: 48px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding: 38px 18px 60px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { width: 100% !important; float: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count { margin: 0 0 15px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { margin: 0 0 32px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { width: 100% !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products, body.single-product :is(.related.products, .upsells.products) ul.products { grid-template-columns: 1fr !important; gap: 42px !important; } body.single-product main#main > :is(.ct-container, .ct-container-full) { padding: 18px 18px 65px !important; } body.single-product .woocommerce-breadcrumb { margin-bottom: 22px !important; } body.single-product .summary .product_title { font-size: 38px !important; } body.single-product .summary form.cart { grid-template-columns: 1fr !important; } body.single-product .woocommerce-tabs ul.tabs { gap: 22px !important; } body.single-product :is(.related.products, .upsells.products) > h2 { font-size: 40px !important; } body.woocommerce-checkout main#main > :is(.ct-container, .ct-container-full), body.woocommerce-account main#main > :is(.ct-container, .ct-container-full) { padding: 45px 18px 65px !important; } body.woocommerce-checkout .wc-block-components-checkout-step, body.woocommerce-checkout .wc-block-components-sidebar, body.woocommerce-checkout #order_review { padding: 22px !important; } body.woocommerce-account .woocommerce-MyAccount-content { padding: 24px !important; } body.woocommerce-order-received .woocommerce-order-overview { grid-template-columns: 1fr; } } @media (prefers-reduced-motion: reduce) { body.woocommerce *, body.woocommerce-page * { scroll-behavior: auto !important; } body.woocommerce li.product img, body.woocommerce li.product .button, body.woocommerce-page li.product img, body.woocommerce-page li.product .button { transition: none !important; } } /* ========================================================= BURNIGAN VIEW CART LINK ========================================================= */ body.woocommerce a.added_to_cart, body.woocommerce-page a.added_to_cart, body.single-product a.added_to_cart, body.woocommerce-shop a.added_to_cart, body.tax-product_cat a.added_to_cart, body.tax-product_tag a.added_to_cart { width: 100% !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 12px 0 0 !important; padding: 14px 18px !important; border: 1px solid #080808 !important; border-radius: 0 !important; background: #080808 !important; color: #ffffff !important; box-shadow: none !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 10px !important; font-weight: 800 !important; line-height: 1 !important; letter-spacing: 0.15em !important; text-decoration: none !important; text-transform: uppercase !important; transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease; } body.woocommerce a.added_to_cart:hover, body.woocommerce a.added_to_cart:focus-visible, body.woocommerce-page a.added_to_cart:hover, body.woocommerce-page a.added_to_cart:focus-visible { background: transparent !important; color: #080808 !important; transform: translateY(-2px); } /* Keep the button aligned on mobile */ @media (max-width: 600px) { body.woocommerce a.added_to_cart, body.woocommerce-page a.added_to_cart { width: 100% !important; margin-top: 10px !important; } } /* ========================================================= HOMEPAGE NEW ARRIVALS — VIEW CART BUTTON ========================================================= */ body.home .woocommerce a.added_to_cart, body.home .burnigan-new-arrivals-grid a.added_to_cart, body.home ul.products li.product a.added_to_cart { width: 100% !important; min-height: 48px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 10px 0 0 !important; padding: 14px 18px !important; border: 1px solid #080808 !important; border-radius: 0 !important; background: #080808 !important; color: #ffffff !important; box-shadow: none !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 10px !important; font-weight: 800 !important; line-height: 1 !important; letter-spacing: 0.15em !important; text-decoration: none !important; text-transform: uppercase !important; transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease; } body.home .woocommerce a.added_to_cart:hover, body.home .woocommerce a.added_to_cart:focus-visible, body.home .burnigan-new-arrivals-grid a.added_to_cart:hover, body.home .burnigan-new-arrivals-grid a.added_to_cart:focus-visible { background: transparent !important; color: #080808 !important; transform: translateY(-2px); } /* ========================================================= SHOP + CATEGORY ARCHIVES — FIX VIEW CART BUTTON ========================================================= */ body:is( .woocommerce-shop, .tax-product_cat, .tax-product_tag ) ul.products li.product a.added_to_cart { width: 100% !important; min-height: 46px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; margin: 10px 0 0 !important; padding: 14px 18px !important; border: 1px solid #080808 !important; border-radius: 0 !important; background: #ffffff !important; color: #080808 !important; opacity: 1 !important; visibility: visible !important; text-indent: 0 !important; font-size: 9px !important; font-family: Arial, Helvetica, sans-serif !important; font-weight: 800 !important; line-height: 1 !important; letter-spacing: 0.15em !important; text-align: center !important; text-decoration: none !important; text-transform: uppercase !important; box-shadow: none !important; } /* Force WooCommerce's View Cart text to remain visible */ body:is( .woocommerce-shop, .tax-product_cat, .tax-product_tag ) ul.products li.product a.added_to_cart::before, body:is( .woocommerce-shop, .tax-product_cat, .tax-product_tag ) ul.products li.product a.added_to_cart::after { display: none !important; content: none !important; } body:is( .woocommerce-shop, .tax-product_cat, .tax-product_tag ) ul.products li.product a.added_to_cart:hover, body:is( .woocommerce-shop, .tax-product_cat, .tax-product_tag ) ul.products li.product a.added_to_cart:focus-visible { background: #080808 !important; color: #ffffff !important; } /* ========================================================= 10. FINAL CART + CHECKOUT LAYOUT OVERRIDES Keep this section last. It deliberately overrides Blocksy float widths and earlier WooCommerce layout declarations. v4: `.cart-collaterals` and `.cart-collaterals .cart_totals` now BOTH explicitly force `float: none !important` and `display: block !important` at the `#main`-qualified specificity used throughout this section. This is the fix — previously only `.cart-collaterals` (not `.cart_totals` itself) was locked down here, so Blocksy's core float rule on `.cart_totals` could still win and pull the box out of the grid track, producing the overlapping panel seen on the live cart page. ========================================================= */ /* ---------- CART: centered desktop layout ---------- */ body.woocommerce-cart { --theme-normal-container-max-width: 1240px !important; --theme-content-vertical-spacing: 0px !important; } body.woocommerce-cart #main, body.woocommerce-cart #main > .ct-container, body.woocommerce-cart #main > .ct-container-full, body.woocommerce-cart #main article, body.woocommerce-cart #main .entry-content { box-sizing: border-box !important; } body.woocommerce-cart #main > .ct-container, body.woocommerce-cart #main > .ct-container-full { width: calc(100% - 40px) !important; max-width: 1240px !important; margin-inline: auto !important; padding: 52px 0 92px !important; } body.woocommerce-cart #main article, body.woocommerce-cart #main .entry-content { width: 100% !important; max-width: none !important; margin: 0 !important; padding-inline: 0 !important; } body.woocommerce-cart #main .woocommerce { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; } body.woocommerce-cart #main .woocommerce > .woocommerce-notices-wrapper, body.woocommerce-cart #main .woocommerce > .woocommerce-message, body.woocommerce-cart #main .woocommerce > .woocommerce-info, body.woocommerce-cart #main .woocommerce > .woocommerce-error { width: 100% !important; max-width: 1142px !important; margin: 0 auto 24px !important; } /* ACTUAL FIX (v5): Blocksy does not render a `.cart-collaterals` wrapper. The real DOM is: .woocommerce > .woocommerce-notices-wrapper > .ct-woocommerce-cart-form <-- Blocksy's own wrapper > form.woocommerce-cart-form <-- the table > .cart_totals <-- totals, direct sibling of the form `.cart-collaterals` never matched anything, which is why earlier fixes targeting it had zero effect. The grid must be applied to `.ct-woocommerce-cart-form`, and `.woocommerce-cart-form` / `.cart_totals` must be the grid items directly. */ body.woocommerce-cart #main .ct-woocommerce-cart-form { display: grid !important; grid-template-columns: minmax(0, 700px) 400px !important; align-items: start !important; gap: 42px !important; width: 100% !important; max-width: 1142px !important; min-width: 0 !important; margin: 0 auto !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form .woocommerce-cart-form { grid-column: 1 !important; grid-row: 1 !important; width: 100% !important; max-width: none !important; min-width: 0 !important; float: none !important; margin: 0 !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { grid-column: 2 !important; grid-row: 1 !important; float: none !important; clear: none !important; display: block !important; width: 100% !important; min-width: 0 !important; max-width: 400px !important; margin: 0 !important; padding: 34px 32px !important; box-sizing: border-box !important; position: sticky !important; top: 90px !important; } body.woocommerce-cart #main .cart_totals h2 { font-size: 44px !important; line-height: 0.92 !important; white-space: normal !important; word-break: keep-all !important; overflow-wrap: normal !important; } body.woocommerce-cart #main .cart_totals table { width: 100% !important; table-layout: auto !important; } body.woocommerce-cart #main .cart_totals table th { width: 34% !important; min-width: 86px !important; } body.woocommerce-cart #main .cart_totals table td { width: 66% !important; min-width: 0 !important; text-align: right !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method, body.woocommerce-cart #main .cart_totals ul#shipping_method li, body.woocommerce-cart #main .cart_totals ul#shipping_method label { width: 100% !important; max-width: none !important; } body.woocommerce-cart #main td.product-thumbnail { width: 112px !important; min-width: 112px !important; max-width: 112px !important; } body.woocommerce-cart #main td.product-thumbnail a, body.woocommerce-cart #main td.product-thumbnail img { width: 96px !important; min-width: 96px !important; max-width: 96px !important; } body.woocommerce-cart #main td.product-thumbnail img { height: 118px !important; object-fit: cover !important; } body.woocommerce-cart #main td.actions { white-space: normal !important; } body.woocommerce-cart #main td.actions .coupon { display: grid !important; grid-template-columns: minmax(180px, 230px) auto !important; gap: 10px !important; align-items: stretch !important; } /* ---------- CART: tablet ---------- */ @media (max-width: 1120px) { body.woocommerce-cart #main > .ct-container, body.woocommerce-cart #main > .ct-container-full { width: calc(100% - 32px) !important; max-width: 820px !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form { display: block !important; max-width: 780px !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form .woocommerce-cart-form { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 0 46px !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { position: static !important; width: min(100%, 620px) !important; min-width: 0 !important; max-width: 620px !important; margin: 0 auto !important; } } /* ---------- CART: mobile cards ---------- */ @media (max-width: 700px) { body.woocommerce-cart #main > .ct-container, body.woocommerce-cart #main > .ct-container-full { width: calc(100% - 24px) !important; padding: 30px 0 62px !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form { gap: 34px !important; } body.woocommerce-cart #main table.shop_table thead { display: none !important; } body.woocommerce-cart #main table.shop_table, body.woocommerce-cart #main table.shop_table tbody { display: block !important; width: 100% !important; } body.woocommerce-cart #main table.shop_table tr.cart_item { position: relative !important; display: grid !important; grid-template-columns: 104px minmax(0, 1fr) !important; gap: 8px 14px !important; width: 100% !important; margin: 0 0 14px !important; padding: 14px !important; border: 1px solid var(--burnigan-border) !important; background: var(--burnigan-white) !important; box-sizing: border-box !important; } body.woocommerce-cart #main table.shop_table tr.cart_item td { display: block !important; width: 100% !important; min-width: 0 !important; max-width: none !important; padding: 0 !important; border: 0 !important; } body.woocommerce-cart #main td.product-thumbnail { grid-column: 1 !important; grid-row: 1 / span 5 !important; width: 104px !important; min-width: 104px !important; max-width: 104px !important; } body.woocommerce-cart #main td.product-thumbnail a, body.woocommerce-cart #main td.product-thumbnail img { width: 104px !important; min-width: 104px !important; max-width: 104px !important; } body.woocommerce-cart #main td.product-thumbnail img { height: 130px !important; } body.woocommerce-cart #main td.product-name, body.woocommerce-cart #main td.product-price, body.woocommerce-cart #main td.product-quantity, body.woocommerce-cart #main td.product-subtotal { grid-column: 2 !important; } body.woocommerce-cart #main td.product-remove { position: absolute !important; top: 12px !important; right: 12px !important; width: 30px !important; } body.woocommerce-cart #main td.product-name { padding-right: 38px !important; } /* Blocksy embeds a second, mobile-only copy of quantity/price/remove inside td.product-name (div.product-mobile-actions, class "ct-hidden-lg"). Forcing every td to display:block above also un-hides the REAL td.product-quantity / td.product-remove cells that Blocksy meant to keep hidden here, producing duplicated quantity boxes and an overlapping remove icon. Since we already give quantity/price/remove their own dedicated grid cells below, hide Blocksy's built-in duplicate entirely. */ body.woocommerce-cart #main td.product-name .product-mobile-actions { display: none !important; } body.woocommerce-cart #main td.actions, body.woocommerce-cart #main td.actions .coupon { display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; float: none !important; } body.woocommerce-cart #main td.actions .coupon input, body.woocommerce-cart #main td.actions .coupon button, body.woocommerce-cart #main td.actions button[name="update_cart"] { width: 100% !important; float: none !important; margin: 0 !important; } body.woocommerce-cart #main td.actions button[name="update_cart"] { margin-top: 10px !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { position: static !important; width: 100% !important; min-width: 0 !important; max-width: none !important; padding: 24px 20px !important; } body.woocommerce-cart #main .cart_totals h2 { font-size: 38px !important; } } /* ---------- CHECKOUT: centered classic layout ---------- */ body.woocommerce-checkout { --theme-normal-container-max-width: 1240px !important; } body.woocommerce-checkout #main > .ct-container, body.woocommerce-checkout #main > .ct-container-full { width: calc(100% - 40px) !important; max-width: 1240px !important; margin-inline: auto !important; padding: 54px 0 92px !important; } body.woocommerce-checkout #main article, body.woocommerce-checkout #main .entry-content, body.woocommerce-checkout #main .woocommerce { width: 100% !important; max-width: none !important; margin-inline: 0 !important; padding-inline: 0 !important; box-sizing: border-box !important; } body.woocommerce-checkout form.checkout.woocommerce-checkout { display: grid !important; grid-template-columns: minmax(0, 680px) 420px !important; grid-template-areas: "customer heading" "customer review" !important; justify-content: center !important; align-items: start !important; gap: 0 44px !important; width: 100% !important; max-width: 1144px !important; margin: 0 auto !important; } body.woocommerce-checkout form.checkout #customer_details { grid-area: customer !important; width: 100% !important; min-width: 0 !important; float: none !important; margin: 0 !important; } body.woocommerce-checkout form.checkout #order_review_heading { grid-area: heading !important; width: 420px !important; min-width: 420px !important; max-width: 420px !important; margin: 0 !important; padding: 0 0 18px !important; } body.woocommerce-checkout form.checkout #order_review { grid-area: review !important; width: 420px !important; min-width: 420px !important; max-width: 420px !important; margin: 0 !important; padding: 30px !important; box-sizing: border-box !important; } body.woocommerce-checkout #order_review table.shop_table { width: 100% !important; table-layout: auto !important; } body.woocommerce-checkout #order_review table.shop_table th, body.woocommerce-checkout #order_review table.shop_table td { white-space: normal !important; word-break: normal !important; overflow-wrap: anywhere !important; } body.woocommerce-checkout #payment, body.woocommerce-checkout #payment .payment_box { width: 100% !important; max-width: none !important; box-sizing: border-box !important; } /* Checkout block layout */ body.woocommerce-checkout .wc-block-checkout { grid-template-columns: minmax(0, 680px) 420px !important; justify-content: center !important; gap: 44px !important; max-width: 1144px !important; margin-inline: auto !important; } body.woocommerce-checkout .wc-block-checkout__main, body.woocommerce-checkout .wc-block-checkout__sidebar, body.woocommerce-checkout .wc-block-components-sidebar { min-width: 0 !important; max-width: none !important; box-sizing: border-box !important; } body.woocommerce-checkout .wc-block-checkout__sidebar, body.woocommerce-checkout .wc-block-components-sidebar { width: 420px !important; } @media (max-width: 1020px) { body.woocommerce-checkout #main > .ct-container, body.woocommerce-checkout #main > .ct-container-full { width: calc(100% - 32px) !important; max-width: 760px !important; } body.woocommerce-checkout form.checkout.woocommerce-checkout, body.woocommerce-checkout .wc-block-checkout { display: block !important; max-width: 720px !important; } body.woocommerce-checkout form.checkout #customer_details, body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review, body.woocommerce-checkout .wc-block-checkout__sidebar, body.woocommerce-checkout .wc-block-components-sidebar { width: 100% !important; min-width: 0 !important; max-width: none !important; } body.woocommerce-checkout form.checkout #order_review_heading { margin-top: 48px !important; } } @media (max-width: 600px) { body.woocommerce-checkout #main > .ct-container, body.woocommerce-checkout #main > .ct-container-full { width: calc(100% - 24px) !important; padding: 34px 0 62px !important; } body.woocommerce-checkout form.checkout #order_review, body.woocommerce-checkout .wc-block-components-checkout-step, body.woocommerce-checkout .wc-block-components-sidebar { padding: 20px !important; } } /* ========================================================= BURNIGAN PRODUCT CATEGORY NAVIGATION ========================================================= */ .burnigan-category-navigation { width: 100%; max-width: 1280px; margin: 0 auto 42px; padding: 0 24px 22px; border-bottom: 1px solid rgba(8, 8, 8, 0.16); } .burnigan-category-navigation__inner { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px 30px; } .burnigan-category-navigation__link { position: relative; min-height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: 0; color: #777772; text-decoration: none; font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: 800; line-height: 1; letter-spacing: 0.16em; text-transform: uppercase; transition: color 0.22s ease, opacity 0.22s ease; } .burnigan-category-navigation__link::after { content: ""; position: absolute; right: 0; bottom: -23px; left: 0; height: 2px; background: #080808; opacity: 0; transform: scaleX(0); transform-origin: left center; transition: opacity 0.22s ease, transform 0.22s ease; } .burnigan-category-navigation__link:hover, .burnigan-category-navigation__link:focus-visible, .burnigan-category-navigation__link.is-active { color: #080808; } .burnigan-category-navigation__link:hover::after, .burnigan-category-navigation__link:focus-visible::after, .burnigan-category-navigation__link.is-active::after { opacity: 1; transform: scaleX(1); } /* Keep product counter and sorting below the navigation */ .woocommerce .burnigan-category-navigation { clear: both; } .woocommerce .burnigan-category-navigation + .woocommerce-result-count { clear: left; } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 700px) { .burnigan-category-navigation { margin-bottom: 30px; padding-right: 0; padding-bottom: 18px; padding-left: 18px; overflow: hidden; } .burnigan-category-navigation__inner { justify-content: flex-start; flex-wrap: nowrap; gap: 24px; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; padding-right: 18px; padding-bottom: 4px; } .burnigan-category-navigation__inner::-webkit-scrollbar { display: none; } .burnigan-category-navigation__link { flex: 0 0 auto; min-height: 38px; font-size: 9px; white-space: nowrap; } .burnigan-category-navigation__link::after { bottom: -19px; } } /* ========================================================= 11. BURNIGAN MOBILE CART + CHECKOUT STABILITY PATCH — v7 Keep this section LAST. ========================================================= */ body.woocommerce-cart .woocommerce-Price-amount, body.woocommerce-checkout .woocommerce-Price-amount, body.woocommerce-cart .amount, body.woocommerce-checkout .amount { display: inline-block !important; white-space: nowrap !important; word-break: keep-all !important; overflow-wrap: normal !important; } body.woocommerce-checkout #order_review table.shop_table th, body.woocommerce-checkout #order_review table.shop_table td { word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 96px !important; min-width: 96px !important; text-align: right !important; white-space: nowrap !important; } body.woocommerce-checkout #order_review table.shop_table th:first-child, body.woocommerce-checkout #order_review table.shop_table td:first-child { width: auto !important; min-width: 0 !important; padding-right: 18px !important; } body.woocommerce-checkout #order_review table.shop_table tr.woocommerce-shipping-totals th, body.woocommerce-checkout #order_review table.shop_table tr.woocommerce-shipping-totals td { display: block !important; width: 100% !important; min-width: 0 !important; text-align: left !important; } body.woocommerce-checkout #order_review ul#shipping_method { width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } body.woocommerce-checkout #order_review ul#shipping_method li { display: grid !important; grid-template-columns: 20px minmax(0, 1fr) !important; gap: 10px !important; align-items: start !important; width: 100% !important; margin: 0 0 12px !important; } @media (max-width: 700px) { body.woocommerce-cart #main > .ct-container, body.woocommerce-cart #main > .ct-container-full, body.woocommerce-checkout #main > .ct-container, body.woocommerce-checkout #main > .ct-container-full { width: 100% !important; max-width: none !important; padding-left: 14px !important; padding-right: 14px !important; box-sizing: border-box !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form, body.woocommerce-cart #main .woocommerce-cart-form, body.woocommerce-cart #main .cart_totals { width: 100% !important; max-width: none !important; min-width: 0 !important; } body.woocommerce-cart #main table.shop_table tr.cart_item { grid-template-columns: 96px minmax(0, 1fr) !important; column-gap: 14px !important; row-gap: 10px !important; padding: 14px !important; } body.woocommerce-cart #main td.product-thumbnail, body.woocommerce-cart #main td.product-thumbnail a, body.woocommerce-cart #main td.product-thumbnail img { width: 96px !important; min-width: 96px !important; max-width: 96px !important; } body.woocommerce-cart #main td.product-thumbnail img { height: 120px !important; } body.woocommerce-cart #main td.product-name { padding-right: 34px !important; } body.woocommerce-cart #main td.product-name a { display: block !important; font-size: 15px !important; line-height: 1.35 !important; word-break: normal !important; overflow-wrap: break-word !important; } body.woocommerce-cart #main td.product-name .product-mobile-actions, body.woocommerce-cart #main td.product-name .ct-cart-item-actions { display: none !important; } body.woocommerce-cart #main td.product-remove { top: 10px !important; right: 10px !important; z-index: 5 !important; } body.woocommerce-cart #main td.product-remove a.remove { width: 28px !important; height: 28px !important; background: #fff !important; } body.woocommerce-cart #main td.product-price { display: none !important; } body.woocommerce-cart #main td.product-quantity, body.woocommerce-cart #main td.product-subtotal { grid-column: 2 !important; } body.woocommerce-cart #main td.product-subtotal { text-align: right !important; font-size: 17px !important; font-weight: 800 !important; white-space: nowrap !important; } body.woocommerce-cart #main .quantity { width: 150px !important; max-width: 100% !important; height: 48px !important; } body.woocommerce-cart #main .cart_totals { margin-top: 34px !important; padding: 24px 18px !important; } body.woocommerce-checkout form.checkout.woocommerce-checkout, body.woocommerce-checkout form.checkout #customer_details, body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review { display: block !important; width: 100% !important; min-width: 0 !important; max-width: none !important; box-sizing: border-box !important; } body.woocommerce-checkout form.checkout #order_review_heading { margin-top: 42px !important; padding-left: 0 !important; padding-right: 0 !important; } body.woocommerce-checkout form.checkout #order_review { padding: 20px 16px !important; overflow: visible !important; } body.woocommerce-checkout #order_review table.shop_table { width: 100% !important; min-width: 0 !important; table-layout: fixed !important; } body.woocommerce-checkout #order_review table.shop_table th, body.woocommerce-checkout #order_review table.shop_table td { padding-left: 0 !important; padding-right: 0 !important; font-size: 15px !important; line-height: 1.5 !important; } body.woocommerce-checkout #order_review table.shop_table th:first-child, body.woocommerce-checkout #order_review table.shop_table td:first-child { width: auto !important; padding-right: 14px !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 82px !important; min-width: 82px !important; } body.woocommerce-checkout #order_review .product-name { word-break: normal !important; overflow-wrap: break-word !important; } body.woocommerce-checkout #order_review .product-total, body.woocommerce-checkout #order_review .cart-subtotal td, body.woocommerce-checkout #order_review .order-total td { white-space: nowrap !important; } } /* ========================================================= 12. PRODUCTION MOBILE CART REBUILD — v8 Keep this section at the absolute end of the stylesheet. Architecture: - The remove control is a real CSS Grid item, not an absolutely positioned overlay. - Thumbnail, information, quantity and subtotal each have an explicit grid location. - Blocksy's duplicate mobile action group remains hidden. - Prices and currency symbols cannot split across lines. ========================================================= */ @media (max-width: 700px) { /* Main mobile cart wrapper */ body.woocommerce-cart #main .ct-woocommerce-cart-form { display: block !important; width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; } body.woocommerce-cart #main .woocommerce-cart-form { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 0 36px !important; } /* WooCommerce table becomes a clean list of product cards */ body.woocommerce-cart #main table.shop_table, body.woocommerce-cart #main table.shop_table tbody { display: block !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; } body.woocommerce-cart #main table.shop_table thead { display: none !important; } /* * Three-column card: * 96px image | flexible information | 34px remove control */ body.woocommerce-cart #main table.shop_table tr.cart_item { position: relative !important; display: grid !important; grid-template-columns: 96px minmax(0, 1fr) 34px !important; grid-template-rows: auto auto auto !important; column-gap: 14px !important; row-gap: 12px !important; align-items: start !important; width: 100% !important; min-width: 0 !important; margin: 0 0 18px !important; padding: 16px !important; border: 1px solid var(--burnigan-border) !important; background: var(--burnigan-white) !important; box-sizing: border-box !important; } body.woocommerce-cart #main table.shop_table tr.cart_item > td { display: block !important; width: auto !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } /* Product image */ body.woocommerce-cart #main tr.cart_item > td.product-thumbnail { grid-column: 1 !important; grid-row: 1 / span 3 !important; align-self: stretch !important; width: 96px !important; min-width: 96px !important; max-width: 96px !important; } body.woocommerce-cart #main tr.cart_item > td.product-thumbnail a, body.woocommerce-cart #main tr.cart_item > td.product-thumbnail img { display: block !important; width: 96px !important; min-width: 96px !important; max-width: 96px !important; } body.woocommerce-cart #main tr.cart_item > td.product-thumbnail img { height: 122px !important; margin: 0 !important; object-fit: cover !important; object-position: center !important; border-radius: 0 !important; } /* Product title and variation details */ body.woocommerce-cart #main tr.cart_item > td.product-name { grid-column: 2 !important; grid-row: 1 !important; align-self: start !important; padding: 0 !important; } body.woocommerce-cart #main tr.cart_item > td.product-name > a { display: block !important; margin: 0 !important; padding: 0 !important; color: var(--burnigan-black) !important; font-size: 15px !important; font-weight: 800 !important; line-height: 1.32 !important; letter-spacing: -0.01em !important; word-break: normal !important; overflow-wrap: break-word !important; hyphens: none !important; } body.woocommerce-cart #main tr.cart_item > td.product-name :is(dl.variation, .variation) { display: block !important; margin: 10px 0 0 !important; color: #666660 !important; font-size: 12px !important; line-height: 1.45 !important; } body.woocommerce-cart #main tr.cart_item > td.product-name dl.variation dt, body.woocommerce-cart #main tr.cart_item > td.product-name dl.variation dd { display: inline !important; float: none !important; margin: 0 !important; padding: 0 !important; } body.woocommerce-cart #main tr.cart_item > td.product-name dl.variation dd::after { content: ""; display: block; } /* Hide Blocksy's duplicate mobile actions */ body.woocommerce-cart #main tr.cart_item > td.product-name :is( .product-mobile-actions, .ct-cart-item-actions ) { display: none !important; } /* * Remove button is now a normal grid item. * No absolute positioning and therefore no title overlap. */ body.woocommerce-cart #main tr.cart_item > td.product-remove { position: static !important; inset: auto !important; grid-column: 3 !important; grid-row: 1 !important; justify-self: end !important; align-self: start !important; display: block !important; width: 34px !important; min-width: 34px !important; max-width: 34px !important; height: 34px !important; z-index: auto !important; } body.woocommerce-cart #main tr.cart_item > td.product-remove a.remove { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; min-width: 34px !important; height: 34px !important; margin: 0 !important; padding: 0 !important; border: 1px solid rgba(8, 8, 8, 0.22) !important; border-radius: 0 !important; background: var(--burnigan-white) !important; color: var(--burnigan-black) !important; font-size: 17px !important; line-height: 1 !important; box-sizing: border-box !important; } body.woocommerce-cart #main tr.cart_item > td.product-remove a.remove:hover, body.woocommerce-cart #main tr.cart_item > td.product-remove a.remove:focus-visible { border-color: var(--burnigan-black) !important; background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; } /* Unit price is redundant in the mobile card */ body.woocommerce-cart #main tr.cart_item > td.product-price { display: none !important; } /* Quantity */ body.woocommerce-cart #main tr.cart_item > td.product-quantity { grid-column: 2 / span 2 !important; grid-row: 2 !important; align-self: center !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity { display: flex !important; align-items: center !important; justify-content: space-between !important; width: 150px !important; min-width: 0 !important; max-width: 100% !important; height: 46px !important; margin: 0 !important; border: 1px solid rgba(8, 8, 8, 0.3) !important; background: transparent !important; box-sizing: border-box !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity input.qty { width: 48px !important; min-width: 0 !important; height: 44px !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: center !important; font-size: 15px !important; font-weight: 700 !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { width: 44px !important; min-width: 44px !important; height: 44px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--burnigan-black) !important; } /* Line subtotal */ body.woocommerce-cart #main tr.cart_item > td.product-subtotal { grid-column: 2 / span 2 !important; grid-row: 3 !important; justify-self: stretch !important; padding-top: 2px !important; text-align: right !important; color: var(--burnigan-black) !important; font-size: 20px !important; font-weight: 900 !important; line-height: 1.2 !important; white-space: nowrap !important; } body.woocommerce-cart #main tr.cart_item > td.product-subtotal :is( .amount, .woocommerce-Price-amount ) { display: inline-block !important; white-space: nowrap !important; word-break: keep-all !important; overflow-wrap: normal !important; } /* Coupon and update-cart row */ body.woocommerce-cart #main table.shop_table tr:not(.cart_item) { display: block !important; width: 100% !important; } body.woocommerce-cart #main td.actions { display: block !important; width: 100% !important; margin: 12px 0 0 !important; padding: 0 !important; } body.woocommerce-cart #main td.actions .coupon { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; width: 100% !important; margin: 0 !important; float: none !important; } body.woocommerce-cart #main td.actions .coupon input.input-text, body.woocommerce-cart #main td.actions .coupon button, body.woocommerce-cart #main td.actions button[name="update_cart"] { width: 100% !important; min-width: 0 !important; min-height: 52px !important; margin: 0 !important; float: none !important; box-sizing: border-box !important; } body.woocommerce-cart #main td.actions button[name="update_cart"] { margin-top: 10px !important; } /* Cart totals */ body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { position: static !important; display: block !important; width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 38px 0 0 !important; padding: 24px 18px !important; float: none !important; box-sizing: border-box !important; } body.woocommerce-cart #main .cart_totals h2 { margin-bottom: 22px !important; font-size: 36px !important; line-height: 0.96 !important; } body.woocommerce-cart #main .cart_totals table { width: 100% !important; table-layout: auto !important; } body.woocommerce-cart #main .cart_totals table th { width: 42% !important; min-width: 0 !important; padding-right: 12px !important; } body.woocommerce-cart #main .cart_totals table td { width: 58% !important; min-width: 0 !important; text-align: right !important; } } /* Extra-narrow phones */ @media (max-width: 380px) { body.woocommerce-cart #main table.shop_table tr.cart_item { grid-template-columns: 84px minmax(0, 1fr) 32px !important; column-gap: 11px !important; padding: 13px !important; } body.woocommerce-cart #main tr.cart_item > td.product-thumbnail, body.woocommerce-cart #main tr.cart_item > td.product-thumbnail a, body.woocommerce-cart #main tr.cart_item > td.product-thumbnail img { width: 84px !important; min-width: 84px !important; max-width: 84px !important; } body.woocommerce-cart #main tr.cart_item > td.product-thumbnail img { height: 108px !important; } body.woocommerce-cart #main tr.cart_item > td.product-name > a { font-size: 14px !important; } body.woocommerce-cart #main tr.cart_item > td.product-remove, body.woocommerce-cart #main tr.cart_item > td.product-remove a.remove { width: 32px !important; min-width: 32px !important; height: 32px !important; } } /* ========================================================= 13. PRODUCTION CART QUANTITY SYSTEM — v9 Keep this section LAST. Goals: - Perfect vertical alignment of minus, value and plus - Consistent desktop, tablet and mobile dimensions - No inherited WooCommerce input padding or line-height - Compatible with Blocksy quantity controls ========================================================= */ /* ---------- Universal cart quantity reset ---------- */ body.woocommerce-cart #main .quantity { position: relative !important; display: grid !important; grid-template-columns: 42px minmax(44px, 1fr) 42px !important; align-items: stretch !important; justify-content: stretch !important; width: 136px !important; min-width: 136px !important; max-width: 136px !important; height: 46px !important; min-height: 46px !important; margin: 0 !important; padding: 0 !important; border: 1px solid rgba(8, 8, 8, 0.30) !important; border-radius: 0 !important; background: var(--burnigan-white) !important; box-shadow: none !important; box-sizing: border-box !important; overflow: hidden !important; } /* Quantity number */ body.woocommerce-cart #main .quantity input.qty { grid-column: 2 !important; grid-row: 1 !important; align-self: stretch !important; justify-self: stretch !important; display: block !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: 44px !important; min-height: 44px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; outline: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 15px !important; font-weight: 800 !important; line-height: 44px !important; text-align: center !important; text-indent: 0 !important; appearance: textfield !important; -moz-appearance: textfield !important; box-sizing: border-box !important; } /* Hide native browser number arrows */ body.woocommerce-cart #main .quantity input.qty::-webkit-inner-spin-button, body.woocommerce-cart #main .quantity input.qty::-webkit-outer-spin-button { margin: 0 !important; appearance: none !important; -webkit-appearance: none !important; } /* Blocksy/WooCommerce plus and minus controls */ body.woocommerce-cart #main .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { position: static !important; inset: auto !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; align-self: stretch !important; justify-self: stretch !important; width: 42px !important; min-width: 42px !important; max-width: 42px !important; height: 44px !important; min-height: 44px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 20px !important; font-weight: 400 !important; line-height: 1 !important; text-align: center !important; transform: none !important; cursor: pointer !important; box-sizing: border-box !important; } /* Force minus to left and plus to right */ body.woocommerce-cart #main .quantity :is( .ct-decrease, .minus ) { grid-column: 1 !important; grid-row: 1 !important; border-right: 1px solid rgba(8, 8, 8, 0.12) !important; } body.woocommerce-cart #main .quantity :is( .ct-increase, .plus ) { grid-column: 3 !important; grid-row: 1 !important; border-left: 1px solid rgba(8, 8, 8, 0.12) !important; } body.woocommerce-cart #main .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ):hover, body.woocommerce-cart #main .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ):focus-visible { background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; transform: none !important; } /* Prevent pseudo-elements from shifting alignment */ body.woocommerce-cart #main .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button )::before, body.woocommerce-cart #main .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button )::after { line-height: 1 !important; transform: none !important; } /* ---------- Desktop cart refinements ---------- */ @media (min-width: 1121px) { body.woocommerce-cart #main td.product-quantity { width: 152px !important; min-width: 152px !important; } body.woocommerce-cart #main td.product-subtotal { text-align: right !important; } } /* ---------- Tablet cart refinements ---------- */ @media (min-width: 701px) and (max-width: 1120px) { body.woocommerce-cart #main .quantity { width: 132px !important; min-width: 132px !important; max-width: 132px !important; grid-template-columns: 40px minmax(42px, 1fr) 40px !important; } body.woocommerce-cart #main .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { width: 40px !important; min-width: 40px !important; max-width: 40px !important; } } /* ---------- Mobile cart refinements ---------- */ @media (max-width: 700px) { body.woocommerce-cart #main tr.cart_item > td.product-quantity { display: flex !important; align-items: center !important; justify-content: flex-start !important; min-height: 46px !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity { grid-template-columns: 44px minmax(48px, 1fr) 44px !important; width: 160px !important; min-width: 160px !important; max-width: 160px !important; height: 48px !important; min-height: 48px !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity input.qty { height: 46px !important; min-height: 46px !important; font-size: 16px !important; line-height: 46px !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 46px !important; min-height: 46px !important; font-size: 21px !important; } /* Keep price visually connected to quantity */ body.woocommerce-cart #main tr.cart_item > td.product-subtotal { margin-top: 2px !important; padding-top: 0 !important; font-size: 21px !important; line-height: 1.15 !important; } /* Cleaner coupon and action controls */ body.woocommerce-cart #main td.actions .coupon input.input-text { height: 54px !important; min-height: 54px !important; padding: 0 16px !important; font-size: 15px !important; } body.woocommerce-cart #main td.actions .coupon button, body.woocommerce-cart #main td.actions button[name="update_cart"] { height: 54px !important; min-height: 54px !important; } } /* Extra-small mobile screens */ @media (max-width: 380px) { body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity { grid-template-columns: 40px minmax(44px, 1fr) 40px !important; width: 144px !important; min-width: 144px !important; max-width: 144px !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { width: 40px !important; min-width: 40px !important; max-width: 40px !important; } } /* ========================================================= 14. PRODUCTION CHECKOUT ORDER REVIEW — v10 Keep this section LAST. Fixes: - "Your order" card alignment on desktop, tablet and mobile - Product and subtotal columns - Shipping method layout and long labels - Payment method box alignment - Consistent internal spacing and borders - Prevents prices and currency symbols from wrapping ========================================================= */ /* ---------- Shared order-review foundation ---------- */ body.woocommerce-checkout #order_review { width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 30px !important; border: 1px solid var(--burnigan-black) !important; border-radius: 0 !important; background: var(--burnigan-white) !important; box-shadow: none !important; box-sizing: border-box !important; overflow: hidden !important; } body.woocommerce-checkout #order_review_heading { width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 0 18px !important; box-sizing: border-box !important; } /* Order table */ body.woocommerce-checkout #order_review table.shop_table { width: 100% !important; min-width: 0 !important; margin: 0 0 26px !important; border: 0 !important; border-collapse: collapse !important; table-layout: fixed !important; background: transparent !important; } body.woocommerce-checkout #order_review table.shop_table thead, body.woocommerce-checkout #order_review table.shop_table tbody, body.woocommerce-checkout #order_review table.shop_table tfoot { width: 100% !important; } body.woocommerce-checkout #order_review table.shop_table tr { width: 100% !important; } body.woocommerce-checkout #order_review table.shop_table th, body.woocommerce-checkout #order_review table.shop_table td { min-width: 0 !important; margin: 0 !important; padding: 16px 0 !important; border: 0 !important; border-bottom: 1px dashed rgba(8, 8, 8, 0.13) !important; background: transparent !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; line-height: 1.5 !important; vertical-align: top !important; word-break: normal !important; overflow-wrap: break-word !important; hyphens: none !important; box-sizing: border-box !important; } /* Product column */ body.woocommerce-checkout #order_review table.shop_table th:first-child, body.woocommerce-checkout #order_review table.shop_table td:first-child { width: auto !important; min-width: 0 !important; padding-right: 22px !important; text-align: left !important; } /* Price column */ body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 118px !important; min-width: 118px !important; padding-left: 12px !important; text-align: right !important; white-space: nowrap !important; } /* Header row */ body.woocommerce-checkout #order_review table.shop_table thead th { padding-top: 0 !important; padding-bottom: 18px !important; border-bottom: 1px solid var(--burnigan-border) !important; color: var(--burnigan-black) !important; font-size: 13px !important; font-weight: 900 !important; letter-spacing: 0.02em !important; text-transform: none !important; } /* Product line */ body.woocommerce-checkout #order_review td.product-name { color: #3f4e63 !important; font-size: 14px !important; font-weight: 500 !important; } body.woocommerce-checkout #order_review td.product-name strong.product-quantity { color: var(--burnigan-black) !important; font-weight: 900 !important; white-space: nowrap !important; } body.woocommerce-checkout #order_review td.product-name dl.variation { display: block !important; margin: 8px 0 0 !important; color: #68717e !important; font-size: 12px !important; line-height: 1.45 !important; } body.woocommerce-checkout #order_review td.product-name dl.variation dt, body.woocommerce-checkout #order_review td.product-name dl.variation dd { display: inline !important; float: none !important; margin: 0 !important; padding: 0 !important; } body.woocommerce-checkout #order_review td.product-name dl.variation dd::after { content: ""; display: block; } /* Totals */ body.woocommerce-checkout #order_review tfoot th { color: #3f4e63 !important; font-size: 13px !important; font-weight: 800 !important; } body.woocommerce-checkout #order_review tfoot td { color: #3f4e63 !important; font-size: 14px !important; font-weight: 700 !important; } body.woocommerce-checkout #order_review tr.order-total th, body.woocommerce-checkout #order_review tr.order-total td { padding-top: 20px !important; border-bottom: 0 !important; color: var(--burnigan-black) !important; font-size: 17px !important; font-weight: 900 !important; } body.woocommerce-checkout #order_review :is( .amount, .woocommerce-Price-amount, .woocommerce-Price-currencySymbol ) { white-space: nowrap !important; word-break: keep-all !important; overflow-wrap: normal !important; } /* ---------- Shipping row ---------- */ body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals { display: table-row !important; } body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals > th { width: 100% !important; padding: 20px 0 10px !important; border-bottom: 0 !important; text-align: left !important; } body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals > td { width: 100% !important; padding: 0 0 18px !important; border-bottom: 1px dashed rgba(8, 8, 8, 0.13) !important; text-align: left !important; white-space: normal !important; } /* Make the shipping title and methods full-width clean blocks */ body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals { display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; } body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals > th, body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals > td { display: block !important; width: 100% !important; min-width: 0 !important; } /* Shipping methods */ body.woocommerce-checkout #order_review ul#shipping_method { display: grid !important; gap: 12px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } body.woocommerce-checkout #order_review ul#shipping_method li { display: grid !important; grid-template-columns: 20px minmax(0, 1fr) !important; gap: 10px !important; align-items: start !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } body.woocommerce-checkout #order_review ul#shipping_method input[type="radio"] { width: 18px !important; height: 18px !important; margin: 3px 0 0 !important; accent-color: var(--burnigan-black) !important; } body.woocommerce-checkout #order_review ul#shipping_method label { display: block !important; min-width: 0 !important; margin: 0 !important; color: #3f4e63 !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.45 !important; word-break: normal !important; overflow-wrap: break-word !important; white-space: normal !important; } /* ---------- Payment section ---------- */ body.woocommerce-checkout #payment { width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-sizing: border-box !important; } body.woocommerce-checkout #payment ul.payment_methods { width: 100% !important; margin: 0 0 22px !important; padding: 0 !important; border: 1px solid var(--burnigan-border) !important; border-radius: 0 !important; background: var(--burnigan-white) !important; list-style: none !important; box-sizing: border-box !important; } body.woocommerce-checkout #payment ul.payment_methods > li { width: 100% !important; margin: 0 !important; padding: 18px !important; border-bottom: 1px solid var(--burnigan-border) !important; box-sizing: border-box !important; } body.woocommerce-checkout #payment ul.payment_methods > li:last-child { border-bottom: 0 !important; } body.woocommerce-checkout #payment ul.payment_methods li > input[type="radio"] { width: 18px !important; height: 18px !important; margin: 2px 10px 0 0 !important; vertical-align: top !important; accent-color: var(--burnigan-black) !important; } body.woocommerce-checkout #payment ul.payment_methods li > label { display: inline !important; margin: 0 !important; color: #3f4e63 !important; font-size: 15px !important; font-weight: 800 !important; line-height: 1.4 !important; } body.woocommerce-checkout #payment .payment_box { position: relative !important; width: calc(100% + 36px) !important; max-width: none !important; margin: 18px -18px -18px !important; padding: 18px !important; border-top: 1px solid var(--burnigan-border) !important; border-radius: 0 !important; background: #fafaf8 !important; color: #3f4e63 !important; box-sizing: border-box !important; } body.woocommerce-checkout #payment .payment_box::before { display: none !important; content: none !important; } body.woocommerce-checkout #payment .payment_box p { margin: 0 !important; color: #3f4e63 !important; font-size: 13px !important; line-height: 1.6 !important; } /* Terms and privacy */ body.woocommerce-checkout #payment .place-order { width: 100% !important; margin: 0 !important; padding: 0 !important; } body.woocommerce-checkout #payment .woocommerce-privacy-policy-text { margin: 0 0 18px !important; color: #68717e !important; font-size: 12px !important; line-height: 1.6 !important; } body.woocommerce-checkout #place_order { width: 100% !important; min-height: 54px !important; margin: 0 !important; } /* ---------- Desktop layout ---------- */ @media (min-width: 1021px) { body.woocommerce-checkout form.checkout.woocommerce-checkout { grid-template-columns: minmax(0, 680px) 420px !important; gap: 0 44px !important; } body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review { width: 420px !important; min-width: 420px !important; max-width: 420px !important; } } /* ---------- Tablet layout ---------- */ @media (min-width: 601px) and (max-width: 1020px) { body.woocommerce-checkout form.checkout.woocommerce-checkout { display: block !important; width: 100% !important; max-width: 760px !important; margin: 0 auto !important; } body.woocommerce-checkout form.checkout #order_review_heading { width: 100% !important; margin-top: 48px !important; } body.woocommerce-checkout form.checkout #order_review { width: 100% !important; min-width: 0 !important; max-width: none !important; padding: 28px !important; } } /* ---------- Mobile layout ---------- */ @media (max-width: 600px) { body.woocommerce-checkout form.checkout #order_review_heading { width: 100% !important; margin-top: 42px !important; padding-bottom: 14px !important; } body.woocommerce-checkout form.checkout #order_review { width: 100% !important; min-width: 0 !important; max-width: none !important; padding: 22px 18px !important; overflow: hidden !important; } body.woocommerce-checkout #order_review table.shop_table { margin-bottom: 22px !important; } body.woocommerce-checkout #order_review table.shop_table th, body.woocommerce-checkout #order_review table.shop_table td { padding-top: 14px !important; padding-bottom: 14px !important; } body.woocommerce-checkout #order_review table.shop_table th:first-child, body.woocommerce-checkout #order_review table.shop_table td:first-child { padding-right: 14px !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 106px !important; min-width: 106px !important; padding-left: 8px !important; } body.woocommerce-checkout #order_review table.shop_table thead th { font-size: 12px !important; } body.woocommerce-checkout #order_review td.product-name { font-size: 13px !important; line-height: 1.48 !important; } body.woocommerce-checkout #order_review ul#shipping_method label { font-size: 13px !important; } body.woocommerce-checkout #payment ul.payment_methods > li { padding: 16px !important; } body.woocommerce-checkout #payment .payment_box { width: calc(100% + 32px) !important; margin: 16px -16px -16px !important; padding: 16px !important; } } /* Extra narrow phones */ @media (max-width: 380px) { body.woocommerce-checkout form.checkout #order_review { padding: 18px 14px !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 94px !important; min-width: 94px !important; } body.woocommerce-checkout #order_review td.product-name { font-size: 12px !important; } } /* ========================================================= 15. DESKTOP CHECKOUT PROPORTIONS + ALIGNMENT — v11 Keep this section LAST. Fixes: - Wider and better-proportioned Your Order column - Removes the cramped "box inside a box" appearance - Aligns heading, order table, shipping and payment panels - Improves desktop/tablet spacing without changing mobile ========================================================= */ /* Full checkout canvas */ body.woocommerce-checkout #main > .ct-container, body.woocommerce-checkout #main > .ct-container-full { width: calc(100% - 48px) !important; max-width: 1280px !important; margin-inline: auto !important; } /* Remove unnecessary wrapper borders around the order column */ body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review { box-sizing: border-box !important; } body.woocommerce-checkout #order_review_heading { padding-left: 0 !important; padding-right: 0 !important; text-align: left !important; } /* One clean order card */ body.woocommerce-checkout #order_review { border: 1px solid rgba(8, 8, 8, 0.18) !important; background: #ffffff !important; padding: 32px !important; box-shadow: none !important; } /* Remove nested visual framing from payment section */ body.woocommerce-checkout #payment ul.payment_methods { border-color: rgba(8, 8, 8, 0.16) !important; } body.woocommerce-checkout #payment .payment_box { border-top-color: rgba(8, 8, 8, 0.12) !important; background: #f8f8f5 !important; } /* Better radio appearance */ body.woocommerce-checkout #order_review input[type="radio"], body.woocommerce-checkout #payment input[type="radio"] { appearance: none !important; -webkit-appearance: none !important; width: 18px !important; height: 18px !important; min-width: 18px !important; margin: 2px 10px 0 0 !important; border: 1px solid #bfc5cc !important; border-radius: 50% !important; background: #fff !important; box-shadow: inset 0 0 0 4px #fff !important; vertical-align: top !important; } body.woocommerce-checkout #order_review input[type="radio"]:checked, body.woocommerce-checkout #payment input[type="radio"]:checked { border-color: #080808 !important; background: #080808 !important; } /* Desktop */ @media (min-width: 1101px) { body.woocommerce-checkout form.checkout.woocommerce-checkout { grid-template-columns: minmax(0, 720px) 460px !important; grid-template-areas: "customer heading" "customer review" !important; justify-content: center !important; align-items: start !important; column-gap: 50px !important; row-gap: 0 !important; max-width: 1230px !important; margin: 0 auto !important; } body.woocommerce-checkout form.checkout #customer_details { width: 100% !important; max-width: 720px !important; } body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review { width: 460px !important; min-width: 460px !important; max-width: 460px !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 126px !important; min-width: 126px !important; } } /* Medium desktop / landscape tablet */ @media (min-width: 901px) and (max-width: 1100px) { body.woocommerce-checkout form.checkout.woocommerce-checkout { grid-template-columns: minmax(0, 1fr) 400px !important; column-gap: 36px !important; max-width: 1020px !important; } body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review { width: 400px !important; min-width: 400px !important; max-width: 400px !important; } body.woocommerce-checkout #order_review { padding: 28px !important; } } /* Tablet stacks cleanly */ @media (min-width: 601px) and (max-width: 900px) { body.woocommerce-checkout form.checkout.woocommerce-checkout { display: block !important; max-width: 760px !important; margin: 0 auto !important; } body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review { width: 100% !important; min-width: 0 !important; max-width: none !important; } body.woocommerce-checkout form.checkout #order_review_heading { margin-top: 48px !important; } } /* Mobile refinement */ @media (max-width: 600px) { body.woocommerce-checkout #main > .ct-container, body.woocommerce-checkout #main > .ct-container-full { width: 100% !important; padding-left: 14px !important; padding-right: 14px !important; } body.woocommerce-checkout #order_review { padding: 20px 16px !important; border-color: rgba(8, 8, 8, 0.18) !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 104px !important; min-width: 104px !important; } } /* ========================================================= 16. PREMIUM CHECKOUT ORDER CARD — v12 Keep this section LAST. Purpose: - Remove the default WooCommerce "box inside a box" look - Create a single premium order-summary card - Rebuild shipping/payment radios consistently - Improve desktop, tablet and mobile hierarchy ========================================================= */ /* ---------- Remove theme wrapper framing ---------- */ body.woocommerce-checkout :is( .woocommerce-checkout-review-order-container, .woocommerce-checkout-review-order-wrapper, .ct-order-review, .ct-checkout-order-review, .checkout-order-review ) { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } /* ---------- Order column heading ---------- */ body.woocommerce-checkout #order_review_heading { margin: 0 0 18px !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--burnigan-black) !important; font-size: clamp(34px, 3vw, 48px) !important; font-weight: 900 !important; line-height: 0.95 !important; letter-spacing: -0.045em !important; text-transform: uppercase !important; } /* ---------- Single premium order card ---------- */ body.woocommerce-checkout #order_review { width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 30px !important; border: 1px solid rgba(8, 8, 8, 0.14) !important; border-radius: 0 !important; background: #ffffff !important; box-shadow: 0 16px 45px rgba(8, 8, 8, 0.05) !important; overflow: visible !important; box-sizing: border-box !important; } /* Remove the old nested rectangle */ body.woocommerce-checkout #order_review > table.shop_table, body.woocommerce-checkout #order_review table.woocommerce-checkout-review-order-table { width: 100% !important; margin: 0 0 28px !important; padding: 0 !important; border: 0 !important; outline: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; border-collapse: collapse !important; table-layout: fixed !important; } /* ---------- Order table typography ---------- */ body.woocommerce-checkout #order_review table.shop_table th, body.woocommerce-checkout #order_review table.shop_table td { border: 0 !important; border-bottom: 1px solid rgba(8, 8, 8, 0.10) !important; background: transparent !important; box-shadow: none !important; } body.woocommerce-checkout #order_review table.shop_table thead th { padding: 0 0 16px !important; color: var(--burnigan-black) !important; font-size: 11px !important; font-weight: 900 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; } body.woocommerce-checkout #order_review table.shop_table th:first-child, body.woocommerce-checkout #order_review table.shop_table td:first-child { width: auto !important; min-width: 0 !important; padding-right: 18px !important; text-align: left !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 120px !important; min-width: 120px !important; padding-left: 12px !important; text-align: right !important; white-space: nowrap !important; } body.woocommerce-checkout #order_review td.product-name { padding-top: 18px !important; padding-bottom: 18px !important; color: #303030 !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.5 !important; } body.woocommerce-checkout #order_review td.product-total { padding-top: 18px !important; padding-bottom: 18px !important; color: var(--burnigan-black) !important; font-size: 14px !important; font-weight: 800 !important; } body.woocommerce-checkout #order_review td.product-name strong.product-quantity { display: inline-block !important; margin-left: 4px !important; color: var(--burnigan-black) !important; font-weight: 900 !important; } body.woocommerce-checkout #order_review td.product-name dl.variation { margin: 9px 0 0 !important; color: #777772 !important; font-size: 11px !important; line-height: 1.45 !important; } body.woocommerce-checkout #order_review tfoot th, body.woocommerce-checkout #order_review tfoot td { padding-top: 16px !important; padding-bottom: 16px !important; } body.woocommerce-checkout #order_review tfoot th { color: #444440 !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 0.02em !important; } body.woocommerce-checkout #order_review tfoot td { color: var(--burnigan-black) !important; font-size: 14px !important; font-weight: 800 !important; } body.woocommerce-checkout #order_review tr.order-total th, body.woocommerce-checkout #order_review tr.order-total td { padding-top: 22px !important; padding-bottom: 4px !important; border-bottom: 0 !important; color: var(--burnigan-black) !important; font-size: 19px !important; font-weight: 900 !important; } /* ---------- Premium shipping methods ---------- */ body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals { display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; } body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals > th, body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals > td { display: block !important; width: 100% !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; text-align: left !important; } body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals > th { padding-top: 18px !important; padding-bottom: 10px !important; border-bottom: 0 !important; color: var(--burnigan-black) !important; font-size: 12px !important; font-weight: 900 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; } body.woocommerce-checkout #order_review tr.woocommerce-shipping-totals > td { padding-top: 0 !important; padding-bottom: 18px !important; } body.woocommerce-checkout #order_review ul#shipping_method { display: grid !important; gap: 10px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; } body.woocommerce-checkout #order_review ul#shipping_method li { position: relative !important; display: block !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } /* Hide native shipping radio */ body.woocommerce-checkout #order_review ul#shipping_method input[type="radio"] { position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; opacity: 0 !important; pointer-events: none !important; } /* Shipping option card */ body.woocommerce-checkout #order_review ul#shipping_method label { position: relative !important; display: block !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 14px 14px 14px 46px !important; border: 1px solid rgba(8, 8, 8, 0.12) !important; background: #fafaf8 !important; color: #343434 !important; font-size: 13px !important; font-weight: 650 !important; line-height: 1.45 !important; cursor: pointer !important; box-sizing: border-box !important; } /* Shipping radio ring */ body.woocommerce-checkout #order_review ul#shipping_method label::before { content: "" !important; position: absolute !important; top: 50% !important; left: 16px !important; width: 17px !important; height: 17px !important; border: 1px solid #aeb3b8 !important; border-radius: 50% !important; background: #ffffff !important; transform: translateY(-50%) !important; box-sizing: border-box !important; } /* Shipping selected dot */ body.woocommerce-checkout #order_review ul#shipping_method input[type="radio"]:checked + label { border-color: var(--burnigan-black) !important; background: #ffffff !important; } body.woocommerce-checkout #order_review ul#shipping_method input[type="radio"]:checked + label::before { border-color: var(--burnigan-black) !important; box-shadow: inset 0 0 0 5px #ffffff !important; background: var(--burnigan-black) !important; } /* ---------- Premium payment method card ---------- */ body.woocommerce-checkout #payment { width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } body.woocommerce-checkout #payment ul.payment_methods { width: 100% !important; margin: 24px 0 22px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } body.woocommerce-checkout #payment ul.payment_methods > li { position: relative !important; display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; border: 1px solid rgba(8, 8, 8, 0.14) !important; background: #ffffff !important; box-sizing: border-box !important; } /* Hide native payment radio */ body.woocommerce-checkout #payment ul.payment_methods > li > input[type="radio"] { position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; opacity: 0 !important; pointer-events: none !important; } /* Payment label */ body.woocommerce-checkout #payment ul.payment_methods > li > label { position: relative !important; display: block !important; width: 100% !important; margin: 0 !important; padding: 18px 18px 18px 52px !important; color: var(--burnigan-black) !important; font-size: 14px !important; font-weight: 900 !important; line-height: 1.35 !important; cursor: pointer !important; box-sizing: border-box !important; } /* Payment radio ring */ body.woocommerce-checkout #payment ul.payment_methods > li > label::before { content: "" !important; position: absolute !important; top: 50% !important; left: 18px !important; width: 18px !important; height: 18px !important; border: 1px solid #aeb3b8 !important; border-radius: 50% !important; background: #ffffff !important; transform: translateY(-50%) !important; box-sizing: border-box !important; } body.woocommerce-checkout #payment ul.payment_methods > li > input[type="radio"]:checked + label::before { border-color: var(--burnigan-black) !important; background: var(--burnigan-black) !important; box-shadow: inset 0 0 0 5px #ffffff !important; } /* Payment description */ body.woocommerce-checkout #payment .payment_box { width: 100% !important; margin: 0 !important; padding: 16px 18px !important; border: 0 !important; border-top: 1px solid rgba(8, 8, 8, 0.10) !important; background: #f7f7f4 !important; color: #555550 !important; box-sizing: border-box !important; } body.woocommerce-checkout #payment .payment_box::before { display: none !important; content: none !important; } body.woocommerce-checkout #payment .payment_box p { margin: 0 !important; color: #555550 !important; font-size: 12px !important; line-height: 1.6 !important; } /* Privacy and order button */ body.woocommerce-checkout #payment .place-order { width: 100% !important; margin: 0 !important; padding: 0 !important; } body.woocommerce-checkout #payment .woocommerce-privacy-policy-text { margin: 0 0 18px !important; padding: 0 !important; color: #6d6d68 !important; font-size: 11px !important; line-height: 1.6 !important; } body.woocommerce-checkout #place_order { width: 100% !important; min-height: 56px !important; margin: 0 !important; background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; } body.woocommerce-checkout #place_order:hover, body.woocommerce-checkout #place_order:focus-visible { background: transparent !important; color: var(--burnigan-black) !important; } /* ---------- Desktop ---------- */ @media (min-width: 1101px) { body.woocommerce-checkout form.checkout.woocommerce-checkout { grid-template-columns: minmax(0, 720px) 470px !important; column-gap: 54px !important; max-width: 1244px !important; } body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review { width: 470px !important; min-width: 470px !important; max-width: 470px !important; } } /* ---------- Tablet ---------- */ @media (min-width: 701px) and (max-width: 1100px) { body.woocommerce-checkout form.checkout.woocommerce-checkout { display: block !important; max-width: 780px !important; margin: 0 auto !important; } body.woocommerce-checkout form.checkout #order_review_heading, body.woocommerce-checkout form.checkout #order_review { width: 100% !important; min-width: 0 !important; max-width: none !important; } body.woocommerce-checkout form.checkout #order_review_heading { margin-top: 50px !important; } } /* ---------- Mobile ---------- */ @media (max-width: 700px) { body.woocommerce-checkout #order_review { padding: 22px 16px !important; box-shadow: none !important; } body.woocommerce-checkout #order_review_heading { font-size: 36px !important; margin-bottom: 14px !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 104px !important; min-width: 104px !important; } body.woocommerce-checkout #order_review ul#shipping_method label { padding: 13px 12px 13px 44px !important; font-size: 12px !important; } body.woocommerce-checkout #payment ul.payment_methods > li > label { padding: 16px 14px 16px 48px !important; font-size: 13px !important; } body.woocommerce-checkout #payment .payment_box { padding: 14px !important; } } /* ---------- Very narrow phones ---------- */ @media (max-width: 380px) { body.woocommerce-checkout #order_review { padding: 18px 13px !important; } body.woocommerce-checkout #order_review table.shop_table th:last-child, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 92px !important; min-width: 92px !important; } } /* ========================================================= 17. FINAL MOBILE QUANTITY + WIDE CART TOTALS — v13 Keep this section LAST. Fixes: - Forces visual order to: minus | quantity | plus - Centers the quantity value vertically and horizontally - Adds fallback ordering for Blocksy markup variations - Makes Cart Totals wider on mobile - Improves mobile totals row spacing and readability ========================================================= */ @media (max-width: 700px) { /* ---------- QUANTITY: authoritative mobile layout ---------- */ body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: stretch !important; width: 160px !important; min-width: 160px !important; max-width: 160px !important; height: 48px !important; min-height: 48px !important; margin: 0 !important; padding: 0 !important; border: 1px solid rgba(8, 8, 8, 0.30) !important; background: #ffffff !important; overflow: hidden !important; box-sizing: border-box !important; } /* Quantity value must always be in the center */ body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity input.qty { order: 2 !important; flex: 1 1 auto !important; display: block !important; width: auto !important; min-width: 48px !important; max-width: none !important; height: 46px !important; min-height: 46px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--burnigan-black) !important; font-size: 16px !important; font-weight: 800 !important; line-height: 46px !important; text-align: center !important; text-indent: 0 !important; appearance: textfield !important; -webkit-appearance: none !important; -moz-appearance: textfield !important; box-sizing: border-box !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity input.qty::-webkit-inner-spin-button, body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity input.qty::-webkit-outer-spin-button { margin: 0 !important; appearance: none !important; -webkit-appearance: none !important; } /* Shared plus/minus control reset */ body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { position: static !important; inset: auto !important; flex: 0 0 44px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 46px !important; min-height: 46px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--burnigan-black) !important; font-size: 21px !important; font-weight: 400 !important; line-height: 1 !important; text-align: center !important; transform: none !important; box-sizing: border-box !important; } /* Correct semantic order */ body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-decrease, .minus ) { order: 1 !important; border-right: 1px solid rgba(8, 8, 8, 0.12) !important; border-left: 0 !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-increase, .plus ) { order: 3 !important; border-left: 1px solid rgba(8, 8, 8, 0.12) !important; border-right: 0 !important; } /* * Blocksy fallback: * On the current cart HTML the first generic button renders as plus * and the second as minus. These rules force the correct visual order * even if the semantic classes are absent or changed. */ body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity > button:first-of-type { order: 3 !important; border-left: 1px solid rgba(8, 8, 8, 0.12) !important; border-right: 0 !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity > button:nth-of-type(2) { order: 1 !important; border-right: 1px solid rgba(8, 8, 8, 0.12) !important; border-left: 0 !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ):hover, body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ):focus-visible { background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; transform: none !important; } /* ---------- CART TOTALS: wider premium mobile card ---------- */ body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { position: relative !important; left: 50% !important; transform: translateX(-50%) !important; width: calc(100vw - 20px) !important; min-width: 0 !important; max-width: none !important; margin: 42px 0 0 !important; padding: 26px 20px 28px !important; border: 1px solid var(--burnigan-black) !important; background: var(--burnigan-white) !important; box-sizing: border-box !important; } body.woocommerce-cart #main .cart_totals h2 { margin: 0 0 26px !important; font-size: clamp(34px, 10vw, 46px) !important; line-height: 0.95 !important; letter-spacing: -0.045em !important; } body.woocommerce-cart #main .cart_totals table { width: 100% !important; table-layout: auto !important; border-collapse: collapse !important; } body.woocommerce-cart #main .cart_totals table th, body.woocommerce-cart #main .cart_totals table td { padding-top: 16px !important; padding-bottom: 16px !important; vertical-align: top !important; } body.woocommerce-cart #main .cart_totals table th { width: 38% !important; min-width: 0 !important; padding-right: 14px !important; font-size: 11px !important; line-height: 1.45 !important; } body.woocommerce-cart #main .cart_totals table td { width: 62% !important; min-width: 0 !important; text-align: right !important; font-size: 15px !important; line-height: 1.45 !important; } body.woocommerce-cart #main .cart_totals tr.order-total th, body.woocommerce-cart #main .cart_totals tr.order-total td { padding-top: 20px !important; font-size: 18px !important; font-weight: 900 !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method { width: 100% !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method li { grid-template-columns: 18px minmax(0, 1fr) !important; width: 100% !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method label { width: 100% !important; min-width: 0 !important; text-align: left !important; font-size: 13px !important; overflow-wrap: break-word !important; } body.woocommerce-cart #main .wc-proceed-to-checkout .checkout-button { min-height: 56px !important; font-size: 11px !important; } } /* Extra-small phones */ @media (max-width: 380px) { body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity { width: 146px !important; min-width: 146px !important; max-width: 146px !important; } body.woocommerce-cart #main tr.cart_item > td.product-quantity .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { flex-basis: 40px !important; width: 40px !important; min-width: 40px !important; max-width: 40px !important; } body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { width: calc(100vw - 14px) !important; padding-left: 16px !important; padding-right: 16px !important; } } /* ========================================================= 18. PREMIUM CART TOTALS REBUILD — v14 Keep this section LAST. This section deliberately does NOT touch the quantity picker. It rebuilds only Cart Totals for desktop, tablet and mobile. ========================================================= */ /* ---------- Shared Cart Totals foundation ---------- */ body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { position: sticky !important; top: 90px !important; left: auto !important; right: auto !important; transform: none !important; display: block !important; width: 100% !important; min-width: 0 !important; max-width: 400px !important; margin: 0 !important; padding: 30px !important; border: 1px solid rgba(8, 8, 8, 0.18) !important; border-radius: 0 !important; background: var(--burnigan-white) !important; box-shadow: 0 14px 40px rgba(8, 8, 8, 0.045) !important; box-sizing: border-box !important; overflow: hidden !important; } /* Heading */ body.woocommerce-cart #main .cart_totals h2 { margin: 0 0 26px !important; padding: 0 !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: clamp(34px, 3.2vw, 44px) !important; font-weight: 900 !important; line-height: 0.96 !important; letter-spacing: -0.045em !important; text-transform: uppercase !important; white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; } /* Table reset */ body.woocommerce-cart #main .cart_totals table.shop_table { display: block !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-collapse: collapse !important; background: transparent !important; table-layout: auto !important; } body.woocommerce-cart #main .cart_totals table.shop_table tbody { display: block !important; width: 100% !important; } /* Standard total rows */ body.woocommerce-cart #main .cart_totals table.shop_table tr.cart-subtotal, body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 18px !important; align-items: center !important; width: 100% !important; margin: 0 !important; padding: 17px 0 !important; border: 0 !important; border-bottom: 1px solid rgba(8, 8, 8, 0.12) !important; background: transparent !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.cart-subtotal > th, body.woocommerce-cart #main .cart_totals table.shop_table tr.cart-subtotal > td, body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total > th, body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total > td { display: block !important; width: auto !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-sizing: border-box !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.cart-subtotal > th, body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total > th { color: #4f4f4a !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1.4 !important; letter-spacing: 0.10em !important; text-align: left !important; text-transform: uppercase !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.cart-subtotal > td, body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total > td { color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 15px !important; font-weight: 900 !important; line-height: 1.3 !important; text-align: right !important; white-space: nowrap !important; } /* Hide WooCommerce responsive duplicate data-title labels */ body.woocommerce-cart #main .cart_totals table.shop_table td::before { display: none !important; content: none !important; } /* ---------- Shipping section ---------- */ body.woocommerce-cart #main .cart_totals table.shop_table tr.woocommerce-shipping-totals { display: block !important; width: 100% !important; margin: 0 !important; padding: 22px 0 !important; border: 0 !important; border-bottom: 1px solid rgba(8, 8, 8, 0.12) !important; background: transparent !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.woocommerce-shipping-totals > th, body.woocommerce-cart #main .cart_totals table.shop_table tr.woocommerce-shipping-totals > td { display: block !important; width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; text-align: left !important; box-sizing: border-box !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.woocommerce-shipping-totals > th { margin-bottom: 13px !important; color: var(--burnigan-black) !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1.4 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; } /* Shipping choices */ body.woocommerce-cart #main .cart_totals ul#shipping_method { display: grid !important; gap: 9px !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method li { position: relative !important; display: block !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } /* Visually hide native radio while keeping it accessible */ body.woocommerce-cart #main .cart_totals ul#shipping_method input[type="radio"] { position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; opacity: 0 !important; pointer-events: none !important; } /* Premium shipping option card */ body.woocommerce-cart #main .cart_totals ul#shipping_method label { position: relative !important; display: block !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 13px 14px 13px 43px !important; border: 1px solid rgba(8, 8, 8, 0.12) !important; background: #fafaf8 !important; color: #30302d !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 650 !important; line-height: 1.42 !important; text-align: left !important; white-space: normal !important; word-break: normal !important; overflow-wrap: break-word !important; cursor: pointer !important; box-sizing: border-box !important; } /* Custom radio ring */ body.woocommerce-cart #main .cart_totals ul#shipping_method label::before { content: "" !important; position: absolute !important; top: 50% !important; left: 14px !important; width: 17px !important; height: 17px !important; border: 1px solid #b4b8bc !important; border-radius: 50% !important; background: #ffffff !important; transform: translateY(-50%) !important; box-sizing: border-box !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method input[type="radio"]:checked + label { border-color: var(--burnigan-black) !important; background: #ffffff !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method input[type="radio"]:checked + label::before { border-color: var(--burnigan-black) !important; background: var(--burnigan-black) !important; box-shadow: inset 0 0 0 4px #ffffff !important; } /* Shipping destination / update message */ body.woocommerce-cart #main .cart_totals :is( .woocommerce-shipping-destination, .woocommerce-shipping-calculator ) { margin: 13px 0 0 !important; padding: 0 !important; color: #72726d !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1.5 !important; text-align: left !important; } body.woocommerce-cart #main .cart_totals .shipping-calculator-button { color: var(--burnigan-black) !important; font-weight: 800 !important; text-decoration: underline !important; } /* Order total emphasis */ body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total { padding-top: 20px !important; padding-bottom: 20px !important; border-bottom: 0 !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total > th { color: var(--burnigan-black) !important; font-size: 12px !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total > td { font-size: 20px !important; } /* Checkout button */ body.woocommerce-cart #main .cart_totals .wc-proceed-to-checkout { width: 100% !important; margin: 8px 0 0 !important; padding: 0 !important; } body.woocommerce-cart #main .cart_totals .wc-proceed-to-checkout .checkout-button { width: 100% !important; min-height: 56px !important; margin: 0 !important; padding: 17px 18px !important; border: 1px solid var(--burnigan-black) !important; background: var(--burnigan-black) !important; color: var(--burnigan-white) !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; } body.woocommerce-cart #main .cart_totals .wc-proceed-to-checkout .checkout-button:hover, body.woocommerce-cart #main .cart_totals .wc-proceed-to-checkout .checkout-button:focus-visible { background: transparent !important; color: var(--burnigan-black) !important; } /* ---------- Desktop ---------- */ @media (min-width: 1121px) { body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { max-width: 400px !important; padding: 30px !important; } } /* ---------- Tablet ---------- */ @media (min-width: 701px) and (max-width: 1120px) { body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { position: static !important; width: min(100%, 660px) !important; min-width: 0 !important; max-width: 660px !important; margin: 0 auto !important; padding: 30px !important; } } /* ---------- Mobile ---------- */ @media (max-width: 700px) { body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { position: static !important; top: auto !important; left: auto !important; right: auto !important; transform: none !important; width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 38px 0 0 !important; padding: 24px 18px 22px !important; box-shadow: none !important; overflow: hidden !important; } body.woocommerce-cart #main .cart_totals h2 { margin-bottom: 22px !important; font-size: clamp(32px, 9vw, 40px) !important; line-height: 0.98 !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.cart-subtotal, body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total { grid-template-columns: minmax(0, 1fr) auto !important; gap: 14px !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.woocommerce-shipping-totals { padding-top: 20px !important; padding-bottom: 20px !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method label { padding: 13px 12px 13px 42px !important; font-size: 12px !important; } body.woocommerce-cart #main .cart_totals :is( .woocommerce-shipping-destination, .woocommerce-shipping-calculator ) { font-size: 10px !important; } body.woocommerce-cart #main .cart_totals table.shop_table tr.order-total > td { font-size: 19px !important; } } /* ---------- Extra-small phones ---------- */ @media (max-width: 380px) { body.woocommerce-cart #main .ct-woocommerce-cart-form .cart_totals { padding: 21px 14px 18px !important; } body.woocommerce-cart #main .cart_totals h2 { font-size: 31px !important; } body.woocommerce-cart #main .cart_totals ul#shipping_method label { padding-right: 10px !important; padding-left: 40px !important; } } /* ========================================================= 19. CHECKOUT LOGIN TOGGLE + REMEMBER ME — v15 Keep this section LAST. Fixes: - Removes the broken icon before "Returning customer?" - Rebuilds the checkout login notice - Corrects the stretched Remember Me checkbox - Keeps the layout clean on desktop, tablet and mobile ========================================================= */ /* ---------- Returning customer notice ---------- */ body.woocommerce-checkout .woocommerce-form-login-toggle { width: 100% !important; margin: 0 0 22px !important; padding: 0 !important; } body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info { position: relative !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 17px 20px !important; border: 1px solid rgba(8, 8, 8, 0.24) !important; border-radius: 0 !important; background: #ffffff !important; box-shadow: none !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1.45 !important; box-sizing: border-box !important; } body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info::before, body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info::after { display: none !important; content: none !important; } body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info .showlogin { flex: 0 0 auto !important; color: #080808 !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1.3 !important; letter-spacing: 0.08em !important; text-decoration: none !important; text-transform: uppercase !important; white-space: nowrap !important; border-bottom: 1px solid #080808 !important; } body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info .showlogin:hover, body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info .showlogin:focus-visible { opacity: 0.55 !important; } /* ---------- Open checkout login form ---------- */ body.woocommerce-checkout form.woocommerce-form-login { width: 100% !important; margin: 0 0 36px !important; padding: 24px !important; border: 1px solid rgba(8, 8, 8, 0.14) !important; border-radius: 0 !important; background: #ffffff !important; box-shadow: none !important; box-sizing: border-box !important; } body.woocommerce-checkout form.woocommerce-form-login > p:first-child { margin: 0 0 22px !important; color: #4f4f4a !important; font-size: 13px !important; line-height: 1.6 !important; } body.woocommerce-checkout form.woocommerce-form-login .form-row { margin-bottom: 18px !important; } body.woocommerce-checkout form.woocommerce-form-login .form-row-first, body.woocommerce-checkout form.woocommerce-form-login .form-row-last { width: calc(50% - 12px) !important; } body.woocommerce-checkout form.woocommerce-form-login .form-row-first { float: left !important; } body.woocommerce-checkout form.woocommerce-form-login .form-row-last { float: right !important; } body.woocommerce-checkout form.woocommerce-form-login .form-row::after { display: block; clear: both; content: ""; } body.woocommerce-checkout form.woocommerce-form-login label:not(.woocommerce-form-login__rememberme) { display: block !important; margin: 0 0 8px !important; color: #080808 !important; font-size: 10px !important; font-weight: 900 !important; line-height: 1.3 !important; letter-spacing: 0.10em !important; text-transform: uppercase !important; } body.woocommerce-checkout form.woocommerce-form-login input.input-text { width: 100% !important; min-height: 50px !important; padding: 0 14px !important; border: 1px solid rgba(8, 8, 8, 0.22) !important; border-radius: 0 !important; background: #ffffff !important; box-shadow: none !important; color: #080808 !important; font-size: 14px !important; box-sizing: border-box !important; } body.woocommerce-checkout form.woocommerce-form-login input.input-text:focus { border-color: #080808 !important; outline: none !important; } /* ---------- Remember Me ---------- */ body.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__rememberme, body.woocommerce-checkout form.woocommerce-form-login .woocommerce-form__label-for-checkbox { display: inline-flex !important; align-items: center !important; gap: 10px !important; width: auto !important; min-width: 0 !important; margin: 0 18px 0 0 !important; padding: 0 !important; color: #080808 !important; font-size: 10px !important; font-weight: 900 !important; line-height: 1.3 !important; letter-spacing: 0.10em !important; text-transform: uppercase !important; cursor: pointer !important; vertical-align: middle !important; } body.woocommerce-checkout form.woocommerce-form-login input[type="checkbox"], body.woocommerce-checkout form.woocommerce-form-login #rememberme { position: static !important; inset: auto !important; display: inline-block !important; flex: 0 0 18px !important; width: 18px !important; min-width: 18px !important; max-width: 18px !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; margin: 0 !important; padding: 0 !important; border: 1px solid #080808 !important; border-radius: 0 !important; background-color: #ffffff !important; background-position: center !important; background-repeat: no-repeat !important; background-size: 13px 13px !important; box-shadow: none !important; appearance: none !important; -webkit-appearance: none !important; cursor: pointer !important; transform: none !important; vertical-align: middle !important; box-sizing: border-box !important; } body.woocommerce-checkout form.woocommerce-form-login input[type="checkbox"]:checked, body.woocommerce-checkout form.woocommerce-form-login #rememberme:checked { background-color: #080808 !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.2' d='M3 8.5l3 3 7-7'/%3E%3C/svg%3E") !important; } body.woocommerce-checkout form.woocommerce-form-login input[type="checkbox"]:focus-visible, body.woocommerce-checkout form.woocommerce-form-login #rememberme:focus-visible { outline: 2px solid #080808 !important; outline-offset: 3px !important; } body.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__submit { min-width: 118px !important; min-height: 48px !important; margin: 0 !important; padding: 13px 22px !important; border: 1px solid #080808 !important; border-radius: 0 !important; background: #080808 !important; color: #ffffff !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; vertical-align: middle !important; } body.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__submit:hover, body.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__submit:focus-visible { background: #ffffff !important; color: #080808 !important; } body.woocommerce-checkout form.woocommerce-form-login .lost_password { clear: both !important; margin: 16px 0 0 !important; } body.woocommerce-checkout form.woocommerce-form-login .lost_password a { color: #080808 !important; font-size: 11px !important; font-weight: 700 !important; text-decoration: underline !important; text-underline-offset: 3px !important; } /* ---------- Tablet and mobile ---------- */ @media (max-width: 700px) { body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info { display: block !important; padding: 15px 16px !important; font-size: 12px !important; } body.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info .showlogin { display: inline-block !important; margin-top: 8px !important; font-size: 10px !important; white-space: normal !important; } body.woocommerce-checkout form.woocommerce-form-login { margin-bottom: 30px !important; padding: 18px 14px !important; } body.woocommerce-checkout form.woocommerce-form-login .form-row-first, body.woocommerce-checkout form.woocommerce-form-login .form-row-last { float: none !important; width: 100% !important; } body.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__rememberme, body.woocommerce-checkout form.woocommerce-form-login .woocommerce-form__label-for-checkbox { display: flex !important; width: fit-content !important; margin: 0 0 16px !important; } body.woocommerce-checkout form.woocommerce-form-login .woocommerce-form-login__submit { display: block !important; width: 100% !important; } body.woocommerce-checkout form.woocommerce-form-login .lost_password { margin-top: 14px !important; } } /* ========================================================= 20. CHECKOUT VALIDATION NOTICE — v16 Keep this section LAST. Fixes: - Makes checkout validation messages black - Keeps the notice readable on desktop and mobile - Prevents white links/text on a white background - Cleans the WooCommerce error-list presentation ========================================================= */ body.woocommerce-checkout :is( .woocommerce-NoticeGroup, .woocommerce-NoticeGroup-checkout, .woocommerce-notices-wrapper ) { color: #080808 !important; } body.woocommerce-checkout :is( .woocommerce-error, .woocommerce-message, .woocommerce-info ) { color: #080808 !important; } body.woocommerce-checkout .woocommerce-error { position: relative !important; width: 100% !important; margin: 0 0 30px !important; padding: 20px 22px 20px 48px !important; border: 1px solid #c62828 !important; border-radius: 0 !important; background: #ffffff !important; box-shadow: none !important; color: #080808 !important; box-sizing: border-box !important; } body.woocommerce-checkout .woocommerce-error::before { position: absolute !important; top: 20px !important; left: 20px !important; display: block !important; margin: 0 !important; color: #c62828 !important; font-size: 16px !important; line-height: 1 !important; } body.woocommerce-checkout .woocommerce-error::after { display: none !important; content: none !important; } body.woocommerce-checkout .woocommerce-error li { margin: 0 0 7px !important; padding: 0 !important; color: #080808 !important; background: transparent !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 650 !important; line-height: 1.5 !important; list-style: none !important; } body.woocommerce-checkout .woocommerce-error li:last-child { margin-bottom: 0 !important; } body.woocommerce-checkout .woocommerce-error :is( a, strong, span, p ) { color: #080808 !important; } body.woocommerce-checkout .woocommerce-error a { font-weight: 800 !important; text-decoration: underline !important; text-underline-offset: 3px !important; } body.woocommerce-checkout .woocommerce-error a:hover, body.woocommerce-checkout .woocommerce-error a:focus-visible { color: #080808 !important; opacity: 0.65 !important; } /* Field-level validation messages below inputs */ body.woocommerce-checkout :is( .woocommerce-invalid-required-field, .woocommerce-invalid ) :is( label, .woocommerce-error, .error, .required ) { color: #080808 !important; } body.woocommerce-checkout .form-row.woocommerce-invalid input.input-text, body.woocommerce-checkout .form-row.woocommerce-invalid select, body.woocommerce-checkout .form-row.woocommerce-invalid textarea { border-color: #c62828 !important; } /* Mobile */ @media (max-width: 700px) { body.woocommerce-checkout .woocommerce-error { margin-bottom: 24px !important; padding: 17px 15px 17px 42px !important; } body.woocommerce-checkout .woocommerce-error::before { top: 18px !important; left: 15px !important; font-size: 15px !important; } body.woocommerce-checkout .woocommerce-error li { font-size: 12px !important; line-height: 1.48 !important; } } /* ========================================================= 21. REMOVE BROKEN WOOCOMMERCE NOTICE ICONS — v17 Keep this section LAST. Fixes the yellow/broken glyph shown before: - Product removed notices - Empty cart message - Other cart information notices Applies to desktop and mobile. ========================================================= */ /* Remove WooCommerce / Blocksy pseudo-icons that depend on icon fonts */ body.woocommerce-cart :is( .woocommerce-message, .woocommerce-info, .woocommerce-error, .cart-empty, .wc-block-cart__empty-cart__title )::before { display: none !important; content: none !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; font-family: inherit !important; background: none !important; } /* Remove any theme-generated decorative icon wrappers */ body.woocommerce-cart :is( .woocommerce-message, .woocommerce-info, .cart-empty, .wc-block-cart__empty-cart__title ) > :is( .ct-icon-container, .ct-notification-icon, .woocommerce-notice-icon ) { display: none !important; } /* Restore normal padding after removing the icon */ body.woocommerce-cart #main :is( .woocommerce-message, .woocommerce-info, .woocommerce-error ) { padding-left: 20px !important; } /* Product-removed notice */ body.woocommerce-cart #main .woocommerce-message { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 18px !important; min-height: 60px !important; color: #080808 !important; } /* Keep the Undo action aligned and premium */ body.woocommerce-cart #main .woocommerce-message .restore-item, body.woocommerce-cart #main .woocommerce-message a.button { flex: 0 0 auto !important; float: none !important; margin: 0 !important; padding: 11px 15px !important; border: 1px solid #080808 !important; background: #080808 !important; color: #ffffff !important; font-size: 9px !important; font-weight: 900 !important; line-height: 1.2 !important; letter-spacing: 0.10em !important; text-decoration: none !important; text-transform: uppercase !important; } body.woocommerce-cart #main .woocommerce-message .restore-item:hover, body.woocommerce-cart #main .woocommerce-message .restore-item:focus-visible, body.woocommerce-cart #main .woocommerce-message a.button:hover, body.woocommerce-cart #main .woocommerce-message a.button:focus-visible { background: #ffffff !important; color: #080808 !important; } /* Empty-cart message: no reserved icon space */ body.woocommerce-cart #main :is( .cart-empty, .wc-block-cart__empty-cart__title ) { padding-left: 20px !important; text-indent: 0 !important; } /* Mobile */ @media (max-width: 700px) { body.woocommerce-cart #main .woocommerce-message { display: block !important; min-height: 0 !important; padding: 16px !important; } body.woocommerce-cart #main .woocommerce-message .restore-item, body.woocommerce-cart #main .woocommerce-message a.button { display: block !important; width: 100% !important; margin-top: 14px !important; text-align: center !important; } body.woocommerce-cart #main :is( .cart-empty, .wc-block-cart__empty-cart__title ) { padding-left: 16px !important; padding-right: 16px !important; } } /* ========================================================= 22. LUXURY SHOP ARCHIVE REBUILD — v18 Keep this section LAST. Scope: - Main Shop page - Product category archives - Product tag archives This section does NOT touch the cart quantity picker, Cart Totals, checkout, account pages, or single products. ========================================================= */ /* ---------- Archive design tokens ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) { --burnigan-shop-max: 1280px; --burnigan-shop-line: rgba(8, 8, 8, 0.14); --burnigan-shop-soft-line: rgba(8, 8, 8, 0.08); --burnigan-shop-ink: #080808; --burnigan-shop-muted: #74746f; --burnigan-shop-surface: #f5f5f1; --burnigan-shop-card: #ffffff; background: var(--burnigan-shop-surface) !important; } /* ---------- Blocksy category-navigation hero ---------- */ /* * Blocksy normally renders the shop category tabs inside * .ct-shop-tabs. This converts that area into an editorial * introduction without requiring a page-builder plugin. */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs { width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: var(--burnigan-shop-surface) !important; box-shadow: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { display: flex !important; flex-direction: column !important; align-items: stretch !important; width: 100% !important; max-width: var(--burnigan-shop-max) !important; margin: 0 auto !important; padding: 74px 28px 0 !important; box-sizing: border-box !important; } /* Editorial shop title */ body.woocommerce-shop .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before, body.post-type-archive-product .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before { content: "SHOP"; } body:is( .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before { content: "COLLECTION"; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before { order: 1 !important; display: block !important; margin: 0 !important; padding: 0 !important; color: var(--burnigan-shop-ink) !important; font-family: var(--burnigan-font) !important; font-size: clamp(58px, 7.4vw, 104px) !important; font-weight: 900 !important; line-height: 0.84 !important; letter-spacing: -0.065em !important; text-transform: uppercase !important; } /* Editorial supporting copy */ body:is( .woocommerce-shop, .post-type-archive-product ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { content: "Independent streetwear shaped by bold graphics, oversized silhouettes and considered everyday expression."; } body.tax-product_cat .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { content: "Explore the selected Burnigan pieces within this collection."; } body.tax-product_tag .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { content: "A focused selection of Burnigan pieces sharing the same design language."; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { order: 2 !important; display: block !important; width: min(100%, 620px) !important; margin: 24px 0 48px !important; padding: 0 !important; color: var(--burnigan-shop-muted) !important; font-family: var(--burnigan-font) !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.75 !important; letter-spacing: 0 !important; } /* Category list */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs ul { order: 3 !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; flex-wrap: wrap !important; gap: 0 34px !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border-top: 1px solid var(--burnigan-shop-line) !important; border-bottom: 1px solid var(--burnigan-shop-line) !important; list-style: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs li { position: relative !important; margin: 0 !important; padding: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a { position: relative !important; display: inline-flex !important; align-items: center !important; min-height: 62px !important; margin: 0 !important; padding: 0 !important; color: #858580 !important; font-family: var(--burnigan-font) !important; font-size: 10px !important; font-weight: 900 !important; line-height: 1.2 !important; letter-spacing: 0.15em !important; text-decoration: none !important; text-transform: uppercase !important; transition: color 0.25s ease !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a::after { content: "" !important; position: absolute !important; right: 0 !important; bottom: -1px !important; left: 0 !important; height: 2px !important; background: var(--burnigan-shop-ink) !important; transform: scaleX(0) !important; transform-origin: left center !important; transition: transform 0.25s ease !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs :is( li.active, li.current-cat, .current-menu-item ) > a, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a:hover, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a:focus-visible { color: var(--burnigan-shop-ink) !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs :is( li.active, li.current-cat, .current-menu-item ) > a::after, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a:hover::after, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a:focus-visible::after { transform: scaleX(1) !important; } /* ---------- Fallback when Blocksy shop tabs are unavailable ---------- */ @supports selector(body:has(.ct-shop-tabs)) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ):not(:has(.ct-shop-tabs)) main#main > :is(.ct-container, .ct-container-full)::before { content: "SHOP"; display: block !important; margin: 0 0 24px !important; color: var(--burnigan-shop-ink) !important; font-family: var(--burnigan-font) !important; font-size: clamp(58px, 7.4vw, 104px) !important; font-weight: 900 !important; line-height: 0.84 !important; letter-spacing: -0.065em !important; text-transform: uppercase !important; } } /* ---------- Main archive canvas ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { width: 100% !important; max-width: var(--burnigan-shop-max) !important; margin: 0 auto !important; padding: 42px 28px 110px !important; box-sizing: border-box !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main .woocommerce { display: flow-root !important; width: 100% !important; min-width: 0 !important; } /* ---------- Premium catalogue toolbar ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count { display: flex !important; align-items: center !important; min-height: 50px !important; float: left !important; margin: 0 0 34px !important; padding: 0 !important; color: var(--burnigan-shop-muted) !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 900 !important; line-height: 1.3 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 14px !important; float: right !important; margin: 0 0 34px !important; padding: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering::before { content: "SORT BY" !important; color: var(--burnigan-shop-muted) !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 900 !important; line-height: 1.3 !important; letter-spacing: 0.16em !important; white-space: nowrap !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { width: auto !important; min-width: 205px !important; max-width: 260px !important; height: 50px !important; margin: 0 !important; padding: 0 42px 0 16px !important; border: 1px solid var(--burnigan-shop-line) !important; border-radius: 0 !important; background-color: var(--burnigan-shop-card) !important; box-shadow: none !important; color: var(--burnigan-shop-ink) !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 700 !important; } /* A clean divider directly above the catalogue */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce::before { content: "" !important; display: block !important; clear: both !important; width: 100% !important; height: 1px !important; margin: 0 0 38px !important; background: var(--burnigan-shop-line) !important; } /* ---------- Luxury product grid ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { clear: both !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 66px 28px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product { position: relative !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 0 0 22px !important; border: 0 !important; border-bottom: 1px solid var(--burnigan-shop-soft-line) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; text-align: left !important; } /* Blocksy image wrapper */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product :is( .ct-media-container, .woocommerce-loop-product__link ) { border-radius: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .ct-media-container { position: relative !important; display: block !important; width: 100% !important; margin: 0 0 20px !important; overflow: hidden !important; background: #ecece8 !important; } /* Product image */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product img { display: block !important; width: 100% !important; height: auto !important; aspect-ratio: 4 / 5 !important; margin: 0 0 20px !important; object-fit: cover !important; object-position: center !important; border: 0 !important; border-radius: 0 !important; background: #ecece8 !important; transform: scale(1) !important; transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), filter 0.45s ease !important; } /* Avoid a duplicate margin when Blocksy provides an image wrapper */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .ct-media-container img { margin: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product:hover img { transform: scale(1.035) !important; filter: contrast(1.015) !important; opacity: 1 !important; } /* Sale badge */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .onsale { top: 14px !important; right: 14px !important; padding: 9px 11px !important; background: var(--burnigan-shop-ink) !important; color: #ffffff !important; font-size: 8px !important; font-weight: 900 !important; letter-spacing: 0.14em !important; } /* Product title */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .woocommerce-loop-product__title { margin: 0 0 9px !important; padding: 0 !important; color: var(--burnigan-shop-ink) !important; font-family: var(--burnigan-font) !important; font-size: 15px !important; font-weight: 850 !important; line-height: 1.34 !important; letter-spacing: -0.018em !important; text-transform: uppercase !important; } /* Price */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .price { display: flex !important; align-items: baseline !important; flex-wrap: wrap !important; gap: 8px !important; margin: 0 0 18px !important; color: var(--burnigan-shop-ink) !important; font-family: var(--burnigan-font) !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.35 !important; } /* Add to cart / select options */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .button { width: 100% !important; min-height: 49px !important; margin: auto 0 0 !important; padding: 15px 18px !important; border: 1px solid var(--burnigan-shop-ink) !important; background: transparent !important; color: var(--burnigan-shop-ink) !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: 0.16em !important; transition: background-color 0.25s ease, color 0.25s ease !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .button:hover, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .button:focus-visible { background: var(--burnigan-shop-ink) !important; color: #ffffff !important; transform: none !important; } /* View cart state */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product a.added_to_cart { min-height: 49px !important; margin-top: 10px !important; border: 1px solid var(--burnigan-shop-ink) !important; background: var(--burnigan-shop-ink) !important; color: #ffffff !important; } /* ---------- Balanced low-inventory layouts ---------- */ @media (min-width: 901px) { @supports selector(ul:has(li)) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:only-child) { grid-template-columns: minmax(0, 400px) !important; justify-content: start !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 400px)) !important; justify-content: start !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; justify-content: stretch !important; } } } /* ---------- Editorial catalogue ending ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full)::after { content: "BUILT FOR EVERYDAY EXPRESSION\A Burnigan combines graphic identity, oversized silhouettes and considered essentials."; white-space: pre-line !important; display: block !important; width: 100% !important; margin: 100px 0 0 !important; padding: 52px 0 0 !important; border-top: 1px solid var(--burnigan-shop-line) !important; color: var(--burnigan-shop-muted) !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 600 !important; line-height: 1.85 !important; letter-spacing: 0.01em !important; } /* ---------- Tablet ---------- */ @media (min-width: 701px) and (max-width: 1020px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { padding-top: 58px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding-top: 36px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 52px 24px !important; } @supports selector(ul:has(li)) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:only-child) { grid-template-columns: minmax(0, 400px) !important; } } } /* ---------- Mobile ---------- */ @media (max-width: 700px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { padding: 46px 16px 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before { font-size: clamp(52px, 17vw, 72px) !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { margin: 18px 0 34px !important; font-size: 12px !important; line-height: 1.65 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs ul { flex-wrap: nowrap !important; gap: 0 24px !important; overflow-x: auto !important; overflow-y: hidden !important; scrollbar-width: none !important; -webkit-overflow-scrolling: touch !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs ul::-webkit-scrollbar { display: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs li { flex: 0 0 auto !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a { min-height: 55px !important; font-size: 9px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding: 28px 16px 78px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count { float: none !important; min-height: 0 !important; margin: 0 0 14px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { float: none !important; justify-content: space-between !important; width: 100% !important; margin: 0 0 24px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { flex: 1 1 auto !important; width: 100% !important; min-width: 0 !important; max-width: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce::before { margin-bottom: 28px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { grid-template-columns: 1fr !important; gap: 46px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product { padding-bottom: 20px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .woocommerce-loop-product__title { font-size: 14px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full)::after { margin-top: 70px !important; padding-top: 36px !important; font-size: 12px !important; } } /* ---------- Extra-small phones ---------- */ @media (max-width: 380px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { padding-right: 13px !important; padding-left: 13px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding-right: 13px !important; padding-left: 13px !important; } } /* ---------- Reduced motion ---------- */ @media (prefers-reduced-motion: reduce) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product img, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a::after { transition: none !important; } } /* ========================================================= 23. REFINED LUXURY SHOP COMPOSITION — v19 Keep this section LAST. Purpose: - Reduce excessive vertical margins - Create a tighter editorial hierarchy - Improve toolbar and product-card presentation - Preserve all cart, quantity, checkout and account fixes ========================================================= */ /* ---------- Narrower editorial canvas ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) { --burnigan-shop-max: 1180px !important; } /* ---------- Compact shop hero ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { max-width: var(--burnigan-shop-max) !important; padding: 42px 20px 0 !important; } /* Reduce oversized SHOP heading */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before { position: static !important; display: block !important; margin: 0 !important; padding: 0 !important; font-size: clamp(54px, 6.2vw, 80px) !important; line-height: 0.88 !important; letter-spacing: -0.055em !important; opacity: 1 !important; visibility: visible !important; } /* Restore and tighten the editorial description */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { position: static !important; display: block !important; width: min(100%, 560px) !important; height: auto !important; margin: 17px 0 30px !important; padding: 0 !important; font-size: 13px !important; line-height: 1.65 !important; opacity: 1 !important; visibility: visible !important; overflow: visible !important; } /* Force category navigation to align with the title */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs :is( ul, .ct-tabs ) { justify-content: flex-start !important; gap: 0 30px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a { min-height: 54px !important; } /* ---------- Compact archive content ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { max-width: var(--burnigan-shop-max) !important; padding: 26px 20px 86px !important; } /* ---------- Premium catalogue toolbar ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count { min-height: 44px !important; margin: 0 0 24px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { min-height: 44px !important; margin: 0 0 24px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { min-width: 188px !important; max-width: 225px !important; height: 44px !important; padding-right: 38px !important; border-color: rgba(8, 8, 8, 0.18) !important; background-color: #ffffff !important; } /* Slim divider before products */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce::before { margin: 0 0 26px !important; } /* ---------- Product section label ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::before { content: "LATEST DROP" !important; grid-column: 1 / -1 !important; display: block !important; clear: none !important; width: 100% !important; height: auto !important; margin: 0 0 -8px !important; padding: 0 !important; color: #73736e !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 900 !important; line-height: 1.3 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::after { display: none !important; content: none !important; } /* ---------- Refined product grid ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { gap: 46px 24px !important; } /* Single-product catalogue should feel intentional, not empty */ @media (min-width: 901px) { @supports selector(ul:has(li)) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:only-child) { grid-template-columns: minmax(0, 360px) !important; justify-content: start !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products:has(> li.product:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 360px)) !important; justify-content: start !important; } } } /* Premium card treatment */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product { padding: 0 !important; border: 1px solid rgba(8, 8, 8, 0.10) !important; background: #ffffff !important; transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product:hover { transform: translateY(-3px) !important; border-color: rgba(8, 8, 8, 0.20) !important; box-shadow: 0 16px 38px rgba(8, 8, 8, 0.06) !important; } /* Remove duplicate image spacing and add a precise divider */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product :is( .ct-media-container, .woocommerce-loop-product__link ) { margin-bottom: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product img { margin-bottom: 0 !important; border-bottom: 1px solid rgba(8, 8, 8, 0.08) !important; } /* Product information spacing */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .woocommerce-loop-product__title { margin: 18px 18px 8px !important; font-size: 14px !important; line-height: 1.38 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .price { margin: 0 18px 18px !important; font-size: 13px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .button { width: calc(100% - 36px) !important; margin: auto 18px 18px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product a.added_to_cart { width: calc(100% - 36px) !important; margin: -8px 18px 18px !important; } /* ---------- Shorter editorial ending ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full)::after { margin-top: 72px !important; padding-top: 38px !important; } /* ---------- Tablet ---------- */ @media (min-width: 701px) and (max-width: 1020px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { padding-top: 34px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding-top: 22px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { gap: 40px 20px !important; } } /* ---------- Mobile ---------- */ @media (max-width: 700px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { padding: 30px 14px 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before { font-size: clamp(46px, 15vw, 62px) !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { margin: 14px 0 24px !important; font-size: 11px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a { min-height: 48px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding: 20px 14px 64px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { margin-bottom: 18px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce::before { margin-bottom: 22px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { gap: 34px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .woocommerce-loop-product__title { margin: 16px 15px 7px !important; font-size: 13px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .price { margin: 0 15px 15px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .button { width: calc(100% - 30px) !important; margin: auto 15px 15px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full)::after { margin-top: 52px !important; padding-top: 30px !important; } } /* ---------- Reduced motion ---------- */ @media (prefers-reduced-motion: reduce) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product { transition: none !important; } } /* ========================================================= 24. MOBILE SHOP TOOLBAR + LUXURY ARCHIVE POLISH — v20 Keep this section LAST. Fixes: - Removes the broken symbol before "SORT BY" - Rebuilds mobile sorting as a premium compact control - Tightens mobile hierarchy and spacing - Refines product-card proportions on small screens - Preserves cart quantity, Cart Totals and checkout fixes ========================================================= */ /* ---------- Remove stray pseudo content around the toolbar ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering::after, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select::before, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select::after { display: none !important; content: none !important; } /* Make the label authoritative and clean */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering::before { content: "SORT BY" !important; display: inline-block !important; margin: 0 !important; padding: 0 !important; color: #6f6f6a !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 900 !important; line-height: 1.2 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; white-space: nowrap !important; background: transparent !important; } /* ---------- Desktop and tablet toolbar refinement ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: flex-end !important; gap: 12px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { appearance: none !important; -webkit-appearance: none !important; min-width: 190px !important; height: 46px !important; padding: 0 42px 0 15px !important; border: 1px solid rgba(8, 8, 8, 0.16) !important; border-radius: 0 !important; background-color: #ffffff !important; background-image: linear-gradient(45deg, transparent 50%, #080808 50%), linear-gradient(135deg, #080808 50%, transparent 50%) !important; background-position: calc(100% - 17px) 20px, calc(100% - 12px) 20px !important; background-size: 5px 5px, 5px 5px !important; background-repeat: no-repeat !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 750 !important; line-height: 1 !important; box-shadow: none !important; cursor: pointer !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select:hover, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select:focus { border-color: #080808 !important; outline: none !important; } /* ---------- Mobile luxury composition ---------- */ @media (max-width: 700px) { /* Tighter top composition */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { padding: 24px 16px 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before { margin-bottom: 2px !important; font-size: clamp(48px, 14vw, 60px) !important; line-height: 0.92 !important; } /* Hide the long editorial sentence on mobile for a cleaner luxury look */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { display: none !important; content: none !important; } /* Compact category navigation */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs ul { margin-top: 28px !important; gap: 0 26px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs a { min-height: 46px !important; font-size: 9px !important; letter-spacing: 0.14em !important; } /* Main archive spacing */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding: 18px 16px 60px !important; } /* Hide product count on phones to avoid clutter */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count { display: none !important; } /* Premium full-width sorting bar */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { position: relative !important; display: grid !important; grid-template-columns: auto minmax(0, 1fr) !important; gap: 14px !important; align-items: center !important; width: 100% !important; min-height: 58px !important; float: none !important; margin: 0 0 26px !important; padding: 10px 12px !important; border: 1px solid rgba(8, 8, 8, 0.14) !important; background: #ffffff !important; box-shadow: none !important; box-sizing: border-box !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering::before { position: static !important; display: block !important; width: auto !important; margin: 0 !important; padding: 0 !important; color: #767671 !important; font-size: 8px !important; letter-spacing: 0.18em !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { width: 100% !important; min-width: 0 !important; max-width: none !important; height: 38px !important; margin: 0 !important; padding: 0 36px 0 12px !important; border: 0 !important; border-left: 1px solid rgba(8, 8, 8, 0.10) !important; background-color: transparent !important; background-position: calc(100% - 14px) 16px, calc(100% - 9px) 16px !important; font-size: 12px !important; font-weight: 800 !important; } /* Remove the old divider that made the toolbar feel disconnected */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce::before { display: none !important; content: none !important; } /* Catalogue label */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::before { margin: 0 0 -2px !important; font-size: 8px !important; letter-spacing: 0.19em !important; } /* More controlled single-column product card */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { gap: 28px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products li.product { border-color: rgba(8, 8, 8, 0.11) !important; box-shadow: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product img { aspect-ratio: 4 / 4.7 !important; object-position: center top !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .woocommerce-loop-product__title { margin: 15px 14px 6px !important; font-size: 13px !important; line-height: 1.35 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .price { margin: 0 14px 14px !important; font-size: 13px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) li.product .button { width: calc(100% - 28px) !important; min-height: 46px !important; margin: auto 14px 14px !important; } /* Tighter ending block */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full)::after { margin-top: 44px !important; padding-top: 26px !important; } } /* ---------- Extra-small phones ---------- */ @media (max-width: 380px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { grid-template-columns: 1fr !important; gap: 7px !important; padding: 11px 12px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { border-left: 0 !important; border-top: 1px solid rgba(8, 8, 8, 0.10) !important; padding-top: 4px !important; } } /* ========================================================= 25. MOBILE SORT ICON CLEANUP + TIGHTER SHOP SPACING — v21 Keep this section LAST. Fixes: - Removes Blocksy's extra/broken sort icon on mobile - Keeps only the custom SORT BY label and dropdown arrow - Reduces the gap below the sorting toolbar - Reduces the gap between LATEST DROP and the product image - Preserves the working cart quantity picker ========================================================= */ @media (max-width: 700px) { /* ---------- Remove Blocksy/theme sort icons ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering > :is( svg, i, .ct-icon, .ct-icon-container, .ct-sort-icon, .woocommerce-ordering-icon, [class*="sort-icon"], [class*="ordering-icon"] ) { display: none !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; opacity: 0 !important; visibility: hidden !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering :is( svg, .ct-icon ) { display: none !important; } /* Ensure no inherited icon font is used on the SORT BY label */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering::before { content: "SORT BY" !important; font-family: var(--burnigan-font) !important; speak: none !important; } /* ---------- Force a clean vertical archive flow ---------- */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main .woocommerce { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { order: 1 !important; margin: 0 0 14px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { order: 2 !important; clear: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; row-gap: 18px !important; } /* Reduce space below LATEST DROP */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::before { margin: 8px 0 4px !important; padding: 0 !important; } /* Prevent theme-generated clearance from creating blank space */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce::after, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::after { display: none !important; content: none !important; clear: none !important; } /* Product starts directly below the catalogue label */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product:first-of-type { margin-top: 0 !important; } /* Slightly tighter toolbar dimensions */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { min-height: 54px !important; padding: 8px 11px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { height: 36px !important; } } /* Extra-small phones */ @media (max-width: 380px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { margin-bottom: 12px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::before { margin-top: 6px !important; } } /* ========================================================= 26. SHIPPING DELIVERY DETAILS — v22 Keep this section LAST. Adds a clean secondary delivery line inside shipping cards on the Cart and Checkout pages. ========================================================= */ body:is(.woocommerce-cart, .woocommerce-checkout) .burnigan-shipping-rate { display: grid !important; gap: 4px !important; min-width: 0 !important; } body:is(.woocommerce-cart, .woocommerce-checkout) .burnigan-shipping-rate__title { display: block !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.35 !important; } body:is(.woocommerce-cart, .woocommerce-checkout) .burnigan-shipping-rate__meta { display: block !important; color: #73736e !important; font-family: var(--burnigan-font) !important; font-size: 10px !important; font-weight: 600 !important; line-height: 1.45 !important; letter-spacing: 0 !important; text-transform: none !important; } body:is(.woocommerce-cart, .woocommerce-checkout) .burnigan-shipping-rate__price { color: #080808 !important; font-weight: 800 !important; white-space: nowrap !important; } /* Keep labels visually balanced inside the existing premium cards. */ body.woocommerce-cart #main .cart_totals ul#shipping_method label, body.woocommerce-checkout #order_review ul#shipping_method label { padding-top: 13px !important; padding-bottom: 13px !important; } /* Mobile */ @media (max-width: 700px) { body:is(.woocommerce-cart, .woocommerce-checkout) .burnigan-shipping-rate__title { font-size: 12px !important; } body:is(.woocommerce-cart, .woocommerce-checkout) .burnigan-shipping-rate__meta { font-size: 9px !important; line-height: 1.4 !important; } } /* ========================================================= 27. PREMIUM LOCAL PICKUP LOCATIONS — v23 Keep this section LAST. Adds four selectable pickup-location cards, ordered north to south: Tripoli, Koura, Batroun, Rabieh (Matn). ========================================================= */ body.woocommerce-checkout .burnigan-pickup-selector { width: 100% !important; margin: 24px 0 !important; padding: 24px !important; border: 1px solid rgba(8, 8, 8, 0.14) !important; background: #f7f7f4 !important; box-sizing: border-box !important; } body.woocommerce-checkout .burnigan-pickup-selector[hidden] { display: none !important; } body.woocommerce-checkout .burnigan-pickup-selector__header { margin: 0 0 18px !important; } body.woocommerce-checkout .burnigan-pickup-selector__eyebrow { display: block !important; margin: 0 0 7px !important; color: #777772 !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 900 !important; line-height: 1.3 !important; letter-spacing: 0.18em !important; text-transform: uppercase !important; } body.woocommerce-checkout .burnigan-pickup-selector__title { margin: 0 !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: 18px !important; font-weight: 900 !important; line-height: 1.2 !important; letter-spacing: -0.02em !important; } body.woocommerce-checkout .burnigan-pickup-selector__intro { margin: 8px 0 0 !important; color: #686863 !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1.55 !important; } body.woocommerce-checkout .burnigan-pickup-selector__options { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; margin: 0 !important; padding: 0 !important; } body.woocommerce-checkout .burnigan-pickup-option { position: relative !important; display: block !important; min-width: 0 !important; margin: 0 !important; } /* Visually hide the native radio while retaining accessibility. */ body.woocommerce-checkout .burnigan-pickup-option input[type="radio"] { position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; opacity: 0 !important; pointer-events: none !important; } body.woocommerce-checkout .burnigan-pickup-option__card { position: relative !important; display: block !important; min-height: 86px !important; padding: 16px 14px 15px 46px !important; border: 1px solid rgba(8, 8, 8, 0.13) !important; background: #ffffff !important; cursor: pointer !important; box-sizing: border-box !important; transition: border-color 0.22s ease, background-color 0.22s ease, transform 0.22s ease !important; } body.woocommerce-checkout .burnigan-pickup-option__card::before { content: "" !important; position: absolute !important; top: 18px !important; left: 16px !important; width: 17px !important; height: 17px !important; border: 1px solid #aaaead !important; border-radius: 50% !important; background: #ffffff !important; box-sizing: border-box !important; } body.woocommerce-checkout .burnigan-pickup-option input[type="radio"]:checked + .burnigan-pickup-option__card { border-color: #080808 !important; background: #ffffff !important; } body.woocommerce-checkout .burnigan-pickup-option input[type="radio"]:checked + .burnigan-pickup-option__card::before { border-color: #080808 !important; background: #080808 !important; box-shadow: inset 0 0 0 4px #ffffff !important; } body.woocommerce-checkout .burnigan-pickup-option input[type="radio"]:focus-visible + .burnigan-pickup-option__card { outline: 2px solid #080808 !important; outline-offset: 3px !important; } body.woocommerce-checkout .burnigan-pickup-option__card:hover { border-color: #080808 !important; transform: translateY(-1px) !important; } body.woocommerce-checkout .burnigan-pickup-option__city { display: block !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 900 !important; line-height: 1.3 !important; } body.woocommerce-checkout .burnigan-pickup-option__region { display: block !important; margin-top: 5px !important; color: #73736e !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 650 !important; line-height: 1.45 !important; } body.woocommerce-checkout .burnigan-pickup-selector__error { margin: 12px 0 0 !important; color: #b42318 !important; font-size: 11px !important; font-weight: 750 !important; line-height: 1.45 !important; } /* Admin/email/order display helper */ .burnigan-pickup-order-detail { margin-top: 12px !important; } /* Mobile */ @media (max-width: 700px) { body.woocommerce-checkout .burnigan-pickup-selector { margin: 20px 0 !important; padding: 18px 14px !important; } body.woocommerce-checkout .burnigan-pickup-selector__title { font-size: 16px !important; } body.woocommerce-checkout .burnigan-pickup-selector__options { grid-template-columns: 1fr !important; gap: 8px !important; } body.woocommerce-checkout .burnigan-pickup-option__card { min-height: 76px !important; padding: 14px 12px 13px 43px !important; } body.woocommerce-checkout .burnigan-pickup-option__card::before { top: 16px !important; left: 14px !important; } body.woocommerce-checkout .burnigan-pickup-option__city { font-size: 12px !important; } } /* ========================================================= 28. PREMIUM MY ACCOUNT — v24 Keep this section LAST. ========================================================= */ body.woocommerce-account { --burnigan-account-border: rgba(8, 8, 8, 0.13); --burnigan-account-muted: #73736e; --burnigan-account-soft: #f6f6f2; --burnigan-account-ink: #080808; } body.woocommerce-account #main .woocommerce { display: grid !important; grid-template-columns: 250px minmax(0, 1fr) !important; gap: clamp(28px, 4vw, 58px) !important; width: min(1180px, calc(100% - 40px)) !important; margin: 52px auto 86px !important; padding: 0 !important; } body.woocommerce-account:not(.logged-in) #main .woocommerce { display: block !important; width: min(980px, calc(100% - 40px)) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation, body.woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; float: none !important; margin: 0 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation::before { content: "MY ACCOUNT" !important; display: block !important; margin-bottom: 16px !important; color: var(--burnigan-account-muted) !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 900 !important; letter-spacing: 0.2em !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { display: grid !important; gap: 5px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li { margin: 0 !important; padding: 0 !important; border: 0 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a { position: relative !important; display: flex !important; align-items: center !important; min-height: 48px !important; padding: 0 16px !important; border: 1px solid transparent !important; color: #4e4e4a !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 750 !important; text-decoration: none !important; transition: 0.2s ease !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a::before { content: "" !important; position: absolute !important; top: 10px !important; bottom: 10px !important; left: 0 !important; width: 2px !important; background: transparent !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { padding-left: 20px !important; border-color: var(--burnigan-account-border) !important; background: var(--burnigan-account-soft) !important; color: var(--burnigan-account-ink) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { font-weight: 900 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a::before { background: var(--burnigan-account-ink) !important; } body.burnigan-account-dashboard .woocommerce-MyAccount-content > p { display: none !important; } body.woocommerce-account .burnigan-account-dashboard-wrap { display: grid !important; gap: 18px !important; } body.woocommerce-account .burnigan-account-hero { position: relative !important; overflow: hidden !important; padding: clamp(28px, 5vw, 54px) !important; border: 1px solid var(--burnigan-account-border) !important; background: linear-gradient(135deg, #fff, #f6f6f2) !important; } body.woocommerce-account .burnigan-account-hero::after { content: "B" !important; position: absolute !important; right: 22px !important; bottom: -46px !important; color: rgba(8, 8, 8, 0.04) !important; font-family: Georgia, serif !important; font-size: 170px !important; font-weight: 700 !important; line-height: 1 !important; } body.woocommerce-account .burnigan-account-eyebrow { display: block !important; margin-bottom: 10px !important; color: var(--burnigan-account-muted) !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 900 !important; letter-spacing: 0.2em !important; text-transform: uppercase !important; } body.woocommerce-account .burnigan-account-hero h2 { position: relative !important; z-index: 1 !important; margin: 0 !important; color: var(--burnigan-account-ink) !important; font-family: var(--burnigan-font) !important; font-size: clamp(28px, 4vw, 46px) !important; font-weight: 900 !important; letter-spacing: -0.045em !important; line-height: 1.05 !important; } body.woocommerce-account .burnigan-account-hero p { position: relative !important; z-index: 1 !important; max-width: 560px !important; margin: 13px 0 0 !important; color: #666660 !important; font-family: var(--burnigan-font) !important; font-size: 12px !important; font-weight: 600 !important; line-height: 1.65 !important; } body.woocommerce-account .burnigan-account-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; } body.woocommerce-account .burnigan-account-card { display: grid !important; align-content: space-between !important; min-height: 155px !important; padding: 23px !important; border: 1px solid var(--burnigan-account-border) !important; background: #fff !important; color: var(--burnigan-account-ink) !important; text-decoration: none !important; transition: 0.22s ease !important; } body.woocommerce-account .burnigan-account-card:hover { transform: translateY(-2px) !important; border-color: var(--burnigan-account-ink) !important; box-shadow: 0 14px 34px rgba(8, 8, 8, 0.07) !important; } body.woocommerce-account .burnigan-account-card__label { color: var(--burnigan-account-muted) !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 900 !important; letter-spacing: 0.16em !important; text-transform: uppercase !important; } body.woocommerce-account .burnigan-account-card__value { display: block !important; margin-top: 8px !important; color: var(--burnigan-account-ink) !important; font-family: var(--burnigan-font) !important; font-size: 25px !important; font-weight: 900 !important; letter-spacing: -0.035em !important; } body.woocommerce-account .burnigan-account-card__action { display: flex !important; align-items: center !important; justify-content: space-between !important; margin-top: 25px !important; color: #4e4e4a !important; font-family: var(--burnigan-font) !important; font-size: 10px !important; font-weight: 800 !important; } body.woocommerce-account .burnigan-account-card__action::after { content: "→" !important; font-size: 16px !important; } body.woocommerce-account .woocommerce-orders-table, body.woocommerce-account .woocommerce-table--order-details { width: 100% !important; overflow: hidden !important; border: 1px solid var(--burnigan-account-border) !important; border-collapse: separate !important; border-spacing: 0 !important; background: #fff !important; } body.woocommerce-account .woocommerce-orders-table th, body.woocommerce-account .woocommerce-table--order-details th { padding: 14px 16px !important; border: 0 !important; border-bottom: 1px solid var(--burnigan-account-border) !important; background: var(--burnigan-account-soft) !important; color: #666660 !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 900 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; } body.woocommerce-account .woocommerce-orders-table td, body.woocommerce-account .woocommerce-table--order-details td { padding: 18px 16px !important; border: 0 !important; border-bottom: 1px solid rgba(8,8,8,.08) !important; color: #3f3f3b !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 650 !important; vertical-align: middle !important; } body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-button, body.woocommerce-account .woocommerce-MyAccount-content .button { min-height: 39px !important; padding: 0 15px !important; border: 1px solid var(--burnigan-account-ink) !important; border-radius: 0 !important; background: var(--burnigan-account-ink) !important; color: #fff !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .08em !important; line-height: 37px !important; text-transform: uppercase !important; text-decoration: none !important; } body.woocommerce-account .woocommerce-Addresses { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 14px !important; } body.woocommerce-account .woocommerce-Address { width: 100% !important; min-height: 220px !important; float: none !important; margin: 0 !important; padding: 24px !important; border: 1px solid var(--burnigan-account-border) !important; background: #fff !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-Address-title { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-bottom: 18px !important; } body.woocommerce-account .woocommerce-Address-title h3 { margin: 0 !important; } body.woocommerce-account .woocommerce-Address address { color: #62625d !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-style: normal !important; line-height: 1.75 !important; } body.woocommerce-account .woocommerce-MyAccount-content form, body.woocommerce-account #customer_login form { padding: 26px !important; border: 1px solid var(--burnigan-account-border) !important; background: #fff !important; } body.woocommerce-account #customer_login { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 18px !important; } body.woocommerce-account #customer_login .u-column1, body.woocommerce-account #customer_login .u-column2 { width: 100% !important; float: none !important; } body.woocommerce-account form input.input-text, body.woocommerce-account form input[type="email"], body.woocommerce-account form input[type="password"], body.woocommerce-account form input[type="text"], body.woocommerce-account form select, body.woocommerce-account form textarea { min-height: 49px !important; padding: 0 14px !important; border: 1px solid #cfcfca !important; border-radius: 0 !important; background: #fff !important; color: var(--burnigan-account-ink) !important; font-family: var(--burnigan-font) !important; font-size: 12px !important; box-shadow: none !important; } body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info, body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message, body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error { min-height: 82px !important; margin: 0 !important; padding: 22px 24px !important; border: 1px solid var(--burnigan-account-border) !important; border-left: 3px solid var(--burnigan-account-ink) !important; background: var(--burnigan-account-soft) !important; color: #3f3f3b !important; } @media (max-width: 900px) { body.woocommerce-account #main .woocommerce { grid-template-columns: 1fr !important; gap: 24px !important; width: min(100% - 28px, 760px) !important; margin-top: 30px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { display: flex !important; gap: 8px !important; overflow-x: auto !important; padding-bottom: 4px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li { flex: 0 0 auto !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a { min-height: 42px !important; padding: 0 14px !important; border: 1px solid var(--burnigan-account-border) !important; background: #fff !important; white-space: nowrap !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a::before { display: none !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { padding-left: 14px !important; background: var(--burnigan-account-ink) !important; color: #fff !important; } } @media (max-width: 700px) { body.woocommerce-account #main .woocommerce, body.woocommerce-account:not(.logged-in) #main .woocommerce { width: calc(100% - 24px) !important; margin: 24px auto 64px !important; } body.woocommerce-account .burnigan-account-hero { padding: 27px 20px !important; } body.woocommerce-account .burnigan-account-hero h2 { font-size: 29px !important; } body.woocommerce-account .burnigan-account-grid, body.woocommerce-account .woocommerce-Addresses, body.woocommerce-account #customer_login { grid-template-columns: 1fr !important; } body.woocommerce-account .woocommerce-orders-table { display: block !important; border: 0 !important; background: transparent !important; } body.woocommerce-account .woocommerce-orders-table thead { display: none !important; } body.woocommerce-account .woocommerce-orders-table tbody, body.woocommerce-account .woocommerce-orders-table tr { display: grid !important; } body.woocommerce-account .woocommerce-orders-table tr { margin-bottom: 12px !important; padding: 18px !important; border: 1px solid var(--burnigan-account-border) !important; background: #fff !important; } body.woocommerce-account .woocommerce-orders-table td { display: flex !important; justify-content: space-between !important; gap: 16px !important; padding: 8px 0 !important; border: 0 !important; text-align: right !important; } body.woocommerce-account .woocommerce-orders-table td::before { content: attr(data-title) !important; color: var(--burnigan-account-muted) !important; font-size: 8px !important; font-weight: 900 !important; letter-spacing: .1em !important; text-transform: uppercase !important; } body.woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions { display: block !important; } body.woocommerce-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-actions::before { display: none !important; } body.woocommerce-account .woocommerce-orders-table .woocommerce-button { display: block !important; width: 100% !important; text-align: center !important; } } /* ========================================================= 29. BURNIGAN MY ACCOUNT 2.0 — v25 FINAL RESPONSIVE OVERRIDE Keep this section LAST. ========================================================= */ /* ---------- Page shell ---------- */ body.woocommerce-account #main { min-height: 70vh !important; } body.woocommerce-account #main .woocommerce { display: grid !important; grid-template-columns: 280px minmax(0, 1fr) !important; gap: 42px !important; width: min(1240px, calc(100% - 48px)) !important; margin: 56px auto 88px !important; padding: 0 !important; align-items: start !important; } body.woocommerce-account:not(.logged-in) #main .woocommerce { display: block !important; width: min(1040px, calc(100% - 48px)) !important; } /* ---------- Navigation ---------- */ body.woocommerce-account .woocommerce-MyAccount-navigation { position: sticky !important; top: 120px !important; width: 100% !important; float: none !important; margin: 0 !important; padding: 22px 0 0 !important; border-top: 1px solid #080808 !important; background: transparent !important; } body.woocommerce-account .woocommerce-MyAccount-navigation::before { content: "MY ACCOUNT" !important; display: block !important; margin: 0 0 20px !important; color: #676762 !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .18em !important; line-height: 1 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { display: grid !important; gap: 0 !important; margin: 0 !important; padding: 0 !important; border: 1px solid rgba(8,8,8,.14) !important; background: #fff !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li { margin: 0 !important; padding: 0 !important; border-bottom: 1px solid rgba(8,8,8,.09) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child { border-bottom: 0 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a { position: relative !important; display: flex !important; align-items: center !important; min-height: 56px !important; padding: 0 20px !important; border: 0 !important; background: #fff !important; color: #282825 !important; font-family: var(--burnigan-font) !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: .11em !important; line-height: 1.2 !important; text-transform: uppercase !important; text-decoration: none !important; transition: background-color .2s ease, color .2s ease, padding-left .2s ease !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a::before { content: "" !important; position: absolute !important; left: 0 !important; top: 14px !important; bottom: 14px !important; width: 2px !important; background: transparent !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { padding-left: 25px !important; background: #f7f7f3 !important; color: #080808 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { padding-left: 25px !important; background: #f3f3ef !important; color: #080808 !important; font-weight: 900 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a::before { background: #080808 !important; } /* ---------- Main content panel ---------- */ body.woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; max-width: none !important; min-width: 0 !important; float: none !important; margin: 0 !important; padding: 34px !important; border: 1px solid rgba(8,8,8,.14) !important; background: #fff !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-content > form, body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-EditAccountForm, body.woocommerce-account .woocommerce-MyAccount-content form.woocommerce-address-fields { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } body.woocommerce-account .woocommerce-MyAccount-content > h2, body.woocommerce-account .woocommerce-MyAccount-content > h3 { margin: 0 0 24px !important; font-size: 30px !important; } /* ---------- Form layout ---------- */ body.woocommerce-account .woocommerce-EditAccountForm, body.woocommerce-account .woocommerce-address-fields__field-wrapper { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px 20px !important; } body.woocommerce-account .woocommerce-EditAccountForm .form-row, body.woocommerce-account .woocommerce-address-fields__field-wrapper .form-row { width: 100% !important; float: none !important; margin: 0 !important; } body.woocommerce-account .woocommerce-EditAccountForm .form-row-wide, body.woocommerce-account .woocommerce-address-fields__field-wrapper .form-row-wide, body.woocommerce-account .woocommerce-EditAccountForm fieldset, body.woocommerce-account .woocommerce-EditAccountForm > p:last-child, body.woocommerce-account .woocommerce-address-fields > p:last-child { grid-column: 1 / -1 !important; } body.woocommerce-account form label { display: block !important; margin: 0 0 8px !important; color: #262622 !important; font-size: 10px !important; font-weight: 850 !important; letter-spacing: .03em !important; } body.woocommerce-account form input.input-text, body.woocommerce-account form input[type="email"], body.woocommerce-account form input[type="password"], body.woocommerce-account form input[type="text"], body.woocommerce-account form select, body.woocommerce-account form textarea { width: 100% !important; min-height: 54px !important; padding: 0 16px !important; border: 1px solid #c9c9c4 !important; border-radius: 0 !important; background: #fff !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; line-height: 1.2 !important; box-sizing: border-box !important; } body.woocommerce-account form em { display: block !important; margin-top: 7px !important; color: #777772 !important; font-size: 10px !important; line-height: 1.55 !important; } body.woocommerce-account form fieldset { margin: 8px 0 0 !important; padding: 24px !important; border: 1px solid rgba(8,8,8,.12) !important; background: #fafaf7 !important; } body.woocommerce-account form fieldset legend { padding: 0 10px !important; background: #fff !important; color: #080808 !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .08em !important; text-transform: uppercase !important; } body.woocommerce-account .woocommerce-password-strength { margin-top: 8px !important; padding: 8px 10px !important; font-size: 10px !important; } body.woocommerce-account .woocommerce-MyAccount-content .button, body.woocommerce-account .woocommerce-MyAccount-content button.button { width: auto !important; min-width: 180px !important; min-height: 48px !important; padding: 0 22px !important; border: 1px solid #080808 !important; border-radius: 0 !important; background: #080808 !important; color: #fff !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .12em !important; line-height: 46px !important; text-transform: uppercase !important; } /* ---------- Dashboard ---------- */ body.burnigan-account-dashboard .woocommerce-MyAccount-content { padding: 0 !important; border: 0 !important; background: transparent !important; } body.woocommerce-account .burnigan-account-dashboard-wrap { gap: 14px !important; } body.woocommerce-account .burnigan-account-hero { min-height: 230px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; } body.woocommerce-account .burnigan-account-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } /* ---------- Addresses ---------- */ body.woocommerce-account .woocommerce-Addresses { gap: 18px !important; } body.woocommerce-account .woocommerce-Address { min-height: 250px !important; padding: 26px !important; } /* ---------- Orders ---------- */ body.woocommerce-account .woocommerce-orders-table { width: 100% !important; } body.woocommerce-account .woocommerce-orders-table td, body.woocommerce-account .woocommerce-orders-table th { white-space: normal !important; } /* ---------- Logged-out account ---------- */ body.woocommerce-account:not(.logged-in) #customer_login { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px !important; } body.woocommerce-account:not(.logged-in) #customer_login > div { width: 100% !important; float: none !important; } /* ---------- Tablet ---------- */ @media (max-width: 1024px) { body.woocommerce-account #main .woocommerce { grid-template-columns: 1fr !important; gap: 24px !important; width: min(900px, calc(100% - 36px)) !important; margin: 38px auto 72px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { position: static !important; top: auto !important; padding-top: 18px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { display: flex !important; gap: 8px !important; overflow-x: auto !important; border: 0 !important; background: transparent !important; padding-bottom: 4px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li { flex: 0 0 auto !important; border: 0 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a { min-height: 44px !important; padding: 0 15px !important; border: 1px solid rgba(8,8,8,.14) !important; background: #fff !important; font-size: 9px !important; white-space: nowrap !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a::before { display: none !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { padding-left: 15px !important; background: #080808 !important; color: #fff !important; } body.woocommerce-account .woocommerce-MyAccount-content { padding: 28px !important; } } /* ---------- Mobile ---------- */ @media (max-width: 700px) { body.woocommerce-account #main .woocommerce, body.woocommerce-account:not(.logged-in) #main .woocommerce { width: calc(100% - 24px) !important; margin: 24px auto 56px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { padding-top: 14px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation::before { margin-bottom: 14px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; overflow: visible !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li { width: 100% !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { justify-content: center !important; min-height: 46px !important; padding: 0 10px !important; text-align: center !important; white-space: normal !important; } body.woocommerce-account .woocommerce-MyAccount-content { padding: 20px 16px !important; } body.woocommerce-account .woocommerce-EditAccountForm, body.woocommerce-account .woocommerce-address-fields__field-wrapper, body.woocommerce-account .burnigan-account-grid, body.woocommerce-account .woocommerce-Addresses, body.woocommerce-account:not(.logged-in) #customer_login { grid-template-columns: 1fr !important; } body.woocommerce-account form fieldset { padding: 18px 14px !important; } body.woocommerce-account .woocommerce-MyAccount-content .button, body.woocommerce-account .woocommerce-MyAccount-content button.button { width: 100% !important; } body.woocommerce-account .burnigan-account-hero { min-height: 190px !important; } body.woocommerce-account .woocommerce-Address { min-height: 0 !important; } } /* ========================================================= 30. MY ACCOUNT POLISH — v26 Keep this section LAST. ========================================================= */ body.woocommerce-account #main .woocommerce { grid-template-columns: 230px minmax(0, 1fr) !important; gap: 34px !important; width: min(1120px, calc(100% - 48px)) !important; margin: 44px auto 82px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { position: sticky !important; top: 108px !important; padding: 14px 0 0 !important; border-top: 1px solid #111 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation::before { margin-bottom: 12px !important; font-size: 8px !important; letter-spacing: .19em !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { border: 1px solid rgba(8,8,8,.12) !important; box-shadow: 0 12px 30px rgba(8,8,8,.035) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a { min-height: 50px !important; padding: 0 17px !important; font-size: 9px !important; letter-spacing: .09em !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { padding-left: 21px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a::after { content: "→" !important; margin-left: auto !important; opacity: .34 !important; font-size: 13px !important; transition: transform .2s ease, opacity .2s ease !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover::after, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a::after { opacity: 1 !important; transform: translateX(2px) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child a { color: #7b2424 !important; } body.woocommerce-account .burnigan-account-hero { min-height: 250px !important; padding: 46px 48px !important; border: 1px solid rgba(8,8,8,.12) !important; box-shadow: 0 18px 50px rgba(8,8,8,.035) !important; } body.woocommerce-account .burnigan-account-hero h2 { max-width: 610px !important; font-size: clamp(34px, 4.2vw, 58px) !important; line-height: .96 !important; } body.woocommerce-account .burnigan-account-grid { gap: 14px !important; } body.woocommerce-account .burnigan-account-card { min-height: 168px !important; padding: 25px !important; border-color: rgba(8,8,8,.12) !important; box-shadow: 0 10px 28px rgba(8,8,8,.025) !important; } body.woocommerce-account .burnigan-account-card__value { font-size: 29px !important; } body.woocommerce-account:not(.burnigan-account-dashboard) .woocommerce-MyAccount-content { padding: 36px !important; box-shadow: 0 14px 38px rgba(8,8,8,.03) !important; } @media (max-width: 1024px) { body.woocommerce-account #main .woocommerce { width: min(900px, calc(100% - 32px)) !important; gap: 18px !important; margin-top: 30px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { position: static !important; padding-top: 12px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { box-shadow: none !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a::after { display: none !important; } body.woocommerce-account .burnigan-account-hero { min-height: 220px !important; padding: 38px 34px !important; } } @media (max-width: 700px) { body.woocommerce-account #main .woocommerce { width: calc(100% - 20px) !important; margin: 18px auto 52px !important; gap: 14px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { grid-template-columns: 1fr !important; gap: 7px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { justify-content: flex-start !important; min-height: 44px !important; padding: 0 14px !important; text-align: left !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a::after { display: block !important; } body.woocommerce-account .burnigan-account-hero { min-height: 180px !important; padding: 28px 20px !important; } body.woocommerce-account .burnigan-account-hero h2 { font-size: 31px !important; line-height: 1 !important; } body.woocommerce-account .burnigan-account-card { min-height: 132px !important; padding: 18px !important; } body.woocommerce-account:not(.burnigan-account-dashboard) .woocommerce-MyAccount-content { padding: 18px 14px !important; } } /* ========================================================= 31. MY ACCOUNT MOBILE WIDTH FIX — v27 FINAL OVERRIDE — KEEP LAST ========================================================= */ /* Prevent account pages from creating horizontal overflow. */ body.woocommerce-account, body.woocommerce-account #page, body.woocommerce-account .site-main, body.woocommerce-account #main { max-width: 100% !important; overflow-x: clip !important; } @media (max-width: 1024px) { body.woocommerce-account #main .woocommerce { display: flex !important; flex-direction: column !important; grid-template-columns: none !important; align-items: stretch !important; width: calc(100% - 32px) !important; max-width: 900px !important; min-width: 0 !important; margin: 30px auto 70px !important; padding: 0 !important; gap: 20px !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-navigation, body.woocommerce-account .woocommerce-MyAccount-content, body.woocommerce-account .burnigan-account-dashboard-wrap, body.woocommerce-account .burnigan-account-hero, body.woocommerce-account .burnigan-account-grid { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { position: static !important; top: auto !important; float: none !important; } body.woocommerce-account .woocommerce-MyAccount-content { float: none !important; margin: 0 !important; } body.woocommerce-account .burnigan-account-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } @media (max-width: 700px) { body.woocommerce-account #main .woocommerce, body.woocommerce-account:not(.logged-in) #main .woocommerce { display: flex !important; flex-direction: column !important; width: calc(100% - 20px) !important; max-width: calc(100% - 20px) !important; min-width: 0 !important; margin: 18px auto 52px !important; padding: 0 !important; gap: 14px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { width: 100% !important; max-width: 100% !important; min-width: 0 !important; padding: 12px 0 0 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; gap: 7px !important; overflow: visible !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li, body.woocommerce-account .woocommerce-MyAccount-navigation li a { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; box-sizing: border-box !important; } body.woocommerce-account:not(.burnigan-account-dashboard) .woocommerce-MyAccount-content { padding: 18px 14px !important; } body.woocommerce-account .burnigan-account-dashboard-wrap { display: block !important; width: 100% !important; max-width: 100% !important; } body.woocommerce-account .burnigan-account-hero { width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 180px !important; margin: 0 0 10px !important; padding: 26px 18px !important; box-sizing: border-box !important; overflow: hidden !important; } body.woocommerce-account .burnigan-account-hero h2 { max-width: 100% !important; font-size: clamp(28px, 10vw, 38px) !important; line-height: 1 !important; overflow-wrap: anywhere !important; } body.woocommerce-account .burnigan-account-hero p { max-width: 100% !important; font-size: 11px !important; } body.woocommerce-account .burnigan-account-grid { display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; gap: 10px !important; } body.woocommerce-account .burnigan-account-card { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-EditAccountForm, body.woocommerce-account .woocommerce-address-fields__field-wrapper, body.woocommerce-account .woocommerce-Addresses, body.woocommerce-account #customer_login { display: grid !important; grid-template-columns: 1fr !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; } body.woocommerce-account form, body.woocommerce-account form fieldset, body.woocommerce-account form .form-row, body.woocommerce-account form input, body.woocommerce-account form select, body.woocommerce-account form textarea { max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } } /* ========================================================= 32. BURNIGAN CUSTOMER PORTAL + ADDRESS BOOK — v28 FINAL RESPONSIVE RELEASE — KEEP THIS SECTION LAST Verified against CrossPeak Address Book for WooCommerce 3.x: .address_book .addresses.address-book .wc-address-book-address .wc-address-book-address-default .wc-address-book-address-badges .wc-address-book-address-default-label .wc-address-book-meta .wc-address-book-edit .wc-address-book-delete .wc-address-book-make-default .wc-address-book-add-new-address ========================================================= */ /* ---------- Global account safety ---------- */ body.woocommerce-account, body.woocommerce-account #page, body.woocommerce-account #main, body.woocommerce-account .site-main { max-width: 100% !important; overflow-x: clip !important; } body.woocommerce-account #main .woocommerce { align-items: start !important; } /* ---------- Address Book page shell ---------- */ body.woocommerce-account .woocommerce-MyAccount-content .address_book { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header { display: flex !important; align-items: flex-end !important; justify-content: space-between !important; gap: 20px !important; width: 100% !important; margin: 0 0 16px !important; padding: 0 0 20px !important; border-bottom: 1px solid rgba(8, 8, 8, 0.13) !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header h3 { margin: 0 !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: clamp(25px, 3vw, 38px) !important; font-weight: 900 !important; line-height: 1.05 !important; letter-spacing: -0.045em !important; } /* Intro copy */ body.woocommerce-account .woocommerce-MyAccount-content .address_book > .myaccount_address { max-width: 720px !important; margin: 0 0 28px !important; color: #686863 !important; font-family: var(--burnigan-font) !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1.7 !important; } /* ---------- Add address button ---------- */ body.woocommerce-account .wc-address-book-add-new-address { flex: 0 0 auto !important; margin: 0 !important; } body.woocommerce-account .wc-address-book-add-new-address .button, body.woocommerce-account .wc-address-book-add-new-address a.button, body.woocommerce-account .wc-address-book-add-new-address span.button { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 190px !important; min-height: 46px !important; margin: 0 !important; padding: 0 18px !important; border: 1px solid #080808 !important; border-radius: 0 !important; background: #080808 !important; color: #fff !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .1em !important; line-height: 1.2 !important; text-transform: uppercase !important; text-decoration: none !important; white-space: nowrap !important; box-sizing: border-box !important; } body.woocommerce-account .wc-address-book-add-new-address a.button::before { content: "+" !important; margin-right: 9px !important; font-size: 16px !important; font-weight: 500 !important; line-height: 1 !important; } body.woocommerce-account .wc-address-book-add-new-address a.button:hover { background: #fff !important; color: #080808 !important; } body.woocommerce-account .wc-address-book-add-new-address span.button.disabled { border-color: #d2d2cc !important; background: #eeeeea !important; color: #8a8a84 !important; cursor: not-allowed !important; } /* ---------- Responsive card grid ---------- */ body.woocommerce-account .address_book .addresses.address-book { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .address_book .wc-address-book-address { position: relative !important; display: flex !important; flex-direction: column !important; min-width: 0 !important; min-height: 330px !important; margin: 0 !important; padding: 25px !important; border: 1px solid rgba(8, 8, 8, 0.13) !important; background: #fff !important; box-shadow: 0 12px 32px rgba(8, 8, 8, 0.025) !important; box-sizing: border-box !important; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease !important; } body.woocommerce-account .address_book .wc-address-book-address:hover { transform: translateY(-2px) !important; border-color: rgba(8, 8, 8, 0.48) !important; box-shadow: 0 18px 40px rgba(8, 8, 8, 0.06) !important; } body.woocommerce-account .address_book .wc-address-book-address-default { border-color: #080808 !important; } /* ---------- Card title and badge ---------- */ body.woocommerce-account .address_book .wc-address-book-address .woocommerce-Address-title { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 14px !important; margin: 0 0 20px !important; padding: 0 0 17px !important; border-bottom: 1px solid rgba(8, 8, 8, 0.10) !important; } body.woocommerce-account .address_book .wc-address-book-address .woocommerce-Address-title h3 { min-width: 0 !important; margin: 0 !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: clamp(18px, 2vw, 25px) !important; font-weight: 900 !important; line-height: 1.12 !important; letter-spacing: -0.035em !important; overflow-wrap: anywhere !important; text-transform: none !important; } body.woocommerce-account .wc-address-book-address-badges { flex: 0 0 auto !important; margin: 0 !important; } body.woocommerce-account .wc-address-book-address-default-label { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 26px !important; padding: 0 9px !important; border: 1px solid #080808 !important; border-radius: 0 !important; background: #080808 !important; color: #fff !important; font-family: var(--burnigan-font) !important; font-size: 7px !important; font-weight: 900 !important; letter-spacing: .13em !important; line-height: 1 !important; text-transform: uppercase !important; } /* ---------- Address body ---------- */ body.woocommerce-account .address_book .wc-address-book-address address { flex: 1 1 auto !important; min-width: 0 !important; margin: 0 0 24px !important; padding: 0 !important; border: 0 !important; color: #54544f !important; font-family: var(--burnigan-font) !important; font-size: 12px !important; font-style: normal !important; font-weight: 600 !important; line-height: 1.75 !important; overflow-wrap: anywhere !important; } /* ---------- Card actions ---------- */ body.woocommerce-account .address_book .wc-address-book-meta { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; width: 100% !important; margin-top: auto !important; padding-top: 18px !important; border-top: 1px solid rgba(8, 8, 8, 0.10) !important; } body.woocommerce-account .address_book .wc-address-book-meta .button, body.woocommerce-account .address_book .wc-address-book-meta a.button, body.woocommerce-account .address_book .wc-address-book-meta button.button { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-width: 0 !important; min-height: 39px !important; margin: 0 !important; padding: 0 13px !important; border: 1px solid rgba(8, 8, 8, 0.22) !important; border-radius: 0 !important; background: #fff !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: 8px !important; font-weight: 900 !important; letter-spacing: .08em !important; line-height: 1.15 !important; text-align: center !important; text-transform: uppercase !important; text-decoration: none !important; white-space: nowrap !important; box-sizing: border-box !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-edit { border-color: #080808 !important; background: #080808 !important; color: #fff !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-edit:hover { background: #fff !important; color: #080808 !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-make-default:hover { border-color: #080808 !important; background: #f4f4f0 !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-delete { margin-left: auto !important; border-color: rgba(123, 36, 36, .32) !important; color: #7b2424 !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-delete:hover { border-color: #7b2424 !important; background: #7b2424 !important; color: #fff !important; } /* Plugin may keep Set as Default in DOM for the default card. */ body.woocommerce-account .wc-address-book-address-default .wc-address-book-make-default { display: none !important; } /* ---------- Edit / add address form ---------- */ body.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper { width: 100% !important; } body.woocommerce-account .woocommerce-MyAccount-content form button[name="save_address"] { margin-top: 8px !important; } /* ---------- Tablet: one-column portal, two-column cards when possible ---------- */ @media (max-width: 1024px) { body.woocommerce-account #main .woocommerce { display: flex !important; flex-direction: column !important; width: min(920px, calc(100% - 32px)) !important; max-width: calc(100% - 32px) !important; min-width: 0 !important; margin: 30px auto 70px !important; padding: 0 !important; gap: 20px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation, body.woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header { align-items: center !important; } body.woocommerce-account .address_book .addresses.address-book { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } /* ---------- Mobile: fully stacked, no horizontal overflow ---------- */ @media (max-width: 700px) { body.woocommerce-account #main .woocommerce, body.woocommerce-account:not(.logged-in) #main .woocommerce { display: flex !important; flex-direction: column !important; width: calc(100% - 20px) !important; max-width: calc(100% - 20px) !important; min-width: 0 !important; margin: 18px auto 54px !important; padding: 0 !important; gap: 14px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation, body.woocommerce-account .woocommerce-MyAccount-content, body.woocommerce-account .address_book, body.woocommerce-account .address_book .addresses.address-book, body.woocommerce-account .address_book .wc-address-book-address { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header { display: grid !important; grid-template-columns: 1fr !important; align-items: stretch !important; gap: 14px !important; padding-bottom: 16px !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header h3 { font-size: 27px !important; } body.woocommerce-account .wc-address-book-add-new-address { width: 100% !important; } body.woocommerce-account .wc-address-book-add-new-address .button, body.woocommerce-account .wc-address-book-add-new-address a.button, body.woocommerce-account .wc-address-book-add-new-address span.button { width: 100% !important; min-width: 0 !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > .myaccount_address { margin-bottom: 20px !important; font-size: 10px !important; } body.woocommerce-account .address_book .addresses.address-book { grid-template-columns: 1fr !important; gap: 12px !important; } body.woocommerce-account .address_book .wc-address-book-address { min-height: 0 !important; padding: 19px !important; } body.woocommerce-account .address_book .wc-address-book-address .woocommerce-Address-title { gap: 10px !important; margin-bottom: 16px !important; padding-bottom: 14px !important; } body.woocommerce-account .address_book .wc-address-book-address .woocommerce-Address-title h3 { font-size: 21px !important; } body.woocommerce-account .address_book .wc-address-book-address address { margin-bottom: 18px !important; font-size: 11px !important; line-height: 1.7 !important; } body.woocommerce-account .address_book .wc-address-book-meta { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 7px !important; } body.woocommerce-account .address_book .wc-address-book-meta .button, body.woocommerce-account .address_book .wc-address-book-meta a.button, body.woocommerce-account .address_book .wc-address-book-meta button.button { width: 100% !important; min-height: 42px !important; padding: 0 9px !important; white-space: normal !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-delete { margin-left: 0 !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-make-default { grid-column: 1 / -1 !important; } } /* Very small phones */ @media (max-width: 390px) { body.woocommerce-account .address_book .wc-address-book-meta { grid-template-columns: 1fr !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-make-default { grid-column: auto !important; } } /* ========================================================= 33. CUSTOMER PORTAL FULL-WIDTH + ADDRESS BOOK FIX — v29 FINAL OVERRIDE — KEEP THIS SECTION LAST ========================================================= */ @media (min-width: 1025px) { body.woocommerce-account #main .woocommerce { display: grid !important; grid-template-columns: 240px minmax(0, 1fr) !important; gap: 34px !important; width: min(1440px, calc(100% - 64px)) !important; max-width: none !important; min-width: 0 !important; margin: 42px auto 86px !important; padding: 0 !important; align-items: start !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { width: 240px !important; min-width: 240px !important; max-width: 240px !important; } body.woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; box-sizing: border-box !important; } body.woocommerce-account:not(.burnigan-account-dashboard) .woocommerce-MyAccount-content { padding: 34px !important; } body.woocommerce-account .address_book .addresses.address-book { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 18px !important; } } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 18px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 0 18px !important; padding: 0 0 18px !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header h3 { min-width: 0 !important; max-width: 100% !important; overflow-wrap: anywhere !important; } body.woocommerce-account .wc-address-book-add-new-address { position: static !important; inset: auto !important; float: none !important; justify-self: end !important; align-self: center !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; transform: none !important; box-sizing: border-box !important; } body.woocommerce-account .wc-address-book-add-new-address .button, body.woocommerce-account .wc-address-book-add-new-address a.button, body.woocommerce-account .wc-address-book-add-new-address span.button { width: auto !important; max-width: 100% !important; min-width: 180px !important; margin: 0 !important; transform: none !important; white-space: nowrap !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses, body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address, body.woocommerce-account .address_book .addresses.address-book, body.woocommerce-account .address_book .wc-address-book-address { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .address_book .wc-address-book-meta { align-items: stretch !important; } body.woocommerce-account .address_book .wc-address-book-meta .button, body.woocommerce-account .address_book .wc-address-book-meta a.button, body.woocommerce-account .address_book .wc-address-book-meta button.button { flex: 1 1 auto !important; } @media (min-width: 701px) and (max-width: 1024px) { body.woocommerce-account #main .woocommerce { width: min(960px, calc(100% - 32px)) !important; max-width: calc(100% - 32px) !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header { grid-template-columns: minmax(0, 1fr) auto !important; } body.woocommerce-account .address_book .addresses.address-book { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } @media (max-width: 700px) { body.woocommerce-account #main .woocommerce, body.woocommerce-account:not(.logged-in) #main .woocommerce { display: flex !important; flex-direction: column !important; width: calc(100% - 20px) !important; max-width: calc(100% - 20px) !important; min-width: 0 !important; margin: 16px auto 52px !important; padding: 0 !important; gap: 14px !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-navigation, body.woocommerce-account .woocommerce-MyAccount-content, body.woocommerce-account .address_book, body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account:not(.burnigan-account-dashboard) .woocommerce-MyAccount-content { padding: 16px 12px !important; } body.woocommerce-account .woocommerce-MyAccount-content .address_book > header { display: grid !important; grid-template-columns: 1fr !important; align-items: stretch !important; gap: 12px !important; width: 100% !important; } body.woocommerce-account .wc-address-book-add-new-address { width: 100% !important; max-width: 100% !important; justify-self: stretch !important; } body.woocommerce-account .wc-address-book-add-new-address .button, body.woocommerce-account .wc-address-book-add-new-address a.button, body.woocommerce-account .wc-address-book-add-new-address span.button { width: 100% !important; max-width: 100% !important; min-width: 0 !important; white-space: normal !important; } body.woocommerce-account .address_book .addresses.address-book { grid-template-columns: 1fr !important; gap: 12px !important; } body.woocommerce-account .address_book .wc-address-book-address { min-height: 0 !important; padding: 18px !important; } body.woocommerce-account .address_book .wc-address-book-meta { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 7px !important; } body.woocommerce-account .address_book .wc-address-book-meta .button, body.woocommerce-account .address_book .wc-address-book-meta a.button, body.woocommerce-account .address_book .wc-address-book-meta button.button { width: 100% !important; min-width: 0 !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-make-default { grid-column: 1 / -1 !important; } } @media (max-width: 390px) { body.woocommerce-account .address_book .wc-address-book-meta { grid-template-columns: 1fr !important; } body.woocommerce-account .address_book .wc-address-book-meta .wc-address-book-make-default { grid-column: auto !important; } } /* ========================================================= 34. PREMIUM ORDERS EXPERIENCE — v30 FINAL OVERRIDE — KEEP THIS SECTION LAST ========================================================= */ /* Orders page content shell */ body.burnigan-account-orders .woocommerce-MyAccount-content { position: relative !important; min-height: 430px !important; padding: 36px !important; overflow: hidden !important; border: 1px solid rgba(8, 8, 8, 0.13) !important; background: #ffffff !important; box-shadow: 0 18px 46px rgba(8, 8, 8, 0.035) !important; } /* Editorial page heading */ body.burnigan-account-orders .woocommerce-MyAccount-content::before { content: "ORDER HISTORY" !important; display: block !important; margin: 0 0 24px !important; padding: 0 0 20px !important; border-bottom: 1px solid rgba(8, 8, 8, 0.12) !important; color: #080808 !important; font-family: var(--burnigan-font) !important; font-size: clamp(27px, 3vw, 42px) !important; font-weight: 900 !important; letter-spacing: -0.045em !important; line-height: 1 !important; } /* Empty order state */ body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info { position: relative !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 34px !important; width: 100% !important; min-height: 260px !important; margin: 0 !important; padding: 42px 44px 42px 150px !important; border: 1px solid rgba(8, 8, 8, 0.13) !important; border-left: 1px solid rgba(8, 8, 8, 0.13) !important; background: linear-gradient(135deg, #f8f8f4 0%, #ffffff 100%) !important; color: #4f4f4a !important; font-family: var(--burnigan-font) !important; font-size: 13px !important; font-weight: 650 !important; line-height: 1.65 !important; box-sizing: border-box !important; } /* Decorative order bag */ body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info::before { content: "" !important; display: block !important; position: absolute !important; left: 44px !important; top: 50% !important; width: 64px !important; height: 72px !important; transform: translateY(-50%) !important; border: 2px solid #080808 !important; background: transparent !important; box-sizing: border-box !important; } /* Bag handle */ body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info::after { content: "" !important; position: absolute !important; left: 59px !important; top: calc(50% - 50px) !important; width: 34px !important; height: 24px !important; border: 2px solid #080808 !important; border-bottom: 0 !important; border-radius: 20px 20px 0 0 !important; background: transparent !important; box-sizing: border-box !important; } /* Empty-state CTA */ body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info .button { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-width: 190px !important; min-height: 48px !important; margin: 0 !important; padding: 0 22px !important; border: 1px solid #080808 !important; border-radius: 0 !important; background: #080808 !important; color: #ffffff !important; font-family: var(--burnigan-font) !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: 0.11em !important; line-height: 1.2 !important; text-align: center !important; text-transform: uppercase !important; text-decoration: none !important; white-space: nowrap !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info .button::after { content: "→" !important; margin-left: 11px !important; font-size: 15px !important; font-weight: 500 !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info .button:hover { background: #ffffff !important; color: #080808 !important; } /* Existing orders table */ body.burnigan-account-orders .woocommerce-orders-table { margin: 0 !important; border-color: rgba(8, 8, 8, 0.13) !important; box-shadow: 0 12px 32px rgba(8, 8, 8, 0.025) !important; } body.burnigan-account-orders .woocommerce-orders-table thead th { padding: 16px 18px !important; background: #f5f5f1 !important; } body.burnigan-account-orders .woocommerce-orders-table tbody td { padding: 20px 18px !important; } body.burnigan-account-orders .woocommerce-orders-table .woocommerce-orders-table__cell-order-number a { color: #080808 !important; font-weight: 900 !important; text-decoration: underline !important; text-underline-offset: 4px !important; } /* Pagination */ body.burnigan-account-orders .woocommerce-pagination { margin-top: 20px !important; } body.burnigan-account-orders .woocommerce-pagination .button { min-height: 44px !important; } /* Tablet */ @media (min-width: 701px) and (max-width: 1024px) { body.burnigan-account-orders .woocommerce-MyAccount-content { min-height: 380px !important; padding: 28px !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info { min-height: 230px !important; padding: 34px 30px 34px 128px !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info::before { left: 34px !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info::after { left: 49px !important; } } /* Mobile */ @media (max-width: 700px) { body.burnigan-account-orders .woocommerce-MyAccount-content { min-height: 0 !important; padding: 18px 14px !important; } body.burnigan-account-orders .woocommerce-MyAccount-content::before { margin-bottom: 16px !important; padding-bottom: 15px !important; font-size: 28px !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 22px !important; min-height: 0 !important; padding: 120px 20px 22px !important; text-align: left !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info::before { left: 22px !important; top: 28px !important; width: 54px !important; height: 61px !important; transform: none !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info::after { left: 35px !important; top: 17px !important; width: 29px !important; height: 20px !important; } body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info .button { width: 100% !important; min-width: 0 !important; } } /* ========================================================= 35. BURNIGAN ACCOUNT PORTAL — UNIFIED LAYOUT SYSTEM — v36 THIS IS THE ONLY ACCOUNT LAYOUT SECTION. KEEP IT LAST. Replaces former sections 35-39 (v31, v32, v33, v34, v35), which each declared themselves final and fought each other. ROOT-CAUSE FIX The navigation was never constrained by a surviving 220/240px rule. It was resolving width:100% against an intermediate Blocksy/WooCommerce wrapper that was itself shrink-to-fit. The fix is structural, not another !important: 1. Any wrapper between .woocommerce and the two panels is neutralised with display:contents, so the navigation and the content become direct children of one known parent. 2. That parent is anchored to #main, whose width is known. 3. Both panels then share one grid/flex definition, so they are the same width by construction rather than by patch. ========================================================= */ /* --------------------------------------------------------- 35.1 Structural neutralisation Collapse unknown intermediate wrappers so the navigation and the content panel are always direct children of .woocommerce. display:contents removes the box without removing the element, so no WooCommerce or plugin class is renamed or lost. --------------------------------------------------------- */ body.logged-in.woocommerce-account #main .woocommerce > div:not(.woocommerce-MyAccount-navigation):not(.woocommerce-MyAccount-content):not(.woocommerce-notices-wrapper):not(.burnigan-account-dashboard-wrap), body.logged-in.woocommerce-account #main .woocommerce > .ct-container, body.logged-in.woocommerce-account #main .woocommerce > .ct-container-fluid, body.logged-in.woocommerce-account #main .woocommerce > .entry-content { display: contents !important; } /* Theme wrappers above .woocommerce must not impose their own width. */ body.woocommerce-account #main, body.woocommerce-account .site-main, body.woocommerce-account .content-area, body.woocommerce-account #main > .ct-container, body.woocommerce-account #main > .ct-container-fluid, body.woocommerce-account .site-main > .ct-container, body.woocommerce-account .site-main > .ct-container-fluid, body.woocommerce-account .entry-content, body.woocommerce-account article.page, body.woocommerce-account .page-content { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; float: none !important; box-sizing: border-box !important; } /* Overflow safety. clip does not create a scroll container, so position:sticky on the desktop sidebar keeps working. */ body.woocommerce-account, body.woocommerce-account #page, body.woocommerce-account #main, body.woocommerce-account .site-main { overflow-x: clip !important; } /* Universal box sizing for every account panel. */ body.woocommerce-account #main .woocommerce, body.woocommerce-account .woocommerce-MyAccount-navigation, body.woocommerce-account .woocommerce-MyAccount-navigation ul, body.woocommerce-account .woocommerce-MyAccount-content, body.woocommerce-account .burnigan-account-dashboard-wrap, body.woocommerce-account .burnigan-account-hero, body.woocommerce-account .burnigan-account-grid { min-width: 0 !important; box-sizing: border-box !important; } /* The dashboard wrapper emitted by the PHP snippet must never introduce a width of its own. It inherits the content panel. */ body.woocommerce-account .burnigan-account-dashboard-wrap { display: block !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; } /* Notices span the full portal on every breakpoint. */ body.woocommerce-account .woocommerce-notices-wrapper { grid-column: 1 / -1 !important; width: 100% !important; max-width: 100% !important; margin: 0 0 18px !important; } body.woocommerce-account .woocommerce-notices-wrapper:empty { display: none !important; margin: 0 !important; } /* --------------------------------------------------------- 35.2 Shared navigation skin (breakpoint-independent) Only colour, type and chrome live here. All width and layout decisions are made in the breakpoint blocks below, so no visual rule can ever constrain the box width. --------------------------------------------------------- */ body.woocommerce-account .woocommerce-MyAccount-navigation { border: 0 !important; border-radius: 0 !important; background: #080808 !important; float: none !important; clear: both !important; transform: none !important; } body.woocommerce-account .woocommerce-MyAccount-navigation::before { content: "BURNIGAN ACCOUNT" !important; display: block !important; color: rgba(255, 255, 255, 0.66) !important; font-weight: 900 !important; letter-spacing: 0.17em !important; text-transform: uppercase !important; border-bottom: 1px solid rgba(255, 255, 255, 0.16) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li { width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; list-style: none !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { display: flex !important; align-items: center !important; width: 100% !important; min-width: 0 !important; max-width: none !important; border: 1px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: rgba(255, 255, 255, 0.84) !important; font-weight: 850 !important; text-transform: uppercase !important; text-decoration: none !important; box-sizing: border-box !important; transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { border-color: rgba(255, 255, 255, 0.18) !important; background: rgba(255, 255, 255, 0.06) !important; color: #ffffff !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { border-color: #ffffff !important; background: #ffffff !important; color: #080808 !important; } /* Accessible, visible keyboard focus on the dark panel. */ body.woocommerce-account .woocommerce-MyAccount-navigation li a:focus-visible { outline: 2px solid #ffffff !important; outline-offset: 2px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child a { color: #ffb0b0 !important; border-color: rgba(255, 176, 176, 0.24) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child a:hover { border-color: rgba(255, 176, 176, 0.55) !important; background: rgba(255, 176, 176, 0.08) !important; color: #ffd4d4 !important; } @media (prefers-reduced-motion: reduce) { body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { transition: none !important; } } /* --------------------------------------------------------- 35.3 DESKTOP — 1025px and above Two stable columns. The sidebar column is sized by the grid track, and the sidebar fills that track at 100%. No fixed pixel width is written on the element itself, so nothing has to be un-set at smaller breakpoints. --------------------------------------------------------- */ @media (min-width: 1025px) { body.woocommerce-account #main .woocommerce { display: grid !important; grid-template-columns: 240px minmax(0, 1fr) !important; align-items: start !important; gap: 36px !important; width: min(1400px, calc(100% - 64px)) !important; max-width: 1400px !important; margin: 44px auto 86px !important; padding: 0 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { grid-column: 1 !important; align-self: start !important; position: sticky !important; top: 104px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 22px !important; box-shadow: 0 18px 44px rgba(8, 8, 8, 0.14) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation::before { margin: 0 0 16px !important; padding: 0 0 14px !important; font-size: 9px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { display: grid !important; grid-template-columns: 1fr !important; gap: 6px !important; width: 100% !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { justify-content: space-between !important; min-height: 48px !important; padding: 0 14px !important; font-size: 10px !important; letter-spacing: 0.09em !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a::after { content: "\2192" !important; margin-left: 12px !important; opacity: 0.5 !important; font-size: 13px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child { margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid rgba(255, 255, 255, 0.14) !important; } body.woocommerce-account .woocommerce-MyAccount-content { grid-column: 2 !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; } /* Dashboard content panel is a transparent shell; the hero and cards supply their own surfaces. */ body.burnigan-account-dashboard .woocommerce-MyAccount-content { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } body.woocommerce-account:not(.burnigan-account-dashboard) .woocommerce-MyAccount-content { padding: 34px !important; } body.woocommerce-account .burnigan-account-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; width: 100% !important; } body.woocommerce-account .address_book .addresses.address-book { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; width: 100% !important; } body.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row--first, body.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row--last, body.woocommerce-account .woocommerce-address-fields .form-row-first, body.woocommerce-account .woocommerce-address-fields .form-row-last { float: none !important; width: 100% !important; } body.woocommerce-account .woocommerce-EditAccountForm, body.woocommerce-account .woocommerce-address-fields__field-wrapper { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 18px !important; width: 100% !important; } body.woocommerce-account .woocommerce-EditAccountForm > fieldset, body.woocommerce-account .woocommerce-EditAccountForm > p.form-row-wide, body.woocommerce-account .woocommerce-EditAccountForm > p:last-of-type, body.woocommerce-account .woocommerce-address-fields__field-wrapper > .form-row-wide { grid-column: 1 / -1 !important; } } /* Large desktop: three address columns where the space exists. */ @media (min-width: 1400px) { body.woocommerce-account .address_book .addresses.address-book { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } } /* Laptop: narrower sidebar track and portal. */ @media (min-width: 1025px) and (max-width: 1280px) { body.woocommerce-account #main .woocommerce { grid-template-columns: 220px minmax(0, 1fr) !important; gap: 28px !important; width: min(1180px, calc(100% - 48px)) !important; } } /* --------------------------------------------------------- 35.4 TABLET AND MOBILE SHARED — 1024px and below One column. The navigation and the content are siblings in the same flex column with align-items:stretch, so they are the same width by construction. No width value is written on either panel, which is why nothing can desynchronise them. --------------------------------------------------------- */ @media (max-width: 1024px) { body.woocommerce-account #main .woocommerce { display: flex !important; flex-direction: column !important; align-items: stretch !important; width: calc(100% - 24px) !important; max-width: calc(100% - 24px) !important; margin: 24px auto 64px !important; padding: 0 !important; } /* Both panels are flex items that stretch. They must not declare their own width, or they stop matching. */ body.woocommerce-account .woocommerce-MyAccount-navigation, body.woocommerce-account .woocommerce-MyAccount-content { position: static !important; top: auto !important; left: auto !important; right: auto !important; float: none !important; display: block !important; flex: 0 0 auto !important; align-self: stretch !important; width: auto !important; min-width: 0 !important; max-width: none !important; inline-size: auto !important; min-inline-size: 0 !important; max-inline-size: none !important; margin-left: 0 !important; margin-right: 0 !important; transform: none !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { margin: 0 0 14px !important; box-shadow: none !important; } body.woocommerce-account .woocommerce-MyAccount-content { margin: 0 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { display: grid !important; width: 100% !important; max-width: 100% !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { justify-content: center !important; text-align: center !important; white-space: normal !important; overflow-wrap: break-word !important; border-color: rgba(255, 255, 255, 0.16) !important; } /* The desktop arrow glyph is meaningless in a tab grid. */ body.woocommerce-account .woocommerce-MyAccount-navigation li a::after { content: none !important; display: none !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child { margin-top: 0 !important; padding-top: 0 !important; border-top: 0 !important; } /* Every child of the content panel is contained. */ body.woocommerce-account .burnigan-account-dashboard-wrap, body.woocommerce-account .burnigan-account-hero, body.woocommerce-account .burnigan-account-grid, body.woocommerce-account .burnigan-account-card, body.woocommerce-account .address_book, body.woocommerce-account .address_book .addresses.address-book, body.woocommerce-account .address_book .wc-address-book-address, body.woocommerce-account .woocommerce-Addresses, body.woocommerce-account .woocommerce-Address, body.woocommerce-account .woocommerce-EditAccountForm, body.woocommerce-account .woocommerce-address-fields__field-wrapper, body.woocommerce-account .woocommerce-MyAccount-content form, body.woocommerce-account .woocommerce-MyAccount-content fieldset { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-content input, body.woocommerce-account .woocommerce-MyAccount-content select, body.woocommerce-account .woocommerce-MyAccount-content textarea, body.woocommerce-account .woocommerce-MyAccount-content button, body.woocommerce-account .woocommerce-MyAccount-content .button { max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } } /* --------------------------------------------------------- 35.5 TABLET — 701px to 1024px Five tabs across. Labels stay at a readable size. --------------------------------------------------------- */ @media (min-width: 701px) and (max-width: 1024px) { body.woocommerce-account #main .woocommerce { margin: 26px auto 68px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { padding: 16px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation::before { margin: 0 0 12px !important; padding: 0 0 12px !important; font-size: 9px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 8px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child { grid-column: auto !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { min-height: 48px !important; padding: 8px 6px !important; font-size: 10px !important; letter-spacing: 0.05em !important; line-height: 1.25 !important; } body.woocommerce-account:not(.burnigan-account-dashboard) .woocommerce-MyAccount-content { padding: 26px !important; } body.woocommerce-account .burnigan-account-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; } body.woocommerce-account .address_book .addresses.address-book { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; } body.woocommerce-account .burnigan-account-hero { padding: 34px 28px !important; } body.woocommerce-account .woocommerce-EditAccountForm, body.woocommerce-account .woocommerce-address-fields__field-wrapper { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 16px !important; } body.woocommerce-account .woocommerce-EditAccountForm > fieldset, body.woocommerce-account .woocommerce-EditAccountForm > p.form-row-wide, body.woocommerce-account .woocommerce-address-fields__field-wrapper > .form-row-wide { grid-column: 1 / -1 !important; } body.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row--first, body.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row--last, body.woocommerce-account .woocommerce-address-fields .form-row-first, body.woocommerce-account .woocommerce-address-fields .form-row-last { float: none !important; width: 100% !important; } } /* --------------------------------------------------------- 35.6 MOBILE — 700px and below Two-column tab grid, Log out spanning the full row. Labels are 11px, not the 6-7px used by the old patches. --------------------------------------------------------- */ @media (max-width: 700px) { body.woocommerce-account #main .woocommerce, body.woocommerce-account:not(.logged-in) #main .woocommerce { width: calc(100% - 12px) !important; max-width: calc(100% - 12px) !important; margin: 12px auto 48px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { padding: 12px !important; margin: 0 0 12px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation::before { margin: 0 0 10px !important; padding: 0 0 10px !important; font-size: 8px !important; border-bottom-color: rgba(255, 255, 255, 0.14) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation ul { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child { grid-column: 1 / -1 !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { min-height: 46px !important; padding: 8px 6px !important; font-size: 11px !important; letter-spacing: 0.04em !important; line-height: 1.2 !important; } body.woocommerce-account:not(.burnigan-account-dashboard) .woocommerce-MyAccount-content { padding: 16px 12px !important; } body.woocommerce-account .burnigan-account-grid, body.woocommerce-account .address_book .addresses.address-book, body.woocommerce-account .woocommerce-Addresses, body.woocommerce-account .woocommerce-EditAccountForm, body.woocommerce-account .woocommerce-address-fields__field-wrapper { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; } body.woocommerce-account .burnigan-account-card, body.woocommerce-account .address_book .wc-address-book-address { min-height: 0 !important; padding: 16px !important; } body.woocommerce-account .burnigan-account-hero { min-height: 0 !important; padding: 24px 16px !important; } body.woocommerce-account .burnigan-account-hero h2 { max-width: 100% !important; font-size: clamp(26px, 8.4vw, 36px) !important; line-height: 1.02 !important; overflow-wrap: break-word !important; } body.woocommerce-account .burnigan-account-hero p { max-width: 100% !important; font-size: 12px !important; } /* Full-width primary actions on phones. */ body.woocommerce-account .woocommerce-MyAccount-content button[type="submit"], body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button, body.woocommerce-account .wc-address-book-add-new-address { display: block !important; width: 100% !important; text-align: center !important; } } /* Very small phones: keep two columns but tighten the gutter. Labels are NOT reduced further, to preserve readability. */ @media (max-width: 400px) { body.woocommerce-account #main .woocommerce, body.woocommerce-account:not(.logged-in) #main .woocommerce { width: calc(100% - 8px) !important; max-width: calc(100% - 8px) !important; } body.woocommerce-account .woocommerce-MyAccount-navigation { padding: 10px !important; } body.woocommerce-account .woocommerce-MyAccount-navigation li a, body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { font-size: 10px !important; padding: 8px 4px !important; } } /* --------------------------------------------------------- 35.7 ADDRESS BOOK — CrossPeak plugin containment --------------------------------------------------------- */ body.woocommerce-account .address_book, body.woocommerce-account .addresses.address-book { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .address_book .wc-address-book-address { min-width: 0 !important; overflow-wrap: break-word !important; box-sizing: border-box !important; } body.woocommerce-account .wc-address-book-address-badges, body.woocommerce-account .wc-address-book-meta { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; min-width: 0 !important; } body.woocommerce-account .wc-address-book-edit, body.woocommerce-account .wc-address-book-delete, body.woocommerce-account .wc-address-book-make-default { min-height: 40px !important; max-width: 100% !important; white-space: normal !important; box-sizing: border-box !important; } body.woocommerce-account .wc-address-book-add-new-address { max-width: 100% !important; box-sizing: border-box !important; } body.woocommerce-account .wc-address-book-edit:focus-visible, body.woocommerce-account .wc-address-book-delete:focus-visible, body.woocommerce-account .wc-address-book-make-default:focus-visible, body.woocommerce-account .wc-address-book-add-new-address:focus-visible, body.woocommerce-account .woocommerce-MyAccount-content a:focus-visible, body.woocommerce-account .woocommerce-MyAccount-content button:focus-visible { outline: 2px solid #080808 !important; outline-offset: 2px !important; } /* --------------------------------------------------------- 35.8 ORDERS — readable table on desktop, cards on mobile --------------------------------------------------------- */ body.woocommerce-account .woocommerce-orders-table { width: 100% !important; max-width: 100% !important; table-layout: auto !important; } @media (max-width: 700px) { body.woocommerce-account .woocommerce-orders-table, body.woocommerce-account .woocommerce-orders-table tbody, body.woocommerce-account .woocommerce-orders-table tr, body.woocommerce-account .woocommerce-orders-table td { display: block !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-orders-table thead { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; } body.woocommerce-account .woocommerce-orders-table tr { margin: 0 0 12px !important; padding: 14px !important; border: 1px solid rgba(8, 8, 8, 0.12) !important; } body.woocommerce-account .woocommerce-orders-table td { display: flex !important; justify-content: space-between !important; gap: 12px !important; padding: 6px 0 !important; border: 0 !important; text-align: right !important; } body.woocommerce-account .woocommerce-orders-table td::before { content: attr(data-title) !important; flex: 0 0 auto !important; font-weight: 800 !important; text-align: left !important; text-transform: uppercase !important; font-size: 10px !important; letter-spacing: 0.06em !important; opacity: 0.6 !important; } body.woocommerce-account .woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions { justify-content: stretch !important; } body.woocommerce-account .woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions .button { width: 100% !important; text-align: center !important; } /* Empty-orders state must fit the viewport. */ body.burnigan-account-orders .woocommerce-MyAccount-content > .woocommerce-info { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } } /* --------------------------------------------------------- 35.9 ACCOUNT DETAILS — form containment --------------------------------------------------------- */ body.woocommerce-account .woocommerce-EditAccountForm fieldset { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-EditAccountForm .form-row, body.woocommerce-account .woocommerce-address-fields .form-row { min-width: 0 !important; box-sizing: border-box !important; } body.woocommerce-account .woocommerce-MyAccount-content input:focus-visible, body.woocommerce-account .woocommerce-MyAccount-content select:focus-visible, body.woocommerce-account .woocommerce-MyAccount-content textarea:focus-visible { outline: 2px solid #080808 !important; outline-offset: 1px !important; } /* ========================================================= END OF BURNIGAN MASTER WOOCOMMERCE CSS — PRODUCTION v36 ========================================================= */ /* ========================================================= 36. BURNIGAN BLOCKSY HEADER + MOBILE MENU — CLEAN v2 Keep this section LAST. Compatibility-first approach: - Blocksy controls layout, panel position and animation. - This section changes appearance only. - No forced fixed positioning, panel sizing or internal display overrides that can hide menu items. ========================================================= */ :root { --burnigan-header-bg: #ffffff; --burnigan-header-text: #080808; --burnigan-header-soft: #f4f4f1; --burnigan-header-border: rgba(8, 8, 8, 0.10); --burnigan-header-shadow: 0 10px 34px rgba(8, 8, 8, 0.08); --burnigan-header-transition: 220ms cubic-bezier(.2, .7, .2, 1); } /* ---------- Shared header foundation ---------- */ header#header, header.ct-header, #header, .ct-header { z-index: 9999; width: 100%; } header#header [data-row="middle"], header.ct-header [data-row="middle"], #header [data-row="middle"], .ct-header [data-row="middle"] { min-height: 78px; border-bottom: 1px solid var(--burnigan-header-border); background: rgba(255, 255, 255, 0.97); transition: min-height var(--burnigan-header-transition), background-color var(--burnigan-header-transition), box-shadow var(--burnigan-header-transition); } header#header [data-row="middle"] > div, header.ct-header [data-row="middle"] > div, #header [data-row="middle"] > div, .ct-header [data-row="middle"] > div { min-height: inherit; } header#header .ct-container, header.ct-header .ct-container, #header .ct-container, .ct-header .ct-container { width: 100%; max-width: 1380px; margin-inline: auto; padding-inline: clamp(20px, 2.3vw, 38px); } /* Sticky state: retain Blocksy mechanics, add only the finish */ header#header [data-sticky*="yes"], header.ct-header [data-sticky*="yes"], #header [data-sticky*="yes"], .ct-header [data-sticky*="yes"], header#header .ct-sticky-container, header.ct-header .ct-sticky-container, #header .ct-sticky-container, .ct-header .ct-sticky-container { border-bottom-color: transparent; background: rgba(255, 255, 255, 0.90) !important; -webkit-backdrop-filter: blur(14px) saturate(145%); backdrop-filter: blur(14px) saturate(145%); box-shadow: var(--burnigan-header-shadow); } /* ---------- Logo ---------- */ header#header .site-logo-container, header.ct-header .site-logo-container, #header .site-logo-container, .ct-header .site-logo-container { display: inline-flex; align-items: center; } header#header .site-logo-container img, header.ct-header .site-logo-container img, #header .site-logo-container img, .ct-header .site-logo-container img { display: block; width: auto !important; max-width: 260px !important; max-height: 38px !important; object-fit: contain; transition: transform var(--burnigan-header-transition); } header#header .site-logo-container:hover img, header.ct-header .site-logo-container:hover img, #header .site-logo-container:hover img, .ct-header .site-logo-container:hover img { transform: scale(1.012); } /* ---------- Desktop navigation ---------- */ @media (min-width: 1000px) { header#header .menu, header.ct-header .menu, #header .menu, .ct-header .menu { display: flex; align-items: center; gap: clamp(28px, 2.3vw, 44px); } header#header .menu > li, header.ct-header .menu > li, #header .menu > li, .ct-header .menu > li { position: relative; } header#header .menu > li > a, header.ct-header .menu > li > a, #header .menu > li > a, .ct-header .menu > li > a { position: relative; display: inline-flex; align-items: center; min-height: 48px; padding: 0 !important; color: var(--burnigan-header-text) !important; font-family: var(--burnigan-font, Arial, Helvetica, sans-serif); font-size: 12px; font-weight: 800; line-height: 1; letter-spacing: 0.09em; text-transform: uppercase; opacity: 1; transition: color var(--burnigan-header-transition), opacity var(--burnigan-header-transition); } header#header .menu > li > a::after, header.ct-header .menu > li > a::after, #header .menu > li > a::after, .ct-header .menu > li > a::after { content: ""; position: absolute; right: 0; bottom: 7px; left: 0; height: 2px; background: currentColor; transform: scaleX(0); transform-origin: right center; transition: transform var(--burnigan-header-transition); } header#header .menu > li:hover > a::after, header#header .menu > li.current-menu-item > a::after, header#header .menu > li.current-menu-ancestor > a::after, header.ct-header .menu > li:hover > a::after, header.ct-header .menu > li.current-menu-item > a::after, header.ct-header .menu > li.current-menu-ancestor > a::after, #header .menu > li:hover > a::after, #header .menu > li.current-menu-item > a::after, #header .menu > li.current-menu-ancestor > a::after, .ct-header .menu > li:hover > a::after, .ct-header .menu > li.current-menu-item > a::after, .ct-header .menu > li.current-menu-ancestor > a::after { transform: scaleX(1); transform-origin: left center; } header#header .menu > li > a:hover, header.ct-header .menu > li > a:hover, #header .menu > li > a:hover, .ct-header .menu > li > a:hover { color: var(--burnigan-header-text) !important; opacity: 0.62; } /* Dropdown appearance only; Blocksy keeps positioning/behavior */ header#header .sub-menu, header.ct-header .sub-menu, #header .sub-menu, .ct-header .sub-menu { padding: 12px; border: 1px solid var(--burnigan-header-border); border-radius: 0; background: rgba(255, 255, 255, 0.98); box-shadow: var(--burnigan-header-shadow); } header#header .sub-menu a, header.ct-header .sub-menu a, #header .sub-menu a, .ct-header .sub-menu a { padding: 12px 14px; color: var(--burnigan-header-text) !important; font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; transition: padding-left var(--burnigan-header-transition), background-color var(--burnigan-header-transition); } header#header .sub-menu a:hover, header.ct-header .sub-menu a:hover, #header .sub-menu a:hover, .ct-header .sub-menu a:hover { padding-left: 18px; background: var(--burnigan-header-soft); } header#header [data-column="end"], header.ct-header [data-column="end"], #header [data-column="end"], .ct-header [data-column="end"] { gap: 7px; } } /* ---------- Header action icons ---------- */ header#header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), header.ct-header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), #header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), .ct-header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ) { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; min-height: 42px; border-radius: 999px; color: var(--burnigan-header-text) !important; transition: background-color var(--burnigan-header-transition), transform var(--burnigan-header-transition); } header#header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ):hover, header.ct-header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ):hover, #header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ):hover, .ct-header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ):hover { background: var(--burnigan-header-soft); transform: translateY(-1px); } header#header svg, header.ct-header svg, #header svg, .ct-header svg { width: 21px; height: 21px; } /* ---------- Tablet/mobile header ---------- */ @media (max-width: 999.98px) { header#header [data-row="middle"], header.ct-header [data-row="middle"], #header [data-row="middle"], .ct-header [data-row="middle"] { min-height: 72px; } header#header .ct-container, header.ct-header .ct-container, #header .ct-container, .ct-header .ct-container { padding-inline: 18px; } header#header .site-logo-container img, header.ct-header .site-logo-container img, #header .site-logo-container img, .ct-header .site-logo-container img { max-width: 205px !important; max-height: 29px !important; } header#header [data-column="end"], header.ct-header [data-column="end"], #header [data-column="end"], .ct-header [data-column="end"] { gap: 3px; } header#header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), header.ct-header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), #header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), .ct-header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ) { min-width: 40px; min-height: 40px; padding: 0; } } @media (max-width: 420px) { header#header .ct-container, header.ct-header .ct-container, #header .ct-container, .ct-header .ct-container { padding-inline: 14px; } header#header .site-logo-container img, header.ct-header .site-logo-container img, #header .site-logo-container img, .ct-header .site-logo-container img { max-width: 184px !important; max-height: 26px !important; } header#header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), header.ct-header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), #header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ), .ct-header :is( .ct-header-search, .ct-account-item, .ct-cart-item, .ct-header-trigger ) { min-width: 36px; min-height: 36px; } } /* ---------- Native Blocksy mobile menu intentionally unstyled ---------- Burnigan Independent Mobile Navigation v5 supplies its own trigger, markup, panel, animation and accessibility behavior. Do not add #offcanvas or .ct-panel layout rules here. --------------------------------------------------------- */ /* Search overlay */ #search-modal .ct-search-form, .ct-search-form { max-width: 760px; margin-inline: auto; } #search-modal input[type="search"], .ct-search-form input[type="search"] { min-height: 58px; padding-inline: 18px; border: 0; border-bottom: 1px solid var(--burnigan-header-text); border-radius: 0; background: transparent; font-size: clamp(22px, 3vw, 36px); font-weight: 600; } /* Accessibility */ header#header :is(a, button):focus-visible, header.ct-header :is(a, button):focus-visible, #header :is(a, button):focus-visible, .ct-header :is(a, button):focus-visible { outline: 2px solid var(--burnigan-header-text); outline-offset: 3px; } @media (prefers-reduced-motion: reduce) { header#header *, header.ct-header *, #header *, .ct-header * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; } } /* ========================================================= 37. BURNIGAN PREMIUM HEADER REFINEMENT — v38 Keep this section LAST. Refines desktop polish and narrows the mobile drawer. ========================================================= */ /* ---------- Desktop: stronger premium presence ---------- */ @media (min-width: 1000px) { header#header [data-row="middle"], header.ct-header [data-row="middle"], #header [data-row="middle"], .ct-header [data-row="middle"] { min-height: 84px !important; background: rgba(255,255,255,.98) !important; } header#header .ct-container, header.ct-header .ct-container, #header .ct-container, .ct-header .ct-container { max-width: 1480px !important; padding-inline: clamp(28px, 3vw, 54px) !important; } header#header .site-logo-container img, header.ct-header .site-logo-container img, #header .site-logo-container img, .ct-header .site-logo-container img { max-width: 285px !important; max-height: 42px !important; } header#header .menu, header.ct-header .menu, #header .menu, .ct-header .menu { gap: clamp(34px, 2.7vw, 52px) !important; } header#header .menu > li > a, header.ct-header .menu > li > a, #header .menu > li > a, .ct-header .menu > li > a { min-height: 52px !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .14em !important; } header#header [data-column="end"], header.ct-header [data-column="end"], #header [data-column="end"], .ct-header [data-column="end"] { gap: 10px !important; } header#header :is(.ct-header-search,.ct-account-item,.ct-cart-item), header.ct-header :is(.ct-header-search,.ct-account-item,.ct-cart-item), #header :is(.ct-header-search,.ct-account-item,.ct-cart-item), .ct-header :is(.ct-header-search,.ct-account-item,.ct-cart-item) { min-width: 44px !important; min-height: 44px !important; border: 1px solid transparent; } header#header :is(.ct-header-search,.ct-account-item,.ct-cart-item):hover, header.ct-header :is(.ct-header-search,.ct-account-item,.ct-cart-item):hover, #header :is(.ct-header-search,.ct-account-item,.ct-cart-item):hover, .ct-header :is(.ct-header-search,.ct-account-item,.ct-cart-item):hover { border-color: rgba(8,8,8,.12); background: #fff !important; } } /* ---------- Sticky desktop: refined glass ---------- */ @media (min-width: 1000px) { header#header [data-sticky*="yes"], header.ct-header [data-sticky*="yes"], #header [data-sticky*="yes"], .ct-header [data-sticky*="yes"], header#header .ct-sticky-container, header.ct-header .ct-sticky-container, #header .ct-sticky-container, .ct-header .ct-sticky-container { background: rgba(255,255,255,.86) !important; -webkit-backdrop-filter: blur(18px) saturate(160%) !important; backdrop-filter: blur(18px) saturate(160%) !important; box-shadow: 0 14px 36px rgba(8,8,8,.09) !important; } } /* ---------- Mobile header proportions ---------- */ @media (max-width: 999.98px) { header#header [data-row="middle"], header.ct-header [data-row="middle"], #header [data-row="middle"], .ct-header [data-row="middle"] { min-height: 70px !important; } header#header .site-logo-container img, header.ct-header .site-logo-container img, #header .site-logo-container img, .ct-header .site-logo-container img { max-width: 190px !important; max-height: 27px !important; } } /* ---------- Mobile navigation ---------- The mobile navigation is intentionally excluded from this stylesheet. Use only the independent v5 PHP navigation. ========================================================= */ /* ========================================================= 38. INDEPENDENT MOBILE NAVIGATION COMPATIBILITY — v41 The master stylesheet contains no #offcanvas, .ct-panel, #menu-main-menu-1 or legacy .burnigan-mobile-nav rules. Mobile navigation is supplied exclusively by: Burnigan_Independent_Mobile_Navigation_Final_v5.php ========================================================= */ /* ========================================================= 39. SHOP ARCHIVE INTRO DISABLED — v41 Keep this section at the absolute end. Removes the generated SHOP / COLLECTION heading and its editorial description while preserving the Blocksy category tabs, sorting control, catalogue label and product grid. ========================================================= */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::before, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full)::after { display: none !important; content: none !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important; } /* Disable the title fallback when Blocksy shop tabs are absent. */ @supports selector(body:has(.ct-shop-tabs)) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ):not(:has(.ct-shop-tabs)) main#main > :is(.ct-container, .ct-container-full)::before { display: none !important; content: none !important; } } /* Pull the category navigation upward after removing the intro. */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { padding-top: 26px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs ul, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs .ct-tabs { margin-top: 0 !important; } @media (max-width: 700px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full) { padding-top: 0 !important; } } /* BURNIGAN — MOBILE HEADER ACCOUNT / TRIGGER SPACING FIX Paste at the absolute bottom of the master CSS. Keeps Search, Cart and Account visible while reserving space for the independent trigger. */ @media (max-width: 999px) { /* Reserve a dedicated slot on the right for the custom hamburger */ body.burnigan-independent-mobile-nav #header [data-row="middle"] .ct-container, body.burnigan-independent-mobile-nav #header [data-row="middle"] .ct-container-fluid, body.burnigan-independent-mobile-nav .site-header [data-row="middle"] .ct-container, body.burnigan-independent-mobile-nav .site-header [data-row="middle"] .ct-container-fluid { padding-right: 72px !important; box-sizing: border-box !important; } /* Keep the account item clear of the custom trigger */ body.burnigan-independent-mobile-nav #header [data-id="account"], body.burnigan-independent-mobile-nav #header .ct-header-account, body.burnigan-independent-mobile-nav .site-header [data-id="account"], body.burnigan-independent-mobile-nav .site-header .ct-header-account { position: relative !important; z-index: 10 !important; margin-right: 0 !important; opacity: 1 !important; visibility: visible !important; } /* Position the independent trigger inside the reserved right-side space */ body.burnigan-independent-mobile-nav .burnigan-final-trigger { top: calc(env(safe-area-inset-top, 0px) + 15px) !important; right: 12px !important; width: 46px !important; height: 46px !important; box-shadow: none !important; } } /* Narrow phones */ @media (max-width: 380px) { body.burnigan-independent-mobile-nav #header [data-row="middle"] .ct-container, body.burnigan-independent-mobile-nav #header [data-row="middle"] .ct-container-fluid, body.burnigan-independent-mobile-nav .site-header [data-row="middle"] .ct-container, body.burnigan-independent-mobile-nav .site-header [data-row="middle"] .ct-container-fluid { padding-right: 64px !important; } body.burnigan-independent-mobile-nav .burnigan-final-trigger { right: 9px !important; width: 44px !important; height: 44px !important; } } /* ========================================== BURNIGAN — 2 PRODUCTS PER ROW ON MOBILE Blocksy + WooCommerce ========================================== */ @media (max-width: 767px) { .woocommerce ul.products[data-products], .woocommerce-page ul.products[data-products], ul.products[data-products] { --shop-columns: 2 !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: 12px !important; row-gap: 24px !important; } .woocommerce ul.products[data-products] > li.product, .woocommerce-page ul.products[data-products] > li.product, ul.products[data-products] > li.product { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; float: none !important; clear: none !important; } /* Product image */ ul.products[data-products] > li.product img { width: 100% !important; height: auto !important; aspect-ratio: 3 / 4; object-fit: cover; } /* Product title */ ul.products[data-products] > li.product .woocommerce-loop-product__title { display: -webkit-box; overflow: hidden; margin-top: 9px !important; font-size: 12px !important; line-height: 1.35 !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } /* Price */ ul.products[data-products] > li.product .price { font-size: 13px !important; } /* Select options / Add to cart */ ul.products[data-products] > li.product .button { width: 100% !important; min-height: 38px; padding: 8px 5px !important; font-size: 9px !important; white-space: normal !important; } } /* ========================================================= 40. BURNIGAN PREMIUM SINGLE PRODUCT — v42 Authoritative desktop + mobile product system. Replaces all earlier single-product layout patches. ========================================================= */ body.single-product { --burnigan-product-ink: #080808; --burnigan-product-muted: #686864; --burnigan-product-line: rgba(8, 8, 8, 0.14); --burnigan-product-surface: #ffffff; --burnigan-product-page: #f4f4f1; background: var(--burnigan-product-page) !important; } body.single-product main#main { width: 100% !important; margin: 0 !important; padding: 0 !important; background: var(--burnigan-product-page) !important; } body.single-product main#main > :is(.ct-container, .ct-container-full) { width: calc(100% - 48px) !important; max-width: 1280px !important; margin: 0 auto !important; padding: 28px 0 92px !important; box-sizing: border-box !important; } body.single-product .woocommerce-breadcrumb { margin: 0 0 22px !important; color: #777772 !important; font-size: 9px !important; font-weight: 800 !important; letter-spacing: 0.13em !important; text-transform: uppercase !important; } body.single-product div.product { display: block !important; width: 100% !important; margin: 0 !important; padding: 42px 46px 56px !important; background: var(--burnigan-product-surface) !important; box-sizing: border-box !important; } body.single-product .product-entry-wrapper { display: grid !important; grid-template-columns: minmax(0, 1.08fr) minmax(390px, 0.92fr) !important; gap: clamp(44px, 5vw, 72px) !important; align-items: start !important; } body.single-product .woocommerce-product-gallery, body.single-product .summary { width: 100% !important; max-width: none !important; min-width: 0 !important; float: none !important; margin: 0 !important; } body.single-product .summary { position: sticky !important; top: 92px !important; padding: 0 !important; } body.single-product .summary .product_title { margin: 0 0 15px !important; color: var(--burnigan-product-ink) !important; font-size: clamp(30px, 2.45vw, 42px) !important; font-weight: 900 !important; line-height: 1.02 !important; letter-spacing: -0.045em !important; text-transform: uppercase !important; } body.single-product .summary .price { display: flex !important; align-items: center !important; gap: 10px !important; margin: 0 0 25px !important; color: var(--burnigan-product-ink) !important; font-size: 23px !important; font-weight: 900 !important; line-height: 1.2 !important; } body.single-product .summary .woocommerce-product-details__short-description { margin: 0 0 26px !important; padding: 0 0 26px !important; border-bottom: 1px solid var(--burnigan-product-line) !important; color: #484844 !important; font-size: 15px !important; line-height: 1.72 !important; } body.single-product .summary .woocommerce-product-details__short-description p:last-child { margin-bottom: 0 !important; } /* Gallery */ body.single-product .woocommerce-product-gallery__wrapper, body.single-product .woocommerce-product-gallery__image { width: 100% !important; margin: 0 !important; } body.single-product .woocommerce-product-gallery__image { overflow: hidden !important; background: #ecece8 !important; } body.single-product .woocommerce-product-gallery__image img { display: block !important; width: 100% !important; height: auto !important; aspect-ratio: 4 / 5 !important; object-fit: cover !important; object-position: center !important; transition: transform .45s ease, opacity .25s ease !important; } @media (hover: hover) and (pointer: fine) { body.single-product .woocommerce-product-gallery__image:hover img { transform: scale(1.018); } } body.single-product .flex-control-thumbs { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 10px !important; margin: 12px 0 0 !important; padding: 0 !important; } body.single-product .flex-control-thumbs li { width: 100% !important; margin: 0 !important; float: none !important; } body.single-product .flex-control-thumbs img { display: block !important; width: 100% !important; aspect-ratio: 1 / 1 !important; object-fit: cover !important; border: 1px solid transparent !important; opacity: .58 !important; } body.single-product .flex-control-thumbs img.flex-active, body.single-product .flex-control-thumbs img:hover { border-color: var(--burnigan-product-ink) !important; opacity: 1 !important; } /* Variations */ body.single-product form.variations_form, body.single-product form.cart { width: 100% !important; margin: 0 0 24px !important; padding: 0 0 25px !important; border-bottom: 1px solid var(--burnigan-product-line) !important; } body.single-product table.variations, body.single-product table.variations tbody, body.single-product table.variations tr, body.single-product table.variations th, body.single-product table.variations td { display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; text-align: left !important; } body.single-product table.variations tr { margin-bottom: 18px !important; } body.single-product table.variations th { margin-bottom: 10px !important; } body.single-product table.variations label { color: var(--burnigan-product-ink) !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .14em !important; text-transform: uppercase !important; } body.single-product .variable-items-wrapper { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; width: 100% !important; } body.single-product .variable-item { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 48px !important; min-height: 44px !important; margin: 0 !important; border: 1px solid rgba(8, 8, 8, .25) !important; border-radius: 0 !important; background: #fff !important; color: var(--burnigan-product-ink) !important; box-shadow: none !important; transition: background-color .18s ease, color .18s ease, border-color .18s ease !important; } body.single-product .variable-item:hover, body.single-product .variable-item.selected { border-color: var(--burnigan-product-ink) !important; background: var(--burnigan-product-ink) !important; color: #fff !important; } body.single-product .reset_variations { display: inline-block !important; margin-top: 10px !important; color: var(--burnigan-product-muted) !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase !important; } /* Quantity + Add to Cart */ body.single-product .woocommerce-variation-add-to-cart, body.single-product form.cart:not(.variations_form) { display: grid !important; grid-template-columns: 128px minmax(0, 1fr) !important; gap: 10px !important; align-items: stretch !important; } body.single-product .summary .quantity { display: grid !important; grid-template-columns: 40px minmax(42px, 1fr) 40px !important; width: 128px !important; min-width: 128px !important; height: 54px !important; margin: 0 !important; padding: 0 !important; border: 1px solid var(--burnigan-product-ink) !important; background: #fff !important; overflow: hidden !important; } body.single-product .summary .quantity input.qty { width: 100% !important; min-width: 0 !important; height: 52px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; font-size: 14px !important; font-weight: 800 !important; line-height: 52px !important; text-align: center !important; } body.single-product .summary .quantity :is(.ct-increase,.ct-decrease,.plus,.minus,button) { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 40px !important; min-width: 40px !important; height: 52px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--burnigan-product-ink) !important; } body.single-product .summary .single_add_to_cart_button { width: 100% !important; min-height: 54px !important; margin: 0 !important; border: 1px solid var(--burnigan-product-ink) !important; background: var(--burnigan-product-ink) !important; color: #fff !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .16em !important; text-transform: uppercase !important; } body.single-product .summary .single_add_to_cart_button:hover, body.single-product .summary .single_add_to_cart_button:focus-visible { background: #fff !important; color: var(--burnigan-product-ink) !important; } body.single-product .summary .single_add_to_cart_button.disabled { opacity: .48 !important; cursor: not-allowed !important; } /* Trust row */ body.single-product .burnigan-product-trust { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 1px !important; margin: 0 0 24px !important; border: 1px solid var(--burnigan-product-line) !important; background: var(--burnigan-product-line) !important; } body.single-product .burnigan-product-trust__item { display: flex !important; align-items: center !important; justify-content: center !important; min-height: 58px !important; padding: 10px !important; background: #fff !important; color: #343431 !important; font-size: 9px !important; font-weight: 900 !important; line-height: 1.35 !important; letter-spacing: .08em !important; text-align: center !important; text-transform: uppercase !important; } /* Product information accordions */ body.single-product .burnigan-product-information { width: 100% !important; margin: 0 !important; border-top: 1px solid var(--burnigan-product-line) !important; } body.single-product .burnigan-product-accordion { border-bottom: 1px solid var(--burnigan-product-line) !important; } body.single-product .burnigan-product-accordion__button { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 18px !important; width: 100% !important; min-height: 58px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--burnigan-product-ink) !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .14em !important; text-align: left !important; text-transform: uppercase !important; cursor: pointer !important; } body.single-product .burnigan-product-accordion__icon { flex: 0 0 auto !important; font-size: 18px !important; font-weight: 400 !important; transition: transform .22s ease !important; } body.single-product .burnigan-product-accordion.is-open .burnigan-product-accordion__icon { transform: rotate(45deg) !important; } body.single-product .burnigan-product-accordion__panel { display: grid !important; grid-template-rows: 0fr !important; transition: grid-template-rows .24s ease !important; } body.single-product .burnigan-product-accordion.is-open .burnigan-product-accordion__panel { grid-template-rows: 1fr !important; } body.single-product .burnigan-product-accordion__content { min-height: 0 !important; overflow: hidden !important; color: #4b4b47 !important; font-size: 14px !important; line-height: 1.72 !important; } body.single-product .burnigan-product-accordion.is-open .burnigan-product-accordion__content { padding: 0 0 22px !important; } body.single-product .burnigan-product-accordion__content > :first-child { margin-top: 0 !important; } body.single-product .burnigan-product-accordion__content > :last-child { margin-bottom: 0 !important; } /* Hide replaced default description/additional tabs, preserve Reviews */ body.single-product .woocommerce-tabs { margin-top: 56px !important; padding-top: 42px !important; border-top: 1px solid var(--burnigan-product-line) !important; } body.single-product .woocommerce-tabs ul.tabs li.description_tab, body.single-product .woocommerce-tabs ul.tabs li.additional_information_tab, body.single-product .woocommerce-tabs #tab-description, body.single-product .woocommerce-tabs #tab-additional_information { display: none !important; } /* Related products */ body.single-product :is(.related.products,.upsells.products) { width: 100% !important; margin: 62px 0 0 !important; padding: 48px 0 0 !important; border-top: 1px solid var(--burnigan-product-line) !important; } body.single-product :is(.related.products,.upsells.products) > h2 { margin: 0 0 30px !important; color: var(--burnigan-product-ink) !important; font-size: clamp(34px, 4vw, 58px) !important; font-weight: 900 !important; line-height: .92 !important; letter-spacing: -.055em !important; text-transform: uppercase !important; } body.single-product :is(.related.products,.upsells.products) ul.products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 36px 18px !important; } body.single-product :is(.related.products,.upsells.products) li.product { width: 100% !important; margin: 0 !important; float: none !important; } body.single-product :is(.related.products,.upsells.products) li.product img { width: 100% !important; aspect-ratio: 4 / 5 !important; object-fit: cover !important; } /* Sticky mobile purchase bar */ body.single-product .burnigan-sticky-cart { display: none; } /* Tablet */ @media (max-width: 1024px) { body.single-product main#main > :is(.ct-container,.ct-container-full) { width: calc(100% - 32px) !important; } body.single-product div.product { padding: 34px !important; } body.single-product .product-entry-wrapper { grid-template-columns: minmax(0, 1fr) minmax(340px, .88fr) !important; gap: 36px !important; } body.single-product .summary { position: static !important; } body.single-product :is(.related.products,.upsells.products) ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } } /* Mobile */ @media (max-width: 767px) { body.single-product { padding-bottom: 76px !important; } body.single-product main#main > :is(.ct-container,.ct-container-full) { width: 100% !important; max-width: none !important; padding: 8px 8px 54px !important; } body.single-product .woocommerce-breadcrumb { display: none !important; } body.single-product div.product { padding: 13px 8px 30px !important; } body.single-product .product-entry-wrapper { display: flex !important; flex-direction: column !important; gap: 0 !important; } body.single-product .woocommerce-product-gallery { order: 1 !important; margin: 0 0 18px !important; } body.single-product .summary { order: 2 !important; } body.single-product .summary .product_title { margin-bottom: 10px !important; font-size: clamp(24px, 7.4vw, 31px) !important; line-height: 1.04 !important; } body.single-product .summary .price { margin-bottom: 18px !important; font-size: 20px !important; } body.single-product .woocommerce-product-gallery__image img { aspect-ratio: 4 / 5 !important; } body.single-product .flex-control-thumbs { display: flex !important; gap: 8px !important; overflow-x: auto !important; scrollbar-width: none !important; -webkit-overflow-scrolling: touch !important; } body.single-product .flex-control-thumbs::-webkit-scrollbar { display: none !important; } body.single-product .flex-control-thumbs li { flex: 0 0 62px !important; width: 62px !important; } body.single-product .summary .woocommerce-product-details__short-description { font-size: 14px !important; line-height: 1.66 !important; } body.single-product .variable-items-wrapper { flex-wrap: nowrap !important; gap: 7px !important; overflow-x: auto !important; padding-bottom: 3px !important; scrollbar-width: none !important; } body.single-product .variable-items-wrapper::-webkit-scrollbar { display: none !important; } body.single-product .variable-item { flex: 0 0 47px !important; min-width: 47px !important; min-height: 44px !important; } body.single-product .woocommerce-variation-add-to-cart, body.single-product form.cart:not(.variations_form) { grid-template-columns: 108px minmax(0, 1fr) !important; gap: 8px !important; } body.single-product .summary .quantity { grid-template-columns: 34px minmax(38px,1fr) 34px !important; width: 108px !important; min-width: 108px !important; } body.single-product .summary .quantity :is(.ct-increase,.ct-decrease,.plus,.minus,button) { width: 34px !important; min-width: 34px !important; } body.single-product .burnigan-product-trust { grid-template-columns: 1fr !important; } body.single-product .burnigan-product-trust__item { min-height: 44px !important; } body.single-product .woocommerce-tabs { margin-top: 38px !important; padding-top: 28px !important; } body.single-product :is(.related.products,.upsells.products) { margin-top: 44px !important; padding-top: 34px !important; } body.single-product :is(.related.products,.upsells.products) > h2 { margin-bottom: 22px !important; font-size: 34px !important; } body.single-product :is(.related.products,.upsells.products) ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 26px 10px !important; } body.single-product :is(.related.products,.upsells.products) .woocommerce-loop-product__title { font-size: 10px !important; line-height: 1.35 !important; } body.single-product :is(.related.products,.upsells.products) li.product .price { font-size: 11px !important; } body.single-product :is(.related.products,.upsells.products) li.product .button { min-height: 39px !important; padding: 10px 5px !important; font-size: 8px !important; } body.single-product .burnigan-sticky-cart { position: fixed !important; right: 0 !important; bottom: 0 !important; left: 0 !important; z-index: 99990 !important; display: grid !important; grid-template-columns: minmax(0,1fr) minmax(150px,1.25fr) !important; gap: 10px !important; align-items: center !important; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) !important; border-top: 1px solid rgba(8,8,8,.14) !important; background: rgba(255,255,255,.97) !important; box-shadow: 0 -8px 28px rgba(8,8,8,.10) !important; transform: translateY(110%) !important; transition: transform .24s ease !important; } body.single-product .burnigan-sticky-cart.is-visible { transform: translateY(0) !important; } body.single-product .burnigan-sticky-cart__price { min-width: 0 !important; color: var(--burnigan-product-ink) !important; font-size: 16px !important; font-weight: 900 !important; white-space: nowrap !important; } body.single-product .burnigan-sticky-cart__button { min-height: 46px !important; border: 1px solid var(--burnigan-product-ink) !important; background: var(--burnigan-product-ink) !important; color: #fff !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .14em !important; text-transform: uppercase !important; } body.single-product .burnigan-sticky-cart__button:disabled { opacity: .48 !important; } } @media (max-width: 380px) { body.single-product div.product { padding-right: 6px !important; padding-left: 6px !important; } body.single-product .summary .product_title { font-size: 23px !important; } body.single-product :is(.related.products,.upsells.products) ul.products { gap: 22px 8px !important; } } @media (prefers-reduced-motion: reduce) { body.single-product .woocommerce-product-gallery__image img, body.single-product .burnigan-product-accordion__panel, body.single-product .burnigan-product-accordion__icon, body.single-product .burnigan-sticky-cart { transition: none !important; } } /* ========================================================= 41. SINGLE PRODUCT QUANTITY PICKER — v43 Authoritative order: minus | quantity | plus ========================================================= */ body.single-product .summary .quantity { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: stretch !important; width: 128px !important; min-width: 128px !important; max-width: 128px !important; height: 54px !important; min-height: 54px !important; margin: 0 !important; padding: 0 !important; border: 1px solid var(--burnigan-product-ink) !important; background: #ffffff !important; overflow: hidden !important; box-sizing: border-box !important; } body.single-product .summary .quantity input.qty { order: 2 !important; flex: 1 1 auto !important; display: block !important; width: auto !important; min-width: 42px !important; max-width: none !important; height: 52px !important; min-height: 52px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--burnigan-product-ink) !important; font-size: 14px !important; font-weight: 800 !important; line-height: 52px !important; text-align: center !important; text-indent: 0 !important; appearance: textfield !important; -webkit-appearance: none !important; -moz-appearance: textfield !important; box-sizing: border-box !important; } body.single-product .summary .quantity input.qty::-webkit-inner-spin-button, body.single-product .summary .quantity input.qty::-webkit-outer-spin-button { margin: 0 !important; appearance: none !important; -webkit-appearance: none !important; } body.single-product .summary .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { position: static !important; inset: auto !important; flex: 0 0 40px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 40px !important; min-width: 40px !important; max-width: 40px !important; height: 52px !important; min-height: 52px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--burnigan-product-ink) !important; font-size: 20px !important; font-weight: 400 !important; line-height: 1 !important; text-align: center !important; transform: none !important; box-sizing: border-box !important; } body.single-product .summary .quantity :is( .ct-decrease, .minus ) { order: 1 !important; border-right: 1px solid rgba(8, 8, 8, 0.12) !important; } body.single-product .summary .quantity :is( .ct-increase, .plus ) { order: 3 !important; border-left: 1px solid rgba(8, 8, 8, 0.12) !important; } /* Blocksy fallback where generic buttons are emitted without semantic classes */ body.single-product .summary .quantity > button:first-of-type { order: 3 !important; border-left: 1px solid rgba(8, 8, 8, 0.12) !important; border-right: 0 !important; } body.single-product .summary .quantity > button:nth-of-type(2) { order: 1 !important; border-right: 1px solid rgba(8, 8, 8, 0.12) !important; border-left: 0 !important; } body.single-product .summary .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ):hover, body.single-product .summary .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ):focus-visible { background: var(--burnigan-product-ink) !important; color: #ffffff !important; transform: none !important; } @media (max-width: 767px) { body.single-product .summary .quantity { width: 108px !important; min-width: 108px !important; max-width: 108px !important; } body.single-product .summary .quantity :is( .ct-increase, .ct-decrease, .plus, .minus, button ) { flex-basis: 34px !important; width: 34px !important; min-width: 34px !important; max-width: 34px !important; } } /* ========================================================= 42. PREMIUM PRODUCT FINAL REFINEMENT — v44 Mobile hierarchy, purchase row, gallery, reviews, footer. ========================================================= */ /* Desktop purchase row */ body.single-product .summary .woocommerce-variation-add-to-cart, body.single-product .summary form.cart:not(.variations_form) { grid-template-columns: 128px minmax(220px, 1fr) !important; align-items: stretch !important; } /* Keep quantity and Add to Cart visually connected */ body.single-product .summary .single_add_to_cart_button { min-height: 54px !important; background: #080808 !important; color: #ffffff !important; opacity: 1 !important; } body.single-product .summary .single_add_to_cart_button.disabled, body.single-product .summary .single_add_to_cart_button.wc-variation-selection-needed { opacity: .48 !important; } /* Reviews presentation */ body.single-product .woocommerce-tabs ul.tabs { margin-bottom: 28px !important; } body.single-product .woocommerce-tabs ul.tabs li.reviews_tab a { display: inline-flex !important; align-items: center !important; gap: 8px !important; } body.single-product .woocommerce-tabs ul.tabs li.reviews_tab a::before { content: "★★★★★"; color: #080808; font-size: 11px; letter-spacing: 1px; } body.single-product #reviews #comments .woocommerce-Reviews-title { margin-bottom: 18px !important; font-size: clamp(24px, 2.5vw, 34px) !important; line-height: 1 !important; } body.single-product #reviews .woocommerce-noreviews { margin: 0 !important; padding: 18px 0 !important; border-top: 1px solid rgba(8,8,8,.12) !important; border-bottom: 1px solid rgba(8,8,8,.12) !important; color: #5f5f5a !important; font-size: 13px !important; } /* Footer polish */ @media (min-width: 768px) { body.single-product footer .site-logo-container img, body.single-product footer .custom-logo { max-width: 190px !important; } } body.single-product footer a { transition: opacity .18s ease !important; } body.single-product footer a:hover, body.single-product footer a:focus-visible { opacity: .58 !important; } /* Mobile product page */ @media (max-width: 767px) { /* Less empty frame around product */ body.single-product main#main > :is(.ct-container,.ct-container-full) { padding-top: 6px !important; } body.single-product div.product { padding-top: 18px !important; } /* Title is still strong but no longer dominates the first screen */ body.single-product .summary .product_title { margin-bottom: 9px !important; font-size: clamp(22px, 6.7vw, 28px) !important; line-height: 1.08 !important; letter-spacing: -.035em !important; } body.single-product .summary .price { margin-bottom: 16px !important; font-size: 21px !important; } /* Larger, cleaner product photography */ body.single-product .woocommerce-product-gallery__image { border-radius: 2px !important; } body.single-product .woocommerce-product-gallery__image img { width: 100% !important; aspect-ratio: 4 / 5 !important; object-fit: cover !important; } /* Cleaner thumbnail rail */ body.single-product .flex-control-thumbs { margin-top: 10px !important; } body.single-product .flex-control-thumbs li { flex-basis: 70px !important; width: 70px !important; } body.single-product .flex-control-thumbs img { border-color: rgba(8,8,8,.12) !important; } /* Horizontal size rail */ body.single-product .variable-items-wrapper { gap: 8px !important; padding-bottom: 6px !important; } body.single-product .variable-item { flex-basis: 50px !important; min-width: 50px !important; min-height: 46px !important; } /* Quantity + Add to Cart in one row */ body.single-product .summary .woocommerce-variation-add-to-cart, body.single-product .summary form.cart:not(.variations_form) { display: grid !important; grid-template-columns: 112px minmax(0, 1fr) !important; gap: 9px !important; width: 100% !important; } body.single-product .summary .quantity { width: 112px !important; min-width: 112px !important; max-width: 112px !important; height: 52px !important; min-height: 52px !important; } body.single-product .summary .quantity input.qty { height: 50px !important; min-height: 50px !important; line-height: 50px !important; } body.single-product .summary .quantity :is( .ct-increase,.ct-decrease,.plus,.minus,button ) { height: 50px !important; min-height: 50px !important; } body.single-product .summary .single_add_to_cart_button { min-height: 52px !important; padding: 12px 8px !important; font-size: 9px !important; line-height: 1.25 !important; } /* Trust items as a compact premium strip */ body.single-product .burnigan-product-trust { grid-template-columns: repeat(3, minmax(0,1fr)) !important; margin-top: 4px !important; } body.single-product .burnigan-product-trust__item { min-height: 54px !important; padding: 8px 5px !important; font-size: 8px !important; letter-spacing: .06em !important; } /* Accordions */ body.single-product .burnigan-product-information { margin-top: 0 !important; } body.single-product .burnigan-product-accordion__button { min-height: 56px !important; font-size: 9px !important; } body.single-product .burnigan-product-accordion__content { font-size: 13px !important; line-height: 1.68 !important; } /* Reviews should not look like two empty default tabs */ body.single-product .woocommerce-tabs { margin-top: 30px !important; padding-top: 22px !important; } body.single-product .woocommerce-tabs ul.tabs { justify-content: flex-start !important; gap: 18px !important; margin-bottom: 22px !important; } body.single-product .woocommerce-tabs ul.tabs li a { font-size: 9px !important; } /* Sticky bar */ body.single-product .burnigan-sticky-cart { grid-template-columns: minmax(80px,.7fr) minmax(170px,1.3fr) !important; } /* Related products remain two per row */ body.single-product :is(.related.products,.upsells.products) ul.products { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } /* Slightly larger footer logo and calmer spacing */ body.single-product footer .site-logo-container img, body.single-product footer .custom-logo { max-width: 175px !important; } } @media (max-width: 360px) { body.single-product .summary .woocommerce-variation-add-to-cart, body.single-product .summary form.cart:not(.variations_form) { grid-template-columns: 104px minmax(0,1fr) !important; } body.single-product .summary .quantity { width: 104px !important; min-width: 104px !important; max-width: 104px !important; } body.single-product .burnigan-product-trust { grid-template-columns: 1fr !important; } } /* ========================================================= 43. PRODUCT PAGE FINISHING PASS — v45 Removes sticky cart, enlarges mobile gallery, and locks quantity + Add to Cart into one clean purchase row. ========================================================= */ /* Sticky purchase bar is intentionally removed */ body.single-product .burnigan-sticky-cart { display: none !important; } /* Strong purchase-row targeting for variable and simple products */ body.single-product .summary .woocommerce-variation-add-to-cart.variations_button, body.single-product .summary .woocommerce-variation-add-to-cart, body.single-product .summary form.cart:not(.variations_form) { display: grid !important; grid-template-columns: 128px minmax(220px, 1fr) !important; grid-auto-flow: column !important; gap: 10px !important; align-items: stretch !important; width: 100% !important; } body.single-product .summary .woocommerce-variation-add-to-cart.variations_button > .quantity, body.single-product .summary .woocommerce-variation-add-to-cart > .quantity, body.single-product .summary form.cart:not(.variations_form) > .quantity { grid-column: 1 !important; width: 128px !important; min-width: 128px !important; max-width: 128px !important; } body.single-product .summary .woocommerce-variation-add-to-cart.variations_button > .single_add_to_cart_button, body.single-product .summary .woocommerce-variation-add-to-cart > .single_add_to_cart_button, body.single-product .summary form.cart:not(.variations_form) > .single_add_to_cart_button { grid-column: 2 !important; width: 100% !important; min-width: 0 !important; max-width: none !important; } /* Hide the visually noisy reset link while preserving variation reset behavior */ body.single-product .summary .reset_variations { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; } /* Lighter gallery arrows */ body.single-product .flex-direction-nav a, body.single-product .ct-media-container .flex-direction-nav a, body.single-product .woocommerce-product-gallery .flex-direction-nav a { width: 38px !important; height: 38px !important; opacity: .72 !important; border-radius: 50% !important; background: rgba(255,255,255,.92) !important; box-shadow: 0 3px 14px rgba(8,8,8,.10) !important; } body.single-product .flex-direction-nav a:hover, body.single-product .woocommerce-product-gallery .flex-direction-nav a:hover { opacity: 1 !important; } /* Reviews: remove the blue/default active underline */ body.single-product .woocommerce-tabs ul.tabs li a { border-bottom-color: transparent !important; } body.single-product .woocommerce-tabs ul.tabs li.active a { border-bottom-color: #080808 !important; } /* Mobile finishing pass */ @media (max-width: 767px) { body.single-product { padding-bottom: 0 !important; } body.single-product main#main > :is(.ct-container,.ct-container-full) { padding-right: 4px !important; padding-left: 4px !important; } body.single-product div.product { padding: 16px 6px 30px !important; } /* Reduce title height and move photography higher */ body.single-product .summary .product_title { margin-bottom: 8px !important; font-size: clamp(21px, 6.2vw, 26px) !important; line-height: 1.08 !important; } /* * Blocksy places title in the summary. Keep the visual order intact, * but let the gallery use almost the full card width. */ body.single-product .woocommerce-product-gallery { width: calc(100% + 4px) !important; margin-right: -2px !important; margin-left: -2px !important; } body.single-product .woocommerce-product-gallery__image img { width: 100% !important; max-width: none !important; } body.single-product .flex-control-thumbs li { flex: 0 0 72px !important; width: 72px !important; } /* Definitive mobile purchase row */ body.single-product .summary .woocommerce-variation-add-to-cart.variations_button, body.single-product .summary .woocommerce-variation-add-to-cart, body.single-product .summary form.cart:not(.variations_form) { display: grid !important; grid-template-columns: 112px minmax(0, 1fr) !important; grid-auto-flow: column !important; gap: 9px !important; align-items: stretch !important; width: 100% !important; } body.single-product .summary .woocommerce-variation-add-to-cart.variations_button > .quantity, body.single-product .summary .woocommerce-variation-add-to-cart > .quantity, body.single-product .summary form.cart:not(.variations_form) > .quantity { grid-column: 1 !important; width: 112px !important; min-width: 112px !important; max-width: 112px !important; } body.single-product .summary .woocommerce-variation-add-to-cart.variations_button > .single_add_to_cart_button, body.single-product .summary .woocommerce-variation-add-to-cart > .single_add_to_cart_button, body.single-product .summary form.cart:not(.variations_form) > .single_add_to_cart_button { grid-column: 2 !important; width: 100% !important; min-width: 0 !important; max-width: none !important; min-height: 52px !important; margin: 0 !important; } /* Cleaner spacing around purchase controls */ body.single-product form.variations_form, body.single-product form.cart { margin-bottom: 20px !important; padding-bottom: 22px !important; } body.single-product .burnigan-product-trust { margin-top: 0 !important; } /* Remove any residual sticky-bar spacing from previous versions */ body.single-product footer { margin-bottom: 0 !important; } } @media (max-width: 360px) { body.single-product .summary .woocommerce-variation-add-to-cart.variations_button, body.single-product .summary .woocommerce-variation-add-to-cart, body.single-product .summary form.cart:not(.variations_form) { grid-template-columns: 104px minmax(0, 1fr) !important; } body.single-product .summary .woocommerce-variation-add-to-cart.variations_button > .quantity, body.single-product .summary .woocommerce-variation-add-to-cart > .quantity, body.single-product .summary form.cart:not(.variations_form) > .quantity { width: 104px !important; min-width: 104px !important; max-width: 104px !important; } } /* ========================================================= 44. ACCORDION + MOBILE SIZE WRAP FIX — v46 - Size options wrap instead of horizontal swipe - Accordion panels open/close correctly - Closed panels remain fully collapsed ========================================================= */ body.single-product .burnigan-product-accordion__button { -webkit-tap-highlight-color: transparent !important; touch-action: manipulation !important; } body.single-product .burnigan-product-accordion__panel { display: grid !important; grid-template-rows: 0fr !important; visibility: hidden !important; opacity: 0 !important; transition: grid-template-rows .24s ease, opacity .18s ease, visibility 0s linear .24s !important; } body.single-product .burnigan-product-accordion.is-open .burnigan-product-accordion__panel { grid-template-rows: 1fr !important; visibility: visible !important; opacity: 1 !important; transition: grid-template-rows .24s ease, opacity .18s ease, visibility 0s linear 0s !important; } body.single-product .burnigan-product-accordion__content { min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } body.single-product .burnigan-product-accordion.is-open .burnigan-product-accordion__content { padding: 0 0 22px !important; } /* Mobile sizes: wrap naturally, no sideways swipe */ @media (max-width: 767px) { body.single-product .variable-items-wrapper { display: flex !important; flex-wrap: wrap !important; overflow-x: visible !important; overflow-y: visible !important; gap: 8px !important; width: 100% !important; padding-bottom: 0 !important; } body.single-product .variable-item { flex: 0 0 calc((100% - 32px) / 5) !important; width: calc((100% - 32px) / 5) !important; min-width: 0 !important; max-width: none !important; min-height: 46px !important; margin: 0 !important; } } /* Four columns on very narrow phones for comfortable tap targets */ @media (max-width: 380px) { body.single-product .variable-item { flex-basis: calc((100% - 24px) / 4) !important; width: calc((100% - 24px) / 4) !important; } } /* ========================================================= 45. DESKTOP PRODUCT WIDTH + DESCRIPTION RESTORE — v47 - Wider desktop canvas - Larger gallery and balanced summary - Reliable desktop accordion presentation - Preserves all mobile behavior ========================================================= */ @media (min-width: 1025px) { body.single-product { --theme-normal-container-max-width: 1480px !important; } body.single-product main#main > :is(.ct-container, .ct-container-full) { width: calc(100% - 64px) !important; max-width: 1480px !important; margin-inline: auto !important; padding-top: 34px !important; padding-bottom: 100px !important; } body.single-product div.product { width: 100% !important; max-width: none !important; margin: 0 auto !important; padding: 46px 54px 62px !important; } body.single-product .product-entry-wrapper { display: grid !important; grid-template-columns: minmax(0, 1.18fr) minmax(430px, 0.82fr) !important; gap: clamp(56px, 5vw, 86px) !important; align-items: start !important; width: 100% !important; } body.single-product .woocommerce-product-gallery { width: 100% !important; max-width: none !important; } body.single-product .woocommerce-product-gallery__image img { width: 100% !important; max-height: 860px !important; aspect-ratio: 4 / 5 !important; object-fit: cover !important; } body.single-product .summary { width: 100% !important; max-width: 600px !important; position: sticky !important; top: 96px !important; } body.single-product .summary .product_title { margin-bottom: 16px !important; font-size: clamp(32px, 2.55vw, 44px) !important; line-height: 1.03 !important; } body.single-product .summary .price { margin-bottom: 24px !important; font-size: 24px !important; } body.single-product .summary .woocommerce-product-details__short-description { display: block !important; visibility: visible !important; opacity: 1 !important; width: 100% !important; max-width: 560px !important; margin: 0 0 26px !important; padding: 0 0 26px !important; border-bottom: 1px solid var(--burnigan-product-line) !important; } body.single-product .burnigan-product-trust { margin-top: 2px !important; } body.single-product .burnigan-product-information { display: block !important; width: 100% !important; } body.single-product .burnigan-product-accordion { display: block !important; width: 100% !important; } body.single-product .burnigan-product-accordion__button { width: 100% !important; } body.single-product .burnigan-product-accordion__panel { width: 100% !important; } body.single-product .woocommerce-tabs, body.single-product :is(.related.products, .upsells.products) { width: 100% !important; max-width: none !important; } body.single-product :is(.related.products, .upsells.products) ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } } /* Medium desktop */ @media (min-width: 1025px) and (max-width: 1280px) { body.single-product main#main > :is(.ct-container, .ct-container-full) { width: calc(100% - 40px) !important; } body.single-product div.product { padding: 40px !important; } body.single-product .product-entry-wrapper { grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr) !important; gap: 46px !important; } body.single-product .summary { max-width: 540px !important; } } /* ========================================================= 46. PREMIUM SHOP ARCHIVE — v48 Authoritative Shop / Category / Tag product-card system. ========================================================= */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) { --burnigan-shop-max: 1380px; --burnigan-shop-gap-x: 22px; --burnigan-shop-gap-y: 52px; --burnigan-shop-line: rgba(8, 8, 8, 0.13); --burnigan-shop-muted: #73736e; --burnigan-shop-card: #ffffff; background: #f4f4f1 !important; } /* Main archive canvas */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { width: calc(100% - 56px) !important; max-width: var(--burnigan-shop-max) !important; margin: 0 auto !important; padding: 52px 0 92px !important; box-sizing: border-box !important; } /* Compact control row */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count { margin: 13px 0 28px !important; color: var(--burnigan-shop-muted) !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .16em !important; text-transform: uppercase !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { margin: 0 0 28px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { min-width: 220px !important; height: 46px !important; border: 1px solid var(--burnigan-shop-line) !important; background: var(--burnigan-shop-card) !important; font-size: 11px !important; font-weight: 700 !important; } /* Product grid */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { clear: both !important; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: var(--burnigan-shop-gap-y) var(--burnigan-shop-gap-x) !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::before, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::after { display: none !important; content: none !important; } /* Product card */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product { position: relative !important; display: flex !important; flex-direction: column !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; text-align: left !important; } /* Image area */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product :is( .ct-media-container, figure, .woocommerce-loop-product__link ) { overflow: hidden !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product img { display: block !important; width: 100% !important; height: auto !important; aspect-ratio: 4 / 5 !important; margin: 0 0 17px !important; object-fit: cover !important; object-position: center !important; background: #e9e9e5 !important; transition: transform .42s ease, opacity .28s ease !important; } @media (hover: hover) and (pointer: fine) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product:hover img { transform: scale(1.018) !important; opacity: .96 !important; } } /* Titles */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .woocommerce-loop-product__title { display: -webkit-box !important; min-height: 2.75em !important; margin: 0 0 8px !important; padding: 0 !important; overflow: hidden !important; color: #080808 !important; font-size: 13px !important; font-weight: 900 !important; line-height: 1.36 !important; letter-spacing: -.01em !important; text-transform: uppercase !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; } /* Price */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .price { display: flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 7px !important; margin: 0 0 15px !important; color: #080808 !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.3 !important; } /* Buttons aligned across cards */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product :is(.button, .added_to_cart) { width: 100% !important; min-height: 46px !important; margin-top: auto !important; padding: 13px 12px !important; border: 1px solid #080808 !important; background: #080808 !important; color: #ffffff !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .14em !important; text-align: center !important; text-transform: uppercase !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product :is(.button, .added_to_cart):hover, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product :is(.button, .added_to_cart):focus-visible { background: transparent !important; color: #080808 !important; } /* Minimal sale badge */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .onsale { top: 12px !important; right: 12px !important; left: auto !important; min-width: auto !important; min-height: auto !important; padding: 8px 10px !important; border: 0 !important; background: #080808 !important; color: #ffffff !important; font-size: 8px !important; font-weight: 900 !important; letter-spacing: .12em !important; text-transform: uppercase !important; } /* Pagination */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) nav.woocommerce-pagination { margin-top: 64px !important; } /* Tablet */ @media (max-width: 1080px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } } /* Mobile */ @media (max-width: 767px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) { --burnigan-shop-gap-x: 9px; --burnigan-shop-gap-y: 30px; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { width: 100% !important; max-width: none !important; padding: 30px 8px 60px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { width: 100% !important; float: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-result-count { margin: 0 0 13px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { margin: 0 0 24px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering select { width: 100% !important; min-width: 0 !important; } /* Two products per row */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product img { margin-bottom: 10px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .woocommerce-loop-product__title { min-height: 2.7em !important; margin-bottom: 5px !important; font-size: 10px !important; line-height: 1.35 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .price { margin-bottom: 10px !important; font-size: 11px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product :is(.button, .added_to_cart) { min-height: 39px !important; padding: 10px 5px !important; font-size: 7.5px !important; letter-spacing: .10em !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .onsale { top: 7px !important; right: 7px !important; padding: 6px 7px !important; font-size: 7px !important; } } /* Very small phones */ @media (max-width: 370px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full) { padding-right: 6px !important; padding-left: 6px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) { --burnigan-shop-gap-x: 7px; } } /* ========================================================= 47. PREMIUM PRODUCT CARDS — v49 Secondary-image hover, cleaner actions, subtle motion. ========================================================= */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product { overflow: visible !important; transform: translateY(0); transition: transform .24s ease !important; } @media (hover: hover) and (pointer: fine) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product:hover { transform: translateY(-3px); } } /* Secondary product image injected by the companion PHP snippet */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .burnigan-secondary-image { position: absolute !important; top: 0 !important; right: 0 !important; left: 0 !important; z-index: 2 !important; display: block !important; width: 100% !important; aspect-ratio: 4 / 5 !important; overflow: hidden !important; pointer-events: none !important; opacity: 0 !important; visibility: hidden !important; transition: opacity .34s ease, visibility 0s linear .34s !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .burnigan-secondary-image img { display: block !important; width: 100% !important; height: 100% !important; margin: 0 !important; object-fit: cover !important; object-position: center !important; transform: scale(1.01) !important; transition: transform .45s ease !important; } @media (hover: hover) and (pointer: fine) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product:hover .burnigan-secondary-image { opacity: 1 !important; visibility: visible !important; transition-delay: 0s !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product:hover .burnigan-secondary-image img { transform: scale(1.025) !important; } } /* Ensure card text stays above any visual overlay */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product :is( .woocommerce-loop-product__title, .price, .button, .added_to_cart ) { position: relative !important; z-index: 3 !important; } /* Refined product-card title and price motion */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .woocommerce-loop-product__title, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .price { transition: color .2s ease, transform .2s ease !important; } @media (hover: hover) and (pointer: fine) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product:hover .woocommerce-loop-product__title { transform: translateY(-1px); } } /* Premium action treatment */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .button { position: relative !important; overflow: hidden !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .button::after { content: "→" !important; display: inline-block !important; margin-left: 8px !important; font-size: 12px !important; line-height: 1 !important; transform: translateX(0); transition: transform .18s ease !important; } @media (hover: hover) and (pointer: fine) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .button:hover::after { transform: translateX(3px); } } /* New badge injected by PHP */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .burnigan-new-badge { position: absolute !important; top: 12px !important; left: 12px !important; z-index: 6 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 26px !important; padding: 6px 9px !important; border: 1px solid rgba(255,255,255,.7) !important; background: rgba(255,255,255,.92) !important; color: #080808 !important; font-size: 8px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: .14em !important; text-transform: uppercase !important; } /* Mobile: no hover image swapping, calmer cards */ @media (max-width: 767px) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product { transform: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .burnigan-secondary-image { display: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .button::after { margin-left: 5px !important; font-size: 10px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product .burnigan-new-badge { top: 7px !important; left: 7px !important; min-height: 22px !important; padding: 5px 7px !important; font-size: 7px !important; } } @media (prefers-reduced-motion: reduce) { body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products > li.product * { transition: none !important; } } /* ========================================================= 48. PREMIUM HEADER & NAVIGATION — v51 Blocksy-focused desktop header, sticky state, nav motion, account/cart polish, and premium mobile drawer. ========================================================= */ :root { --burnigan-header-height: 78px; --burnigan-header-bg: rgba(255, 255, 255, .94); --burnigan-header-bg-solid: #ffffff; --burnigan-header-text: #080808; --burnigan-header-line: rgba(8, 8, 8, .10); --burnigan-header-shadow: 0 10px 30px rgba(0, 0, 0, .055); --burnigan-header-blur: 18px; } /* Main Blocksy header shell */ #header, .ct-header { position: relative; z-index: 9990 !important; } #header [data-row], .ct-header [data-row] { transition: background-color .24s ease, border-color .24s ease, box-shadow .24s ease, backdrop-filter .24s ease !important; } /* Desktop primary row */ @media (min-width: 1000px) { #header [data-device="desktop"] [data-row="middle"], .ct-header [data-device="desktop"] [data-row="middle"] { min-height: var(--burnigan-header-height) !important; border-bottom: 1px solid var(--burnigan-header-line) !important; background: var(--burnigan-header-bg) !important; backdrop-filter: blur(var(--burnigan-header-blur)) saturate(140%) !important; -webkit-backdrop-filter: blur(var(--burnigan-header-blur)) saturate(140%) !important; } body.burnigan-header-scrolled #header [data-device="desktop"] [data-row="middle"], body.burnigan-header-scrolled .ct-header [data-device="desktop"] [data-row="middle"] { background: var(--burnigan-header-bg-solid) !important; box-shadow: var(--burnigan-header-shadow) !important; } /* Wider, calmer header canvas */ #header [data-device="desktop"] .ct-container, .ct-header [data-device="desktop"] .ct-container { width: calc(100% - 56px) !important; max-width: 1440px !important; margin-inline: auto !important; } /* Brand/logo */ #header [data-device="desktop"] .site-branding, .ct-header [data-device="desktop"] .site-branding { transition: transform .22s ease !important; transform-origin: left center !important; } body.burnigan-header-scrolled #header [data-device="desktop"] .site-branding, body.burnigan-header-scrolled .ct-header [data-device="desktop"] .site-branding { transform: scale(.96) !important; } #header [data-device="desktop"] .site-logo-container img, .ct-header [data-device="desktop"] .site-logo-container img { max-height: 42px !important; width: auto !important; object-fit: contain !important; } /* Primary navigation */ #header [data-device="desktop"] .menu, .ct-header [data-device="desktop"] .menu { display: flex !important; align-items: center !important; gap: clamp(22px, 2vw, 34px) !important; } #header [data-device="desktop"] .menu > li, .ct-header [data-device="desktop"] .menu > li { position: relative !important; } #header [data-device="desktop"] .menu > li > a, .ct-header [data-device="desktop"] .menu > li > a { position: relative !important; min-height: 76px !important; padding: 0 !important; color: var(--burnigan-header-text) !important; font-size: 10px !important; font-weight: 900 !important; line-height: 76px !important; letter-spacing: .14em !important; text-transform: uppercase !important; transition: opacity .18s ease !important; } #header [data-device="desktop"] .menu > li > a::after, .ct-header [data-device="desktop"] .menu > li > a::after { content: "" !important; position: absolute !important; right: 0 !important; bottom: 20px !important; left: 0 !important; height: 1px !important; background: currentColor !important; transform: scaleX(0) !important; transform-origin: right center !important; transition: transform .22s ease !important; } #header [data-device="desktop"] .menu > li:hover > a::after, #header [data-device="desktop"] .menu > li.current-menu-item > a::after, #header [data-device="desktop"] .menu > li.current-menu-ancestor > a::after, .ct-header [data-device="desktop"] .menu > li:hover > a::after, .ct-header [data-device="desktop"] .menu > li.current-menu-item > a::after, .ct-header [data-device="desktop"] .menu > li.current-menu-ancestor > a::after { transform: scaleX(1) !important; transform-origin: left center !important; } /* Dropdown menus */ #header [data-device="desktop"] .sub-menu, .ct-header [data-device="desktop"] .sub-menu { min-width: 230px !important; padding: 14px !important; border: 1px solid var(--burnigan-header-line) !important; background: #fff !important; box-shadow: 0 18px 50px rgba(0, 0, 0, .09) !important; } #header [data-device="desktop"] .sub-menu a, .ct-header [data-device="desktop"] .sub-menu a { padding: 12px 14px !important; color: #080808 !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase !important; } #header [data-device="desktop"] .sub-menu a:hover, .ct-header [data-device="desktop"] .sub-menu a:hover { background: #f3f3ef !important; } /* Right-side actions */ #header [data-device="desktop"] :is( .ct-header-search, .ct-header-account, .ct-header-cart, .ct-header-wishlist ), .ct-header [data-device="desktop"] :is( .ct-header-search, .ct-header-account, .ct-header-cart, .ct-header-wishlist ) { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 42px !important; min-height: 42px !important; border-radius: 50% !important; transition: background-color .18s ease, transform .18s ease !important; } #header [data-device="desktop"] :is( .ct-header-search, .ct-header-account, .ct-header-cart, .ct-header-wishlist ):hover, .ct-header [data-device="desktop"] :is( .ct-header-search, .ct-header-account, .ct-header-cart, .ct-header-wishlist ):hover { background: #f1f1ed !important; transform: translateY(-1px) !important; } /* Cart count */ #header [data-device="desktop"] .ct-cart-item, .ct-header [data-device="desktop"] .ct-cart-item { position: relative !important; } #header [data-device="desktop"] .ct-cart-item-count, .ct-header [data-device="desktop"] .ct-cart-item-count { top: -7px !important; right: -9px !important; min-width: 18px !important; height: 18px !important; padding: 0 5px !important; border: 2px solid #fff !important; border-radius: 999px !important; background: #080808 !important; color: #fff !important; font-size: 8px !important; font-weight: 900 !important; line-height: 14px !important; } } /* Homepage header: overlays hero while remaining readable */ @media (min-width: 1000px) { body.home:not(.burnigan-header-scrolled) #header, body.home:not(.burnigan-header-scrolled) .ct-header { position: absolute !important; top: 0 !important; right: 0 !important; left: 0 !important; width: 100% !important; } body.home:not(.burnigan-header-scrolled) #header [data-device="desktop"] [data-row="middle"], body.home:not(.burnigan-header-scrolled) .ct-header [data-device="desktop"] [data-row="middle"] { border-bottom-color: rgba(255,255,255,.25) !important; background: linear-gradient( to bottom, rgba(255,255,255,.90), rgba(255,255,255,.72) ) !important; } } /* Mobile header */ @media (max-width: 999px) { #header [data-device="mobile"] [data-row="middle"], .ct-header [data-device="mobile"] [data-row="middle"] { min-height: 66px !important; border-bottom: 1px solid var(--burnigan-header-line) !important; background: rgba(255,255,255,.96) !important; backdrop-filter: blur(16px) saturate(140%) !important; -webkit-backdrop-filter: blur(16px) saturate(140%) !important; } body.burnigan-header-scrolled #header [data-device="mobile"] [data-row="middle"], body.burnigan-header-scrolled .ct-header [data-device="mobile"] [data-row="middle"] { box-shadow: 0 8px 24px rgba(0,0,0,.055) !important; } #header [data-device="mobile"] .ct-container, .ct-header [data-device="mobile"] .ct-container { width: 100% !important; padding-inline: 16px !important; } #header [data-device="mobile"] .site-logo-container img, .ct-header [data-device="mobile"] .site-logo-container img { max-height: 34px !important; } #header [data-device="mobile"] :is( .ct-header-trigger, .ct-header-search, .ct-header-account, .ct-header-cart ), .ct-header [data-device="mobile"] :is( .ct-header-trigger, .ct-header-search, .ct-header-account, .ct-header-cart ) { min-width: 40px !important; min-height: 40px !important; border-radius: 50% !important; } /* Premium mobile off-canvas */ #offcanvas, .ct-panel { --side-panel-width: min(88vw, 390px) !important; } #offcanvas .ct-panel-content, .ct-panel .ct-panel-content { background: #fff !important; } #offcanvas .mobile-menu, .ct-panel .mobile-menu { padding: 28px 22px 36px !important; } #offcanvas .mobile-menu > li, .ct-panel .mobile-menu > li { border-bottom: 1px solid rgba(8,8,8,.09) !important; } #offcanvas .mobile-menu > li > a, .ct-panel .mobile-menu > li > a { min-height: 58px !important; padding: 0 !important; color: #080808 !important; font-size: 14px !important; font-weight: 900 !important; line-height: 58px !important; letter-spacing: .08em !important; text-transform: uppercase !important; } #offcanvas .sub-menu, .ct-panel .sub-menu { padding: 0 0 16px 14px !important; } #offcanvas .sub-menu a, .ct-panel .sub-menu a { padding: 9px 0 !important; color: #5e5e59 !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .07em !important; text-transform: uppercase !important; } } /* Better keyboard focus */ #header a:focus-visible, #header button:focus-visible, .ct-header a:focus-visible, .ct-header button:focus-visible, #offcanvas a:focus-visible, #offcanvas button:focus-visible { outline: 2px solid #080808 !important; outline-offset: 3px !important; } /* Motion accessibility */ @media (prefers-reduced-motion: reduce) { #header *, .ct-header *, #offcanvas * { transition: none !important; } } /* ========================================================= 99. MIGRATED CUSTOMIZER CSS — v1.1.2 Source: Appearance > Customize > Additional CSS The user can remove the migrated block from Additional CSS after installing this release. ========================================================= */ /* Burnigan — Show coupon name inside Cart Totals */ .woocommerce-cart .cart_totals tr.cart-discount th { display: table-cell !important; visibility: visible !important; opacity: 1 !important; color: #111 !important; font-size: 12px !important; font-weight: 800 !important; line-height: 1.4 !important; text-transform: uppercase !important; } /* Keep coupon discount and remove link aligned */ .woocommerce-cart .cart_totals tr.cart-discount td { display: table-cell !important; visibility: visible !important; opacity: 1 !important; color: #111 !important; font-weight: 700 !important; text-align: right !important; } /* Prevent duplicate mobile-generated label */ .woocommerce-cart .cart_totals tr.cart-discount td::before { display: none !important; } @media (max-width: 768px) { .woocommerce-cart .cart_totals tr.cart-discount { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 15px; } .woocommerce-cart .cart_totals tr.cart-discount th, .woocommerce-cart .cart_totals tr.cart-discount td { display: block !important; width: auto !important; padding: 14px 0 !important; } .woocommerce-cart .cart_totals tr.cart-discount th { text-align: left !important; } .woocommerce-cart .cart_totals tr.cart-discount td { text-align: right !important; } } /* ========================================================= BURNIGAN FOOTER V2 Desktop: permanently expanded Mobile: compact accordion ========================================================= */ /* ========================================================= RESET BLOCKSY FOOTER WRAPPERS ========================================================= */ footer.ct-footer, footer.ct-footer [data-row], footer.ct-footer [data-row] > div, footer.ct-footer .ct-footer-row, footer.ct-footer .ct-container, footer.ct-footer .ct-footer-column, footer.ct-footer .ct-widget, footer.ct-footer .widget, footer.ct-footer .widget-area, footer.ct-footer .widget_text, footer.ct-footer .textwidget { width: 100% !important; max-width: none !important; min-width: 0 !important; min-height: 0 !important; height: auto !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; } footer.ct-footer { overflow: hidden; background: #050505; } footer.ct-footer [data-row] { --container-spacing: 0px !important; --content-spacing: 0px !important; } footer.ct-footer .textwidget > p:empty, footer.ct-footer .widget_text > p:empty { display: none !important; } /* ========================================================= MAIN FOOTER ========================================================= */ .burnigan-footer { width: 100%; margin: 0; padding: 28px clamp(28px, 6vw, 110px) 14px; box-sizing: border-box; background: #050505; color: #ffffff; } .burnigan-footer__content { width: 100%; max-width: 1600px; margin: 0 auto; display: grid; grid-template-columns: minmax(280px, 1.35fr) repeat(3, minmax(170px, 1fr)); gap: clamp(45px, 7vw, 130px); align-items: start; } /* ========================================================= BRAND ========================================================= */ .burnigan-footer__brand { min-width: 0; max-width: 360px; } .burnigan-footer__logo { display: inline-block; width: fit-content; margin: 0 0 10px; line-height: 0; text-decoration: none; } .burnigan-footer__logo-crop { position: relative; display: block; width: 245px; height: 45px; overflow: hidden; } .burnigan-footer__logo-crop img { position: absolute; top: 50%; left: 50%; display: block; width: 245px; max-width: none; height: 245px; object-fit: contain; transform: translate(-50%, -50%); } .burnigan-footer__brand p { max-width: 330px; margin: 0; color: rgba(255, 255, 255, 0.6); font-size: 14px; line-height: 1.55; } /* ========================================================= FOOTER SECTIONS — DESKTOP ========================================================= */ .burnigan-footer__section { min-width: 0; margin: 0; padding: 0; } .burnigan-footer__toggle { display: block; width: 100%; margin: 0 0 13px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: rgba(255, 255, 255, 0.5); text-align: left; font-family: inherit; font-size: 11px; font-weight: 800; line-height: 1.4; letter-spacing: 0.2em; text-transform: uppercase; appearance: none; cursor: default; pointer-events: none; } .burnigan-footer__toggle:hover, .burnigan-footer__toggle:focus, .burnigan-footer__toggle:active { background: transparent; box-shadow: none; color: rgba(255, 255, 255, 0.5); outline: none; } .burnigan-footer__plus { display: none; } .burnigan-footer__links { display: flex; flex-direction: column; gap: 8px; } .burnigan-footer__links a { display: block; width: fit-content; color: rgba(255, 255, 255, 0.92); text-decoration: none; font-size: 14px; font-weight: 600; line-height: 1.45; transition: opacity 0.2s ease, transform 0.2s ease; } .burnigan-footer__links a:hover { color: #ffffff; opacity: 0.72; transform: translateX(3px); } /* ========================================================= LEGAL ROW ========================================================= */ .burnigan-footer__legal { width: 100%; max-width: 1600px; margin: 20px auto 0; padding-top: 11px; border-top: 1px solid rgba(255, 255, 255, 0.11); display: flex; align-items: center; justify-content: space-between; gap: 20px; color: rgba(255, 255, 255, 0.4); font-size: 10px; font-weight: 700; line-height: 1.5; letter-spacing: 0.15em; text-transform: uppercase; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 1024px) and (min-width: 690px) { .burnigan-footer { padding: 24px 28px 12px; } .burnigan-footer__content { grid-template-columns: minmax(220px, 1.25fr) repeat(3, minmax(135px, 1fr)); gap: 32px; } .burnigan-footer__logo-crop { width: 205px; height: 38px; } .burnigan-footer__logo-crop img { width: 205px; height: 205px; } .burnigan-footer__brand p { font-size: 13px; } .burnigan-footer__toggle { font-size: 10px; } .burnigan-footer__links a { font-size: 13px; } .burnigan-footer__legal { font-size: 9px; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 689px) { footer.ct-footer { width: 100% !important; overflow: hidden !important; background: #050505 !important; } .burnigan-footer { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 22px 22px 12px !important; background: #050505 !important; } .burnigan-footer__content { display: block; width: 100%; max-width: none; margin: 0; } /* Brand */ .burnigan-footer__brand { width: 100%; max-width: none; margin: 0 0 17px; } .burnigan-footer__logo { margin-bottom: 8px; } .burnigan-footer__logo-crop { width: 185px; height: 34px; } .burnigan-footer__logo-crop img { width: 185px; height: 185px; } .burnigan-footer__brand p { max-width: 330px; margin: 0; font-size: 12px; line-height: 1.5; } /* Accordion rows */ .burnigan-footer__section { width: 100%; border-top: 1px solid rgba(255, 255, 255, 0.13); } .burnigan-footer__section:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.13); } .burnigan-footer__toggle { position: relative; display: flex; width: 100%; min-height: 0; margin: 0; padding: 14px 36px 14px 0; align-items: center; justify-content: space-between; border: 0; background: transparent; color: rgba(255, 255, 255, 0.92); box-shadow: none; font-size: 11px; line-height: 1.3; letter-spacing: 0.2em; cursor: pointer; pointer-events: auto; } .burnigan-footer__toggle:hover, .burnigan-footer__toggle:focus, .burnigan-footer__toggle:active { background: transparent; color: #ffffff; box-shadow: none; outline: none; } /* Plus/minus icon */ .burnigan-footer__plus { position: absolute; top: 50%; right: 1px; display: block; width: 17px; height: 17px; transform: translateY(-50%); } .burnigan-footer__plus::before, .burnigan-footer__plus::after { content: ""; position: absolute; top: 50%; left: 50%; width: 15px; height: 1.5px; background: rgba(255, 255, 255, 0.78); transition: transform 0.2s ease; } .burnigan-footer__plus::before { transform: translate(-50%, -50%); } .burnigan-footer__plus::after { transform: translate(-50%, -50%) rotate(90deg); } .burnigan-footer__section.is-open .burnigan-footer__plus::after { transform: translate(-50%, -50%) rotate(0deg); } /* Closed by default */ .burnigan-footer__links { display: none; width: 100%; gap: 0; padding: 0 0 12px; } .burnigan-footer__section.is-open .burnigan-footer__links { display: flex; } .burnigan-footer__links a { display: block; width: 100%; padding: 6px 0; color: rgba(255, 255, 255, 0.82); font-size: 12px; font-weight: 550; line-height: 1.4; } .burnigan-footer__links a:hover { opacity: 0.72; transform: none; } /* Legal row */ .burnigan-footer__legal { width: 100%; max-width: none; margin: 14px 0 0; padding: 10px 0 0; border-top: 0; display: block; text-align: center; font-size: 7px; line-height: 1.55; letter-spacing: 0.13em; } .burnigan-footer__legal span { display: block; } .burnigan-footer__legal span:last-child { margin-top: 2px; } } /* ========================================================= 100. GLOBAL PAGE SPACING SYSTEM — v1.1.5 --------------------------------------------------------- Single source of truth for the vertical band between the Blocksy header and the first page component, and between the last component and the footer. This section replaces the two earlier, conflicting blocks (old "100. GLOBAL COMPACT PAGE RHYTHM" v1.1.2 and "101. FULL-BLEED PAGE HERO ALIGNMENT" v1.1.4). Those set the variable `--content-vertical-spacing`, which is NOT Blocksy's token — Blocksy uses `--theme-content-vertical-spacing` — so their variable resets never applied and the header/hero gap persisted on About / Contact / FAQ and on the mobile homepage. Strategy: 1. Drive spacing through Blocksy's real container token `--theme-content-vertical-spacing` so we cooperate with the theme instead of fighting it. This alone removes the gap without depending on exact child nesting. 2. Keep a small, resilient padding fallback on the content shell for pages where the token is not honoured. 3. Scope everything to real Blocksy wrappers (main#main / .site-main / .ct-container[-full]) and to specific body classes — never the header or footer, never global element selectors. Keep this block LAST so it wins over legacy page modules without needing extra specificity escalation. ========================================================= */ :root { /* Compact page rhythm. Adjust these two (and the mobile pair below) to retune every page's top/bottom spacing at once. */ --burnigan-page-top-space: 24px; --burnigan-page-bottom-space: 24px; --burnigan-page-top-space-mobile: 0px; --burnigan-page-bottom-space-mobile: 16px; } @media (max-width: 689px) { :root { --burnigan-page-top-space: var(--burnigan-page-top-space-mobile); --burnigan-page-bottom-space: var(--burnigan-page-bottom-space-mobile); } } /* --------------------------------------------------------- Homepage: hero sits flush directly beneath the header on every device. This removes the desktop band AND the small mobile strip between header and hero image. --------------------------------------------------------- */ body.home main#main, body.home .site-main { /* Neutralise Blocksy's own top spacing token. */ --theme-content-vertical-spacing: 0px; } body.home main#main > :is(.ct-container, .ct-container-full), body.home .site-main > :is(.ct-container, .ct-container-full) { padding-top: 0 !important; } /* First rendered block on the homepage must not add its own top margin (covers a hero that is / is not the direct first child). */ body.home main#main .entry-content > :first-child, body.home main#main > :is(.ct-container, .ct-container-full) > :first-child, body.home .site-main > :is(.ct-container, .ct-container-full) > :first-child { margin-top: 0 !important; } /* --------------------------------------------------------- Standard content pages (About, Contact, FAQ, etc.): compact, consistent top/bottom spacing. Excludes the homepage and all WooCommerce pages, which are handled separately. --------------------------------------------------------- */ body.page:not(.home):not(.woocommerce-page) main#main, body.page:not(.home):not(.woocommerce-page) .site-main { --theme-content-vertical-spacing: var(--burnigan-page-top-space); } body.page:not(.home):not(.woocommerce-page) main#main > :is(.ct-container, .ct-container-full), body.page:not(.home):not(.woocommerce-page) .site-main > :is(.ct-container, .ct-container-full) { padding-top: var(--burnigan-page-top-space) !important; padding-bottom: var(--burnigan-page-bottom-space) !important; } /* A page whose first block is a full-bleed / designed hero should sit flush under the header. Opt in by adding the body class `burnigan-flush-hero` (Blocksy: Page > Content Type, or a body class field) — safer than force-zeroing every page. */ body.page.burnigan-flush-hero:not(.home) main#main, body.page.burnigan-flush-hero:not(.home) .site-main { --theme-content-vertical-spacing: 0px; } body.page.burnigan-flush-hero:not(.home) main#main > :is(.ct-container, .ct-container-full), body.page.burnigan-flush-hero:not(.home) .site-main > :is(.ct-container, .ct-container-full) { padding-top: 0 !important; } body.page.burnigan-flush-hero:not(.home) main#main .entry-content > :first-child, body.page.burnigan-flush-hero:not(.home) main#main > :is(.ct-container, .ct-container-full) > :first-child, body.page.burnigan-flush-hero:not(.home) .site-main > :is(.ct-container, .ct-container-full) > :first-child { margin-top: 0 !important; } /* --------------------------------------------------------- Shop / taxonomy archives: compact top/bottom shell, and the product grid ends close to the footer while keeping normal row spacing inside the grid. (Overrides the legacy 55px/90px archive shell.) --------------------------------------------------------- */ body:is(.woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag) main#main > :is(.ct-container, .ct-container-full) { padding-top: var(--burnigan-page-top-space) !important; padding-bottom: var(--burnigan-page-bottom-space) !important; } body:is(.woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag) ul.products, body:is(.woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag) .woocommerce-pagination { margin-bottom: 0 !important; padding-bottom: 0 !important; } /* --------------------------------------------------------- Cart / Checkout: these pages keep their own finalized shells defined earlier (Sections 10–21). We only normalise the outer top/bottom band so it matches the rest of the site. --------------------------------------------------------- */ body.woocommerce-cart #main > :is(.ct-container, .ct-container-full), body.woocommerce-checkout #main > :is(.ct-container, .ct-container-full) { padding-top: var(--burnigan-page-top-space) !important; padding-bottom: var(--burnigan-page-bottom-space) !important; } /* --------------------------------------------------------- My Account: portal grid controls its own inner spacing; we only set the outer band. --------------------------------------------------------- */ body.woocommerce-account #main .woocommerce { margin-top: var(--burnigan-page-top-space) !important; margin-bottom: var(--burnigan-page-bottom-space) !important; } /* --------------------------------------------------------- Trailing space: the last rendered block should not push extra margin against the footer. Applies to standard and Woo pages; never touches the footer element itself. --------------------------------------------------------- */ body:not(.home) main#main > :is(.ct-container, .ct-container-full) > :last-child, body:not(.home) .site-main > :is(.ct-container, .ct-container-full) > :last-child, body.woocommerce :is(.woocommerce, .entry-content) > :last-child, body.woocommerce-page :is(.woocommerce, .entry-content) > :last-child { margin-bottom: 0 !important; } /* Footer stays flush with the page shell (unchanged behaviour). */ footer.ct-footer { margin-top: 0 !important; } /* ========================================================= 101. MOBILE HEADER + PAGE GAP CORRECTION — v1.1.6 --------------------------------------------------------- Root cause fixed: Earlier header sections assigned a 70px minimum height to every Blocksy [data-row]. Empty top/bottom rows therefore rendered as blank bands below the visible mobile header. This final guard keeps only the middle row height, collapses unused row minimums, removes the residual mobile content offset, and tightens the shop tabs / sorting / product flow. ========================================================= */ @media (max-width: 999.98px) { /* Empty Blocksy header rows must not inherit the middle-row height. */ #header [data-device="mobile"] [data-row]:not([data-row="middle"]), .ct-header [data-device="mobile"] [data-row]:not([data-row="middle"]), .site-header [data-device="mobile"] [data-row]:not([data-row="middle"]) { min-height: 0 !important; } #header [data-device="mobile"] [data-row]:not([data-row="middle"]) > div, .ct-header [data-device="mobile"] [data-row]:not([data-row="middle"]) > div, .site-header [data-device="mobile"] [data-row]:not([data-row="middle"]) > div { min-height: 0 !important; } /* No extra outer margin between the header and page shell. */ body main#main, body .site-main { margin-top: 0 !important; } body main#main > :is(.ct-container, .ct-container-full, .ct-container-fluid), body .site-main > :is(.ct-container, .ct-container-full, .ct-container-fluid) { margin-top: 0 !important; } } @media (max-width: 700px) { /* Homepage and normal pages begin directly below the visible header. */ body.home main#main, body.home .site-main, body.page:not(.woocommerce-page) main#main, body.page:not(.woocommerce-page) .site-main { padding-top: 0 !important; } body.home main#main > :is(.ct-container, .ct-container-full, .ct-container-fluid), body.home .site-main > :is(.ct-container, .ct-container-full, .ct-container-fluid), body.page:not(.woocommerce-page) main#main > :is(.ct-container, .ct-container-full, .ct-container-fluid), body.page:not(.woocommerce-page) .site-main > :is(.ct-container, .ct-container-full, .ct-container-fluid) { padding-top: 0 !important; } /* Shop: category tabs, toolbar and product grid form one compact flow. */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full, .ct-container-fluid) { margin-top: 0 !important; margin-bottom: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main { margin: 0 !important; padding-top: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full, .ct-container-fluid) { margin-top: 0 !important; padding-top: 0 !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main .woocommerce { margin-top: 0 !important; padding-top: 0 !important; gap: 0 !important; } /* Remove legacy generated archive labels/dividers that reserve rows. */ body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full, .ct-container-fluid)::before, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .ct-shop-tabs > :is(.ct-container, .ct-container-full, .ct-container-fluid)::after, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) main#main > :is(.ct-container, .ct-container-full, .ct-container-fluid)::before, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce::before, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::before, body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products::after { content: none !important; display: none !important; width: 0 !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; clear: none !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) .woocommerce-ordering { margin-top: 0 !important; margin-bottom: 10px !important; } body:is( .woocommerce-shop, .post-type-archive-product, .tax-product_cat, .tax-product_tag ) ul.products { margin-top: 0 !important; padding-top: 0 !important; } }