/* ==========================================================================
   Chelsea Chelsea — Cart, Checkout & Flyout Cart
   Loaded by the enqueue in functions-additions.php, after style.css.
   To revert the whole design: delete this file and the enqueue block.
   ========================================================================== */

:root{
  --cc-paper:#ffffff;
  --cc-surface:#faf8f6;
  --cc-ink:#14110f;
  --cc-ink-soft:#6b6560;
  --cc-rule:#e5e1dc;
  --cc-rule-strong:#cfc9c2;
  --cc-accent:#ef8686;
  --cc-accent-deep:#b85252;
  --cc-accent-wash:#fdf0f0;
  --cc-bold:'Futura Bold','Jost',sans-serif;
  --cc-med:'Futura Medium','Jost',sans-serif;
  --cc-light:'Futura Light','Futura book','Jost',sans-serif;
}

/* --------------------------------------------------------------------------
   Reset Bridge's heavy black table chrome. These rules targeted the old
   table based cart, which no longer exists, but several also catch checkout.
   -------------------------------------------------------------------------- */
.woocommerce-cart table.cart,
.woocommerce-cart table.cart tbody tr,
.woocommerce-cart table.cart thead tr,
.woocommerce-cart table.cart tbody td.product-remove{
  border:0 !important;
}
.woocommerce-checkout .chelsea-checkout-revieworder table.shop_table,
.woocommerce-checkout .chelsea-checkout-revieworder table.shop_table thead tr,
.woocommerce-checkout .chelsea-checkout-revieworder table.shop_table thead tr th{
  border:0 !important;
  background:transparent !important;
  color:var(--cc-ink) !important;
}

/* ==========================================================================
   Shared pieces
   ========================================================================== */

.cc-btn,
.woocommerce .cc-cart-side a.cc-btn,
.woocommerce .cc-flyout a.cc-btn{
  display:block;
  width:100%;
  box-sizing:border-box;
  text-align:center;
  background:var(--cc-ink);
  color:#fff;
  border:1px solid var(--cc-ink);
  padding:15px 20px;
  height:auto;
  line-height:1.2;
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  text-decoration:none;
  border-radius:0;
  transition:opacity .15s ease;
}
.cc-btn:hover{opacity:.86;color:#fff;background:var(--cc-ink)}

.cc-btn-ghost,
.woocommerce .cc-cart-side a.cc-btn-ghost,
.woocommerce .cc-flyout a.cc-btn-ghost{
  background:none;
  color:var(--cc-ink);
  border-color:var(--cc-rule-strong);
}
.cc-btn-ghost:hover{background:none;color:var(--cc-ink);border-color:var(--cc-accent);opacity:1}

/* Free shipping meter */
.cc-meter,
.cc-mc-meter{
  background:var(--cc-surface);
  padding:16px 18px;
  margin:0 0 8px;
  display:flex;
  flex-direction:column;
  gap:10px;
  text-align:left;
}
.cc-meter .cc-meter-text,
.cc-mc-meter .cc-meter-text{
  font-size:13px;
  line-height:1.5;
  color:var(--cc-ink);
}
.cc-meter .amount,
.cc-mc-meter .amount{
  font-family:var(--cc-bold);
  color:var(--cc-accent-deep);
}
.cc-track{
  height:3px;
  background:var(--cc-rule-strong);
  position:relative;
  overflow:hidden;
}
.cc-track span{
  position:absolute;
  top:0;bottom:0;left:0;
  background:var(--cc-accent);
  transition:width .3s ease;
}

/* Promo / gift card bar */
.cc-promobar{
  border:1px solid var(--cc-rule-strong);
  background:var(--cc-paper);
  margin:0 0 12px;
}
.cc-promobar:hover{border-color:var(--cc-ink)}
.cc-promobar > summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px 16px;
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
  cursor:pointer;
  list-style:none;
}
.cc-promobar > summary::-webkit-details-marker{display:none}
.cc-promobar > summary::after{content:'+';font-size:15px;line-height:1}
.cc-promobar[open] > summary::after{content:'\2013'}
.cc-promobar[open] > summary{border-bottom:1px solid var(--cc-rule);color:var(--cc-ink)}
.cc-promobar .cc-promobar-inner{
  display:flex;
  gap:8px;
  padding:14px 16px;
  margin:0;
  border:0;
}
.woocommerce .cc-promobar .cc-promobar-inner input[type="text"]{
  flex:1;
  min-width:0;
  width:auto;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:11px 13px;
  font-family:var(--cc-light);
  font-size:14px;
  background:var(--cc-paper);
  color:var(--cc-ink);
  margin:0;
}
.woocommerce .cc-promobar .cc-promobar-inner input.button,
.woocommerce .cc-promobar .cc-promobar-inner button.button{
  background:none;
  color:var(--cc-ink);
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:0 18px;
  height:auto;
  line-height:40px;
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:nowrap;
  margin:0;
}
.woocommerce .cc-promobar .cc-promobar-inner .button:hover{
  border-color:var(--cc-accent);
  color:var(--cc-accent-deep);
  background:none;
}

/* ==========================================================================
   CART PAGE
   ========================================================================== */

.woocommerce-cart .cc-cart-form{margin:0}

.cc-cart-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 380px;
  gap:clamp(32px,5vw,72px);
  align-items:start;
  margin:28px 0 0;
}
.cc-cart-main{min-width:0}
.cc-cart-side{
  min-width:0;
  position:sticky;
  top:120px;
}

/* Line items */
.cc-lines{list-style:none;margin:0;padding:0}
.cc-lines li{margin:0}
.cc-line{
  display:grid;
  grid-template-columns:96px minmax(0,1fr) auto;
  gap:20px;
  padding:26px 0;
  border-bottom:1px solid var(--cc-rule);
  align-items:start;
}
.cc-line-thumb{width:96px}
.cc-line-thumb img{display:block;width:96px;height:auto;max-width:100%}
.cc-line-info{min-width:0}

.cc-line-name{
  font-family:var(--cc-bold);
  font-size:14px;
  letter-spacing:.09em;
  text-transform:uppercase;
  line-height:1.4;
  margin-bottom:4px;
}
.cc-line-name a{color:var(--cc-ink);text-decoration:none}
.cc-line-name a:hover{color:var(--cc-accent-deep)}

/* Add-on and variation data (custom prints) */
.cc-line-meta{font-size:13px;color:var(--cc-ink-soft);line-height:1.5}
.cc-line-meta dl.variation{margin:0 0 2px}
.cc-line-meta dl.variation dt{
  float:none;
  display:inline;
  font-family:var(--cc-bold);
  font-weight:normal;
  padding:0 4px 0 0;
  clear:none;
}
.cc-line-meta dl.variation dd{
  display:inline;
  margin:0 0 0 0;
  padding:0;
}
.cc-line-meta dl.variation dd p{display:inline;margin:0 !important}
.cc-line-meta dl.variation dd::after{content:'';display:block;height:2px}

.cc-line-unit{
  font-size:13px;
  color:var(--cc-ink-soft);
  margin-top:3px;
  font-variant-numeric:tabular-nums;
}
.cc-line-unit .cc-each{margin-left:2px}

.cc-line-qty{margin-top:14px}

.cc-line-right{
  text-align:right;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:12px;
}
.cc-line-total{
  font-family:var(--cc-med);
  font-size:15px;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.woocommerce .cc-line-right a.cc-remove{
  font-family:var(--cc-med);
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
  background:none;
  width:auto;height:auto;
  line-height:1.2;
  border-bottom:1px solid transparent;
  border-radius:0;
  text-decoration:none;
  display:inline-block;
}
.woocommerce .cc-line-right a.cc-remove:hover{
  color:var(--cc-accent-deep);
  border-bottom-color:var(--cc-accent);
  background:none;
}

/* Quantity stepper */
.woocommerce .cc-line-qty .quantity{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--cc-rule-strong);
  margin:0;
  padding:0;
  float:none;
}
.woocommerce .cc-line-qty .quantity .minus,
.woocommerce .cc-line-qty .quantity .plus{
  width:34px;height:34px;line-height:34px;
  background:none;
  border:0;
  color:var(--cc-ink-soft);
  font-size:15px;
  cursor:pointer;
  border-radius:0;
}
.woocommerce .cc-line-qty .quantity .minus:hover,
.woocommerce .cc-line-qty .quantity .plus:hover{color:var(--cc-ink);background:none}
.woocommerce .cc-line-qty .quantity input.qty{
  width:38px;height:34px;
  border:0;
  border-left:1px solid var(--cc-rule);
  border-right:1px solid var(--cc-rule);
  text-align:center;
  font-family:var(--cc-med);
  font-size:14px;
  font-variant-numeric:tabular-nums;
  background:var(--cc-paper);
  color:var(--cc-ink);
  border-radius:0;
  padding:0;
  -moz-appearance:textfield;
}
.woocommerce .cc-line-qty .quantity input.qty::-webkit-outer-spin-button,
.woocommerce .cc-line-qty .quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* Update cart */
.cc-cart-actions{padding:22px 0 0;border:0}
.woocommerce .cc-cart-actions input.button{
  background:none;
  color:var(--cc-ink-soft);
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  height:auto;
  line-height:40px;
  padding:0 24px;
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.woocommerce .cc-cart-actions input.button:hover{border-color:var(--cc-ink);color:var(--cc-ink);background:none}
.woocommerce .cc-cart-actions input.button:disabled{opacity:.4}

/* Summary panel */
.cc-summary{
  background:var(--cc-surface);
  padding:26px 26px 28px;
  width:auto;
  float:none;
}
.cc-summary-title{
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
  margin:0 0 18px;
  padding:0 0 16px;
  border-bottom:1px solid var(--cc-rule);
}

/* WooCommerce cart totals table inside the summary */
.cc-summary .cart_totals{padding:0;width:auto;float:none}
.cc-summary .cart_totals h2{display:none}
.cc-summary .cart_totals table,
.cc-summary .cart_totals table tr,
.cc-summary .cart_totals table th,
.cc-summary .cart_totals table td{
  border:0 !important;
  background:none !important;
  width:auto;
}
.cc-summary .cart_totals table{width:100%;margin:0;border-collapse:collapse}
.cc-summary .cart_totals table tr{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:16px;
  padding:10px 0;
}
.cc-summary .cart_totals table th{
  font-family:var(--cc-med);
  font-weight:normal;
  font-size:14px;
  color:var(--cc-ink);
  text-align:left;
  padding:0;
  text-transform:none;
  letter-spacing:0;
}
.cc-summary .cart_totals table td{
  font-size:14px;
  text-align:right;
  padding:0;
  font-variant-numeric:tabular-nums;
}
.cc-summary .cart_totals table tr.order-total{
  border-top:1px solid var(--cc-rule) !important;
  margin-top:8px;
  padding-top:16px;
}
.cc-summary .cart_totals table tr.order-total th{
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.cc-summary .cart_totals table tr.order-total td strong{
  font-family:var(--cc-med);
  font-weight:normal;
  font-size:22px;
}
.cc-summary .cart_totals .includes_tax,
.cc-summary .cart_totals small.includes_tax{
  display:block;
  font-size:12px !important;
  font-family:var(--cc-light) !important;
  color:var(--cc-ink-soft);
  text-transform:none !important;
  letter-spacing:0;
}

/* Shipping rows and calculator */
.cc-summary .woocommerce-shipping-totals.shipping{flex-wrap:wrap}
.cc-summary .woocommerce-shipping-totals ul#shipping_method{
  list-style:none;
  margin:0;
  padding:0;
  width:100%;
  text-align:right;
}
.cc-summary .woocommerce-shipping-totals ul#shipping_method li{
  margin:0 0 4px;
  font-size:13.5px;
  line-height:1.4;
}
.cc-summary .woocommerce-shipping-destination{
  font-size:12.5px;
  color:var(--cc-ink-soft);
  margin:4px 0 0 !important;
  width:100%;
  text-align:left;
}
.cc-summary .shipping-calculator-button{
  font-size:12px;
  letter-spacing:.08em;
  color:var(--cc-ink-soft);
  border-bottom:1px solid var(--cc-rule-strong);
  text-decoration:none;
}
.cc-summary .shipping-calculator-button:hover{color:var(--cc-ink)}
.cc-summary .shipping-calculator-form{margin:12px 0 0;width:100%;display:block}
.woocommerce .cc-summary .shipping-calculator-form input,
.woocommerce .cc-summary .shipping-calculator-form select,
.woocommerce .cc-summary .shipping-calculator-form .select2-container .select2-selection--single{
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:10px 12px;
  height:auto;
  font-size:13.5px;
  margin:0 0 8px;
}
.woocommerce .cc-summary .shipping-calculator-form .button{
  width:100%;
  background:none;
  color:var(--cc-ink);
  border:1px solid var(--cc-rule-strong);
  line-height:38px;
  height:auto;
  font-size:11.5px;
  letter-spacing:.12em;
}

/* Proceed to checkout + keep shopping */
.cc-summary-actions{margin:20px 0 0;padding:0;max-width:none;display:flex;flex-direction:column;gap:10px}
.woocommerce .cc-summary-actions .checkout-button,
.woocommerce .cc-summary-actions a.button.alt{
  display:block;
  width:100%;
  box-sizing:border-box;
  text-align:center;
  background:var(--cc-ink);
  color:#fff;
  border:1px solid var(--cc-ink);
  border-radius:0;
  padding:15px 20px;
  height:auto;
  line-height:1.2;
  margin:0;
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.woocommerce .cc-summary-actions .checkout-button:hover{opacity:.86;background:var(--cc-ink);color:#fff}

/* Cross-sells ("Add a little something") */
.woocommerce-cart .cross-sells{
  width:100%;
  float:none;
  margin:56px 0 0;
  padding:32px 0 0;
  border-top:1px solid var(--cc-rule);
}
.woocommerce-cart .cross-sells > h2{
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
  text-align:left;
  margin:0 0 22px;
  padding:0;
  border:0;
}
.woocommerce-cart .cross-sells ul.products{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:20px;
  margin:0;
  padding:0;
}
.woocommerce-cart .cross-sells ul.products li.product{
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  float:none !important;
  clear:none !important;
  display:flex;
  flex-direction:column;
  gap:8px;
  height:100%;
}
/* The Add button is pushed to the bottom so every card's button aligns,
   no matter how many lines the product name wraps to. */
.woocommerce-cart .cross-sells ul.products li.product .add-to-cart-button-outer,
.woocommerce-cart .cross-sells ul.products li.product .button{
  display:block !important;
  margin-top:auto !important;
}
.woocommerce-cart .cross-sells ul.products li.product .button{
  width:100%;
  box-sizing:border-box;
  text-align:center;
  background:none;
  color:var(--cc-ink);
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  line-height:38px;
  height:auto;
  padding:0 10px;
  font-family:var(--cc-bold);
  font-size:11px;
  letter-spacing:.12em;
}
.woocommerce-cart .cross-sells ul.products li.product .button:hover{
  border-color:var(--cc-accent);
  color:var(--cc-accent-deep);
  background:none;
}
.woocommerce-cart .cross-sells ul.products li.product h6{margin:0;line-height:1.4}

/* Hide the old back link; the summary has Keep shopping now */
.woocommerce-cart .backtoprev_row{display:none}

/* ==========================================================================
   CHECKOUT
   ========================================================================== */

.cc-checkout-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 380px;
  gap:clamp(32px,5vw,72px);
  align-items:start;
  margin:0;
}
.cc-checkout-main{min-width:0}
.cc-checkout-side{
  min-width:0;
  position:sticky;
  top:120px;
}

/* Login prompt */
.cc-login-prompt{margin:0 0 26px}
.woocommerce .cc-login-toggle,
.woocommerce .cc-login-prompt .woocommerce-info{
  background:none;
  border:0;
  padding:0;
  margin:0;
  text-align:left;
  color:var(--cc-ink-soft);
  font-size:12.5px;
  letter-spacing:.02em;
}
.woocommerce .cc-login-prompt a.cc-showlogin{
  color:var(--cc-ink-soft);
  border-bottom:1px solid var(--cc-rule-strong);
  padding:0 0 1px;
  margin:0 0 0 4px;
  text-decoration:none;
  font-family:var(--cc-med);
  display:inline;
  border-top:0;border-left:0;border-right:0;
}
.woocommerce .cc-login-prompt a.cc-showlogin:hover{color:var(--cc-accent-deep);border-bottom-color:var(--cc-accent)}
.woocommerce .cc-login-prompt form.login{
  background:var(--cc-surface);
  border:0;
  border-radius:0;
  padding:18px;
  margin:12px 0 0;
}

/* Section headings */
.woocommerce-checkout .cc-checkout-main h3,
.woocommerce-checkout .cc-checkout-main .woocommerce-billing-fields > h3,
.woocommerce-checkout .cc-checkout-main .woocommerce-shipping-fields > h3,
.woocommerce-checkout .cc-checkout-main .woocommerce-additional-fields > h3{
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cc-ink);
  margin:0 0 20px;
  padding:0;
  border:0;
}
.woocommerce-checkout .cc-checkout-main .col2-set{width:100%;margin:0}
.woocommerce-checkout .cc-checkout-main .col2-set .col-1,
.woocommerce-checkout .cc-checkout-main .col2-set .col-2{
  width:100%;
  float:none;
  padding:0;
  margin:0;
}
.woocommerce-checkout .cc-checkout-main .col2-set .col-2{
  margin-top:30px;
  padding-top:30px;
  border-top:1px solid var(--cc-rule);
}

/* Form fields */
.woocommerce-checkout .cc-checkout-main .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .cc-checkout-main .woocommerce-shipping-fields__field-wrapper{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 14px;
}
.woocommerce-checkout .cc-checkout-main .form-row{
  width:100% !important;
  float:none !important;
  margin:0 0 14px !important;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.woocommerce-checkout .cc-checkout-main .form-row-wide,
.woocommerce-checkout .cc-checkout-main #billing_address_1_field,
.woocommerce-checkout .cc-checkout-main #billing_address_2_field,
.woocommerce-checkout .cc-checkout-main #billing_email_field,
.woocommerce-checkout .cc-checkout-main #shipping_address_1_field,
.woocommerce-checkout .cc-checkout-main #shipping_address_2_field,
.woocommerce-checkout .cc-checkout-main #order_comments_field{
  grid-column:1 / -1;
}
.woocommerce-checkout .cc-checkout-main .form-row label{
  font-family:var(--cc-med);
  font-size:11.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
  margin:0;
  line-height:1.3;
}
.woocommerce-checkout .cc-checkout-main .form-row label .required{color:var(--cc-accent-deep);border:0;text-decoration:none}
.woocommerce-checkout .cc-checkout-main .form-row .woocommerce-input-wrapper{width:100%}

.woocommerce-checkout .cc-checkout-main .form-row input.input-text,
.woocommerce-checkout .cc-checkout-main .form-row textarea,
.woocommerce-checkout .cc-checkout-main .form-row select,
.woocommerce-checkout .cc-checkout-main .select2-container .select2-selection--single{
  width:100%;
  box-sizing:border-box;
  background:var(--cc-paper);
  color:var(--cc-ink);
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:12px 13px;
  height:auto;
  min-height:46px;
  font-family:var(--cc-light);
  font-size:14px;
  line-height:1.4;
  margin:0;
  box-shadow:none;
}
.woocommerce-checkout .cc-checkout-main .form-row textarea{min-height:92px;resize:vertical}
.woocommerce-checkout .cc-checkout-main .form-row input.input-text:focus,
.woocommerce-checkout .cc-checkout-main .form-row textarea:focus,
.woocommerce-checkout .cc-checkout-main .form-row select:focus{
  outline:2px solid var(--cc-accent);
  outline-offset:-1px;
  border-color:var(--cc-accent);
}
.woocommerce-checkout .cc-checkout-main .select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height:22px;
  padding:0;
  color:var(--cc-ink);
}
.woocommerce-checkout .cc-checkout-main .select2-container--default .select2-selection--single .select2-selection__arrow{height:44px;right:8px}
.woocommerce-checkout .cc-checkout-main .form-row.woocommerce-invalid input.input-text,
.woocommerce-checkout .cc-checkout-main .form-row.woocommerce-invalid select{border-color:var(--cc-accent-deep)}

/* Checkbox rows (ship to different address, holiday notice, terms) */
.woocommerce-checkout .cc-checkout-main .woocommerce-shipping-fields h3#ship-to-different-address{
  display:flex;
  align-items:center;
  gap:10px;
}
.woocommerce-checkout .cc-checkout-main h3#ship-to-different-address label{
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin:0;
  cursor:pointer;
}
.woocommerce-checkout .cc-checkout-main input[type="checkbox"]{accent-color:var(--cc-accent-deep)}

/* Order review column */
.woocommerce-checkout .cc-checkout-side h3#order_review_heading{
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
  margin:0;
  padding:26px 26px 16px;
  background:var(--cc-surface);
  border-bottom:1px solid var(--cc-rule);
}
.woocommerce-checkout .cc-checkout-side #order_review{
  background:var(--cc-surface);
  padding:0 26px 28px;
}

/* Review order list */
.woocommerce-checkout .chelsea-checkout-revieworder table.shop_table{
  display:block;
  width:100%;
  margin:0;
  border-collapse:collapse;
}
.woocommerce-checkout .chelsea-checkout-revieworder table.shop_table thead{display:none}
.woocommerce-checkout .chelsea-checkout-revieworder table.shop_table tbody{display:block}
.woocommerce-checkout .chelsea-checkout-revieworder tbody tr.cart_item{
  display:flex;
  align-items:flex-start;
  gap:13px;
  padding:14px 0 !important;
  border-bottom:1px solid var(--cc-rule) !important;
  border-top:0 !important;
  border-left:0 !important;
  border-right:0 !important;
}
.woocommerce-checkout .chelsea-checkout-revieworder tbody tr.cart_item td{
  display:block;
  padding:0 !important;
  border:0 !important;
  text-align:left !important;
  text-transform:none !important;
  font-weight:normal !important;
}
.woocommerce-checkout .chelsea-checkout-revieworder tbody td.product-name{
  display:flex !important;
  gap:13px;
  flex:1;
  min-width:0;
  align-items:flex-start;
  font-size:inherit !important;
  line-height:inherit !important;
}
.woocommerce-checkout .chelsea-checkout-revieworder .cc-ro-thumb{flex:none;width:52px}
.woocommerce-checkout .chelsea-checkout-revieworder .cc-ro-thumb img{display:block;width:52px;height:auto}
.woocommerce-checkout .chelsea-checkout-revieworder .cc-ro-info{min-width:0;flex:1}
.woocommerce-checkout .chelsea-checkout-revieworder .cc-ro-name{
  display:block;
  font-family:var(--cc-bold);
  font-weight:normal;
  font-size:12.5px;
  letter-spacing:.05em;
  text-transform:uppercase;
  line-height:1.4;
}
.woocommerce-checkout .chelsea-checkout-revieworder .cc-ro-qty{
  display:block;
  font-family:var(--cc-light);
  font-size:12px;
  color:var(--cc-ink-soft);
  margin-top:2px;
  text-transform:none;
  letter-spacing:0;
}
.woocommerce-checkout .chelsea-checkout-revieworder .cc-ro-qty strong{font-weight:normal;font-family:var(--cc-med)}
.woocommerce-checkout .chelsea-checkout-revieworder td.product-total{
  font-size:13px !important;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
  padding-top:1px !important;
}
.woocommerce-checkout .chelsea-checkout-revieworder .cc-ro-price-mobile{display:none}

/* Add-on data inside the review list */
.woocommerce-checkout .chelsea-checkout-revieworder .chelsea_prdt_itemname .variation{
  margin:4px 0 0;
  font-size:11.5px;
  line-height:1.45;
  color:var(--cc-ink-soft);
}
.woocommerce-checkout .chelsea-checkout-revieworder .chelsea_prdt_itemname .variation dt{
  display:inline;
  width:auto !important;
  font-family:var(--cc-bold);
  font-weight:normal;
  padding:0 4px 0 0;
  float:none;
}
.woocommerce-checkout .chelsea-checkout-revieworder .chelsea_prdt_itemname .variation dd{
  display:inline;
  width:auto !important;
  margin:0;
  padding:0;
}
.woocommerce-checkout .chelsea-checkout-revieworder .chelsea_prdt_itemname .variation dd p{display:inline;margin:0 !important}
.woocommerce-checkout .chelsea-checkout-revieworder .chelsea_prdt_itemname .variation dd::after{content:'';display:block;height:3px}

/* Totals */
.woocommerce-checkout .chelsea-checkout-revieworder tfoot.cleasea_ordershub{display:block;margin-top:4px}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot tr{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:16px;
  padding:10px 0;
  border:0 !important;
}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot th{
  display:block;
  padding:0 !important;
  border:0 !important;
  background:none !important;
  text-align:left !important;
  font-family:var(--cc-med) !important;
  font-weight:normal !important;
  font-size:14px;
  color:var(--cc-ink) !important;
  text-transform:none;
  letter-spacing:0;
}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot th span{float:none !important;width:auto !important}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot td{
  display:block;
  padding:0 !important;
  border:0 !important;
  text-align:right !important;
  font-size:14px;
  font-variant-numeric:tabular-nums;
}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot tr.cart-subtotal th{padding-top:0 !important}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot tr.order-total{
  border-top:1px solid var(--cc-rule) !important;
  margin-top:8px;
  padding-top:16px;
}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot tr.order-total th{
  font-family:var(--cc-bold) !important;
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot tr.order-total td strong{
  font-family:var(--cc-med);
  font-weight:normal;
  font-size:22px;
}
.woocommerce-checkout .chelsea-checkout-revieworder tfoot td .includes_tax{
  display:block;
  font-size:12px !important;
  color:var(--cc-ink-soft);
  font-family:var(--cc-light) !important;
}
/* The old CSS faked a SHIPPING label with a ::after on an empty th. Not needed. */
.woocommerce-checkout .chelsea-checkout-revieworder .cleasea_ordershub .shipping th{font-size:14px}
.woocommerce-checkout .chelsea-checkout-revieworder .cleasea_ordershub .shipping th::after{content:none}
.woocommerce-checkout .chelsea-checkout-revieworder tr.woocommerce-shipping-totals{flex-wrap:wrap}
.woocommerce-checkout .chelsea-checkout-revieworder ul#shipping_method{
  list-style:none;margin:0;padding:0;width:100%;text-align:right;
}
.woocommerce-checkout .chelsea-checkout-revieworder ul#shipping_method li{
  display:flex;align-items:flex-start;justify-content:flex-end;gap:6px;
  margin:0 0 4px;font-size:13.5px;
}
.woocommerce-checkout .chelsea-checkout-revieworder ul#shipping_method li input{margin:5px 0 0}

/* Payment methods */
.woocommerce-checkout #payment{background:none;border-radius:0;margin-top:6px}
.woocommerce-checkout #payment ul.payment_methods{
  border:0;
  padding:18px 0 0;
  margin:0;
  list-style:none;
}
.woocommerce-checkout #payment ul.payment_methods li{
  border:1px solid var(--cc-rule-strong);
  background:var(--cc-paper);
  margin:0 0 10px;
  padding:0;
  list-style:none;
}
.woocommerce-checkout #payment ul.payment_methods li > label{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  margin:0;
  cursor:pointer;
  font-family:var(--cc-med);
  font-size:13.5px;
  letter-spacing:.03em;
}
.woocommerce-checkout #payment ul.payment_methods li > input[type="radio"]{
  margin:0 0 0 16px;
  float:left;
  position:static;
  accent-color:var(--cc-accent-deep);
}
.woocommerce-checkout #payment ul.payment_methods li label img{
  max-height:26px;
  width:auto;
  margin:0 0 0 auto;
  display:inline-block;
  float:none;
}
.woocommerce-checkout #payment div.payment_box{
  background:var(--cc-surface);
  border-top:1px solid var(--cc-rule);
  margin:0;
  padding:16px;
  font-size:13px;
  line-height:1.5;
  color:var(--cc-ink-soft);
  border-radius:0;
}
.woocommerce-checkout #payment div.payment_box::before{display:none}

/* Place order */
.woocommerce-checkout #payment .form-row.place-order{padding:18px 0 0;margin:0}
.woocommerce-checkout #payment .button#place_order{
  display:block;
  width:100%;
  float:none;
  box-sizing:border-box;
  text-align:center;
  background:var(--cc-ink);
  color:#fff;
  border:1px solid var(--cc-ink);
  border-radius:0;
  padding:16px 20px;
  height:auto;
  line-height:1.2;
  margin:0;
  font-family:var(--cc-bold);
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.woocommerce-checkout #payment .button#place_order:hover{opacity:.86;background:var(--cc-ink)}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{
  font-size:12.5px;
  color:var(--cc-ink-soft);
  line-height:1.5;
  margin:0 0 6px;
}

/* Holiday notice keeps its configured background; just tidy the box */
.woocommerce-checkout .checkout_holiday_message{
  margin:26px 0 0;
  padding:4px 14px;
}

/* AJAX loading state */
.woocommerce-checkout-review-order-table .blockUI.blockOverlay::after{
  font-family:var(--cc-bold);
  font-size:15px;
}

/* ==========================================================================
   FLYOUT CART
   ========================================================================== */

.cc-flyout.minicart_popup{
  background:var(--cc-paper);
  max-width:380px;
  padding:0;
  display:flex;
  flex-direction:column;
  box-shadow:-2px 0 40px rgba(20,17,15,.09);
}
.cc-flyout-hd{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:20px 22px 16px;
  border-bottom:1px solid var(--cc-rule);
  text-align:left;
  flex:none;
}
.cc-flyout-hd h2{
  font-family:var(--cc-bold);
  font-size:13px;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin:0;
  color:var(--cc-ink);
}
.cc-flyout-count{
  font-family:var(--cc-light);
  font-size:12px;
  color:var(--cc-ink-soft);
  letter-spacing:.04em;
  margin-left:8px;
  text-transform:none;
}
.cc-flyout .cc-flyout-x{
  position:static;
  padding:4px;
  line-height:0;
  opacity:.6;
}
.cc-flyout .cc-flyout-x:hover{opacity:1}
.cc-flyout .cc-flyout-x img{height:14px;width:auto}

.cc-flyout-body{
  flex:1;
  min-height:0;
  overflow-y:auto;
  padding:0 22px;
}
.cc-flyout .mc_popcnt{width:100%;margin:0}
.cc-flyout .widget_shopping_cart_content{width:100%}
.cc-flyout .widgettitle{display:none}

.cc-flyout .cc-mc-meter{margin:18px 0 4px;padding:13px 15px}
.cc-flyout .cc-mc-meter .cc-meter-text{font-size:12.5px;line-height:1.45}

.cc-flyout ul.cc-mclist{
  list-style:none;
  margin:0;
  padding:0;
  height:auto;
  overflow:visible;
}
.cc-flyout ul.cc-mclist li.woocommerce-mini-cart-item{
  display:grid;
  grid-template-columns:54px minmax(0,1fr) auto;
  gap:13px;
  align-items:start;
  padding:17px 0;
  border-bottom:1px solid var(--cc-rule);
  background:none;
  font-size:inherit;
}
.cc-flyout ul.cc-mclist li.woocommerce-mini-cart-item:last-child{border-bottom:0}
.cc-flyout ul.cc-mclist li:hover{background:none}
.cc-flyout .cc-mc-thumb{width:54px}
.cc-flyout .cc-mc-thumb img{
  display:block;
  width:54px;
  height:auto;
  float:none;
  margin:0;
  padding:0;
}
.cc-flyout .cc-mc-info{min-width:0}
.cc-flyout a.cc-mc-name{
  display:block;
  width:auto;
  padding:0;
  font-family:var(--cc-bold);
  font-size:12.5px;
  letter-spacing:.07em;
  text-transform:uppercase;
  line-height:1.4;
  color:var(--cc-ink);
  text-decoration:none;
}
.cc-flyout a.cc-mc-name:hover{color:var(--cc-accent-deep)}
.cc-flyout .cc-mc-meta{
  font-size:12px;
  color:var(--cc-ink-soft);
  line-height:1.45;
  margin-top:4px;
  display:block;
}
.cc-flyout .cc-mc-meta .variation{margin:0}
.cc-flyout .cc-mc-meta .variation dt{
  display:inline;
  float:none;
  width:auto;
  font-family:var(--cc-bold);
  font-weight:normal;
  padding:0 4px 0 0;
}
.cc-flyout .cc-mc-meta .variation dd{display:inline;margin:0;padding:0;width:auto}
.cc-flyout .cc-mc-meta .variation dd p{display:inline;margin:0 !important}
.cc-flyout .cc-mc-meta .variation dd::after{content:'';display:block;height:3px}
.cc-flyout .cc-mc-qty{
  display:block;
  width:auto;
  text-align:left;
  font-family:var(--cc-light);
  font-size:12.5px;
  color:var(--cc-ink-soft);
  margin-top:4px;
  font-variant-numeric:tabular-nums;
}
.cc-flyout .cc-mc-remove a.remove_from_cart_button{
  width:22px;
  height:22px;
  line-height:20px;
  background:none;
  color:var(--cc-rule-strong);
  font-size:17px;
  text-align:center;
  display:block;
  text-decoration:none;
}
.cc-flyout .cc-mc-remove a.remove_from_cart_button:hover{background:none;color:var(--cc-accent-deep)}

.cc-flyout p.cc-mc-total{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  text-align:left;
  text-transform:uppercase;
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.16em;
  color:var(--cc-ink);
  border-top:1px solid var(--cc-rule);
  margin:0 !important;
  padding:16px 0 4px;
}
.cc-flyout p.cc-mc-total strong{font-weight:normal}
.cc-flyout p.cc-mc-total .amount{
  font-family:var(--cc-med);
  font-size:20px;
  letter-spacing:0;
  text-transform:none;
  font-variant-numeric:tabular-nums;
}

.cc-flyout-ft{
  flex:none;
  border-top:1px solid var(--cc-rule);
  padding:18px 22px 22px;
  display:flex;
  flex-direction:column;
  gap:10px;
  text-align:center;
}
.cc-flyout-ft::before{
  content:'Excluding delivery costs if applicable';
  display:block;
  font-family:var(--cc-light);
  font-size:11.5px;
  color:var(--cc-ink-soft);
  text-align:left;
  margin-bottom:2px;
}
.cc-flyout .cc-flyout-link{
  display:block;
  background:none;
  color:var(--cc-ink-soft);
  font-family:var(--cc-med);
  font-size:11.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:6px 0 0;
  margin:0;
  text-decoration:none;
}
.cc-flyout .cc-flyout-link:hover{background:none;color:var(--cc-ink)}

.cc-mc-empty{padding:50px 0;text-align:center}
.cc-mc-empty-title{
  font-family:var(--cc-bold);
  font-size:13px;
  letter-spacing:.14em;
  text-transform:uppercase;
  margin:0 0 8px;
}
.cc-mc-empty-sub{font-size:13px;color:var(--cc-ink-soft);margin:0 0 22px;line-height:1.5}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width:1000px){
  .cc-cart-grid,
  .cc-checkout-grid{grid-template-columns:minmax(0,1fr);gap:40px}
  .cc-cart-side,
  .cc-checkout-side{position:static}
}

@media (max-width:767px){
  .cc-line{grid-template-columns:80px minmax(0,1fr);gap:16px;padding:20px 0}
  .cc-line-thumb,
  .cc-line-thumb img{width:80px}
  .cc-line-right{
    grid-column:2;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    width:100%;
    text-align:left;
    margin-top:12px;
  }
  .cc-line-right .cc-line-total{order:2}

  .woocommerce-checkout .cc-checkout-main .woocommerce-billing-fields__field-wrapper,
  .woocommerce-checkout .cc-checkout-main .woocommerce-shipping-fields__field-wrapper{
    grid-template-columns:1fr;
  }

  .woocommerce-checkout .cc-checkout-side h3#order_review_heading{padding:22px 18px 14px}
  .woocommerce-checkout .cc-checkout-side #order_review{padding:0 18px 22px}
  .cc-summary{padding:22px 18px 24px}

  .woocommerce-cart .cross-sells ul.products{grid-template-columns:1fr 1fr;gap:14px}
}

@media (max-width:420px){
  .cc-flyout.minicart_popup{max-width:100%}
  .cc-flyout-body{padding:0 16px}
  .cc-flyout-hd{padding:18px 16px 14px}
  .cc-flyout-ft{padding:16px 16px 20px}
}

/* ==========================================================================
   FIXES — round 2, 12 Oct 2026
   Added after seeing the design on the live site. Appended rather than edited
   in place so the cause of each override stays legible.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Button text was invisible (white on white).
   Cause: Qode's Custom CSS panel (not this theme's style.css) carries
          .woocommerce .button { color: #fff !important }
   That !important outranks any normal declaration, so these have to match it.
   -------------------------------------------------------------------------- */
.woocommerce .cc-cart-actions input.button,
.woocommerce .cc-promobar .cc-promobar-inner input.button,
.woocommerce .cc-promobar .cc-promobar-inner button.button,
.woocommerce-cart .cross-sells ul.products li.product .button,
.woocommerce .cc-summary .shipping-calculator-form .button,
.woocommerce .cc-btn-ghost{
  color:var(--cc-ink) !important;
}
.woocommerce .cc-cart-actions input.button{color:var(--cc-ink-soft) !important}
.woocommerce .cc-cart-actions input.button:hover,
.woocommerce .cc-promobar .cc-promobar-inner .button:hover,
.woocommerce-cart .cross-sells ul.products li.product .button:hover{
  color:var(--cc-accent-deep) !important;
}
/* Buttons that really are dark need the white back */
.woocommerce .cc-btn,
.woocommerce .cc-summary-actions .checkout-button,
.woocommerce-checkout #payment .button#place_order{
  color:#fff !important;
}
.woocommerce .cc-btn.cc-btn-ghost{color:var(--cc-ink) !important}

/* Update cart sits disabled until a quantity changes. Make that readable
   rather than looking like an empty box. */
.woocommerce .cc-cart-actions input.button:disabled,
.woocommerce .cc-cart-actions input.button[disabled]{
  opacity:1;
  color:var(--cc-rule-strong) !important;
  border-color:var(--cc-rule);
  cursor:default;
}

/* --------------------------------------------------------------------------
   2. Flyout cart thumbnails were not rendering.
   Cause: Bridge's woocommerce.min.css has
          .woocommerce .cart_list li a > img { display:none }
   which is more specific than .cc-flyout .cc-mc-thumb img.
   -------------------------------------------------------------------------- */
.woocommerce .cc-flyout .cart_list li a > img,
.woocommerce .cc-flyout .cc-mc-thumb a > img,
.cc-flyout .cc-mc-thumb img{
  display:block !important;
  width:54px !important;
  height:auto !important;
  max-width:54px;
  float:none;
  margin:0;
  padding:0;
}
.cc-flyout .cc-mc-thumb a{display:block;width:54px;line-height:0}

/* --------------------------------------------------------------------------
   3. Country dropdown overlapping the Street address label.
   Two causes, both fixed here:
   a) Bridge pins .woocommerce-checkout #billing_country_field to height:47px,
      which is shorter than label + 46px control, so the control overflowed.
   b) This stylesheet was also sizing select.select2-hidden-accessible — the
      native select that select2 hides and absolutely positions. Giving it a
      min-height made it paint over the field below.
   -------------------------------------------------------------------------- */
.woocommerce-checkout #billing_country_field,
.woocommerce-checkout #shipping_country_field,
.woocommerce-checkout #billing_state_field,
.woocommerce-checkout #shipping_state_field{
  height:auto !important;
}
.woocommerce-checkout .cc-checkout-main .form-row select.select2-hidden-accessible{
  min-height:0 !important;
  height:1px !important;
  padding:0 !important;
  border:0 !important;
}
.woocommerce-checkout .cc-checkout-main .select2-container{width:100% !important;display:block}
.woocommerce-checkout .cc-checkout-main .select2-container--default .select2-selection--single{
  height:46px;
  min-height:46px;
  display:flex;
  align-items:center;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:0 13px;
  background:var(--cc-paper);
}
.woocommerce-checkout .cc-checkout-main .select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height:1.4;
  padding:0;
  font-family:var(--cc-light);
  font-size:14px;
  color:var(--cc-ink);
}
.woocommerce-checkout .cc-checkout-main .select2-container--default .select2-selection--single .select2-selection__arrow{
  height:44px;
  right:8px;
  top:0;
}
.woocommerce-checkout .cc-checkout-main .select2-container--open .select2-selection--single{border-color:var(--cc-accent)}

/* --------------------------------------------------------------------------
   4. Payment method radios sat at the top of their row.
   The <li> was display:list-item with a floated radio.
   -------------------------------------------------------------------------- */
.woocommerce-checkout #payment ul.payment_methods li{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
}
.woocommerce-checkout #payment ul.payment_methods li > input[type="radio"]{
  float:none !important;
  flex:none;
  margin:0 0 0 16px !important;
  position:static !important;
  width:16px;
  height:16px;
}
.woocommerce-checkout #payment ul.payment_methods li > label{
  flex:1;
  min-width:0;
  padding:14px 16px 14px 10px;
}
.woocommerce-checkout #payment ul.payment_methods li > div.payment_box{
  flex-basis:100%;
  width:100%;
}

/* --------------------------------------------------------------------------
   5. Newsletter opt-in wrapped onto two lines.
   Checkbox rows need to be a row, not a column like every other field.
   -------------------------------------------------------------------------- */
.woocommerce-checkout .cc-checkout-main .form-row#kl_newsletter_checkbox_field,
.woocommerce-checkout .cc-checkout-main .form-row.create-account,
.woocommerce-checkout .cc-checkout-main .form-row:has(> label.checkbox),
.woocommerce-checkout .cc-checkout-main .form-row:has(input[type="checkbox"]){
  flex-direction:row;
  align-items:center;
  gap:9px;
  grid-column:1 / -1;
}
.woocommerce-checkout .cc-checkout-main .form-row#kl_newsletter_checkbox_field label,
.woocommerce-checkout .cc-checkout-main .form-row.create-account label,
.woocommerce-checkout .cc-checkout-main .form-row label.checkbox{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0;
  white-space:normal;
  line-height:1.3;
  cursor:pointer;
}
.woocommerce-checkout .cc-checkout-main .form-row input[type="checkbox"]{
  flex:none;
  margin:0;
  width:15px;
  height:15px;
}

/* --------------------------------------------------------------------------
   6. Promo / gift card bar above YOUR ORDER on checkout, matching the cart.
   It is hooked to woocommerce_checkout_before_order_review_heading, so it now
   renders above the grey panel and needs the panel's rounding removed from it.
   -------------------------------------------------------------------------- */
.woocommerce-checkout .cc-checkout-side .cc-promobar{
  margin:0 0 12px;
  background:var(--cc-paper);
}
.woocommerce-checkout .cc-checkout-side .cc-promobar form.checkout_coupon{
  margin:0;
  border:0;
  padding:14px 16px;
  background:none;
  display:flex;
  gap:8px;
}
.woocommerce-checkout .cc-checkout-side .cc-promobar form.checkout_coupon .form-row{
  margin:0 !important;
  padding:0;
  width:auto !important;
}

/* PW Gift Cards redeem box, wherever it lands, styled to match */
.woocommerce-checkout .wctb_item,
.woocommerce-checkout .checkout_pw_gift_card{
  width:100%;
  max-width:none;
  margin:0 0 12px;
  text-align:left;
  display:block;
}
.woocommerce-checkout .cc-checkout-side .checkout_pw_gift_card{
  border:1px solid var(--cc-rule-strong);
  background:var(--cc-paper);
  padding:14px 16px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-start;
}
.woocommerce-checkout .cc-checkout-side .checkout_pw_gift_card div{display:flex;gap:8px;width:100%}
.woocommerce-page.woocommerce-checkout .cc-checkout-side #pwgc-redeem-gift-card-number{
  width:auto;
  flex:1;
  min-width:0;
}

/* --------------------------------------------------------------------------
   7. Login prompt pinned to the Billing details heading row, matching the
   mockup. It is hooked to woocommerce_checkout_before_customer_details, so it
   is the first element in the left column.
   -------------------------------------------------------------------------- */
.cc-checkout-main{position:relative}
.woocommerce-checkout .cc-checkout-main > .cc-login-prompt{
  position:absolute;
  top:0;
  right:0;
  margin:0;
  max-width:60%;
  text-align:right;
  z-index:2;
}
.woocommerce-checkout .cc-checkout-main > .cc-login-prompt form.login{
  text-align:left;
  min-width:280px;
}
@media (max-width:767px){
  .woocommerce-checkout .cc-checkout-main > .cc-login-prompt{
    position:static;
    max-width:none;
    text-align:left;
    margin:0 0 20px;
  }
}

/* ==========================================================================
   FIXES — round 3, 12 Oct 2026
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Gap between the page heading and the content.
   Two sources stacked: .shop_cat_title .container has 40px top and bottom
   padding, and the VC row below it adds 50px more. 118px of air in total.
   -------------------------------------------------------------------------- */
.woocommerce-cart .shop_cat_title .container,
.woocommerce-checkout .shop_cat_title .container{
  padding-top:28px;
  padding-bottom:12px;
}
.woocommerce-cart .vc_row.grid_section,
.woocommerce-checkout .vc_row.grid_section{
  padding-top:14px !important;
}

/* --------------------------------------------------------------------------
   2. Update cart button, matched to the promo bar's Apply button.
   -------------------------------------------------------------------------- */
.woocommerce .cc-cart-actions input.button{
  color:var(--cc-ink) !important;
  border:1px solid var(--cc-rule-strong);
  background:none;
}
.woocommerce .cc-cart-actions input.button:hover{
  border-color:var(--cc-accent);
  color:var(--cc-accent-deep) !important;
  background:none;
}
.woocommerce .cc-cart-actions input.button:disabled,
.woocommerce .cc-cart-actions input.button[disabled]{
  opacity:1;
  color:var(--cc-ink-soft) !important;
  border-color:var(--cc-rule);
  cursor:default;
}

/* --------------------------------------------------------------------------
   3. Dropdown arrows, vertically centred.
   select2 positions its own <b> with top:50%;margin-top:-2px inside a 44px
   box sitting in a 46px control, which lands it high. Rather than patch that
   arithmetic, the arrow is drawn as a centred background chevron on the
   control itself, which is then identical on select2 and native selects.
   -------------------------------------------------------------------------- */
.woocommerce-checkout .cc-checkout-main .select2-container--default .select2-selection--single,
.woocommerce-checkout .cc-checkout-main .form-row select:not(.select2-hidden-accessible),
.woocommerce .cc-summary .shipping-calculator-form select:not(.select2-hidden-accessible),
.woocommerce .cc-shipcalc .shipping-calculator-form select:not(.select2-hidden-accessible),
.woocommerce .cc-shipcalc .select2-container--default .select2-selection--single{
  -webkit-appearance:none;
  appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236b6560' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 13px center;
  background-size:13px 13px;
  padding-right:36px;
}
.woocommerce-checkout .cc-checkout-main .select2-container--default .select2-selection--single .select2-selection__arrow,
.woocommerce .cc-shipcalc .select2-container--default .select2-selection--single .select2-selection__arrow{
  display:none !important;
}

/* --------------------------------------------------------------------------
   4. Login prompt no longer overlaps the form.
   Round 2 made the whole .cc-login-prompt absolute, so the expanded login
   form was lifted out of the flow and painted over the billing fields.
   Now only the one-line toggle is absolute; the form itself flows normally.
   -------------------------------------------------------------------------- */
.woocommerce-checkout .cc-checkout-main > .cc-login-prompt{
  position:static;
  max-width:none;
  margin:0;
}
.woocommerce-checkout .cc-checkout-main > .cc-login-prompt > .cc-login-toggle{
  position:absolute;
  top:0;
  right:0;
  width:auto;
  max-width:58%;
  text-align:right;
  margin:0;
  z-index:2;
}
.woocommerce-checkout .cc-checkout-main > .cc-login-prompt > form.login{
  position:static;
  display:block;
  width:100%;
  margin:0 0 26px;
  padding:20px;
  background:var(--cc-surface);
  border:0;
  text-align:left;
}
.woocommerce-checkout .cc-login-prompt form.login .form-row{margin:0 0 12px !important}
.woocommerce-checkout .cc-login-prompt form.login .form-row-first,
.woocommerce-checkout .cc-login-prompt form.login .form-row-last{width:100%;float:none}
.woocommerce-checkout .cc-login-prompt form.login .woocommerce-form-login__submit{
  background:var(--cc-ink);
  color:#fff !important;
  border:1px solid var(--cc-ink);
  border-radius:0;
  padding:0 26px;
  line-height:42px;
  height:auto;
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.14em;
}
.woocommerce-checkout .cc-login-prompt form.login .woocommerce-form-login__rememberme{
  margin:0 0 0 14px !important;
  font-size:12px;
}
.woocommerce-checkout .cc-login-prompt form.login .lost_password{font-size:12.5px;margin:10px 0 0}
@media (max-width:767px){
  .woocommerce-checkout .cc-checkout-main > .cc-login-prompt > .cc-login-toggle{
    position:static;
    max-width:none;
    text-align:left;
    margin:0 0 16px;
  }
}

/* --------------------------------------------------------------------------
   5. Checkout promo bar.
   The visible bar is now plain markup printed by cc_render_checkout_promobar();
   WooCommerce's real coupon form is hidden and driven by JS. See note 4 in
   functions-additions.php for why.
   -------------------------------------------------------------------------- */
.woocommerce-checkout .cc-native-coupon{
  position:absolute !important;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle{display:none}
.woocommerce-checkout .cc-checkout-side .cc-promobar .cc-promobar-inner{
  display:flex;
  gap:8px;
  padding:14px 16px;
}
.woocommerce-checkout .cc-checkout-side .cc-promobar input[type="text"]{
  flex:1;
  min-width:0;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:11px 13px;
  font-family:var(--cc-light);
  font-size:14px;
  background:var(--cc-paper);
  color:var(--cc-ink);
  margin:0;
}
.woocommerce-checkout .cc-checkout-side .cc-promobar button.cc-promo-apply{
  background:none;
  color:var(--cc-ink) !important;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:0 18px;
  height:auto;
  line-height:40px;
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:nowrap;
  cursor:pointer;
}
.woocommerce-checkout .cc-checkout-side .cc-promobar button.cc-promo-apply:hover{
  border-color:var(--cc-accent);
  color:var(--cc-accent-deep) !important;
}
.cc-promo-msg{
  margin:0 !important;
  padding:0 16px 14px;
  font-size:12.5px;
  color:var(--cc-accent-deep);
  line-height:1.4;
}
.cc-promo-msg:empty{display:none}

/* --------------------------------------------------------------------------
   6. Review-invitation checkbox, matched to the newsletter one.
   It lives in the order summary column, outside .cc-checkout-main, so the
   round 2 accent rule never reached it.
   -------------------------------------------------------------------------- */
.woocommerce-checkout input[type="checkbox"],
.woocommerce-checkout .cc-checkout-side input[type="checkbox"],
.woocommerce-checkout #cr_customer_consent{
  accent-color:var(--cc-accent-deep);
}
.woocommerce-checkout .cc-checkout-side label:has(> #cr_customer_consent),
.woocommerce-checkout .cc-checkout-side .woocommerce-form__label-for-checkbox{
  display:flex;
  align-items:flex-start;
  gap:9px;
  font-size:13px;
  line-height:1.4;
  margin:14px 0;
  cursor:pointer;
}
.woocommerce-checkout .cc-checkout-side .woocommerce-form__label-for-checkbox input[type="checkbox"]{
  flex:none;
  margin:2px 0 0;
  width:15px;
  height:15px;
}

/* --------------------------------------------------------------------------
   7. Shipping calculator, now under the cart line items.
   -------------------------------------------------------------------------- */
.cc-shipcalc{
  margin:26px 0 0;
  padding:22px 0 0;
  border-top:1px solid var(--cc-rule);
}
.cc-shipcalc .shipping-calculator-button{display:none}
.cc-shipcalc .shipping-calculator-form{
  display:block !important;
  margin:0;
  max-width:420px;
}
.cc-shipcalc .shipping-calculator-form::before{
  content:'Estimate delivery';
  display:block;
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
  margin:0 0 16px;
}
.woocommerce .cc-shipcalc .shipping-calculator-form p{margin:0 0 10px !important}
.woocommerce .cc-shipcalc .shipping-calculator-form input,
.woocommerce .cc-shipcalc .shipping-calculator-form select,
.woocommerce .cc-shipcalc .select2-container .select2-selection--single{
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:12px 13px;
  height:46px;
  min-height:46px;
  font-family:var(--cc-light);
  font-size:14px;
  background-color:var(--cc-paper);
  color:var(--cc-ink);
  display:flex;
  align-items:center;
}
.woocommerce .cc-shipcalc .select2-container{width:100% !important}
.woocommerce .cc-shipcalc .shipping-calculator-form .button{
  width:auto;
  background:none;
  color:var(--cc-ink) !important;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  line-height:40px;
  height:auto;
  padding:0 24px;
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.12em;
}
.woocommerce .cc-shipcalc .shipping-calculator-form .button:hover{
  border-color:var(--cc-accent);
  color:var(--cc-accent-deep) !important;
}
/* Nothing should render a calculator inside the summary any more, but belt
   and braces in case a plugin re-adds one. */
.cc-summary .shipping-calculator-form,
.cc-summary .shipping-calculator-button{display:none !important}

/* --------------------------------------------------------------------------
   8. Flyout header: keep the item count on the title line.
   footer.php rewrites #mini-cart-count to "(N ITEMS)" after every cart
   update, so the span is styled to sit inline whatever it is given.
   -------------------------------------------------------------------------- */
.cc-flyout-hd h2{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.cc-flyout .cc-flyout-count{
  display:inline;
  margin:0;
  font-family:var(--cc-light);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--cc-ink-soft);
  text-transform:none;
}

/* ==========================================================================
   FIXES — round 4, 12 Oct 2026
   ========================================================================== */

/* --------------------------------------------------------------------------
   Login accordion.
   Round 3's absolute-positioned prompt is gone. The login form is back
   outside <form name="checkout"> (see form-login.php for why) and is now a
   native <details>, styled to match the promo bar and sized to the left
   column so it does not run under the order summary.
   -------------------------------------------------------------------------- */

/* Neutralise the round-3 rules; .cc-login-prompt no longer exists. */
.woocommerce-checkout .cc-checkout-main > .cc-login-prompt,
.woocommerce-checkout .cc-checkout-main > .cc-login-prompt > .cc-login-toggle{
  position:static;
}

.woocommerce-checkout .cc-login-acc{
  display:block;
  max-width:calc(100% - 380px - clamp(32px, 5vw, 72px));
  margin:0 0 22px;
  border:1px solid var(--cc-rule-strong);
  background:var(--cc-paper);
}
.woocommerce-checkout .cc-login-acc:hover{border-color:var(--cc-ink)}
.woocommerce-checkout .cc-login-acc > summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px 16px;
  cursor:pointer;
  list-style:none;
  font-size:13px;
  color:var(--cc-ink-soft);
}
.woocommerce-checkout .cc-login-acc > summary::-webkit-details-marker{display:none}
.woocommerce-checkout .cc-login-acc > summary::after{
  content:'+';
  font-size:15px;
  line-height:1;
  color:var(--cc-ink-soft);
  margin-left:auto;
}
.woocommerce-checkout .cc-login-acc[open] > summary::after{content:'\2013'}
.woocommerce-checkout .cc-login-acc[open] > summary{border-bottom:1px solid var(--cc-rule)}
.woocommerce-checkout .cc-login-acc .cc-login-acc-cta{
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cc-ink);
}
.woocommerce-checkout .cc-login-acc:hover .cc-login-acc-cta{color:var(--cc-accent-deep)}
.woocommerce-checkout .cc-login-acc-body{padding:18px 16px 20px}

/* The login form itself, inside the accordion */
.woocommerce-checkout .cc-login-acc form.login{
  display:block !important;
  border:0;
  border-radius:0;
  padding:0;
  margin:0;
  background:none;
  max-width:440px;
}
.woocommerce-checkout .cc-login-acc form.login > p:first-of-type{
  font-size:12.5px;
  color:var(--cc-ink-soft);
  line-height:1.5;
  margin:0 0 16px !important;
}
.woocommerce-checkout .cc-login-acc form.login .form-row{
  width:100% !important;
  float:none !important;
  margin:0 0 12px !important;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.woocommerce-checkout .cc-login-acc form.login label{
  font-family:var(--cc-med);
  font-size:11.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
  margin:0;
}
.woocommerce .cc-login-acc form.login input.input-text,
.woocommerce .cc-login-acc form.login input[type="text"],
.woocommerce .cc-login-acc form.login input[type="password"]{
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:12px 13px;
  height:46px;
  font-family:var(--cc-light);
  font-size:14px;
  background:var(--cc-paper);
  color:var(--cc-ink);
  margin:0;
}
.woocommerce .cc-login-acc form.login .form-row:last-of-type,
.woocommerce .cc-login-acc form.login p.form-row:has(button){
  flex-direction:row;
  align-items:center;
  flex-wrap:wrap;
  gap:14px;
}
.woocommerce .cc-login-acc form.login button.woocommerce-form-login__submit,
.woocommerce .cc-login-acc form.login button[name="login"]{
  background:var(--cc-ink);
  color:#fff !important;
  border:1px solid var(--cc-ink);
  border-radius:0;
  padding:0 28px;
  line-height:44px;
  height:auto;
  margin:0;
  float:none;
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.woocommerce .cc-login-acc form.login button.woocommerce-form-login__submit:hover{opacity:.86}
.woocommerce .cc-login-acc form.login .woocommerce-form-login__rememberme{
  margin:0 !important;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12.5px;
  text-transform:none;
  letter-spacing:0;
  color:var(--cc-ink-soft);
}
.woocommerce .cc-login-acc form.login .woocommerce-form-login__rememberme input{margin:0;width:15px;height:15px}
.woocommerce .cc-login-acc form.login .lost_password{
  margin:12px 0 0 !important;
  font-size:12.5px;
  width:100%;
}
.woocommerce .cc-login-acc form.login .lost_password a{
  color:var(--cc-ink-soft);
  border-bottom:1px solid var(--cc-rule-strong);
  text-decoration:none;
}
.woocommerce .cc-login-acc form.login .lost_password a:hover{color:var(--cc-accent-deep)}

@media (max-width:1000px){
  .woocommerce-checkout .cc-login-acc{max-width:none}
}

/* --------------------------------------------------------------------------
   Shipping calculator: visible for guests with no address on file too.
   -------------------------------------------------------------------------- */
.cc-shipcalc .shipping-calculator-form{display:block !important}
.cc-shipcalc:empty{display:none}

/* ==========================================================================
   FIXES — round 5, 12 Oct 2026
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Full width cart and checkout.
   Qode's .grid_section pins .section_inner to a fixed 1100px and centres it
   with a left margin. Your style.css already does this for the homepage
   (.home .grid_section .section_inner). Same treatment here.
   -------------------------------------------------------------------------- */
.woocommerce-cart .grid_section .section_inner,
.woocommerce-checkout .grid_section .section_inner{
  width:100%;
  margin-left:0;
  margin-right:0;
}
.woocommerce-cart .grid_section .section_inner_margin,
.woocommerce-checkout .grid_section .section_inner_margin{margin-left:0;margin-right:0}
.woocommerce-cart .content .container .container_inner,
.woocommerce-checkout .content .container .container_inner{
  max-width:1600px;
  margin:0 auto;
  padding-left:40px;
  padding-right:40px;
}
@media (max-width:900px){
  .woocommerce-cart .content .container .container_inner,
  .woocommerce-checkout .content .container .container_inner{padding-left:18px;padding-right:18px}
}

/* --------------------------------------------------------------------------
   2. Flyout buttons: tighter, and View / edit cart above Proceed to checkout.
   The order swap is in header.php; this is just the spacing.
   -------------------------------------------------------------------------- */
.cc-flyout-ft{gap:7px;padding:16px 22px 20px}
.cc-flyout-ft .cc-btn{padding:13px 20px;margin:0}
.cc-flyout .cc-flyout-link{padding:4px 0 0}
.cc-flyout-ft::before{margin-bottom:0}

/* --------------------------------------------------------------------------
   3. Cart thumbnails back to the 4:5 portrait of the original uploads.
   The PHP now requests woocommerce_thumbnail (600x750 on this store) instead
   of woocommerce_gallery_thumbnail (100x100, hard cropped square). The
   aspect-ratio box below is a belt-and-braces guard so a stray square image
   still sits in a portrait frame rather than distorting the row.
   -------------------------------------------------------------------------- */
.cc-line-thumb,
.cc-line-thumb a{display:block;width:96px}
.cc-line-thumb img{
  display:block;
  width:96px;
  height:auto;
  aspect-ratio:4 / 5;
  object-fit:cover;
  object-position:center;
}
@media (max-width:767px){
  .cc-line-thumb,.cc-line-thumb a,.cc-line-thumb img{width:80px}
}
/* Same ratio in the checkout order summary and the flyout */
.woocommerce-checkout .chelsea-checkout-revieworder .cc-ro-thumb img{
  aspect-ratio:4 / 5;
  object-fit:cover;
}
.cc-flyout .cc-mc-thumb img{
  aspect-ratio:4 / 5;
  object-fit:cover;
  height:auto !important;
}

/* --------------------------------------------------------------------------
   4. Shipping calculator: same width as the product list above it.
   -------------------------------------------------------------------------- */
.cc-shipcalc .shipping-calculator-form{max-width:none}
.cc-shipcalc .woocommerce-shipping-calculator{max-width:none}
.cc-shipcalc .shipping-calculator-form p{max-width:none}
.cc-shipcalc-fields{display:block}
/* Country / state / postcode across one row on desktop */
.woocommerce .cc-shipcalc .shipping-calculator-form{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
  align-items:end;
}
.woocommerce .cc-shipcalc .shipping-calculator-form::before{grid-column:1 / -1}
.woocommerce .cc-shipcalc .shipping-calculator-form p{margin:0 !important}
.woocommerce .cc-shipcalc .shipping-calculator-form p:last-of-type{grid-column:1 / -1}
.woocommerce .cc-shipcalc .shipping-calculator-form .button{width:auto}
@media (max-width:700px){
  .woocommerce .cc-shipcalc .shipping-calculator-form{grid-template-columns:1fr}
}

/* --------------------------------------------------------------------------
   5. Login: underlined link on the heading row, panel under the email field.
   The real WooCommerce login form is visually hidden (it has to live outside
   <form name="checkout">). .cc-no-js keeps it visible if the script fails.
   -------------------------------------------------------------------------- */
.woocommerce-checkout .cc-native-login:not(.cc-no-js){
  position:absolute !important;
  width:1px;height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.woocommerce-checkout .cc-native-login.cc-no-js{
  margin:0 0 22px;
  padding:18px;
  background:var(--cc-surface);
  max-width:440px;
}

.woocommerce-checkout .cc-login-linewrap{
  position:absolute;
  top:0;
  right:0;
  margin:0 !important;
  font-size:13px;
  color:var(--cc-ink-soft);
  z-index:2;
  line-height:1.4;
}
.woocommerce-checkout a.cc-login-link{
  color:var(--cc-ink-soft);
  text-decoration:none;
  border-bottom:1px solid var(--cc-rule-strong);
  padding-bottom:1px;
  margin-left:4px;
  font-family:var(--cc-med);
}
.woocommerce-checkout a.cc-login-link:hover{color:var(--cc-accent-deep);border-bottom-color:var(--cc-accent)}

/* The panel that opens under the email field */
.woocommerce-checkout .cc-login-panel{
  background:var(--cc-surface);
  padding:18px;
  margin:0 0 16px;
  grid-column:1 / -1;
}
.woocommerce-checkout .cc-login-panel-label{margin:0 0 6px !important}
.woocommerce-checkout .cc-login-panel-label label{
  font-family:var(--cc-med);
  font-size:11.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--cc-ink-soft);
}
.woocommerce-checkout .cc-login-panel-row{display:flex;gap:10px;align-items:stretch}
.woocommerce .cc-login-panel-row input[type="password"]{
  flex:1;
  min-width:0;
  box-sizing:border-box;
  border:1px solid var(--cc-rule-strong);
  border-radius:0;
  padding:12px 13px;
  height:46px;
  font-family:var(--cc-light);
  font-size:14px;
  background:var(--cc-paper);
  color:var(--cc-ink);
  margin:0;
}
.woocommerce .cc-login-panel-row button.cc-login-go{
  flex:none;
  background:var(--cc-ink);
  color:#fff !important;
  border:1px solid var(--cc-ink);
  border-radius:0;
  padding:0 26px;
  height:46px;
  line-height:44px;
  margin:0;
  font-family:var(--cc-bold);
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  cursor:pointer;
}
.woocommerce .cc-login-panel-row button.cc-login-go:hover{opacity:.86}
.woocommerce-checkout .cc-login-panel-help{
  margin:12px 0 0 !important;
  font-size:12.5px;
  color:var(--cc-ink-soft);
  line-height:1.5;
}
.woocommerce-checkout .cc-login-panel-help a{
  color:var(--cc-ink-soft);
  border-bottom:1px solid var(--cc-rule-strong);
  text-decoration:none;
}
.woocommerce-checkout .cc-login-panel-help a:hover{color:var(--cc-accent-deep)}
.cc-login-err{
  margin:10px 0 0 !important;
  font-size:12.5px;
  color:var(--cc-accent-deep);
}
.cc-login-err:empty{display:none}

/* Email field sits first and reads as its own step */
.woocommerce-checkout .cc-checkout-main .cc-email-row{
  grid-column:1 / -1;
  padding-bottom:22px;
  margin-bottom:22px !important;
  border-bottom:1px solid var(--cc-rule);
}
.woocommerce-checkout .cc-checkout-main .cc-email-row:has(+ .cc-login-panel:not([hidden])){
  padding-bottom:12px;
  border-bottom:0;
  margin-bottom:12px !important;
}

/* ==========================================================================
   FIXES — round 6, 12 Oct 2026 (mobile)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Mobile side padding on cart and checkout: 30px, once.
   The gutter was being set in three places at once — Qode's .container_inner,
   WPBakery's .vc_column-inner (15px) and .section_inner_margin's negative
   margin — which compounded to roughly 58px. Now one rule owns it.
   -------------------------------------------------------------------------- */
@media (max-width:900px){
  .woocommerce-cart .content .container .container_inner,
  .woocommerce-checkout .content .container .container_inner{
    padding-left:30px !important;
    padding-right:30px !important;
  }
  .woocommerce-cart .vc_column-inner,
  .woocommerce-checkout .vc_column-inner{padding-left:0 !important;padding-right:0 !important}
  .woocommerce-cart .section_inner_margin,
  .woocommerce-checkout .section_inner_margin{margin-left:0 !important;margin-right:0 !important}
  .woocommerce-cart .grid_section .section_inner,
  .woocommerce-checkout .grid_section .section_inner{
    width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:0;
    padding-right:0;
  }
  .woocommerce-cart .wpb_column,
  .woocommerce-checkout .wpb_column{padding-left:0;padding-right:0}
}

/* --------------------------------------------------------------------------
   2. Flyout cart: content was running off the right edge on phones.
   The 420px breakpoint missed larger phones (a 16 Pro Max reports 430px), so
   the panel kept its 380px desktop width with desktop padding and the
   subtotal clipped. Sized against the viewport now, with the breakpoint
   raised so every phone gets the tighter padding.
   -------------------------------------------------------------------------- */
.cc-flyout.minicart_popup{
  box-sizing:border-box;
  width:100%;
  max-width:min(380px, calc(100vw - 20px));
  overflow-x:hidden;
}
.cc-flyout *{box-sizing:border-box}
.cc-flyout-body,
.cc-flyout-hd,
.cc-flyout-ft{box-sizing:border-box;max-width:100%}
.cc-flyout p.cc-mc-total{padding-right:0;gap:10px;flex-wrap:wrap}
.cc-flyout p.cc-mc-total .amount{white-space:nowrap}

@media (max-width:767px){
  .cc-flyout.minicart_popup{max-width:min(400px, calc(100vw - 16px))}
  .cc-flyout-hd{padding:18px 18px 14px}
  .cc-flyout-body{padding:0 18px}
  .cc-flyout-ft{padding:14px 18px 20px}
  .cc-flyout ul.cc-mclist li.woocommerce-mini-cart-item{
    grid-template-columns:48px minmax(0,1fr) 22px;
    gap:11px;
  }
  .cc-flyout .cc-mc-thumb,
  .cc-flyout .cc-mc-thumb img{width:48px !important}
  .cc-flyout a.cc-mc-name{font-size:12px;letter-spacing:.05em}
  .cc-flyout .cc-mc-meter .cc-meter-text{font-size:12px}
}

/* --------------------------------------------------------------------------
   3. Stray rule above the Update cart button.
   WooCommerce's own stylesheet decorates .actions, which is a table-cell
   class. The div no longer carries it (see cart.php), and these two cover
   anything else that tries to draw on that row.
   -------------------------------------------------------------------------- */
.cc-cart-actions{border:0 !important;background:none}
.cc-cart-actions::before,
.cc-cart-actions::after{content:none !important;display:none !important}
.woocommerce .cc-cart-main .cc-lines li.cc-line:last-child{border-bottom:1px solid var(--cc-rule)}

/* --------------------------------------------------------------------------
   4. Quantity changes update the totals on their own.
   The Update cart button is hidden only once the script has run, so it is
   still there and still works with JavaScript off.
   -------------------------------------------------------------------------- */
.cc-cart-actions.cc-auto{padding:0;height:0;overflow:hidden}
.cc-cart-actions.cc-auto input.button{
  position:absolute;
  width:1px;height:1px;
  overflow:hidden;
  clip-path:inset(50%);
}

.cc-cart-main.cc-pending .cc-lines,
.cc-cart-main.cc-updating .cc-lines{transition:opacity .15s ease}
.cc-cart-main.cc-updating{position:relative;pointer-events:none}
.cc-cart-main.cc-updating .cc-lines{opacity:.45}
.cc-cart-main.cc-updating::after{
  content:'Updating your cart\2026';
  position:absolute;
  top:120px;
  left:50%;
  transform:translateX(-50%);
  background:var(--cc-ink);
  color:#fff;
  font-family:var(--cc-bold);
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  padding:11px 20px;
  white-space:nowrap;
  z-index:5;
}
/* While the debounce is still counting down, just dim the line totals so the
   number on screen is not mistaken for the new one. */
.cc-cart-main.cc-pending:not(.cc-updating) .cc-line-total{opacity:.4}
@media (prefers-reduced-motion:reduce){
  .cc-cart-main .cc-lines{transition:none}
}

/* ==========================================================================
   FIXES — round 7, 12 October 2026
   Every rule below was measured on the live site first. The measurements are
   in the comments so the next person does not have to repeat them.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Side gutters. The previous rule targeted
      .woocommerce-cart .content .container .container_inner
   and that element does not exist on these pages. Cart and Checkout use the
   full-width page template, so the real chain is

      .content > .content_inner > .full_width > .full_width_inner
              > .wpb-content-wrapper > .vc_row.grid_section > ...

   Measured: .cc-cart-grid was 1786px wide inside a 1786px viewport, i.e. no
   gutter whatsoever, because .vc_row.grid_section carries margin:-15px which
   exactly cancelled .vc_column-inner's 15px padding. One element owns the
   gutter now and the inner WPBakery boxes are neutralised so nothing adds to
   or subtracts from it.
   -------------------------------------------------------------------------- */
.woocommerce-cart .full_width_inner > .wpb-content-wrapper,
.woocommerce-checkout .full_width_inner > .wpb-content-wrapper{
  box-sizing:border-box;
  max-width:1680px;
  margin-left:auto;
  margin-right:auto;
  padding-left:clamp(30px,3.4vw,60px);
  padding-right:clamp(30px,3.4vw,60px);
}
.woocommerce-cart .wpb-content-wrapper .vc_row.grid_section,
.woocommerce-checkout .wpb-content-wrapper .vc_row.grid_section,
.woocommerce-cart .wpb-content-wrapper .vc_row-fluid,
.woocommerce-checkout .wpb-content-wrapper .vc_row-fluid{
  margin-left:0 !important;
  margin-right:0 !important;
}
.woocommerce-cart .wpb-content-wrapper .vc_column-inner,
.woocommerce-checkout .wpb-content-wrapper .vc_column-inner{
  padding-left:0 !important;
  padding-right:0 !important;
}
.woocommerce-cart .wpb-content-wrapper .wpb_column,
.woocommerce-checkout .wpb-content-wrapper .wpb_column{
  padding-left:0;
  padding-right:0;
}

/* --------------------------------------------------------------------------
   2. Two thirds / one third.
   Only above the stacking breakpoint (1000px); below that both columns are
   already full width and stacked.
   -------------------------------------------------------------------------- */
@media (min-width:1001px){
  .cc-cart-grid,
  .cc-checkout-grid{
    grid-template-columns:minmax(0,2fr) minmax(0,1fr);
  }
}

/* --------------------------------------------------------------------------
   3. Shipping calculator spacing. This was my bug, and a plain one.
   Round 5 made the form a three column grid with gap:12px, but two earlier
   rules set `display:block !important` on the same element and !important
   wins regardless of source order. Measured on the live cart: computed
   display was `block`, so the gap did nothing, while the companion rule
   `p{margin:0 !important}` had already stripped every field's own margin.
   Result: fields flush against each other. The grid now carries !important
   of its own.
   -------------------------------------------------------------------------- */
.woocommerce .cc-shipcalc .shipping-calculator-form{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px 14px;
  align-items:end;
  max-width:none;
}
.woocommerce .cc-shipcalc .shipping-calculator-form::before{
  grid-column:1 / -1;
  margin:0;
}
.woocommerce .cc-shipcalc .shipping-calculator-form > p{
  margin:0 !important;
  padding:0 !important;
  min-width:0;
}
.woocommerce .cc-shipcalc .shipping-calculator-form > p:last-of-type{
  grid-column:1 / -1;
  margin-top:2px !important;
}
.woocommerce .cc-shipcalc .shipping-calculator-form input[type="hidden"]{
  display:none !important;
}
@media (max-width:700px){
  .woocommerce .cc-shipcalc .shipping-calculator-form{
    grid-template-columns:1fr;
    gap:14px;
  }
}

/* --------------------------------------------------------------------------
   4. Postcode text aligned with the dropdown text above it.
   Measured: the select2 control had padding-left:13px (mine) and select2's
   own .select2-selection__rendered added another 20px on top, putting the
   country and state text at 33px while the postcode input's text sat at 13px.
   The checkout's billing dropdowns already have this zeroed, which is why
   they lined up and these did not. Same treatment here.
   -------------------------------------------------------------------------- */
.woocommerce .cc-shipcalc .select2-container--default .select2-selection--single .select2-selection__rendered{
  padding-left:0 !important;
  padding-right:0 !important;
  line-height:1.2;
  color:var(--cc-ink);
}
.woocommerce .cc-shipcalc .select2-container--default .select2-selection--single .select2-selection__placeholder{
  color:var(--cc-ink-soft);
}
.woocommerce .cc-shipcalc .shipping-calculator-form input#calc_shipping_postcode{
  padding-left:13px;
  padding-right:13px;
}

/* --------------------------------------------------------------------------
   5. The raw WooCommerce login form no longer flashes at the top of checkout.
   It has to render outside <form name="checkout"> (nested forms are discarded
   by the parser), so it sits where WooCommerce puts it and is hidden. The old
   version started visible and was hidden by script on DOM ready — which, with
   a two to three second response time, meant an unstyled login box sat at the
   top of the page for a second or more on every visit. It is hidden from the
   first paint now; form-login.php carries a <noscript> block that puts it
   back for browsers with scripting switched off.
   -------------------------------------------------------------------------- */
.woocommerce-checkout .cc-native-login{
  position:absolute !important;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  margin:0;
  padding:0;
}

/* The no-script fallback, styled so it is usable if it ever does show. */
.woocommerce-checkout .cc-native-login-visible{
  position:static !important;
  width:auto;
  height:auto;
  overflow:visible;
  clip-path:none;
  white-space:normal;
  margin:0 0 24px;
  padding:20px;
  background:var(--cc-surface);
  max-width:460px;
}
.woocommerce .cc-native-login-visible form.login button[name="login"]{
  background-color:var(--cc-ink) !important;
  color:#fff !important;
  border:1px solid var(--cc-ink);
  border-radius:0;
  padding:0 30px;
  height:46px;
  line-height:44px;
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
}

/* --------------------------------------------------------------------------
   6. The Log in button, matching the primary button in the rest of the
   design (12px / .18em / ink). Disabled until both the email above and the
   password are filled in, so the state is visible rather than only enforced
   on click.
   -------------------------------------------------------------------------- */
.woocommerce .cc-login-panel-row button.cc-login-go{
  flex:none;
  background-color:var(--cc-ink) !important;
  color:#fff !important;
  border:1px solid var(--cc-ink);
  border-radius:0;
  padding:0 30px;
  height:46px;
  line-height:44px;
  margin:0;
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  cursor:pointer;
  transition:opacity .15s ease;
}
.woocommerce .cc-login-panel-row button.cc-login-go:hover:not(:disabled){
  opacity:.86;
  background-color:var(--cc-ink) !important;
  color:#fff !important;
}
.woocommerce .cc-login-panel-row button.cc-login-go:disabled,
.woocommerce .cc-login-panel-row button.cc-login-go[disabled]{
  background-color:transparent !important;
  color:var(--cc-ink-soft) !important;
  border-color:var(--cc-rule-strong);
  cursor:not-allowed;
  opacity:1;
}

/* The panel itself, directly under the email row. Script keeps it there
   after every AJAX refresh; see functions.php. */
.woocommerce-checkout .cc-checkout-main .cc-login-panel{
  grid-column:1 / -1;
  margin:0 0 20px;
}
.woocommerce-checkout .cc-login-panel[hidden]{display:none}
@media (max-width:480px){
  .woocommerce-checkout .cc-login-panel-row{flex-direction:column}
  .woocommerce .cc-login-panel-row button.cc-login-go{width:100%}
}

/* ==========================================================================
   FIXES — round 8, 12 October 2026
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Breathing room under the CHECKOUT / CART page title.
   Measured: the content wrapper started 14px below the title block.
   -------------------------------------------------------------------------- */
.woocommerce-cart .full_width_inner > .wpb-content-wrapper,
.woocommerce-checkout .full_width_inner > .wpb-content-wrapper{
  padding-top:46px;
}
@media (max-width:767px){
  .woocommerce-cart .full_width_inner > .wpb-content-wrapper,
  .woocommerce-checkout .full_width_inner > .wpb-content-wrapper{
    padding-top:28px;
  }
}

/* --------------------------------------------------------------------------
   2. The LOG IN button.
   What you were looking at was the disabled state, which round 7 drew as a
   pale outline — so it read as an unstyled button rather than a deliberate
   one. It is the same dark button in both states now; disabled is simply
   faded, which reads as "not yet" instead of "broken".
   -------------------------------------------------------------------------- */
.woocommerce .cc-login-panel-row button.cc-login-go,
.woocommerce .cc-login-panel-row button.cc-login-go:disabled,
.woocommerce .cc-login-panel-row button.cc-login-go[disabled]{
  flex:none;
  background-color:var(--cc-ink) !important;
  background-image:none !important;
  color:#fff !important;
  border:1px solid var(--cc-ink) !important;
  border-radius:0;
  padding:0 30px;
  height:46px;
  line-height:44px;
  margin:0;
  font-family:var(--cc-bold);
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  transition:opacity .15s ease;
}
.woocommerce .cc-login-panel-row button.cc-login-go:disabled,
.woocommerce .cc-login-panel-row button.cc-login-go[disabled]{
  opacity:.32;
  cursor:not-allowed;
}
.woocommerce .cc-login-panel-row button.cc-login-go:not(:disabled){cursor:pointer}
.woocommerce .cc-login-panel-row button.cc-login-go:hover:not(:disabled){opacity:.86}

/* --------------------------------------------------------------------------
   3. Flyout cart footer: three actions, one height.
   Measured: the first two were 42px, Continue shopping was 30px. Bridge was
   also winning the background colour on the ghost button with its own
   .mini_cartbtn rule, so all three are pinned explicitly here rather than
   left to inheritance.
   -------------------------------------------------------------------------- */
.minicart_popup.cc-flyout .cc-flyout-ft a.mini_cartbtn,
.minicart_popup.cc-flyout .cc-flyout-ft a.backtoshop{
  display:block;
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  padding:15px 20px !important;
  margin:0 !important;
  text-align:center;
  font-family:var(--cc-bold);
  font-size:12px;
  line-height:16px;
  letter-spacing:.18em;
  text-transform:uppercase;
  text-decoration:none;
  border-radius:0;
  transition:opacity .15s ease;
}
.minicart_popup.cc-flyout .cc-flyout-ft a.mini_cartbtn.cc-btn:not(.cc-btn-ghost){
  background-color:var(--cc-ink) !important;
  color:#fff !important;
  border:1px solid var(--cc-ink) !important;
}
.minicart_popup.cc-flyout .cc-flyout-ft a.mini_cartbtn.cc-btn.cc-btn-ghost{
  background-color:#fff !important;
  color:var(--cc-ink) !important;
  border:1px solid var(--cc-rule-strong) !important;
}
.minicart_popup.cc-flyout .cc-flyout-ft a.backtoshop.cc-flyout-link{
  background-color:var(--cc-surface) !important;
  color:var(--cc-ink-soft) !important;
  border:1px solid transparent !important;
}
.minicart_popup.cc-flyout .cc-flyout-ft a.mini_cartbtn:hover{opacity:.86}
.minicart_popup.cc-flyout .cc-flyout-ft a.backtoshop.cc-flyout-link:hover{
  color:var(--cc-ink) !important;
  border-color:var(--cc-rule-strong) !important;
}

/* --------------------------------------------------------------------------
   4. One rule between the products and the delivery estimate, not two.
   The list already closes itself with a border on the last item; the
   calculator was drawing a second one on top.
   -------------------------------------------------------------------------- */
.cc-shipcalc{
  border-top:0 !important;
  margin-top:32px;
  padding-top:0;
}

/* --------------------------------------------------------------------------
   5. Postcode sitting 4px high.
   Measured: select2's control carries margin-bottom:-4px, so it hangs below
   its own paragraph. The paragraphs were 42px (country, state) against 46px
   (postcode), and the grid was bottom-aligning the paragraphs, not the
   controls. Zeroing that margin makes all three paragraphs 46px.
   -------------------------------------------------------------------------- */
.woocommerce .cc-shipcalc .select2-container,
.woocommerce .cc-shipcalc .select2-container--default .select2-selection--single{
  margin:0 !important;
}
.woocommerce .cc-shipcalc .shipping-calculator-form > p.form-row{
  display:flex;
  align-items:flex-end;
  min-height:46px;
}
.woocommerce .cc-shipcalc .shipping-calculator-form > p.form-row > *{
  width:100%;
  margin:0;
}

/* --------------------------------------------------------------------------
   6. Place order: a visible busy state, and missing fields flagged in place.
   -------------------------------------------------------------------------- */
.woocommerce-checkout #payment .button#place_order.cc-busy{
  opacity:.65;
  cursor:progress;
  pointer-events:none;
}
.woocommerce-checkout form.checkout .cc-field-error{
  display:block;
  margin:7px 0 0;
  font-family:var(--cc-med);
  font-size:12.5px;
  line-height:1.4;
  color:var(--cc-accent-deep);
}
.woocommerce-checkout form.checkout .form-row.cc-invalid input.input-text,
.woocommerce-checkout form.checkout .form-row.cc-invalid input[type="text"],
.woocommerce-checkout form.checkout .form-row.cc-invalid input[type="tel"],
.woocommerce-checkout form.checkout .form-row.cc-invalid input[type="email"],
.woocommerce-checkout form.checkout .form-row.cc-invalid textarea,
.woocommerce-checkout form.checkout .form-row.cc-invalid select,
.woocommerce-checkout form.checkout .form-row.cc-invalid .select2-selection--single{
  border-color:var(--cc-accent-deep) !important;
  background-color:#fdf7f7 !important;
}
.woocommerce-checkout form.checkout .form-row.cc-invalid label{
  color:var(--cc-accent-deep);
}