/* ========================================================================== the.noomad — Auctions / YITH / WooCommerce Loops ========================================================================== */ /* -------------------------------------------------------------------------- 01 — Shop / Product Archive Container Important: Auction page /auktion-momentum is intentionally excluded. -------------------------------------------------------------------------- */ .page-id-751 .woocommerce, .page-id-751 ul.products, .woocommerce-shop .woocommerce, .woocommerce-shop ul.products, .post-type-archive-product .woocommerce, .post-type-archive-product ul.products, .page-id-751 .woocommerce-pagination, .woocommerce-shop .woocommerce-pagination, .post-type-archive-product .woocommerce-pagination { max-width: var(--tn-product-loop-max-width); margin-left: auto; margin-right: auto; padding-left: var(--tn-product-loop-padding-x); padding-right: var(--tn-product-loop-padding-x); } @media (max-width: 1024px) { .page-id-751 .woocommerce, .page-id-751 ul.products, .woocommerce-shop .woocommerce, .woocommerce-shop ul.products, .post-type-archive-product .woocommerce, .post-type-archive-product ul.products, .page-id-751 .woocommerce-pagination, .woocommerce-shop .woocommerce-pagination, .post-type-archive-product .woocommerce-pagination { padding-left: var(--tn-product-loop-padding-x-tablet); padding-right: var(--tn-product-loop-padding-x-tablet); } } @media (max-width: 767px) { .page-id-751 .woocommerce, .page-id-751 ul.products, .woocommerce-shop .woocommerce, .woocommerce-shop ul.products, .post-type-archive-product .woocommerce, .post-type-archive-product ul.products, .page-id-751 .woocommerce-pagination, .woocommerce-shop .woocommerce-pagination, .post-type-archive-product .woocommerce-pagination { padding-left: var(--tn-product-loop-padding-x-mobile); padding-right: var(--tn-product-loop-padding-x-mobile); } } /* -------------------------------------------------------------------------- 02 — Product Images Applies globally to auction/product loops, including YITH auction page. -------------------------------------------------------------------------- */ .woocommerce ul.products li.product img, .woocommerce ul.products li.product .woocommerce-loop-product__link img, .page-id-974 ul.products li.product img, .page-id-974 .woocommerce-loop-product__link img { border-radius: var(--tn-auction-image-radius); overflow: hidden; } /* -------------------------------------------------------------------------- 03 — Product Text Inset Applies to shop/product archive, but NOT to auction page. -------------------------------------------------------------------------- */ .page-id-751 .woocommerce ul.products li.product .woocommerce-loop-product__title, .page-id-751 .woocommerce ul.products li.product .price, .page-id-751 .woocommerce ul.products li.product .product-action-wrap, .page-id-751 .woocommerce ul.products li.product .auction_end_start, .page-id-751 .woocommerce ul.products li.product .button, .woocommerce-shop .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce-shop .woocommerce ul.products li.product .price, .woocommerce-shop .woocommerce ul.products li.product .product-action-wrap, .woocommerce-shop .woocommerce ul.products li.product .auction_end_start, .woocommerce-shop .woocommerce ul.products li.product .button, .post-type-archive-product .woocommerce ul.products li.product .woocommerce-loop-product__title, .post-type-archive-product .woocommerce ul.products li.product .price, .post-type-archive-product .woocommerce ul.products li.product .product-action-wrap, .post-type-archive-product .woocommerce ul.products li.product .auction_end_start, .post-type-archive-product .woocommerce ul.products li.product .button { margin-left: var(--tn-product-loop-content-inset); margin-right: var(--tn-product-loop-content-inset); } /* -------------------------------------------------------------------------- 04 — Product Card Typography -------------------------------------------------------------------------- */ .woocommerce ul.products li.product.product-type-auction .woocommerce-loop-product__title, .woocommerce ul.products li.product.product-type-auction h2, .woocommerce ul.products li.product.product-type-auction h3 { color: var(--tn-accent); font-family: var(--tn-font-heading); font-weight: 700; } .woocommerce ul.products li.product.product-type-auction .product-action-wrap, .woocommerce ul.products li.product.product-type-auction .auction_end_start { color: var(--tn-auction-meta-color); font-family: var(--tn-font-body); } /* -------------------------------------------------------------------------- 05 — YITH Timer Styling -------------------------------------------------------------------------- */ .woocommerce ul.products li.product.product-type-auction .yith-wcact-timeleft-loop, .woocommerce ul.products li.product.product-type-auction .yith-wcact-timer-auction, .woocommerce ul.products li.product.product-type-auction .yith-wcact-timeleft, .woocommerce ul.products li.product.product-type-auction .yith-wcact-number, .woocommerce ul.products li.product.product-type-auction .yith-wcact-number-label { color: var(--tn-auction-timer-color) !important; font-weight: var(--tn-auction-timer-font-weight) !important; } .woocommerce ul.products li.product.product-type-auction .yith-wcact-timeleft { display: inline-flex; align-items: baseline; gap: 2px; margin-right: 6px; } .woocommerce ul.products li.product.product-type-auction .yith-wcact-number-label { opacity: 0.85; } .woocommerce ul.products li.product.product-type-auction .tn-auction-ending-soon, .woocommerce ul.products li.product.product-type-auction .tn-auction-ending-soon .yith-wcact-timeleft, .woocommerce ul.products li.product.product-type-auction .tn-auction-ending-soon .yith-wcact-number, .woocommerce ul.products li.product.product-type-auction .tn-auction-ending-soon .yith-wcact-number-label { color: var(--tn-auction-timer-ending-color) !important; } /* -------------------------------------------------------------------------- 06 — Auction Start / End Meta -------------------------------------------------------------------------- */ .woocommerce ul.products li.product.product-type-auction .auction_end_start { margin-top: 6px; color: var(--tn-auction-meta-muted-color); font-size: 0.95rem; line-height: 1.5; } .woocommerce ul.products li.product.product-type-auction .ywcact_auction_end_start_label { display: block; color: var(--tn-auction-meta-color); font-weight: 600; } /* -------------------------------------------------------------------------- 07 — Bid Link: Text Only, No Arrow -------------------------------------------------------------------------- */ .woocommerce ul.products li.product.product-type-auction a.button.product_type_auction, .woocommerce ul.products li.product.product-type-auction .button.product_type_auction, .woocommerce ul.products li.product.product-type-auction a.add_to_cart_button { display: inline-flex; align-items: center; gap: 0; margin-top: 18px; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: var(--tn-auction-link-color) !important; font-family: var(--tn-font-body); font-weight: 700; letter-spacing: 0.02em; text-decoration: none !important; text-transform: uppercase; } .woocommerce ul.products li.product.product-type-auction a.button.product_type_auction:hover, .woocommerce ul.products li.product.product-type-auction .button.product_type_auction:hover, .woocommerce ul.products li.product.product-type-auction a.add_to_cart_button:hover { color: var(--tn-auction-link-hover-color) !important; background: transparent !important; text-decoration: none !important; } /* Hide Kadence arrow icon on auction buttons only */ .woocommerce ul.products li.product.product-type-auction a.button.product_type_auction svg.kadence-arrow-right-alt-svg, .woocommerce ul.products li.product.product-type-auction a.add_to_cart_button svg.kadence-arrow-right-alt-svg { display: none !important; } .woocommerce ul.products li.product.product-type-auction a.button.product_type_auction .kadence-svg-iconset:has(svg.kadence-arrow-right-alt-svg), .woocommerce ul.products li.product.product-type-auction a.add_to_cart_button .kadence-svg-iconset:has(svg.kadence-arrow-right-alt-svg) { display: none !important; } /* Fallback */ .woocommerce ul.products li.product.product-type-auction a.button.product_type_auction .kadence-arrow-right-alt-svg, .woocommerce ul.products li.product.product-type-auction a.add_to_cart_button .kadence-arrow-right-alt-svg { width: 0 !important; height: 0 !important; opacity: 0 !important; overflow: hidden !important; } /* Keep loading/check icons compact */ .woocommerce ul.products li.product.product-type-auction a.button.product_type_auction svg.kadence-spinner-svg, .woocommerce ul.products li.product.product-type-auction a.button.product_type_auction svg.kadence-check-svg, .woocommerce ul.products li.product.product-type-auction a.add_to_cart_button svg.kadence-spinner-svg, .woocommerce ul.products li.product.product-type-auction a.add_to_cart_button svg.kadence-check-svg { width: 14px; height: 14px; } /* -------------------------------------------------------------------------- 08 — Pagination Alignment -------------------------------------------------------------------------- */ .woocommerce nav.woocommerce-pagination, .woocommerce-pagination { max-width: var(--tn-product-loop-max-width); margin-left: auto; margin-right: auto; padding-left: var(--tn-product-loop-padding-x); padding-right: var(--tn-product-loop-padding-x); } @media (max-width: 1024px) { .woocommerce nav.woocommerce-pagination, .woocommerce-pagination { padding-left: var(--tn-product-loop-padding-x-tablet); padding-right: var(--tn-product-loop-padding-x-tablet); } } @media (max-width: 767px) { .woocommerce nav.woocommerce-pagination, .woocommerce-pagination { padding-left: var(--tn-product-loop-padding-x-mobile); padding-right: var(--tn-product-loop-padding-x-mobile); } } /* -------------------------------------------------------------------------- 09 — Mobile Refinement -------------------------------------------------------------------------- */ @media (max-width: 767px) { .woocommerce ul.products li.product.product-type-auction .auction_end_start { font-size: 0.9rem; } .woocommerce ul.products li.product.product-type-auction a.button.product_type_auction, .woocommerce ul.products li.product.product-type-auction a.add_to_cart_button { margin-top: 14px; } }