/** * WooCommerce Booking Mode — Front-end stylesheet * * All selectors are prefixed with .wbm-active (added to by PHP) * so the styles only apply when booking mode is actually enabled. * * @package WooCommerceBookingMode * @version 1.0.0 */ /* ========================================================================== 1. Price hiding — classic WooCommerce elements ========================================================================== */ .wbm-active .price, .wbm-active .woocommerce-Price-amount, .wbm-active span.amount, .wbm-active .amount, .wbm-active del .amount, .wbm-active ins .amount, .wbm-active .cart-subtotal, .wbm-active .cart-subtotal th, .wbm-active .cart-subtotal td, .wbm-active .order-total, .wbm-active .order-total th, .wbm-active .order-total td, .wbm-active .tax-total, .wbm-active .tax-total th, .wbm-active .tax-total td, .wbm-active .woocommerce-shipping-totals, .wbm-active .woocommerce-shipping-totals th, .wbm-active .woocommerce-shipping-totals td, .wbm-active .cart_totals .shop_table tfoot tr:not(.shipping), .wbm-active .woocommerce-checkout-review-order-table tfoot tr, .wbm-active .woocommerce-cart-totals { display: none !important; } /* ========================================================================== 2. Price hiding — Gutenberg / block checkout elements ========================================================================== */ .wbm-active .wc-block-components-totals-item, .wbm-active .wc-block-components-totals-item__label, .wbm-active .wc-block-components-totals-item__value, .wbm-active .wc-block-cart-items__header-price, .wbm-active .wc-block-components-product-price, .wbm-active .wc-block-components-order-summary-item__individual-prices, .wbm-active .wp-block-woocommerce-cart-order-summary-totals-block, .wbm-active .wc-block-cart__totals-title, .wbm-active .wc-block-components-totals-footer-item, .wbm-active .wc-block-components-totals-footer-item__label, .wbm-active .wc-block-components-totals-footer-item__value, .wbm-active .wc-block-components-order-summary__button-text, .wbm-active .wc-block-components-product-details__price { display: none !important; } /* ========================================================================== 3. Payment section hiding The entire #payment div is hidden — our own submit button is injected via woocommerce_checkout_after_order_review in class-checkout.php instead. ========================================================================== */ .wbm-active .woocommerce-checkout-payment, .wbm-active #payment, .wbm-active .wc-block-components-payment-methods, .wbm-active .wp-block-woocommerce-checkout-payment-block { display: none !important; } /* ── Custom Confirm Booking button ── */ .wbm-submit-wrap { margin-top: 20px; text-align: right; } .wbm-confirm-btn { display: inline-block; padding: 14px 32px !important; font-size: 16px !important; font-weight: 600 !important; border-radius: 6px !important; cursor: pointer; } /* ========================================================================== 4. Cart table — hide price / subtotal columns ========================================================================== */ .wbm-active .woocommerce-cart-form .shop_table .product-price, .wbm-active .woocommerce-cart-form .shop_table .product-subtotal, .wbm-active .woocommerce-cart-form .shop_table thead th.product-price, .wbm-active .woocommerce-cart-form .shop_table thead th.product-subtotal { display: none !important; } /* ========================================================================== 5. Thank-you / booking confirmation block ========================================================================== */ .wbm-booking-confirmation { background: #f0fff4; border: 1px solid #86efac; border-radius: 6px; padding: 32px 24px; margin: 0 0 32px; text-align: center; font-family: inherit; } .wbm-booking-confirmation .wbm-confirmation-icon { display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%; background: #16a34a; color: #fff; font-size: 32px; line-height: 1; margin: 0 auto 16px; } .wbm-booking-confirmation h2 { margin: 0 0 12px; font-size: 24px; color: #14532d; } .wbm-booking-confirmation p { margin: 0 0 8px; color: #166534; font-size: 15px; } .wbm-booking-confirmation p:last-child { margin-bottom: 0; } .wbm-booking-confirmation p strong { font-size: 16px; color: #14532d; } /* ========================================================================== 6. "Book Now" button styling tweak ========================================================================== */ .wbm-active .single_add_to_cart_button, .wbm-active .add_to_cart_button { /* Inherit WooCommerce button styles; add subtle booking indicator */ position: relative; } /* ========================================================================== 7. Checkout — hide order total review line ========================================================================== */ .wbm-active .woocommerce-checkout-review-order .order-total, .wbm-active #order_review .order-total { display: none !important; } /* ========================================================================== 8. Mini-cart / widget price hiding ========================================================================== */ .wbm-active .widget_shopping_cart .woocommerce-Price-amount, .wbm-active .widget_shopping_cart .cart_list li .amount, .wbm-active .woocommerce-mini-cart__total, .wbm-active .woocommerce-mini-cart__total .amount, .wbm-active .mini_cart_item .amount, .wbm-active .cart-widget .subtotal { display: none !important; }