/* Checkout: make the coupon toggle and field clear */
.woocommerce-form-coupon-toggle .woocommerce-info {
	margin-bottom: 1rem;
	font-size: .95rem;
}
.woocommerce-form-coupon-toggle .showcoupon {
	text-decoration: underline;
	font-weight: 500;
}
form.checkout_coupon .input-text {
	min-height: 46px;
}

/* Landing page, bestseller picks: brand label matches the catalogue (Jost 13px / 20.8px, 1.8px tracking, #767676, uppercase, left) */
html body .tonbora-disc-card .tonbora-card-head{justify-content:flex-start!important;text-align:left!important}
html body .tonbora-disc-card .tonbora-card-head .tonbora-card-brand{text-transform:uppercase!important;text-align:left!important;font-size:13px!important;line-height:20.8px!important;letter-spacing:1.8px!important;color:#767676!important;font-weight:500!important;margin:0!important}

/* Hero: the supporting sentence stays in the page for search engines and screen readers, but is not shown */
html body .tonbora-hero-section .tonbora-hero-points,
html body .tonbora-hero-section .tonbora-hero-note-top{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/*
 * Visually hidden but still readable by search engines and screen readers
 * (display:none can be discounted by Google). Add the class
 * "tonbora-sr-only" to the hero text element in the page builder, or use
 * its own selector, e.g. .home .HERO_TEXT_CLASS { ...same rules... }
 */
.tonbora-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Checkout discount code: same hairline border as the other checkout fields (the theme's own rule loses to Botiga's input styling) */
html body.woocommerce-checkout .tnb-co-coupon input#tnb-coupon-code{border:1px solid var(--c-line,#e4e4e4)!important;box-shadow:none!important;outline:none!important}
html body.woocommerce-checkout .tnb-co-coupon input#tnb-coupon-code:focus{border:1px solid var(--c-ink,#212121)!important;box-shadow:none!important;outline:none!important}

/* Checkout summary: hide WooCommerce's own Subtotal and Coupon rows; the coupon is shown inside the totals block instead */
html body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot tr.cart-subtotal,
html body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot tr.cart-discount:not(.tonbora-totals-coupon){display:none!important}

/* Coupon line: "Remove" sits under the label so the amount lines up with the other numbers */
html body.woocommerce-checkout .tonbora-totals-coupon th .woocommerce-remove-coupon{display:block;margin-top:2px;font-size:12px;line-height:1.4;color:#767676;text-decoration:underline;text-underline-offset:2px}
html body.woocommerce-checkout .tonbora-totals-coupon td{text-align:right}

/* Checkout discount code: same shape and height as the other checkout fields (12px corners, 52px) */
html body.woocommerce-checkout .tnb-co-coupon{gap:8px;align-items:stretch}
html body.woocommerce-checkout .tnb-co-coupon input#tnb-coupon-code{border-radius:12px!important;min-height:52px;padding:14px 16px!important}
html body.woocommerce-checkout .tnb-co-coupon .tnb-coupon-apply{border-radius:12px!important;min-height:52px;padding:0 22px!important}

/* Checkout summary: items and the discount field use the full width, in line with Cart / Subtotal / totals */
html body.woocommerce-checkout .tnb-co-side .woocommerce-checkout-review-order-table tr.tnb-co-item>td.product-name{padding-left:0!important}
html body.woocommerce-checkout .tnb-co-side .woocommerce-checkout-review-order-table tr.tnb-co-item>td.product-total{padding-right:0!important}
html body.woocommerce-checkout .tnb-co-side .woocommerce-checkout-review-order-table tr.tnb-co-coupon-row>td{padding-left:0!important;padding-right:0!important}

/* Coupon message under the discount field: small quiet text, not a big grey notice box */
html body.woocommerce-checkout .tnb-coupon-msg{margin:0 0 8px;font-size:12px;line-height:1.4;color:#767676}
html body.woocommerce-checkout .tnb-coupon-msg .woocommerce-message,
html body.woocommerce-checkout .tnb-coupon-msg .woocommerce-error,
html body.woocommerce-checkout .tnb-coupon-msg .is-success,
html body.woocommerce-checkout .tnb-coupon-msg .is-error{margin:0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important;font-size:12px!important;line-height:1.4!important;color:inherit!important}
html body.woocommerce-checkout .tnb-coupon-msg .woocommerce-error{list-style:none}

/* The rows themselves carry Botiga's side padding (the totals and Cart rows already zero it); zero it for items and the discount row too */
html body.woocommerce-checkout .tnb-co-side .woocommerce-checkout-review-order-table tr.tnb-co-item,
html body.woocommerce-checkout .tnb-co-side .woocommerce-checkout-review-order-table tr.tnb-co-coupon-row{padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important}

/* Discount code: lighter and more compact (44px, small text, outlined Apply) */
html body.woocommerce-checkout .tnb-co-coupon input#tnb-coupon-code{min-height:44px!important;height:44px;padding:0 16px!important;font-size:14px!important}
html body.woocommerce-checkout .tnb-co-side .tnb-co-coupon .tnb-coupon-apply{min-height:44px;height:44px;padding:0 20px!important;background:transparent!important;color:var(--c-ink,#212121)!important;border:1px solid var(--c-ink,#212121)!important;box-shadow:none!important;font-size:11px!important;letter-spacing:.14em}
html body.woocommerce-checkout .tnb-co-side .tnb-co-coupon .tnb-coupon-apply:hover{background:var(--c-ink,#212121)!important;color:#fff!important}

/* Discount code: same look as the footer email field, a pill with a hairline border and a solid dark pill button */
html body.woocommerce-checkout .tnb-co-coupon{gap:12px}
html body.woocommerce-checkout .tnb-co-coupon input#tnb-coupon-code{height:56px;min-height:56px!important;padding:0 24px!important;border:1px solid #e1e1e1!important;border-radius:999px!important;background:#fff!important;font-size:15px!important;color:#111}
html body.woocommerce-checkout .tnb-co-coupon input#tnb-coupon-code:focus{border-color:#111!important}
html body.woocommerce-checkout .tnb-co-side .tnb-co-coupon .tnb-coupon-apply{height:56px;min-height:56px;padding:0 28px!important;border:0!important;border-radius:999px!important;background:#212121!important;color:#fff!important;box-shadow:none!important;font-size:13px!important;letter-spacing:.16em}
html body.woocommerce-checkout .tnb-co-side .tnb-co-coupon .tnb-coupon-apply:hover{background:#000!important;color:#fff!important}
html body.woocommerce-checkout .tnb-coupon-msg.is-error{color:#b3261e}
html body.woocommerce-checkout .tnb-co-side .tnb-coupon-msg{text-align:left!important}
html body.woocommerce-checkout .tnb-co-side .tnb-coupon-msg,
html body.woocommerce-checkout .tnb-co-side .tnb-coupon-msg *{text-align:left!important;justify-content:flex-start!important}
/* Coupon messages start exactly at the left edge of the discount field */
html body.woocommerce-checkout .tnb-co-side .tnb-coupon-msg{display:block;width:100%;box-sizing:border-box;margin-left:0!important;padding-left:0!important;text-indent:0!important}
html body.woocommerce-checkout .tnb-co-side .tnb-coupon-msg *{margin-left:0!important;padding-left:0!important;text-indent:0!important;float:none!important}
html body.woocommerce-checkout .tnb-co-side .tnb-coupon-msg *::before{display:none!important;content:none!important}

/* Regulation references: one charge per line */
html body .tonbora-tip-line,
html body .tonbora-totals-subrow--note th{white-space:pre-line!important}

/* Regulation reference directly under its charge in the customs pop-up */
html body .tonbora-tip-line.tonbora-tip-ref{border-top:0;padding-top:0;font-size:12px;line-height:1.45;color:#767676;white-space:normal!important}
html body .tonbora-tip-line:has(+ .tonbora-tip-ref){padding-bottom:2px}

/* Product page: agency-fee line directly under the price, above the tax / minimum-order note */
html body.single-product .summary.entry-summary .tonbora-price-note.tonbora-price-agency{order:41;margin:2px 0 0!important}

/* Hero stage: lets the script restart the dot's black fill from empty */
html body .tnb-stage.tnb-restart .tnb-stage__dot.is-active::after{animation:none!important}

/* "How it works" (desktop): one continuous line from dot 1 to dot 2 to dot 3, instead of one separate stroke per step.
   The line is drawn on the grid; the per-step segments are switched off. Phones keep the vertical segments. */
@media screen and (min-width: 901px) {
	html body .tonbora-steps-grid{position:relative}
	html body .tonbora-steps-grid .tonbora-step-col:not(:last-child)::after{display:none!important}
	html body .tonbora-steps-grid::before{content:"";position:absolute;top:24px;left:calc((100% - 80px) / 6);right:calc((100% - 80px) / 6);height:1px;background:var(--tb-clay);transform-origin:left center;pointer-events:none}
	html.tb-anim body .tonbora-steps-grid:not(.is-in)::before{transform:scaleX(0)}
	html.tb-anim body .tonbora-steps-grid.is-in::before{animation:tnb-steps-line 2300ms linear 500ms both}
}
@keyframes tnb-steps-line{0%{transform:scaleX(0)}39%{transform:scaleX(.5)}61%{transform:scaleX(.5)}100%{transform:scaleX(1)}}


/* Hero 01 / 02 / 03 numerals: a deeper shade of the toggle's blue-grey so they read clearly. */
.tonbora-hero-specs .tonbora-spec-index,
.tonbora-spec-index,
html body .tonbora-step-num {
  color: #B3C0CF;
}

/* Cart drawer notes: both rows share identical layout AND icon box so the (i) icons align with their text. */
html body .tonbora-cart-drawer .tonbora-cart-note,
html body .tonbora-cart-drawer .tonbora-mov-ok--mini {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 0 !important;
  line-height: 19.5px !important;
}
html body .tonbora-cart-drawer .tonbora-cart-note::before,
html body .tonbora-cart-drawer .tonbora-mov-ok--mini::before {
  content: "" !important;
  flex: 0 0 12px !important;
  width: 12px !important;
  height: 12px !important;
  margin: 0 !important;
  align-self: center !important;
  transform: translateY(1px);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23767676' stroke-width='1.4' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cline x1='12' y1='11' x2='12' y2='16.5'/%3E%3Ccircle cx='12' cy='7.6' r='.6' fill='%23767676'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

/* Second row ("Minimum order…"): icon nudged lower */
html body .tonbora-cart-drawer .tonbora-mov-ok--mini::before { transform: translateY(5px); }

/* The actual "Minimum order…" row is .tonbora-mov-msg: give it the same centred-icon layout as the tax note. */
html body .tonbora-cart-drawer .tonbora-mov-bar .tonbora-mov-msg {
  display: flex !important;
  align-items: center !important;
  line-height: 19.5px !important;
}
html body .tonbora-cart-drawer .tonbora-mov-bar .tonbora-mov-msg::before {
  margin: 0 !important;
  align-self: center !important;
  transform: translateY(0);
}

/* Sign-in / register / reset screens: centre-aligned content (fields stay full width). */
html body .tonbora-auth-wordmark { display: flex !important; justify-content: center; margin-left: auto; margin-right: auto; }
html body .tonbora-auth-wordmark__logo { margin: 0 auto; }
html body .tonbora-auth { text-align: center; }
html body .tonbora-auth .tonbora-auth__check,
html body .tonbora-auth .woocommerce-form-login__rememberme { display: flex; justify-content: center; }
html body .tonbora-auth .tonbora-auth__check label,
html body .tonbora-auth label.woocommerce-form-login__rememberme { justify-content: center; text-align: center; }
html body .tonbora-auth .tonbora-auth__note,
html body .tonbora-auth .tonbora-auth__swap,
html body .tonbora-auth .tonbora-auth__lead,
html body .tonbora-auth .tonbora-auth__sub,
html body .tonbora-auth .lost_password { text-align: center; }
html body .tonbora-auth .tonbora-auth__swap-link { text-align: center; }
html body .tonbora-auth-form .tonbora-auth__back { align-self: center !important; }
html body .tonbora-auth .tonbora-auth__links { justify-content: center !important; flex-wrap: wrap; text-align: center; }
html body .tonbora-auth .woocommerce-LostPassword { text-align: center !important; }
html body .tonbora-auth .tonbora-auth__panel .tonbora-auth__links,
html body .tonbora-auth .tonbora-auth__panel .tonbora-auth__links p { justify-content: center !important; align-items: center !important; text-align: center !important; }
html body .tonbora-auth .tonbora-auth__panel .tonbora-auth__links { align-items: baseline !important; }
html body .tonbora-auth .tonbora-auth__panel .tonbora-auth__links p { line-height: 1.5 !important; margin: 0 !important; }

/* "Remember me": back to left-aligned with the fields */
html body .tonbora-auth .tonbora-auth__check,
html body .tonbora-auth .woocommerce-form-login__rememberme,
html body .tonbora-auth .tonbora-auth__panel .form-row:has(.woocommerce-form-login__rememberme) { justify-content: flex-start !important; text-align: left !important; }
html body .tonbora-auth .tonbora-auth__check label,
html body .tonbora-auth label.woocommerce-form-login__rememberme { justify-content: flex-start !important; text-align: left !important; }

/* ---- Home: "Find your routine" quiz section refresh ---- */
html body .tonbora-homepage > .tnb-quiz-home {
  background: linear-gradient(120deg, #F6F7F9 0%, #EDF1F5 100%) !important;
}
/* Kicker with a short blue-grey rule */
html body .tnb-quiz-home .tnb-quiz-home__kicker {
  display: inline-flex; align-items: center; gap: 14px;
  color: #7C93A8; font-weight: var(--fw-regular, 400);
}
html body .tnb-quiz-home .tnb-quiz-home__kicker::before {
  content: ""; width: 32px; height: 1px; background: currentColor;
}
html body .tnb-quiz-home .tnb-quiz-home__title { margin-bottom: 20px; }
html body .tnb-quiz-home .tnb-quiz-home__sub { color: #4a4f55; margin-bottom: 32px; }

/* Picture: softer corners and a gentle lift */
html body .tnb-quiz-home .tnb-scan {
  border-radius: 32px !important;
  box-shadow: 0 40px 70px -40px rgba(70, 92, 115, .45);
}
html body .tnb-quiz-home .tnb-quiz-home__text { max-width: 660px !important; }

/* Quiz picture: blue-grey backdrop to match the section instead of beige */
html body .tnb-quiz-home .tnb-scan,
html body .tnb-scan {
  background: linear-gradient(160deg, #E9EEF3 0%, #C7D3DF 100%) !important;
}
html body .tnb-quiz-home .tnb-quiz-home__kicker::before { content: none !important; display: none !important; }

/* ---- Quiz section colours: a clearer blue-grey palette ---- */
html body .tonbora-homepage > .tnb-quiz-home {
  background: linear-gradient(115deg, #F5F7FA 0%, #E3EAF1 100%) !important;
}
html body .tnb-quiz-home .tnb-scan,
html body .tnb-scan {
  background: linear-gradient(160deg, #D9E3ED 0%, #A5B9CD 100%) !important;
  box-shadow: 0 44px 80px -42px rgba(58, 82, 108, .55);
}
html body .tnb-quiz-home .tnb-quiz-home__kicker { color: #6E87A0; }
html body .tnb-quiz-home .tnb-quiz-home__title { color: #1F2A36; }
html body .tnb-quiz-home .tnb-quiz-home__sub { color: #46525F; }
html body .tnb-quiz-home .tnb-quiz-home__steps li {
  background: #fff; box-shadow: 0 1px 0 rgba(90, 115, 140, .12), 0 6px 14px -10px rgba(58, 82, 108, .35);
}
html body .tnb-quiz-home .tnb-quiz-home__kicker { font-weight: var(--fw-regular, 400) !important; }