/* Theme Name: OceanWP Letz Child Template: oceanwp Version: 1.0 */ /* ========================================================= Desktop archive hover actions Quick View removed ========================================================= */ .woocommerce ul.products li.product .image-wrap, .woocommerce-page ul.products li.product .image-wrap { position: relative; overflow: hidden; } .woocommerce ul.products li.product .ls-card-actions, .woocommerce-page ul.products li.product .ls-card-actions { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; gap: 0; z-index: 20; opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease, bottom .25s ease; } .woocommerce ul.products li.product:hover .ls-card-actions, .woocommerce-page ul.products li.product:hover .ls-card-actions { opacity: 1; visibility: visible; bottom: 22px; } .woocommerce ul.products li.product .ls-action, .woocommerce-page ul.products li.product .ls-action { display: flex; margin: 0; padding: 0; } .woocommerce ul.products li.product .ls-action-cart a, .woocommerce-page ul.products li.product .ls-action-cart a { min-width: 140px; height: 44px; display: flex; align-items: center; justify-content: center; padding: 0 18px; border-radius: 12px; background: rgba(20,20,20,.88); color: #fff; text-decoration: none; box-shadow: none; margin: 0; line-height: 1; font-size: 12px; font-weight: 600; white-space: nowrap; border: 0; } .woocommerce ul.products li.product .ls-card-actions a:hover, .woocommerce-page ul.products li.product .ls-card-actions a:hover { background: rgba(0,0,0,.96); color: #ff4f9a; } .woocommerce ul.products li.product .ls-action-qv, .woocommerce-page ul.products li.product .ls-action-qv { display: none !important; } .woocommerce ul.products li.product .ls-mobile-cart-wrap, .woocommerce-page ul.products li.product .ls-mobile-cart-wrap { display: none; } /* ========================================================= Native wishlist visibility ========================================================= */ .woocommerce ul.products li.product .woo-entry-buttons, .woocommerce-page ul.products li.product .woo-entry-buttons { display: block !important; position: absolute !important; top: 10px !important; right: 10px !important; left: auto !important; bottom: auto !important; margin: 0 !important; padding: 0 !important; list-style: none !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; z-index: 60 !important; } .woocommerce ul.products li.product:hover .woo-entry-buttons, .woocommerce-page ul.products li.product:hover .woo-entry-buttons, .woocommerce ul.products li.product .image-wrap:hover .woo-entry-buttons, .woocommerce-page ul.products li.product .image-wrap:hover .woo-entry-buttons { opacity: 1 !important; visibility: visible !important; } .woocommerce ul.products li.product .woo-entry-buttons li, .woocommerce-page ul.products li.product .woo-entry-buttons li, .woocommerce ul.products li.product .woo-entry-buttons .tinv-wraper, .woocommerce-page ul.products li.product .woo-entry-buttons .tinv-wraper, .woocommerce ul.products li.product .woo-entry-buttons .yith-wcwl-add-to-wishlist, .woocommerce-page ul.products li.product .woo-entry-buttons .yith-wcwl-add-to-wishlist { display: block !important; margin: 0 !important; padding: 0 !important; opacity: 1 !important; visibility: visible !important; } .woocommerce ul.products li.product .woo-entry-buttons a, .woocommerce-page ul.products li.product .woo-entry-buttons a, .woocommerce ul.products li.product .woo-entry-buttons button, .woocommerce-page ul.products li.product .woo-entry-buttons button, .woocommerce ul.products li.product .woo-entry-buttons .tinvwl_add_to_wishlist_button, .woocommerce-page ul.products li.product .woo-entry-buttons .tinvwl_add_to_wishlist_button, .woocommerce ul.products li.product .woo-entry-buttons .add_to_wishlist, .woocommerce-page ul.products li.product .woo-entry-buttons .add_to_wishlist { display: flex !important; align-items: center !important; justify-content: center !important; width: 36px !important; min-width: 36px !important; height: 36px !important; min-height: 36px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 999px !important; background: rgba(255,255,255,0.96) !important; box-shadow: 0 6px 16px rgba(15, 23, 42, 0.12) !important; color: #111827 !important; text-decoration: none !important; opacity: 1 !important; visibility: visible !important; line-height: 1 !important; } .woocommerce ul.products li.product .woo-entry-buttons a i, .woocommerce-page ul.products li.product .woo-entry-buttons a i, .woocommerce ul.products li.product .woo-entry-buttons a svg, .woocommerce-page ul.products li.product .woo-entry-buttons a svg, .woocommerce ul.products li.product .woo-entry-buttons .tinvwl_add_to_wishlist_button i, .woocommerce-page ul.products li.product .woo-entry-buttons .tinvwl_add_to_wishlist_button i { font-size: 16px !important; width: 16px !important; height: 16px !important; line-height: 1 !important; } .woocommerce ul.products li.product .woo-entry-buttons .tinvwl_add_to_wishlist-text, .woocommerce-page ul.products li.product .woo-entry-buttons .tinvwl_add_to_wishlist-text, .woocommerce ul.products li.product .woo-entry-buttons .feedback, .woocommerce-page ul.products li.product .woo-entry-buttons .feedback { display: none !important; } /* ========================================================= Mobile / tablet card UI by width only ========================================================= */ @media (max-width: 1024px) { .woocommerce ul.products li.product .ls-card-actions, .woocommerce-page ul.products li.product .ls-card-actions, .woocommerce ul.products li.product .ls-action, .woocommerce-page ul.products li.product .ls-action, .woocommerce ul.products li.product .ls-action-cart, .woocommerce-page ul.products li.product .ls-action-cart, .woocommerce ul.products li.product .owp-quick-view, .woocommerce-page ul.products li.product .owp-quick-view { display: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } .woocommerce ul.products, .woocommerce-page ul.products { display: flex !important; flex-wrap: wrap !important; gap: 0 !important; } .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: 50% !important; padding: 0 7px 14px !important; margin: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; clear: none !important; overflow: visible !important; } .woocommerce ul.products li.product .woo-entry-inner, .woocommerce-page ul.products li.product .woo-entry-inner { position: relative !important; display: flex !important; flex-direction: column !important; background: #faf7fb !important; border: 1px solid rgba(15, 23, 42, 0.05) !important; border-radius: 22px !important; box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05) !important; padding: 9px 9px 12px !important; overflow: visible !important; min-height: 100% !important; } .woocommerce ul.products li.product .woo-entry-inner::after, .woocommerce-page ul.products li.product .woo-entry-inner::after { display: none !important; } .woocommerce ul.products li.product .image-wrap, .woocommerce-page ul.products li.product .image-wrap { position: relative !important; overflow: hidden !important; border-radius: 16px !important; background: #ffffff !important; border: 0 !important; box-shadow: none !important; margin-bottom: 10px !important; z-index: 2 !important; } .woocommerce ul.products li.product .image-wrap > a, .woocommerce-page ul.products li.product .image-wrap > a, .woocommerce ul.products li.product .woo-entry-image-main, .woocommerce-page ul.products li.product .woo-entry-image-main { display: flex !important; align-items: flex-end !important; justify-content: center !important; width: 100% !important; min-height: 176px !important; position: relative !important; border-radius: 16px !important; overflow: hidden !important; background: #ffffff !important; z-index: 2 !important; } .woocommerce ul.products li.product .image-wrap img, .woocommerce-page ul.products li.product .image-wrap img { display: block !important; width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center bottom !important; border-radius: 16px !important; background: #ffffff !important; } .woocommerce ul.products li.product .woo-entry-buttons, .woocommerce-page ul.products li.product .woo-entry-buttons { top: 8px !important; right: 8px !important; z-index: 70 !important; } .woocommerce ul.products li.product .woo-entry-buttons a, .woocommerce-page ul.products li.product .woo-entry-buttons a, .woocommerce ul.products li.product .woo-entry-buttons button, .woocommerce-page ul.products li.product .woo-entry-buttons button, .woocommerce ul.products li.product .woo-entry-buttons .tinvwl_add_to_wishlist_button, .woocommerce-page ul.products li.product .woo-entry-buttons .tinvwl_add_to_wishlist_button, .woocommerce ul.products li.product .woo-entry-buttons .add_to_wishlist, .woocommerce-page ul.products li.product .woo-entry-buttons .add_to_wishlist { width: 34px !important; min-width: 34px !important; height: 34px !important; min-height: 34px !important; } .woocommerce ul.products li.product .woo-product-info, .woocommerce-page ul.products li.product .woo-product-info { position: relative !important; background: transparent !important; border: 0 !important; box-shadow: none !important; margin-top: 0 !important; padding: 0 2px 0 2px !important; z-index: 3 !important; overflow: visible !important; } .woocommerce ul.products li.product li.category, .woocommerce-page ul.products li.product li.category, .woocommerce ul.products li.product li.rating, .woocommerce-page ul.products li.product li.rating, .woocommerce ul.products li.product li.woo-desc, .woocommerce-page ul.products li.product li.woo-desc { display: none !important; } .woocommerce ul.products li.product li.title, .woocommerce-page ul.products li.product li.title { margin-bottom: 6px !important; } .woocommerce ul.products li.product li.title a, .woocommerce-page ul.products li.product li.title a, .woocommerce ul.products li.product li.title h2, .woocommerce-page ul.products li.product li.title h2 { display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important; min-height: 2.7em !important; font-size: 14px !important; line-height: 1.35 !important; font-weight: 500 !important; letter-spacing: -0.01em !important; color: #0f172a !important; text-decoration: none !important; margin: 0 !important; } .woocommerce ul.products li.product .ls-price-cart-row, .woocommerce-page ul.products li.product .ls-price-cart-row { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; margin: 0 !important; padding: 0 !important; min-height: 42px !important; position: relative !important; z-index: 8 !important; overflow: visible !important; } .woocommerce ul.products li.product .ls-price-col, .woocommerce-page ul.products li.product .ls-price-col { flex: 1 1 auto !important; min-width: 0 !important; display: flex !important; justify-content: flex-start !important; align-items: center !important; text-align: left !important; } .woocommerce ul.products li.product .ls-price-col .price, .woocommerce-page ul.products li.product .ls-price-col .price, .woocommerce ul.products li.product .ls-price-col .price *, .woocommerce-page ul.products li.product .ls-price-col .price *, .woocommerce ul.products li.product .ls-price-col .amount, .woocommerce-page ul.products li.product .ls-price-col .amount, .woocommerce ul.products li.product .ls-price-col .amount *, .woocommerce-page ul.products li.product .ls-price-col .amount *, .woocommerce ul.products li.product .ls-price-col bdi, .woocommerce-page ul.products li.product .ls-price-col bdi { margin: 0 !important; font-size: 16px !important; line-height: 1.2 !important; font-weight: 600 !important; letter-spacing: -0.01em !important; color: #111827 !important; font-family: "Poppins", "DM Sans", "Inter", sans-serif !important; text-align: left !important; } .woocommerce ul.products li.product .ls-price-col .price, .woocommerce-page ul.products li.product .ls-price-col .price { display: block !important; width: 100% !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart-wrap, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart-wrap { display: flex !important; align-items: center !important; justify-content: flex-end !important; position: relative !important; right: auto !important; bottom: auto !important; top: auto !important; left: auto !important; width: 42px !important; height: 42px !important; flex: 0 0 42px !important; margin-left: auto !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; z-index: 20 !important; overflow: visible !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart { display: block !important; position: relative !important; right: auto !important; bottom: auto !important; width: 42px !important; height: 42px !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; z-index: 21 !important; overflow: visible !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.button, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.button, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.add_to_cart_button, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.add_to_cart_button, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_simple, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_simple, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_variable, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_variable, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_grouped, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_grouped, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_external, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_external { display: flex !important; align-items: center !important; justify-content: center !important; position: relative !important; width: 42px !important; min-width: 42px !important; height: 42px !important; min-height: 42px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 999px !important; background: #FF4A96 !important; color: transparent !important; text-indent: -9999px !important; font-size: 0 !important; line-height: 0 !important; overflow: hidden !important; box-shadow: 0 8px 18px rgba(255, 74, 150, 0.24) !important; opacity: 1 !important; visibility: visible !important; z-index: 22 !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a::before, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a::before { content: "" !important; position: absolute !important; left: 50% !important; top: 50% !important; width: 15px !important; height: 15px !important; transform: translate(-50%, -50%) !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 15px 15px !important; background-image: url("data:image/svg+xml;utf8,") !important; z-index: 23 !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a span, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a span, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.added_to_cart, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.added_to_cart { display: none !important; } } @media (max-width: 420px) { .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { padding: 0 6px 12px !important; } .woocommerce ul.products li.product .woo-entry-inner, .woocommerce-page ul.products li.product .woo-entry-inner { border-radius: 20px !important; padding: 8px 8px 11px !important; } .woocommerce ul.products li.product .image-wrap, .woocommerce-page ul.products li.product .image-wrap, .woocommerce ul.products li.product .image-wrap > a, .woocommerce-page ul.products li.product .image-wrap > a { border-radius: 15px !important; } .woocommerce ul.products li.product .image-wrap > a, .woocommerce-page ul.products li.product .image-wrap > a, .woocommerce ul.products li.product .woo-entry-image-main, .woocommerce-page ul.products li.product .woo-entry-image-main { min-height: 164px !important; } .woocommerce ul.products li.product li.title a, .woocommerce-page ul.products li.product li.title a { font-size: 13px !important; } .woocommerce ul.products li.product .ls-price-col .price, .woocommerce-page ul.products li.product .ls-price-col .price, .woocommerce ul.products li.product .ls-price-col .price *, .woocommerce-page ul.products li.product .ls-price-col .price * { font-size: 15px !important; } } /* ========================================================= HARD RESET — MOBILE PRICE ROW CART Put this at the VERY END of style.css ========================================================= */ @media (max-width: 1024px) { /* remove all old mobile cart positioning/clipping behavior */ .woocommerce ul.products li.product .woo-entry-inner, .woocommerce-page ul.products li.product .woo-entry-inner, .woocommerce ul.products li.product .woo-product-info, .woocommerce-page ul.products li.product .woo-product-info, .woocommerce ul.products li.product .ls-price-cart-row, .woocommerce-page ul.products li.product .ls-price-cart-row, .woocommerce ul.products li.product .ls-price-col, .woocommerce-page ul.products li.product .ls-price-col, .woocommerce ul.products li.product .ls-mobile-cart-wrap, .woocommerce-page ul.products li.product .ls-mobile-cart-wrap, .woocommerce ul.products li.product .ls-mobile-cart, .woocommerce-page ul.products li.product .ls-mobile-cart, .woocommerce ul.products li.product .ls-mobile-cart a, .woocommerce-page ul.products li.product .ls-mobile-cart a { overflow: visible !important; transform: none !important; } /* kill old fake cut-circle on mobile */ .woocommerce ul.products li.product .woo-entry-inner::after, .woocommerce-page ul.products li.product .woo-entry-inner::after { display: none !important; content: none !important; } /* real bottom row */ .woocommerce ul.products li.product .ls-price-cart-row, .woocommerce-page ul.products li.product .ls-price-cart-row { display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; width: 100% !important; min-height: 42px !important; margin: 0 !important; padding: 0 !important; position: relative !important; z-index: 30 !important; } .woocommerce ul.products li.product .ls-price-col, .woocommerce-page ul.products li.product .ls-price-col { flex: 1 1 auto !important; min-width: 0 !important; display: flex !important; justify-content: flex-start !important; align-items: center !important; text-align: left !important; } /* cart must live in row, not absolute */ .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart-wrap, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart-wrap { display: flex !important; position: static !important; width: 42px !important; min-width: 42px !important; height: 42px !important; min-height: 42px !important; margin-left: auto !important; padding: 0 !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; z-index: 40 !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart { display: block !important; position: static !important; width: 42px !important; height: 42px !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; z-index: 41 !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.button, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.button, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.add_to_cart_button, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.add_to_cart_button, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_simple, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_simple, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_variable, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_variable, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_grouped, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_grouped, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_external, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_external { display: flex !important; position: static !important; align-items: center !important; justify-content: center !important; width: 42px !important; min-width: 42px !important; height: 42px !important; min-height: 42px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 999px !important; background: #FF4A96 !important; color: transparent !important; text-indent: -9999px !important; font-size: 0 !important; line-height: 0 !important; box-shadow: 0 8px 18px rgba(255, 74, 150, 0.24) !important; opacity: 1 !important; visibility: visible !important; z-index: 42 !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a::before, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a::before { content: "" !important; position: absolute !important; left: 50% !important; top: 50% !important; width: 15px !important; height: 15px !important; transform: translate(-50%, -50%) !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 15px 15px !important; background-image: url("data:image/svg+xml;utf8,") !important; z-index: 43 !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a span, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a span, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.added_to_cart, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.added_to_cart { display: none !important; } } /* FINAL FIX — show white cart icon inside pink mobile bubble */ @media (max-width: 1024px) { .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.button, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.button, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.add_to_cart_button, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.add_to_cart_button, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_simple, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_simple, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_variable, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_variable, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_grouped, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_grouped, .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_external, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a.product_type_external { position: relative !important; } .woocommerce ul.products li.product .ls-price-cart-row .ls-mobile-cart a::before, .woocommerce-page ul.products li.product .ls-price-cart-row .ls-mobile-cart a::before { content: "" !important; position: absolute !important; left: 50% !important; top: 50% !important; width: 15px !important; height: 15px !important; transform: translate(-50%, -50%) !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 15px 15px !important; background-image: url("data:image/svg+xml;utf8,") !important; z-index: 999 !important; pointer-events: none !important; } } /* ========================================================= DESKTOP QUICK VIEW STACKING FIX ========================================================= */ @media (min-width: 1025px) { /* Let hovered product sit above nearby cards */ .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { position: relative; z-index: 1; } .woocommerce ul.products li.product:hover, .woocommerce-page ul.products li.product:hover { z-index: 20; } /* Do not let card wrappers clip quick view */ .woocommerce ul.products li.product .woo-entry-inner, .woocommerce-page ul.products li.product .woo-entry-inner, .woocommerce ul.products li.product .image-wrap, .woocommerce-page ul.products li.product .image-wrap { overflow: visible !important; } /* Ocean quick-view popup should sit above cards */ #owp-qv-wrap, #owp-qv-wrap .owp-qv-overlay, #owp-qv-wrap .owp-qv-container, .owp-qv-content-wrap, .owp-qv-content-inner { z-index: 999999 !important; } /* If Ocean places the mini panel near the card, keep it above */ .owp-qv-content-wrap, .owp-qv-content-inner, .owp-qv-container { position: relative !important; } } /* ========================================================= ADD TO CART SUCCESS FEEDBACK UI ========================================================= */ /* Hide default "View cart" archive forward link */ .woocommerce ul.products li.product a.added_to_cart.wc-forward, .woocommerce-page ul.products li.product a.added_to_cart.wc-forward { display: none !important; } /* Loading / success state on clicked archive button */ .woocommerce ul.products li.product a.add_to_cart_button.letz-atc-loading, .woocommerce-page ul.products li.product a.add_to_cart_button.letz-atc-loading { opacity: .82 !important; transform: scale(.98); transition: transform .18s ease, opacity .18s ease; } .woocommerce ul.products li.product a.add_to_cart_button.letz-atc-success, .woocommerce-page ul.products li.product a.add_to_cart_button.letz-atc-success { background: #16a34a !important; color: transparent !important; text-indent: -9999px !important; position: relative !important; overflow: hidden !important; } .woocommerce ul.products li.product a.add_to_cart_button.letz-atc-success::before, .woocommerce-page ul.products li.product a.add_to_cart_button.letz-atc-success::before { content: "✓" !important; position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; color: #fff !important; font-size: 18px !important; font-weight: 700 !important; text-indent: 0 !important; line-height: 1 !important; } /* Desktop centered success modal */ .letz-atc-overlay { position: fixed; inset: 0; background: rgba(15, 23, 42, 0.42); display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .22s ease, visibility .22s ease; z-index: 999999; } .letz-atc-overlay.is-open { opacity: 1; visibility: visible; pointer-events: auto; } /* Compact desktop add-to-cart success modal */ .letz-atc-modal { width: min(520px, 88vw); min-height: 360px; background: #fff; border-radius: 48px; box-shadow: 0 30px 80px rgba(15, 23, 42, 0.22); padding: 42px 34px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .letz-atc-icon-circle { width: 84px; height: 84px; border-radius: 999px; background: #ff4a96; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; } .letz-atc-check { color: #fff; font-size: 40px; line-height: 1; font-weight: 400; transform: translateY(-1px); } .letz-atc-title { margin: 0 0 8px; color: #1f2937; font-size: 18px; line-height: 1.3; font-weight: 600; } .letz-atc-subtitle { margin: 0 0 24px; color: #6b7280; font-size: 14px; line-height: 1.5; } .letz-atc-actions { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; } .letz-atc-continue, .letz-atc-viewcart { min-width: 180px; height: 46px; border-radius: 10px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; line-height: 1; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; text-decoration: none !important; cursor: pointer; transition: all .2s ease; } .letz-atc-continue { background: #fff; border: 2px solid #1f2937; color: #1f2937; } .letz-atc-continue:hover { background: #f9fafb; } .letz-atc-viewcart { background: #fff; border: 2px solid #ff4a96; color: #ff4a96; } .letz-atc-viewcart:hover { background: #fff5fa; } /* Mobile toast */ .letz-atc-mobile-toast { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%) translateY(12px); opacity: 0; visibility: hidden; pointer-events: none; transition: all .22s ease; z-index: 999999; } .letz-atc-mobile-toast.is-open { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); } .letz-atc-mobile-inner { display: flex; align-items: center; gap: 10px; background: rgba(17, 24, 39, 0.94); color: #fff; padding: 8px 10px; border-radius: 999px; box-shadow: 0 12px 28px rgba(15, 23, 42, 0.18); min-width: 0; max-width: calc(100vw - 24px); } .letz-atc-mobile-close { width: 28px; min-width: 28px; height: 28px; border: 0; border-radius: 999px; background: rgba(255,255,255,.10); color: #fff; font-size: 16px; line-height: 1; cursor: pointer; padding: 0; display: inline-flex; align-items: center; justify-content: center; } .letz-atc-mobile-text { flex: 1 1 auto; font-size: 13px; line-height: 1.2; font-weight: 500; white-space: nowrap; } .letz-atc-mobile-cartlink { width: 30px; min-width: 30px; height: 30px; border-radius: 999px; background: #ff4a96; display: inline-flex; align-items: center; justify-content: center; text-decoration: none !important; box-shadow: 0 6px 14px rgba(255, 74, 150, 0.24); } .letz-atc-mobile-cartlink svg { width: 14px; height: 14px; stroke: #fff; fill: none; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; } /* Mobile / desktop switch */ @media (max-width: 1024px) { .letz-atc-overlay { display: none !important; } } @media (min-width: 1025px) { .letz-atc-mobile-toast { display: none !important; } } /* ========================================================= ARCHIVE STOCK DISPLAY Desktop: show on hover Mobile: show by default ========================================================= */ /* base stock text */ .woocommerce ul.products li.product .ls-stock, .woocommerce-page ul.products li.product .ls-stock { list-style: none !important; margin: 4px 0 6px !important; padding: 0 !important; font-size: 12px !important; line-height: 1.35 !important; font-weight: 500 !important; text-align: left !important; letter-spacing: -0.01em !important; } /* colors */ .woocommerce ul.products li.product .ls-stock.in-stock, .woocommerce-page ul.products li.product .ls-stock.in-stock { color: #16a34a !important; } .woocommerce ul.products li.product .ls-stock.out-of-stock, .woocommerce-page ul.products li.product .ls-stock.out-of-stock { color: #dc2626 !important; } /* desktop: hidden until hover */ @media (min-width: 1025px) { .woocommerce ul.products li.product .ls-stock, .woocommerce-page ul.products li.product .ls-stock { opacity: 0 !important; visibility: hidden !important; max-height: 0 !important; margin: 0 !important; overflow: hidden !important; transition: opacity .2s ease, visibility .2s ease, max-height .2s ease, margin .2s ease; } .woocommerce ul.products li.product:hover .ls-stock, .woocommerce-page ul.products li.product:hover .ls-stock { opacity: 1 !important; visibility: visible !important; max-height: 30px !important; margin: 4px 0 6px !important; } } /* mobile: always visible */ @media (max-width: 1024px) { .woocommerce ul.products li.product .ls-stock, .woocommerce-page ul.products li.product .ls-stock { opacity: 1 !important; visibility: visible !important; max-height: none !important; display: block !important; margin: 2px 0 6px !important; font-size: 11px !important; } } /* ========================================================= ARCHIVE STOCK DISPLAY POLISH Desktop: only on hover, left aligned, above price/button area Mobile: always visible, left aligned below title ========================================================= */ .woocommerce ul.products li.product .ls-stock, .woocommerce-page ul.products li.product .ls-stock { list-style: none !important; display: block !important; width: 100% !important; margin: 2px 0 6px !important; padding: 0 !important; text-align: left !important; font-size: 11px !important; line-height: 1.3 !important; font-weight: 500 !important; letter-spacing: -0.01em !important; } .woocommerce ul.products li.product .ls-stock.in-stock, .woocommerce-page ul.products li.product .ls-stock.in-stock { color: #6b7280 !important; } .woocommerce ul.products li.product .ls-stock.out-of-stock, .woocommerce-page ul.products li.product .ls-stock.out-of-stock { color: #dc2626 !important; } /* Desktop */ @media (min-width: 1025px) { .woocommerce ul.products li.product .ls-stock, .woocommerce-page ul.products li.product .ls-stock { opacity: 0 !important; visibility: hidden !important; max-height: 0 !important; overflow: hidden !important; margin: 0 !important; text-align: left !important; transition: opacity .2s ease, visibility .2s ease, max-height .2s ease, margin .2s ease; } .woocommerce ul.products li.product:hover .ls-stock, .woocommerce-page ul.products li.product:hover .ls-stock { opacity: 1 !important; visibility: visible !important; max-height: 24px !important; margin: 4px 0 8px !important; } /* prevent stock text from getting hidden behind the hover add-to-cart area */ .woocommerce ul.products li.product:hover .woo-product-info, .woocommerce-page ul.products li.product:hover .woo-product-info { padding-bottom: 26px !important; } } /* Mobile */ @media (max-width: 1024px) { .woocommerce ul.products li.product .ls-stock, .woocommerce-page ul.products li.product .ls-stock { opacity: 1 !important; visibility: visible !important; max-height: none !important; overflow: visible !important; display: block !important; width: 100% !important; text-align: left !important; margin: 2px 0 6px !important; font-size: 10.5px !important; line-height: 1.25 !important; } } /* ========================================================= OUT OF STOCK POLISH - grey disabled add to cart - non-clickable - cleaner out of stock badge on image ========================================================= */ /* ---------- DESKTOP + MOBILE: disable add to cart for out of stock ---------- */ .woocommerce ul.products li.product.outofstock .ls-action-cart a, .woocommerce-page ul.products li.product.outofstock .ls-action-cart a, .woocommerce ul.products li.product.outofstock .ls-mobile-cart a, .woocommerce-page ul.products li.product.outofstock .ls-mobile-cart a, .woocommerce ul.products li.product.outofstock .ls-mobile-cart a.button, .woocommerce-page ul.products li.product.outofstock .ls-mobile-cart a.button, .woocommerce ul.products li.product.outofstock .ls-mobile-cart a.add_to_cart_button, .woocommerce-page ul.products li.product.outofstock .ls-mobile-cart a.add_to_cart_button, .woocommerce ul.products li.product.outofstock .ls-mobile-cart a.product_type_simple, .woocommerce-page ul.products li.product.outofstock .ls-mobile-cart a.product_type_simple, .woocommerce ul.products li.product.outofstock .ls-mobile-cart a.product_type_variable, .woocommerce-page ul.products li.product.outofstock .ls-mobile-cart a.product_type_variable, .woocommerce ul.products li.product.outofstock .ls-mobile-cart a.product_type_grouped, .woocommerce-page ul.products li.product.outofstock .ls-mobile-cart a.product_type_grouped, .woocommerce ul.products li.product.outofstock .ls-mobile-cart a.product_type_external, .woocommerce-page ul.products li.product.outofstock .ls-mobile-cart a.product_type_external { background: #cbd5e1 !important; box-shadow: none !important; pointer-events: none !important; cursor: not-allowed !important; opacity: 1 !important; } /* desktop hover button text/icon muted */ .woocommerce ul.products li.product.outofstock .ls-action-cart a, .woocommerce-page ul.products li.product.outofstock .ls-action-cart a { color: #ffffff !important; } .woocommerce ul.products li.product.outofstock .ls-action-cart a:hover, .woocommerce-page ul.products li.product.outofstock .ls-action-cart a:hover { background: #cbd5e1 !important; color: #ffffff !important; } /* mobile bubble icon stays visible but grey */ .woocommerce ul.products li.product.outofstock .ls-mobile-cart a::before, .woocommerce-page ul.products li.product.outofstock .ls-mobile-cart a::before { opacity: .95 !important; } /* hide view-cart/change-state behavior for out of stock archive buttons */ .woocommerce ul.products li.product.outofstock a.added_to_cart, .woocommerce-page ul.products li.product.outofstock a.added_to_cart { display: none !important; } /* ---------- OUT OF STOCK IMAGE BADGE REDESIGN ---------- */ /* Ocean / Woo common badge selectors */ .woocommerce ul.products li.product.outofstock .outofstock-badge, .woocommerce-page ul.products li.product.outofstock .outofstock-badge, .woocommerce ul.products li.product.outofstock .onsale.outofstock, .woocommerce-page ul.products li.product.outofstock .onsale.outofstock, .woocommerce ul.products li.product.outofstock .stock.out-of-stock, .woocommerce-page ul.products li.product.outofstock .stock.out-of-stock, .woocommerce ul.products li.product.outofstock span.onsale, .woocommerce-page ul.products li.product.outofstock span.onsale { position: absolute !important; top: 10px !important; left: 10px !important; right: auto !important; bottom: auto !important; z-index: 55 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 28px !important; padding: 0 10px !important; border-radius: 8px !important; background: rgba(15, 23, 42, 0.88) !important; color: #ffffff !important; font-size: 10px !important; line-height: 1 !important; font-weight: 600 !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; white-space: nowrap !important; box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18) !important; min-width: 0 !important; width: auto !important; max-width: calc(100% - 64px) !important; /* leaves space for wishlist icon */ overflow: hidden !important; text-overflow: ellipsis !important; } /* if both sale and out-of-stock classes exist, keep badge compact */ .woocommerce ul.products li.product.outofstock .image-wrap, .woocommerce-page ul.products li.product.outofstock .image-wrap { overflow: hidden !important; } /* mobile slightly smaller badge */ @media (max-width: 1024px) { .woocommerce ul.products li.product.outofstock .outofstock-badge, .woocommerce-page ul.products li.product.outofstock .outofstock-badge, .woocommerce ul.products li.product.outofstock .onsale.outofstock, .woocommerce-page ul.products li.product.outofstock .onsale.outofstock, .woocommerce ul.products li.product.outofstock .stock.out-of-stock, .woocommerce-page ul.products li.product.outofstock .stock.out-of-stock, .woocommerce ul.products li.product.outofstock span.onsale, .woocommerce-page ul.products li.product.outofstock span.onsale { top: 8px !important; left: 8px !important; min-height: 24px !important; padding: 0 8px !important; border-radius: 7px !important; font-size: 9px !important; max-width: calc(100% - 56px) !important; } } /* ========================================================= OUT OF STOCK BADGE FIX Hide SALE badge on out-of-stock products Show only OUT OF STOCK badge cleanly ========================================================= */ /* if product is out of stock, hide sale badge completely */ .woocommerce ul.products li.product.outofstock span.onsale, .woocommerce-page ul.products li.product.outofstock span.onsale { display: none !important; } /* keep only the real out-of-stock badge visible and neat */ .woocommerce ul.products li.product.outofstock .outofstock-badge, .woocommerce-page ul.products li.product.outofstock .outofstock-badge, .woocommerce ul.products li.product.outofstock .stock.out-of-stock, .woocommerce-page ul.products li.product.outofstock .stock.out-of-stock { position: absolute !important; top: 8px !important; left: 8px !important; right: auto !important; bottom: auto !important; z-index: 55 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 24px !important; padding: 0 8px !important; border-radius: 7px !important; background: rgba(15, 23, 42, 0.88) !important; color: #ffffff !important; font-size: 9px !important; line-height: 1 !important; font-weight: 600 !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; white-space: nowrap !important; box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18) !important; } /* ========================================================= PHASE 1 — ARCHIVE FILTER UI SHELL Desktop sidebar + mobile top toolbar ========================================================= */ /* Hide grid/list toggle icons */ .woocommerce .gridlist-toggle, .woocommerce-page .gridlist-toggle, .woocommerce .oceanwp-gridlist-toggle, .woocommerce-page .oceanwp-gridlist-toggle, .woocommerce .archive-grid-list, .woocommerce-page .archive-grid-list, .woocommerce .oceanwp-grid-list, .woocommerce-page .oceanwp-grid-list, .woocommerce .site-main .products.grid, .woocommerce-page .site-main .products.grid { } /* try common Ocean toggle selectors */ .woocommerce .toggle-grid, .woocommerce .toggle-list, .woocommerce-page .toggle-grid, .woocommerce-page .toggle-list, .woocommerce .products.grid .owp-gridlist-toggle, .woocommerce-page .products.grid .owp-gridlist-toggle, .woocommerce .gridlist-button-wrap, .woocommerce-page .gridlist-button-wrap { display: none !important; } /* ---------- desktop custom archive sidebar ---------- */ .letz-archive-sidebar { display: block; } .letz-archive-sidebar .letz-filter-card, .letz-mobile-filter-panel .letz-filter-card { background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.07); border-radius: 18px; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05); padding: 18px; margin-bottom: 16px; } .letz-filter-title { margin: 0 0 14px; color: #0f172a; font-size: 15px; line-height: 1.2; font-weight: 600; } .letz-filter-searchbox { display: flex; gap: 10px; } .letz-filter-searchbox input, .letz-filter-price-grid input { width: 100%; height: 42px; border: 1px solid rgba(15, 23, 42, 0.12); border-radius: 12px; padding: 0 14px; font-size: 14px; line-height: 1; color: #0f172a; background: #fff; } .letz-filter-searchbox input:focus, .letz-filter-price-grid input:focus { outline: none; border-color: #ff4a96; box-shadow: 0 0 0 3px rgba(255, 74, 150, 0.10); } .letz-filter-searchbox button, .letz-filter-apply-btn { height: 42px; border: 0; border-radius: 12px; background: #ff4a96; color: #fff; padding: 0 16px; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; } .letz-filter-searchbox button:hover, .letz-filter-apply-btn:hover { background: #f2388a; } .letz-filter-price-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; } .letz-filter-checklist { display: flex; flex-direction: column; gap: 10px; } .letz-filter-check { display: flex; align-items: center; gap: 10px; color: #334155; font-size: 14px; line-height: 1.3; cursor: pointer; } .letz-filter-check input { accent-color: #ff4a96; } .letz-filter-empty { margin: 0; font-size: 13px; color: #64748b; } /* ---------- top toolbar card ---------- */ .letz-archive-toolbar-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0 0 18px; padding: 14px 16px; background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.07); border-radius: 16px; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05); } .letz-toolbar-left { display: none; align-items: center; gap: 10px; } .letz-mobile-search-toggle, .letz-mobile-filter-toggle { height: 42px; border: 1px solid rgba(15, 23, 42, 0.10); background: #fff; border-radius: 12px; padding: 0 14px; display: inline-flex; align-items: center; gap: 8px; color: #0f172a; font-size: 13px; font-weight: 600; cursor: pointer; } .letz-mobile-search-toggle.is-active, .letz-mobile-filter-toggle.is-active { border-color: #ff4a96; color: #ff4a96; } .letz-toolbar-icon { font-size: 15px; line-height: 1; } /* keep sort dropdown nice */ .woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering { margin: 0 !important; } .woocommerce .woocommerce-ordering select, .woocommerce-page .woocommerce-ordering select { min-width: 220px; height: 42px; border: 1px solid rgba(15, 23, 42, 0.12); border-radius: 12px; padding: 0 38px 0 14px; background-color: #fff; } /* ---------- mobile panels ---------- */ .letz-mobile-search-panel, .letz-mobile-filter-panel { display: none; margin: 0 0 16px; background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.07); border-radius: 18px; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05); overflow: hidden; } .letz-mobile-search-panel.is-open, .letz-mobile-filter-panel.is-open { display: block; } .letz-mobile-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 16px 0; } .letz-mobile-panel-head h3 { margin: 0; font-size: 16px; line-height: 1.2; font-weight: 600; color: #0f172a; } .letz-mobile-search-close, .letz-mobile-filter-close { width: 34px; min-width: 34px; height: 34px; border: 0; border-radius: 999px; background: #f8fafc; color: #0f172a; font-size: 22px; line-height: 1; cursor: pointer; } .letz-mobile-panel-body { padding: 16px; } .letz-mobile-filter-actions { padding-top: 8px; } /* ---------- desktop / mobile visibility ---------- */ @media (min-width: 1025px) { .letz-mobile-search-panel, .letz-mobile-filter-panel { display: none !important; } .letz-toolbar-left { display: none !important; } .letz-archive-toolbar-card { justify-content: flex-end; } } @media (max-width: 1024px) { /* hide desktop sidebar on archive screens */ .post-type-archive-product #secondary, .tax-product_cat #secondary, .tax-product_tag #secondary { display: none !important; } .letz-archive-toolbar-card { flex-wrap: wrap; align-items: stretch; padding: 12px; gap: 10px; } .letz-toolbar-left { display: flex; width: 100%; } .letz-mobile-search-toggle, .letz-mobile-filter-toggle { flex: 1 1 0; justify-content: center; } .woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering { width: 100%; } .woocommerce .woocommerce-ordering select, .woocommerce-page .woocommerce-ordering select { width: 100%; min-width: 0; } } /* ========================================================= PHASE 1 FIXES — desktop sidebar replacement + hide grid/list ========================================================= */ /* hide grid/list icons strongly */ .gridlist-toggle, .oceanwp-gridlist-toggle, .gridlist-button-wrap, .archive-grid-list, .toggle-grid, .toggle-list, .shop-layout-switcher, .display-mode, .archive-view-switcher, .grid-view, .list-view, .oceanwp-grid-list, .woocommerce .gridlist-toggle, .woocommerce-page .gridlist-toggle, .woocommerce .oceanwp-gridlist-toggle, .woocommerce-page .oceanwp-gridlist-toggle, .woocommerce .gridlist-button-wrap, .woocommerce-page .gridlist-button-wrap, .woocommerce .archive-grid-list, .woocommerce-page .archive-grid-list, .woocommerce .toggle-grid, .woocommerce .toggle-list, .woocommerce-page .toggle-grid, .woocommerce-page .toggle-list, .woocommerce .shop-layout-switcher, .woocommerce-page .shop-layout-switcher, .woocommerce .display-mode, .woocommerce-page .display-mode, .woocommerce .archive-view-switcher, .woocommerce-page .archive-view-switcher, .woocommerce .grid-view, .woocommerce .list-view, .woocommerce-page .grid-view, .woocommerce-page .list-view, .woocommerce .oceanwp-grid-list, .woocommerce-page .oceanwp-grid-list { display: none !important; } /* desktop sidebar injected content */ .letz-sidebar-ready { padding: 0 !important; } .letz-sidebar-ready .letz-desktop-sidebar-inner { display: block !important; } .letz-sidebar-ready .letz-filter-card { background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.07); border-radius: 18px; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05); padding: 18px; margin-bottom: 16px; } .letz-filter-title { margin: 0 0 14px; color: #0f172a; font-size: 15px; line-height: 1.2; font-weight: 600; } .letz-filter-searchbox { display: flex; gap: 10px; } .letz-filter-searchbox input, .letz-filter-price-grid input { width: 100%; height: 42px; border: 1px solid rgba(15, 23, 42, 0.12); border-radius: 12px; padding: 0 14px; font-size: 14px; line-height: 1; color: #0f172a; background: #fff; } .letz-filter-searchbox button, .letz-filter-apply-btn { height: 42px; border: 0; border-radius: 12px; background: #ff4a96; color: #fff; padding: 0 16px; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; } .letz-filter-price-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; } .letz-filter-checklist { display: flex; flex-direction: column; gap: 10px; } .letz-filter-check { display: flex; align-items: center; gap: 10px; color: #334155; font-size: 14px; line-height: 1.3; cursor: pointer; } .letz-filter-check input { accent-color: #ff4a96; } .letz-filter-empty { margin: 0; font-size: 13px; color: #64748b; } /* top toolbar */ .letz-archive-toolbar-card { display: flex; align-items: center; gap: 14px; margin: 0 0 18px; padding: 14px 16px; background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.07); border-radius: 16px; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05); } .letz-toolbar-left { display: none; align-items: center; gap: 10px; } .letz-mobile-search-toggle, .letz-mobile-filter-toggle { height: 42px; border: 1px solid rgba(15, 23, 42, 0.10); background: #fff; border-radius: 12px; padding: 0 14px; display: inline-flex; align-items: center; gap: 8px; color: #0f172a; font-size: 13px; font-weight: 600; cursor: pointer; } .letz-mobile-search-toggle.is-active, .letz-mobile-filter-toggle.is-active { border-color: #ff4a96; color: #ff4a96; } .letz-toolbar-icon { font-size: 15px; line-height: 1; } .woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering { margin: 0 !important; } .woocommerce .woocommerce-ordering select, .woocommerce-page .woocommerce-ordering select { min-width: 220px; height: 42px; border: 1px solid rgba(15, 23, 42, 0.12); border-radius: 12px; padding: 0 38px 0 14px; background-color: #fff; } /* desktop */ @media (min-width: 1025px) { .letz-mobile-search-panel, .letz-mobile-filter-panel { display: none !important; } .letz-toolbar-left { display: none !important; } .letz-archive-toolbar-card { justify-content: flex-end !important; width: fit-content; min-width: 300px; margin-left: auto; } } /* mobile */ .letz-mobile-search-panel, .letz-mobile-filter-panel { display: none; margin: 0 0 16px; background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.07); border-radius: 18px; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05); overflow: hidden; } .letz-mobile-search-panel.is-open, .letz-mobile-filter-panel.is-open { display: block; } .letz-mobile-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 16px 0; } .letz-mobile-panel-head h3 { margin: 0; font-size: 16px; line-height: 1.2; font-weight: 600; color: #0f172a; } .letz-mobile-search-close, .letz-mobile-filter-close { width: 34px; min-width: 34px; height: 34px; border: 0; border-radius: 999px; background: #f8fafc; color: #0f172a; font-size: 22px; line-height: 1; cursor: pointer; } .letz-mobile-panel-body { padding: 16px; } .letz-mobile-filter-actions { padding-top: 8px; } @media (max-width: 1024px) { .letz-archive-toolbar-card { flex-wrap: wrap; align-items: stretch; padding: 12px; gap: 10px; } .letz-toolbar-left { display: flex; width: 100%; } .letz-mobile-search-toggle, .letz-mobile-filter-toggle { flex: 1 1 0; justify-content: center; } .woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering { width: 100%; } .woocommerce .woocommerce-ordering select, .woocommerce-page .woocommerce-ordering select { width: 100%; min-width: 0; } } /* ========================================================= PHASE 1 MOBILE CLEANUP - hide old sidebar completely on mobile - remove leftover gap above mobile toolbar ========================================================= */ @media (max-width: 1024px) { /* 1) hide old Ocean/WP sidebar everywhere on mobile */ #secondary, #left-sidebar, #right-sidebar, .widget-area, .sidebar-box, aside.widget-area, .content-left-sidebar #secondary, .content-right-sidebar #secondary, .content-left-sidebar .widget-area, .content-right-sidebar .widget-area { display: none !important; } /* but keep our custom mobile panels visible */ .letz-mobile-search-panel, .letz-mobile-filter-panel { display: none; } .letz-mobile-search-panel.is-open, .letz-mobile-filter-panel.is-open { display: block !important; } /* 2) remove leftover gap above toolbar */ .woocommerce-before-shop, .archive.woocommerce-page .site-main > .page-header + *, .archive.post-type-archive-product .site-main > .page-header + *, .tax-product_cat .site-main > .page-header + *, .tax-product_tag .site-main > .page-header + * { margin-top: 0 !important; } /* 3) tighten the toolbar block */ .letz-archive-toolbar-card { margin-top: 0 !important; } /* 4) hide any old top archive control wrappers that still reserve space */ .gridlist-toggle, .oceanwp-gridlist-toggle, .gridlist-button-wrap, .archive-grid-list, .toggle-grid, .toggle-list, .shop-layout-switcher, .display-mode, .archive-view-switcher, .grid-view, .list-view, .oceanwp-grid-list, .woocommerce-result-count { display: none !important; margin: 0 !important; padding: 0 !important; height: 0 !important; min-height: 0 !important; } /* 5) if Ocean leaves an empty hr/row before products, collapse it */ .site-main > hr, .content-area hr, .woocommerce-products-header + hr { margin: 0 !important; display: none !important; } } /* ========================================================= MOBILE ARCHIVE HEADER GAP FIX Remove empty space between page header and filter toolbar ========================================================= */ @media (max-width: 1024px) { /* tighten Woo archive header block */ .woocommerce-products-header, .woocommerce-page .woocommerce-products-header { margin: 0 !important; padding: 0 0 8px !important; min-height: 0 !important; border: 0 !important; } /* remove empty archive description area if present */ .woocommerce-products-header__description, .term-description, .page-description, .archive-description { margin: 0 !important; padding: 0 !important; min-height: 0 !important; } .woocommerce-products-header__description:empty, .term-description:empty, .page-description:empty, .archive-description:empty { display: none !important; } /* remove extra wrappers that sit between header and toolbar */ .woocommerce-before-shop, .archive.woocommerce-page .site-main > .woocommerce-notices-wrapper, .archive.post-type-archive-product .site-main > .woocommerce-notices-wrapper, .tax-product_cat .site-main > .woocommerce-notices-wrapper, .tax-product_tag .site-main > .woocommerce-notices-wrapper { display: none !important; margin: 0 !important; padding: 0 !important; min-height: 0 !important; height: 0 !important; } /* collapse empty clears/dividers before toolbar */ .site-main > .clear, .page-content > .clear, .woocommerce-products-header + .clear, .woocommerce-products-header + .clear + .clear { display: none !important; margin: 0 !important; padding: 0 !important; height: 0 !important; } /* tighten custom toolbar position */ .letz-archive-toolbar-card { margin-top: 0 !important; } } @media (max-width: 1024px) { .page-header, .woocommerce-page .page-header { padding-bottom: 12px !important; margin-bottom: 0 !important; } } /* ========================================================= OCEANWP MOBILE GAP FIX Reduce only the space between page-header bottom line and the products/filter section top line ========================================================= */ @media (max-width: 1024px) { body.tax-product_cat #main #content-wrap, body.tax-product_tag #main #content-wrap, body.post-type-archive-product #main #content-wrap, body.woocommerce-page #main #content-wrap { padding-top: 10px !important; } body.tax-product_cat #main #content-wrap .container, body.tax-product_tag #main #content-wrap .container, body.post-type-archive-product #main #content-wrap .container, body.woocommerce-page #main #content-wrap .container { padding-top: 0 !important; margin-top: 0 !important; } body.tax-product_cat #main .content-area, body.tax-product_tag #main .content-area, body.post-type-archive-product #main .content-area, body.woocommerce-page #main .content-area { padding-top: 0 !important; margin-top: 0 !important; } body.tax-product_cat #main .site-main, body.tax-product_tag #main .site-main, body.post-type-archive-product #main .site-main, body.woocommerce-page #main .site-main { padding-top: 0 !important; margin-top: 0 !important; } body.tax-product_cat #main .woocommerce, body.tax-product_tag #main .woocommerce, body.post-type-archive-product #main .woocommerce, body.woocommerce-page #main .woocommerce { margin-top: 0 !important; padding-top: 0 !important; } body.tax-product_cat .letz-archive-toolbar-card, body.tax-product_tag .letz-archive-toolbar-card, body.post-type-archive-product .letz-archive-toolbar-card, body.woocommerce-page .letz-archive-toolbar-card { margin-top: 0 !important; } } /* ========================================================= PHASE 2 — AJAX GRID LOADING ========================================================= */ #letz-products-grid-wrap { position: relative; } #letz-products-grid-wrap.letz-grid-loading, #letz-products-grid-wrap.letz-grid-loading ul.products { opacity: .45; pointer-events: none; transition: opacity .18s ease; } .letz-no-products { background: #fff; border: 1px solid rgba(15,23,42,.07); border-radius: 16px; padding: 28px 22px; color: #475569; font-size: 15px; line-height: 1.5; } #letz-products-grid-wrap { position: relative; } #letz-products-grid-wrap.letz-grid-loading, #letz-products-grid-wrap.letz-grid-loading ul.products { opacity: .45; pointer-events: none; transition: opacity .18s ease; } .letz-no-products { background: #fff; border: 1px solid rgba(15,23,42,.07); border-radius: 16px; padding: 28px 22px; color: #475569; font-size: 15px; line-height: 1.5; } ul.products.letz-grid-loading, .letz-no-products.letz-grid-loading { opacity: .45; pointer-events: none; transition: opacity .18s ease; } .letz-no-products { background: #fff; border: 1px solid rgba(15,23,42,.07); border-radius: 16px; padding: 28px 22px; color: #475569; font-size: 15px; line-height: 1.5; } .letz-filter-stock-select { width: 100%; height: 44px; border: 1px solid rgba(15,23,42,.12); border-radius: 12px; background: #fff; padding: 0 14px; font-size: 14px; color: #0f172a; } /* ========================================================= ARCHIVE SKU DISPLAY ========================================================= */ /* Archive SKU under title */ .woocommerce ul.products li.product .ls-sku, .woocommerce-page ul.products li.product .ls-sku { display: block !important; margin: 4px 0 8px !important; padding: 0 !important; color: #6b7280 !important; font-size: 12px !important; line-height: 1.35 !important; font-weight: 500 !important; text-align: left !important; font-family: "Poppins", "DM Sans", "Inter", sans-serif !important; } @media (max-width: 1024px) { .woocommerce ul.products li.product .ls-sku, .woocommerce-page ul.products li.product .ls-sku { margin: 3px 0 7px !important; font-size: 11px !important; line-height: 1.3 !important; } } /* ========================================================= DESKTOP HOVER MINI CARD WIDTH FIX Prevent add-to-cart from overflowing outside hover card ========================================================= */ @media (min-width: 1025px) { /* keep hover info card inside product width */ .woocommerce ul.products li.product .woo-product-info, .woocommerce-page ul.products li.product .woo-product-info { width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; overflow: hidden !important; } /* price + cart row must stay inside card */ .woocommerce ul.products li.product .ls-price-cart-row, .woocommerce-page ul.products li.product .ls-price-cart-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; overflow: hidden !important; } /* price side can shrink */ .woocommerce ul.products li.product .ls-price-col, .woocommerce-page ul.products li.product .ls-price-col { flex: 1 1 auto !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; } /* desktop cart wrapper stays compact */ .woocommerce ul.products li.product .ls-mobile-cart-wrap, .woocommerce-page ul.products li.product .ls-mobile-cart-wrap { flex: 0 0 auto !important; min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; } .woocommerce ul.products li.product .ls-mobile-cart, .woocommerce-page ul.products li.product .ls-mobile-cart { max-width: 100% !important; box-sizing: border-box !important; } /* actual desktop hover button */ .woocommerce ul.products li.product .ls-action-cart a, .woocommerce-page ul.products li.product .ls-action-cart a, .woocommerce ul.products li.product .ls-mobile-cart a, .woocommerce-page ul.products li.product .ls-mobile-cart a, .woocommerce ul.products li.product .ls-mobile-cart a.button, .woocommerce-page ul.products li.product .ls-mobile-cart a.button { min-width: 0 !important; max-width: 100% !important; width: auto !important; padding: 0 14px !important; font-size: 11px !important; height: 40px !important; white-space: nowrap !important; box-sizing: border-box !important; } /* slightly tighter hover info spacing */ .woocommerce ul.products li.product .woo-product-info, .woocommerce-page ul.products li.product .woo-product-info { padding-left: 12px !important; padding-right: 12px !important; padding-bottom: 12px !important; } } /* ========================================================= DESKTOP HOVER FINAL FIX Use only desktop hover button, never mobile cart in desktop hover card ========================================================= */ @media (min-width: 1025px) { /* keep mobile cart hidden on desktop */ .woocommerce ul.products li.product .ls-mobile-cart-wrap, .woocommerce-page ul.products li.product .ls-mobile-cart-wrap, .woocommerce ul.products li.product .ls-mobile-cart, .woocommerce-page ul.products li.product .ls-mobile-cart { display: none !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; width: 0 !important; min-width: 0 !important; height: 0 !important; overflow: hidden !important; } /* desktop hover info row should only show price cleanly */ .woocommerce ul.products li.product .ls-price-cart-row, .woocommerce-page ul.products li.product .ls-price-cart-row { display: block !important; width: 100% !important; overflow: hidden !important; } .woocommerce ul.products li.product .ls-price-col, .woocommerce-page ul.products li.product .ls-price-col { display: block !important; width: 100% !important; } /* keep desktop hover button clean and centered on image */ .woocommerce ul.products li.product .ls-card-actions, .woocommerce-page ul.products li.product .ls-card-actions { left: 50% !important; bottom: 18px !important; transform: translateX(-50%) !important; } .woocommerce ul.products li.product .ls-action-cart a, .woocommerce-page ul.products li.product .ls-action-cart a { min-width: 120px !important; width: auto !important; height: 40px !important; padding: 0 16px !important; border-radius: 12px !important; font-size: 11px !important; line-height: 1 !important; white-space: nowrap !important; text-indent: 0 !important; color: #fff !important; background: rgba(20,20,20,.88) !important; } } /* Desktop hover button polish */ @media (min-width: 1025px) { .woocommerce ul.products li.product .ls-action-cart a, .woocommerce-page ul.products li.product .ls-action-cart a { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 118px !important; height: 40px !important; padding: 0 16px !important; border-radius: 12px !important; background: #FF4A96 !important; color: #fff !important; border: 0 !important; box-shadow: 0 10px 22px rgba(255, 74, 150, 0.26) !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1 !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; text-indent: 0 !important; white-space: nowrap !important; vertical-align: middle !important; } .woocommerce ul.products li.product .ls-action-cart a:hover, .woocommerce-page ul.products li.product .ls-action-cart a:hover { background: #f2388a !important; color: #fff !important; box-shadow: 0 12px 24px rgba(242, 56, 138, 0.28) !important; } } /* Mobile wishlish - menu drowdown row */ .letz-drawer-utility-links { padding: 18px 16px 10px; display: flex; flex-direction: column; gap: 10px; } .letz-drawer-utility-links a { display: block; color: #fff; text-decoration: none; font-size: 15px; font-weight: 600; padding: 10px 0; border-top: 1px solid rgba(255,255,255,0.08); } .letz-drawer-utility-links a:first-child { border-top: 0; } /* Active wishlist icon in mobile header */ .letz-mobile-wishlist-injected.is-active a, .letz-mobile-wishlist-injected.is-active .wishlist_products_counter, .letz-mobile-wishlist-injected.is-active .tinvwl_add_to_wishlist_button, .letz-mobile-wishlist-injected.is-active .tinv-wishlist a { background: #ff4a96 !important; color: #fff !important; border-radius: 10px !important; } .letz-mobile-wishlist-injected.is-active a svg, .letz-mobile-wishlist-injected.is-active a i { color: #fff !important; fill: #fff !important; } /* Mobile header injected wishlist icon */ .letz-mobile-wishlist-injected { display: inline-flex; align-items: center; justify-content: center; margin-right: 10px; } .letz-mobile-wishlist-injected a { width: 34px; min-width: 34px; height: 34px; min-height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: transparent; color: #ffffff; text-decoration: none !important; transition: all .2s ease; } .letz-mobile-wishlist-injected a svg { width: 19px; height: 19px; display: block; } .letz-mobile-wishlist-injected a svg path { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .letz-mobile-wishlist-injected.is-active a { background: #FF4A96; color: #ffffff; box-shadow: 0 8px 18px rgba(255, 74, 150, 0.24); } /* Additional Css from customizer */ /* Mobile top bar: hide social icons, keep only free shipping text */ @media (max-width: 959px) { /* hide social block */ #top-bar-social, #top-bar-social.topbar-social, #top-bar-social ul, #top-bar-social .oceanwp-social-menu { display: none !important; } /* make top bar content centered */ #top-bar-content { display: flex !important; align-items: center !important; justify-content: center !important; min-height: 38px !important; width: 100% !important; } /* keep only free shipping text */ #top-bar-content .topbar-content, #top-bar-content .topbar-content p, #top-bar-content .topbar-content span, #top-bar-content .topbar-content a { display: block !important; width: 100% !important; margin: 0 !important; text-align: center !important; font-size: 12px !important; line-height: 1.2 !important; letter-spacing: 0.14em !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } } @media (max-width: 959px) { .letz-mobile-wishlist-injected { display: inline-flex !important; align-items: center !important; justify-content: center !important; margin-right: 10px !important; margin-left: 0 !important; order: 1 !important; } .letz-mobile-wishlist-injected a, .letz-mobile-wishlist-injected .wishlist_products_counter, .letz-mobile-wishlist-injected .tinvwl_add_to_wishlist_button { display: inline-flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important; text-decoration: none !important; } } @media (max-width: 959px) { .letz-mobile-wishlist-injected { display: inline-flex !important; align-items: center !important; justify-content: center !important; margin-right: 3px !important; margin-left: 8px !important; position: relative !important; top: 3px !important; } .letz-mobile-wishlist-injected a, .letz-mobile-wishlist-injected .wishlist_products_counter, .letz-mobile-wishlist-injected .tinvwl_add_to_wishlist_button { display: inline-flex !important; align-items: center !important; justify-content: center !important; line-height: 1 !important; text-decoration: none !important; } } /* ========================================================= DESKTOP HEADER ACCOUNT ICON Order: wishlist -> account -> cart -> search ========================================================= */ .letz-header-account-item { display: inline-flex !important; align-items: center !important; justify-content: center !important; list-style: none !important; margin: 0 10px 0 10px !important; padding: 0 !important; position: relative !important; top: 0 !important; vertical-align: middle !important; } .letz-header-account-link { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 22px !important; height: 22px !important; color: #ffffff !important; text-decoration: none !important; line-height: 1 !important; opacity: 1 !important; position: relative !important; top: 0 !important; } .letz-header-account-link:hover { opacity: 0.82 !important; } .letz-header-account-icon { position: relative !important; display: inline-block !important; width: 14px !important; height: 14px !important; top: 18px !important; } /* head */ .letz-header-account-icon::before { content: "" !important; position: absolute !important; left: 50% !important; top: 0 !important; width: 5px !important; height: 5px !important; margin-left: -2.5px !important; border: 1.6px solid #ffffff !important; border-radius: 50% !important; box-sizing: border-box !important; background: transparent !important; } /* shoulders/body */ .letz-header-account-icon::after { content: "" !important; position: absolute !important; left: 50% !important; bottom: 0 !important; width: 10px !important; height: 6px !important; margin-left: -5px !important; border: 1.6px solid #ffffff !important; border-top: 0 !important; border-radius: 0 0 10px 10px !important; box-sizing: border-box !important; background: transparent !important; } /* make it visually match nearby icons */ #site-header .letz-header-account-item, #site-header .letz-header-account-link { color: #ffffff !important; } @media (max-width: 959px) { #mobile-dropdown .letz-mobile-account-menu-item > a, #sidr .letz-mobile-account-menu-item > a { font-size: 9px !important; font-weight: 400 !important; line-height: 1.4 !important; color: #ffffff !important; } } /* ========================================== LETZSHOPY DESKTOP DROPDOWN - NESTED FIX First level attached + second level opens properly ========================================== */ @media only screen and (min-width: 960px) { /* parent anchors */ #site-navigation-wrap .dropdown-menu > li, #site-navigation-wrap .dropdown-menu li.menu-item-has-children { position: relative; } /* FIRST LEVEL DROPDOWN */ #site-navigation-wrap .dropdown-menu > li > ul.sub-menu, #site-navigation-wrap .dropdown-menu > li > ul.children { background: #111111 !important; border: 1px solid rgba(255,255,255,0.07) !important; border-radius: 0 0 14px 14px !important; min-width: 240px !important; padding: 8px 0 !important; margin-top: 0 !important; top: 100% !important; left: 0 !important; box-shadow: 0 14px 28px rgba(0,0,0,0.22) !important; overflow: visible !important; z-index: 9999 !important; } /* FIRST LEVEL LINKS */ #site-navigation-wrap .dropdown-menu li ul.sub-menu li > a, #site-navigation-wrap .dropdown-menu li ul.children li > a { color: #f4f4f4 !important; background: transparent !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.45 !important; padding: 11px 16px !important; border: 0 !important; transition: all 0.2s ease !important; position: relative !important; } /* subtle divider */ #site-navigation-wrap .dropdown-menu li ul.sub-menu li:not(:last-child) > a, #site-navigation-wrap .dropdown-menu li ul.children li:not(:last-child) > a { border-bottom: 1px solid rgba(255,255,255,0.05) !important; } /* hover */ #site-navigation-wrap .dropdown-menu li ul.sub-menu li > a:hover, #site-navigation-wrap .dropdown-menu li ul.children li > a:hover { background: rgba(255,255,255,0.05) !important; color: #ff4f93 !important; padding-left: 20px !important; } /* NESTED / SECOND-LEVEL DROPDOWN */ #site-navigation-wrap .dropdown-menu li ul.sub-menu li ul.sub-menu, #site-navigation-wrap .dropdown-menu li ul.children li ul.children, #site-navigation-wrap .dropdown-menu li ul.sub-menu li ul.children, #site-navigation-wrap .dropdown-menu li ul.children li ul.sub-menu { top: 0 !important; left: 100% !important; margin-top: 0 !important; margin-left: 0 !important; min-width: 220px !important; background: #111111 !important; border: 1px solid rgba(255,255,255,0.07) !important; border-radius: 14px !important; padding: 8px 0 !important; box-shadow: 0 14px 28px rgba(0,0,0,0.22) !important; overflow: visible !important; z-index: 10000 !important; } /* make sure nested submenu appears on hover */ #site-navigation-wrap .dropdown-menu li ul.sub-menu li:hover > ul.sub-menu, #site-navigation-wrap .dropdown-menu li ul.sub-menu li:hover > ul.children, #site-navigation-wrap .dropdown-menu li ul.children li:hover > ul.sub-menu, #site-navigation-wrap .dropdown-menu li ul.children li:hover > ul.children { display: block !important; opacity: 1 !important; visibility: visible !important; } /* right arrow for items having deeper submenu */ #site-navigation-wrap .dropdown-menu li ul.sub-menu li.menu-item-has-children > a:after, #site-navigation-wrap .dropdown-menu li ul.children li.menu-item-has-children > a:after { content: "›"; position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 14px; color: #ff4f93; } /* remove any theme offset causing gap */ #site-navigation-wrap .dropdown-menu li ul, #site-navigation-wrap .dropdown-menu li.sfHover ul { margin-top: 0 !important; } } /* Hide default OceanWP submenu arrow inside dropdown items */ @media only screen and (min-width: 960px) { #site-navigation-wrap .dropdown-menu li ul.sub-menu li.menu-item-has-children > a .nav-arrow, #site-navigation-wrap .dropdown-menu li ul.children li.menu-item-has-children > a .nav-arrow, #site-navigation-wrap .dropdown-menu li ul.sub-menu li.menu-item-has-children > a .owp-nav-arrow, #site-navigation-wrap .dropdown-menu li ul.children li.menu-item-has-children > a .owp-nav-arrow, #site-navigation-wrap .dropdown-menu li ul.sub-menu li.menu-item-has-children > a i, #site-navigation-wrap .dropdown-menu li ul.children li.menu-item-has-children > a i { display: none !important; } } /* Footer headings */ #footer-widgets .widget-title, #footer-widgets h4, #footer-widgets h5 { color: #ffffff; font-size: 24px; font-weight: 600; margin-bottom: 18px; } /* Footer list reset */ .footer-cat-list, .footer-why-list { list-style: none; margin: 0; padding: 0; } /* Category links */ .footer-cat-list li, .footer-why-list li { margin-bottom: 12px; color: #d8d8d8; line-height: 1.6; } /* Category links with arrow */ .footer-cat-list li a { color: #d8d8d8; text-decoration: none; position: relative; padding-left: 16px; display: inline-block; transition: all 0.25s ease; } .footer-cat-list li a:before { content: "›"; position: absolute; left: 0; top: 0; color: #ff4f93; font-size: 16px; line-height: 1.2; } .footer-cat-list li a:hover { color: #ff4f93; } /* Why shop list bullets */ .footer-why-list li { position: relative; padding-left: 16px; } .footer-why-list li:before { content: "•"; position: absolute; left: 0; top: 0; color: #ff4f93; font-size: 18px; line-height: 1.1; } /* Force footer widgets into 4 equal columns on desktop */ @media (min-width: 961px) { #footer-widgets .footer-box { width: 25% !important; float: left !important; margin-right: 0 !important; padding-left: 18px !important; padding-right: 18px !important; box-sizing: border-box !important; } /* Let column 1 content wrap properly */ #footer-widgets .footer-box:first-child p, #footer-widgets .footer-box:first-child a { word-break: break-word; overflow-wrap: anywhere; } /* Keep logo controlled */ #footer-widgets .custom-logo, #footer-widgets .widget_media_image img, #footer-widgets img { max-width: 150px !important; height: auto !important; } } #footer-widgets .widget-title, #footer-widgets h4, #footer-widgets h5 { color: #ffffff; font-size: 24px; font-weight: 600; margin-bottom: 18px; } /* precise footer heading alignment for columns 2, 3, 4 */ @media (min-width: 961px) { #footer-widgets .footer-box:nth-child(2), #footer-widgets .footer-box:nth-child(3), #footer-widgets .footer-box:nth-child(4) { padding-top: 10px !important; } #footer-widgets .footer-box:nth-child(2) .widget-title, #footer-widgets .footer-box:nth-child(3) .widget-title, #footer-widgets .footer-box:nth-child(4) .widget-title, #footer-widgets .footer-box:nth-child(4) h4.widget-title { margin: 0 0 18px !important; padding: 0 !important; } #footer-widgets .footer-box:nth-child(2) .menu, #footer-widgets .footer-box:nth-child(3) .footer-cat-list, #footer-widgets .footer-box:nth-child(4) .footer-why-list { margin-top: 0 !important; padding-top: 0 !important; } } @media (min-width: 961px) { #footer-widgets .footer-box:nth-child(3) .widget-title { position: relative; top: -15px; } } @media (min-width: 961px) { #footer-widgets .container, #footer-bottom .container { max-width: 1180px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 85px !important; padding-right: 45px !important; box-sizing: border-box !important; } } /* Mobile footer: 2 columns per row */ @media (max-width: 767px) { /* Footer outer spacing */ #footer-widgets .container, #footer-bottom .container { padding-left: 18px !important; padding-right: 18px !important; box-sizing: border-box !important; } /* 4 footer boxes -> 2 columns */ #footer-widgets .footer-box { width: 50% !important; float: left !important; clear: none !important; margin: 0 0 24px 0 !important; padding-left: 10px !important; padding-right: 10px !important; box-sizing: border-box !important; min-height: 1px !important; } /* Align odd columns left, even columns right */ #footer-widgets .footer-box:nth-child(1), #footer-widgets .footer-box:nth-child(3) { text-align: left !important; } #footer-widgets .footer-box:nth-child(2), #footer-widgets .footer-box:nth-child(4) { text-align: right !important; } /* Row 2 starts properly */ #footer-widgets .footer-box:nth-child(3) { clear: left !important; } /* Titles smaller on mobile */ #footer-widgets .widget-title, #footer-widgets h4, #footer-widgets h5 { font-size: 18px !important; line-height: 1.3 !important; margin-bottom: 12px !important; } /* Footer body text smaller */ #footer-widgets, #footer-widgets p, #footer-widgets li, #footer-widgets a { font-size: 14px !important; line-height: 1.6 !important; } /* Menu and lists spacing */ #footer-widgets .menu li, .footer-cat-list li, .footer-why-list li { margin-bottom: 8px !important; } /* Make quick links and categories arrows look neat */ .footer-cat-list li a { padding-left: 12px !important; } .footer-cat-list li a:before { font-size: 14px !important; top: 1px !important; } .footer-why-list li { padding-left: 12px !important; } .footer-why-list li:before { font-size: 14px !important; top: 2px !important; } /* Contact column links/text wrap neatly */ #footer-widgets .footer-box:first-child p, #footer-widgets .footer-box:first-child a { word-break: break-word; overflow-wrap: anywhere; } /* Logo smaller on mobile */ #footer-widgets .custom-logo, #footer-widgets .widget_media_image img, #footer-widgets img { max-width: 120px !important; height: auto !important; } /* Copyright centered and smaller */ #footer-bottom, #footer-bottom #copyright, #footer-bottom .copyright, #footer-bottom p, #footer-bottom a { text-align: center !important; font-size: 12px !important; line-height: 1.5 !important; } #footer-bottom { padding-top: 12px !important; padding-bottom: 12px !important; } } /* ========================================================= LETZSHOPY SINGLE PRODUCT REDESIGN ========================================================= */ .single-product div.product.letz-single-product { width: 100%; max-width: 100%; margin: 0; } .single-product .letz-sp-wrap { max-width: 1320px; margin: 0 auto; padding: 24px 20px 40px; } .single-product .letz-sp-top { margin-bottom: 18px; } .single-product .letz-sp-breadcrumb { font-size: 13px; color: #64748b; } .single-product .letz-sp-breadcrumb .woocommerce-breadcrumb { margin: 0; } .single-product .letz-sp-main { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, 460px); gap: 28px; align-items: start; } .single-product .letz-sp-gallery-card, .single-product .letz-sp-summary-card, .single-product .letz-sp-content-card, .single-product .letz-sp-related-card { background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.07); border-radius: 28px; box-shadow: 0 16px 40px rgba(15, 23, 42, 0.06); } .single-product .letz-sp-gallery-card { padding: 22px; } .single-product .letz-sp-gallery-grid { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 18px; align-items: start; } .single-product .letz-sp-thumbs { display: flex; flex-direction: column; gap: 12px; } .single-product .letz-sp-thumb { width: 96px; height: 96px; border: 1px solid rgba(15, 23, 42, 0.1); border-radius: 18px; background: #fff; padding: 8px; cursor: pointer; transition: all .22s ease; } .single-product .letz-sp-thumb:hover, .single-product .letz-sp-thumb.is-active { border-color: #ff4a96; box-shadow: 0 10px 24px rgba(255, 74, 150, 0.16); } .single-product .letz-sp-thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: 12px; } .single-product .letz-sp-main-image-wrap { border-radius: 24px; background: linear-gradient(180deg, #fcfcfd 0%, #f8fafc 100%); border: 1px solid rgba(15, 23, 42, 0.06); min-height: 620px; display: flex; align-items: center; justify-content: center; overflow: hidden; } .single-product .letz-sp-main-image-wrap.no-gallery { min-height: 520px; } .single-product .letz-sp-main-image { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 24px; } .single-product .letz-sp-main-image img { max-width: 100%; max-height: 560px; width: auto; height: auto; object-fit: contain; } .single-product .letz-sp-summary-card { padding: 26px 24px; position: sticky; top: 110px; } .single-product .letz-sp-summary-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; } .single-product .letz-sp-badge, .single-product .letz-sp-type { display: inline-flex; align-items: center; justify-content: center; min-height: 30px; padding: 0 12px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .single-product .letz-sp-badge.sale { background: rgba(255, 74, 150, 0.12); color: #ff4a96; } .single-product .letz-sp-type { background: #f8fafc; color: #475569; border: 1px solid rgba(15, 23, 42, 0.08); } .single-product .letz-sp-title { margin: 0 0 14px; font-size: 34px; line-height: 1.15; font-weight: 700; letter-spacing: -0.03em; color: #0f172a; } .single-product .letz-sp-price { margin-bottom: 16px; } .single-product .letz-sp-price, .single-product .letz-sp-price .price { color: #16a34a; font-size: 32px; font-weight: 700; line-height: 1.15; } .single-product .letz-sp-price del { color: #94a3b8; font-size: 20px; margin-right: 8px; } .single-product .letz-sp-price ins { text-decoration: none; } .single-product .letz-sp-shortdesc { margin-bottom: 20px; color: #475569; font-size: 15px; line-height: 1.7; } .single-product .letz-sp-meta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 22px; } .single-product .letz-sp-meta-item { padding: 14px 14px; border-radius: 18px; background: #f8fafc; border: 1px solid rgba(15, 23, 42, 0.06); } .single-product .letz-sp-meta-label { display: block; margin-bottom: 6px; color: #64748b; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .single-product .letz-sp-meta-value { display: block; color: #0f172a; font-size: 14px; line-height: 1.5; font-weight: 600; } .single-product .letz-sp-cartbox { padding: 18px 0 10px; border-top: 1px solid rgba(15, 23, 42, 0.08); border-bottom: 1px solid rgba(15, 23, 42, 0.08); margin-bottom: 18px; } .single-product .letz-sp-cartbox form.cart { margin: 0; } .single-product .letz-sp-cartbox .quantity { margin-right: 12px !important; } .single-product .letz-sp-cartbox .single_add_to_cart_button, .single-product .letz-sp-cartbox button.single_add_to_cart_button { min-height: 48px; border-radius: 14px !important; background: #ff4a96 !important; color: #fff !important; border: 0 !important; box-shadow: 0 14px 28px rgba(255, 74, 150, 0.22) !important; padding: 0 24px !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .05em; text-transform: uppercase; } .single-product .letz-sp-cartbox .single_add_to_cart_button:hover, .single-product .letz-sp-cartbox button.single_add_to_cart_button:hover { background: #f2388a !important; } .single-product .letz-sp-taxonomy { display: grid; gap: 10px; } .single-product .letz-sp-tax-row { display: flex; flex-direction: column; gap: 4px; } .single-product .letz-sp-tax-label { color: #64748b; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .single-product .letz-sp-tax-value, .single-product .letz-sp-tax-value a { color: #0f172a; font-size: 14px; line-height: 1.6; text-decoration: none; } .single-product .letz-sp-tax-value a:hover { color: #ff4a96; } .single-product .letz-sp-bottom { margin-top: 28px; display: grid; gap: 28px; } .single-product .letz-sp-content-card, .single-product .letz-sp-related-card { padding: 28px 24px; } .single-product .letz-sp-section-title { margin: 0 0 18px; color: #0f172a; font-size: 24px; line-height: 1.2; font-weight: 700; letter-spacing: -0.02em; } .single-product .letz-sp-content { color: #334155; font-size: 15px; line-height: 1.8; } .single-product .letz-sp-content p:last-child { margin-bottom: 0; } .single-product .letz-sp-related-card ul.products { margin: 0 -10px !important; } .single-product .letz-sp-related-card ul.products li.product { margin-bottom: 0 !important; } .single-product .woocommerce-tabs, .single-product .related.products > h2, .single-product .upsells.products, .single-product .woocommerce-product-rating, .single-product .product_meta, .single-product .woocommerce-product-details__short-description:empty { display: none !important; } @media (max-width: 1200px) { .single-product .letz-sp-main { grid-template-columns: 1fr; } .single-product .letz-sp-summary-card { position: static; top: auto; } } @media (max-width: 767px) { .single-product .letz-sp-wrap { padding: 14px 14px 28px; } .single-product .letz-sp-gallery-card, .single-product .letz-sp-summary-card, .single-product .letz-sp-content-card, .single-product .letz-sp-related-card { border-radius: 22px; } .single-product .letz-sp-gallery-card, .single-product .letz-sp-summary-card { padding: 16px; } .single-product .letz-sp-gallery-grid { grid-template-columns: 1fr; } .single-product .letz-sp-thumbs { order: 2; flex-direction: row; overflow-x: auto; padding-bottom: 4px; } .single-product .letz-sp-thumb { width: 74px; min-width: 74px; height: 74px; border-radius: 14px; } .single-product .letz-sp-main-image-wrap { min-height: 360px; border-radius: 18px; } .single-product .letz-sp-main-image img { max-height: 320px; } .single-product .letz-sp-title { font-size: 28px; } .single-product .letz-sp-price, .single-product .letz-sp-price .price { font-size: 28px; } .single-product .letz-sp-meta-grid { grid-template-columns: 1fr; } .single-product .letz-sp-content-card, .single-product .letz-sp-related-card { padding: 18px 16px; } .single-product .letz-sp-section-title { font-size: 21px; } } /* ========================================================= LETZSHOPY SINGLE PRODUCT LAYOUT FIX - remove leftover sidebar space - make image gallery bigger ========================================================= */ .single-product #main, .single-product #content-wrap, .single-product .content-area, .single-product .site-content, .single-product #primary { width: 100% !important; max-width: 100% !important; } .single-product #secondary, .single-product .widget-area, .single-product .sidebar-container, .single-product .content-left-sidebar #secondary, .single-product .content-right-sidebar #secondary { display: none !important; } .single-product .content-area, .single-product .site-main { margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; max-width: 100% !important; } .single-product .letz-sp-wrap { max-width: 1440px !important; width: 100% !important; margin: 0 auto !important; padding: 24px 24px 40px !important; } .single-product .letz-sp-main { display: grid !important; grid-template-columns: minmax(0, 1.35fr) minmax(420px, 0.95fr) !important; gap: 32px !important; align-items: start !important; } .single-product .letz-sp-gallery-card { padding: 26px !important; } .single-product .letz-sp-gallery-grid { display: grid !important; grid-template-columns: 110px minmax(0, 1fr) !important; gap: 20px !important; align-items: stretch !important; } .single-product .letz-sp-thumbs { display: flex !important; flex-direction: column !important; gap: 14px !important; } .single-product .letz-sp-thumb { width: 110px !important; height: 110px !important; padding: 10px !important; border-radius: 20px !important; } .single-product .letz-sp-main-image-wrap { min-height: 760px !important; border-radius: 26px !important; padding: 24px !important; } .single-product .letz-sp-main-image { width: 100% !important; height: 100% !important; min-height: 700px !important; } .single-product .letz-sp-main-image img, .single-product #letz-sp-main-image { max-width: 100% !important; max-height: 680px !important; width: auto !important; height: auto !important; object-fit: contain !important; } .single-product .letz-sp-summary-card { min-height: 760px; } /* remove theme default narrow inner wrappers if any */ .single-product .woocommerce-notices-wrapper, .single-product div.product, .single-product .product.type-product { width: 100% !important; max-width: 100% !important; } /* Tablet */ @media (max-width: 1200px) { .single-product .letz-sp-main { grid-template-columns: 1fr !important; } .single-product .letz-sp-main-image-wrap { min-height: 620px !important; } .single-product .letz-sp-main-image { min-height: 560px !important; } .single-product .letz-sp-summary-card { min-height: auto; } } /* Mobile */ @media (max-width: 767px) { .single-product .letz-sp-wrap { padding: 14px 14px 28px !important; } .single-product .letz-sp-gallery-grid { grid-template-columns: 1fr !important; } .single-product .letz-sp-thumbs { flex-direction: row !important; overflow-x: auto !important; } .single-product .letz-sp-thumb { width: 78px !important; min-width: 78px !important; height: 78px !important; } .single-product .letz-sp-main-image-wrap { min-height: 420px !important; padding: 16px !important; } .single-product .letz-sp-main-image { min-height: 380px !important; } .single-product .letz-sp-main-image img, .single-product #letz-sp-main-image { max-height: 360px !important; } } /* ========================================================= LETZSHOPY SINGLE PRODUCT — FINAL RELATED PRODUCTS FIX ========================================================= */ .single-product .letz-sp-related-card, .single-product .letz-sp-related-card .related, .single-product .letz-sp-related-card .related.products { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; clear: both !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } .single-product .letz-sp-related-card .related > h2, .single-product .letz-sp-related-card .related.products > h2 { display: block !important; margin: 0 0 22px !important; padding: 0 !important; font-size: 34px !important; line-height: 1.15 !important; font-weight: 700 !important; color: #0f172a !important; text-align: left !important; } .single-product .letz-sp-related-card ul.products { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 24px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; list-style: none !important; } .single-product .letz-sp-related-card ul.products::before, .single-product .letz-sp-related-card ul.products::after { display: none !important; content: none !important; } .single-product .letz-sp-related-card ul.products li.product { display: block !important; float: none !important; clear: none !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; position: relative !important; background: #ffffff !important; border: 1px solid rgba(15, 23, 42, 0.07) !important; border-radius: 26px !important; box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05) !important; overflow: hidden !important; } /* remove leaked single-product/meta/breadcrumb content inside card */ .single-product .letz-sp-related-card ul.products li.product .breadcrumb, .single-product .letz-sp-related-card ul.products li.product .breadcrumbs, .single-product .letz-sp-related-card ul.products li.product .woocommerce-breadcrumb, .single-product .letz-sp-related-card ul.products li.product .product_meta, .single-product .letz-sp-related-card ul.products li.product .posted_in, .single-product .letz-sp-related-card ul.products li.product .tagged_as, .single-product .letz-sp-related-card ul.products li.product .sku_wrapper { display: none !important; } /* image area */ .single-product .letz-sp-related-card ul.products li.product .image-wrap, .single-product .letz-sp-related-card ul.products li.product .woo-entry-image-main { display: block !important; position: relative !important; margin: 0 !important; padding: 16px 16px 10px !important; background: #ffffff !important; } .single-product .letz-sp-related-card ul.products li.product .image-wrap > a, .single-product .letz-sp-related-card ul.products li.product .woo-entry-image-main > a, .single-product .letz-sp-related-card ul.products li.product .woo-entry-image-main { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 260px !important; background: #f8fafc !important; border-radius: 20px !important; overflow: hidden !important; } .single-product .letz-sp-related-card ul.products li.product img { display: block !important; width: 100% !important; height: 240px !important; object-fit: contain !important; object-position: center !important; margin: 0 !important; border-radius: 18px !important; } /* badge and wishlist */ .single-product .letz-sp-related-card ul.products li.product span.onsale, .single-product .letz-sp-related-card ul.products li.product .outofstock-badge, .single-product .letz-sp-related-card ul.products li.product .stock.out-of-stock { position: absolute !important; top: 26px !important; left: 26px !important; z-index: 5 !important; } .single-product .letz-sp-related-card ul.products li.product .woo-entry-buttons { position: absolute !important; top: 24px !important; right: 24px !important; z-index: 6 !important; margin: 0 !important; } /* info block */ .single-product .letz-sp-related-card ul.products li.product .woo-entry-inner, .single-product .letz-sp-related-card ul.products li.product .woo-product-info { display: block !important; width: 100% !important; margin: 0 !important; padding: 0 16px 18px !important; text-align: center !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } .single-product .letz-sp-related-card ul.products li.product li.category { display: block !important; margin: 0 0 6px !important; font-size: 13px !important; line-height: 1.4 !important; color: #94a3b8 !important; text-align: center !important; } .single-product .letz-sp-related-card ul.products li.product li.title, .single-product .letz-sp-related-card ul.products li.product .woo-product-info .title { display: block !important; margin: 0 0 8px !important; text-align: center !important; } .single-product .letz-sp-related-card ul.products li.product li.title a, .single-product .letz-sp-related-card ul.products li.product .woo-product-info .title a, .single-product .letz-sp-related-card ul.products li.product h2.woocommerce-loop-product__title { display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important; min-height: 2.8em !important; margin: 0 !important; font-size: 18px !important; line-height: 1.4 !important; font-weight: 600 !important; color: #0f172a !important; text-decoration: none !important; text-align: center !important; } .single-product .letz-sp-related-card ul.products li.product .ls-sku { display: block !important; margin: 6px 0 10px !important; font-size: 12px !important; line-height: 1.4 !important; color: #64748b !important; text-align: center !important; } .single-product .letz-sp-related-card ul.products li.product .price { display: block !important; margin: 0 0 14px !important; text-align: center !important; } .single-product .letz-sp-related-card ul.products li.product .price, .single-product .letz-sp-related-card ul.products li.product .price * { font-size: 18px !important; line-height: 1.3 !important; font-weight: 700 !important; color: #16a34a !important; } /* ========================================================= LETZSHOPY SINGLE PRODUCT — MOBILE STICKY BUY BAR ========================================================= */ .single-product .letz-sp-cartbox { position: relative; } .single-product .letz-sp-mobile-bar { display: none; } @media (max-width: 767px) { .single-product .letz-sp-wrap { padding-bottom: 104px !important; } .single-product .letz-sp-mobile-bar { display: block; position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 9999; } .single-product .letz-sp-mobile-bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 12px; background: rgba(255, 255, 255, 0.96); border: 1px solid rgba(15, 23, 42, 0.08); border-radius: 20px; box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16); backdrop-filter: blur(10px); } .single-product .letz-sp-mobile-bar-left { min-width: 0; flex: 1 1 auto; } .single-product .letz-sp-mobile-bar-price, .single-product .letz-sp-mobile-bar-price .price { margin: 0; color: #16a34a; font-size: 22px; line-height: 1.15; font-weight: 700; } .single-product .letz-sp-mobile-bar-price del { color: #94a3b8; font-size: 14px; margin-right: 6px; } .single-product .letz-sp-mobile-bar-price ins { text-decoration: none; } .single-product .letz-sp-mobile-bar-stock { margin-top: 4px; font-size: 12px; line-height: 1.3; font-weight: 600; } .single-product .letz-sp-mobile-bar-stock.in-stock { color: #475569; } .single-product .letz-sp-mobile-bar-stock.out-of-stock { color: #dc2626; } .single-product .letz-sp-mobile-bar-right { flex: 0 0 auto; } .single-product .letz-sp-mobile-buy-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 146px; min-height: 48px; padding: 0 18px; border-radius: 14px; background: #ff4a96; color: #ffffff; text-decoration: none !important; font-size: 12px; line-height: 1; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; box-shadow: 0 12px 24px rgba(255, 74, 150, 0.24); } .single-product .letz-sp-mobile-buy-btn:hover { background: #f2388a; color: #ffffff; } .single-product .letz-sp-mobile-buy-btn.disabled, .single-product .letz-sp-mobile-bar.is-outofstock .letz-sp-mobile-buy-btn { background: #cbd5e1; color: #ffffff; box-shadow: none; pointer-events: none; } } .single-product .letz-sp-related-card ul.products li.product del, .single-product .letz-sp-related-card ul.products li.product del * { color: #94a3b8 !important; font-weight: 500 !important; } .single-product .letz-sp-related-card ul.products li.product ins { text-decoration: none !important; } /* hide archive extra controls */ .single-product .letz-sp-related-card ul.products li.product .ls-card-actions, .single-product .letz-sp-related-card ul.products li.product .ls-mobile-cart-wrap, .single-product .letz-sp-related-card ul.products li.product .ls-mobile-cart, .single-product .letz-sp-related-card ul.products li.product .owp-quick-view { display: none !important; } @media (max-width: 1024px) { .single-product .letz-sp-related-card ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; } .single-product .letz-sp-related-card .related > h2, .single-product .letz-sp-related-card .related.products > h2 { font-size: 28px !important; } .single-product .letz-sp-related-card ul.products li.product .image-wrap > a, .single-product .letz-sp-related-card ul.products li.product .woo-entry-image-main > a, .single-product .letz-sp-related-card ul.products li.product .woo-entry-image-main { min-height: 190px !important; } .single-product .letz-sp-related-card ul.products li.product img { height: 180px !important; } } @media (max-width: 640px) { .single-product .letz-sp-related-card ul.products { grid-template-columns: 1fr !important; } }