/*
 * Cart, checkout, plan builder and account (inc/cart-pages.php), and the home page's slide-out cart.
 * Colours and fonts come from the Elementor kit's globals, with the same values as fallbacks.
 * Controls follow the approved form prototype: pill buttons, rounded fields, charcoal selected state.
 */

html .wms-c, 
html .wms-gs-panel {
	--c-orange: var(--e-global-color-primary, #FF6600);
	--c-black: var(--e-global-color-secondary, #000000);
	--c-text: var(--e-global-color-text, #555555);
	--c-link: var(--e-global-color-accent, #C24E00);
	--c-tint: var(--e-global-color-a1f0e01, #FFF1E6);
	--c-charcoal: var(--e-global-color-d8c6182, #2A2A2A);
	--c-muted: var(--e-global-color-abf451d, #6B6B6B);
	--c-white: var(--e-global-color-df8cd44, #FFFFFF);
	--c-smoke: var(--e-global-color-3405e02, #F8F8F8);
	--c-section-line: var(--e-global-color-3b6329a, #D0D0D0);
	--c-field-line: var(--e-global-color-ef451cd, #C8C8C8);
	--c-divider: var(--e-global-color-53bb350, #E0E0E0);
	--c-ok: var(--e-global-color-1d7a460, #1D7A46);
	--c-ok-tint: var(--e-global-color-e8f5ec0, #E8F5EC);
	--c-error: var(--e-global-color-be2cc0a, #AA0000);
	--c-display: var(--e-global-typography-accent-font-family, "Manrope"), system-ui, sans-serif;
	--c-body: var(--e-global-typography-text-font-family, "Source Sans 3"), system-ui, sans-serif;
	--c-radius: 14px;
	--c-card-radius: 24px;
	--c-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 8px 24px rgba(0, 0, 0, .08);
}
html .wms-c {
	font-family: var(--c-body);
	font-size: 17px;
	line-height: 1.5;
	color: var(--c-black);
}
html .wms-c *, html .wms-gs-panel [data-wms-cart] * { box-sizing: border-box; }
html .wms-c [hidden], html .wms-gs-panel [data-wms-cart] [hidden] { display: none !important; }

/* Headings inside cart components: fixed sizes, not the page heading scale. */
html .wms-c h2, html [data-wms-cart] h2 { margin: 0 0 8px; font: 800 24px/1.25 var(--c-display); text-transform: none; letter-spacing: 0; color: var(--c-black); }
html .wms-c h3, html [data-wms-cart] h3 { margin: 0; font: 700 18px/1.3 var(--c-display); text-transform: none; letter-spacing: 0; color: var(--c-black); }
html .wms-c h2 i, html .wms-c-field i { font: 400 14px var(--c-body); font-style: normal; color: var(--c-muted); }
html .wms-c p, html [data-wms-cart] p { margin: 0; }

/* Page heading on cart pages */
html .wms-c-intro { margin: 0 0 40px; }
html .wms-c-intro h1 { margin: 0 0 8px; font: 800 clamp(32px, 4vw, 48px)/1.1 var(--c-display); letter-spacing: -.01em; color: var(--c-black); }
html .wms-c-intro p { margin: 0; font-size: 19px; color: var(--c-text); }

/* ---------- Buttons and links ---------- */
html .wms-c .wms-c-btn, 
html [data-wms-cart] .wms-c-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 12px 24px;
	border: 0;
	border-radius: 999px;
	background: var(--c-orange);
	color: var(--c-white);
	font: 700 16px/1.2 var(--c-display);
	text-decoration: none;
	cursor: pointer;
	transition: background .15s, color .15s;
}
html .wms-c .wms-c-btn:hover, html .wms-c .wms-c-btn:focus-visible, html [data-wms-cart] .wms-c-btn:hover, html [data-wms-cart] .wms-c-btn:focus-visible { background: var(--c-black); color: var(--c-white); }
html .wms-c .wms-c-btn:focus:not(:focus-visible):not(:hover), html [data-wms-cart] .wms-c-btn:focus:not(:focus-visible):not(:hover) { background: var(--c-orange); color: var(--c-white); }
html .wms-c .wms-c-btn:disabled { background: var(--c-divider); color: var(--c-muted); cursor: not-allowed; }
html .wms-c .wms-c-btn--ghost, html [data-wms-cart] .wms-c-btn--ghost, html .wms-c .wms-c-btn--ghost:focus:not(:focus-visible):not(:hover), html [data-wms-cart] .wms-c-btn--ghost:focus:not(:focus-visible):not(:hover) { background: var(--c-white); color: var(--c-black); box-shadow: inset 0 0 0 1.5px var(--c-black); }
html .wms-c .wms-c-btn--ghost:hover, html [data-wms-cart] .wms-c-btn--ghost:hover { background: var(--c-black); color: var(--c-white); }
html .wms-c .wms-c-btn--block, html [data-wms-cart] .wms-c-btn--block { width: 100%; }
html .wms-c .wms-c-btn--lg { min-height: 56px; font-size: 18px; }
html .wms-c .wms-c-btn--sm, html [data-wms-cart] .wms-c-btn--sm { min-height: 40px; padding: 8px 18px; font-size: 15px; }
html .wms-c .wms-c-btn.is-busy { background: var(--c-charcoal); color: var(--c-white); cursor: progress; }

html .wms-c .wms-c-link, html [data-wms-cart] .wms-c-link {
	display: inline-block;
	padding: 0;
	border: 0;
	background: none;
	font: 700 15px/1.4 var(--c-display);
	color: var(--c-link);
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
html .wms-c .wms-c-link:hover, html [data-wms-cart] .wms-c-link:hover, html .wms-c .wms-c-link:focus, html [data-wms-cart] .wms-c-link:focus { color: var(--c-black); background: none; }
html [data-wms-cart] .wms-c-link--center { display: block; margin: 12px auto 0; text-align: center; }
html .wms-c-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 16px !important; }

/* ---------- Cards, notes, alerts ---------- */
html .wms-c-card {
	padding: 28px;
	background: var(--c-white);
	border: 1px solid var(--c-section-line);
	border-radius: var(--c-card-radius);
}
html .wms-c-note, html [data-wms-cart] .wms-c-note { font-size: 15px; line-height: 1.5; color: var(--c-text); }
html .wms-c-trust { margin-top: 12px !important; font-size: 14px; line-height: 1.45; color: var(--c-muted); text-align: center; }
html .wms-c-trust svg { vertical-align: -3px; margin-right: 4px; color: var(--c-charcoal); }
html .wms-c-alert {
	padding: 14px 16px;
	border-radius: var(--c-radius);
	border: 1px solid var(--c-error);
	background: #FFF5F5;
	color: var(--c-error);
	font-weight: 600;
	font-size: 15px;
}
html .wms-c-alert.is-info { border-color: var(--c-section-line); border-left: 3px solid var(--c-orange); background: var(--c-white); color: var(--c-charcoal); }
html .wms-c-tip, html [data-wms-cart] .wms-c-tip {
	padding: 12px 16px;
	background: var(--c-white);
	border: 1px solid var(--c-divider);
	border-left: 3px solid var(--c-orange);
	border-radius: var(--c-radius);
	font-size: 15px;
	line-height: 1.5;
	color: var(--c-charcoal);
}
html .wms-c-tip strong { color: var(--c-black); }
html .wms-c-tag { display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: var(--c-black); color: var(--c-white); font: 700 11px/1.4 var(--c-display); letter-spacing: .04em; text-transform: uppercase; vertical-align: 2px; }

/* ---------- Fields (match the rounded domain search field) ---------- */
html .wms-c-field, html [data-wms-cart] .wms-c-field { display: grid; gap: 6px; margin: 0; min-width: 0; }
html .wms-c-field > span:first-child, html [data-wms-cart] .wms-c-field > span:first-child { font: 700 14px/1.3 var(--c-display); color: var(--c-black); }
html .wms-c-field small { font-size: 14px; color: var(--c-muted); }
html .wms-c input[type="text"]:not([type="button"]):not([type="submit"]), html .wms-c input[type="email"]:not([type="button"]):not([type="submit"]), html .wms-c input[type="tel"]:not([type="button"]):not([type="submit"]), html .wms-c input[type="password"]:not([type="button"]):not([type="submit"]), html .wms-c input:not([type]):not([type="button"]):not([type="submit"]), html .wms-c select, html .wms-c textarea, html [data-wms-cart] input[type="text"]:not([type="button"]):not([type="submit"]) {
	width: 100%;
	min-height: 50px;
	padding: 12px 20px;
	border: 1.5px solid var(--c-field-line);
	border-radius: 999px;
	background: var(--c-white);
	box-shadow: none;
	font: 500 17px/1.3 var(--c-body);
	color: var(--c-black);
}
html .wms-c select { appearance: none; padding-right: 44px; background: var(--c-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 20px center; }
html .wms-c textarea { border-radius: 24px; min-height: 96px; resize: vertical; }
html .wms-c input:focus:not([type="button"]):not([type="submit"]), html .wms-c select:focus, html .wms-c textarea:focus, html [data-wms-cart] input[type="text"]:focus:not([type="button"]):not([type="submit"]) {
	outline: none;
	border-color: var(--c-orange);
	box-shadow: 0 0 0 3px var(--c-tint);
}
html .wms-c .is-invalid input, html .wms-c .is-invalid select { border-color: var(--c-error); }
html .wms-c .is-invalid > span:first-child { color: var(--c-error); }
html .wms-c-pass { position: relative; display: block; }
html .wms-c-pass input { padding-right: 76px !important; }
html .wms-c .wms-c-pass button { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); padding: 6px 12px; border: 0; border-radius: 999px; background: var(--c-smoke); font: 700 13px var(--c-display); color: var(--c-black); cursor: pointer; }
html .wms-c-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
html .wms-c-grid--tight { gap: 12px; }
html .wms-c-field--wide { grid-column: 1 / -1; }

/* Radio chips (the prototype's choice cards) */
html .wms-c-group, html [data-wms-cart] .wms-c-group { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
html .wms-c-group legend { padding: 0; margin: 0 0 8px; font: 700 13px/1.3 var(--c-display); letter-spacing: .08em; text-transform: uppercase; color: var(--c-muted); }
html .wms-c-chips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
html .wms-c-chips.is-stack { grid-template-columns: 1fr; }
html .wms-c-chip {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	padding: 12px 14px;
	background: var(--c-white);
	border: 1.5px solid var(--c-field-line);
	border-radius: var(--c-radius);
	cursor: pointer;
}
html .wms-c-chip:hover { border-color: var(--c-charcoal); }
html .wms-c-chip input, html .wms-b-card input, html .wms-c-seg input { position: absolute; opacity: 0; pointer-events: none; }
html .wms-c-chip__body { display: grid; gap: 2px; min-width: 0; flex: 1; }
html .wms-c-chip b { font: 700 15px/1.3 var(--c-display); color: var(--c-black); }
html .wms-c-chip small { font-size: 14px; line-height: 1.35; color: var(--c-text); }
html .wms-c-chip em { font: 700 15px/1.3 var(--c-display); font-style: normal; color: var(--c-black); }
html .is-stack .wms-c-chip__body { grid-template-columns: 1fr auto; column-gap: 12px; }
html .is-stack .wms-c-chip em { grid-row: 1; grid-column: 2; }
html .wms-c-dot { flex: none; display: grid; place-items: center; width: 20px; height: 20px; margin-top: 1px; border: 2px solid var(--c-field-line); border-radius: 50%; background: var(--c-white); }
html .wms-c-chip:has(input:checked), html .wms-b-card.is-on { border-color: var(--c-charcoal); box-shadow: inset 0 0 0 1px var(--c-charcoal); }
html .wms-c-chip:has(input:checked) .wms-c-dot, html .wms-b-card.is-on .wms-c-dot { border-color: var(--c-orange); background: var(--c-orange); }
html .wms-c-chip:has(input:checked) .wms-c-dot::after, html .wms-b-card.is-on .wms-c-dot::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-white); }
html .wms-c-chip:has(input:focus-visible), html .wms-b-card:has(input:focus-visible), html .wms-c-check:has(input:focus-visible), html .wms-c-seg label:has(input:focus-visible) { outline: 3px solid var(--c-orange); outline-offset: 2px; }

/* Segmented control (hosting type, account tabs) */
html .wms-c-seg { display: flex; gap: 4px; padding: 4px; background: var(--c-smoke); border: 1px solid var(--c-divider); border-radius: 999px; }
html .wms-c-seg label, html .wms-c .wms-c-seg button {
	flex: 1;
	position: relative;
	margin: 0;
	padding: 9px 12px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	font: 700 14px/1.2 var(--c-display);
	color: var(--c-charcoal);
	text-align: center;
	cursor: pointer;
}
html .wms-c-seg .is-on, html .wms-c .wms-c-seg button.is-on { background: var(--c-black); color: var(--c-white); }
html .wms-c .wms-c-seg button:hover:not(.is-on), html .wms-c-seg label:hover:not(.is-on) { background: var(--c-white); color: var(--c-black); }
html .wms-c-seg--tabs { margin-bottom: 24px; }

/* Billing cycle switch */
html .wms-c-cycle, html [data-wms-cart] .wms-c-cycle { display: flex; gap: 4px; padding: 4px; margin: 0 0 16px; background: var(--c-smoke); border: 1px solid var(--c-divider); border-radius: 999px; }
html .wms-c-cycle button, html [data-wms-cart] .wms-c-cycle button {
	flex: 1;
	padding: 9px 10px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	font: 700 14px/1.2 var(--c-display);
	color: var(--c-charcoal);
	cursor: pointer;
}
html .wms-c-cycle button em { display: inline-block; margin-left: 4px; font: 600 12px var(--c-body); font-style: normal; color: var(--c-link); }
html .wms-c-cycle button.is-on, html [data-wms-cart] .wms-c-cycle button.is-on { background: var(--c-black); color: var(--c-white); }
html .wms-c-cycle button.is-on em { color: var(--c-white); opacity: .85; }
html .wms-c-cycle button:hover:not(.is-on) { background: var(--c-white); color: var(--c-black); }

/* Checkbox rows (migration, compromised, terms) */
html .wms-c-check, html [data-wms-cart] .wms-c-check {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	padding: 14px 16px;
	background: var(--c-white);
	border: 1.5px solid var(--c-field-line);
	border-radius: var(--c-radius);
	cursor: pointer;
}
html .wms-c-check input { position: absolute; opacity: 0; }
html .wms-c-check:has(input:checked) { border-color: var(--c-charcoal); box-shadow: inset 0 0 0 1px var(--c-charcoal); }
html .wms-c-check.is-invalid { border-color: var(--c-error); }
html .wms-c-box { flex: none; position: relative; width: 22px; height: 22px; margin-top: 1px; border: 2px solid var(--c-field-line); border-radius: 6px; background: var(--c-white); }
html .wms-c-check:has(input:checked) .wms-c-box { border-color: var(--c-orange); background: var(--c-orange); }
html .wms-c-check:has(input:checked) .wms-c-box::after { content: ""; position: absolute; left: 6px; top: 2px; width: 6px; height: 11px; border: solid var(--c-white); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
html .wms-c-check strong { display: block; font: 700 15px/1.4 var(--c-display); color: var(--c-black); }
html .wms-c-check small { display: block; font-size: 14px; line-height: 1.45; color: var(--c-text); }
html .wms-c-check a { color: var(--c-link); }

/* ---------- Cart items (panel and page) ---------- */
html .wms-c-item, html [data-wms-cart] .wms-c-item {
	display: grid;
	gap: 14px;
	padding: 20px 0;
	border-bottom: 1px solid var(--c-divider);
}
html .wms-c-page .wms-c-item { padding: 24px; margin-bottom: 16px; border: 1px solid var(--c-section-line); border-radius: var(--c-card-radius); background: var(--c-white); }
html .wms-c-item__head { display: flex; align-items: baseline; gap: 12px; }
html .wms-c-item__head h3 { flex: 1; }
html .wms-c-price { font: 800 18px/1.2 var(--c-display); color: var(--c-black); white-space: nowrap; }
html .wms-c-price small { font: 400 14px var(--c-body); color: var(--c-muted); }
html .wms-c .wms-c-remove, html [data-wms-cart] .wms-c-remove { padding: 2px 4px; border: 0; background: none; font: 600 14px var(--c-body); color: var(--c-muted); text-decoration: underline; cursor: pointer; }
html .wms-c .wms-c-remove:hover, html [data-wms-cart] .wms-c-remove:hover, html [data-wms-cart] .wms-c-remove:focus { color: var(--c-error); background: none; }
html .wms-c-item__detail { font-size: 15px; color: var(--c-text); overflow-wrap: anywhere; }
html .wms-c-item__detail strong { color: var(--c-black); }
html .wms-c-support { font-size: 14px; color: var(--c-muted); }

html .wms-c-upsell, html [data-wms-cart] .wms-c-upsell {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-top: 16px;
	padding: 16px;
	background: var(--c-smoke);
	border: 1px solid var(--c-section-line);
	border-radius: var(--c-radius);
}
html .wms-c-upsell > div { flex: 1; min-width: 0; }
html .wms-c-upsell strong { display: block; font: 700 15px var(--c-display); }
html .wms-c-upsell small { display: block; font-size: 14px; color: var(--c-text); }

/* Totals */
html .wms-c-foot { padding-top: 20px; }
html .wms-c-totals { display: grid; gap: 6px; margin: 0 0 16px; }
html .wms-c-totals div { display: flex; justify-content: space-between; gap: 12px; font-size: 16px; color: var(--c-text); }
html .wms-c-totals dt, html .wms-c-totals dd { margin: 0; }
html .wms-c-totals .is-total { margin-top: 6px; padding-top: 12px; border-top: 1px solid var(--c-divider); font: 800 22px/1.2 var(--c-display); color: var(--c-black); }
html .wms-c-then { margin: -6px 0 16px !important; font-size: 14px; color: var(--c-muted); }
html .wms-c-lines { list-style: none; margin: 0 0 16px; padding: 0; }
html .wms-c-lines li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--c-divider); font: 700 15px var(--c-display); }
html .wms-c-lines b { display: block; font: 700 15px/1.3 var(--c-display); }
html .wms-c-lines small { display: block; font: 400 14px/1.4 var(--c-body); color: var(--c-muted); overflow-wrap: anywhere; }

html .wms-c-empty { padding: 40px 28px; text-align: center; background: var(--c-smoke); border: 1px solid var(--c-section-line); border-radius: var(--c-card-radius); }
html .wms-c-empty h3 { margin-bottom: 8px; }
html .wms-c-empty .wms-c-actions { justify-content: center; }

/* ---------- Cart page and checkout layout ---------- */
html .wms-c-page, html .wms-c-checkout, html .wms-b {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 400px;
	gap: 40px;
	align-items: start;
}
html .wms-c-page__side .wms-c-card h2, html .wms-c-sumhead h2 { font-size: 22px; }
html .wms-c-sticky { position: sticky; top: 120px; }
html .wms-c-sumhead { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
html .wms-c-sumhead a { font: 700 15px var(--c-display); color: var(--c-link); }
html .wms-c-checkout__main { display: grid; gap: 20px; margin: 0; }
html .wms-c-checkout__main h2 { margin-bottom: 4px; }
html .wms-c-checkout__main .wms-c-note { margin-bottom: 20px; }
html .wms-c-pay { display: grid; gap: 16px; background: var(--c-smoke); }

/* Checkout steps (same look as the home page form's steps) */
html .wms-c-steps { display: flex; align-items: center; gap: 8px; list-style: none; margin: 0 0 4px; padding: 0; font: 700 12px/1 var(--c-display); letter-spacing: .08em; text-transform: uppercase; color: var(--c-muted); }
html .wms-c-steps li { display: flex; align-items: center; gap: 12px; margin: 0; white-space: nowrap; }
html .wms-c-steps li + li { flex: 1; margin-left: 12px; }
html .wms-c-steps li + li::before { content: ""; flex: 1; min-width: 16px; height: 1.5px; background: var(--c-field-line); }
html .wms-c-steps li.is-done + li::before { background: var(--c-orange); }
html .wms-c-steps span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--c-field-line); background: var(--c-white); font-size: 11px; }
html .wms-c-steps .is-on { color: var(--c-black); }
html .wms-c-steps .is-on span { background: var(--c-black); border-color: var(--c-black); color: var(--c-white); }
html .wms-c-steps .is-done span { background: var(--c-orange); border-color: var(--c-orange); color: var(--c-white); }

/* ---------- Plan builder ---------- */
html .wms-b__main { display: grid; gap: 40px; }
html .wms-b-step { display: grid; gap: 16px; }
html .wms-b-step h2 { display: flex; align-items: center; gap: 12px; margin: 0; }
html .wms-b-step h2 span { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--c-black); color: var(--c-white); font: 800 15px var(--c-display); }
html .wms-b-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
html .wms-b-card {
	position: relative;
	display: grid;
	align-content: start;
	gap: 6px;
	margin: 0;
	padding: 20px 20px 20px 52px;
	background: var(--c-white);
	border: 1.5px solid var(--c-field-line);
	border-radius: var(--c-radius);
	cursor: pointer;
	transition: border-color .15s;
}
html .wms-b-card:hover { border-color: var(--c-charcoal); }
html .wms-b-card .wms-c-dot { position: absolute; left: 20px; top: 21px; }
html .wms-b-card b { font: 800 17px/1.3 var(--c-display); color: var(--c-black); }
html .wms-b-card small { font-size: 15px; line-height: 1.45; color: var(--c-text); }
html .wms-b-card em { margin-top: 4px; font: 700 15px var(--c-display); font-style: normal; color: var(--c-black); }
html .wms-b-card ul { margin: 2px 0 0; padding: 0; list-style: none; font-size: 15px; line-height: 1.6; color: var(--c-text); }
html .wms-b-card.is-locked { opacity: .45; cursor: not-allowed; }
html .wms-b-card--plan em { font-size: 20px; }

html .wms-b-dial { padding: 20px 24px; background: var(--c-smoke); border: 1px solid var(--c-section-line); border-radius: var(--c-radius); }
html .wms-b-dial + .wms-b-dial { margin-top: -4px; }
html .wms-b-dial__top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
html .wms-b-dial__top label { display: grid; gap: 2px; margin: 0; }
html .wms-b-dial__top b { font: 700 16px var(--c-display); }
html .wms-b-dial__top small { font-size: 14px; color: var(--c-text); }
html .wms-b-stepper { display: flex; align-items: center; background: var(--c-white); border: 1.5px solid var(--c-field-line); border-radius: 999px; }
html .wms-c .wms-b-stepper > button { width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: transparent; font: 700 20px/1 var(--c-display); color: var(--c-black); cursor: pointer; }
html .wms-c .wms-b-stepper > button:hover:not(:disabled), html .wms-c .wms-b-stepper > button:focus-visible { background: var(--c-black); color: var(--c-white); }
html .wms-c .wms-b-stepper > button:disabled { color: var(--c-field-line); background: transparent; cursor: not-allowed; }
html .wms-b-stepper output { min-width: 72px; text-align: center; font: 800 16px var(--c-display); }
html .wms-b-dial__scale { display: flex; justify-content: space-between; gap: 8px; margin-top: 8px; font-size: 13px; color: var(--c-muted); }
html .wms-c input[type="range"]:not([type="button"]):not([type="submit"]) {
	--fill: 0%;
	width: 100%;
	height: 6px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	appearance: none;
	background: linear-gradient(to right, var(--c-orange) var(--fill), var(--c-divider) var(--fill));
	cursor: pointer;
}
html .wms-c input[type="range"]::-webkit-slider-thumb { appearance: none; width: 24px; height: 24px; border-radius: 50%; background: var(--c-white); border: 2px solid var(--c-black); box-shadow: var(--c-shadow); }
html .wms-c input[type="range"]::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: var(--c-white); border: 2px solid var(--c-black); }
html .wms-c input[type="range"]:focus-visible { outline: 3px solid var(--c-orange); outline-offset: 4px; }

html .wms-b__side .wms-c-card { display: grid; gap: 14px; }
html .wms-b-plan { font: 600 17px var(--c-display); color: var(--c-text); }
html .wms-b-plan strong { color: var(--c-black); }
html .wms-b-specs { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--c-divider); }
html .wms-b-specs li { display: flex; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid var(--c-divider); font-size: 15px; color: var(--c-text); }
html .wms-b-specs b { font: 700 15px var(--c-display); color: var(--c-black); }
html .wms-b-price { font: 800 40px/1.1 var(--c-display); color: var(--c-black); }
html .wms-b-price small { font: 400 16px var(--c-body); color: var(--c-muted); }
html .wms-b-compare p { display: grid; gap: 2px; padding: 12px 14px; background: var(--c-smoke); border-radius: var(--c-radius); font-size: 14px; }
html .wms-b-compare span { font: 700 12px var(--c-display); letter-spacing: .08em; text-transform: uppercase; color: var(--c-muted); }
html .wms-b-compare em { font-style: normal; color: var(--c-muted); }

/* ---------- Account ---------- */
html .wms-a-signin { max-width: 520px; margin: 0 auto; display: grid; gap: 16px; }
html .wms-a-signin form { display: grid; gap: 16px; margin: 0; }
html .wms-a-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }
html .wms-a { display: grid; gap: 32px; }
html .wms-a__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
html .wms-a__label { margin-bottom: 12px !important; font: 700 13px/1.3 var(--c-display) !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: var(--c-muted) !important; }
html .wms-a-svc {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto auto;
	align-items: center;
	gap: 20px;
	padding: 20px 24px;
	margin-bottom: 12px;
	background: var(--c-white);
	border: 1px solid var(--c-section-line);
	border-radius: var(--c-radius);
}
html .wms-a-svc__main p { font-size: 15px; color: var(--c-text); overflow-wrap: anywhere; }
html .wms-a-svc__price { font: 800 17px var(--c-display); text-align: right; }
html .wms-a-svc__price small { display: block; font: 400 14px var(--c-body); color: var(--c-muted); }
html .wms-a-svc__actions { display: flex; gap: 8px; }
html .wms-a-status { padding: 4px 12px; border-radius: 999px; background: var(--c-smoke); border: 1px solid var(--c-divider); font: 700 12px var(--c-display); letter-spacing: .04em; text-transform: uppercase; color: var(--c-charcoal); }
html .wms-a-status.is-ok { background: var(--c-ok-tint); border-color: transparent; color: var(--c-ok); }
html .wms-a-status.is-bad { background: #FFF5F5; border-color: transparent; color: var(--c-error); }
html .wms-a-quick__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
html .wms-c .wms-a-tile { display: grid; gap: 4px; padding: 20px; text-align: left; background: var(--c-smoke); border: 1px solid var(--c-section-line); border-radius: var(--c-radius); color: var(--c-black); cursor: pointer; }
html .wms-c .wms-a-tile:hover, html .wms-c .wms-a-tile:focus-visible { background: var(--c-white); border-color: var(--c-charcoal); color: var(--c-black); }
html .wms-a-tile b { font: 700 16px var(--c-display); }
html .wms-a-tile small { font-size: 14px; color: var(--c-text); }

/* ---------- Home page slide-out cart ---------- */
html .wms-gs-panel [data-wms-cart="panel"] .wms-c-cycle { margin-top: 4px; }
html .wms-gs-panel [data-wms-cart="panel"] { font-family: var(--c-body); color: var(--c-black); }
html .wms-gs-panel [data-wms-cart="panel"] .wms-c-item:first-of-type { padding-top: 8px; }
html .wms-gs-panel [data-wms-cart="panel"] .wms-c-empty { padding: 28px 20px; }

html .wms-gs-panel .wms-gs-panel__title { font: 800 22px/1.2 var(--c-display); letter-spacing: 0; text-transform: none; }
html [data-wms-cart="panel"] .wms-c-bar {
	position: sticky;
	bottom: -24px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 16px -24px -24px;
	padding: 14px 24px;
	background: var(--c-white);
	border-top: 1px solid var(--c-divider);
	box-shadow: 0 -8px 24px rgba(0, 0, 0, .06);
}
html [data-wms-cart="panel"] .wms-c-bar small { display: block; font-size: 13px; color: var(--c-muted); }
html [data-wms-cart="panel"] .wms-c-bar b { font: 800 20px/1.1 var(--c-display); }

/* ---------- Tablets and phones ---------- */
@media (max-width: 1100px) {
	html .wms-c-page, html .wms-c-checkout, html .wms-b { grid-template-columns: 1fr; gap: 24px; }
	html .wms-c-sticky { position: static; }
	html .wms-b-grid { grid-template-columns: 1fr; }
	html .wms-b-card { padding-right: 16px; }
}
@media (max-width: 767px) {
	html .wms-c { font-size: 16px; }
	html .wms-c-card { padding: 20px 16px; border-radius: 20px; }
	html .wms-c-page .wms-c-item { padding: 20px 16px; border-radius: 20px; }
	html .wms-c-chips { grid-template-columns: 1fr; }
	html .wms-c-chips .wms-c-chip__body { grid-template-columns: 1fr auto; column-gap: 12px; }
	html .wms-c-chips .wms-c-chip em { grid-row: 1; grid-column: 2; }
	html .wms-c-grid { grid-template-columns: 1fr; }
	html .wms-c-steps { font-size: 11px; letter-spacing: .06em; }
	html .wms-c-steps li { gap: 8px; }
	html .wms-c-steps li + li { margin-left: 8px; }
	html .wms-b-dial { padding: 16px; }
	html .wms-b-dial__top { flex-wrap: wrap; }
	html .wms-b-price { font-size: 34px; }
	html .wms-a-svc { grid-template-columns: 1fr auto; gap: 12px; padding: 16px; }
	html .wms-a-svc__price { text-align: left; }
	html .wms-a-svc__actions { grid-column: 1 / -1; }
	html .wms-a-quick__grid { grid-template-columns: 1fr; }
	html .wms-c-cycle button em { display: block; margin: 2px 0 0; }
}
@media (prefers-reduced-motion: reduce) {
	html .wms-c *, html [data-wms-cart] * { transition: none !important; animation: none !important; }
}