/*
 * Conversion review L20261015-1525 (dev-frontend-3): cart summary lines, own
 * courier, captions, busy buttons, remove-selected + undo, auth tabs and hints.
 * Values from the Lovable CartSummary / CartSheet / Cart / AuthFields source,
 * in px (the theme root is 10px). Scoped under our own classes.
 */

/* ---------- Summary lines (SummaryLines: space-y-2 text-xs) ---------- */
.sb-cart-sum { display: flex; flex-direction: column; gap: 8px; font-size: 12px; line-height: 16px; color: #141d2e; }
.sb-cart-sum .sb-cart-sum__row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 0; padding: 0; }
.sb-cart-sum .sb-cart-sum__row--list { align-items: center; font-size: 14px; line-height: 20px; font-weight: 600; }
.sb-cart-sum .sb-cart-sum__row--discount { color: #15803d; }
.sb-cart-sum .sb-cart-sum__muted { color: #58677e; }
.sb-cart-sum p.sb-cart-sum__muted { margin: 0; font-size: 12px; line-height: 16px; }
.sb-cart-sum .sb-cart-sum__value { flex-shrink: 0; color: #141d2e; }
.sb-cart-sum .sb-cart-sum__row--total { align-items: center; border-top: 1px solid #e2e8f0; padding-top: 8px; font-size: 14px; line-height: 20px; font-weight: 600; }
.sb-cart-sum .sb-cart-sum__total { font-size: 16px; line-height: 24px; font-weight: 700; }
.sb-cart-sum__terms {
	display: inline; padding: 0; margin: 0; border: 0; background: none; font: inherit; font-weight: 600;
	color: #06038d; text-decoration: underline; text-underline-offset: 2px; cursor: pointer;
}
.sb-cart-sum__terms:focus-visible { outline: 2px solid #06038d; outline-offset: 2px; }

/*
 * ROUND 2 (QC, 1440 + 375): the rows added inside the Payment Summary card sit
 * on the card's 16px inner edge, like List price (Cart.tsx: one `p-4` body).
 * Tax/VAT: `pb-3 mb-3 border-b`; courier checkbox: `mb-3` (19 Oct: international line cut).
 */
#sb-cart-page .sb-cart-page__summary > .sb-cart-sum__tax {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	margin: 12px 16px 12px; padding: 0 0 12px; border-bottom: 1px solid #dbdfe6;
	font-size: 12px; line-height: 16px; color: #58677e;
}
#sb-cart-page .sb-cart-page__summary > .sb-cart-sum__tax span,
#sb-cart-page .sb-cart-page__summary > .sb-cart-sum__tax span + span { color: #58677e; font-size: 12px; line-height: 16px; font-weight: 400; }
#sb-cart-page .sb-cart-page__summary > .sb-courier { margin: 0 16px 12px; }
#sb-cart-page .sb-cart-page__summary .sb-popup-cart__actions { margin-top: 0; }

/* ---------- Captions under the cart buttons (Cart.tsx: mt-1, then mt-3) ---------- */
/* The actions column has an 8px gap: -4px nets mt-1, 4px nets mt-3. */
.sb-cart-page .sb-popup-cart__actions .sb-cart-page__caption { margin: -4px 0 0; text-align: center; font-size: 11px; line-height: 16px; color: #58677e; }
.sb-cart-page .sb-popup-cart__actions .sb-cart-page__caption + .sb-popup-cart__quote-btn { margin-top: 4px; }
.sb-cart-addfirst { margin: 6px 0 0; font-size: 12px; line-height: 16px; color: #58677e; text-align: center; }

/* ---------- Slide-out actions (CartSheet: filled, outline, text link) ---------- */
#sb-popup-cart .sb-popup-cart__actions--r14 { display: grid; grid-template-columns: 1fr; gap: 8px; }
#sb-popup-cart .sb-popup-cart__btn--outline {
	display: inline-flex; align-items: center; justify-content: center; gap: 4px; width: 100%; height: 40px;
	border: 1px solid #e2e8f0; border-radius: 6px; background: #fff; color: #141d2e; font-size: 14px; font-weight: 500;
}
#sb-popup-cart .sb-popup-cart__btn--outline:hover { background: #f1f5f9; }
#sb-popup-cart .sb-popup-cart__continue-link {
	justify-self: center; padding: 0; border: 0; background: none; font-size: 14px; line-height: 20px; font-weight: 600; color: #141d2e; cursor: pointer;
}
#sb-popup-cart .sb-popup-cart__continue-link:hover { text-decoration: underline; }

/* ---------- Busy buttons (BusyLabel: Loader2 h-3.5 w-3.5 animate-spin mr-1.5) ---------- */
.is-busy { cursor: progress; opacity: .85; }
.sb-busy__spin { margin-right: 6px; animation: sb-busy-spin 1s linear infinite; vertical-align: -2px; }
@keyframes sb-busy-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .sb-busy__spin { animation-duration: 2s; } }

/*
 * ---------- Own courier: checkbox only (19 Oct, Lovable 4101e678 CourierControl) ----------
 * <label class="flex cursor-pointer items-center gap-2 py-2 text-xs font-medium text-foreground">
 * + shadcn Checkbox: h-4 w-4 rounded-sm border border-primary; checked bg-primary, white Check;
 * focus-visible ring-2 ring-ring ring-offset-2.
 */
.sb-courier,
#sb-cart-page label.sb-courier { display: flex; align-items: center; gap: 8px; margin: 0; padding: 8px 0; font-size: 12px; line-height: 16px; font-weight: 500; color: #141d2e; cursor: pointer; }
.sb-courier input[type="checkbox"].sb-courier__check {
	-webkit-appearance: none; appearance: none; flex-shrink: 0; width: 16px; height: 16px; margin: 0; padding: 0;
	border: 1px solid #06038d; border-radius: 2px; background: #fff center / 12px 12px no-repeat; cursor: pointer;
}
.sb-courier input[type="checkbox"].sb-courier__check:checked {
	background-color: #06038d;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.sb-courier input[type="checkbox"].sb-courier__check:focus-visible { outline: 2px solid #06038d; outline-offset: 2px; }
.sb-courier input[type="checkbox"].sb-courier__check:disabled { cursor: progress; opacity: .5; }
@media (forced-colors: active) {
	.sb-courier input[type="checkbox"].sb-courier__check { -webkit-appearance: auto; appearance: auto; }
}

/* ---------- Promo box (PromoBox) ---------- */
.sb-cart-page__promo-chip {
	display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; padding: 4px 10px; border: 1px solid rgba(6, 3, 141, .4);
	border-radius: 9999px; background: #fff; color: #06038d; font-size: 11px; line-height: 16px; font-weight: 600; cursor: pointer;
}
.sb-cart-page__promo-chip:hover { background: rgba(6, 3, 141, .05); }
/* 16 Oct: hover/focus were unreadable -- legacy button:hover/:focus rules
   (BB skin) turned the text white and the focus fill dark red on a near-white
   chip. Own every state: navy #06038d text throughout (rest ~15:1 on white,
   hover ~14:1 on the 6% navy tint, focus ~15:1 on white + navy ring). */
html body .sb-cart-page button.sb-cart-page__promo-chip,
html body .sb-cart-page button.sb-cart-page__promo-chip:hover,
html body .sb-cart-page button.sb-cart-page__promo-chip:focus,
html body .sb-cart-page button.sb-cart-page__promo-chip:active {
	color: #06038d !important;
	text-decoration: none !important;
	box-shadow: none !important;
}
html body .sb-cart-page button.sb-cart-page__promo-chip { background: #fff !important; border-color: rgba(6, 3, 141, .4) !important; }
html body .sb-cart-page button.sb-cart-page__promo-chip:hover,
html body .sb-cart-page button.sb-cart-page__promo-chip:active { background: #f0f0f9 !important; border-color: #06038d !important; }
html body .sb-cart-page button.sb-cart-page__promo-chip:focus { background: #fff !important; border-color: #06038d !important; outline: none !important; }
html body .sb-cart-page button.sb-cart-page__promo-chip:focus-visible { outline: 2px solid #06038d !important; outline-offset: 2px !important; }
html body .sb-cart-page button.sb-cart-page__promo-chip:focus-visible:hover { background: #f0f0f9 !important; }
.sb-cart-page .sb-cart-page__promo-msg,
.sb-cart-page .sb-cart-page__promo-msg.is-error { color: #58677e; font-size: 12px; line-height: 16px; display: flex; align-items: center; gap: 4px; }
.sb-cart-page .sb-cart-page__promo-msg.is-ok { color: #15803d; }
.sb-cart-page__promo-auto { display: flex; align-items: center; gap: 4px; margin: 0; font-size: 12px; line-height: 16px; color: #15803d; }

/* ---------- Undo, line errors (Cart.tsx); tick boxes + Remove selected removed 16 Oct ---------- */
.sb-cart-undo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; font-size: 12px; line-height: 16px; color: #58677e; border-bottom: 1px solid #e2e8f0; }
.sb-cart-undo__btn { padding: 0; border: 0; background: none; font-size: 12px; font-weight: 600; color: #06038d; cursor: pointer; }
.sb-cart-undo__btn:hover { text-decoration: underline; }
.sb-cart-line-error { margin: 6px 0 0; font-size: 12px; line-height: 16px; color: #dc2626; }

/* ---------- Auth dialog: R03 tabs (quote errand only), R09 hints ---------- */
#sb-checkout-auth .sb-auth-tabs { display: none; }
#sb-checkout-auth[data-sb-auth-intent="quote"] .sb-auth-tabs,
#sb-checkout-auth.is-quote .sb-auth-tabs {
	display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 0 0 12px; padding: 4px; height: 40px; box-sizing: border-box;
	border-radius: 6px; background: #f1f5f9; color: #58677e;
}
#sb-checkout-auth .sb-auth-tabs__tab {
	display: inline-flex; align-items: center; justify-content: center; padding: 6px 12px; border: 0; border-radius: 4px;
	background: transparent; color: inherit; font-size: 14px; line-height: 20px; font-weight: 500; cursor: pointer;
}
#sb-checkout-auth .sb-auth-tabs__tab.is-active { background: #fff; color: #141d2e; box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
#sb-checkout-auth .sb-auth-tabs__tab:focus-visible { outline: 2px solid #06038d; outline-offset: 2px; }
/* In the quote errand the tabs replace Back, the divider and the create CTA. */
#sb-checkout-auth[data-sb-auth-intent="quote"] .sb-checkout-auth__back,
#sb-checkout-auth[data-sb-auth-intent="quote"] .sb-checkout-auth__divider,
#sb-checkout-auth[data-sb-auth-intent="quote"] [data-sb-auth-create-cta] { display: none !important; }
#sb-checkout-auth[data-sb-auth-intent="quote"] .sb-checkout-auth__panel { max-height: min(90vh, 680px); overflow-y: auto; }

#sb-checkout-auth .sb-auth-hint,
form.woocommerce-form-register .sb-auth-hint { margin: 4px 0 0; font-size: 11px; line-height: 16px; color: #58677e; }
form.woocommerce-form-register .sb-auth-email-error { margin: 4px 0 0; font-size: 12px; line-height: 16px; color: #dc2626; }
form.woocommerce-form-register .sb-auth-email-error a,
#sb-checkout-auth .sb-auth-email-error a,
#sb-checkout-auth .sb-checkout-auth__inline-link { font-weight: 600; color: #06038d; text-decoration: underline; text-underline-offset: 2px; background: none; border: 0; padding: 0; font-size: inherit; cursor: pointer; }
#sb-checkout-auth .sb-auth-consent--flagged { outline: 2px solid #dc2626; border-radius: 6px; }
#sb-checkout-auth .sb-auth-reset { display: flex; flex-direction: column; gap: 12px; }
#sb-checkout-auth .sb-auth-reset__fields { display: flex; flex-direction: column; gap: 6px; }
#sb-checkout-auth .sb-auth-reset__intro,
#sb-checkout-auth .sb-auth-reset__sent { margin: 0; font-size: 14px; line-height: 20px; color: #141d2e; }
#sb-checkout-auth .sb-auth-reset__back { align-self: flex-start; padding: 0; border: 0; background: none; font-size: 12px; color: #58677e; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }

/* Phones: the quote dialog is a full-screen sheet, button pinned to the bottom. */
@media (max-width: 699px) {
	#sb-checkout-auth[data-sb-auth-intent="quote"] .sb-checkout-auth__panel {
		position: fixed; inset: 0; width: 100%; max-width: none; height: 100dvh; max-height: none; border-radius: 0; margin: 0;
		overflow-y: auto; padding-bottom: 88px; box-sizing: border-box;
	}
	#sb-checkout-auth[data-sb-auth-intent="quote"] .sb-checkout-auth__panel button[type="submit"].sb-checkout-auth__btn {
		position: fixed; left: 16px; right: 16px; bottom: 16px; width: auto; z-index: 2;
	}
}

@media (forced-colors: active) {
	#sb-checkout-auth .sb-auth-tabs__tab.is-active { outline: 2px solid CanvasText; }
	.sb-cart-sum__terms:focus-visible,
	#sb-checkout-auth .sb-auth-tabs__tab:focus-visible { outline-color: Highlight; }
}