/* BASE */

.woocommerce h2{
margin: 0;
}

img[src*="placeholder"]{
filter: brightness(.95)
}

.woocommerce mark{
background-color: transparent;
}

.woocommerce .price{
color: var(--color-price);
font-family: var(--font-price);
font-weight: var(--font-weight-price);
}
.woocommerce .price del{
color: var(--color-price-original);
font-weight: var(--font-weight-price-original);
text-decoration: line-through 1px;
}
.woocommerce .price ins{
text-decoration: none;
}
.woocommerce-price-suffix{
color: var(--color-text-secondary);
font-family: var(--font-secondary);
font-size: var(--font-size-suffix);
font-weight: var(--font-weight);
}

.woocommerce .stock{
color: var(--color-text-secondary);
font-family: var(--font-secondary);
}

.woocommerce .onsale,
.woocommerce .out-of-stock{
font-family: var(--font-secondary);
display: inline-block;
padding: .25em 1em;
margin: 0;
border-radius: var(--border-radius-400);
}
.woocommerce .onsale{
background-color: var(--color-badge-onsale);
color: var(--color-badge-onsale-text);
}
.woocommerce .out-of-stock{
background-color: var(--color-badge-outofstock);
color: var(--color-badge-outofstock-text);
}

address .woocommerce-customer-details--phone,
address .woocommerce-customer-details--email{
display: flex;
align-items: center;
}
address .woocommerce-customer-details--phone::before,
address .woocommerce-customer-details--email::before{
background-color: var(--color-accent);
color: var(--color-accent-text);
display: grid;
place-items: center;
text-align: center;
width: 2rem;
height: 2rem;
margin-right: .5rem;
border-radius: var(--border-radius-900);
}

/* UI */

.button.alt{
background-color: var(--color-ui-button-contrast);
color: var(--color-ui-button-contrast-text);
border-color: var(--color-ui-button-contrast-border);
}

.select2-container--default .select2-selection--single,
.select2-container .select2-selection--single{
background-color: var(--color-ui-system);
background-image: linear-gradient(to bottom,var(--color-ui-system-light),transparent);
color: var(--color-ui-system-text);
font-family: var(--font-ui-system);
font-weight: var(--font-weight-ui-system);
font-size: var(--font-size-ui-system);
line-height: var(--line-height-ui-system);
display: grid;
grid-template-columns: 1fr auto;
align-items: center;
width: 100%;
max-width: 100%;
height: auto;
padding: var(--padding-ui-system);
padding-right: .25em;
border: 1px solid var(--color-ui-border);
border-radius: var(--border-radius-400);
}
.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container .select2-selection--single .select2-selection__rendered{
color: inherit;
line-height: inherit;
padding: 0;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder,
.select2-container .select2-selection--single .select2-selection__placeholder{
color: inherit;
}
.select2-container--default .select2-selection--single .select2-selection__arrow,
.select2-container .select2-selection--single .select2-selection__arrow{
position: relative;
top: 0;
right: 0;
width: auto;
height: auto;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b,
.select2-container .select2-selection--single .select2-selection__arrow b{
position: relative;
top: auto;
left: auto;
display: block;
width: auto;
height: auto;
font-family: "dashicons";
font-size: .875em;
font-weight: 400;
margin: 0;
border: none;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b::before,
.select2-container .select2-selection--single .select2-selection__arrow b::before{
content: "\f347";
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b::before,
.select2-container.select2-container--open .select2-selection--single .select2-selection__arrow b::before{
/*content: "\f343";*/
}
.select2-dropdown{
background-color: var(--color-background);
color: var(--color-text);
font-family: var(--font-ui-system);
font-weight: var(--font-weight-ui-system);
font-size: var(--font-size-ui-system);
border: 1px solid var(--color-ui-border);
border-radius: var(--border-radius-400);
}
.select2-search--dropdown{
padding: var(--padding-ui-system);
}
.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-container .select2-search--dropdown .select2-search__field{
border: 1px solid var(--color-ui-border);
}
.select2-search--dropdown .select2-search__field{
padding: var(--padding-ui-system);
}
.select2-results__option{
padding: var(--padding-ui-system);
}
.select2-container--default .select2-results__option[data-selected="true"]{
background-color: transparent;
color: inherit;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected]{
background-color: var(--color-ui-highlight);
color: var(--color-ui-highlight-text);
}

/* Icons */

#menu-menu-woocommerce a[href*="cart"]::before,
#menu-menu-woocommerce a[href*="my-account"]::before{
background-color: var(--color-ui-button-neutral);
color: var(--color-ui-button-neutral-text);
font-family: "dashicons";
font-size: var(--font-size-400);
height: 2em;
aspect-ratio: 1/1;
text-align: center;
padding: .25em;
border-radius: var(--border-radius-900);
}
#menu-menu-woocommerce a[href*="cart"]::before{
content: "\f174";
}
#menu-menu-woocommerce a[href*="my-account"]::before{
content: "\f110";
}

address .woocommerce-customer-details--phone::before,
address .woocommerce-customer-details--email::before{
font-family: "dashicons";
font-size: var(--font-size-400);
line-height: 1;
}
address .woocommerce-customer-details--phone::before{
content: "\f525";
}
address .woocommerce-customer-details--email::before{
content: "\f465";
}

.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-error::before,
.woocommerce .woocommerce-message::before{
font-family: "dashicons";
font-size: var(--font-size-600);
}
.woocommerce .woocommerce-info::before{
content: "\f348";
}
.woocommerce .woocommerce-error::before{
content: "\f534";
}
.woocommerce .woocommerce-message::before{
content: "\f12a";
}

.add_to_cart_button::before,
.single_add_to_cart_button::before{
content: "\f174";
font-family: "dashicons";
font-size: var(--font-size-button);
line-height: 1;
}

.woocommerce-product-gallery__trigger::before{
content: "\f188";
font-family: "dashicons";
font-size: var(--font-size-button);
line-height: 1;
}

.woocommerce .shop_table.cart .actions button[name="update_cart"]::before{
content: "\f463";
font-family: "dashicons";
font-size: var(--font-size-button);
line-height: 1;
}

.woocommerce .show-password-input::before{
content: "\f177";
font-family: "dashicons";
}
.woocommerce .show-password-input.display-password::before{
content: "\f530";
font-family: "dashicons";
}

/* FORMS */

.woocommerce .col2-set{
display: grid;
grid-template-columns: var(--wc-2col-grid-columns);
gap: 1rem var(--grid-gap);
}
.woocommerce .col2-set .col-1,
.woocommerce .col2-set .col-2{
display: grid;
align-content: start;
row-gap: 1rem;
}

.woocommerce .clear{
display: none;
}

wc-order-attribution-inputs{
display: none;
}

.woocommerce .form-row{
display: grid;
align-content: start;
gap: .25rem;
margin: 0;
}

.woocommerce .addresses .col-1,
.woocommerce .addresses .col-2{
grid-template-rows: auto 1fr;
}
.woocommerce .addresses .col-1 header,
.woocommerce .addresses .col-2 header{
display: grid;
row-gap: .5rem;
}
.woocommerce .addresses .col-1 header a,
.woocommerce .addresses .col-2 header a{
justify-self: start;
}

.woocommerce-address-fields__field-wrapper,
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper{
display: grid;
grid-template-columns: var(--wc-address-grid-columns);
gap: 1rem var(--grid-gap);
}
.woocommerce-address-fields__field-wrapper > *,
.woocommerce-billing-fields__field-wrapper > *,
.woocommerce-shipping-fields__field-wrapper > *{
grid-column: span 2;
}
.woocommerce #billing_address_1_field,
.woocommerce #billing_address_2_field,
.woocommerce #shipping_address_1_field,
.woocommerce #shipping_address_2_field{
grid-column: span 4;
}
.woocommerce #billing_postcode_field,
.woocommerce #shipping_postcode_field{
grid-column: span 1;
}
.woocommerce #billing_city_field,
.woocommerce #shipping_city_field{
grid-column: span 3;
}

body.woocommerce-checkout .woocommerce-form{
display: grid;
row-gap: 1rem;
}
body.woocommerce-checkout .woocommerce-form p{
}

.woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-form-coupon,
.woocommerce-ResetPassword{
display: grid;
row-gap: 1rem;
}
.woocommerce-form-login p,
.woocommerce-form-register p,
.woocommerce-form-coupon p,
.woocommerce-ResetPassword p{
margin: 0;
}
.password-input{
position: relative;
}
.password-input #password{
padding-right: 2.5rem;
}
.password-input .show-password-input{
background-color: transparent;
color: #2271b1;
min-width: 40px;
min-height: 40px;
padding: 5px 9px;
position: absolute;
top: 0;
right: 0;
bottom: 0;
}
.password-input .show-password-input::before{
font-size: 20px;
line-height: 1;
}
.password-input .show-password-input:hover,
.password-input .show-password-input:focus{
color: #0a4b78;
}
.woocommerce-form-login .lost_password{
justify-self: center;
margin-top: -.5rem;
}
.woocommerce-form-login .lost_password a{
color: var(--color-text-secondary);
font-family: var(--font-secondary);
font-weight: var(--font-weight-secondary);
font-size: var(--font-size-secondary);
text-decoration: none;
padding-top: 0;
}
.woocommerce-form-login button,
.woocommerce-form-register button,
.woocommerce-ResetPassword button{
justify-self: center;
}
.woocommerce-form-coupon button{
justify-self: start;
}
.woocommerce-form-login .woocommerce-form-login__submit{
margin-top: 1rem;
}

#shipping-calculator-form{
display: grid;
row-gap: 1rem;
}
#shipping-calculator-form p:has(button[type="submit"]){
margin-block-start: 0;
}

/* TABLES */

.woocommerce-shipping-methods{
list-style: none;
padding: 0;
margin: 0;
}
.woocommerce-shipping-methods li{
display: grid;
grid-template-columns: [radio-start] auto [radio-end label-start] 1fr [label-end];
align-items: baseline;
}
.woocommerce-shipping-methods li label{
display: grid;
grid-template-columns: [label-start] 1fr [label-end price-start] auto [price-end];
align-items: baseline;
gap: .25rem .5rem;
}

.woocommerce-shipping-destination{
padding-top: .5rem;
margin: 0;
margin-top: .5rem;
border-top: 1px solid var(--color-separator);
}

.woocommerce .shop_table thead th{
text-align: center;
}
.woocommerce .shop_table tbody th,
.woocommerce .shop_table tfoot th{
text-align: left;
}
.woocommerce .shop_table tbody th,
.woocommerce .shop_table tfoot th,
.woocommerce .shop_table td{
vertical-align: top;
}

.woocommerce .shop_table td.product-thumbnail,
.woocommerce .shop_table td.product-quantity{
text-align: center;
}
.woocommerce .shop_table img{
max-width: 100px;
}
.woocommerce .shop_table td.product-quantity .qty{
display: inline-block;
width: auto;
}

.woocommerce .shop_table td.product-price,
.woocommerce .shop_table td.product-subtotal,
.woocommerce .shop_table td.product-total,
.woocommerce .shop_table .cart-subtotal td,
.woocommerce .shop_table .order-total td,
.woocommerce .shop_table.order_details td:has(.woocommerce-Price-amount){
text-align: right;
}
.woocommerce .shop_table .includes_tax{
display: block;
}

.woocommerce .woocommerce-MyAccount-orders,
.woocommerce .woocommerce-table--order-downloads,
.woocommerce .shop_table.cart{
width: 100%;
}

.woocommerce .shop_table.cart .cart_item td{
vertical-align: middle;
}
.woocommerce .shop_table.cart .actions .coupon{
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 1rem;
width: 100%;
padding-bottom: .5rem;
margin-bottom:  .5rem;
border-bottom: 1px solid var(--color-separator);
}
.woocommerce .shop_table.cart .actions .coupon #coupon_code{
width: auto;
}

.woocommerce .woocommerce-MyAccount-orders tbody th,
.woocommerce .woocommerce-MyAccount-orders td{
text-align: center;
}

.woocommerce .woocommerce-table--order-downloads .download-remaining,
.woocommerce .woocommerce-table--order-downloads .download-expires,
.woocommerce .woocommerce-table--order-downloads .download-file{
text-align: center;
}

/* MENU WOOCOMMERCE (HEADER) */

#menu-menu-woocommerce a[href*="cart"],
#menu-menu-woocommerce a[href*="my-account"]{
display: flex;
gap: .5ch;
align-items: center;
}

/* STARS */

.woocommerce-product-rating{
display: flex;
align-items: center;
gap: .5rem;
}

.woocommerce .star-rating,
.woocommerce p.stars a{
color: var(--color-stars);
font-family: "dashicons";
font-size: 1em;
}
.woocommerce .star-rating{
display: grid;
grid-template-rows: 1.5em;
grid-template-columns: 5em;
overflow: hidden;
}
.woocommerce .star-rating::before{
content: "\f154\f154\f154\f154\f154";
grid-row: 1;
grid-column: 1;
}
.woocommerce .star-rating > span{
grid-row: 1;
grid-column: 1;
overflow: hidden;
}
.woocommerce .star-rating > span::before{
content: "\f155\f155\f155\f155\f155";
}

.woocommerce p.stars span{
display: grid;
grid-template-columns: repeat(5,1fr);
}
.woocommerce p.stars a{
display: grid;
grid-template-rows: 1.5em;
grid-template-columns: 1fr;
grid-auto-rows: 0;
text-decoration: none;
overflow: hidden;
}
.woocommerce p.stars a::before{
content: "\f154";
grid-row: 1;
grid-column: 1;
}
.woocommerce p.stars a:hover~a::before{
content: "\f154";
}
.woocommerce p.stars:hover a::before{
content: "\f155";
}
.woocommerce p.stars.selected a.active::before{
content: "\f155";
}
.woocommerce p.stars.selected a.active~a::before{
content: "\f154";
}
.woocommerce p.stars.selected a:not(.active)::before{
content: "\f155";
}

/* TODO NOTICES */

.woocommerce main > article > .post-content > .woocommerce-notices-wrapper,
.woocommerce .woocommerce-notices-wrapper,
.woocommerce .wc-empty-cart-message{
grid-column: content;
margin: 0;
}
.woocommerce-notices-wrapper ul{
list-style: none;
padding: 0;
border: 1px solid transparent;
}
.woocommerce-notices-wrapper a{
order: 2;
align-self: flex-end;
}
.woocommerce-notices-wrapper > *{
margin-bottom: 1rem;
}

.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error,
.woocommerce .woocommerce-message{
list-style: none;
display: grid;
grid-template-rows: [icon-start content-start action-start] auto [action-end content-end icon-end];
grid-template-columns: [icon-start] auto [icon-end content-start] 1fr [content-end action-start] auto [action-end];
align-items: start;
gap: 1rem;
font-family: var(--font-ui);
padding: 1rem;
margin-bottom: var(--grid-gap);
border-radius: var(--border-radius-500);
}
.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-error::before,
.woocommerce .woocommerce-message::before{
grid-row: icon;
grid-column: icon;
}
.woocommerce .woocommerce-info > *,
.woocommerce .woocommerce-error > *,
.woocommerce .woocommerce-message > *{
grid-column: content;
}
.woocommerce .woocommerce-info > li,
.woocommerce .woocommerce-error > li,
.woocommerce .woocommerce-message > li{
/*display: grid;
row-gap: 1rem;*/
}
.woocommerce .woocommerce-info{
background-color: var(--color-alert-info);
color: var(--color-alert-info-text);
}
.woocommerce .woocommerce-error{
background-color: var(--color-alert-error);
color: var(--color-alert-error-text);
}
.woocommerce .woocommerce-message{
background-color: var(--color-alert-ok);
color: var(--color-alert-ok-text);
}
.woocommerce .woocommerce-info a,
.woocommerce .woocommerce-error a,
.woocommerce .woocommerce-message a{
grid-row: action;
grid-column: action;
justify-self: end;
background-color: var(--color-ui-button-neutral);
color: var(--color-ui-button-neutral-text);
font-family: var(--font-ui-button);
font-weight: var(--font-weight-button);
font-size: var(--font-size-button);
line-height: var(--line-height-button);
text-align: center;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
column-gap: var(--gap-button);
width: auto;
padding: var(--padding-button);
border: 1px solid var(--color-ui-button-neutral-border);
border-radius: var(--border-radius-900);
}

/* TODO BREADCRUMB */

.woocommerce .woocommerce-breadcrumb{
color: var(--color-text);
display: flex;
flex-wrap: wrap;
align-items: center;
gap: .5rem;
font-family: var(--font-menu);
font-weight: 700;
padding-bottom: .5rem;
border-bottom: 1px solid var(--color-separator);
}
.woocommerce .woocommerce-breadcrumb a,
.woocommerce .woocommerce-breadcrumb .separator{
color: var(--color-text-secondary);
font-weight: 400;
}
.woocommerce .woocommerce-breadcrumb a:hover{
color: inherit;
}

/* PAGINATION */

.woocommerce-pagination{
font-family: var(--font-ui);
font-weight: var(--font-weight);
font-size: var(--font-size-navigation);
margin-top: var(--grid-gap);
}
.woocommerce-pagination > ul.page-numbers{
list-style: none;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
gap: .5rem;
padding: 0;
margin: 0;
}
.woocommerce-pagination li .page-numbers{
background-color: var(--color-element-navigation-inactive);
color: var(--color-element-navigation-inactive-text);
display: flex;
align-items: center;
justify-content: center;
height: 2em;
aspect-ratio: 1;
border: 1px solid var(--color-element-navigation-inactive-text);
border-radius: var(--border-radius-900);
}
.woocommerce-pagination li .page-numbers.current,
.woocommerce-pagination li .page-numbers:hover{
background-color: var(--color-element-navigation-active);
color: var(--color-element-navigation-active-text);
border-color: transparent;
}
.woocommerce-pagination li .page-numbers.prev,
.woocommerce-pagination li .page-numbers.next{
aspect-ratio: auto;
border-color: transparent;
border-radius: 0;
}
.woocommerce-pagination li .page-numbers.prev,
.woocommerce-pagination li .page-numbers.next{
flex-grow: 1;
gap: 1ch;
}
.woocommerce-pagination li .page-numbers.prev:hover,
.woocommerce-pagination li .page-numbers.next:hover{
background-color: var(--color-element-navigation-inactive);
color: var(--color-element-navigation-inactive-text);
}
.woocommerce-pagination li .page-numbers.prev{
justify-content: start;
}
.woocommerce-pagination li .page-numbers.next{
justify-content: end;
}

/* CART */

.woocommerce a.remove{
color: var(--color-ui-cancel);
grid-row: item;
grid-column: actions;
display: grid;
place-items: center;
width: 1.5em;
height: 1.5em;
aspect-ratio: 1/1;
font-family: var(--font-mono);
line-height: var(--line-height-button);
text-decoration: none;
margin: 0 auto;
border: 1px solid currentColor;
border-radius: var(--border-radius-900);
}
.woocommerce a.remove:hover,
.woocommerce a.remove:focus-visible{
background-color: var(--color-ui-cancel);
color: var(--color-ui-cancel-text);
border-color: transparent;
}

/* CART WIDGET */

/*
#shop-sidebar .widget_shopping_cart_content{
display: grid;
grid-template-columns: 1fr;
}
#shop-sidebar .widget_shopping_cart_content > * + *{
border-top: 1px solid var(--color-ui-table-border);
}
#shop-sidebar .widget ul.woocommerce-mini-cart{
list-style: none;
display: grid;
grid-template-columns: 1fr;
padding: 0;
border: 1px solid var(--color-ui-table-border);
}
#shop-sidebar .widget .woocommerce-mini-cart-item{
display: grid;
grid-template-rows: [item-start] auto [item-end quantity-start] auto [quantity-end];
grid-template-columns: [actions-start] min-content [actions-end item-start] auto [item-end];
gap: .5rem;
align-items: center;
padding: .5rem;
}
#shop-sidebar .widget .woocommerce-mini-cart-item + .woocommerce-mini-cart-item{
border-top: 1px solid var(--color-ui-table-border);
}
#shop-sidebar .widget .woocommerce-mini-cart-item a:nth-child(2){
grid-row: item;
grid-column: item;
display: flex;
gap: .5rem;
align-items: center;
}
#shop-sidebar .widget .woocommerce-mini-cart-item a:nth-child(2) img{
width: 64px;
}
#shop-sidebar .widget .woocommerce-mini-cart-item .quantity{
grid-row: quantity;
grid-column: actions / item;
justify-self: end;
}
#shop-sidebar .widget .woocommerce-mini-cart__total{
font-weight: 700;
text-align: right;
padding: .5rem;
margin: 0;
border: 1px solid var(--color-ui-table-border);
border-top: none;
border-bottom: none;
}
#shop-sidebar .widget .woocommerce-mini-cart__buttons{
display: grid;
gap: 1rem;
padding: 1rem .5rem;
margin: 0;
border: 1px solid var(--color-ui-table-border);
}
*/

/* FOOTER BANNER */

#coming-soon-footer-banner{
display: grid;
grid-column: full;
grid-template-columns:
	[full-start] minmax(0, var(--root-padding-inline))
	[wide-start] 1fr [wide-end]
	minmax(0, var(--root-padding-inline)) [full-end];
}
.coming-soon-footer-banner__content{
grid-column: wide;
background-color: var(--color-alert-warning);
color: var(--color-alert-warning-text);
font-family: var(--font-ui);
padding: 1rem var(--grid-gap);
}
.coming-soon-footer-banner__content a{
color: inherit
}
a.coming-soon-footer-banner-dismiss{
}