/**
 * Sky Web Design — commerce styling.
 *
 * Ports the design prototype's basket / checkout / login / mini-basket CSS
 * onto the theme's --skyweb-* tokens so light and dark adapt automatically.
 * Scopes: .skyweb-commerce (cart, checkout, auth pages), #skywebMiniBasket
 * (drawer) and .skyweb-cart-count (header badge, shared with the toolkit
 * Cart Button widget).
 */

.skyweb-commerce,
#skywebMiniBasket {
	/* Prototype token mapping */
	--swc-ink: var(--skyweb-dark-color);
	--swc-ink-dim: var(--skyweb-muted-color);
	--swc-ink-mute: color-mix(in oklab, var(--skyweb-dark-color) 34%, var(--skyweb-surface-color));
	--swc-bg: var(--skyweb-bg-color);
	--swc-bg-card: var(--skyweb-surface-color);
	--swc-bg-soft: color-mix(in oklab, var(--skyweb-dark-color) 3%, var(--skyweb-surface-color));
	--swc-line: var(--skyweb-border-color);
	--swc-line-soft: var(--skyweb-border-soft-color);
	--swc-brand: var(--skyweb-primary-color);
	--swc-brand-tint: color-mix(in oklab, var(--skyweb-primary-color) 10%, var(--skyweb-surface-color));
	--swc-green: var(--skyweb-success-color, #2FB27B);
	--swc-rose: var(--skyweb-danger-color, #FF7A7A);
	--swc-btn-ink: var(--skyweb-inverse-color);
	--swc-r-lg: 22px;
	color: var(--swc-ink);
}

/* ---- Page scaffolding -------------------------------------------- */
/* Commerce pages hide the theme jumbotron (the design carries its own hero).
   On plain pages the jumbotron's .menu__height spacer is what reserves the
   floating navbar's height, so reserve it on the page section instead —
   above WooCommerce's notices, which print before .skyweb-commerce. */
body.nav-floating.woocommerce-cart .page-section,
body.nav-floating.woocommerce-checkout .page-section,
body.nav-floating.woocommerce-account .page-section { padding-top: calc(var(--navbar-height, 84px) + 34px); }

/* Notices printed above the layout (cart changes, errors) */
body.woocommerce-cart .woocommerce-notices-wrapper,
body.woocommerce-checkout .woocommerce-notices-wrapper { display: block; }
body.woocommerce-cart .woocommerce-notices-wrapper:not(:empty),
body.woocommerce-checkout .woocommerce-notices-wrapper:not(:empty) { margin-bottom: 24px; }

.skyweb-commerce .shop-crumbs { font-size: 13px; color: var(--swc-ink-dim); margin-bottom: 32px; }
.skyweb-commerce .shop-crumbs a { color: var(--swc-ink); text-decoration: none; }
.skyweb-commerce .shop-crumbs a:hover { color: var(--swc-brand); }

.skyweb-commerce .shop-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: end; margin-bottom: 42px; }
.skyweb-commerce .shop-eyebrow { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--swc-line); background: var(--swc-bg-card); border-radius: 999px; padding: 6px 12px; font-size: 12px; font-weight: 700; color: var(--swc-brand); margin-bottom: 18px; }
.skyweb-commerce .shop-hero h1 { margin: 0; font-family: var(--skyweb-heading-font-family); font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; font-size: clamp(38px, 5vw, 70px); max-width: 10ch; color: var(--skyweb-heading-color); }
.skyweb-commerce .shop-hero > div > p { font-size: 18px; color: var(--swc-ink-dim); line-height: 1.55; max-width: 54ch; margin: 18px 0 0; }

.skyweb-commerce .shop-promise { background: var(--swc-bg-card); border: 1px solid var(--swc-line); border-radius: var(--swc-r-lg); padding: 22px; display: grid; gap: 12px; }
.skyweb-commerce .shop-promise > div { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: var(--swc-ink-dim); }
.skyweb-commerce .shop-promise p { margin: 0; }
.skyweb-commerce .shop-promise span { width: 22px; height: 22px; border-radius: 50%; background: var(--swc-brand-tint); color: var(--swc-brand); display: grid; place-items: center; flex-shrink: 0; font-size: 12px; font-weight: 800; }

/* ---- Buttons ------------------------------------------------------ */
.skyweb-commerce .shop-line-btn,
#skywebMiniBasket .shop-line-btn,
.skyweb-commerce .checkout-button,
.skyweb-commerce button[type="submit"].shop-line-btn {
	border: 0; border-radius: 999px; background: var(--swc-ink); color: var(--swc-btn-ink);
	font-family: inherit; font-size: 13px; font-weight: 600; padding: 10px 14px;
	display: inline-flex; align-items: center; justify-content: center; gap: 7px;
	cursor: pointer; transition: all .18s ease; white-space: nowrap; text-decoration: none; line-height: 1.4;
}
.skyweb-commerce .shop-line-btn:hover,
#skywebMiniBasket .shop-line-btn:hover,
.skyweb-commerce .checkout-button:hover { background: var(--swc-brand); color: #fff; transform: translateY(-1px); }
/* !important: the theme's button component styles <button> elements with
   rules that outrank this scope. */
.skyweb-commerce .shop-line-btn.secondary,
#skywebMiniBasket .shop-line-btn.secondary { background: var(--swc-bg-card) !important; color: var(--swc-ink) !important; border: 1px solid var(--swc-line) !important; border-radius: 999px !important; }
.skyweb-commerce .shop-line-btn.secondary:hover,
#skywebMiniBasket .shop-line-btn.secondary:hover { border-color: var(--swc-ink) !important; background: var(--swc-bg-soft) !important; color: var(--swc-ink) !important; transform: none; }
.skyweb-commerce .shop-line-btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; }

/* ---- Commerce grid / cards (basket page) -------------------------- */
.skyweb-commerce .commerce-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 24px; align-items: start; }
.skyweb-commerce .commerce-card { background: var(--swc-bg-card); border: 1px solid var(--swc-line); border-radius: var(--swc-r-lg); box-shadow: 0 1px 2px color-mix(in oklab, var(--skyweb-shadow-color, #0E1116) 6%, transparent); }
.skyweb-commerce .commerce-card-head { padding: 22px 24px; border-bottom: 1px solid var(--swc-line); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.skyweb-commerce .commerce-card-head h2,
.skyweb-commerce .summary-card h2,
.skyweb-commerce .form-section h2 { margin: 0; font-family: var(--skyweb-heading-font-family); font-size: 22px; font-weight: 700; letter-spacing: -0.02em; color: var(--skyweb-heading-color); }
.skyweb-commerce .commerce-card-body { padding: 8px 24px; }
.skyweb-commerce .commerce-card-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 24px; border-top: 1px solid var(--swc-line); }
.skyweb-commerce .commerce-card-foot .coupon { display: flex; gap: 8px; flex: 1; min-width: 0; max-width: 340px; }
.skyweb-commerce .commerce-card-foot .coupon input { flex: 1; min-width: 0; }

/* ---- Basket lines -------------------------------------------------- */
.skyweb-commerce .basket-line,
#skywebMiniBasket .basket-line { display: grid; grid-template-columns: 52px 1fr auto; gap: 14px; align-items: start; padding: 16px 0; border-bottom: 1px solid var(--swc-line-soft); }
.skyweb-commerce .basket-line:last-child,
#skywebMiniBasket .basket-line:last-child { border-bottom: 0; }

.skyweb-commerce .line-icon,
#skywebMiniBasket .line-icon { width: 52px; height: 52px; border-radius: 14px; background: var(--swc-brand-tint); color: var(--swc-brand); display: grid; place-items: center; font-weight: 800; font-family: var(--skyweb-heading-font-family); overflow: hidden; }
.skyweb-commerce .line-icon img,
#skywebMiniBasket .line-icon img { width: 100%; height: 100%; object-fit: cover; display: block; }
.skyweb-commerce .line-icon .line-initials,
#skywebMiniBasket .line-icon .line-initials { font-size: 15px; letter-spacing: .02em; }
.skyweb-commerce .line-icon svg,
#skywebMiniBasket .line-icon svg { width: 24px; height: 24px; }

.skyweb-commerce .line-title,
#skywebMiniBasket .line-title { display: block; font-size: 15px; font-weight: 700; letter-spacing: -0.01em; color: var(--swc-ink); text-decoration: none; }
.skyweb-commerce a.line-title:hover,
#skywebMiniBasket a.line-title:hover { color: var(--swc-brand); }
.skyweb-commerce .line-meta,
#skywebMiniBasket .line-meta { font-size: 12.5px; color: var(--swc-ink-dim); margin-top: 2px; }

/* "Order details" disclosure — collapses the line-item meta (domain,
   requirements, …) that used to render as a wall of text. */
.skyweb-commerce .line-details,
#skywebMiniBasket .line-details { margin-top: 6px; font-size: 12.5px; }
.skyweb-commerce .line-details summary,
#skywebMiniBasket .line-details summary { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; list-style: none; color: var(--swc-brand); font-weight: 600; user-select: none; }
.skyweb-commerce .line-details summary::-webkit-details-marker,
#skywebMiniBasket .line-details summary::-webkit-details-marker { display: none; }
.skyweb-commerce .line-details summary::after,
#skywebMiniBasket .line-details summary::after { content: ""; width: 7px; height: 7px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(45deg) translateY(-1px); transition: transform .16s ease; }
.skyweb-commerce .line-details[open] summary::after,
#skywebMiniBasket .line-details[open] summary::after { transform: rotate(225deg) translateY(-2px); }
.skyweb-commerce .line-details-body,
#skywebMiniBasket .line-details-body { margin-top: 8px; color: var(--swc-ink-dim); }
.skyweb-commerce .line-details-body dl.variation,
#skywebMiniBasket .line-details-body dl.variation { display: grid; grid-template-columns: max-content 1fr; gap: 3px 10px; margin: 0; }
.skyweb-commerce .line-details-body dl.variation dt,
#skywebMiniBasket .line-details-body dl.variation dt { font-weight: 600; color: var(--swc-ink); margin: 0; }
.skyweb-commerce .line-details-body dl.variation dd,
#skywebMiniBasket .line-details-body dl.variation dd { margin: 0; }
.skyweb-commerce .line-details-body dl.variation dd p,
#skywebMiniBasket .line-details-body dl.variation dd p { display: inline; margin: 0; }
.skyweb-commerce .line-backorder { display: block; color: var(--skyweb-warning-color, #d97706); }
.skyweb-commerce .line-price,
#skywebMiniBasket .line-price { font-size: 13px; font-weight: 700; color: var(--swc-ink); white-space: nowrap; }
#skywebMiniBasket .line-qty-note { display: inline-block; font-size: 12px; color: var(--swc-ink-dim); margin-top: 10px; }

.skyweb-commerce .qty-stepper,
#skywebMiniBasket .qty-stepper { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--swc-line); border-radius: 999px; background: var(--swc-bg-card); padding: 3px; margin-top: 10px; }
.skyweb-commerce .qty-stepper button,
#skywebMiniBasket .qty-stepper button { width: 26px; height: 26px; border: 0; border-radius: 50%; background: transparent; color: var(--swc-ink); cursor: pointer; font-size: 16px; line-height: 1; display: grid; place-items: center; padding: 0; }
.skyweb-commerce .qty-stepper button:hover,
#skywebMiniBasket .qty-stepper button:hover { background: var(--swc-bg-soft); }
.skyweb-commerce .qty-stepper span,
#skywebMiniBasket .qty-stepper span { min-width: 24px; text-align: center; font-size: 12px; font-weight: 700; }
.skyweb-commerce .qty-stepper .qty-input { width: 34px; min-width: 0; border: 0; background: transparent; text-align: center; font-size: 12px; font-weight: 700; color: var(--swc-ink); padding: 0; appearance: textfield; -moz-appearance: textfield; }
.skyweb-commerce .qty-stepper .qty-input::-webkit-outer-spin-button,
.skyweb-commerce .qty-stepper .qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.skyweb-commerce .qty-stepper .qty-input:focus { outline: none; }

.skyweb-commerce .line-remove,
#skywebMiniBasket .line-remove { display: inline-block; border: 0; background: none; color: var(--swc-ink-mute); font: inherit; font-size: 12px; cursor: pointer; padding: 0; margin: 8px 0 0 14px; text-decoration: none; }
.skyweb-commerce .line-remove:hover,
#skywebMiniBasket .line-remove:hover { color: var(--swc-rose); }
.skyweb-commerce .qty-stepper + .line-remove { margin-left: 14px; }

/* Larger lines on the basket page */
.skyweb-commerce .basket-page-line { grid-template-columns: 62px 1fr 120px; gap: 18px; padding: 20px 0; }
.skyweb-commerce .basket-page-line .line-icon { width: 62px; height: 62px; border-radius: 18px; }
.skyweb-commerce .basket-page-line .line-title { font-size: 17px; }
.skyweb-commerce .basket-page-line .line-price { text-align: right; font-size: 15px; }

/* ---- Empty basket -------------------------------------------------- */
.skyweb-commerce .basket-empty,
#skywebMiniBasket .basket-empty { padding: 36px 20px; text-align: center; color: var(--swc-ink-dim); display: flex; flex-direction: column; align-items: center; gap: 14px; }
.skyweb-commerce .basket-empty .empty-icon,
#skywebMiniBasket .basket-empty .empty-icon { width: 58px; height: 58px; border-radius: 18px; background: var(--swc-bg-card); border: 1px solid var(--swc-line); display: grid; place-items: center; color: var(--swc-brand); }
.skyweb-commerce .basket-empty h3,
#skywebMiniBasket .basket-empty h3 { margin: 0; font-size: 20px; color: var(--swc-ink); }
.skyweb-commerce .basket-empty p,
#skywebMiniBasket .basket-empty p { margin: 0; }
#skywebMiniBasket .basket-empty { flex: 1; justify-content: center; }

/* ---- Summary card --------------------------------------------------- */
.skyweb-commerce .summary-card { position: sticky; top: 104px; padding: 24px; }
.skyweb-commerce .summary-card h2 { margin-bottom: 18px; }
.skyweb-commerce .summary-row,
#skywebMiniBasket .summary-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 14px; color: var(--swc-ink-dim); margin-bottom: 8px; }
.skyweb-commerce .summary-row strong,
#skywebMiniBasket .summary-row strong { font-size: 15px; font-weight: 700; color: var(--swc-ink); letter-spacing: -0.01em; }
.skyweb-commerce .summary-row .summary-discount { color: var(--swc-green); font-weight: 600; }
.skyweb-commerce .summary-row .summary-discount .woocommerce-remove-coupon { margin-left: 6px; color: var(--swc-ink-mute); text-decoration: none; }
.skyweb-commerce .summary-row .summary-discount .woocommerce-remove-coupon:hover { color: var(--swc-rose); }
.skyweb-commerce .summary-total { border-top: 1px dashed var(--swc-line); padding-top: 14px; margin-top: 14px; }
.skyweb-commerce .summary-total strong,
#skywebMiniBasket .summary-total strong { font-size: 30px; letter-spacing: -0.03em; }
.skyweb-commerce .summary-total-price { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.skyweb-commerce .summary-period { font-size: 12.5px; color: var(--swc-ink-dim); font-weight: 500; }
.skyweb-commerce .summary-note { font-size: 12.5px; color: var(--swc-ink-dim); line-height: 1.5; margin: 12px 0 0; }
.skyweb-commerce .summary-note a { color: var(--swc-brand); }
.skyweb-commerce .summary-actions { display: grid; gap: 10px; margin-top: 20px; }
.skyweb-commerce .summary-actions .shop-line-btn,
.skyweb-commerce .summary-actions .checkout-button { width: 100%; padding: 13px 18px; font-size: 14px; }

/* Shipping rows (only when a physical product sneaks in) */
.skyweb-commerce .shipping-totals { font-size: 14px; color: var(--swc-ink-dim); margin-bottom: 8px; }

/* ---- Checkout layout ------------------------------------------------ */
.skyweb-commerce .checkout-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 24px; align-items: start; }
.skyweb-commerce .checkout-form { display: grid; gap: 18px; align-content: start; }
.skyweb-commerce #customer_details { display: grid; gap: 18px; }
.skyweb-commerce .form-section { background: var(--swc-bg-card); border: 1px solid var(--swc-line); border-radius: var(--swc-r-lg); padding: 24px; }
.skyweb-commerce .form-section h2 { margin-bottom: 18px; }

/* ---- Fields ---------------------------------------------------------- */
.skyweb-commerce .field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.skyweb-commerce .field-grid .form-row,
.skyweb-commerce .field-grid .field { margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; grid-column: 1 / -1; float: none; width: auto; min-width: 100%; order: 20; }
.skyweb-commerce .field-grid .form-row-first { grid-column: 1; }
.skyweb-commerce .field-grid .form-row-last { grid-column: 2; }

/* Billing layout pinned by field ID — WooCommerce's address-i18n JS rewrites
   the form-row-* classes and re-sorts address fields per country locale, so
   classes can't be trusted. Matches the checkout.html reference rows:
   name pair / email + phone / country / address / city + postcode / county. */
.skyweb-commerce #billing_first_name_field { order: 1; grid-column: 1; }
.skyweb-commerce #billing_last_name_field  { order: 2; grid-column: 2; }
.skyweb-commerce #billing_company_field    { order: 3; grid-column: 1 / -1; }
.skyweb-commerce #billing_email_field      { order: 4; grid-column: 1; }
.skyweb-commerce #billing_phone_field      { order: 5; grid-column: 2; }
.skyweb-commerce #billing_country_field    { order: 6; grid-column: 1 / -1; }
.skyweb-commerce #billing_address_1_field  { order: 7; grid-column: 1 / -1; }
.skyweb-commerce #billing_address_2_field  { order: 8; grid-column: 1 / -1; }
.skyweb-commerce #billing_city_field       { order: 9; grid-column: 1; }
.skyweb-commerce #billing_postcode_field   { order: 10; grid-column: 2; }
.skyweb-commerce #billing_state_field      { order: 11; grid-column: 1 / -1; }
.skyweb-commerce .form-row label,
.skyweb-commerce .field label { font-size: 12px; font-weight: 700; color: var(--swc-ink-dim); margin: 0; }
.skyweb-commerce .form-row label .required { color: var(--swc-rose); text-decoration: none; }
.skyweb-commerce .form-row .woocommerce-input-wrapper { display: block; }
.skyweb-commerce .form-row input.input-text,
.skyweb-commerce .form-row textarea,
.skyweb-commerce .form-row select,
.skyweb-commerce .field input,
.skyweb-commerce .field select,
.skyweb-commerce .field textarea,
.skyweb-commerce .coupon input {
	width: 100%; min-width: 100%; border: 1px solid var(--swc-line); border-radius: 13px; background: var(--swc-bg);
	color: var(--swc-ink); font: inherit; font-size: 14.5px; padding: 13px 14px; outline: none;
	transition: border-color .16s ease, box-shadow .16s ease; box-shadow: none;
}
.skyweb-commerce .form-row textarea,
.skyweb-commerce .field textarea { min-height: 96px; resize: vertical; }
.skyweb-commerce .form-row input.input-text:focus,
.skyweb-commerce .form-row textarea:focus,
.skyweb-commerce .form-row select:focus,
.skyweb-commerce .field input:focus,
.skyweb-commerce .field textarea:focus,
.skyweb-commerce .coupon input:focus { border-color: var(--swc-brand); box-shadow: 0 0 0 3px color-mix(in oklab, var(--swc-brand) 14%, transparent); }
.skyweb-commerce ::placeholder { color: var(--swc-ink-mute); }

/* selectWoo / select2 (country & state dropdowns) */
.skyweb-commerce .select2-container .select2-selection--single { height: auto; border: 1px solid var(--swc-line); border-radius: 13px; background: var(--swc-bg); transition: border-color .16s ease, box-shadow .16s ease; }
.skyweb-commerce .select2-container .select2-selection--single .select2-selection__rendered { color: var(--swc-ink); line-height: 1.5; padding: 13px 32px 13px 14px; font-size: 14.5px; }
.skyweb-commerce .select2-container .select2-selection--single .select2-selection__arrow { height: 100%; right: 10px; }
.skyweb-commerce .select2-container--focus .select2-selection--single,
.skyweb-commerce .select2-container--open .select2-selection--single { border-color: var(--swc-brand); box-shadow: 0 0 0 3px color-mix(in oklab, var(--swc-brand) 14%, transparent); }
.select2-dropdown { background: var(--skyweb-surface-color, #fff); border: 1px solid var(--skyweb-border-color, #e5e5e5); border-radius: 13px; color: var(--skyweb-dark-color, #111); overflow: hidden; }
.select2-dropdown .select2-search__field { border: 1px solid var(--skyweb-border-color, #e5e5e5) !important; border-radius: 9px; background: var(--skyweb-bg-color, #fff); color: var(--skyweb-dark-color, #111); padding: 8px 10px; }
.select2-results__option { font-size: 14px; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--skyweb-primary-color, #2E5BFF); }

/* Checkboxes / auth rows */
.skyweb-commerce .auth-check { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--swc-ink-dim); cursor: pointer; font-weight: 400; }
.skyweb-commerce .auth-check input { width: 17px; height: 17px; accent-color: var(--swc-brand); cursor: pointer; margin: 0; flex: 0 0 auto; }
.skyweb-commerce .auth-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.skyweb-commerce .auth-link { font-size: 13.5px; font-weight: 600; color: var(--swc-brand); text-decoration: none; }
.skyweb-commerce .auth-link:hover { text-decoration: underline; }

/* ---- Checkout payment section ---------------------------------------- */
.skyweb-commerce .checkout-payment-section #payment { background: transparent; border-radius: 0; }
.skyweb-commerce .checkout-payment-section ul.wc_payment_methods { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.skyweb-commerce .checkout-payment-section li.wc_payment_method { border: 1px solid var(--swc-line); border-radius: 14px; padding: 14px 16px; background: var(--swc-bg); }
/* Keep the method title on one line; the card-brand icon sprite shrinks and,
   on narrow screens, wraps below the title instead of breaking it mid-word. */
.skyweb-commerce .checkout-payment-section li.wc_payment_method > label { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; font-size: 14px; font-weight: 600; color: var(--swc-ink) !important; cursor: pointer; margin: 0; white-space: nowrap; }
.skyweb-commerce .checkout-payment-section li.wc_payment_method > label img { height: 20px; width: auto; max-width: 100%; flex: 0 1 auto; }
.skyweb-commerce .checkout-payment-section li.wc_payment_method > input[type="radio"] { accent-color: var(--swc-brand); margin-right: 4px; }
.skyweb-commerce .checkout-payment-section .payment_box { font-size: 13.5px; color: var(--swc-ink-dim); margin-top: 10px; }
.skyweb-commerce .checkout-payment-section .payment_box p { margin: 0 0 8px; }
.skyweb-commerce .woocommerce-terms-and-conditions-wrapper { font-size: 13px; color: var(--swc-ink-dim); margin: 16px 0 0; }
.skyweb-commerce .woocommerce-privacy-policy-text { margin: 0; }
.skyweb-commerce .woocommerce-privacy-policy-text p { margin: 0 0 16px; font-size: 13px; color: var(--swc-ink-dim); line-height: 1.55; }
.skyweb-commerce .woocommerce-privacy-policy-text a { color: var(--swc-brand); }
.skyweb-commerce .form-row.place-order { margin: 16px 0 0; padding: 0; display: block; }
/* !important: the theme button component and the Stripe gateway both restyle
   .button/.alt with rules that outrank this scope. */
.skyweb-commerce #place_order { width: 100%; border: 0; border-radius: 999px !important; background: var(--swc-ink) !important; color: var(--swc-btn-ink) !important; font-family: inherit; font-size: 14px; font-weight: 600; padding: 14px 18px; cursor: pointer; transition: all .18s ease; }
.skyweb-commerce #place_order:hover { background: var(--swc-brand) !important; color: #fff !important; transform: translateY(-1px); }
.skyweb-commerce .checkout-button { border-radius: 999px !important; background: var(--swc-ink) !important; color: var(--swc-btn-ink) !important; text-transform: none !important; }
.skyweb-commerce .checkout-button:hover { background: var(--swc-brand) !important; color: #fff !important; }

/* Checkout summary card internals — the theme's WooCommerce stylesheet gives
   .woocommerce-checkout-review-order-table a white card treatment that breaks
   dark mode; neutralise it, the summary-card already provides the card. */
.skyweb-commerce #order_review,
.skyweb-commerce .woocommerce-checkout-review-order-table { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; }
.skyweb-commerce .summary-card .review-items { padding: 0; max-height: none; }
.skyweb-commerce .summary-card .review-items .basket-line { grid-template-columns: 44px 1fr auto; gap: 12px; padding: 12px 0; }
.skyweb-commerce .summary-card .review-items .line-icon { width: 44px; height: 44px; border-radius: 12px; }
.skyweb-commerce .summary-card .summary-rows { border-top: 1px dashed var(--swc-line); padding-top: 14px; margin-top: 14px; }
/* Long subscription price strings ("£39.00 / month") — let them wrap instead
   of squeezing the line title. */
.skyweb-commerce .summary-card .line-price,
#skywebMiniBasket .line-price { white-space: normal; text-align: right; max-width: 110px; }

/* WooCommerce notices inside commerce pages */
.skyweb-commerce .woocommerce-NoticeGroup,
.skyweb-commerce .woocommerce-notices-wrapper { grid-column: 1 / -1; }

/* ---- Auth (login/register) ------------------------------------------- */
.skyweb-commerce .auth-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; max-width: 980px; }
.skyweb-commerce .auth-layout-single { grid-template-columns: 1fr; max-width: 520px; }
.skyweb-commerce .auth-card { display: flex; flex-direction: column; gap: 18px; }
.skyweb-commerce .auth-card h2 { margin-bottom: 0; }
.skyweb-commerce .auth-card .shop-line-btn { width: 100%; padding: 13px 18px; font-size: 14px; }
.skyweb-commerce .auth-card-alt { background: color-mix(in oklab, var(--swc-brand) 4%, var(--swc-bg-card)); }
.skyweb-commerce .auth-sub { font-size: 14.5px; color: var(--swc-ink-dim); line-height: 1.55; margin: -8px 0 0; }
.skyweb-commerce .auth-card .summary-note { margin: 0; }

/* Magic sign-in views (Skyweb Toolkit's Skyweb_Magic_Login drives these) */
.skyweb-commerce .auth-card [hidden] { display: none !important; }
.skyweb-commerce .auth-card [data-skyweb-ml-view],
.skyweb-commerce .auth-card [data-skyweb-ml-view] form,
.skyweb-commerce .auth-card > div:not([data-skyweb-ml-view]) { display: flex; flex-direction: column; gap: 18px; }
.skyweb-commerce .auth-card [data-skyweb-ml-view] .auth-sub { margin-top: -10px; }
.skyweb-commerce .auth-error { margin: 0; font-size: 13px; color: var(--swc-rose); }
.skyweb-commerce .auth-row-center { justify-content: center; }
.skyweb-commerce .auth-divider { display: flex; align-items: center; gap: 12px; color: var(--swc-ink-mute); font-size: 12.5px; }
.skyweb-commerce .auth-divider::before,
.skyweb-commerce .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--swc-line); }
.skyweb-commerce .auth-code-input { font-family: "JetBrains Mono", Menlo, Consolas, monospace; font-size: 22px !important; letter-spacing: 10px; text-align: center; font-weight: 700; }

/* ---- Header cart badge (navbar button + toolkit Cart Button widget) --- */
.skyweb-cart-count {
	position: absolute; right: -4px; top: -5px; min-width: 18px; height: 18px; padding: 0 5px;
	border-radius: 999px; background: var(--skyweb-primary-color); color: #fff;
	font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center;
	line-height: 1; border: 2px solid var(--skyweb-surface-color);
}
.skyweb-cart-count.is-empty { display: none; }

/* ---- Mini basket drawer ----------------------------------------------- */
#skywebMiniBasket { position: fixed; inset: 0; z-index: 10000; pointer-events: none; }
#skywebMiniBasket.is-open { pointer-events: auto; }
#skywebMiniBasket .mini-basket-backdrop { position: absolute; inset: 0; background: rgba(5, 7, 12, .42); opacity: 0; transition: opacity .22s ease; }
#skywebMiniBasket.is-open .mini-basket-backdrop { opacity: 1; }
#skywebMiniBasket .mini-basket-panel {
	position: absolute; right: 0; top: 0; width: min(440px, 100vw); height: 100%;
	background: var(--swc-bg); border-left: 1px solid var(--swc-line);
	box-shadow: var(--skyweb-drawer-shadow, 0 24px 70px rgba(14, 17, 22, .3));
	transform: translateX(104%); transition: transform .28s cubic-bezier(.22, .8, .26, 1);
	display: flex; flex-direction: column;
}
#skywebMiniBasket.is-open .mini-basket-panel { transform: translateX(0); }
#skywebMiniBasket .mini-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 24px; border-bottom: 1px solid var(--swc-line); flex-shrink: 0; }
#skywebMiniBasket .mini-title { font-family: var(--skyweb-heading-font-family); font-size: 22px; font-weight: 700; letter-spacing: -0.02em; color: var(--swc-ink); }
#skywebMiniBasket .mini-close { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--swc-line); background: var(--swc-bg-card); color: var(--swc-ink); display: grid; place-items: center; cursor: pointer; padding: 0; }
#skywebMiniBasket .mini-close svg { width: 16px; height: 16px; }
#skywebMiniBasket .shopping_cart_content { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-height: 0; }
#skywebMiniBasket .mini-items { padding: 12px 18px; overflow: auto; flex: 1; }
#skywebMiniBasket .mini-foot { border-top: 1px solid var(--swc-line); padding: 20px 24px 24px; background: var(--swc-bg-card); flex-shrink: 0; }
#skywebMiniBasket .mini-foot .summary-row strong { font-size: 24px; letter-spacing: -0.03em; }
#skywebMiniBasket .mini-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px; }
#skywebMiniBasket.is-loading .mini-items { opacity: .5; pointer-events: none; transition: opacity .15s ease; }

/* ---- Responsive -------------------------------------------------------- */
@media (max-width: 920px) {
	.skyweb-commerce .shop-hero,
	.skyweb-commerce .commerce-grid,
	.skyweb-commerce .checkout-layout,
	.skyweb-commerce .auth-layout { grid-template-columns: 1fr; }
	.skyweb-commerce .shop-hero { gap: 24px; }
	.skyweb-commerce .summary-card { position: static; }
}
@media (max-width: 640px) {
	#skywebMiniBasket .mini-basket-panel { width: 100vw; }
	#skywebMiniBasket .mini-actions { grid-template-columns: 1fr; }
	.skyweb-commerce .field-grid { grid-template-columns: 1fr; }
	.skyweb-commerce .field-grid .form-row-first,
	.skyweb-commerce .field-grid .form-row-last { grid-column: 1 / -1; }
	.skyweb-commerce #billing_first_name_field,
	.skyweb-commerce #billing_last_name_field,
	.skyweb-commerce #billing_email_field,
	.skyweb-commerce #billing_phone_field,
	.skyweb-commerce #billing_city_field,
	.skyweb-commerce #billing_postcode_field { grid-column: 1 / -1; }
	.skyweb-commerce .basket-page-line { grid-template-columns: 52px 1fr; position: relative; }
	.skyweb-commerce .basket-page-line .line-icon { width: 52px; height: 52px; border-radius: 14px; }
	.skyweb-commerce .basket-page-line .line-price { grid-column: 2; text-align: left; }
	.skyweb-commerce .shop-hero h1 { max-width: none; }
	.skyweb-commerce .commerce-card-body,
	.skyweb-commerce .commerce-card-head,
	.skyweb-commerce .commerce-card-foot { padding-left: 18px; padding-right: 18px; }
}