.single-product form.cart .button,
.single-product form.cart button.button,
.single-product form.cart a.button {
display: inline-flex; align-items: center; justify-content: center; gap: 10px;
padding: 10px 16px; min-height: 44px; box-sizing: border-box; border-radius: var(--radius);
text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.85rem; line-height: 1; cursor: pointer;
} .single-product form.cart .single_add_to_cart_button { background: var(--btn-primary-bg); color: var(--color-bg); border: 0; }
.single-product form.cart .single_add_to_cart_button:hover { background: var(--btn-primary-hover); } .single-product form.cart .button:not(.single_add_to_cart_button) { background: transparent; color: var(--color-fg); border: 1px solid currentColor; }
.single-product form.cart .button:not(.single_add_to_cart_button):hover { background: var(--color-surface); } .single-product form.cart .quantity .qty,
.single-product form.cart .qty { height: 44px; min-width: 54px; text-align: center; box-sizing: border-box; } .woocommerce-checkout .woocommerce { max-width: 1200px; margin-left: auto; margin-right: auto; padding: 12px; box-sizing: border-box; }
.woocommerce-order-received.woocommerce-checkout .woocommerce { max-width: none; padding: 0; }
@media (max-width: 640px) { .woocommerce-checkout .woocommerce { padding: 10px; } } .woocommerce-checkout .container-page.is-simple { padding-inline: 0px; } .woocommerce ul.products,
.woocommerce-page ul.products {
display: grid;
gap: 24px;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 1024px) {
.woocommerce ul.products,
.woocommerce-page ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
.woocommerce ul.products,
.woocommerce-page ul.products { grid-template-columns: repeat(var(--shop-grid-cols-mobile, 1), minmax(0, 1fr)); }
} .woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
position: relative;
border: 1px solid var(--glass-border);
border-radius: var(--radius);
overflow: hidden;
background-color: var(--glass-bg);
-webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
box-shadow: var(--shadow-ambient);
display: grid;
grid-template-rows: auto auto auto;
}
html.dark .woocommerce ul.products li.product,
html.dark .woocommerce-page ul.products li.product {
border-color: var(--glass-border);
background-color: var(--glass-bg);
box-shadow: var(--shadow-ambient);
}
.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
box-shadow: 0 2px 8px color-mix(in srgb, var(--color-fg) 8%, transparent);
border-color: color-mix(in srgb, var(--color-fg) 14%, transparent);
}
html.dark .woocommerce ul.products li.product:hover,
html.dark .woocommerce-page ul.products li.product:hover {
box-shadow: 0 2px 8px color-mix(in srgb, var(--color-fg) 25%, transparent);
border-color: color-mix(in srgb, var(--color-fg) 16%, transparent);
} .woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
width: 100%;
height: auto;
display: block;
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce-page ul.products li.product a.woocommerce-LoopProduct-link {
display: block;
background: color-mix(in srgb, var(--color-fg) 6%, transparent);
} .woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
margin: 0;
padding: 12px 12px 0 12px;
font-weight: 600;
line-height: 1.35;
font-size: 1rem;
}
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price {
padding: 2px 12px 12px 12px;
font-weight: 600;
} .woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button {
width: calc(100% - 24px);
margin: 0 12px 12px 12px;
padding: 8px 10px;
border-radius: var(--radius);
text-transform: uppercase;
letter-spacing: 0.04em;
font-size: 0.85rem;
} .woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button.add_to_cart_button,
.woocommerce ul.products li.product .button.product_type_variable,
.woocommerce-page ul.products li.product .button.product_type_variable {
background-color: var(--btn-primary-bg) !important;
color: var(--color-bg) !important;
}
.woocommerce ul.products li.product .button.add_to_cart_button:hover,
.woocommerce-page ul.products li.product .button.add_to_cart_button:hover,
.woocommerce ul.products li.product .button.product_type_variable:hover,
.woocommerce-page ul.products li.product .button.product_type_variable:hover {
background-color: var(--btn-primary-hover) !important;
}
html.dark .woocommerce ul.products li.product .button.add_to_cart_button,
html.dark .woocommerce-page ul.products li.product .button.add_to_cart_button,
html.dark .woocommerce ul.products li.product .button.product_type_variable,
html.dark .woocommerce-page ul.products li.product .button.product_type_variable {
color: var(--color-bg) !important;
} .woocommerce ul.products li.product .onsale,
.woocommerce-page ul.products li.product .onsale {
position: absolute;
top: 8px;
left: 8px;
z-index: 2;
font-size: 11px;
padding: 4px 8px;
border-radius: var(--radius);
border: 1px solid var(--badge-danger);
background: transparent;
color: var(--badge-danger);
min-height: auto;
line-height: 1.2;
margin: 0;
} .woocommerce ul.products li.product.outofstock a.woocommerce-LoopProduct-link::after,
.woocommerce-page ul.products li.product.outofstock a.woocommerce-LoopProduct-link::after {
content: "Laost otsas";
position: absolute;
inset: 0;
background: color-mix(in srgb, var(--surface-dark) 55%, transparent);
color: white;
display: grid;
place-items: center;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
}
.woocommerce ul.products li.product.outofstock .button,
.woocommerce-page ul.products li.product.outofstock .button { opacity: 0.6; pointer-events: none; } .woocommerce-notices-wrapper,
.woocommerce-NoticeGroup,
.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
margin: 12px auto;
max-width: 1200px;
padding: 10px 12px;
border-radius: var(--radius);
border: 1px solid var(--glass-border);
background: var(--glass-bg);
-webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
color: var(--color-fg);
font-size: 0.95rem;
} .woocommerce-notices-wrapper:empty,
.woocommerce-NoticeGroup:empty {
display: none !important;
}
.woocommerce-notices-wrapper,
.woocommerce-NoticeGroup {
padding: 0;
border: 0px solid transparent;
background: transparent;
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
.woocommerce-checkout #bp-checkout-notices .woocommerce-notices-wrapper,
.woocommerce-checkout #bp-checkout-notices .woocommerce-NoticeGroup,
.woocommerce-cart #bp-cart-notices .woocommerce-notices-wrapper,
.woocommerce-cart #bp-cart-notices .woocommerce-NoticeGroup {
margin: 0;
padding: 0;
border: 0;
background: transparent;
-webkit-backdrop-filter: none;
backdrop-filter: none;
max-width: none;
}
.woocommerce-error {
border-color: var(--badge-danger);
background: color-mix(in srgb, var(--badge-danger) 8%, var(--glass-bg));
}
.woocommerce-info {
border-color: var(--badge-info, #3b82f6);
background: color-mix(in srgb, var(--badge-info, #3b82f6) 8%, var(--glass-bg));
}
.woocommerce-message {
border-color: var(--badge-success, #16a34a);
background: color-mix(in srgb, var(--badge-success, #16a34a) 8%, var(--glass-bg));
} .woocommerce-error li { list-style: none; } .woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
float: right;
margin-left: 8px;
} html:not(.dark) .woocommerce-account .woocommerce-MyAccount-content form input.input-text,
html:not(.dark) .woocommerce-account .woocommerce-MyAccount-content form textarea,
html:not(.dark) .woocommerce-account .woocommerce-MyAccount-content form select,
html:not(.dark) .woocommerce-account form input[type="tel"],
html:not(.dark) .woocommerce-account form input[type="email"],
html:not(.dark) .woocommerce-account form input[type="text"] {
background: var(--color-bg);
border-color: var(--border-color);
}
html.dark .woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields .woocommerce-input-wrapper input,
html.dark .woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields .woocommerce-input-wrapper textarea,
html.dark .woocommerce-account .woocommerce-MyAccount-content .woocommerce-address-fields .woocommerce-input-wrapper select,
html.dark .woocommerce-account .woocommerce-MyAccount-content form input[type="text"],
html.dark .woocommerce-account .woocommerce-MyAccount-content form input[type="email"],
html.dark .woocommerce-account .woocommerce-MyAccount-content form input[type="password"],
html.dark .woocommerce-account .woocommerce-MyAccount-content form input[type="tel"],
html.dark .woocommerce-account .woocommerce-MyAccount-content form input[type="number"],
html.dark .woocommerce-account .woocommerce-MyAccount-content form input.input-text,
html.dark .woocommerce-account .woocommerce-MyAccount-content form textarea,
html.dark .woocommerce-account .woocommerce-MyAccount-content form select {
background: var(--color-bg);
border-color: var(--border-color);
}
.woocommerce-account table.woocommerce-table--order-details th,
.woocommerce-account table.woocommerce-table--order-details td {
text-align: left;
}
.woocommerce-account table.woocommerce-table--order-details th.product-total,
.woocommerce-account table.woocommerce-table--order-details td.product-total {
text-align: right;
} .woocommerce-checkout .woocommerce form .form-row { margin: 8px 0; }
.woocommerce-checkout .woocommerce form .form-row label { font-weight: 600; font-size: 0.95rem; }
.woocommerce-checkout .woocommerce form .form-row input.input-text,
.woocommerce-checkout .woocommerce form .form-row textarea,
.woocommerce-checkout .woocommerce form .form-row select {
width: 100%;
padding: 10px 12px;
border: 1px solid var(--border-color);
border-radius: var(--radius);
background: var(--color-bg);
color: var(--color-fg);
transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
box-sizing: border-box;
}
.woocommerce-checkout .woocommerce form .form-row input.input-text::placeholder,
.woocommerce-checkout .woocommerce form .form-row textarea::placeholder { color: color-mix(in srgb, var(--color-fg) 50%, transparent); }
.woocommerce-checkout .woocommerce form .form-row input.input-text:focus,
.woocommerce-checkout .woocommerce form .form-row textarea:focus,
.woocommerce-checkout .woocommerce form .form-row select:focus {
outline: none;
border-color: color-mix(in srgb, var(--color-fg) 40%, var(--border-color));
box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-fg) 12%, transparent);
} .woocommerce-checkout .woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce-checkout .woocommerce form .form-row.woocommerce-invalid textarea,
.woocommerce-checkout .woocommerce form .form-row.woocommerce-invalid select {
border-color: var(--badge-danger);
box-shadow: 0 0 0 3px color-mix(in srgb, var(--badge-danger) 18%, transparent);
}
.woocommerce-checkout .woocommerce form .form-row.woocommerce-validated input.input-text {
border-color: var(--badge-success, #16a34a);
} .woocommerce-checkout .woocommerce abbr.required { color: var(--badge-danger); text-decoration: none; border: 0; } .woocommerce-checkout .woocommerce .woocommerce-info a { color: var(--color-fg); text-decoration: underline; font-weight: 600; } .woocommerce-checkout .woocommerce form.checkout_coupon { margin: 8px 0 16px; }
.woocommerce-checkout .woocommerce form.checkout_coupon .form-row-first,
.woocommerce-checkout .woocommerce form.checkout_coupon .form-row-last { margin: 6px 0; } .woocommerce-checkout input[type="checkbox"],
.woocommerce-checkout input[type="radio"] { accent-color: var(--color-fg); }
.woocommerce-checkout #account_password_field input[type="checkbox"],
.woocommerce-checkout .create-account input[type="checkbox"],
.woocommerce-checkout #createaccount {
transform: scale(1.15);
transform-origin: left center;
}
.woocommerce-checkout .create-account label {
display: inline-flex;
align-items: center;
gap: 10px;
} .woocommerce-checkout .select2-container--default .select2-selection--single {
height: 40px; border: 1px solid var(--border-color); border-radius: var(--radius); background: var(--color-bg);
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 38px; padding: 0 12px; color: var(--color-fg); }
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { height: 38px; right: 8px; }
.woocommerce-checkout .select2-container--default.select2-container--focus .select2-selection--single { border-color: color-mix(in srgb, var(--color-fg) 40%, var(--border-color)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-fg) 12%, transparent); } .woocommerce-checkout .woocommerce a.button,
.woocommerce-checkout .woocommerce button.button,
.woocommerce-checkout .woocommerce input.button {
display: inline-flex; align-items: center; justify-content: center;
gap: 8px; padding: 10px 16px; min-height: 44px; box-sizing: border-box;
border-radius: var(--radius); border: 0;
background: var(--btn-primary-bg); color: var(--color-bg); text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.9rem;
}
.woocommerce-checkout .woocommerce a.button:hover,
.woocommerce-checkout .woocommerce button.button:hover,
.woocommerce-checkout .woocommerce input.button:hover { background: var(--btn-primary-hover); } @media (max-width: 640px) {
.woocommerce-checkout .woocommerce #place_order { width: 100%; }
}
@media (min-width: 1024px) {
.woocommerce-checkout .bp-loyalty-redeem-row {
display: grid;
grid-template-columns: minmax(0, 1fr) auto auto;
gap: 8px;
align-items: center;
}
.woocommerce-checkout .bp-loyalty-redeem-row input[type="text"],
.woocommerce-checkout .bp-loyalty-redeem-row input.input-text {
width: 100%;
}
.woocommerce-checkout .bp-loyalty-redeem-row .bp-btn {
white-space: nowrap;
}
} .woocommerce-checkout .col2-set { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 24px; align-items: start; }
@media (max-width: 1024px) { .woocommerce-checkout .col2-set { grid-template-columns: 1fr; } } .woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
display: grid;
gap: 10px;
grid-template-columns: 1fr;
}
@media (min-width: 640px) {
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
grid-template-columns: repeat(2, minmax(0, 1fr));
} .woocommerce-checkout #billing_address_1_field { grid-column: 1 / 2; }
.woocommerce-checkout #billing_country_field   { grid-column: 2 / 3; }
.woocommerce-checkout #billing_postcode_field  { grid-column: 1 / 2; }
.woocommerce-checkout #billing_city_field      { grid-column: 2 / 3; }
} .woocommerce-checkout .form-row-wide:not(.address-field) { grid-column: 1 / -1; } .woocommerce-checkout #order_review,
.woocommerce-checkout .woocommerce-checkout-review-order { border: 1px solid var(--glass-border); border-radius: var(--radius); background: var(--glass-bg); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate)); backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate)); padding: 12px; }
@media (max-width: 640px) {
.woocommerce-checkout #order_review,
.woocommerce-checkout .woocommerce-checkout-review-order { padding: 12px; }
}  .woocommerce-account .woocommerce form.woocommerce-form-login .woocommerce-form-login__rememberme {
display: inline-flex;
align-items: center;
gap: 8px;
vertical-align: middle;
}
.woocommerce-account .woocommerce form.woocommerce-form-login .woocommerce-form-login__submit {
display: block;
margin-top: 8px;
}