/* tf-ordering checkout (stage 2): the order form as four step cards. Ported from the prototype's shared/app.css
   (.co-*, .step-card, .choice, .day, .slot, .inp, .summary ...). Same rules as app.css: tfo- prefix, scoped, because
   Storefront and the hand-edited theme style bare inputs, labels, tables, #payment and .woocommerce-info.
   Layout only: WooCommerce's inputs, names and AJAX are untouched (see checkout.js). */

/* ---------- page furniture ---------- */
body.tfo-co, body.tfo-co .site-content { background: var(--tfo-bg); }
body.tfo-co-page .storefront-breadcrumb,
body.tfo-co-page .entry-header,
body.tfo-co-page .page-title { display: none; }
body.tfo-co-page .site-content { padding-top: 0; }
body.tfo-co-page .site-content > .col-full { max-width: 1240px !important; width: 100%; padding: 0 16px !important; margin: 0 auto !important; box-sizing: border-box; }
body.tfo-co-page .site-main, body.tfo-co-page .hentry { margin: 0; padding: 0; }
body.tfo-co-page .entry-content { margin: 0; }
/* /shop: line up with the list (it breaks out of the theme's column to the window width; same here, capped at 1240) */
body.tfo-page-shop form.tfo-co-form, body.tfo-page-shop .tfo.tfo-co-head {
  width: min(1240px, var(--tfo-vw, 100vw)); margin-left: calc(50% - min(1240px, var(--tfo-vw, 100vw)) / 2); padding-left: 16px; padding-right: 16px; box-sizing: border-box; }
body.tfo-page-shop .tfo.tfo-co-head { margin-top: 24px; }

.tfo-co-top { padding: 0; }
.tfo .tfo-co-toprow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0 6px; }
.tfo .tfo-co-toprow a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--tfo-brand); font-weight: 700; text-decoration: none; }
.tfo .tfo-secure { display: inline-flex; align-items: center; gap: 6px; color: var(--tfo-ink-2); font-size: 14px; }
.tfo .tfo-secure svg.tfo-i, .tfo .tfo-pay-note svg.tfo-i { width: 18px; height: 18px; vertical-align: -4px; margin-right: 4px; }
.tfo h1.tfo-co-title { margin: 4px 0 14px; font: 500 28px/1.15 var(--tfo-font-display); color: var(--tfo-brand); }

/* the theme's big blue notices become quiet link rows (login, voucher) */
body.tfo-co .woocommerce-form-login-toggle, body.tfo-co .woocommerce-form-coupon-toggle { margin: 0; }
body.tfo-co .woocommerce-form-login-toggle .woocommerce-info, body.tfo-co .woocommerce-form-coupon-toggle .woocommerce-info {
  background: none !important; color: var(--tfo-ink-2) !important; border: 0 !important; padding: 0 !important; margin: 0 0 6px !important; font: 400 15px/1.4 var(--tfo-font-body) !important; box-shadow: none; }
body.tfo-co .woocommerce-info::before { display: none !important; }
body.tfo-co .woocommerce-form-login-toggle .woocommerce-info a, body.tfo-co .woocommerce-form-coupon-toggle .woocommerce-info a {
  display: inline-block; padding: 10px 0; color: var(--tfo-brand) !important; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
body.tfo-co form.checkout_coupon, body.tfo-co form.woocommerce-form-login { background: var(--tfo-surface); border: 1px solid var(--tfo-line) !important; border-radius: var(--tfo-radius); padding: 16px !important; margin: 0 0 14px !important; }
body.tfo-co form.checkout_coupon .form-row { float: none; width: auto; padding: 0; margin: 0 0 10px; }
body.tfo-co form.checkout_coupon input.input-text, body.tfo-co form.woocommerce-form-login input.input-text { height: 50px; width: 100%; padding: 0 14px; border-radius: var(--tfo-radius-sm); border: 1.5px solid #c9c3b4; background: var(--tfo-surface); font: 400 16px var(--tfo-font-body); box-shadow: none; }
body.tfo-co form.checkout_coupon button.button, body.tfo-co form.woocommerce-form-login button.button { min-height: 48px; padding: 0 20px; border-radius: 24px; border: 0; background: var(--tfo-brand); color: var(--tfo-brand-ink); font: 700 16px var(--tfo-font-body); }
/* messages WooCommerce prints at the top of the form (validation, coupon) */
body.tfo-co .woocommerce-NoticeGroup, body.tfo-co .woocommerce-notices-wrapper { max-width: 1240px; }
body.tfo-co ul.woocommerce-error, body.tfo-co .woocommerce-message { margin: 0 0 14px !important; padding: 14px 16px !important; border: 1.5px solid #c0392b !important; border-left-width: 5px !important; border-radius: var(--tfo-radius-sm); background: #fdf2f0 !important; color: #7a1f14 !important; list-style: none; font: 400 15px/1.4 var(--tfo-font-body); }
body.tfo-co ul.woocommerce-error::before { display: none; }
body.tfo-co ul.woocommerce-error li { padding: 2px 0; margin: 0; color: inherit; }
body.tfo-co .woocommerce-message { border-color: var(--tfo-ok) !important; background: #e8f2ec !important; color: #1f4d37 !important; }
body.tfo-co .woocommerce-message::before { display: none; }
body.tfo-co .woocommerce-message a.button { display: none; }

/* ---------- the form: parts that are replaced by the cards ---------- */
form.tfo-co-form { background: none; border: 0; padding: 0; margin: 0; }
form.tfo-co-form #order_review_heading, form.tfo-co-form #order_review { display: none; }
form.tfo-co-form .tfo-clear { clear: both; }
/* the theme's "Local delivery to your home is available for orders over £20": the delivery card says it */
body.tfo-co-page .woocommerce > .woocommerce-info { display: none; }

.tfo-co-layout { display: block; }
.tfo-co-side { display: none; }
.tfo-co-layout .tfo-card { margin-bottom: 14px; }

/* ---------- cards ---------- */
.tfo .tfo-card { background: var(--tfo-surface); border: 1px solid var(--tfo-line); border-radius: var(--tfo-radius); padding: 18px 16px; }
.tfo .tfo-card .tfo-step-h { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font: 500 20px/1.2 var(--tfo-font-display); color: var(--tfo-ink) !important; }
.tfo .tfo-card .tfo-step-h .tfo-n { flex: none; width: 28px; height: 28px; border-radius: 14px; background: var(--tfo-brand); color: var(--tfo-brand-ink); font: 700 15px/28px var(--tfo-font-body); text-align: center; }
.tfo .tfo-card .tfo-step-h .tfo-count { font: 400 15px var(--tfo-font-body); color: var(--tfo-muted); }
.tfo .tfo-card.is-locked { background: transparent; border-style: dashed; padding: 14px 16px; }
.tfo .tfo-card.is-locked .tfo-step-h { margin: 0; color: var(--tfo-muted); }
.tfo .tfo-card.is-locked .tfo-step-h .tfo-n { background: transparent; border: 1.5px solid var(--tfo-muted); color: var(--tfo-muted); line-height: 25px; }
.tfo .tfo-card.is-locked > .tfo-body { display: none; }
.tfo .tfo-locked-note { margin: 6px 0 0 38px; color: var(--tfo-ink-2); font-size: 14.5px; }
.tfo .tfo-locked-note[hidden], .tfo [hidden] { display: none !important; }

/* ---------- step 1: the real radio list, as two cards ---------- */
.tfo-card .woocommerce-checkout-review-order-table { display: block; width: 100%; margin: 0; border: 0; background: none; }
.tfo-card .woocommerce-checkout-review-order-table > thead,
.tfo-card .woocommerce-checkout-review-order-table > tbody,
.tfo-card .woocommerce-checkout-review-order-table > tfoot > tr:not(.woocommerce-shipping-total) { display: none; }
.tfo-card .woocommerce-checkout-review-order-table table, .tfo-card .woocommerce-checkout-review-order-table tfoot > tr > td > table > tbody, .tfo-card .woocommerce-checkout-review-order-table tfoot,
.tfo-card .woocommerce-checkout-review-order-table tfoot tr, .tfo-card .woocommerce-checkout-review-order-table tfoot td, .tfo-card .woocommerce-checkout-review-order-table tfoot tbody { display: block; width: 100%; padding: 0; border: 0; background: none; }
.tfo-card .woocommerce-checkout-review-order-table tfoot { display: block; }
.tfo-card .woocommerce-checkout-review-order-table th { display: none; }
.tfo-card tr.tf-sr-shipping td::before { display: none; }
.tfo-card ul#shipping_method { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; padding: 0; list-style: none; }
.tfo-card ul#shipping_method > li.tfo-choice { position: relative; margin: 0; padding: 0; list-style: none; display: block; }
/* collection first, delivery second, as the prototype (the radios arrive in WooCommerce's order) */
.tfo-card ul#shipping_method > li.tf-sr-collection { order: 1; }
.tfo-card ul#shipping_method > li.tf-sr-delivery, .tfo-card ul#shipping_method > li.tf-sr-delivery-unavailable { order: 2; }
.tfo-card ul#shipping_method > li:not(.tfo-choice) { order: 3; grid-column: 1 / -1; }
/* the real radio covers the whole card: a tap IS a click on the input */
.tfo-card ul#shipping_method > li.tfo-choice > input[type=radio] { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; z-index: 2; cursor: pointer; }
.tfo-card ul#shipping_method > li.tfo-choice > input[type=radio]:disabled { cursor: not-allowed; }
.tfo-card ul#shipping_method > li.tfo-choice > label {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; height: 100%; min-height: 150px; padding: 14px 12px 12px; margin: 0;
  border-radius: var(--tfo-radius); border: 1.5px solid var(--tfo-line); background: var(--tfo-surface); color: var(--tfo-ink); text-align: left; font: 400 14px/1.3 var(--tfo-font-body); opacity: 1; cursor: pointer; }
.tfo-card ul#shipping_method > li.tfo-choice > input:focus-visible + label { outline: 3px solid var(--tfo-brand); outline-offset: 2px; }
.tfo-card .tfo-choice svg.tfo-big { width: 34px; height: 34px; color: var(--tfo-brand); stroke-width: 1.6; margin-bottom: 4px; }
.tfo-card .tfo-choice label b { font: 500 20px/1.15 var(--tfo-font-display); }
.tfo-card .tfo-choice label > span { font-size: 14px; line-height: 1.3; color: var(--tfo-ink-2); }
.tfo-card .tfo-choice label > .tfo-fee { margin-top: auto; padding-top: 6px; font-weight: 700; color: var(--tfo-accent); font-size: 15px; }
.tfo-card .tfo-choice label > .tfo-fee .woocommerce-Price-amount { color: inherit; }
.tfo-card .tfo-choice .tfo-tick { position: absolute; top: 10px; right: 10px; width: 26px; height: 26px; border-radius: 13px; border: 1.5px solid var(--tfo-line); background: var(--tfo-surface); display: flex; align-items: center; justify-content: center; }
.tfo-card .tfo-choice .tfo-tick svg { width: 16px; height: 16px; stroke-width: 3; opacity: 0; color: var(--tfo-brand-ink); }
.tfo-card ul#shipping_method > li.tfo-choice.is-checked > label { border: 2.5px solid var(--tfo-brand); background: var(--tfo-brand-soft); padding: 13px 11px 11px; }
.tfo-card li.tfo-choice.is-checked .tfo-tick { background: var(--tfo-brand); border-color: var(--tfo-brand); }
.tfo-card li.tfo-choice.is-checked .tfo-tick svg { opacity: 1; }
.tfo-card ul#shipping_method > li.tf-sr-delivery-unavailable > label { background: transparent; border-style: dashed; }
.tfo-card li.tf-sr-delivery-unavailable > label > * { opacity: .62; }
.tfo-card li.tf-sr-delivery-unavailable .tfo-tick { display: none; }
/* why delivery is not offered: under the cards, in plain words (tf-shop-rules' own text) */
.tfo-card .tf-sr-reason { grid-column: 1 / -1; display: block; margin: 8px 2px 0; padding: 0; opacity: 1; color: var(--tfo-ink-2); font-size: 14.5px; line-height: 1.35; }
.tfo-card ul#shipping_method > li.tf-sr-delivery-unavailable { position: relative; }
.tfo-card ul#shipping_method > li.tf-sr-delivery-unavailable .tf-sr-reason { position: static; }
.tfo-card .tf-sr-choose-prompt { display: flex; gap: 8px; align-items: center; margin: 12px 2px 0 !important; padding: 0 !important; background: none !important; border: 0 !important; color: var(--tfo-ink-2); font: 400 14.5px/1.35 var(--tfo-font-body); }
.tfo-card .tf-sr-choose-prompt svg.tfo-i { width: 20px; height: 20px; }
.tfo-card .tf-sr-choose-prompt strong { font-weight: 400; }
.tfo-card tr.tf-sr-shipping > td > .tf-sr-choose-prompt { order: 9; }
/* the prompt comes AFTER the cards in the prototype; the markup has it before the list */
.tfo-card tr.tf-sr-shipping > td { display: flex; flex-direction: column; }
.tfo-card tr.tf-sr-shipping > td > .tf-sr-choose-prompt { order: 2; }
.tfo-card tr.tf-sr-shipping > td > ul { order: 1; }
.tfo-card .woocommerce-shipping-contents, .tfo-card .woocommerce-shipping-destination { display: none; }

/* Local Pickup Plus / tf-shop-rules controls: still in the page (they hold the values), shown through our buttons instead */
.tfo-engine, .tfo-card #tf-delivery-fields .form-row { position: absolute !important; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.tfo-card #tf-delivery-fields { margin: 0; padding: 0; }
.tfo-card #tf-delivery-fields .tf-sr-delivery-cutoff-note { margin: 12px 0 0; font-size: 14.5px; line-height: 1.35; color: var(--tfo-ink-2); opacity: 1; }

/* ---------- step 2 ---------- */
.tfo .tfo-field-l { display: block; margin: 16px 0 8px; font-weight: 700; font-size: 15px; }
.tfo .tfo-pane > .tfo-field-l:first-child, .tfo .tfo-where + .tfo-field-l { margin-top: 16px; }
.tfo .tfo-field-l small { font-weight: 400; color: var(--tfo-ink-2); font-size: inherit; }
.tfo .tfo-where { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: var(--tfo-radius-sm); background: var(--tfo-surface-2); font-size: 15px; line-height: 1.35; }
.tfo .tfo-where svg.tfo-i { color: var(--tfo-brand); margin-top: 1px; }
.tfo .tfo-days { display: flex; gap: 8px; overflow-x: auto; margin: 0 -16px; padding: 2px 16px 6px; scroll-padding: 0 16px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, transparent, #000 16px, #000 calc(100% - 32px), transparent); mask-image: linear-gradient(90deg, transparent, #000 16px, #000 calc(100% - 32px), transparent); }
.tfo .tfo-days::-webkit-scrollbar { display: none; }
.tfo .tfo-days:empty { display: none; }
.tfo .tfo-day { flex: none; width: 64px; height: 72px; border-radius: var(--tfo-radius-sm); border: 1.5px solid var(--tfo-line); background: var(--tfo-surface); color: var(--tfo-ink); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; line-height: 1.1; }
.tfo .tfo-day small { font-size: 13px; color: var(--tfo-ink-2); text-transform: uppercase; letter-spacing: .04em; }
.tfo .tfo-day b { font-size: 21px; font-variant-numeric: tabular-nums; }
.tfo .tfo-day i { font-style: normal; font-size: 13px; color: var(--tfo-ink-2); }
.tfo .tfo-day[aria-checked="true"] { background: var(--tfo-brand); border-color: var(--tfo-brand); color: var(--tfo-brand-ink); }
.tfo .tfo-day[aria-checked="true"] small, .tfo .tfo-day[aria-checked="true"] i { color: inherit; opacity: .9; }
.tfo .tfo-slots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.tfo .tfo-slots:empty { display: none; }
.tfo .tfo-slot { height: 44px; padding: 0 2px; border-radius: var(--tfo-radius-sm); border: 1.5px solid var(--tfo-line); background: var(--tfo-surface); color: var(--tfo-ink); font-weight: 700; font-size: 15px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tfo .tfo-slot[aria-checked="true"] { background: var(--tfo-brand); border-color: var(--tfo-brand); color: var(--tfo-brand-ink); }
.tfo .tfo-window { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: var(--tfo-radius-sm); border: 1.5px solid var(--tfo-brand); background: var(--tfo-brand-soft); font-weight: 700; }
.tfo .tfo-window.is-wait { border-color: var(--tfo-line); background: var(--tfo-surface-2); font-weight: 400; color: var(--tfo-ink-2); }
.tfo .tfo-confirm { display: flex; gap: 10px; align-items: center; margin-top: 14px; padding: 12px; border-radius: var(--tfo-radius-sm); background: #e8f2ec; color: #1f4d37; font-weight: 700; font-size: 15px; line-height: 1.3; }
.tfo .tfo-confirm svg.tfo-i { color: var(--tfo-ok); }
.tfo .tfo-hint { margin-top: 12px; color: var(--tfo-ink-2); font-size: 14.5px; }
.tfo .tfo-hint:empty { display: none; }
.tfo .tfo-note { margin-top: 12px; padding: 10px 12px; border-radius: var(--tfo-radius-sm); background: #fff4e5; border-left: 4px solid #e08a00; color: #6b3f00; font-size: 14.5px; line-height: 1.35; }
.tfo .tfo-pc { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; }
.tfo .tfo-pc .form-row { grid-column: 1; margin: 0; }
.tfo-card #shipping_post_code_field label .optional { display: none; }
.tfo .tfo-pc .tfo-pc-check { grid-column: 2; border-radius: var(--tfo-radius-sm); min-height: 50px; }
.tfo .tfo-pc-status { display: flex; gap: 8px; align-items: flex-start; margin-top: 8px; color: var(--tfo-ink-2); font-size: 15px; line-height: 1.35; }
.tfo .tfo-pc-status svg.tfo-i { width: 20px; height: 20px; margin-top: 1px; }
.tfo .tfo-pc-status.is-ok { color: #1f4d37; font-weight: 700; }
.tfo .tfo-pc-status.is-ok svg.tfo-i { color: var(--tfo-ok); }
.tfo .tfo-pc-status.is-bad { color: #7a1f14; }
.tfo-pane[data-pane] > .tfo-del-when { margin-top: 0; }

/* ---------- WooCommerce's own fields, in the same style as the prototype's inputs ---------- */
.tfo-card .form-row { float: none !important; width: auto !important; display: block; margin: 0 0 14px; padding: 0; clear: none; }
.tfo-card .form-row label:not(.checkbox):not(.woocommerce-form__label-for-checkbox) { display: block; margin: 0 0 8px; padding: 0; font: 700 15px/1.3 var(--tfo-font-body); color: var(--tfo-ink); }
.tfo-card .form-row label .optional { font-weight: 400; color: var(--tfo-ink-2); }
.tfo-card .form-row .required, .tfo-card .form-row abbr.required { color: var(--tfo-accent); text-decoration: none; border: 0; }
.tfo-card .form-row .woocommerce-input-wrapper { display: block; }
.tfo-card input.input-text, .tfo-card select, .tfo-card textarea.input-text {
  display: block; width: 100%; height: 50px; padding: 0 14px; border-radius: var(--tfo-radius-sm); border: 1.5px solid #c9c3b4; background: var(--tfo-surface); color: var(--tfo-ink);
  font: 400 16px var(--tfo-font-body); box-shadow: none; -webkit-appearance: none; appearance: none; margin: 0; }
.tfo-card textarea.input-text { height: auto; min-height: 96px; padding: 12px 14px; }
.tfo-card input.input-text:focus, .tfo-card select:focus, .tfo-card textarea:focus { outline: none; border-color: var(--tfo-brand); box-shadow: 0 0 0 3px var(--tfo-brand-soft); background: var(--tfo-surface); }
.tfo-card .form-row.woocommerce-invalid input.input-text { border-color: #c0392b; }
.tfo-card .woocommerce-billing-fields h3, .tfo-card .woocommerce-shipping-fields h3, .tfo-card .woocommerce-additional-fields h3 { display: none; }
.tfo-card #customer_details, .tfo-card #customer_details .col-1, .tfo-card #customer_details .col-2 { float: none; width: 100%; margin: 0; padding: 0; }
.tfo-card .col2-set::before, .tfo-card .col2-set::after { display: none; }
.tfo-card .woocommerce-billing-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 0 10px; }
.tfo-card .woocommerce-billing-fields__field-wrapper > .form-row-wide { grid-column: 1 / -1; }
.tfo-card .woocommerce-shipping-fields { margin-top: 4px; }
.tfo-card .woocommerce-shipping-fields__field-wrapper { display: flex; flex-direction: column; }
.tfo-card #shipping_address1_field { order: 1; }
.tfo-card #shipping_address2_field { order: 2; }
.tfo-card #shipping_city_town_field { order: 3; }
.tfo-card #shipping_country_field, .tfo-card #delivery_collection_datetime_field, .tfo-card #shipping_country_field.form-row { display: none !important; }   /* fixed "United Kingdom"; an old optional free-text field (see REPORT) */
.tfo-card .woocommerce-additional-fields { display: none; }
.tfo-card #ship-to-different-address { display: none; }
.tfo-card #shipping_address2_field label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.tfo-card .tf-sr-note { color: #7a1f14; font-size: 14.5px; margin: 6px 0 0; }

/* ---------- summary ---------- */
.tfo .tfo-summary ul { margin: 0; padding: 0; list-style: none; }
.tfo .tfo-summary li { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--tfo-line); font-size: 15px; line-height: 1.3; }
.tfo .tfo-summary li .tfo-q { color: var(--tfo-ink-2); font-variant-numeric: tabular-nums; }
.tfo .tfo-summary li b { font-variant-numeric: tabular-nums; font-weight: 400; }
.tfo .tfo-line { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 15px; font-variant-numeric: tabular-nums; }
.tfo .tfo-line.tfo-total { font-size: 19px; font-weight: 700; border-top: 1px solid var(--tfo-line); margin-top: 6px; padding-top: 12px; }
.tfo .tfo-summary .woocommerce-Price-amount, .tfo .tfo-summary bdi { color: inherit; font: inherit; }
.tfo .tfo-summary a.tfo-link, .tfo .tfo-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--tfo-brand); font: 700 16px var(--tfo-font-body); text-decoration: underline; text-underline-offset: 3px; background: none; border: 0; padding: 0; cursor: pointer; }
.tfo .tfo-summary { margin-bottom: 14px; }
.tfo .tfo-sum-main { margin: 0; }

/* ---------- step 4: notes, offers, payment ---------- */
.tfo-card .tfo-note-box { margin: 4px 0 8px; }
.tfo-card .tfo-note-box .form-row { margin: 0; }
.tfo-card .tfo-note-box label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.tfo-card .form-row label.checkbox, .tfo-card .form-row label.woocommerce-form__label-for-checkbox { display: flex !important; gap: 12px; align-items: flex-start; margin: 8px 0 8px; font: 400 15px/1.35 var(--tfo-font-body) !important; color: var(--tfo-ink-2); cursor: pointer; }
.tfo-card input[type=checkbox] { flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--tfo-brand); }
.tfo-card .woocommerce-account-fields { margin: 0; }
.tfo-card .woocommerce-account-fields .form-row { margin: 0; }
.tfo-card .woocommerce-checkout-payment { background: none; border: 0; border-radius: 0; margin: 8px 0 0; padding: 0; }
.tfo-card #payment ul.payment_methods { margin: 0 0 12px; padding: 0; border: 0; list-style: none; text-align: left; }
.tfo-card #payment ul.payment_methods > li { margin: 0; padding: 12px 14px !important; border: 1.5px solid var(--tfo-line) !important; border-radius: var(--tfo-radius-sm); background: var(--tfo-surface) !important; list-style: none; }
.tfo-card #payment ul.payment_methods > li + li { margin-top: 8px; }
.tfo-card #payment ul.payment_methods > li > input[type=radio][style*="none"] + label { margin-left: 0; }
.tfo-card #payment ul.payment_methods > li > label { display: inline; margin: 0 0 0 8px; font: 700 15.5px var(--tfo-font-body); color: var(--tfo-ink); }
.tfo-card #payment ul.payment_methods > li > input[type=radio] { width: 20px; height: 20px; accent-color: var(--tfo-brand); vertical-align: middle; margin: 0; }
.tfo-card #payment div.payment_box { margin: 8px 0 0; padding: 0; background: none; color: var(--tfo-ink-2); font-size: 14px; }
.tfo-card #payment div.payment_box::before { display: none; }
.tfo-card #payment div.payment_box p { margin: 0; font: 400 14px var(--tfo-font-body); }
.tfo-card #payment div.payment_box a { color: var(--tfo-brand); }
.tfo-card #payment .place-order { padding: 0; margin: 0; background: none; }
.tfo-card .woocommerce-terms-and-conditions-wrapper { font-size: 14px; color: var(--tfo-ink-2); margin-bottom: 10px; }
.tfo-card .woocommerce-privacy-policy-text:empty { display: none; }
.tfo-card #place_order {
  display: flex; align-items: center; justify-content: center; width: 100%; float: none; min-height: 54px; padding: 0 20px; margin: 4px 0 0; border-radius: var(--tfo-radius-sm); border: 0;
  background: var(--tfo-brand); color: var(--tfo-brand-ink); font: 700 18px/1.1 var(--tfo-font-body); letter-spacing: normal; text-transform: none; cursor: pointer; }
.tfo-card #place_order:hover { background: var(--tfo-brand); color: var(--tfo-brand-ink); filter: brightness(1.12); }
.tfo-card #place_order.disabled, .tfo-card #place_order:disabled { opacity: .55; }
.tfo .tfo-pay-note { display: block; text-align: center; margin-top: 10px; color: var(--tfo-ink-2); font-size: 14px; text-align: center; }
.tfo-card .blockUI.blockOverlay { border-radius: var(--tfo-radius); }

/* a programmatic pick through the control's own calendar must not flash a popup */
body.tfo-picking #ui-datepicker-div { opacity: 0 !important; pointer-events: none !important; }

/* ---------- desktop: summary beside the steps ---------- */
@media (min-width: 1024px) {
  .tfo-co-layout { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 40px; align-items: start; }
  .tfo-co-main .tfo-sum-main { display: none; }
  .tfo-co-side { display: block; position: sticky; top: 16px; margin-top: 0; }
  .tfo h1.tfo-co-title { font-size: 34px; }
  .tfo-card ul#shipping_method > li.tfo-choice > label { min-height: 132px; }
  .tfo .tfo-slots { grid-template-columns: repeat(7, 1fr); }
  .tfo .tfo-days { margin: 0 -16px; }
}
@media (max-width: 380px) { .tfo .tfo-slots { grid-template-columns: repeat(3, 1fr); } }