
/* -- Woocommerce basics --------------------------------*/
.page-woocommerce-inner {
  margin-top: 3rem;
  font-size: 1rem;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
  border-top: none !important;
  background: rgba(162,144,97,0.25) !important;
  color: #12121B !important;
  padding: 2rem 2rem 2rem 4rem;
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 4rem;
}

.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before {
  color: #12121B !important;
  top: 1.2em;
}

.woocommerce-error:before,
.woocommerce-info:before,
.woocommerce-message:before {
  position: absolute;
  height: 100%;
  display: flex;
  top: 0;
  align-items: center;
}

.woocommerce-message:has(.button) {
  flex-direction: row-reverse;
}

.woocommerce-info:after,
.woocommerce-error:after,
.woocommerce-message:after {
  display: none !important;
}

.woocommerce-message .button {
  padding: 0 !important;
  outline: none !important;
  height: auto !important;
  min-height: auto !important;
}

.woocommerce-info .showlogin,
.woocommerce-message .restore-item {
  font-weight: 700;
  padding: 0 !important;
  outline: none !important;
  height: auto !important;
  min-height: auto !important;
  text-decoration: none;
  text-transform: uppercase;
  color: #12121B;
}

.woocommerce-message .button:before,
.woocommerce-message .button:after {
  display: none !important;
}

ul.woocommerce-error {
  display: block;
}

.woocommerce td.product-name .wc-item-meta .wc-item-meta-label, .woocommerce td.product-name .wc-item-meta dt, .woocommerce td.product-name dl.variation .wc-item-meta-label, .woocommerce td.product-name dl.variation dt {
  line-height: 2rem;
}
 
.woocommerce-thankyou-order-details li strong {
  font-size: 1rem !important;
  font-weight: 500 !important;
  margin-top: .25rem;
}
 

.page-woocommerce-inner .product_title {
  font-family: "Changa One", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 0.74em;
  text-transform: uppercase;  
  font-size: clamp(2.4rem, 1.956rem + 1.242vw, 3.9432rem);
  margin: 1.5rem 0 2rem 0;
  text-wrap: balance;
}

.page-woocommerce-inner h2, 
.page-woocommerce-inner h3 {
  font-family: "Changa One", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 0.74em;
  text-transform: uppercase;  
  font-size: clamp(1.8852rem, 1.63836rem + 0.6906vw, 2.7432rem);
  margin: 3rem 0 1rem 0;
}

.page-woocommerce-inner .button {
  align-content: center;
}

.page-woocommerce-inner .button,
.checkout-button,
.single_add_to_cart_button,
.woocommerce-button {
  --btn-color: #12121B;
  --btn-outline: #A29061;
  --btn-height: 3rem;
  --border-width: 2px;
  --border-width-negative: -2px;
  font-family: "Roboto Mono", monospace;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;  
  letter-spacing: 0.125em;
  outline: var(--border-width) solid var(--btn-color);
  min-height: var(--btn-height);
  color: var(--btn-color) !important;
  padding: 0 1.25rem;
  border-radius: 0 !important;
  background: none !important;
}

.page-woocommerce-inner .button::after,
.checkout-button::after,
.single_add_to_cart_button::after,
.woocommerce-button::after {
  width: var(--border-width);
  height: calc(100% + var(--border-width) * 2);
  right: var(--border-width-negative);
  top: var(--border-width-negative);
}

.page-woocommerce-inner .button::before, 
.page-woocommerce-inner .button::after,
.checkout-button::before, 
.checkout-button::after,
.single_add_to_cart_button::before, 
.single_add_to_cart_button::after,
.woocommerce-button::before, 
.woocommerce-button::after {
  content: "";
  position: absolute;
  background: var(--btn-outline);
  transition: all 0.5s;
  z-index: -1;
}

.page-woocommerce-inner .button::before,
.checkout-button::before,
.single_add_to_cart_button::before,
.woocommerce-button::before {
  width: calc(100% + var(--border-width) * 2);
  height: var(--border-width);
  bottom: var(--border-width-negative);
  left: var(--border-width-negative);
}

.page-woocommerce-inner .button:hover::before,
.checkout-button:hover::before,
.single_add_to_cart_button:hover::before,
.woocommerce-button:hover::before {
  height: 8px;
  bottom: -10px;
  left: 6px;
}

.page-woocommerce-inner .button:hover::after,
.checkout-button:hover::after,
.single_add_to_cart_button:hover::after,
.woocommerce-button:hover::after {
  width: 8px;
  right: -10px;
  top: 6px;
}

/* -- Woocommerce shop ----------------------------------*/
.woocommerce ul.products li.product .woocommerce-loop-category__title, 
.woocommerce ul.products li.product .woocommerce-loop-product__title, 
.woocommerce ul.products li.product h3 {
  font-family: "Changa One", sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 0.74em;
  text-transform: uppercase;
  padding: .5em 0;
  margin: 0;
  font-size: 1.4rem;
  color: #12121B;
}

.woocommerce ul.products li.product .price {
  display: block;
  font-family: "Alegreya", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  line-height: 1.4em;
  color: #a29061;
  font-size: clamp(1.429rem, 1.2647rem + 0.4596vw, 2rem);
  text-transform: uppercase;
}

.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, 
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {
  font-weight: 700;
  line-height: 1.4em;
  color: #a29061;
  font-size: 1.25rem;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

/* -- Woocommerce product -------------------------------*/
.page-woocommerce-inner .product {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}

.woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary,
.woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
  float: none;
  width: 100%;
}

.woocommerce-product-gallery__wrapper {
  display: flex;
  justify-content: center;
}

.woocommerce-product-gallery__wrapper .wp-post-image {
  width: auto !important;
}

.page-woocommerce-inner .product .product_title {
  margin: 0;
}

.page-woocommerce-inner .product_meta,
.page-woocommerce-inner .wc-tabs-wrapper .wc-tabs {
  display: none;
}

.woocommerce div.product form.cart div.quantity {
  float: left;
  margin: 0 1.5rem 0 0;
}

.woocommerce .quantity .qty {
  width: 6rem;
  text-align: center;
  padding: .65rem 1rem .65rem .65rem;
  border: none;
  border-radius: 0;
  min-height: 47px;  
}

/* -- Woocommerce cart ----------------------------------*/
.cart_totals h2 {
  margin: 1.5rem 0 2rem 0;
}

.woocommerce table.shop_table {
  border: none;
  border-radius: 0;
}

.shop_table_responsive {
  font-size: 1.25rem;
}

.shop_table_responsive thead th {
  font-weight: 700;
}

.woocommerce-additional-fields {
  display: none;
}

.woocommerce table.shop_table td {
  border-top: 2px solid rgba(0,0,0,.1);
  padding: 1rem 1rem;
  vertical-align: middle;
  line-height: 1.5em;
}

.woocommerce a.remove {
  height: 2rem;
  width: 2rem;
  display: grid;
  place-items: center;
  border-radius: 100%;
  font-size: 1.35rem;
  color: #E3DED0 !important;
  text-decoration: none;
  font-weight: 700;
  border: 0;
  background: rgba(0,0,0,.1);
}

.woocommerce table.cart th.product-thumbnail, .woocommerce table.cart td.product-thumbnail{ display: none !important; }

.product-name a {
  font-weight: 700;
  padding: .5em 0;
  margin: 0;
  font-size: 1.25rem;
  color: #12121B;
  text-decoration: none;
  text-transform: uppercase;
}

.product-price span,
.product-subtotal span {
  font-weight: 700;
  line-height: 1.4em;
  color: #a29061;
  font-size: 1.25rem;
  text-transform: uppercase;
}

.woocommerce-form-row label {
  font-weight: 700;
  margin-bottom: .25rem;
}

.shipping-calculator-button {
  font-size: 1rem;
  font-weight: 700;
  color: #a29061;
  text-decoration: none;
}

#add_payment_method .wc-proceed-to-checkout a.checkout-button, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button, .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button {
  display: inline-block;
}

/* -- Woocommerce checkout ------------------------------*/
.woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register {
  border: none;
  padding: 0;
  margin: 2em 0;
  text-align: left;
  border-radius: 0;
}

.woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register {
  margin: 0 0 2rem 0;
}

.woocommerce form .form-row {
  padding: 0;
}

.form-row {
  margin-bottom: 1.5rem !important;
}

.form-row:last-child {
  margin-bottom: 0 !important;
}

.woocommerce .woocommerce-form-login .woocommerce-form-login__rememberme {
  margin-top: .5rem;
  margin-left: 1rem;
}

#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
  background: none;
  border-radius: 0;
}

#add_payment_method #payment div.payment_box::before, .woocommerce-cart #payment div.payment_box::before, .woocommerce-checkout #payment div.payment_box::before {
  border: 1em solid rgb(203, 199, 186);
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
}

#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box {
  background-color: rgb(203, 199, 186);
}

#add_payment_method .cart-collaterals .cart_totals tr td, #add_payment_method .cart-collaterals .cart_totals tr th, .woocommerce-cart .cart-collaterals .cart_totals tr td, .woocommerce-cart .cart-collaterals .cart_totals tr th, .woocommerce-checkout .cart-collaterals .cart_totals tr td, .woocommerce-checkout .cart-collaterals .cart_totals tr th {
  border-top: 2px solid rgba(0,0,0,.1);
}

.page-woocommerce-inner .woocommerce-checkout {
  display: grid; 
  grid-template-columns: 1fr; 
  grid-template-rows: min-content min-content min-content; 
  gap: 1.5rem 4rem;
  grid-template-areas: 
    "notice"
    "left"
    "right"; 
}
.woocommerce-NoticeGroup-checkout { grid-area: notice; }
.woocommerce-checkout__col--left { grid-area: left; }
.woocommerce-checkout__col--right { grid-area: right; }

/* -- Woocommerce receipt------------------------*/
.woocommerce-thankyou-order-details li {
  font-size: 1rem !important;
  font-weight: 700;
}

.woocommerce-thankyou-order-details li strong {
  font-size: 1rem !important;
  font-weight: 400;
  margin-top: .25rem;
}

.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
  padding: .75rem 0 !important;
}

.woocommerce-order-details .wc-item-meta {
  font-size: 1rem;
}

.woocommerce-order-details .amount {
  font-weight: 700;
  color: #a29061;
}

.woocommerce .woocommerce-customer-details address {
  font-size: 1rem;
  border: none;
  padding: 0;
  line-height: 1.4;
}

.woocommerce-customer-details .woocommerce-customer-details--email {
  padding: 0 !important;
}

.woocommerce-customer-details .woocommerce-customer-details--email:before {
  display: none;
}

.woocommerce .woocommerce-customer-details .woocommerce-customer-details--email:last-child, .woocommerce .woocommerce-customer-details .woocommerce-customer-details--phone:last-child {
  margin-bottom: 0;
  line-height: 1.8rem;
}
 
.woocommerce td.product-name .wc-item-meta, .woocommerce td.product-name dl.variation {
  list-style: none outside;
  margin-top: 0.5rem;
}
 
.woocommerce table.shop_table td {
  border-top: 1px solid rgba(0,0,0,.1);
  padding: 1rem 1rem;
  vertical-align: middle;
  line-height: 1.5em;
}

.woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
  float: none;
}

/* -- Fields-------------------------------------*/
.woocommerce-terms-and-conditions-wrapper,
.wpcpo-wrapper {
  margin-bottom: 1.5rem;
}

.wpcpo-options {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

.wpcpo-option-field {
  width: 100%;
}

.wpcpo-option-name {
  display: block;
  margin-bottom: .5rem;
}

.wpcpo-option-name strong {
  color: #12121B;
}

.wpcpo-total {
  display: none;
}

.woonp-type-default {
  margin: 1.5rem 0 3rem 0;
}

.woonp input {
  width: auto !important;
  min-width: 120px;
}

.woonp-input,
.wpcpo-option-field,
.select2-container--default .select2-selection--single,
.page-woocommerce-inner .input-text,
.woocommerce-Input {
  font-family: "Roboto Mono", monospace;
  font-weight: 400;
  font-size: 1rem !important;
  padding: .65rem 1rem; 
  border: none;
  border-radius: 0;
  height: 44px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 9px;
  right: 10px;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  padding-left: 0;
  padding-right: 0;
}

/* -- Woovr variations --------------------------------*/
.woovr-variations {
  margin: 0 0 2rem 0;
}

.woovr-variations .woovr-variation-radio + .woovr-variation-radio {
  margin-top: .5rem;
}

.woovr-variation-radio .woovr-variation-selector {
  width: 3.5rem;
  flex: 0 0 3.5rem;
}

.woovr-variations .woovr-variation {
  align-items: start;
}

.woovr-variation-radio input[type=radio]{
  appearance: none;
  height: 26px;
  width: 26px;
  margin-right: 1rem;
  border-radius: 50%;
  background-clip: content-box;
  border: 2px solid #4B4B55;
  background-color: transparent;
  cursor: pointer;
}

.woovr-variation-radio input[type="radio"]:checked {
  background-color: #a29061;
  padding: 3px;
  border: 2px solid #4B4B55;
}

.woovr-variations .woovr-variation:hover {
  background: none;
}

.woovr-variation-radio .woovr-variation-name {
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
}

.woovr-variation-price {
  font-weight: 700;
  line-height: 1.4;
  color: #a29061;
  font-size: 1.25rem !important;
  text-transform: uppercase;
}

.woovr-variation-price .price--from {
  display: none;
  text-transform: uppercase;
}

dl.variation {
  font-size: 1rem;
}

/* -- Mijn account -----------------------------------*/
.woocommerce-MyAccount-navigation ul {
  list-style: none;
}

.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link + .woocommerce-MyAccount-navigation-link {
  margin-top: .75rem;
}

.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link a {
  position: relative;
  font-weight: 500;
  letter-spacing: 0.045em;
  position: relative;
  color: rgb(18, 18, 27);
  text-decoration: none;
  text-transform: uppercase;
}

.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link a::before {
  background-color: rgb(18, 18, 27);
  bottom: -4px;
  content: "";
  height: 2px;
  left: 0;
  opacity: 0;
  position: absolute;
  transform: translateY(-4px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  width: 100%;
}

.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link a:hover::before,
.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link.is-active a::before {
  opacity: 1;
  transform: translateY(0);
}

.woocommerce-MyAccount-content .woocommerce-info {
  align-items: center;
}

.woocommerce-MyAccount-content .woocommerce-info .wc-forward {
  display: none;
}


.woocommerce-MyAccount-content fieldset {
  border: none;
}

.woocommerce-MyAccount-content fieldset legend {
  font-family: "Changa One", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: -0.135em;
  line-height: 0.74em;
  text-transform: uppercase;
  font-size: clamp(1.375rem, 1.1952rem + 0.503vw, 2rem);
  margin: 2rem 0 1rem 0;
}

.woocommerce-MyAccount-content .woocommerce-Button:not(.wc-forward) {
  margin-top: 2rem !important;
}

/* -- Woocommerce media queries ----------------------*/
@media all and (min-width: 992px) {  
  .page-woocommerce-inner .button,
  .checkout-button,
  .single_add_to_cart_button,
  .woocommerce-button {
    --btn-height: 3.125rem;
  }
  
  .page-woocommerce-inner .product {
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
  }
  
  .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary {
    align-self: center;
  }  
}

@media all and (min-width: 1200px) {  
  .page-woocommerce-inner .woocommerce-checkout {
    grid-template-columns: 1.5fr 1fr; 
    grid-template-rows: min-content min-content; 
    gap: 1.5rem 4rem;
    grid-template-areas: 
      "notice notice"
      "left right"; 
  }  
}

@media all and (min-width: 1400px) {  
  .page-woocommerce-inner .button,
  .checkout-button,
  .single_add_to_cart_button,
  .woocommerce-button {
    --btn-height: 3.25rem;
  }  
}
