/* WooCommerce in the Rooted Essence look: checkout, order confirmation, my account, notices.
   The basket page and basket drawer are the theme's own and are styled in main.css. */

.woocommerce,.woocommerce-page{--wc-line:var(--hairline)}

/* ---------- Buttons ---------- */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,
.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order,.wc-block-components-button{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:10px;
  background:var(--navy);color:var(--paper);border:1px solid var(--navy);font:500 14px/1 var(--body);letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;cursor:pointer;transition:background .25s,color .25s;float:none;margin:0}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover,.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce input.button.alt:hover,.woocommerce #payment #place_order:hover{
  background:#25213a;border-color:#25213a;color:var(--paper)}
.woocommerce a.button:focus-visible,.woocommerce button.button:focus-visible,.woocommerce #payment #place_order:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.woocommerce button.button:disabled,.woocommerce button.button:disabled[disabled],.woocommerce button.button.disabled,.woocommerce a.button.disabled{
  background:var(--navy);color:var(--paper);opacity:.5;padding:0 24px}
.woocommerce #payment #place_order,.woocommerce-page #payment #place_order{width:100%;min-height:56px;float:none}

/* ---------- Notices ---------- */
.woocommerce-message,.woocommerce-info,.woocommerce-error,.woocommerce-notice,.wc-block-components-notice-banner{
  margin:0 0 28px;padding:16px 20px;border:1px solid var(--hairline);border-left:3px solid var(--navy);border-radius:10px;background:var(--surface-2);
  color:var(--ink);font-size:15.5px;line-height:1.55;list-style:none}
.woocommerce-message::before,.woocommerce-info::before,.woocommerce-error::before{display:none}
.woocommerce-message{border-left-color:var(--forest)}
.woocommerce-error{border-left-color:#a3352b}
.woocommerce-error li{margin:0}.woocommerce-error li+li{margin-top:6px}
.woocommerce-message .button,.woocommerce-info .button,.woocommerce-error .button{float:right;min-height:36px;padding:0 14px;margin:-6px 0 -6px 16px;font-size:12px}
.woocommerce-info a,.woocommerce-message a{text-underline-offset:4px}

/* ---------- Form fields ---------- */
.woocommerce form .form-row{padding:0;margin:0 0 18px}
.woocommerce form .form-row label,.woocommerce-page form .form-row label{display:block;font:500 12px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px;color:var(--ink)}
.woocommerce form .form-row label.checkbox,.woocommerce form .form-row label.woocommerce-form__label-for-checkbox,
.woocommerce form .form-row .woocommerce-form__label-for-checkbox{font:400 15.5px/1.5 var(--body);letter-spacing:0;text-transform:none;display:block;position:relative;padding-left:32px;margin:0}
.woocommerce form .form-row .woocommerce-form__label-for-checkbox input[type="checkbox"]{position:absolute;left:0;top:1px;margin:0}
.woocommerce form .form-row .required{color:#a3352b;text-decoration:none}
.woocommerce form .form-row .optional{font-weight:400;letter-spacing:.02em;text-transform:none;color:var(--ink-soft)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,.woocommerce-page form .form-row textarea,.woocommerce form input.input-text,
.woocommerce .select2-container .select2-selection--single{
  width:100%;min-height:52px;padding:14px 18px;border-radius:var(--r-md);border:1px solid var(--hairline);background:var(--surface);color:var(--ink);
  font:400 16px/1.4 var(--body);box-shadow:none;margin:0;-webkit-appearance:none;appearance:none}
.woocommerce form .form-row textarea{min-height:120px;resize:vertical}
.woocommerce form .form-row input.input-text:focus,.woocommerce form .form-row textarea:focus,.woocommerce form .form-row select:focus,
.woocommerce .select2-container--focus .select2-selection--single,.woocommerce .select2-container--open .select2-selection--single{outline:2px solid var(--gold);outline-offset:1px}
.woocommerce form .form-row.woocommerce-invalid input.input-text,.woocommerce form .form-row.woocommerce-invalid select,
.woocommerce form .form-row.woocommerce-invalid .select2-selection{border-color:#a3352b}
.woocommerce form .form-row.woocommerce-validated input.input-text,.woocommerce form .form-row.woocommerce-validated select{border-color:var(--hairline)}
.woocommerce form .form-row input[type="checkbox"],.woocommerce form .form-row input[type="radio"],.woocommerce #payment input[type="radio"],
.woocommerce #shipping_method input[type="radio"],.woocommerce-checkout h3 input[type="checkbox"]{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:var(--navy)}
.woocommerce .select2-container .select2-selection--single{display:flex;align-items:center;height:52px;padding:0 44px 0 18px}
.woocommerce .select2-container .select2-selection--single .select2-selection__rendered{padding:0;line-height:1.4;color:var(--ink)}
.woocommerce .select2-container .select2-selection--single .select2-selection__arrow{top:0;right:12px;height:52px}
.select2-dropdown{border:1px solid var(--hairline);border-radius:var(--r-md);overflow:hidden;font:400 16px/1.4 var(--body)}
.select2-container--default .select2-results__option{padding:10px 18px}
.select2-container--default .select2-results__option--highlighted[aria-selected],.select2-container--default .select2-results__option--highlighted[data-selected]{background:var(--navy);color:var(--paper)}
.select2-container--default .select2-search--dropdown .select2-search__field{min-height:44px;padding:8px 14px;border:1px solid var(--hairline);border-radius:8px;font:inherit}

/* ---------- Checkout layout: details left, order and payment right ---------- */
.woocommerce-checkout .woocommerce-form-coupon-toggle,.woocommerce-checkout .woocommerce-form-login-toggle{max-width:none}
.woocommerce form.checkout_coupon,.woocommerce form.login,.woocommerce form.register{border:1px solid var(--hairline);border-radius:10px;padding:24px;margin:0 0 28px}
.woocommerce form.checkout_coupon .form-row{float:none;width:auto;display:inline-block;vertical-align:top;margin:0 12px 0 0}
.woocommerce form.login .form-row,.woocommerce form.register .form-row{width:100%}
.woocommerce form.checkout_coupon p:first-child{margin-bottom:16px}

@media (min-width:901px){
  .woocommerce form.checkout{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(32px,6vw,96px);align-items:start}
  .woocommerce form.checkout>.woocommerce-NoticeGroup,.woocommerce form.checkout>.woocommerce-error{grid-column:1/-1;grid-row:1}
  .woocommerce form.checkout #customer_details{grid-column:1;grid-row:2/span 3}
  .woocommerce form.checkout #order_review_heading{grid-column:2;grid-row:2}
  .woocommerce form.checkout #order_review{grid-column:2;grid-row:3}
}
.woocommerce form.checkout #customer_details.col2-set,.woocommerce-page form.checkout #customer_details.col2-set{width:auto;float:none}
.woocommerce form.checkout .col2-set .col-1,.woocommerce form.checkout .col2-set .col-2,
.woocommerce-page form.checkout .col2-set .col-1,.woocommerce-page form.checkout .col2-set .col-2{float:none;width:auto;max-width:none}
.woocommerce form.checkout .col2-set .col-2{margin-top:clamp(28px,3vw,40px);padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--hairline)}
.woocommerce form.checkout .col2-set .col-2:empty{display:none}
.woocommerce-billing-fields>h3,.woocommerce-shipping-fields>h3,.woocommerce-additional-fields>h3,#order_review_heading,
.woocommerce-checkout h3#ship-to-different-address{font:400 clamp(24px,2.4vw,30px)/1.2 var(--display);margin:0 0 22px;float:none;width:auto}
.woocommerce-checkout h3#ship-to-different-address label{font:inherit;letter-spacing:0;text-transform:none;display:flex;gap:12px;align-items:center;margin:0}
/* Field rows: half-width pairs side by side, everything else full width. Laid out here so it does not depend on WooCommerce's own floats. */
.woocommerce-billing-fields__field-wrapper,.woocommerce-shipping-fields__field-wrapper,.woocommerce-additional-fields__field-wrapper,.woocommerce-address-fields__field-wrapper{display:flex;flex-wrap:wrap;column-gap:16px}
.woocommerce form .form-row,.woocommerce-page form .form-row{float:none;width:100%;flex:1 1 100%}
.woocommerce form .form-row-first,.woocommerce form .form-row-last,.woocommerce-page form .form-row-first,.woocommerce-page form .form-row-last{float:none;width:auto;flex:1 1 calc(50% - 8px);min-width:200px}
.woocommerce form.checkout_coupon .form-row,.woocommerce form.login .form-row,.woocommerce form.register .form-row{flex:none}

/* Order summary card */
.woocommerce form.checkout #order_review_heading{margin-bottom:0;padding:clamp(20px,2.4vw,32px) clamp(20px,2.4vw,32px) 8px;border:1px solid var(--hairline);border-bottom:0;border-radius:10px 10px 0 0;background:var(--surface)}
.woocommerce form.checkout #order_review{padding:0 clamp(20px,2.4vw,32px) clamp(20px,2.4vw,32px);border:1px solid var(--hairline);border-top:0;border-radius:0 0 10px 10px;background:var(--surface)}
@media (max-width:900px){.woocommerce form.checkout #order_review_heading{margin-top:36px}}

/* ---------- Tables (order review, order details, my account) ---------- */
.woocommerce table.shop_table{border:0;border-radius:0;margin:0 0 24px;border-collapse:collapse;width:100%;font-size:15.5px}
.woocommerce table.shop_table th,.woocommerce table.shop_table td{border:0;border-bottom:1px solid var(--hairline);padding:12px 0;text-align:left;vertical-align:baseline;line-height:1.5;background:none}
.woocommerce table.shop_table thead th{font:500 12px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.woocommerce table.shop_table th:last-child,.woocommerce table.shop_table td:last-child{text-align:right;padding-left:16px}
.woocommerce table.shop_table tfoot th{font-weight:400;color:var(--ink-soft)}
.woocommerce table.shop_table tfoot td{font-weight:400}
.woocommerce table.shop_table tfoot tr.order-total th{font:500 12px/1.3 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.woocommerce table.shop_table tfoot tr.order-total td{font-size:26px;line-height:1.1}
.woocommerce table.shop_table tfoot tr.order-total th,.woocommerce table.shop_table tfoot tr.order-total td{border-bottom:0;border-top:1px solid var(--ink);padding-top:18px}
.woocommerce table.shop_table .product-quantity{color:var(--ink-soft);font-weight:400}
.woocommerce table.shop_table a{text-underline-offset:4px}
/* Delivery choices get the full width of the card, under their heading. */
.woocommerce table.shop_table tr.shipping th,.woocommerce table.shop_table tr.shipping td,.woocommerce table.shop_table tr.woocommerce-shipping-totals th,.woocommerce table.shop_table tr.woocommerce-shipping-totals td{display:block;text-align:left;padding-left:0}
.woocommerce table.shop_table tr.woocommerce-shipping-totals th{width:100%;border-bottom:0;padding-bottom:4px;font:500 12px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.woocommerce table.shop_table tr.woocommerce-shipping-totals td{padding-top:4px;width:100%}
.woocommerce table.shop_table td.product-name{width:62%}
.woocommerce table.shop_table tfoot tr.order-total td strong{font-weight:400}
.woocommerce ul#shipping_method{margin:0;padding:0;list-style:none}
/* each delivery option: radio on the left, everything a plugin adds (logo, name, price, terminal list) in one column beside it */
.woocommerce ul#shipping_method li{display:grid;grid-template-columns:20px minmax(0,1fr);column-gap:14px;row-gap:6px;align-items:start;margin:0;padding:14px 0;border-top:1px solid var(--hairline);text-indent:0}
.woocommerce ul#shipping_method li:first-child{border-top:0;padding-top:6px}
.woocommerce ul#shipping_method li>input[type="radio"],.woocommerce ul#shipping_method li>input[type="hidden"]{grid-column:1;grid-row:1;align-self:start;margin-top:2px}
.woocommerce ul#shipping_method li>*:not(input){grid-column:2;min-width:0}
.woocommerce ul#shipping_method li label{display:block;font:inherit;letter-spacing:0;text-transform:none;margin:0;cursor:pointer;line-height:1.45}
.woocommerce ul#shipping_method li img{display:block;height:24px;width:auto;max-width:120px;object-fit:contain;object-position:left center;margin:0 0 6px}
.woocommerce .woocommerce-Price-amount{font-variant-numeric:tabular-nums lining-nums}

/* ---------- Payment ---------- */
.woocommerce-checkout #payment,.woocommerce #payment{background:none;border-radius:0}
.woocommerce-checkout #payment ul.payment_methods,.woocommerce #payment ul.payment_methods{padding:0;margin:0 0 20px;border:0;list-style:none}
.woocommerce-checkout #payment ul.payment_methods li,.woocommerce #payment ul.payment_methods li{padding:16px 18px;margin:0 0 10px;border:1px solid var(--hairline);border-radius:10px;line-height:1.5;list-style:none}
.woocommerce #payment ul.payment_methods li:has(input:checked){border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.woocommerce #payment ul.payment_methods li>label{display:inline;font:400 16px/1.5 var(--body);letter-spacing:0;text-transform:none;margin:0 0 0 8px;cursor:pointer}
.woocommerce #payment ul.payment_methods li img{max-height:28px;width:auto;vertical-align:middle;margin:0 0 0 8px;float:none}
.woocommerce-checkout #payment div.payment_box,.woocommerce #payment div.payment_box{background:var(--surface-2);color:var(--ink);border-radius:8px;margin:14px 0 0;padding:16px;font-size:15px;line-height:1.55}
.woocommerce-checkout #payment div.payment_box::before,.woocommerce #payment div.payment_box::before{display:none}
.woocommerce #payment div.payment_box select{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--hairline);border-radius:8px;background:var(--surface);font:400 16px/1.4 var(--body)}
.woocommerce-checkout #payment div.form-row,.woocommerce #payment div.form-row{padding:0;margin:0}
.woocommerce #payment .place-order{padding:0;margin:0}
.woocommerce-terms-and-conditions-wrapper{margin:0 0 20px;font-size:15px;line-height:1.55;color:var(--ink-soft)}
.woocommerce-terms-and-conditions-wrapper .form-row{margin:14px 0 0}
.woocommerce-terms-and-conditions-wrapper a,.woocommerce-privacy-policy-text a{color:var(--ink);text-underline-offset:4px}
.woocommerce-privacy-policy-text p{margin:0}

/* ---------- Order received ---------- */
.woocommerce-order>p.woocommerce-thankyou-order-received,.woocommerce-order>.woocommerce-notice{font:400 clamp(24px,2.4vw,30px)/1.3 var(--display);border:0;background:none;padding:0;margin:0 0 28px}
.woocommerce ul.order_details{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:0;margin:0 0 40px;padding:0;list-style:none;border:1px solid var(--hairline);border-radius:10px}
.woocommerce ul.order_details li{float:none;margin:0;padding:18px 20px;border:0;border-right:1px solid var(--hairline);font:500 11.5px/1.5 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.woocommerce ul.order_details li:last-child{border-right:0}
.woocommerce ul.order_details li strong{display:block;margin-top:6px;font:400 17px/1.4 var(--body);letter-spacing:0;text-transform:none;color:var(--ink);overflow-wrap:anywhere}
@media (max-width:700px){.woocommerce ul.order_details li{border-right:0;border-bottom:1px solid var(--hairline)}.woocommerce ul.order_details li:last-child{border-bottom:0}}
.woocommerce-order-details__title,.woocommerce-column__title,.woocommerce-order h2,.woocommerce-MyAccount-content h2,.woocommerce-MyAccount-content h3,.woocommerce h2{font:400 clamp(24px,2.4vw,30px)/1.2 var(--display);margin:0 0 18px}
.woocommerce .woocommerce-customer-details{margin-top:40px}
.woocommerce .woocommerce-customer-details address{border:1px solid var(--hairline);border-radius:10px;padding:20px;font-style:normal;line-height:1.6}
.woocommerce .col2-set.addresses{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
.woocommerce .col2-set.addresses .col-1,.woocommerce .col2-set.addresses .col-2{float:none;width:auto}
.woocommerce .col2-set.addresses::before,.woocommerce .col2-set.addresses::after{display:none}

/* ---------- My account ---------- */
@media (min-width:901px){.woocommerce-account .woocommerce{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:start}.woocommerce-account .woocommerce>.woocommerce-notices-wrapper{grid-column:1/-1}}
.woocommerce-account .woocommerce-MyAccount-navigation,.woocommerce-account .woocommerce-MyAccount-content{float:none;width:auto}
.woocommerce-MyAccount-navigation ul{list-style:none;margin:0 0 28px;padding:0;border-top:1px solid var(--hairline)}
.woocommerce-MyAccount-navigation li{border-bottom:1px solid var(--hairline)}
.woocommerce-MyAccount-navigation a{display:block;padding:14px 0;text-decoration:none;font:500 12px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase}
.woocommerce-MyAccount-navigation li.is-active a{color:var(--purple)}
.woocommerce-account:not(.logged-in) .woocommerce{display:block;max-width:560px}

/* WooCommerce's own basket template, if a page ever uses it. */
.woocommerce .cart_totals h2{font:400 clamp(24px,2.4vw,30px)/1.2 var(--display)}
.woocommerce .quantity .qty{display:inline-block;width:76px;min-height:48px;padding:8px;border:1px solid var(--hairline);border-radius:10px;text-align:center;font:400 16px/1 var(--body)}

/* ---------- Stripe ----------
   The card fields are inside Stripe's secure frame and are styled from PHP (re_stripe_appearance in inc/woocommerce.php).
   Here: only the containers around them, so the frame sits cleanly in the payment card. */
.woocommerce-checkout #payment ul.payment_methods li.payment_method_stripe div.payment_box,
.woocommerce #payment ul.payment_methods li[class*="payment_method_stripe"] div.payment_box{background:none;padding:14px 0 0;margin:10px 0 0}
.woocommerce #payment fieldset[id^="wc-stripe"]{border:0;margin:0;padding:0;min-width:0}
.woocommerce #payment [class*="wc-stripe-upe-element"]{margin:0;padding:0}
.woocommerce #payment li[class*="payment_method_stripe"]>label img{max-height:24px}
/* Express checkout (Apple Pay / Google Pay / Link) above the form, with its "or" divider */
.woocommerce-checkout [id^="wc-stripe-express-checkout"]{margin-bottom:12px}
.woocommerce-checkout [id$="checkout-button-separator"]{align-items:center;gap:16px;margin:12px 0 28px;font-size:14px;color:var(--ink-soft);text-align:center}
.woocommerce-checkout [id$="checkout-button-separator"]::before,.woocommerce-checkout [id$="checkout-button-separator"]::after{content:"";flex:1;height:1px;background:var(--hairline)}
.woocommerce-checkout [id$="checkout-button-separator"][style*="block"]{display:flex!important}

/* ---------- Pickup points ----------
   UK: Sendcloud adds a "Select service point" button under its Service Point Delivery method and opens its own picker.
   LT (later): MultiParcels adds a terminal dropdown (select2, styled above with the other selects).
   Plugin markup is not documented, so these rules stay general: anything a plugin puts inside a shipping-method row. */
.woocommerce ul#shipping_method li button,.woocommerce ul#shipping_method li .button,.woocommerce ul#shipping_method li input[type="button"]{
  flex-basis:auto;margin:6px 0 4px;min-height:40px;padding:0 16px;border:1px solid var(--ink);border-radius:10px;background:transparent;color:var(--ink);
  font:500 12px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.woocommerce ul#shipping_method li button:hover,.woocommerce ul#shipping_method li .button:hover,.woocommerce ul#shipping_method li input[type="button"]:hover{background:var(--ink);color:var(--paper)}
.woocommerce ul#shipping_method li select,.woocommerce ul#shipping_method li .select2-container{flex-basis:100%;margin:6px 0 4px;max-width:100%}
.woocommerce ul#shipping_method li select{min-height:48px;padding:10px 14px;border:1px solid var(--hairline);border-radius:10px;background:var(--surface);font:400 15px/1.4 var(--body)}
.woocommerce ul#shipping_method li p,.woocommerce ul#shipping_method li small,.woocommerce ul#shipping_method li [class*="service-point"]{flex-basis:100%;margin:4px 0 0;font-size:14px;line-height:1.5;color:var(--ink-soft)}

/* Order summary at checkout: rows laid out as flex lines (not table cells), so the delivery row can span the full width */
.woocommerce table.woocommerce-checkout-review-order-table,.woocommerce table.woocommerce-checkout-review-order-table thead,.woocommerce table.woocommerce-checkout-review-order-table tbody,.woocommerce table.woocommerce-checkout-review-order-table tfoot{display:block;width:100%}
.woocommerce table.woocommerce-checkout-review-order-table tr{display:flex;justify-content:space-between;align-items:baseline;gap:16px;width:100%}
.woocommerce table.woocommerce-checkout-review-order-table tr>th:first-child,.woocommerce table.woocommerce-checkout-review-order-table tr>td:first-child{flex:1 1 auto;min-width:0}
.woocommerce table.woocommerce-checkout-review-order-table tr>:last-child:not(:first-child){flex:none;text-align:right}
.woocommerce table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals{display:block}
.woocommerce table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals>*{display:block;width:100%;text-align:left}
.woocommerce table.woocommerce-checkout-review-order-table tr>th,.woocommerce table.woocommerce-checkout-review-order-table tr>td{border-top:0;border-bottom:0}
.woocommerce table.woocommerce-checkout-review-order-table tr{border-bottom:1px solid var(--hairline)}
.woocommerce table.woocommerce-checkout-review-order-table tfoot tr.order-total{border-bottom:0;border-top:1px solid var(--ink)}
.woocommerce ul#shipping_method,.woocommerce ul#shipping_method li,.woocommerce ul#shipping_method li label{text-align:left}
.woocommerce table.woocommerce-checkout-review-order-table tfoot tr.order-total>th,.woocommerce table.woocommerce-checkout-review-order-table tfoot tr.order-total>td{border-top:0}
