@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=Bodoni+Moda:opsz,wght@6..96,500;6..96,600&family=Manrope:wght@400;500;600;700;800&display=swap');

body.woocommerce-cart,
body.woocommerce-checkout,
body.woocommerce-account {
  background: #f3eee7;
}

/* The residual sideways drag on these templates measures exactly one of the shell's
   horizontal paddings (18px at 390, 46px at 768, 86px at 1440 — i.e. 6vw), so some
   full-bleed element sits outside the shell, which already clips its own contents.
   Clipping at the root contains it; clip rather than hidden keeps the root from
   becoming a scroll container, so the sticky order summary still works. */
html:has(> body.woocommerce-cart),
html:has(> body.woocommerce-checkout),
html:has(> body.woocommerce-account) { overflow-x: clip; }

body.woocommerce-cart .glee-commerce-shell,
body.woocommerce-checkout .glee-commerce-shell,
body.woocommerce-account .glee-commerce-shell {
  min-height: 72vh;
  padding: clamp(150px, 12vw, 210px) clamp(24px, 6vw, 110px) clamp(90px, 9vw, 150px);
  color: #11100f;
  background:
    radial-gradient(circle at 95% 2%, rgba(173,11,52,.07), transparent 24%),
    #f3eee7;
  font-family: Manrope, sans-serif;
}

.glee-commerce-shell > .woocommerce { width: min(100%, 1500px); margin-inline: auto; }

.glee-flow-head {
  margin: 0 0 clamp(56px, 7vw, 105px);
  padding-bottom: 38px;
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(250px,.65fr);
  align-items: end;
  gap: 40px;
  border-bottom: 1px solid rgba(17,16,15,.18);
}

.glee-flow-head small {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #ad0b34;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .18em;
}
.glee-flow-head small::before { content: ""; width: 34px; height: 2px; background: currentColor; }
.glee-flow-head h1 { margin: 20px 0 0; font: 700 clamp(68px, 8vw, 138px)/.77 "Barlow Condensed",sans-serif; letter-spacing: -.055em; text-transform: uppercase; }
.glee-flow-head h1 em { color: #ad0b34; font-family: "Bodoni Moda",serif; font-weight: 500; text-transform: none; }
.glee-flow-head p { max-width: 440px; margin: 0 0 8px; color: #6f6861; font-size: 13px; line-height: 1.75; }

.woocommerce form.checkout.woocommerce-checkout {
  display: grid;
  grid-template-columns: minmax(0,1.25fr) minmax(360px,.75fr);
  grid-template-areas: "customer reviewTitle" "customer review";
  align-items: start;
  column-gap: clamp(40px,6vw,100px);
}

.woocommerce form.checkout #customer_details { grid-area: customer; width: auto; }
.woocommerce form.checkout #order_review_heading { grid-area: reviewTitle; }
.woocommerce form.checkout #order_review { grid-area: review; }
.woocommerce form.checkout #customer_details .col-1,
.woocommerce form.checkout #customer_details .col-2 { float: none; width: 100%; }
.woocommerce form.checkout #customer_details .col-2 { margin-top: 52px; }

.woocommerce .woocommerce-billing-fields > h3,
.woocommerce .woocommerce-shipping-fields h3,
.woocommerce #order_review_heading,
.woocommerce-account .woocommerce h2,
.woocommerce-account .woocommerce h3 {
  margin: 0 0 30px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(17,16,15,.16);
  font: 700 clamp(30px,3vw,46px)/.9 "Barlow Condensed",sans-serif;
  letter-spacing: -.025em;
  text-transform: uppercase;
}

.woocommerce .form-row { margin: 0 0 22px; padding: 0; }
.woocommerce .form-row label { margin-bottom: 9px; color: #5f5852; font-size: 9px; font-weight: 800; letter-spacing: .1em; line-height: 1.4; text-transform: uppercase; }
.woocommerce .form-row .required { color: #ad0b34; }
.woocommerce .form-row input.input-text,
.woocommerce .form-row textarea,
.woocommerce .form-row select,
.woocommerce .select2-container .select2-selection--single {
  min-height: 58px;
  padding: 0 17px;
  border: 1px solid rgba(17,16,15,.18);
  border-radius: 0;
  color: #11100f;
  background: rgba(255,255,255,.58);
  box-shadow: none;
  font: 600 14px/58px Manrope,sans-serif;
  transition: background .25s,border-color .25s,box-shadow .25s;
}
.woocommerce .form-row textarea { min-height: 130px; padding-top: 15px; line-height: 1.6; }
.woocommerce .form-row input.input-text:focus,
.woocommerce .form-row textarea:focus,
.woocommerce .select2-container--open .select2-selection--single { border-color: #11100f; background: #fff; box-shadow: 0 0 0 3px rgba(173,11,52,.07); outline: 0; }
.woocommerce .select2-container .select2-selection__rendered { padding: 0; line-height: 58px; }
.woocommerce .select2-container .select2-selection__arrow { height: 58px; right: 12px; }

.woocommerce-checkout #order_review {
  position: sticky;
  top: 120px;
  padding: clamp(28px,3vw,48px);
  color: #11100f;
  background: rgba(255,255,255,.82);
  box-shadow: 0 28px 80px rgba(58,42,33,.09);
}
.woocommerce-checkout-review-order-table { margin: 0 0 28px!important; border: 0!important; border-collapse: collapse!important; }
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td { padding: 17px 0!important; border: 0!important; border-bottom: 1px solid rgba(17,16,15,.12)!important; font-size: 11px; line-height: 1.55; }
.woocommerce-checkout-review-order-table th { font-weight: 800!important; letter-spacing: .06em; text-transform: uppercase; }
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td { padding-top: 24px!important; font-size: 15px; }
.woocommerce-checkout-review-order-table .order-total .amount { color: #ad0b34; font-size: 24px; }

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment { border-radius: 0; background: transparent; }
.woocommerce-checkout #payment ul.payment_methods { padding: 0; border-bottom: 1px solid rgba(17,16,15,.14); }
.woocommerce-checkout #payment ul.payment_methods li { margin: 0 0 16px; font-size: 12px; font-weight: 700; }
.woocommerce-checkout #payment div.payment_box { border-radius: 0; color: #5f5852; background: #eee6dc; font-size: 11px; line-height: 1.65; }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: #eee6dc; }
.woocommerce-checkout #payment div.form-row { padding: 26px 0 0; }

.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button {
  min-height: 56px!important;
  padding: 0 28px!important;
  border: 1px solid #11100f!important;
  border-radius: 0!important;
  color: #fff!important;
  background: #11100f!important;
  box-shadow: none!important;
  font: 800 9px/1 Manrope,sans-serif!important;
  letter-spacing: .12em!important;
  text-transform: uppercase!important;
  transition: background .25s,border-color .25s,transform .25s!important;
}
.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.wc-block-components-button:hover { border-color: #ad0b34!important; background: #ad0b34!important; transform: translateY(-2px); }
#place_order { width: 100%; min-height: 64px!important; background: #ad0b34!important; border-color: #ad0b34!important; }
#place_order:hover { background: #11100f!important; border-color: #11100f!important; }

.woocommerce-error,
.woocommerce-info,
.woocommerce-message { margin: 0 0 34px!important; padding: 20px 22px 20px 52px!important; border: 0!important; border-left: 3px solid #ad0b34!important; color: #3f3935!important; background: rgba(255,255,255,.72)!important; box-shadow: none; font-size: 12px; line-height: 1.65; }
.woocommerce-info::before,
.woocommerce-message::before,
.woocommerce-error::before { top: 21px; color: #ad0b34!important; }

.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register,
.woocommerce form.lost_reset_password {
  margin: 0;
  padding: clamp(28px,4vw,56px);
  border: 1px solid rgba(17,16,15,.15);
  border-radius: 0;
  background: rgba(255,255,255,.55);
}

.woocommerce-account .woocommerce:not(:has(.woocommerce-MyAccount-navigation)) { max-width: 1080px; margin-inline: auto; }
.woocommerce-account #customer_login { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px,5vw,80px); }
.woocommerce-account #customer_login::before,
.woocommerce-account #customer_login::after { display: none; }
.woocommerce-account #customer_login .col-1,
.woocommerce-account #customer_login .col-2 { float: none; width: 100%; }
.woocommerce-account .woocommerce-MyAccount-navigation { width: 27%; padding: 30px; background: #11100f; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li + li { border-top: 1px solid rgba(255,255,255,.14); }
.woocommerce-account .woocommerce-MyAccount-navigation a { display: block; padding: 17px 2px; color: rgba(255,255,255,.7); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation a:hover { color: #f0b4c4; }
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a { color: #fff; }
.glee-account-session { width: 27%; margin: 0 0 12px; padding: 18px 30px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #fff; background: #ad0b34; }
.glee-account-session span { font-size: 8px; font-weight: 800; letter-spacing: .14em; opacity: .72; }
.glee-account-session a { display: flex; align-items: center; gap: 12px; color: #fff; font-size: 9px; font-weight: 900; letter-spacing: .11em; white-space: nowrap; }
.glee-account-session b { font-size: 15px; font-weight: 400; }
.woocommerce-account .woocommerce-MyAccount-content { width: 68%; padding: 5px 0 0; color: #5f5852; font-size: 13px; line-height: 1.75; }

.woocommerce-cart table.shop_table { border: 0; border-collapse: collapse; background: rgba(255,255,255,.55); }
.woocommerce-cart table.shop_table th,
.woocommerce-cart table.shop_table td { padding: 22px!important; border: 0!important; border-bottom: 1px solid rgba(17,16,15,.13)!important; }
.woocommerce-cart table.shop_table th { font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.woocommerce-cart table.shop_table img { width: 100px; }
.woocommerce-cart .cart-collaterals { margin-top: 48px; }
.woocommerce-cart .cart-collaterals .cart_totals { width: min(100%,560px); padding: 38px; background: rgba(255,255,255,.75); }

/* ---------------------------------------------------------------------------
   Commerce form standard.

   WooCommerce ships .form-row with an inline label and floated first/last pairs.
   With the label inline, every input started at a different x — one per label
   length — and none of them picked up a width, so they all fell back to the
   browser's default ~208px. Each row is a grid here: label on its own line,
   control filling the row, one rhythm for every field on checkout, cart, login
   and account.
   --------------------------------------------------------------------------- */
body.woocommerce-checkout .form-row,
body.woocommerce-cart .form-row,
body.woocommerce-account .form-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 9px;
  margin: 0 0 22px;
  padding: 0;
  float: none;
  width: 100%;
}

body.woocommerce-checkout .form-row > label,
body.woocommerce-cart .form-row > label,
body.woocommerce-account .form-row > label {
  display: block;
  width: 100%;
  margin: 0;
}

body.woocommerce-checkout .form-row .woocommerce-input-wrapper,
body.woocommerce-cart .form-row .woocommerce-input-wrapper,
body.woocommerce-account .form-row .woocommerce-input-wrapper { display: block; width: 100%; }

body.woocommerce-checkout .form-row input.input-text,
body.woocommerce-checkout .form-row textarea,
body.woocommerce-checkout .form-row select,
body.woocommerce-checkout .form-row .select2-container,
body.woocommerce-cart .form-row input.input-text,
body.woocommerce-cart .form-row select,
body.woocommerce-cart .form-row .select2-container,
body.woocommerce-account .form-row input.input-text,
body.woocommerce-account .form-row textarea,
body.woocommerce-account .form-row select,
body.woocommerce-account .form-row .select2-container {
  width: 100%;
  max-width: 100%;
  min-height: 58px;
}

/* The floated first/last pair becomes a real two-column row. */
body.woocommerce-checkout #customer_details .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout #customer_details .woocommerce-shipping-fields__field-wrapper,
body.woocommerce-checkout #customer_details .woocommerce-additional-fields__field-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 20px;
}
body.woocommerce-checkout #customer_details .form-row { grid-column: 1 / -1; }
body.woocommerce-checkout #customer_details .form-row-first { grid-column: 1 / 2; }
body.woocommerce-checkout #customer_details .form-row-last { grid-column: 2 / -1; }

/* A locked single-country store renders the label with no control under it. */
body.woocommerce-checkout .form-row#billing_country_field:not(:has(select)):not(:has(.select2-container)),
body.woocommerce-checkout .form-row#shipping_country_field:not(:has(select)):not(:has(.select2-container)) { display: none; }

/* ---------------------------------------------------------------------------
   Cart actions. WooCommerce floats the coupon block left and the update button
   right; against this theme's inline-flex .button (min-width: 210px) the two
   overlapped and sat at different heights. Flex row, shared baseline, no floats.
   --------------------------------------------------------------------------- */
/* The actions row is a single colspan=6 cell. It has to stay a table-cell — any
   other display value drops it out of the table algorithm, and with it the colspan,
   collapsing the cell to its content width. So the cell keeps floats and only its
   contents become flex; overflow:hidden contains them without a clearfix. */
body.woocommerce-cart table.shop_table td.actions {
  display: table-cell;
  overflow: hidden;
  text-align: right;
}
body.woocommerce-cart table.shop_table td.actions > input[type="hidden"] { display: none; }
body.woocommerce-cart table.shop_table td.actions::before,
body.woocommerce-cart table.shop_table td.actions::after { display: none; }
body.woocommerce-cart table.shop_table td.actions .coupon {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  float: left;
  width: auto;
  max-width: 100%;
  margin: 0;
  padding: 0;
  text-align: left;
}
body.woocommerce-cart table.shop_table td.actions .coupon label { display: none; }
body.woocommerce-cart table.shop_table td.actions .coupon input.input-text {
  width: min(260px, 46vw);
  min-height: 52px;
  margin: 0;
}
body.woocommerce-cart table.shop_table td.actions .button,
body.woocommerce-cart table.shop_table td.actions button {
  float: none;
  margin: 0;
  min-height: 52px;
  min-width: 0;
  padding-inline: 26px;
  white-space: nowrap;
}

/* The checkout CTA was clipped by the card: inline-flex plus a fixed height left
   no room for the label to sit on its own line. */
body.woocommerce-cart .wc-proceed-to-checkout { display: block; margin-top: 26px; padding: 0; }
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  min-height: 62px;
  height: auto;
  margin: 0;
  padding: 18px 24px;
  line-height: 1.3;
  text-align: center;
  white-space: normal;
}
body.woocommerce-cart .cart_totals table.shop_table { width: 100%; table-layout: auto; }
body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td { padding: 16px 0!important; }

@media (max-width: 980px) {
  .woocommerce form.checkout.woocommerce-checkout { display: block; }
  .woocommerce-checkout #order_review_heading { margin-top: 60px; }
  .woocommerce-checkout #order_review { position: static; }
  .woocommerce-account #customer_login { grid-template-columns: 1fr; }
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content { float: none; width: 100%; }
  .glee-account-session { width: 100%; margin-bottom: 12px; padding: 18px 22px; }
  .woocommerce-account .woocommerce-MyAccount-content { margin-top: 45px; }
}

@media (max-width: 720px) {
  body.woocommerce-cart .glee-commerce-shell,
  body.woocommerce-checkout .glee-commerce-shell,
  body.woocommerce-account .glee-commerce-shell { padding: 118px 18px 80px; }
  .glee-flow-head { display: block; margin-bottom: 50px; padding-bottom: 28px; }
  .glee-flow-head h1 { font-size: 20vw; }
  .glee-flow-head p { margin-top: 28px; }
  .woocommerce .form-row-first,
  .woocommerce .form-row-last { float: none!important; width: 100%!important; }
  /* One column on phones: the pair grid collapses and both halves span it. */
  body.woocommerce-checkout #customer_details .woocommerce-billing-fields__field-wrapper,
  body.woocommerce-checkout #customer_details .woocommerce-shipping-fields__field-wrapper,
  body.woocommerce-checkout #customer_details .woocommerce-additional-fields__field-wrapper { grid-template-columns: minmax(0, 1fr); }
  body.woocommerce-checkout #customer_details .form-row-first,
  body.woocommerce-checkout #customer_details .form-row-last { grid-column: 1 / -1; }
  body.woocommerce-cart table.shop_table td.actions { text-align: left; }
  body.woocommerce-cart table.shop_table td.actions .coupon { float: none; width: 100%; margin-bottom: 12px; }
  body.woocommerce-cart table.shop_table td.actions .coupon input.input-text { flex: 1 1 auto; width: auto; min-width: 0; }
  body.woocommerce-cart table.shop_table td.actions .button,
  body.woocommerce-cart table.shop_table td.actions button { width: 100%; justify-content: center; }
  .woocommerce-checkout #order_review { margin-inline: -4px; padding: 24px 18px; }
  .woocommerce form.checkout_coupon,
  .woocommerce form.login,
  .woocommerce form.register,
  .woocommerce form.lost_reset_password { padding: 24px 18px; }
  .woocommerce-cart table.shop_table_responsive tr td { padding: 18px!important; }
  .woocommerce-cart .cart-collaterals .cart_totals { padding: 26px 18px; }
}
