/* Theme Name: Blog Reflection WooCommerce styles override */ /** * Shop tables */ table.shop_table_responsive thead { display: none; } table.shop_table_responsive tbody th { display: none; } table.shop_table_responsive tr td { display: block; text-align: right; clear: both; } table.shop_table_responsive tr td::before { content: attr(data-title) ": "; float: left; } table.shop_table_responsive tr td.product-remove a { text-align: left; } table.shop_table_responsive tr td.product-remove::before { display: none; } table.shop_table_responsive tr td.actions::before, table.shop_table_responsive tr td.download-actions::before { display: none; } table.shop_table_responsive tr td.download-actions .button { display: block; text-align: center; } @media screen and (min-width: 48em) { table.shop_table_responsive thead { display: table-header-group; } table.shop_table_responsive tbody th { display: table-cell; } table.shop_table_responsive tr th, table.shop_table_responsive tr td { text-align: left; } table.shop_table_responsive tr td { display: table-cell; } table.shop_table_responsive tr td::before { display: none; } } /** * Products */ ul.products { margin: 0; padding: 0; } ul.products li.product { list-style: none; position: relative; margin-bottom: 2em; } ul.products li.product img { display: block; } ul.products li.product .button{ position: relative; z-index: 2; vertical-align: middle; display: inline-block; border: none; text-align: center; background-color: var(--theme-color); color: #fff; font-family: var(--body-font); font-size: 12px; font-weight: 400; line-height: 1; padding: 15px; border-radius: 5px; overflow: hidden; } button.single_add_to_cart_button.button.alt{ position: relative; z-index: 2; vertical-align: middle; display: inline-block; border: none; text-align: center; background-color: var(--theme-color); color: #fff; font-family: var(--body-font); font-size: 18px; font-weight: 400; line-height: 1; border-radius: 5px; overflow: hidden; } ul.products li.product .button .actions { height: 100%; position: absolute; left: 0; bottom: 0; right: 0; text-align: center; transform: translateY(50%); z-index: 3; margin-top: 0; opacity: 0; visibility: hidden; transition: 0.5s ease-in-out; display: flex; justify-content: center; align-items: center; } .button{ background: none; border: 2px solid #008; font-family: "montserrat", sans-serif; text-transform: uppercase; padding: 15px; min-width: 120px; margin-left: 10px; cursor: pointer; transition: color 0.4s linear; position: relative; } .space-bottom{ margin-top: 30px; } a.button.product_type_variable.add_to_cart_button,button.single_add_to_cart_button.button.alt, a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart { position: relative; overflow: hidden; color: #fff; /* Default text color */ text-decoration: none; } a.button.product_type_variable.add_to_cart_button:hover,button.single_add_to_cart_button.button.alt:hover, a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart:hover { color: #fff; /* Text color on hover */ } a.button.product_type_variable.add_to_cart_button::before, button.single_add_to_cart_button.button.alt::before, a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 160%; background: #008; z-index: -1; transform: scaleX(0); /* Initially hidden */ transform-origin: 0 0; transition: transform 0.5s cubic-bezier(0.6, 1.5, 0.4, 0.7); } a.button.product_type_variable.add_to_cart_button:hover::before,button.single_add_to_cart_button.button.alt:hover::before,a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart:hover::before { transform: scaleX(1); /* Expand on hover */ } .quantity .input-text{ width: 40px !important; display: inline; color: #000; } .woocommerce-variation-add-to-cart.variations_button.woocommerce-variation-add-to-cart-enabled { display: inline-flex; } @media screen and (min-width: 48em) { ul.products li.product { width: 30.79667%; float: left; margin-right: 3.8%; } ul.products li.product.first { clear: both; } ul.products li.product.last { margin-right: 0; } ul.products.columns-1 li.product { float: none; width: 100%; } ul.products.columns-2 li.product { width: 48.1%; } ul.products.columns-3 li.product { width: 30.79667%; } ul.products.columns-4 li.product { width: 22.15%; } ul.products.columns-5 li.product { width: 16.96%; } ul.products.columns-6 li.product { width: 13.49333%; } } /** * Single product */ .single-product div.product { position: relative; } .single-product div.product .woocommerce-product-gallery { position: relative; float: left; } .single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__trigger { position: absolute; top: 2em; right: 1em; display: block; z-index: 99; } .single-product div.product .woocommerce-product-gallery .flex-viewport { margin-bottom: 1em; } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs { margin: 0; padding: 0; } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li { list-style: none; cursor: pointer; float: left; } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img { opacity: 0.5; } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active { opacity: 1; } .single-product div.product .woocommerce-product-gallery .flex-control-thumbs li:hover img { opacity: 1; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li { width: 48.1%; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li:nth-child(2n) { margin-right: 0; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-2 .flex-control-thumbs li:nth-child(2n+1) { clear: both; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li { width: 30.79667%; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li:nth-child(3n) { margin-right: 0; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-3 .flex-control-thumbs li:nth-child(3n+1) { clear: both; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li { width: 22.15%; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n) { margin-right: 0; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n+1) { clear: both; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li { width: 16.96%; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li:nth-child(5n) { margin-right: 0; } .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-5 .flex-control-thumbs li:nth-child(5n+1) { clear: both; } .stock:empty::before { display: none; } .stock.in-stock { color: #0f834d; } .stock.out-of-stock { color: #e2401c; } /** * Checkout */ @media screen and (min-width: 768px) { .col2-set .form-row-first { float: left; margin-right: 3.8%; } .col2-set .form-row-last { float: right; margin-right: 0; } .col2-set .form-row-first, .col2-set .form-row-last { width: 48.1%; } } /** * General WooCommerce components */ /** * Header cart */ .site-header-cart { position: relative; margin: 0; padding: 0; } .site-header-cart .cart-contents { text-decoration: none; } .site-header-cart .widget_shopping_cart { display: none; } .site-header-cart .product_list_widget { margin: 0; padding: 0; } /** * Star rating */ .star-rating { overflow: hidden; position: relative; height: 1.618em; line-height: 1.618; width: 5.3em; font-family: star; font-weight: 400; } .star-rating::before { content: "\53\53\53\53\53"; opacity: 0.25; float: left; top: 0; left: 0; position: absolute; } .star-rating span { overflow: hidden; float: left; top: 0; left: 0; position: absolute; padding-top: 1.5em; } .star-rating span::before { content: "\53\53\53\53\53"; top: 0; position: absolute; left: 0; color: #feb62a; } p.stars a { position: relative; height: 1em; width: 1em; text-indent: -999em; display: inline-block; text-decoration: none; margin-right: 1px; font-weight: 400; } p.stars a::before { display: block; position: absolute; top: 0; left: 0; width: 1em; height: 1em; line-height: 1; font-family: star; content: "\53"; color: #404040; text-indent: 0; opacity: 0.25; } p.stars a:hover ~ a::before { content: "\53"; color: #404040; opacity: 0.25; } p.stars:hover a::before { content: "\53"; color: #feb62a; opacity: 1; } p.stars.selected a.active::before { content: "\53"; color: #feb62a; opacity: 1; } p.stars.selected a.active ~ a::before { content: "\53"; color: #404040; opacity: 0.25; } p.stars.selected a:not(.active)::before { content: "\53"; color: #feb62a; opacity: 1; } .comments-wrap .children { margin: 0; padding: 0; list-style-type: none; margin-left: 135px; } /** * Tabs */ .woocommerce-tabs ul.tabs { list-style: none; margin: 0; padding: 0; text-align: left; display: flex; position: relative; justify-content: center; align-items: baseline; } @media (max-width: 778px) { .woocommerce-tabs ul.tabs { list-style: none; margin: 0; padding: 0; text-align: left; display: flex; left: 5px; } .woocommerce-tabs ul.tabs li { display: block; margin: 0; position: relative; margin-right: 10px; font-size: 16px; } } .woocommerce-tabs ul.tabs li { display: block; margin: 0; position: relative; margin-right: 50px; font-size: 25px; } .woocommerce-tabs ul.tabs li a { padding: 1em 0; display: block; color: var(--theme-color); font-size: 14px; font-weight: 600; text-transform: uppercase; } .woocommerce-tabs .panel h2:first-of-type { margin-bottom: 1em; font-size: 18px; display: none; } /** * Password strength meter */ .woocommerce-password-strength { text-align: right; } .woocommerce-password-strength.strong { color: #0f834d; } .woocommerce-password-strength.short { color: #e2401c; } .woocommerce-password-strength.bad { color: #e2401c; } .woocommerce-password-strength.good { color: #3d9cd2; } /** * Forms */ .form-row.woocommerce-validated input.input-text { box-shadow: inset 2px 0 0 #0f834d; } .form-row.woocommerce-invalid input.input-text { box-shadow: inset 2px 0 0 #e2401c; } .required { color: #f00; } /** * Notices */ .woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, p.no-comments { background-color: #0f834d; clear: both; } .woocommerce-info, .woocommerce-noreviews, p.no-comments { background-color: #3d9cd2; color: #fff; } .woocommerce-error { background-color: #e2401c; } .demo_store { position: fixed; left: 0; bottom: 0; right: 0; margin: 0; padding: 1em; background-color: #3d9cd2; z-index: 9999; } @media screen and (min-width: 48em) { /** * Header cart */ .site-header-cart .widget_shopping_cart { position: absolute; top: 100%; width: 100%; z-index: 999999; left: -999em; display: block; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); } .site-header-cart:hover .widget_shopping_cart, .site-header-cart.focus .widget_shopping_cart { left: 0; display: block; } } /** * WooCommerce widgets */ /** * WooCommerce Price Filter */ .widget_price_filter .price_slider { margin-bottom: 1.5em; } .widget_price_filter .price_slider_amount { text-align: right; line-height: 2.4; } .widget_price_filter .price_slider_amount .button { float: left; } .widget_price_filter .ui-slider { position: relative; text-align: left; } .widget_price_filter .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1em; height: 1em; cursor: ew-resize; outline: none; background: #4169e1; box-sizing: border-box; margin-top: -0.25em; opacity: 1; } .widget_price_filter .ui-slider .ui-slider-handle:last-child { margin-left: -1em; } .widget_price_filter .ui-slider .ui-slider-handle:hover, .widget_price_filter .ui-slider .ui-slider-handle.ui-state-active { box-shadow: 0 0 0 0.25em rgba(0, 0, 0, 0.1); } .widget_price_filter .ui-slider .ui-slider-range { position: absolute; z-index: 1; display: block; border: 0; background: #4169e1; } .widget_price_filter .price_slider_wrapper .ui-widget-content { background: rgba(0, 0, 0, 0.1); } .widget_price_filter .ui-slider-horizontal { height: 0.5em; } .widget_price_filter .ui-slider-horizontal .ui-slider-range { height: 100%; } .woocommerce-info, .woocommerce-noreviews, p.no-comments{ background-color: var(--theme-color); } .woocommerce-message a { color: var(--title-color); border: none; text-decoration: none; margin: 0; } .woocommerce-message a:hover { color: var(--white-color); } .woocommerce-tabs ul.tabs li a{ text-decoration: none; } div#review_form> .comment-respond > .comment-form{ box-shadow: none; border: none; } ol.commentlist { border-radius: 10px; padding-top: 10px; background-color: var(--smoke-color2); margin: 0; } .quantity { margin-left: 10px; } .woocommerce-notices-wrapper { margin-top: 40px; } .wc-block-cart__submit-container > a { text-decoration: none; font-weight: 600; } .wc-block-components-button:not(.is-link) .wc-block-components-button__text { border: 1px solid var(--theme-color); border-radius: 7px; padding: 10px; background-color: var(--theme-color); color: var(--white-color); } .wc-block-components-button:not(.is-link) .wc-block-components-button__text:hover { background-color: var(--title-color); border: none; } table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name{ color: var(--title-color); } .dark-theme .wc-block-cart-item__quantity>button, .dark-theme table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name, .dark-theme span.wc-block-components-checkbox__label, .dark-theme .wp-block-woocommerce-checkout-order-summary-block , .dark-theme .wc-block-checkout__terms.wc-block-checkout__terms--with-separator.wp-block-woocommerce-checkout-terms-block { color: white !important; } .dark-theme .wc-block-checkout__terms.wc-block-checkout__terms--with-separator { border-top: 1px solid hsla(0, 11%, 95%, 0.11); } .dark-theme .wc-block-components-address-form__address_2-toggle { color: var(--white-color); } .wc-block-components-checkbox label span.wc-block-components-checkbox__label { margin-left: 20px !important; } .wc-block-components-button:not(.is-link) .wc-block-components-button__text:hover { background-color: transparent; } .dark-theme .wc-block-components-checkbox .wc-block-components-checkbox__mark{ fill: var(--white-color) !important; } span.wc-block-components-checkbox__label:before { border: 1px solid var(--title-color); content: ''; padding: 0px 8px; margin-left: -18px; } .dark-theme span.wc-block-components-checkbox__label:before { border: 1px solid var(--white-color); } .dark-theme .comment-respond form .comment-form-rating label, .dark-theme .wc-block-components-product-badge.wc-block-components-sale-badge { color: var(--white-color); } .dark-theme .comment-respond form .comment-form-rating p.stars { background: var(--theme-color); padding: 15px 10px 5px 10px; }