/* WiseConn Kit · base styles (K02). Components are added by later modules. */

/* Keyboard focus: 2 px green outline, 2 px apart (stock hides it). */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
}

strong,
b {
	color: var(--wc-ink-strong);
}

/* ---------- Layout: cards grid (K05). Three columns from 768 px; one below. Nothing overflows. ---------- */
.wkit-hub-grid,
.wkit-items-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wc-space-6);
	margin: 30px 0;
}
.wkit-hub-grid > *,
.wkit-items-grid > * {
	min-width: 0;
}
@media (min-width: 768px) {
	.wkit-hub-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.wkit-items-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 960px) {
	.wkit-items-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
.wkit-hub-total {
	margin: var(--wc-space-3) 0 0;
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-ink);
}
.wkit-hub-total + .wkit-items-grid {
	margin-top: var(--wc-space-3-5);
}

/* ---------- Hub card (a family): icon, name, description, count and arrow ---------- */
.wkit-hub-card {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-3-5);
	padding: var(--wc-space-7);
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	text-decoration: none;
	color: var(--wc-ink);
	transition: transform var(--wc-motion-card), border-color var(--wc-motion-card), box-shadow var(--wc-motion-card);
	box-shadow: var(--wc-shadow-card);
}
.wkit-hub-card:hover {
	border-color: var(--wc-brand);
	transform: translateY(var(--wc-card-lift));
	box-shadow: var(--wc-shadow-card-hover);
}
.wkit-hub-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: var(--wc-radius-search);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-hub-icon svg {
	display: block;
}
.wkit-hub-info {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-1-5);
}
.wkit-hub-title {
	font-size: var(--wc-font-size-footer-heading);
	font-weight: 700;
	color: var(--wc-ink-strong);
	line-height: 1.25;
}
.wkit-hub-description {
	font-size: var(--wc-font-size-body);
	line-height: 1.5;
	color: var(--wc-ink);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--wc-hub-description-lines, 3);
	line-clamp: var(--wc-hub-description-lines, 3);
	overflow: hidden; /* CX13: a visual cut only; the whole text stays in the page. */
}
.wkit-hub-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wc-space-3);
	margin-top: auto;
	padding-top: var(--wc-space-1-5);
	color: var(--wc-brand);
}
.wkit-hub-count {
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	color: var(--wc-brand);
}
.wkit-hub-arrow {
	flex: 0 0 auto;
	transition: transform 0.2s ease;
}
.wkit-hub-card:hover .wkit-hub-arrow {
	transform: translateX(4px);
}
@media (max-width: 959px) {
	.wkit-hub-card {
		padding: var(--wc-space-5);
	}
}

/* ---------- Item card: image, name, code, lists, note (K05) ---------- */
.wkit-item-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	overflow: hidden;
	box-shadow: var(--wc-shadow-card);
	transition: transform var(--wc-motion-card), border-color var(--wc-motion-card), box-shadow var(--wc-motion-card);
}
.wkit-item-card:hover {
	border-color: var(--wc-brand);
	transform: translateY(var(--wc-card-lift));
	box-shadow: var(--wc-shadow-card-hover);
}
.wkit-item-card:hover .wkit-item-title {
	color: var(--wc-brand);
}
.wkit-item-link {
	display: flex;
	flex: 1;
	flex-direction: column;
	text-decoration: none;
	color: var(--wc-ink);
}
.wkit-item-thumb {
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--wc-page);
	border-bottom: 1px solid var(--wc-border);
}
.wkit-item-thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}
.wkit-item-card.is-dim .wkit-item-thumb img {
	opacity: 0.55;
}
.wkit-item-badge {
	position: absolute;
	top: 12px;
	left: 12px;
}
.wkit-item-body {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-1-5);
	padding: var(--wc-space-5) var(--wc-space-5-5) var(--wc-space-5-5);
}
.wkit-item-title {
	margin: 0;
	font-size: var(--wc-font-size-subtitle);
	font-weight: 700;
	line-height: 1.25;
	color: var(--wc-ink-strong);
	transition: color 0.18s ease;
}
.wkit-item-code {
	padding-bottom: var(--wc-space-3-5);
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	color: var(--wc-ink);
	border-bottom: 1px solid var(--wc-border);
}
.wkit-item-line {
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
	line-height: 1.35;
}
.wkit-item-section {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-1-5);
	margin-top: var(--wc-space-2-5);
}
.wkit-item-section-title {
	font-size: var(--wc-font-size-badge);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wc-ink-muted);
}
.wkit-item-section ul {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-1-5);
	margin: 0;
	padding: 0;
	list-style: none;
}
.wkit-item-section li {
	position: relative;
	margin: 0;
	padding-left: var(--wc-space-4);
	font-size: var(--wc-font-size-ui);
	line-height: 1.4;
}
.wkit-item-section li::before {
	content: "";
	position: absolute;
	top: 0.55em;
	left: 0;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--wc-brand);
}
.wkit-item-note {
	margin-top: var(--wc-space-3);
	font-size: var(--wc-font-size-body);
	font-weight: 600;
}
.wkit-item-note--replaced {
	color: var(--wc-replaced-icon);
}
.wkit-item-footer {
	padding: 0 var(--wc-space-5-5) var(--wc-space-3-5);
	font-size: var(--wc-font-size-small);
}
.wkit-edit-link {
	font-weight: 600;
}

/* ---------- Notices (empty section, review notice) ---------- */
.wkit-notice {
	padding: var(--wc-space-5);
	color: var(--wc-ink-muted);
	background: var(--wc-surface-muted);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-search);
}
.wkit-admin-notice {
	margin: 30px 0 0;
	padding: var(--wc-space-3) var(--wc-space-4);
	font-size: var(--wc-font-size-ui);
	color: var(--wc-replaced-icon);
	background: #fffbeb;
	border: 1px dashed var(--wc-warning-strong);
	border-radius: var(--wc-radius-md);
}

/* ---------- Breadcrumbs (K06) ---------- */
.wkit-breadcrumbs-nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wc-space-2-5);
	margin: 0 0 var(--wc-space-3-5);
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
}
.wkit-breadcrumbs-nav a {
	color: var(--wc-brand);
	font-weight: 500;
	text-decoration: none;
}
.wkit-breadcrumbs-nav a:hover {
	color: var(--wc-brand-hover);
	text-decoration: underline;
}
.wkit-crumb-sep {
	margin: 0;
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-faint);
}
.wkit-crumb-current {
	color: var(--wc-ink-strong);
	font-weight: 600;
}

/* ---------- Page head (K28): two title levels, "work" and "catalog" ---------- */
.wkit-title {
	margin: 0;
	font-weight: var(--wc-weight-bold);
	color: var(--wc-ink-strong);
	letter-spacing: var(--wc-title-letter-spacing);
}
.wkit-title--work {
	font-size: var(--wc-title-work-size);
	line-height: var(--wc-title-work-line-height);
}
.wkit-title--catalog {
	font-size: var(--wc-title-catalog-size);
	line-height: var(--wc-title-catalog-line-height);
}
.wkit-subtitle {
	margin: 0;
	font-weight: var(--wc-weight-regular);
	line-height: var(--wc-line-height-body);
	color: var(--wc-ink);
}
.wkit-subtitle--work {
	font-size: var(--wc-subtitle-work-size);
}
.wkit-subtitle--catalog {
	font-size: var(--wc-subtitle-catalog-size);
}
@media (max-width: 959px) {
	.wkit-title--catalog {
		font-size: var(--wc-title-catalog-size-tablet);
	}
}
@media (max-width: 767px) {
	.wkit-title--work {
		font-size: var(--wc-title-work-size-mobile);
	}
	.wkit-title--catalog {
		font-size: var(--wc-title-catalog-size-mobile);
	}
	.wkit-subtitle--catalog {
		font-size: var(--wc-subtitle-catalog-size-mobile);
	}
}

.wkit-breadcrumbs-nav--work {
	margin: 0 0 var(--wc-space-3);
}

/* ---------- Title (K06) ---------- */
.wkit-title-wrapper {
	margin: 0 0 var(--wc-space-6);
}
.wkit-title-wrapper.wkit-title-wrapper--with-desc {
	margin-bottom: var(--wc-space-3-5);
}
.wkit-title-description {
	margin: 0 0 var(--wc-space-6);
	max-width: 64ch;
	text-wrap: pretty;
}

@media (prefers-reduced-motion: reduce) {
	.wkit-hub-card,
	.wkit-item-card,
	.wkit-hub-arrow {
		transition: none;
	}
	.wkit-hub-card:hover,
	.wkit-item-card:hover {
		transform: none;
	}
}

/* ---------- Content map (K07) ---------- */
.wkit-cmap [hidden],
.wkit-cmap-node.is-hidden {
	display: none !important;
}
.wkit-cmap {
	margin: 0 0 var(--wc-space-10);
}
.wkit-cmap-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wc-space-3) var(--wc-space-6);
	margin: 0 0 var(--wc-space-4);
}
.wkit-cmap-filter {
	position: relative;
	flex: 1 1 300px;
	max-width: 520px;
}
.wkit-search-icon {
	position: absolute;
	top: 50%;
	left: 14px;
	width: 18px;
	height: 18px;
	transform: translateY(-50%);
	color: var(--wc-ink-muted);
	pointer-events: none;
}
.wkit-search-icon svg {
	display: block;
	width: 18px;
	height: 18px;
}
.wkit-search-input {
	width: 100%;
	height: 44px;
	padding: 0 var(--wc-space-3-5) 0 42px;
	font: inherit;
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink-chip);
	background: var(--wc-page);
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-md);
	box-sizing: border-box;
}
.wkit-cmap-actions {
	display: flex;
	gap: var(--wc-space-4-5);
}
.wkit-cmap-action {
	padding: var(--wc-space-1) 0;
	font: inherit;
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	line-height: 1.3;
	color: var(--wc-brand);
	text-decoration: underline;
	background: none;
	border: none;
	cursor: pointer;
}
.wkit-cmap-action:hover {
	color: var(--wc-brand-hover);
}
.wkit-cmap-tree,
.wkit-cmap-children,
.wkit-cmap-node {
	margin: 0;
	padding: 0;
	list-style: none;
}
.wkit-cmap-children {
	margin-left: 17px;
	padding-left: var(--wc-space-3-5);
	border-left: 1px solid var(--wc-border);
}
.wkit-cmap-tree > .wkit-cmap-node {
	padding: var(--wc-space-1) 0;
	border-bottom: 1px solid var(--wc-surface-chip);
}
.wkit-cmap-tree > .wkit-cmap-node:last-child {
	border-bottom: none;
}
.wkit-cmap-row {
	display: flex;
	align-items: flex-start;
	gap: var(--wc-space-1-5);
}
.wkit-cmap-toggle {
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	color: var(--wc-ink-muted);
	background: transparent;
	border: none;
	border-radius: var(--wc-radius-btn);
	cursor: pointer;
}
.wkit-cmap-toggle:hover {
	color: var(--wc-brand);
	background: var(--wc-surface-chip);
}
.wkit-cmap-toggle svg {
	display: block;
	width: 18px;
	height: 18px;
	pointer-events: none;
	transition: transform 0.15s ease;
}
.wkit-cmap-toggle[aria-expanded="true"] svg {
	transform: rotate(90deg);
}
.wkit-cmap-spacer {
	flex: 0 0 36px;
	width: 36px;
	height: 36px;
}
.wkit-cmap-label {
	flex: 1 1 auto;
	min-width: 0;
	padding: 7px 0;
	font-size: var(--wc-font-size-body);
	line-height: 22px;
	color: var(--wc-ink-strong);
}
.wkit-cmap-name {
	font-weight: 500;
	color: var(--wc-ink-strong);
	text-decoration: none;
}
a.wkit-cmap-name:hover {
	color: var(--wc-brand);
	text-decoration: underline;
}
.wkit-cmap-level-1 > .wkit-cmap-row .wkit-cmap-label {
	font-size: var(--wc-h2-side-size);
}
.wkit-cmap-level-1 > .wkit-cmap-row .wkit-cmap-name {
	font-weight: 700;
}
.wkit-cmap-level-2 > .wkit-cmap-row .wkit-cmap-name {
	font-weight: 600;
}
.wkit-cmap-count {
	margin-left: var(--wc-space-1);
	font-size: var(--wc-font-size-small);
	font-weight: 500;
	color: var(--wc-ink-muted);
	white-space: nowrap;
}
.wkit-cmap-node.is-empty > .wkit-cmap-row .wkit-cmap-name,
.wkit-cmap-node.is-empty > .wkit-cmap-row .wkit-cmap-count {
	color: var(--wc-ink-faint);
	cursor: default;
}
.wkit-cmap-soon {
	display: inline-block;
	margin-left: var(--wc-space-2);
	padding: 1px var(--wc-space-2);
	font-size: var(--wc-font-size-badge);
	font-weight: 500;
	line-height: 18px;
	color: var(--wc-ink-muted);
	white-space: nowrap;
	vertical-align: 1px;
	background: var(--wc-surface-chip);
	border-radius: var(--wc-radius-pill);
}
.wkit-cmap-node.is-match > .wkit-cmap-row .wkit-cmap-name {
	background: #dcfce7;
	box-shadow: 0 0 0 2px #dcfce7;
	border-radius: 3px;
}
@media (prefers-reduced-motion: reduce) {
	.wkit-cmap-toggle svg {
		transition: none;
	}
}

/* ---------- Header, footer, menu (K11) ---------- */
/* Full width: cancel the page side padding of the theme.json layer. */
/* Whatever the side padding of the theme, centered on the page and as wide as the window. */
.wp-block-template-part:has(> .wkit-header),
.wp-block-template-part:has(> .wkit-footer-band) {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-block: 0;
}
/* A scrollbar takes width from 100vw: never let that make the page scroll sideways. */
.wp-site-blocks {
	overflow-x: clip;
}
.wp-block-template-part:has(> .wkit-header) {
	position: sticky;
	top: 0;
	z-index: 50;
}
.admin-bar .wp-block-template-part:has(> .wkit-header) {
	top: 32px;
}
@media (max-width: 782px) {
	.admin-bar .wp-block-template-part:has(> .wkit-header) {
		top: 46px;
	}
}
.wkit-header,
.wkit-footer,
.wkit-footer-band {
	margin: 0;
	padding: 0;
}
.wkit-wrap {
	width: min(80%, 1220px);
	margin-left: auto;
	margin-right: auto;
}

.wkit-topbar {
	background: var(--wc-topbar);
}
.wkit-topbar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wc-space-6);
	height: 68px;
}
.wkit-topbar-inner > * {
	margin: 0;
}
.wkit-brand {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-0-5);
	text-decoration: none;
}
.wkit-brand img {
	display: block;
	width: auto;
	height: 34px;
}
.wkit-brand--footer img {
	height: 34px; /* ACTA-CX6: the logo alone fits its column (270 px) */
}
.wkit-slot--account {
	margin-left: auto;
}
.wkit-slot a,
.wkit-account-link {
	font-size: var(--wc-font-size-small);
	color: var(--wc-topbar-link);
	text-decoration: none !important;
}
.wkit-slot a:hover,
.wkit-slot a:focus-visible {
	text-decoration: underline !important;
}
.wkit-slot a:hover,
.wkit-slot a:focus-visible {
	color: var(--wc-on-brand);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 6px;
}

/* Family bar (desktop). */
.wkit-famlinks {
	background: var(--wc-navbar);
}
.wkit-famlinks-list {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wc-space-6);
	height: 62px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--wc-font-size-ui);
}
.wkit-famlinks-item {
	position: relative;
	display: flex;
	align-items: center;
	margin: 0;
}
.wkit-famlinks-link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 var(--wc-space-1);
	color: var(--wc-topbar);
	text-decoration: none;
}
.wkit-famlinks-link:hover,
.wkit-famlinks-link.is-current {
	color: var(--wc-topbar);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 6px;
}
.wkit-famlinks-all .wkit-famlinks-link {
	min-height: 0;
	padding: var(--wc-space-2) var(--wc-space-7);
	color: var(--wc-topbar);
	background: transparent;
	border: 1px solid var(--wc-topbar);
	border-radius: var(--wc-radius-pill);
	text-decoration: none !important;
	transition: background-color 0.15s, color 0.15s;
}
.wkit-famlinks-all .wkit-famlinks-link:hover,
.wkit-famlinks-all .wkit-famlinks-link:focus-visible,
.wkit-famlinks-all .wkit-famlinks-link.is-current {
	color: var(--wc-on-brand);
	background: var(--wc-topbar);
	text-decoration: none !important;
}
.wkit-famlinks-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 44px;
	padding: 0;
	color: var(--wc-topbar);
	background: none;
	border: 0;
	cursor: pointer;
}
.wkit-famlinks-toggle svg {
	transition: transform 0.15s;
}
.wkit-famlinks-item.is-open .wkit-famlinks-toggle svg {
	transform: rotate(180deg);
}
.wkit-famlinks-sub {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 60;
	min-width: 220px;
	margin: 0;
	padding: var(--wc-space-2) 0;
	list-style: none;
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-md);
	box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}
.wkit-famlinks-item.has-children:hover > .wkit-famlinks-sub,
.wkit-famlinks-item.has-children:focus-within > .wkit-famlinks-sub,
.wkit-famlinks-item.is-open > .wkit-famlinks-sub {
	display: block;
}
.wkit-famlinks-sub li {
	margin: 0;
}
.wkit-famlinks-sub a {
	display: block;
	padding: var(--wc-space-2-5) var(--wc-space-4-5);
	font-size: var(--wc-font-size-ui);
	color: var(--wc-ink);
	text-decoration: none;
}
.wkit-famlinks-sub a:hover,
.wkit-famlinks-sub a[aria-current] {
	color: var(--wc-brand);
	background: var(--wc-surface-muted);
}

/* Mobile: one bar with logo and menu button; the side drawer opens from the right. */
.wkit-burger,
.wkit-drawer-wrap {
	display: none;
}
@media (max-width: 767px) {
	.wkit-header {
		position: relative;
	}
	.wkit-topbar-inner {
		width: auto;
		height: 56px;
		margin-left: var(--wc-space-4);
		margin-right: 60px;
	}
	.wkit-brand img {
		height: 26px;
	}
	.wkit-topbar .wkit-slot,
	.wkit-famlinks {
		display: none;
	}
	.wkit-burger {
		position: absolute;
		top: 6px;
		right: 8px;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		padding: 0;
		color: var(--wc-on-brand);
		background: none;
		border: 0;
		cursor: pointer;
	}
	.wkit-drawer-wrap {
		position: fixed;
		inset: 0;
		z-index: 100;
	}
	.wkit-drawer-wrap:not([hidden]) {
		display: block;
	}
	.wkit-drawer-overlay {
		position: absolute;
		inset: 0;
		background: var(--wc-scrim);
	}
	.wkit-drawer {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		display: flex;
		flex-direction: column;
		width: min(312px, 88vw);
		background: var(--wc-page);
		box-shadow: var(--wc-shadow-drawer);
	}
	.wkit-drawer-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 56px;
		padding: 0 var(--wc-space-1-5) 0 var(--wc-space-5);
		border-bottom: 1px solid var(--wc-border);
	}
	.wkit-drawer-title {
		font-size: var(--wc-font-size-small);
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		color: var(--wc-ink-strong);
	}
	.wkit-drawer-close {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		padding: 0;
		color: var(--wc-ink-strong);
		background: none;
		border: 0;
		border-radius: var(--wc-radius-btn);
		cursor: pointer;
	}
	.wkit-drawer-body {
		flex: 1 1 auto;
		overflow-y: auto;
		padding: var(--wc-space-2) 0;
	}
	.wkit-drawer-group {
		border-top: 1px solid var(--wc-border);
	}
	.wkit-drawer-link {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		min-height: 52px;
		padding: 0 var(--wc-space-5);
		font: inherit;
		font-size: var(--wc-font-size-body);
		font-weight: 600;
		color: var(--wc-ink-strong);
		text-align: left;
		text-decoration: none;
		background: var(--wc-page);
		border: 0;
		cursor: pointer;
		box-sizing: border-box;
	}
	.wkit-drawer-link.is-current {
		color: var(--wc-brand);
		font-weight: 700;
		background: var(--wc-brand-tint);
	}
	.wkit-drawer-fold svg {
		flex: 0 0 auto;
		color: var(--wc-ink);
		transition: transform 0.15s;
	}
	.wkit-drawer-fold[aria-expanded="true"] svg {
		transform: rotate(180deg);
	}
	.wkit-drawer-sub {
		display: flex;
		flex-direction: column;
		padding-bottom: var(--wc-space-2);
	}
	.wkit-drawer-sub[hidden] {
		display: none;
	}
	.wkit-drawer-sublink {
		display: flex;
		align-items: center;
		min-height: 44px;
		padding: 0 var(--wc-space-5) 0 36px;
		font-size: var(--wc-font-size-ui);
		color: var(--wc-ink);
		text-decoration: none;
	}
	.wkit-drawer-sublink.is-current {
		color: var(--wc-brand);
		font-weight: 700;
	}
	.wkit-drawer-foot {
		padding: var(--wc-space-3) var(--wc-space-5) var(--wc-space-5);
		border-top: 1px solid var(--wc-border);
	}
	.wkit-drawer-foot a {
		display: flex;
		align-items: center;
		min-height: 44px;
		font-size: var(--wc-font-size-ui);
		font-weight: 600;
		color: var(--wc-ink-strong);
		text-decoration: none;
	}
	.wkit-drawer-open {
		overflow: hidden;
	}
}

/* ---------- Footer (K11) ---------- */
.wkit-footer-band {
	display: block;
	width: 100%;
	/* 26.1vw is the picture's own proportion (3840 × 1000): the whole picture shows at any width;
	   on very wide screens only the bottom is trimmed, never the mountain. */
	height: clamp(120px, 26.1vw, 560px);
	background: var(--wc-page) url("../img/footer-mountains.webp") center top / cover no-repeat;
}
.wkit-footer {
	background: var(--wc-footer);
	color: var(--wc-footer-link);
}
.wkit-footer-inner {
	display: flex;
	flex-direction: column;
	gap: 52px;
	padding: var(--wc-space-16) 0 var(--wc-space-7);
}
/* Logo · Catalog · Company · Help. Each column is as wide as its widest line and the free room is shared in equal gaps, so the
   space between the logo and Catalog, Catalog and Company, and Company and Help reads the same. The row aligns on top. */
.wkit-footer-top {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--wc-space-10) var(--wc-space-12);
}
.wkit-footer-top > .wkit-footer-col {
	flex: 0 1 auto;
}
.wkit-footer-top > .wkit-footer-help {
	flex: 0 0 var(--wc-footer-help-col);
}
.wkit-footer-about {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.wkit-footer-about > * {
	margin: 0;
}
.wkit-footer-col {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-4-5);
	min-width: 0;
}
.wkit-footer-col > * {
	margin: 0;
}
.wkit-footer-title {
	margin: 0 0 var(--wc-space-1);
	font-size: var(--wc-font-size-footer-heading);
	font-weight: 700;
	color: var(--wc-on-brand);
}
.wkit-fold__btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: default;
}
.wkit-fold__btn svg {
	display: none;
	flex: none;
	transition: transform 0.16s ease;
}
.wkit-fold.is-open .wkit-fold__btn svg {
	transform: rotate(180deg);
}
.wkit-footer-list {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-4-5);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--wc-font-size-body);
}
.wkit-footer-list li {
	margin: 0;
	padding: 0;
}
.wkit-footer a {
	color: var(--wc-footer-link);
	text-decoration: none;
}
.wkit-footer a:hover {
	color: var(--wc-on-brand);
	text-decoration: underline;
}
/* Help buttons: a box with a light border, an icon and weight 600, so they read as "opens something" next to the plain links. */
.wkit-footer-help__btns {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-3);
}
.wkit-helpbtn {
	display: flex;
	align-items: center;
	gap: var(--wc-space-3);
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	padding: 11px var(--wc-space-4);
	border: 1px solid var(--wc-footer-btn-line);
	border-radius: var(--wc-radius-btn);
	background: transparent;
	color: var(--wc-on-brand);
	font: inherit;
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-semibold);
	line-height: 1.3;
	text-align: left;
	cursor: pointer;
}
.wkit-helpbtn svg {
	flex: none;
}
.wkit-helpbtn:hover {
	border-color: var(--wc-on-brand);
	background: var(--wc-topbar-hover);
}
.wkit-helpbtn:focus-visible {
	border-color: var(--wc-on-brand);
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
}
.wkit-helpbtn:active {
	border-color: var(--wc-brand-hover);
	background: var(--wc-brand-hover);
}
.wkit-footer-bottom {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: var(--wc-space-5-5);
	border-top: 1px solid var(--wc-footer-divider);
}
.wkit-copyright {
	margin: 0;
	font-size: var(--wc-font-size-ui);
	color: var(--wc-footer-link);
	text-align: center;
}
/* Laptop and tablet: the logo takes its own row and the columns stay, with equal gaps. */
@media (max-width: 1279px) {
	.wkit-footer-about {
		flex: 0 0 100%;
	}
}
@media (max-width: 959px) {
	.wkit-footer-inner {
		gap: var(--wc-space-10);
		padding-top: var(--wc-space-14);
		padding-bottom: var(--wc-space-6);
	}
	.wkit-footer-top > .wkit-footer-help {
		flex-basis: var(--wc-footer-help-col-tablet);
	}
}
/* Phone: logo, Help open, then Catalog and Company folded. */
@media (max-width: 599px) {
	.wkit-footer-inner {
		gap: var(--wc-space-8);
		padding-top: var(--wc-space-10);
	}
	.wkit-footer-top {
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: stretch;
		justify-content: flex-start;
		gap: 0;
	}
	.wkit-footer-top > *,
	.wkit-footer-top > .wkit-footer-col,
	.wkit-footer-top > .wkit-footer-help,
	.wkit-footer-about {
		flex: none;
	}
	.wkit-footer-about {
		align-items: center;
		padding-bottom: var(--wc-space-8); /* Padding, not margin: the margins of the footer blocks are cancelled below. */
	}
	.wkit-footer-help {
		order: 1;
		padding-bottom: var(--wc-space-6);
	}
	.wkit-footer-help .wkit-helpbtn {
		min-height: 52px;
	}
	.wkit-fold {
		order: 2;
		gap: 0;
		border-top: 1px solid var(--wc-footer-divider);
	}
	.wkit-fold:last-of-type {
		border-bottom: 1px solid var(--wc-footer-divider);
	}
	.wkit-fold .wkit-footer-title {
		margin: 0;
		font-size: var(--wc-font-size-card-title);
	}
	.wkit-fold__btn {
		min-height: 56px;
		cursor: pointer;
	}
	.wkit-fold__btn svg {
		display: block;
	}
	.wkit-fold:not(.is-open) .wkit-fold__body {
		display: none;
	}
	.wkit-fold__body {
		padding-bottom: var(--wc-space-4);
	}
	.wkit-fold .wkit-footer-list {
		gap: 0;
	}
	.wkit-fold .wkit-footer-list a {
		display: flex;
		align-items: center;
		min-height: 44px;
	}
	.wkit-footer-bottom {
		border-top: 0;
		padding-top: 0;
	}
}

/* ---------- Home and archive templates (K12) ---------- */
.wp-site-blocks > .wkit-main {
	margin-block-start: 0;
}
.wkit-main {
	width: 100%;
	box-sizing: border-box;
	padding-top: var(--wc-space-7);
	padding-bottom: var(--wc-space-26);
}
.wkit-main.wkit-main--home {
	padding-top: 0; /* The Quick links section brings its own spacing (CX8). */
	padding-bottom: 0;
}
.wkit-home-head {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-2);
	margin-bottom: var(--wc-space-8);
}
.wkit-home-head > * {
	margin: 0;
}
.wkit-main .wkit-hub-grid {
	margin-top: var(--wc-space-3);
}
.wkit-main--home .wkit-hub-grid {
	margin-top: 0;
}
/* Page heading of My selection, My account and Directory: same spacing as My requests (32 px top, 8 px over the title, 6 px under it, 20 px to the content). */
.wkit-main:not(.wkit-main--home) .wkit-home-head {
	gap: 0;
	padding-top: 0;
	margin-bottom: var(--wc-space-5);
}
.wkit-main:not(.wkit-main--home) .wkit-home-head > .wkit-breadcrumbs-nav {
	margin: 0 0 var(--wc-space-3);
}
.wkit-main:not(.wkit-main--home) .wkit-home-head > .wkit-home-title {
	margin: 0 0 var(--wc-space-1-5);
}
@media (max-width: 767px) {
	.wkit-main {
		padding-top: var(--wc-space-5);
		padding-bottom: var(--wc-space-14);
	}
}

/* The theme's block gap must not open white lines or push things down inside the header, footer and main (K11).
   The theme's own rule is loaded later with the same weight, so these are marked important. */
.wkit-header > *,
.wkit-topbar > *,
.wkit-topbar-inner > *,
.wkit-footer > *,
.wkit-footer-inner > *,
.wkit-footer-top > *,
.wkit-footer-about > *,
.wkit-footer-col > *,
.wkit-footer-bottom > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}
.wkit-footer-col {
	gap: var(--wc-space-4-5);
}
.wp-block-template-part > .wkit-header,
.wp-block-template-part > .wkit-footer-band,
.wp-block-template-part > .wkit-footer {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}
.wp-block-template-part:has(> .wkit-footer-band) > * + * {
	margin-block-start: 0 !important;
}

.wkit-main--directory .wkit-cmap {
	margin-top: var(--wc-space-2);
}

/* ---------- My selection (K14) ---------- */
.wkit-item-actions {
	padding: 0 var(--wc-space-5-5) var(--wc-space-5);
}
.wkit-item-actions .wkit-sel-btn {
	width: 100%;
}
.wkit-sel-btn .wkit-sel-ico {
	display: inline-flex;
}
.wkit-sel-btn .wkit-sel-ico--added,
.wkit-sel-btn.is-added .wkit-sel-ico--add {
	display: none;
}
.wkit-sel-btn.is-added .wkit-sel-ico--added {
	display: inline-flex;
}
.wkit-sel-btn.is-added {
	color: var(--wc-brand);
	background: var(--wc-brand-tint);
	border-color: var(--wc-brand);
}
.wkit-sel-msg {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wc-space-1-5);
	margin: 0;
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-brand);
}
.wkit-sel-msg-dot {
	color: var(--wc-ink-muted);
	font-weight: 400;
}
.wkit-sel-msg-ok {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-1-5);
}
.wkit-sel-msg a {
	color: var(--wc-brand);
	text-decoration: underline;
	text-underline-offset: 3px;
}
/* Indicator: icon, text and a counter (green with 1 or more, gray at 0). */
.wkit-sel-indicator {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-height: 44px;
	padding: 0 var(--wc-space-1);
	font-size: var(--wc-font-size-ui);
	color: var(--wc-topbar);
	text-decoration: none;
}
.wkit-sel-indicator--bar {
	padding: 0 var(--wc-space-4);
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-on-brand);
}
.wkit-sel-indicator:hover .wkit-sel-indicator-label {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 6px;
}
.wkit-sel-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 var(--wc-space-1-5);
	font-size: var(--wc-font-size-badge);
	font-weight: 700;
	color: var(--wc-on-brand);
	background: var(--wc-brand);
	border-radius: var(--wc-radius-pill);
}
.wkit-sel-count.is-empty {
	background: #52525b;
}
.wkit-sel-indicator--mobile {
	display: none;
}
.wkit-slot--selection {
	margin-left: auto;
}
.wkit-slot--selection ~ .wkit-slot--account {
	margin-left: 0;
}
/* Page of the list: the list on the left, the actions on the right. */
.wkit-sel-page {
	margin: var(--wc-space-6) 0 60px;
}
.wkit-sel-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wc-space-4);
	margin: 0 0 var(--wc-space-4);
}
.wkit-sel-total {
	margin: 0;
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	color: var(--wc-ink);
}
.wkit-sel-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wc-space-7);
	align-items: start;
}
.wkit-sel-list {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
}
.wkit-sel-list:empty {
	display: none;
}
.wkit-sel-item {
	display: flex;
	align-items: center;
	gap: var(--wc-space-4);
	padding: var(--wc-space-4) var(--wc-space-5-5);
	border-top: 1px solid var(--wc-border);
}
.wkit-sel-item:first-child {
	border-top: 0;
}
.wkit-sel-thumb {
	display: flex;
	flex: 0 0 72px;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	overflow: hidden;
	color: var(--wc-ink-faint);
	background: var(--wc-surface-muted);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-md);
}
.wkit-sel-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.wkit-sel-text {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: var(--wc-space-0-5);
	min-width: 0;
}
.wkit-sel-path {
	font-size: var(--wc-font-size-badge);
	color: var(--wc-ink-muted);
}
.wkit-sel-name {
	font-size: var(--wc-h2-side-size);
	font-weight: 700;
	color: var(--wc-ink-strong);
	text-decoration: none;
}
.wkit-sel-name:hover {
	color: var(--wc-brand);
}
.wkit-sel-code {
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-ink);
}
.wkit-sel-out {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-1-5);
	margin-top: var(--wc-space-1);
	font-size: var(--wc-font-size-badge);
	font-weight: 600;
	color: var(--wc-replaced-icon);
}
.wkit-sel-out[hidden] {
	display: none;
}
.wkit-sel-item.is-out .wkit-sel-thumb,
.wkit-sel-item.is-out .wkit-sel-name {
	opacity: 0.55;
}
.wkit-sel-remove,
.wkit-sel-clear {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-height: 44px;
	padding: 0 var(--wc-space-4);
	font: inherit;
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-ink-strong);
	background: var(--wc-page);
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-btn);
	cursor: pointer;
}
.wkit-sel-clear {
	min-height: 36px;
	padding: 0 var(--wc-space-1);
	color: var(--wc-brand);
	background: none;
	border: 0;
}
.wkit-sel-remove:hover {
	color: var(--wc-error);
	border-color: var(--wc-error);
}
.wkit-sel-clear:hover {
	color: var(--wc-brand-hover);
	text-decoration: underline;
	text-underline-offset: 4px;
}
.wkit-sel-tools {
	margin: 0;
}
.wkit-sel-empty {
	margin: var(--wc-space-2) 0 0;
	padding: var(--wc-space-7);
	text-align: center;
	background: var(--wc-surface-muted);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
}
.wkit-sel-empty[hidden] {
	display: none;
}
.wkit-sel-empty p {
	margin: 0 0 var(--wc-space-4);
	color: var(--wc-ink);
}
.wkit-sel-browse {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 var(--wc-space-5);
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	color: var(--wc-on-brand);
	text-decoration: none;
	background: var(--wc-brand);
	border-radius: var(--wc-radius-btn);
}
.wkit-sel-browse:hover {
	color: var(--wc-on-brand);
	background: var(--wc-brand-hover);
}
.wkit-sel-actions {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-4);
}
.wkit-sel-actions.js-wkit-sel-actions > * {
	margin: 0;
}
.wkit-sel-actions[hidden] {
	display: none;
}
.wkit-sel-warn {
	display: block;
	margin-top: var(--wc-space-0-5);
	font-size: var(--wc-font-size-badge);
	color: var(--wc-replaced-icon);
}
.wkit-download-status {
	display: inline-block;
	margin-left: var(--wc-space-3);
	font-size: var(--wc-font-size-ui);
	color: var(--wc-ink);
}
.wkit-download-status.is-error {
	color: var(--wc-error);
}
/* Family page: breadcrumb, title and description use the full width; a plugin may fill the
   full-width place "term_bar" between the description and the content (action bar). */
.wkit-archive-head > *,
.wkit-archive-title > * {
	margin-block-start: 0 !important;
}
.wkit-archive-title > :last-child {
	margin-bottom: 0 !important;
}
.wkit-archive-head {
	margin-bottom: var(--wc-space-6) !important;
}
.wkit-archive-head + * {
	margin-block-start: 0 !important;
}
.wkit-archive-head + .wkit-hub-grid,
.wkit-archive-head + * .wkit-hub-grid {
	margin-top: 0;
}
.wkit-archive-head:has(+ .wkit-slot--term_bar) {
	margin-bottom: var(--wc-space-7) !important;
}
/* Space under the bar = the gap between the cards (24 px). Padding, so no layout margin can remove it. */
.wkit-slot--term_bar {
	padding-bottom: var(--wc-space-6);
}
.wkit-slot--term_bar:has(~ * .wkit-browse),
.wkit-slot--term_bar:has(+ .wkit-browse) {
	padding-bottom: var(--wc-space-7);
}
.wkit-slot--term_bar + * {
	margin-block-start: 0 !important;
}
@media (min-width: 960px) {
	.wkit-sel-layout {
		grid-template-columns: minmax(0, 1fr) 380px;
	}
}
@media (max-width: 767px) {
	.wkit-sel-indicator--mobile {
		position: absolute;
		top: 6px;
		right: 56px;
		display: inline-flex;
		color: var(--wc-on-brand);
	}
	.wkit-sel-indicator--mobile .wkit-sel-indicator-label {
		display: none;
	}
	.wkit-sel-item {
		flex-wrap: wrap;
		padding: var(--wc-space-3-5) var(--wc-space-4);
	}
	.wkit-sel-remove {
		min-height: 44px;
	}
}

/* ======================================================================
   K22 · Search: hero, strip, quick filters, suggestions, results page
   (measures of the approved design in diseno/c08/)
   ====================================================================== */
.wkit-slot--search_hero,
.wkit-slot--search_strip {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	padding: 0;
	width: 100%;
	max-width: none;
}
/* ---------- Buttons (K28) ---------- */
.wkit-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--wc-space-2);
	min-height: var(--wc-control-height);
	padding: var(--wc-space-1-5) var(--wc-space-5);
	border: 1px solid var(--wc-brand);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-brand);
	color: var(--wc-on-brand);
	font: inherit;
	font-size: var(--wc-font-size-button);
	font-weight: var(--wc-weight-semibold);
	line-height: 1.3;
	text-decoration: none;
	cursor: pointer;
}
.wkit-btn:hover,
.wkit-btn:focus-visible {
	background: var(--wc-brand-hover);
	border-color: var(--wc-brand-hover);
	color: var(--wc-on-brand);
}
.wkit-btn svg {
	flex: 0 0 auto;
}
.wkit-btn--secondary {
	padding-inline: var(--wc-space-4-5);
	border-color: var(--wc-border-input);
	background: var(--wc-page);
	color: var(--wc-ink-strong);
}
.wkit-btn--secondary:hover,
.wkit-btn--secondary:focus-visible {
	border-color: var(--wc-brand);
	background: var(--wc-page);
	color: var(--wc-brand);
}
.wkit-btn--text,
.wkit-btn--ghost {
	padding-inline: var(--wc-space-2-5);
	border-color: transparent;
	background: transparent;
	color: var(--wc-brand);
}
.wkit-btn--text:hover,
.wkit-btn--text:focus-visible {
	border-color: transparent;
	background: var(--wc-surface-muted);
	color: var(--wc-brand-hover);
}
.wkit-btn--ghost {
	padding-inline: var(--wc-space-3-5);
	color: var(--wc-ink);
}
.wkit-btn--ghost:hover,
.wkit-btn--ghost:focus-visible {
	border-color: transparent;
	background: var(--wc-surface-muted);
	color: var(--wc-ink-strong);
}
.wkit-btn--icon {
	width: var(--wc-control-height);
	padding: 0;
	border-color: transparent;
	background: transparent;
	color: var(--wc-ink);
}
.wkit-btn--icon:hover,
.wkit-btn--icon:focus-visible {
	border-color: transparent;
	background: var(--wc-surface-chip);
	color: var(--wc-ink-strong);
}
.wkit-btn--sm {
	min-height: var(--wc-choice-height);
	padding-inline: var(--wc-space-3-5);
}
.wkit-btn--lg {
	min-height: var(--wc-field-height);
}
.wkit-btn--block {
	width: 100%;
}
.wkit-btn.is-on {
	border-color: var(--wc-brand);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-btn:disabled,
.wkit-btn.is-disabled {
	border-color: var(--wc-border-input);
	background: var(--wc-border-input);
	color: var(--wc-on-brand);
	cursor: not-allowed;
}
.wkit-btn--icon:disabled,
.wkit-btn--text:disabled,
.wkit-btn--ghost:disabled {
	border-color: transparent;
	background: transparent;
	color: var(--wc-ink-faint);
}
.wkit-btn[aria-busy="true"] {
	cursor: progress;
}
.wkit-btn__pill {
	display: inline-flex;
	align-items: center;
	height: var(--wc-counter-size);
	margin-left: var(--wc-space-0-5);
	padding: 0 var(--wc-space-2);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
	font-size: var(--wc-font-size-eyebrow);
	font-weight: var(--wc-weight-bold);
	line-height: 1;
	white-space: nowrap;
}
.wkit-btn__pill[hidden] {
	display: none;
}
.wkit-btn:hover .wkit-btn__pill {
	background: var(--wc-brand-tint-hover);
}
.wkit-btn-spin {
	width: var(--wc-space-4);
	height: var(--wc-space-4);
	border: 2px solid var(--wc-on-brand-divider);
	border-top-color: var(--wc-on-brand);
	border-radius: 50%;
	animation: wkit-spin 0.8s linear infinite;
	flex: none;
}
@keyframes wkit-spin {
	to {
		transform: rotate(360deg);
	}
}
.wkit-btn-spin--dark {
	border-color: var(--wc-border-input);
	border-top-color: var(--wc-brand);
}
.wkit-link-btn {
	padding: 0;
	border: 0;
	background: none;
	color: var(--wc-brand);
	font: inherit;
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	cursor: pointer;
	text-decoration: underline;
}
.wkit-item-card[hidden] {
	display: none !important;
}

/* Hero */
.wkit-hero {
	position: relative;
	overflow: hidden;
	background: #0f1714;
	color: var(--wc-on-brand);
}
.wkit-hero-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.wkit-hero-shade {
	position: absolute;
	inset: 0;
	background: rgba(15, 23, 20, var(--wkit-hero-dark, 0.62));
}
.wkit-hero-inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	width: min(80%, 1220px);
	min-height: 400px;
	margin: 0 auto;
	padding: calc(64px + var(--wkit-hero-pt, 0px)) 0 calc(72px + var(--wkit-hero-pb, 0px));
	box-sizing: border-box;
	align-items: center;
}
.wkit-hero-col {
	min-width: 0;
}
.wkit-hero-title {
	margin: 0 0 var(--wc-space-3-5);
	font-size: var(--wc-hero-title-size);
	line-height: 1.1;
	font-weight: 700;
	color: var(--wc-on-brand);
}
.wkit-hero-subtitle {
	margin: 0 0 var(--wc-space-7);
	font-size: var(--wc-font-size-lead);
	line-height: 1.45;
	font-weight: 600;
	color: var(--wc-on-brand);
}
@media (min-width: 960px) {
	.wkit-hero-inner {
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		column-gap: 0;
	}
	.wkit-hero-col {
		grid-column: 2;
	}
}
@media (max-width: 959px) {
	.wkit-hero-title {
		font-size: var(--wc-hero-title-size-tablet);
	}
}
@media (max-width: 767px) {
	.wkit-hero-inner {
		min-height: 0;
		padding: calc(40px + var(--wkit-hero-pt, 0px)) 0 calc(44px + var(--wkit-hero-pb, 0px));
	}
	.wkit-hero-title {
		font-size: var(--wc-hero-title-size-mobile);
	}
	.wkit-hero-subtitle {
		margin-bottom: var(--wc-space-5);
		font-size: var(--wc-font-size-body);
	}
}

/* Home hero (K22 · CX12b): tall, one column on the left, the announcement card on the right, link down to Quick links.
 * height = max( content + 2 x padding of Products → Search , min( window − header − WordPress bar − 136 , 760 ) ) from 960 px.
 * 136 = the space above the title of Quick links (80) + the title (46) + 10: with room to spare the title peeks out below the hero. */
.wkit-hero--tall {
	--wkit-hero-chrome: calc(var(--wc-header-top) + var(--wc-header-nav));
	display: flex;
	align-items: center;
	background: var(--wc-hero-ground);
}
body.admin-bar .wkit-hero--tall {
	--wkit-hero-chrome: calc(var(--wc-header-top) + var(--wc-header-nav) + 32px);
}
.wkit-hero--tall .wkit-hero-img {
	object-position: center 65%;
}
.wkit-hero--tall .wkit-hero-inner {
	grid-template-columns: minmax(0, 1fr) var(--wc-banner-w-xl);
	column-gap: var(--wc-space-16);
	align-items: start;
	min-height: 0;
	padding: var(--wkit-hero-pt, 0px) 0 var(--wkit-hero-pb, 0px);
}
.wkit-hero--tall .wkit-hero-inner.is-nocard {
	grid-template-columns: minmax(0, 1fr);
}
.wkit-hero--tall .wkit-hero-col {
	grid-column: auto;
	display: flex;
	flex-direction: column;
	max-width: 620px;
}
.wkit-hero-head {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-4);
}
.wkit-hero--tall .wkit-hero-title {
	margin: 0;
	font-size: 48px;
	letter-spacing: -0.01em;
	text-wrap: balance;
}
.wkit-hero--tall .wkit-hero-subtitle {
	margin: 0;
	line-height: 1.55;
	text-wrap: pretty;
}
.wkit-hero--tall .wkit-search {
	margin-top: var(--wc-space-7);
}
.wkit-hero--tall .wkit-quick-wrap {
	margin-bottom: var(--wc-space-4);
}
.wkit-hero-card {
	min-width: 0;
}
.wkit-hero-down {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-height: var(--wc-control-height);
	margin: var(--wc-space-3) 0 0 -6px;
	padding: 0 6px;
	border-radius: var(--wc-radius-sm);
	color: var(--wc-on-brand);
	font-size: 15px;
	font-weight: var(--wc-weight-semibold);
	line-height: 1.3;
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, 0.55);
	text-underline-offset: 5px;
}
.wkit-hero-down:hover {
	color: var(--wc-on-brand);
	text-decoration-color: var(--wc-on-brand);
}
.wkit-hero-down:focus-visible {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
	box-shadow: 0 0 0 4px var(--wc-on-brand);
}
.wkit-hero-down svg {
	flex: none;
	display: block;
}
@media (prefers-reduced-motion: no-preference) {
	html:has(.wkit-hero--tall) {
		scroll-behavior: smooth;
	}
}
@media (min-width: 960px) {
	.wkit-hero--tall {
		min-height: clamp(0px, calc(100svh - var(--wkit-hero-chrome) - 136px), 760px);
	}
	.wkit-hero--tall .wkit-hero-shade {
		background: var(--wc-hero-scrim);
	}
}
@media (min-width: 960px) and (max-width: 1279px) {
	.wkit-hero--tall .wkit-hero-inner {
		grid-template-columns: minmax(0, 1fr) var(--wc-banner-w-lg);
		column-gap: var(--wc-space-10);
	}
	.wkit-hero--tall .wkit-hero-inner.is-nocard {
		grid-template-columns: minmax(0, 1fr);
	}
	.wkit-hero--tall .wkit-hero-title {
		font-size: 44px;
	}
}
@media (max-width: 959px) {
	.wkit-hero--tall .wkit-hero-inner,
	.wkit-hero--tall .wkit-hero-inner.is-nocard {
		grid-template-columns: minmax(0, 1fr);
		row-gap: var(--wc-space-7);
	}
	.wkit-hero--tall .wkit-hero-col {
		max-width: none;
	}
	.wkit-hero--tall .wkit-hero-title {
		font-size: var(--wc-hero-title-size-tablet);
	}
}
@media (max-width: 767px) {
	.wkit-hero--tall .wkit-hero-inner {
		padding: var(--wkit-hero-pt, 0px) 0 var(--wkit-hero-pb, 0px);
		row-gap: var(--wc-space-6);
	}
	.wkit-hero--tall .wkit-hero-title {
		font-size: var(--wc-hero-title-size-mobile);
		line-height: 1.15;
	}
	.wkit-hero-head {
		gap: var(--wc-space-3);
	}
	.wkit-hero--tall .wkit-search {
		margin-top: var(--wc-space-6);
	}
	.wkit-hero--tall .wkit-quick-wrap {
		margin-bottom: var(--wc-space-3);
	}
}

/* Strip */
.wkit-strip {
	width: min(80%, 1220px);
	margin: var(--wc-space-6) auto 0;
	padding: var(--wc-space-6);
	box-sizing: border-box;
	background: var(--wc-surface-muted);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
}
@media (max-width: 767px) {
	.wkit-strip {
		margin-top: var(--wc-space-4);
		padding: var(--wc-space-4);
	}
}

/* The box */
.wkit-search {
	position: relative;
}
.wkit-quick-wrap {
	position: relative;
	margin-bottom: var(--wc-space-3-5);
}
.wkit-search--strip .wkit-quick-wrap {
	margin-bottom: var(--wc-space-4);
}
.wkit-quick {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wc-space-2);
}
.wkit-quick-single {
	display: contents;
}
.wkit-quick-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-height: 36px;
	padding: 0 var(--wc-space-4);
	border-radius: var(--wc-radius-pill);
	font: inherit;
	font-size: var(--wc-font-size-ui);
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
	white-space: nowrap;
}
.wkit-quick-btn[aria-pressed="true"] {
	font-weight: 700;
}
/* Each label reserves its bold width, so nothing moves when a button is selected. */
.wkit-quick-btn > span {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
}
.wkit-quick-btn > span::after {
	content: attr(data-text);
	height: 0;
	overflow: hidden;
	visibility: hidden;
	font-weight: 700;
	pointer-events: none;
	user-select: none;
}
.wkit-search--hero .wkit-quick-btn {
	background: transparent;
	border: 1px solid transparent;
	color: var(--wc-on-brand);
}
.wkit-search--hero .wkit-quick-btn:hover,
.wkit-search--hero .wkit-quick-btn:active {
	background: rgba(255, 255, 255, 0.14);
}
.wkit-search--hero .wkit-quick-btn[aria-pressed="true"] {
	background: var(--wc-page);
	border-color: var(--wc-page);
	color: var(--wc-ink-strong);
}
.wkit-search--strip .wkit-quick-btn {
	background: var(--wc-page);
	border: 1px solid var(--wc-border-input);
	color: var(--wc-ink-strong);
}
.wkit-search--strip .wkit-quick-btn:hover {
	border-color: var(--wc-brand);
}
.wkit-search--strip .wkit-quick-btn[aria-pressed="true"] {
	background: var(--wc-brand);
	border-color: var(--wc-brand);
	color: var(--wc-on-brand);
}
.wkit-quick-more {
	display: none;
}
@media (max-width: 767px) {
	.wkit-quick {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}
	.wkit-quick::-webkit-scrollbar {
		display: none;
	}
	.wkit-quick-btn {
		min-height: 44px;
		flex: none;
	}
	.wkit-quick-wrap.is-overflow .wkit-quick {
		-webkit-mask-image: linear-gradient(to right, #000 calc(100% - 52px), transparent);
		mask-image: linear-gradient(to right, #000 calc(100% - 52px), transparent);
	}
	.wkit-search--hero .wkit-quick-wrap.is-overflow .wkit-quick-more {
		position: absolute;
		top: 0;
		right: 4px;
		bottom: 0;
		display: flex;
		align-items: center;
		color: var(--wc-on-brand);
		pointer-events: none;
	}
	.wkit-search--strip .wkit-quick-wrap {
		margin-bottom: var(--wc-space-3);
	}
}
.wkit-search-form {
	position: relative;
	margin: 0;
}
.wkit-search-field {
	display: flex;
	align-items: center;
	gap: var(--wc-space-3);
	height: 52px;
	padding: 0 var(--wc-space-2) 0 var(--wc-space-4);
	box-sizing: border-box;
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-search);
	color: var(--wc-brand);
}
.wkit-search--strip .wkit-search-field {
	border-color: var(--wc-border-input);
}
.wkit-search-field:focus-within,
.wkit-search.is-open .wkit-search-field {
	border-color: var(--wc-brand);
	box-shadow: 0 0 0 1px var(--wc-brand);
}
.wkit-search-field:has(:focus-visible) {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
}
.wkit-search-field .wkit-ico {
	flex: none;
}
.wkit-search-input {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	outline: none;
	color: var(--wc-ink-strong);
	font: inherit;
	font-size: var(--wc-font-size-ui);
	-webkit-appearance: none;
	appearance: none;
}
@media (max-width: 767px) {
	/* 16 px on phones: a smaller field makes iOS zoom in on focus. */
	.wkit-search-input {
		font-size: var(--wc-font-size-search-input);
	}
}
.wkit-search-input:focus,
.wkit-search-input:focus-visible {
	outline: none;
}
.wkit-search-input::placeholder {
	color: var(--wc-ink-muted);
	opacity: 1;
}
.wkit-search-input::-webkit-search-cancel-button {
	-webkit-appearance: none;
}
.wkit-search-clear {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: var(--wc-radius-btn);
	background: transparent;
	color: var(--wc-ink);
	cursor: pointer;
}
.wkit-search-clear:hover {
	background: var(--wc-surface-chip);
}
.wkit-search-clear[hidden] {
	display: none;
}
@media (max-width: 767px) {
	.wkit-search-clear {
		width: 44px;
		height: 44px;
	}
}

/* Suggestions */
.wkit-search-panel {
	position: absolute;
	top: calc(100% + 8px);
	left: 0;
	right: 0;
	z-index: 60;
	max-height: min(72vh, 600px);
	overflow-y: auto;
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-search);
	box-shadow: var(--wc-shadow-menu);
	color: var(--wc-ink-strong);
}
.wkit-search-panel[hidden] {
	display: none;
}
.wkit-search-scope {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wc-space-3);
	padding: var(--wc-space-3) var(--wc-space-5);
	background: var(--wc-surface-muted);
	border-bottom: 1px solid var(--wc-border);
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink);
}
.wkit-search-scope[hidden] {
	display: none;
}
.wkit-sug-all-link {
	color: var(--wc-brand);
	font-weight: 600;
	text-decoration: underline;
}
.wkit-search-list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.wkit-sug-heading {
	margin: 0;
	padding: var(--wc-space-3-5) var(--wc-space-5) var(--wc-space-1-5);
	font-size: var(--wc-font-size-badge);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wc-ink-muted);
}
.wkit-sug {
	display: flex;
	align-items: center;
	gap: var(--wc-space-3);
	min-height: 48px;
	padding: var(--wc-space-2) var(--wc-space-5);
	margin: 0;
	cursor: pointer;
	box-sizing: border-box;
}
.wkit-sug.is-active {
	background: var(--wc-surface-chip);
	box-shadow: inset 3px 0 0 var(--wc-brand);
}
.wkit-sug-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 32px;
	height: 32px;
	border-radius: var(--wc-radius-btn);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-sug-thumb {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 48px;
	height: 36px;
	overflow: hidden;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-sm);
	background: var(--wc-surface-muted);
	color: var(--wc-ink-faint);
}
.wkit-sug-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.wkit-sug-text {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-width: 0;
	gap: var(--wc-space-0-5);
}
.wkit-sug-name {
	font-size: var(--wc-font-size-body);
	font-weight: 600;
	color: var(--wc-ink-strong);
	overflow-wrap: anywhere;
}
.wkit-sug-meta {
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
}
.wkit-hit {
	color: var(--wc-brand);
	font-weight: 700;
}
.wkit-sug-matched {
	align-self: flex-start;
	margin-top: var(--wc-space-1);
	padding: 3px var(--wc-space-2);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
	font-size: var(--wc-font-size-badge);
	font-weight: 600;
}
.wkit-sug-badge {
	flex: none;
	margin-left: auto;
}
.wkit-sug--all {
	justify-content: space-between;
	margin-top: var(--wc-space-1-5);
	border-top: 1px solid var(--wc-border);
	color: var(--wc-brand);
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
}
.wkit-sug-see {
	color: var(--wc-brand);
}
.wkit-sug-arrow {
	display: inline-flex;
	color: var(--wc-brand);
}
.wkit-sug-empty {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-1-5);
	padding: var(--wc-space-5-5) var(--wc-space-5);
	margin: 0;
	font-size: var(--wc-font-size-ui);
	color: var(--wc-ink);
}
.wkit-sug-empty strong {
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink-strong);
}
.wkit-sug-browse {
	margin-top: var(--wc-space-1);
	color: var(--wc-brand);
	font-weight: 600;
}

/* Results page */
.wkit-main--search .wkit-title-wrapper {
	margin-top: var(--wc-space-2);
}
.wkit-search-summary {
	margin: var(--wc-space-1) 0 0;
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink);
}
.wkit-search-all {
	color: var(--wc-brand);
	font-weight: 600;
	text-decoration: underline;
}
.wkit-search-prompt {
	font-size: var(--wc-font-size-search-input);
	color: var(--wc-ink);
}
.wkit-search-section {
	margin-top: var(--wc-space-10);
}
.wkit-search-heading {
	margin: 0;
	font-size: var(--wc-h2-size);
	line-height: 1.2;
	color: var(--wc-ink-strong);
}
.wkit-search-heading-count {
	margin-left: var(--wc-space-1);
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-ink-muted);
	vertical-align: baseline;
}
.wkit-search-section .wkit-hub-grid,
.wkit-search-section .wkit-items-grid {
	margin-top: var(--wc-space-4);
}
.wkit-search-note {
	margin: var(--wc-space-2) 0 0;
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
}
.wkit-search-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wc-space-2);
	margin-top: var(--wc-space-8);
	padding: var(--wc-space-12) var(--wc-space-6);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	text-align: center;
	color: var(--wc-ink);
}
.wkit-search-empty .wkit-ico {
	color: var(--wc-ink-faint);
}
.wkit-search-empty h2 {
	margin: var(--wc-space-1) 0 0;
	font-size: var(--wc-font-size-footer-heading);
	color: var(--wc-ink-strong);
}
.wkit-search-empty p {
	margin: 0 0 var(--wc-space-3);
}
@media (max-width: 767px) {
	.wkit-search-heading {
		font-size: var(--wc-font-size-subtitle);
	}
}

/* ======================================================================
   K23 · Filters of a family
   ====================================================================== */
.wkit-browse {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wc-space-4);
	align-items: start;
	margin-top: var(--wc-space-2);
}
.wkit-browse-main {
	min-width: 0;
}
.wkit-browse-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wc-space-2) var(--wc-space-3);
	margin-bottom: var(--wc-space-4);
	min-height: 32px;
}
.wkit-filters-total {
	margin: 0;
	font-size: var(--wc-font-size-ui);
	font-weight: 700;
	color: var(--wc-ink-strong);
}
.wkit-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wc-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}
.wkit-chip {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-1);
	height: 32px;
	padding: 0 var(--wc-space-1) 0 var(--wc-space-3);
	box-sizing: border-box;
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-page);
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-ink-strong);
}
.wkit-chip-x {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--wc-ink);
	cursor: pointer;
}
.wkit-chip-x:hover {
	background: var(--wc-surface-chip);
}
.wkit-browse .wkit-items-grid {
	margin-top: 0;
}
.wkit-filters-empty {
	margin: 0 0 var(--wc-space-4);
	padding: var(--wc-space-4) var(--wc-space-5);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	color: var(--wc-ink);
}
.wkit-filters-empty[hidden] {
	display: none;
}

.wkit-filters-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--wc-space-2);
	min-height: 44px;
	padding: 0 var(--wc-space-4-5);
	box-sizing: border-box;
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-md);
	background: var(--wc-page);
	font: inherit;
	font-size: var(--wc-font-size-body);
	font-weight: 600;
	color: var(--wc-ink-strong);
	cursor: pointer;
	justify-self: start;
}
.wkit-filters-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 var(--wc-space-1-5);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-brand);
	color: var(--wc-on-brand);
	font-size: var(--wc-font-size-badge);
	font-weight: 700;
}
.wkit-filters-count[hidden] {
	display: none;
}
@media (max-width: 767px) {
	.wkit-filters-toggle {
		justify-self: stretch;
	}
}
.wkit-filters-overlay {
	position: fixed;
	inset: 0;
	z-index: 999;
	background: var(--wc-scrim);
}
.wkit-filters-overlay[hidden] {
	display: none;
}
html.wkit-no-scroll {
	overflow: hidden;
}

/* The bar: a side panel on a phone or tablet (a modal dialog), a column from 960 px. */
.wkit-filters {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 1000;
	display: flex;
	flex-direction: column;
	width: min(400px, 100%);
	background: var(--wc-page);
	visibility: hidden;
	transform: translateX(-100%);
	transition: transform 0.2s ease, visibility 0.2s;
}
.wkit-filters.is-open {
	visibility: visible;
	transform: none;
}
.wkit-filters-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex: none;
	height: 60px;
	padding: 0 var(--wc-space-2) 0 var(--wc-space-5);
	box-sizing: border-box;
	border-bottom: 1px solid var(--wc-border);
}
.wkit-filters-title {
	margin: 0;
	font-size: var(--wc-h2-side-size);
	font-weight: 700;
	color: var(--wc-ink-strong);
}
.wkit-filters-title-plain {
	display: none;
}
.wkit-filters-head .wkit-filters-clear {
	display: none;
}
.wkit-filters-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: var(--wc-radius-btn);
	background: transparent;
	color: var(--wc-ink-strong);
	cursor: pointer;
}
.wkit-filters-body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: var(--wc-space-4) var(--wc-space-5);
}
.wkit-filters-foot {
	display: flex;
	flex: none;
	gap: var(--wc-space-3);
	padding: var(--wc-space-3) var(--wc-space-5);
	border-top: 1px solid var(--wc-border);
	background: var(--wc-page);
}
.wkit-filters-foot .wkit-btn {
	min-height: 48px;
}
.wkit-filters-foot .wkit-btn:not(.wkit-btn--ghost) {
	flex: 1 1 auto;
}
@media (min-width: 960px) {
	.wkit-browse {
		grid-template-columns: 260px minmax(0, 1fr);
		gap: var(--wc-space-8);
	}
	.wkit-filters-toggle,
	.wkit-filters-overlay {
		display: none;
	}
	.wkit-filters {
		position: static;
		z-index: auto;
		display: block;
		width: auto;
		background: transparent;
		visibility: visible;
		transform: none;
		transition: none;
	}
	.wkit-filters-head {
		height: auto;
		padding: 0 var(--wc-space-1) var(--wc-space-3);
		border-bottom: 0;
	}
	.wkit-filters-title-plain {
		display: inline;
	}
	.wkit-filters-title-count {
		display: none;
	}
	.wkit-filters-head .wkit-filters-clear {
		display: inline;
	}
	.wkit-filters-head .wkit-filters-clear[hidden] {
		display: none;
	}
	.wkit-filters-close,
	.wkit-filters-foot {
		display: none;
	}
	.wkit-filters-body {
		overflow: visible;
		padding: 0;
	}
}
@media (min-width: 960px) and (max-width: 1279px) {
	.wkit-browse .wkit-items-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 1280px) {
	.wkit-browse .wkit-items-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.wkit-fbox {
	margin: 0 0 var(--wc-space-3);
	padding: var(--wc-space-5);
	box-sizing: border-box;
	background: var(--wc-surface-muted);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-box);
}
.wkit-fbox-title {
	margin: 0 0 var(--wc-space-3);
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	line-height: 1.3;
	color: var(--wc-ink);
}
.wkit-fsearch {
	display: flex;
	align-items: center;
	gap: var(--wc-space-2);
	height: 44px;
	padding: 0 var(--wc-space-3);
	box-sizing: border-box;
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-md);
	background: var(--wc-page);
	color: var(--wc-brand);
}
.wkit-fsearch:focus-within {
	border-color: var(--wc-brand);
	box-shadow: 0 0 0 1px var(--wc-brand);
}
.wkit-fsearch-input {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	outline: none;
	box-shadow: none;
	font: inherit;
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink-strong);
}
.wkit-fsearch-input:focus-visible {
	outline: none;
}
.wkit-fopts {
	margin: 0;
	padding: 0;
	list-style: none;
}
.wkit-fopts li {
	margin: 0;
}
.wkit-fopt {
	position: relative;
	display: flex;
	align-items: center;
	gap: var(--wc-space-2-5);
	min-height: 32px;
	cursor: pointer;
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink-strong);
}
.wkit-fopt input {
	position: absolute;
	width: 18px;
	height: 18px;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}
.wkit-fopt-box {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 18px;
	height: 18px;
	box-sizing: border-box;
	border: 1.5px solid var(--wc-ink-faint);
	border-radius: var(--wc-radius-xs);
	background: var(--wc-page);
	color: var(--wc-on-brand);
}
.wkit-fopt-box svg {
	display: none;
}
.wkit-fopt input:checked + .wkit-fopt-box {
	background: var(--wc-brand);
	border-color: var(--wc-brand);
}
.wkit-fopt input:checked + .wkit-fopt-box svg {
	display: block;
}
.wkit-fopt input:focus-visible + .wkit-fopt-box {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
}
.wkit-fopt-name {
	flex: 1 1 auto;
	min-width: 0;
	overflow-wrap: anywhere;
}
.wkit-fopt-count {
	flex: none;
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
	font-variant-numeric: tabular-nums;
}
.wkit-fopt.is-zero {
	cursor: default;
	color: var(--wc-ink-faint);
}
.wkit-fopt.is-zero .wkit-fopt-count {
	color: var(--wc-ink-faint);
}
.wkit-fopt.is-zero .wkit-fopt-box {
	background: var(--wc-surface-chip);
	border-color: var(--wc-border-input);
}
.wkit-fopt.is-zero input {
	cursor: default;
}
@media (max-width: 959px) {
	.wkit-fopt {
		min-height: 44px;
	}
}
.wkit-frange {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wc-space-2-5);
}
.wkit-frange-field {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-1);
	min-width: 0;
}
.wkit-frange-label {
	font-size: var(--wc-font-size-badge);
	color: var(--wc-ink-muted);
}
.wkit-frange-input {
	display: flex;
	align-items: center;
	gap: var(--wc-space-1-5);
	height: 44px;
	padding: 0 var(--wc-space-3);
	box-sizing: border-box;
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-md);
	background: var(--wc-page);
}
.wkit-frange-input:focus-within {
	border-color: var(--wc-brand);
	box-shadow: 0 0 0 1px var(--wc-brand);
}
.wkit-frange-input input {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	outline: none;
	box-shadow: none;
	background: transparent;
	font: inherit;
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink-strong);
}
.wkit-frange-input input:focus-visible {
	outline: none;
}
.wkit-frange-unit {
	flex: none;
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
}
.wkit-seg {
	display: flex;
	gap: var(--wc-space-0-5);
	padding: var(--wc-space-0-5);
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-md);
	background: var(--wc-page);
}
.wkit-seg-btn {
	flex: 1 1 0;
	height: 36px;
	border: 0;
	border-radius: var(--wc-radius-btn);
	background: transparent;
	font: inherit;
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	color: var(--wc-ink-strong);
	cursor: pointer;
}
.wkit-seg-btn[aria-pressed="true"] {
	background: var(--wc-brand);
	color: var(--wc-on-brand);
}
@media (max-width: 959px) {
	.wkit-seg-btn {
		height: 40px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.wkit-filters {
		transition: none;
	}
}

/* ---------- Language selector (K24) · approved design of diseno/c09 ---------- */
.wkit-lang {
	position: relative;
	display: inline-flex;
	font-family: inherit;
}
.wkit-lang [hidden] {
	display: none !important;
}
.wkit-lang-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-1-5);
	margin: 0;
	border: 0;
	background: transparent;
	font: inherit;
	cursor: pointer;
}
.wkit-lang-chev {
	display: inline-flex;
	transition: transform 0.15s;
}
.wkit-lang.is-open .wkit-lang-chev {
	transform: rotate(180deg);
}
/* Menu: a listbox. */
.wkit-lang-menu {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	z-index: 60;
	box-sizing: border-box;
	width: 264px;
	max-width: calc(100vw - 24px);
	padding: var(--wc-space-1-5) 0;
	margin: 0;
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-search);
	box-shadow: var(--wc-shadow-menu);
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-body);
	font-weight: 400;
	line-height: 1.3;
	text-align: left;
	text-transform: none;
	letter-spacing: 0;
}
.wkit-lang-menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.wkit-lang-menu ul:focus {
	outline: none;
}
.wkit-lang-menu-h {
	display: block;
	padding: var(--wc-space-2) var(--wc-space-4) var(--wc-space-1-5);
	font-size: var(--wc-font-size-badge);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wc-ink-muted);
}
.wkit-lang-opt {
	display: flex;
	align-items: center;
	gap: var(--wc-space-2-5);
	box-sizing: border-box;
	min-height: 44px;
	margin: 0;
	padding: var(--wc-space-2) var(--wc-space-4) var(--wc-space-2) 13px;
	border-left: 3px solid transparent;
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink-strong);
	cursor: pointer;
}
.wkit-lang-opt[aria-selected="true"] {
	font-weight: 700;
}
.wkit-lang-opt.is-active {
	background: var(--wc-surface-chip);
	border-left-color: var(--wc-brand);
}
.wkit-lang-ck {
	flex: none;
	display: inline-flex;
	width: 18px;
	color: var(--wc-brand);
}
.wkit-lang-name {
	min-width: 0;
	overflow-wrap: anywhere;
}
.wkit-lang-code2 {
	margin-left: auto;
	padding-left: var(--wc-space-2);
	font-size: var(--wc-font-size-badge);
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--wc-ink-muted);
}
.wkit-lang-menu-foot {
	display: block;
	margin-top: var(--wc-space-1-5);
	padding: var(--wc-space-2-5) var(--wc-space-4) var(--wc-space-1-5);
	border-top: 1px solid var(--wc-border);
	font-size: var(--wc-font-size-badge);
	line-height: 1.45;
	color: var(--wc-ink-muted);
}
.wkit-lang-live {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* In the dark bar of the header, after Account. */
.wkit-slot--language {
	margin-left: auto;
}
.wkit-slot--selection ~ .wkit-slot--language,
.wkit-slot--account ~ .wkit-slot--language {
	margin-left: var(--wc-space-3);
}
.wkit-lang--header .wkit-lang-btn {
	height: 36px;
	padding: 0 var(--wc-space-2-5);
	border-radius: var(--wc-radius-sm);
	color: var(--wc-topbar-link);
	font-size: var(--wc-font-size-small);
	font-weight: 600;
}
.wkit-lang--header .wkit-lang-btn:hover,
.wkit-lang--header .wkit-lang-btn[aria-expanded="true"] {
	background: var(--wc-topbar-hover);
	color: var(--wc-on-brand);
}
.wkit-lang--header .wkit-lang-btn:focus-visible,
.wkit-lang--gate .wkit-lang-btn:focus-visible {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
	box-shadow: 0 0 0 2px var(--wc-page);
}
.wkit-slot .wkit-lang-btn:hover {
	text-decoration: none;
}

/* On the sign-in screen: a light background, so the button is dark. */
.wkit-lang--gate .wkit-lang-btn {
	height: 36px;
	padding: 0 var(--wc-space-2-5);
	border-radius: var(--wc-radius-sm);
	color: var(--wc-ink-chip);
	font-size: var(--wc-font-size-small);
	font-weight: 600;
}
.wkit-lang--gate .wkit-lang-btn:hover,
.wkit-lang--gate .wkit-lang-btn[aria-expanded="true"] {
	background: var(--wc-surface-chip);
	color: var(--wc-ink-strong);
}
@media (max-width: 767px) {
	.wkit-lang--gate .wkit-lang-btn {
		height: 44px;
		padding: 0 var(--wc-space-3);
	}
}

/* Mobile menu: a row that opens in line. */
.wkit-lang--drawer {
	display: block;
	width: 100%;
	margin-top: var(--wc-space-2);
	padding-top: var(--wc-space-1);
	border-top: 1px solid var(--wc-border);
}
.wkit-lang--drawer .wkit-lang-btn {
	width: 100%;
	min-height: 52px;
	gap: var(--wc-space-3);
	padding: 0 var(--wc-space-3-5) 0 0;
	font-size: var(--wc-font-size-body);
	font-weight: 600;
	color: var(--wc-ink-strong);
	text-align: left;
}
.wkit-lang--drawer .wkit-lang-ico {
	display: inline-flex;
	color: var(--wc-brand);
}
.wkit-lang--drawer .wkit-lang-cur {
	margin-left: auto;
	font-weight: 400;
	color: var(--wc-ink);
}
.wkit-lang--drawer .wkit-lang-chev {
	color: var(--wc-ink);
}
.wkit-lang--drawer .wkit-lang-menu {
	position: static;
	width: auto;
	max-width: none;
	padding: 0 0 var(--wc-space-2);
	border: 0;
	border-radius: 0;
	box-shadow: none;
}
.wkit-lang--drawer .wkit-lang-opt {
	min-height: 48px;
	padding-left: 0;
	border-left-width: 3px;
}

/* My account: the field, like Default region. */
.wkit-lang--field {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-2);
}
.wkit-lang-control {
	position: relative;
}
.wkit-lang-select {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 48px;
	padding: 0 var(--wc-space-3-5);
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-page);
	font: inherit;
	font-size: var(--wc-font-size-search-input);
	color: var(--wc-ink-strong);
	text-align: left;
	cursor: pointer;
}
.wkit-lang-select[aria-expanded="true"] {
	border-color: var(--wc-brand);
}
.wkit-lang-select:focus-visible {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
}
.wkit-lang-menu--field {
	left: 0;
	right: auto;
	top: calc(100% + 4px);
	width: 100%;
}

/* Next to the PDF downloads: the small part of a split button. The button itself belongs to the page. */
.wkit-lang--pdf {
	position: static;
}
.wkit-lang-pdfbtn {
	justify-content: center;
	height: 44px;
	min-width: 64px;
	padding: 0 var(--wc-space-3);
	border-left: 1px solid var(--wc-on-brand-divider);
	border-radius: 0 var(--wc-radius-btn) var(--wc-radius-btn) 0;
	color: var(--wc-on-brand);
	font-size: var(--wc-font-size-small);
	font-weight: 700;
	letter-spacing: 0.04em;
}
.wkit-lang--pdf.is-open .wkit-lang-pdfbtn,
.wkit-lang--pdf.is-alt .wkit-lang-pdfbtn {
	background: var(--wc-brand-hover);
}
.wkit-lang-pdfbtn:focus-visible {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
	box-shadow: 0 0 0 2px var(--wc-page);
}
.wkit-lang-menu--pdf {
	display: block;
	left: 0;
	right: auto;
	top: calc(100% + 8px);
}
.wkit-pdf-lang-note {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-1-5);
	margin: var(--wc-space-1-5) 0 0;
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-brand);
}
.wkit-pdf-lang-note[hidden] {
	display: none;
}
@media (max-width: 767px) {
	.wkit-lang-pdfbtn {
		height: 48px;
		min-width: 72px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.wkit-lang-chev {
		transition: none;
	}
}

.wkit-lang--field .wkit-help {
	margin: 0;
}

/* ======================================================================
   K03 / K05 · Flat content (a registration with no families): archive grid, empty state, "Show all N"
   ====================================================================== */
.wkit-flat-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wc-space-3-5);
	margin: 30px 0;
}
.wkit-flat-grid > * {
	min-width: 0;
}
@media (min-width: 768px) {
	.wkit-flat-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--wc-space-6);
	}
}
@media (min-width: 960px) {
	.wkit-flat-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
.wkit-hub-total + .wkit-flat-grid {
	margin-top: var(--wc-space-3-5);
}
.wkit-browse .wkit-flat-grid {
	margin-top: 0;
}
@media (min-width: 960px) and (max-width: 1279px) {
	.wkit-browse .wkit-flat-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 1280px) {
	.wkit-browse .wkit-flat-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
.wkit-search-section .wkit-flat-grid {
	margin-top: var(--wc-space-4);
}
.wkit-search-seeall {
	margin-left: var(--wc-space-3-5);
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	color: var(--wc-brand);
	text-decoration: none;
}
.wkit-search-seeall:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* The empty state of a flat archive: a box with a magnifier, a title, a line and a button. */
.wkit-filters-empty--card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wc-space-3);
	padding: var(--wc-space-12) var(--wc-space-10);
	text-align: center;
	border-radius: var(--wc-radius-card);
}
.wkit-filters-empty--card[hidden] {
	display: none;
}
.wkit-filters-empty-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: var(--wc-radius-search);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-filters-empty-title {
	margin: var(--wc-space-1) 0 0;
	font-size: var(--wc-font-size-subtitle);
	line-height: 1.3;
	color: var(--wc-ink-strong);
}
.wkit-filters-empty-text {
	margin: 0;
	max-width: 46ch;
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink);
}

/* "Show all N" under the first options of a long list of choices. */
.wkit-fmore {
	margin-top: var(--wc-space-2);
	padding: var(--wc-space-1) 0;
	font-size: var(--wc-font-size-small);
	font-weight: 600;
}
.wkit-fopts li[hidden] {
	display: none;
}

/* No frame after a mouse click: the script below marks the page while the mouse is in use; the keyboard keeps its frame. */
html.wkit-mouse :focus,
html.wkit-mouse :focus-visible {
	outline: none !important;
}

/* The card is a link that fills it, and the card hides what overflows: its focus frame showed as a single line above the button.
   The keyboard (and a page restored with "Back") marks the card itself instead: green border and green title. */
.wkit-item-link:focus-visible {
	outline: none;
}
.wkit-item-card:has(.wkit-item-link:focus-visible) {
	border-color: var(--wc-brand);
	box-shadow: 0 0 0 2px var(--wc-brand);
}
.wkit-item-card:has(.wkit-item-link:focus-visible) .wkit-item-title {
	color: var(--wc-brand);
}
html.wkit-mouse .wkit-item-card:has(.wkit-item-link:focus-visible):not(:hover) {
	border-color: var(--wc-border);
	box-shadow: var(--wc-shadow-card);
}
html.wkit-mouse .wkit-item-card:has(.wkit-item-link:focus-visible):not(:hover) .wkit-item-title {
	color: var(--wc-ink-strong);
}

/* ==========================================================================
   My requests, details and top-bar links (K27) · was requests.css until Kit 0.17
   ========================================================================== */
/* WiseConn Kit · My requests (K27) and the header link (C11).
 * Colors follow the design system: brand #1e7633, tint #e8f3eb, border #e2e8f0, ink #0f172a, muted #64748b. */

/* ---------- "My requests" in the dark bar and in the mobile menu ---------- */
.wkit-slot--account {
	display: inline-flex;
	align-items: center;
	gap: 0;
}
.wkit-slot--account .wkit-account-link {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-height: 44px;
	padding: 0 var(--wc-space-4);
	font-size: var(--wc-font-size-small);
	font-weight: 600;
}
.wkit-slot--account .wkit-account-link:hover span {
	text-decoration: underline;
	text-underline-offset: 6px;
	text-decoration-thickness: 1px;
}
.wkit-drawer-foot .wkit-slot--account .wkit-account-link {
	color: var(--wc-ink-strong);
	padding: var(--wc-space-3) 0;
	font-size: var(--wc-font-size-body);
}
.wkit-myreq-link {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-height: 44px;
	padding: 0 var(--wc-space-4);
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-topbar-link);
	text-decoration: none !important;
}
.wkit-myreq-link:hover span {
	text-decoration: underline;
	text-underline-offset: 6px;
	text-decoration-thickness: 1px;
}
.wkit-myreq-link.is-current {
	color: var(--wc-on-brand);
}
.wkit-drawer-foot .wkit-myreq-link {
	color: var(--wc-ink-strong);
	padding: var(--wc-space-3) 0;
	font-size: var(--wc-font-size-body);
}
.wkit-drawer-foot .wkit-slot--account {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}


/* ---------- Page ---------- */
.wkit-myreq {
	max-width: 1220px;
	margin: 0 auto;
	padding: 0 0 var(--wc-space-14);
	color: var(--wc-ink);
}
.wkit-myreq-head {
	margin-bottom: var(--wc-space-5);
}
.wkit-myreq-title {
	margin: 0 0 var(--wc-space-1-5);
}
.wkit-myreq-back {
	margin: 0 0 var(--wc-space-3);
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
}
.wkit-myreq-back a,
.wkit-myreq-ref {
	color: var(--wc-brand);
	font-weight: 700;
	text-decoration: none;
}
.wkit-myreq-back a:hover,
.wkit-myreq-ref:hover {
	text-decoration: underline;
}
.wkit-myreq-flash {
	margin: 0 0 var(--wc-space-4);
	padding: var(--wc-space-3) var(--wc-space-4);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-surface-muted);
	font-size: var(--wc-font-size-ui);
	color: var(--wc-ink-strong);
}
.wkit-myreq-flash.is-error {
	border-color: var(--wc-error-line);
	background: var(--wc-error-bg);
	color: var(--wc-error-ink);
}
.wkit-myreq-empty {
	padding: var(--wc-space-10) var(--wc-space-6);
	border: 1px dashed var(--wc-border-input);
	border-radius: var(--wc-radius-card);
	text-align: center;
}
.wkit-myreq-note {
	margin: var(--wc-space-4) 0 0;
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
}

/* Tabs */
.wkit-myreq-tabs {
	margin: 0 0 var(--wc-space-4);
}
.wkit-tabs--count-brand .wkit-tab.is-current .wkit-tab__count {
	background: var(--wc-brand);
	color: var(--wc-on-brand);
}

/* Table (desktop) and cards (mobile) */
.wkit-myreq-table {
	min-width: 760px;
}
.wkit-myreq-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wc-space-2);
}
.wkit-myreq-actions .wkit-btn {
	min-height: 40px;
	padding: 0 var(--wc-space-3-5);
}
.wkit-myreq-cards {
	display: none;
	margin: 0;
	padding: 0;
	list-style: none;
}
.wkit-myreq-card {
	margin: 0 0 var(--wc-space-3);
	padding: var(--wc-space-4);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
}
.wkit-myreq-card-top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--wc-space-2);
}
.wkit-myreq-card-title {
	margin: var(--wc-space-2-5) 0 var(--wc-space-1);
	font-size: var(--wc-font-size-search-input);
	font-weight: 700;
	color: var(--wc-ink-strong);
}
.wkit-myreq-card-meta {
	margin: 0 0 var(--wc-space-3);
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
}
@media (max-width: 767px) {
	.wkit-myreq-tablewrap {
		display: none;
	}
	.wkit-myreq-cards {
		display: block;
	}
}

/* Type label and status */
.wkit-myreq-type {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-1-5);
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-ink);
}
/* Detail */
.wkit-myreq-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wc-space-2-5);
	margin: 0 0 var(--wc-space-6);
}
.wkit-myreq-actform {
	margin: 0;
}
.wkit-myreq-detail {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--wc-space-6);
}
@media (min-width: 960px) {
	.wkit-myreq-detail {
		grid-template-columns: minmax(0, 1fr) 320px;
		align-items: start;
		gap: var(--wc-space-10);
	}
}
.wkit-myreq-panel {
	padding: var(--wc-space-5);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
}
.wkit-myreq-panel h2 {
	margin: 0 0 var(--wc-space-2-5);
	font-size: var(--wc-font-size-search-input);
	font-weight: 700;
	color: var(--wc-ink-strong);
}
.wkit-myreq-panel h3 {
	margin: var(--wc-space-4-5) 0 var(--wc-space-2);
	font-size: var(--wc-font-size-small);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wc-ink-muted);
}
.wkit-myreq-panel dl {
	margin: 0;
}
.wkit-myreq-panel dt {
	font-size: var(--wc-font-size-badge);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wc-ink-muted);
}
.wkit-myreq-panel dd {
	margin: var(--wc-space-0-5) 0 var(--wc-space-2-5);
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	color: var(--wc-ink-strong);
}
.wkit-myreq-history {
	margin: 0 0 var(--wc-space-3-5);
	padding: 0;
	list-style: none;
	font-size: var(--wc-font-size-ui);
}
.wkit-myreq-history li {
	padding: var(--wc-space-1) 0;
}
.wkit-myreq-history span {
	font-weight: 700;
	color: var(--wc-ink-strong);
}
.wkit-myreq-hint {
	margin: var(--wc-space-2) 0 0;
	font-size: var(--wc-font-size-badge);
	color: var(--wc-ink-muted);
}
.wkit-myreq-check {
	margin: 0;
}
.wkit-myreq-staff {
	margin-top: var(--wc-space-4-5);
	padding: var(--wc-space-3-5);
	border: 1px dashed var(--wc-ink-faint);
	border-radius: var(--wc-radius-md);
}
.wkit-myreq-staff p {
	margin: var(--wc-space-2) 0;
	font-size: var(--wc-font-size-ui);
}
.wkit-myreq-staff a {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-1-5);
	color: var(--wc-brand);
	font-weight: 700;
}

/* The copy of a request: the blocks every type draws with these classes */
.wkit-myreq-block {
	margin: 0 0 var(--wc-space-7);
}
.wkit-myreq-block h2 {
	margin: 0 0 var(--wc-space-3);
	font-size: var(--wc-h2-side-size);
	font-weight: 700;
	color: var(--wc-ink-strong);
}
.wkit-myreq-fields {
	margin: 0;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
}
.wkit-myreq-fields > div {
	display: grid;
	grid-template-columns: 180px minmax(0, 1fr);
	gap: var(--wc-space-3);
	padding: var(--wc-space-3) var(--wc-space-4);
	border-bottom: 1px solid var(--wc-border);
}
.wkit-myreq-fields > div:last-child {
	border-bottom: 0;
}
.wkit-myreq-fields dt {
	font-size: var(--wc-font-size-small);
	font-weight: 600;
	color: var(--wc-ink-muted);
}
.wkit-myreq-fields dd {
	margin: 0;
	font-size: var(--wc-font-size-ui);
	font-weight: 600;
	color: var(--wc-ink-strong);
	overflow-wrap: anywhere;
}
@media (max-width: 559px) {
	.wkit-myreq-fields > div {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wc-space-0-5);
	}
}
.wkit-myreq-lines {
	overflow-x: auto;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
}
.wkit-myreq-lines table {
	width: 100%;
	min-width: 620px;
	border-collapse: collapse;
	font-size: var(--wc-font-size-ui);
}
.wkit-myreq-lines th,
.wkit-myreq-lines td {
	padding: var(--wc-space-3) var(--wc-space-3-5);
	border-bottom: 1px solid var(--wc-border);
	text-align: left;
	vertical-align: top;
}
.wkit-myreq-lines th {
	background: var(--wc-surface-muted);
	font-size: var(--wc-font-size-badge);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wc-ink-muted);
}
.wkit-myreq-lines tfoot td {
	background: var(--wc-surface-muted);
	font-weight: 700;
	color: var(--wc-ink-strong);
	border-bottom: 0;
}
.wkit-myreq-lines .is-num {
	text-align: right;
}
.wkit-myreq-product {
	display: flex;
	gap: var(--wc-space-3);
	align-items: center;
}
.wkit-myreq-product img,
.wkit-myreq-product .wkit-myreq-noimg {
	width: 48px;
	height: 36px;
	flex: 0 0 auto;
	object-fit: contain;
	border-radius: var(--wc-radius-sm);
	background: var(--wc-surface-muted);
}
.wkit-myreq-product strong {
	display: block;
	font-size: var(--wc-font-size-ui);
	color: var(--wc-ink-strong);
}
.wkit-myreq-product small {
	display: block;
	font-size: var(--wc-font-size-badge);
	color: var(--wc-ink-muted);
}
.wkit-myreq-warn {
	display: inline-block;
	margin-top: var(--wc-space-1);
	padding: var(--wc-space-0-5) var(--wc-space-2);
	border-radius: var(--wc-radius-xs);
	background: var(--wc-replaced-bg);
	font-size: var(--wc-font-size-badge);
	font-weight: 700;
	color: var(--wc-replaced-icon);
}
.wkit-myreq-linesnote {
	margin: var(--wc-space-2) 0 0;
	font-size: var(--wc-font-size-badge);
	color: var(--wc-ink-muted);
}

/* The underline of the links of the dark bar goes only under the text, never under the counter or the icon. */
.wkit-slot a.wkit-sel-indicator:hover,
.wkit-slot a.wkit-sel-indicator:focus-visible,
.wkit-slot a.wkit-account-link:hover,
.wkit-slot a.wkit-account-link:focus-visible,
.wkit-slot a.wkit-myreq-link:hover,
.wkit-slot a.wkit-myreq-link:focus-visible {
	text-decoration: none !important;
}
.wkit-slot a.wkit-sel-indicator:hover .wkit-sel-indicator-label,
.wkit-slot a.wkit-sel-indicator:focus-visible .wkit-sel-indicator-label,
.wkit-slot a.wkit-account-link:hover span,
.wkit-slot a.wkit-account-link:focus-visible span,
.wkit-slot a.wkit-myreq-link:hover span,
.wkit-slot a.wkit-myreq-link:focus-visible span {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 6px;
}

/* Slot "quotes" of the dark bar (K11): after My selection, before My requests and Account. */
.wkit-slot--selection ~ .wkit-slot--quotes {
	margin-left: 0;
}
.wkit-drawer-foot .wkit-slot--quotes {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
/* Under 1280 px the links of the bar keep their icon and counter, never the text (the aria-label says it all); at 1024 px the text does not fit (C11d, D2). */
@media (max-width: 1279px) {
	.wkit-slot .wkit-sel-indicator-label,
	.wkit-slot .wkit-myreq-link span,
	.wkit-slot .wkit-quotes-label {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}
	.wkit-slot .wkit-sel-indicator--bar,
	.wkit-slot .wkit-myreq-link,
	.wkit-slot .wkit-quotes-link {
		min-width: 44px;
		justify-content: center;
		padding: 0 var(--wc-space-2-5);
	}
}

/* ==========================================================================
   "View as" bar (K15) · was access.css
   ========================================================================== */
/* K15 · "View as" bar (administrators only). */
.wkit-viewas {
	position: fixed;
	left: 12px;
	bottom: 12px;
	z-index: 99990;
	display: flex;
	align-items: center;
	gap: var(--wc-space-2-5);
	padding: var(--wc-space-1-5) var(--wc-space-3);
	background: var(--wc-topbar);
	color: var(--wc-on-brand);
	border-radius: var(--wc-radius-pill);
	font: 600 13px/1.2 Montserrat, system-ui, sans-serif;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}
.wkit-viewas.is-active { background: var(--wc-brand); }
.wkit-viewas-menu { position: relative; }
.wkit-viewas-menu summary {
	list-style: none;
	cursor: pointer;
	padding: var(--wc-space-1) var(--wc-space-0-5);
}
.wkit-viewas-menu summary::-webkit-details-marker { display: none; }
.wkit-viewas-menu summary::after { content: " \25BE"; }
.wkit-viewas-menu ul {
	position: absolute;
	bottom: calc(100% + 10px);
	left: -12px;
	margin: 0;
	padding: var(--wc-space-1-5);
	min-width: 210px;
	list-style: none;
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-search);
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18);
}
.wkit-viewas-menu li { margin: 0; }
.wkit-viewas-menu a {
	display: block;
	padding: var(--wc-space-2) var(--wc-space-3);
	border-radius: var(--wc-radius-btn);
	color: var(--wc-ink-strong);
	font-weight: 600;
	text-decoration: none;
}
.wkit-viewas-menu a:hover,
.wkit-viewas-menu a:focus-visible { background: var(--wc-navbar); }
.wkit-viewas a:focus-visible,
.wkit-viewas summary:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 2px; }
.wkit-viewas-exit {
	color: var(--wc-on-brand);
	text-decoration: underline;
	font-weight: 600;
}
.wkit-viewas-exit:focus-visible { outline-color: var(--wc-page); }
@media (max-width: 600px) {
	.wkit-viewas { left: 8px; right: 8px; bottom: 8px; justify-content: space-between; border-radius: var(--wc-radius-card); }
	.wkit-viewas-menu ul { left: 0; right: auto; min-width: min(260px, 80vw); }
}

/* ==========================================================================
   Shared components (K28) · built only with the tokens of the design system.
   Pages use these classes; a plugin that needs a variant asks for it here.
   ========================================================================== */

/* The measures of the components include the border, as in the approved design. */
.wkit-btn,
.wkit-tab,
.wkit-tab__count,
.wkit-status,
.wkit-box,
.wkit-input,
.wkit-textarea,
.wkit-select,
.wkit-fieldgroup,
.wkit-card,
.wkit-dialog,
.wkit-table-wrap {
	box-sizing: border-box;
}

/* ---------- Split button: the main action joined to the language picker ---------- */
.wkit-split {
	position: relative;
	display: inline-flex;
	flex: none;
	border-radius: var(--wc-radius-btn);
	background: var(--wc-brand);
}
.wkit-split--wide {
	display: flex;
	width: 100%;
}
.wkit-split > .wkit-btn {
	border-color: transparent;
	border-radius: var(--wc-radius-btn) 0 0 var(--wc-radius-btn);
	background: transparent;
}
.wkit-split > .wkit-btn:hover,
.wkit-split > .wkit-btn:focus-visible {
	border-color: transparent;
	background: var(--wc-brand-hover);
}
.wkit-split--wide > .wkit-btn {
	flex: 1 1 auto;
}
.wkit-split:focus-within {
	z-index: 2;
}
.wkit-split .wkit-lang-pdfbtn {
	height: auto;
	min-height: var(--wc-field-height);
}
@media (max-width: 767px) {
	.wkit-split {
		display: flex;
		width: 100%;
	}
	.wkit-split > .wkit-btn {
		flex: 1;
		min-height: var(--wc-field-height);
	}
}

/* ---------- Tabs ---------- */
.wkit-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wc-space-1);
	border-bottom: 1px solid var(--wc-border);
}
.wkit-tab {
	display: flex;
	align-items: center;
	gap: var(--wc-space-2);
	height: var(--wc-tab-height);
	margin-bottom: -1px;
	padding: 0 var(--wc-space-4);
	border: 0;
	border-bottom: 2px solid transparent;
	background: transparent;
	color: var(--wc-ink);
	font: inherit;
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-semibold);
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}
.wkit-tab:hover {
	color: var(--wc-ink-strong);
}
.wkit-tab[aria-selected="true"],
.wkit-tab[aria-current="page"],
.wkit-tab.is-current,
.wkit-tab.is-active {
	border-bottom-color: var(--wc-brand);
	color: var(--wc-ink-strong);
	font-weight: var(--wc-weight-bold);
}
.wkit-tab__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--wc-counter-size);
	height: var(--wc-counter-size);
	padding: 0 var(--wc-space-2);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-surface-chip);
	color: var(--wc-ink-chip);
	font-size: var(--wc-font-size-badge);
	font-weight: var(--wc-weight-bold);
}
.wkit-tab--region {
	padding-inline: var(--wc-space-4-5);
}
.wkit-tab--region.is-active .wkit-tab__count {
	background: var(--wc-brand);
	color: var(--wc-on-brand);
}
@media (max-width: 767px) {
	.wkit-tabs {
		flex-wrap: nowrap;
		overflow-x: auto;
	}
	.wkit-tab {
		flex: 0 0 auto;
	}
	.wkit-tab--region {
		padding-inline: var(--wc-space-3);
	}
}

/* ---------- Table ---------- */
.wkit-table-wrap {
	overflow-x: auto;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
}
.wkit-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wc-font-size-ui);
}
.wkit-table th {
	position: relative;
	padding: var(--wc-space-3) var(--wc-space-4);
	border-bottom: 1px solid var(--wc-border);
	background: var(--wc-surface-muted);
	color: var(--wc-ink);
	font-size: var(--wc-font-size-badge);
	font-weight: var(--wc-weight-semibold);
	letter-spacing: 0.06em;
	text-align: left;
	text-transform: uppercase;
	white-space: nowrap;
}
.wkit-table td {
	padding: var(--wc-space-3-5) var(--wc-space-4);
	border-bottom: 1px solid var(--wc-border);
	vertical-align: middle;
}
.wkit-table tr:last-child td {
	border-bottom: 0;
}
.wkit-table .is-num {
	color: var(--wc-ink-strong);
	font-variant-numeric: tabular-nums;
	font-weight: var(--wc-weight-bold);
	text-align: right;
	white-space: nowrap;
}
.wkit-table tr.is-marked td {
	background: var(--wc-brand-tint);
}

/* Roomy table (product page and sensors): more room in every cell, rows that stack as cards under 960 px with `.wkit-table--stack`. */
.wkit-table--roomy {
	min-width: 640px;
}
.wkit-table--roomy th,
.wkit-table--roomy td {
	padding: var(--wc-space-3-5) var(--wc-space-5);
	border: 0;
	border-top: 1px solid var(--wc-border);
	vertical-align: top;
}
.wkit-table--roomy thead th {
	padding: var(--wc-space-3) var(--wc-space-5);
	border-top: 0;
	color: var(--wc-ink-muted);
	font-weight: var(--wc-weight-semibold);
}
.wkit-table--roomy tr[hidden] {
	display: none;
}
.wkit-table--roomy tbody tr:hover td {
	background: var(--wc-surface-muted);
}
@media (max-width: 959px) {
	.wkit-table-wrap:has(> .wkit-table--roomy) {
		overflow: visible;
		border: 0;
		border-radius: 0;
	}
	.wkit-table--stack {
		min-width: 0;
	}
	.wkit-table--stack thead {
		display: none;
	}
	.wkit-table--stack,
	.wkit-table--stack tbody {
		display: block;
	}
	.wkit-table--stack tbody {
		display: flex;
		flex-direction: column;
		gap: var(--wc-space-3);
	}
	.wkit-table--stack tr {
		display: flex;
		flex-direction: column;
		gap: var(--wc-space-1-5);
		padding: var(--wc-space-3-5) var(--wc-space-4);
		border: 1px solid var(--wc-border);
		border-radius: var(--wc-radius-search);
	}
	.wkit-table--stack tr[hidden] {
		display: none;
	}
	.wkit-table--stack td {
		display: block;
		padding: 0;
		border: 0;
	}
	.wkit-table--stack td::before {
		content: attr(data-label);
		display: block;
		color: var(--wc-ink-muted);
		font-size: var(--wc-font-size-eyebrow);
		font-weight: var(--wc-weight-semibold);
		letter-spacing: 0.06em;
		text-transform: uppercase;
	}
	.wkit-table--stack tbody tr:hover td {
		background: transparent;
	}
}

/* ---------- State labels ---------- */
.wkit-status {
	display: inline-flex;
	text-decoration: none;
	align-items: center;
	gap: var(--wc-space-1-5);
	padding: var(--wc-space-1) var(--wc-space-3);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-surface-chip);
	color: var(--wc-ink-chip);
	font-size: var(--wc-font-size-badge);
	font-weight: var(--wc-weight-semibold);
	line-height: 1.5;
	white-space: nowrap;
}
.wkit-status--review {
	background: var(--wc-review-bg);
	color: var(--wc-review-ink);
}
.wkit-status--ok {
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-status--warn {
	background: var(--wc-replaced-bg);
	color: var(--wc-replaced-icon);
}
.wkit-status--muted {
	background: var(--wc-border);
	color: var(--wc-ink-chip);
}
.wkit-status--compact {
	padding: var(--wc-space-0-5) var(--wc-space-2-5);
}
.wkit-status--sm {
	padding: var(--wc-space-0-5) var(--wc-space-2);
	font-size: var(--wc-font-size-eyebrow);
}
.wkit-status__dot {
	flex: none;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
}

.wkit-eyebrow--md {
	font-size: var(--wc-font-size-badge);
}

/* ---------- Status bar of a page (Review pending, Replaced by) ---------- */
.wkit-statusbar {
	width: 100vw;
	max-width: 100vw;
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
	border-bottom: 1px solid var(--wc-replaced-line);
	background: var(--wc-replaced-bg);
	color: var(--wc-replaced-ink);
}
.wkit-statusbar--review {
	border-bottom-color: var(--wc-review-line);
	background: var(--wc-review-bg);
	color: var(--wc-review-ink);
}
.wkit-statusbar__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wc-space-1-5) var(--wc-space-3-5);
	box-sizing: border-box;
	min-height: 56px;
	padding: var(--wc-space-2-5) 0;
	font-size: var(--wc-font-size-ui);
}
.wkit-statusbar--review .wkit-statusbar__inner {
	flex-wrap: nowrap;
	align-items: flex-start;
	padding: var(--wc-space-4-5) 0;
	line-height: 1.5;
}
.wkit-statusbar svg {
	flex: 0 0 auto;
	color: var(--wc-replaced-icon);
}
.wkit-statusbar--review svg {
	color: var(--wc-review-icon);
}
.wkit-statusbar a {
	color: var(--wc-replaced-ink);
	font-weight: var(--wc-weight-bold);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.wkit-statusbar__text {
	min-width: 0;
	margin: 0;
	line-height: 1.5;
	overflow-wrap: anywhere;
}
.wkit-statusbar__title {
	font-weight: var(--wc-weight-bold);
}
.wkit-statusbar__sep {
	margin: 0 var(--wc-space-2);
	opacity: 0.6;
}
.wkit-statusbar__name {
	font-weight: var(--wc-weight-semibold);
}
@media (max-width: 767px) {
	.wkit-statusbar--review .wkit-statusbar__inner {
		padding: var(--wc-space-3) 0;
		gap: var(--wc-space-3);
	}
	.wkit-statusbar__title {
		display: block;
	}
	.wkit-statusbar__sep {
		display: none;
	}
}

/* ---------- Boxes and notices ---------- */
.wkit-box {
	display: flex;
	align-items: flex-start;
	gap: var(--wc-space-3);
	padding: var(--wc-space-3-5) var(--wc-space-4);
	border: 1px solid var(--wc-info-line);
	border-radius: var(--wc-radius-md);
	background: var(--wc-info-bg);
	color: var(--wc-info-ink);
	font-size: var(--wc-font-size-ui);
	line-height: 1.5;
}
.wkit-box--success {
	border-color: var(--wc-success-line);
	background: var(--wc-success-bg);
	color: var(--wc-success-ink);
}
.wkit-box--warning {
	border-color: var(--wc-warning-line);
	background: var(--wc-warning-bg);
	color: var(--wc-warning-ink);
}
.wkit-box--error {
	border-color: var(--wc-error-line);
	background: var(--wc-error-bg);
	color: var(--wc-error-ink);
}
.wkit-box--plain {
	border-color: var(--wc-border);
	background: var(--wc-surface-muted);
	color: var(--wc-ink);
}
.wkit-box__icon {
	flex: none;
	margin-top: var(--wc-space-0-5);
}

/* ---------- Forms ---------- */
.wkit-field {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-2);
	min-width: 0;
}
.wkit-label {
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-semibold);
	line-height: 1.4;
}
.wkit-label em {
	color: var(--wc-ink-muted);
	font-style: normal;
	font-weight: var(--wc-weight-regular);
}
.wkit-input,
.wkit-textarea,
.wkit-select {
	width: 100%;
	height: var(--wc-field-height);
	padding: 0 var(--wc-space-3-5);
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-page);
	color: var(--wc-ink-strong);
	font: inherit;
	font-size: var(--wc-font-size-search-input);
}
.wkit-select {
	padding-right: var(--wc-space-10);
	background: var(--wc-page) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230f172a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right var(--wc-space-4) center;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}
.wkit-input[readonly] {
	background: var(--wc-surface-muted);
	color: var(--wc-ink);
}
.wkit-textarea {
	height: auto;
	min-height: 112px;
	padding: var(--wc-space-3) var(--wc-space-3-5);
	line-height: 1.5;
	resize: vertical;
}
.wkit-field.is-error .wkit-input,
.wkit-field.is-error .wkit-textarea,
.wkit-field.is-error .wkit-select {
	border-color: var(--wc-error);
	box-shadow: inset 0 0 0 1px var(--wc-error);
}
.wkit-help {
	margin: 0;
	color: var(--wc-ink-muted);
	font-size: var(--wc-font-size-small);
	line-height: 1.5;
}
.wkit-error {
	display: flex;
	align-items: flex-start;
	gap: var(--wc-space-1-5);
	margin: 0;
	color: var(--wc-error);
	font-size: var(--wc-font-size-small);
	font-weight: var(--wc-weight-semibold);
	line-height: 1.45;
}
.wkit-check {
	display: flex;
	align-items: flex-start;
	gap: var(--wc-space-3);
	min-height: var(--wc-control-height);
	padding-top: var(--wc-space-0-5);
	cursor: pointer;
}
.wkit-check input {
	flex: none;
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	accent-color: var(--wc-brand);
}
.wkit-switch {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2-5);
	min-height: var(--wc-control-height);
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--wc-ink-strong);
	font: inherit;
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-semibold);
	text-align: left;
	cursor: pointer;
}
.wkit-switch__track {
	position: relative;
	flex: none;
	width: var(--wc-switch-width);
	height: var(--wc-switch-height);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-ink-muted);
	transition: background 0.15s;
}
.wkit-switch__knob {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--wc-page);
	box-shadow: var(--wc-shadow-knob);
	transition: left 0.15s;
}
.wkit-switch[aria-checked="true"] .wkit-switch__track {
	background: var(--wc-brand);
}
.wkit-switch[aria-checked="true"] .wkit-switch__knob {
	left: 19px;
}
.wkit-fieldgroup {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wc-space-4) var(--wc-space-5);
	padding: var(--wc-space-5);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
}
@media (max-width: 767px) {
	.wkit-fieldgroup {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- Dialog ---------- */
.wkit-dialog-scrim {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--wc-space-8);
	background: var(--wc-scrim);
}
.wkit-dialog {
	display: flex;
	flex-direction: column;
	width: var(--wc-dialog-width);
	max-width: 100%;
	max-height: calc(100vh - 2 * var(--wc-space-8));
	overflow: hidden;
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
	box-shadow: var(--wc-shadow-dialog);
	animation: wkit-dialog-in 0.16s ease-out;
}
.wkit-dialog__head {
	display: flex;
	flex: none;
	align-items: center;
	gap: var(--wc-space-4);
	padding: var(--wc-space-4-5) var(--wc-space-3) var(--wc-space-4-5) var(--wc-space-6);
	border-bottom: 1px solid var(--wc-border);
}
.wkit-dialog__title {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-card-title);
	font-weight: var(--wc-weight-bold);
	line-height: var(--wc-line-height-card-title);
}
.wkit-dialog__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: var(--wc-space-5-5);
	min-height: 0;
	padding: var(--wc-space-5) var(--wc-space-6) var(--wc-space-6);
	overflow-y: auto;
}
.wkit-dialog__foot {
	display: flex;
	flex: none;
	flex-direction: column;
	gap: var(--wc-space-3);
	padding: var(--wc-space-4) var(--wc-space-6);
	border-top: 1px solid var(--wc-border);
	background: var(--wc-page);
}
dialog.wkit-dialog {
	padding: 0;
	border: 0;
}
dialog.wkit-dialog:not([open]) {
	display: none;
}
dialog.wkit-dialog::backdrop {
	background: var(--wc-scrim);
}
.wkit-dialog__form,
.wkit-dialog__done {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
}
.wkit-dialog__done[hidden],
.wkit-dialog__form[hidden] {
	display: none;
}
.wkit-dialog__thumb {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: var(--wc-space-16);
	height: var(--wc-field-height);
	overflow: hidden;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-page);
	color: var(--wc-ink-faint);
}
.wkit-dialog__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.wkit-dialog__ttl {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--wc-space-0-5);
	min-width: 0;
}
.wkit-dialog__name {
	margin: 0;
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-card-title);
	font-weight: var(--wc-weight-bold);
	line-height: var(--wc-line-height-card-title);
}
.wkit-dialog__btns {
	display: flex;
	justify-content: flex-end;
	gap: var(--wc-space-3);
}
@media (max-width: 767px) {
	.wkit-dialog-scrim {
		align-items: stretch;
		padding: 0;
	}
	.wkit-dialog {
		width: 100%;
		max-height: none;
		height: 100%;
		border-radius: 0;
		animation: wkit-sheet-up 0.28s ease-out;
	}
	.wkit-dialog__btns .wkit-btn:not(.wkit-btn--secondary) {
		flex: 1 1 auto;
	}
	.wkit-dialog__head {
		padding: var(--wc-space-3) var(--wc-space-2) var(--wc-space-3) var(--wc-space-4);
	}
	.wkit-dialog__body {
		padding: var(--wc-space-4-5) var(--wc-space-4) var(--wc-space-6);
	}
	.wkit-dialog__foot {
		padding: var(--wc-space-3) var(--wc-space-4) var(--wc-space-4);
		box-shadow: var(--wc-shadow-bar);
	}
}

@keyframes wkit-dialog-in {
	from {
		opacity: 0;
		transform: scale(0.98);
	}
	to {
		opacity: 1;
		transform: none;
	}
}
@keyframes wkit-sheet-up {
	from {
		transform: translateY(100%);
	}
	to {
		transform: none;
	}
}
@media (prefers-reduced-motion: reduce) {
	.wkit-dialog {
		animation: none;
	}
}

/* ---------- Small texts ---------- */
.wkit-eyebrow {
	color: var(--wc-ink-muted);
	font-size: var(--wc-font-size-eyebrow);
	font-weight: var(--wc-weight-semibold);
	letter-spacing: var(--wc-letter-spacing-eyebrow);
	line-height: 1.4;
	text-transform: uppercase;
}
.wkit-code {
	display: inline-block;
	padding: var(--wc-space-0-5) var(--wc-space-2);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-sm);
	background: var(--wc-surface-chip);
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-small);
	font-weight: var(--wc-weight-semibold);
	letter-spacing: 0.02em;
	white-space: nowrap;
}
.wkit-error[hidden] {
	display: none;
}
.wkit-input[aria-invalid="true"],
.wkit-textarea[aria-invalid="true"],
.wkit-select[aria-invalid="true"] {
	border-color: var(--wc-error);
	box-shadow: inset 0 0 0 1px var(--wc-error);
}

/* ---------- Card ---------- */
.wkit-card {
	display: flex;
	flex-direction: column;
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
	box-shadow: var(--wc-shadow-card);
	color: var(--wc-ink);
	text-decoration: none;
	transition: transform var(--wc-motion-card), border-color var(--wc-motion-card), box-shadow var(--wc-motion-card);
}
a.wkit-card:hover,
.wkit-card.is-hover {
	border-color: var(--wc-brand);
	box-shadow: var(--wc-shadow-card-hover);
	transform: translateY(var(--wc-card-lift));
}
@media (prefers-reduced-motion: reduce) {
	.wkit-card {
		transition: none;
	}
	a.wkit-card:hover {
		transform: none;
	}
}

/* ---------- Action bar: a card variant, one line on desktop (C11e) ---------- */
.wkit-card--bar {
	position: relative;
	flex-direction: row;
	align-items: center;
	gap: var(--wc-space-4);
	min-height: var(--wc-dl-bar-height);
	padding: var(--wc-dl-bar-pad);
	overflow: visible;
	box-shadow: var(--wc-shadow-flat);
}
.wkit-bar__main {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	gap: var(--wc-space-3);
	min-width: 0;
}
.wkit-bar__icon {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: var(--wc-dl-icon-sm);
	height: var(--wc-dl-icon-sm);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-bar__title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	column-gap: var(--wc-space-1-5);
	min-width: 0;
	margin: 0;
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-body);
	font-weight: var(--wc-weight-bold);
	line-height: 1.3;
}
.wkit-bar__meta {
	color: var(--wc-ink);
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-regular);
}
.wkit-bar__controls {
	display: flex;
	flex: none;
	align-items: center;
	gap: var(--wc-space-2-5);
}
.wkit-bar__field {
	display: flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-width: 0;
	margin: 0;
}
.wkit-bar__field .wkit-eyebrow {
	letter-spacing: var(--wc-letter-spacing-eyebrow);
	text-transform: uppercase;
}
.wkit-bar__field .wkit-select {
	width: var(--wc-dl-bar-select-width);
	height: var(--wc-control-height);
	font-size: var(--wc-font-size-body);
	font-weight: var(--wc-weight-semibold);
}
.wkit-card--bar .wkit-btn--lg {
	min-height: var(--wc-control-height);
}
.wkit-card--bar .wkit-split > .wkit-btn {
	min-width: var(--wc-split-main-min);
}
/* The line that reports a failed action replaces the meta line; while it works, the text is for screen readers only. */
.wkit-card--bar .wkit-download-status {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.wkit-card--bar .wkit-download-status.is-error {
	position: static;
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-1-5);
	width: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	clip: auto;
	white-space: normal;
	color: var(--wc-error);
	font-size: var(--wc-font-size-small);
	font-weight: var(--wc-weight-semibold);
	line-height: 1.4;
}
.wkit-card--bar:has(.wkit-download-status.is-error) .wkit-bar__meta {
	display: none;
}
.wkit-download-status.is-error svg {
	flex: none;
}
.wkit-download-status.is-error .wkit-link-btn {
	color: inherit;
	font-weight: var(--wc-weight-bold);
	text-underline-offset: 2px;
}
@media (max-width: 1279px) {
	.wkit-card--bar .wkit-bar__title {
		flex-direction: column;
		align-items: flex-start;
	}
	.wkit-card--bar .wkit-bar__dot {
		display: none;
	}
}
@media (max-width: 959px) {
	.wkit-card--bar {
		flex-wrap: wrap;
		row-gap: var(--wc-space-3);
	}
	.wkit-card--bar .wkit-bar__controls {
		flex: 1 1 100%;
		justify-content: flex-start;
	}
}
@media (max-width: 767px) {
	.wkit-card--bar {
		flex-direction: column;
		align-items: stretch;
		padding: var(--wc-space-3-5) var(--wc-space-3-5) var(--wc-space-4);
	}
	.wkit-card--bar .wkit-bar__controls {
		flex-direction: column;
		align-items: stretch;
		gap: var(--wc-space-3);
	}
	.wkit-bar__field {
		flex-direction: column;
		align-items: stretch;
		gap: var(--wc-space-1-5);
	}
	.wkit-bar__field .wkit-select {
		width: 100%;
		height: var(--wc-field-height);
	}
	.wkit-card--bar .wkit-btn--lg {
		min-height: var(--wc-field-height);
	}
}

/* Busy button: the label swaps for a spinner and a text; the picker joined to it waits. */
.wkit-btn__idle,
.wkit-btn__busy {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
}
.wkit-btn__busy,
.wkit-btn[aria-busy="true"] .wkit-btn__idle {
	display: none;
}
.wkit-btn[aria-busy="true"] .wkit-btn__busy {
	display: inline-flex;
}
.wkit-split:has(> .wkit-btn[aria-busy="true"]) {
	background: var(--wc-brand-hover);
}
.wkit-split:has(> .wkit-btn[aria-busy="true"]) .wkit-lang-pdfbtn {
	opacity: 0.6;
	pointer-events: none;
	cursor: not-allowed;
}

/* ---------- Help icon with a pop-up text (C11e) ---------- */
.wkit-helptip {
	position: relative;
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: var(--wc-help-size);
	height: var(--wc-help-size);
	margin: calc(-1 * var(--wc-space-1)) calc(-1 * var(--wc-space-1)) calc(-1 * var(--wc-space-1)) 0;
	padding: 0;
	border: 0;
	border-radius: var(--wc-radius-pill);
	background: transparent;
	color: var(--wc-ink-muted);
	font: inherit;
	cursor: help;
}
.wkit-helptip:hover,
.wkit-helptip.is-open {
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-helptip:focus-visible {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
	box-shadow: 0 0 0 2px var(--wc-page);
}
.wkit-helptip__tip {
	position: absolute;
	z-index: 30;
	top: calc(100% + var(--wc-space-2));
	right: calc(-1 * var(--wc-space-1-5));
	width: var(--wc-tooltip-width);
	max-width: calc(100vw - 2 * var(--wc-gutter-mobile));
	padding: var(--wc-space-2-5) var(--wc-space-3);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-tooltip-bg);
	box-shadow: var(--wc-shadow-menu);
	color: var(--wc-on-brand);
	font-size: var(--wc-font-size-badge);
	font-weight: var(--wc-weight-regular);
	line-height: 1.45;
	letter-spacing: 0;
	text-align: left;
	text-transform: none;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.12s;
}
.wkit-helptip:hover .wkit-helptip__tip,
.wkit-helptip:focus-visible .wkit-helptip__tip,
.wkit-helptip.is-open .wkit-helptip__tip {
	opacity: 1;
	visibility: visible;
}
@media (max-width: 767px) {
	.wkit-helptip {
		width: var(--wc-control-height);
		height: var(--wc-control-height);
		margin: calc(-1 * var(--wc-space-2)) calc(-1 * var(--wc-space-2)) calc(-1 * var(--wc-space-2)) 0;
	}
	.wkit-helptip__tip {
		right: 0;
	}
}
@media (prefers-reduced-motion: reduce) {
	.wkit-helptip__tip {
		transition: none;
	}
}

/* ---------- Showcase of the design system (K28) ---------- */
.wkit-ds {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-10);
	padding-bottom: var(--wc-space-14);
}
.wkit-ds-section {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-4);
}
.wkit-ds-section h2 {
	margin: 0;
	font-size: var(--wc-h2-size);
	line-height: var(--wc-h2-line-height);
}
.wkit-ds-section h3 {
	margin: var(--wc-space-4) 0 0;
	font-size: var(--wc-h3-size);
}
.wkit-ds-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wc-space-3);
}
.wkit-ds-stack {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-3);
}
.wkit-ds-gap {
	margin-top: var(--wc-space-6);
}
.wkit-ds-swatch {
	display: block;
	width: var(--wc-space-14);
	height: var(--wc-space-6);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-sm);
}
.wkit-ds-bar {
	display: block;
	max-width: 100%;
	height: var(--wc-space-3);
	border-radius: var(--wc-radius-xs);
	background: var(--wc-brand);
}
.wkit-ds-box {
	display: block;
	width: var(--wc-space-14);
	height: var(--wc-space-8);
	border: 1px solid var(--wc-border);
	background: var(--wc-page);
}
.wkit-ds-cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wc-space-6);
}
.wkit-ds-card {
	padding: var(--wc-space-6);
}
.wkit-ds-card h3 {
	margin: 0;
}
.wkit-ds-card p {
	margin: var(--wc-space-2) 0 0;
}
@media (max-width: 767px) {
	.wkit-ds-cards {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ==========================================================================
   My account (K19) · was account.css
   ========================================================================== */
/* K19 · My account (ported from stock S01 §14). */
/* --- 14. MY ACCOUNT Y MENÚ DEL HEADER (S26) --- */
/* Campos y botones: componentes del Kit (.wkit-field, .wkit-label, .wkit-input, .wkit-help, .wkit-btn). */
.wkit-account .wkit-field { margin: 0 0 var(--wc-space-4); }
.wkit-account-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--wc-space-3); }
@media (max-width: 767px) { .wkit-account-row { grid-template-columns: minmax(0, 1fr); } }
.wkit-account {
  width: 100%;
  color: var(--wc-ink-strong);
}
.wkit-account-notice {
  margin: 0 0 var(--wc-space-6) 0;
}
.wkit-account-summary {
  display: block;
}
.wkit-account-section {
  padding: 0 0 var(--wc-space-8) 0;
  margin: 0 0 var(--wc-space-8) 0;
  border-bottom: 1px solid var(--wc-border);
}
.wkit-account-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--wc-space-4);
  padding: 0 0 var(--wc-space-4) 0;
  margin: 0 0 var(--wc-space-7) 0;
  border-bottom: 1px solid var(--wc-border);
}
.wkit-account-title {
  font-size: var(--wc-font-size-subtitle) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: var(--wc-ink-strong) !important;
  margin: 0 0 var(--wc-space-4) 0 !important;
}
.wkit-account-meta {
  font-size: var(--wc-font-size-ui);
  color: var(--wc-ink-muted);
  margin: 0;
}
/* Escritorio: Profile y Password lado a lado; la fila superior y el aviso ocupan todo el ancho */
@media (min-width: 900px) {
  .wkit-account {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: var(--wc-space-14);
    align-items: start;
  }
  .wkit-account-head,
  .wkit-account-notice {
    grid-column: 1 / -1;
  }
  .wkit-account-section {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
  }
}
.wkit-account-form .wkit-btn {
  margin-top: var(--wc-space-1);
}
.wkit-account-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--wc-space-2) var(--wc-space-5);
}
.wkit-account-requests {
  font-size: var(--wc-font-size-ui);
  font-weight: 600;
  color: var(--wc-brand) !important;
  text-decoration: none;
}
.wkit-account-requests:hover {
  text-decoration: underline;
}
.wkit-account-signout {
  flex: 0 0 auto;
  font-size: var(--wc-font-size-ui);
  font-weight: 600;
  color: var(--wc-error) !important;
  text-decoration: none;
}
.wkit-account-signout:hover {
  text-decoration: underline;
}


/* Field hints with an icon (for example "Your country is in LATAM.") */
.wkit-account-country {
  display: flex;
  align-items: center;
  gap: var(--wc-space-1-5);
  font-size: var(--wc-font-size-small);
  line-height: 1.45;
  color: var(--wc-ink);
}
.wkit-account-country strong { color: var(--wc-ink-strong); font-weight: 600; }
.wkit-account-country[hidden] { display: none; }
.wkit-account-country svg { flex: 0 0 auto; }

/* Secciones registradas por plugins (pestañas, tarjetas de campos, solo lectura, imagen) */
.wkit-account-tabs { margin: 0 0 var(--wc-space-6) 0; overflow-x: auto; }
.wkit-account-secform, .wkit-account-summary { max-width: 720px; }
.wkit-account-card { border: 1px solid var(--wc-border) !important; border-radius: var(--wc-radius-card); padding: var(--wc-space-6) !important; margin: 0 0 var(--wc-space-5) 0 !important; }
.wkit-account-cardhead { display: flex; align-items: center; justify-content: space-between; gap: var(--wc-space-3); }
.wkit-account-badge { font-size: var(--wc-font-size-badge); font-weight: 600; color: var(--wc-ink); background: var(--wc-surface-chip); border-radius: var(--wc-radius-pill); padding: var(--wc-space-1) var(--wc-space-2-5); }
.wkit-account-fields { display: flex; flex-wrap: wrap; gap: 0 var(--wc-space-4); }
.wkit-account-field { flex: 1 1 100%; }
.wkit-account-field.is-half { flex: 1 1 calc(50% - 8px); min-width: 220px; }
.wkit-account-inputwrap { position: relative; }
.wkit-account-suffix { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: var(--wc-ink-muted); }
.wkit-account-readonly { font-size: var(--wc-font-size-screen-title); font-weight: 700; margin: var(--wc-space-1) 0; }
.wkit-account-imagefield { display: flex; gap: var(--wc-space-5); align-items: center; }
.wkit-account-imagebox { width: 240px; max-width: 45%; height: 120px; border: 1px solid var(--wc-border); border-radius: var(--wc-radius-md); display: flex; align-items: center; justify-content: center; padding: var(--wc-space-2); box-sizing: border-box; }
.wkit-account-imagebox img { max-width: 100%; max-height: 100%; object-fit: contain; }
@media (min-width: 900px) { .wkit-account-tabs, .wkit-account-secform, .wkit-account-summary { grid-column: 1 / -1; } }
.wkit-account .wkit-field + .wkit-help { margin: calc(-1 * var(--wc-space-2)) 0 var(--wc-space-4); }

/* =====================================================================
   K29 · Compare tray, toggle, toast and comparison table (ACTA-C12)
   Built only with the tokens of K28. Generic: no product, family or quote is named here.
   ===================================================================== */

/* ---------- Toggle over a picture or in a row of buttons ---------- */
.wkit-item-overlay {
	position: absolute;
	top: var(--wc-space-2-5);
	right: var(--wc-space-2-5);
	z-index: 2;
}
.wkit-tray-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	height: var(--wc-quick-height);
	padding: 0 var(--wc-space-3) 0 var(--wc-space-2-5);
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-page);
	color: var(--wc-ink-strong);
	font: inherit;
	font-size: var(--wc-font-size-small);
	font-weight: var(--wc-weight-semibold);
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: var(--wc-shadow-flat);
}
.wkit-tray-toggle::before {
	content: "";
	position: absolute;
	inset: -4px;
}
.wkit-tray-toggle--button {
	height: var(--wc-control-height);
	padding: 0 var(--wc-space-4);
	gap: var(--wc-space-2-5);
	border-radius: var(--wc-radius-btn);
	font-size: var(--wc-font-size-button);
	box-shadow: none;
}
.wkit-tray-toggle--button::before {
	display: none;
}
.wkit-tray-toggle:hover {
	border-color: var(--wc-brand);
	color: var(--wc-brand);
}
.wkit-tray-toggle:focus-visible {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
}
.wkit-tray-toggle__box {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--wc-space-4);
	height: var(--wc-space-4);
	box-sizing: border-box;
	border: 1.5px solid var(--wc-ink-faint);
	border-radius: var(--wc-radius-xs);
	background: var(--wc-page);
	color: var(--wc-page);
}
.wkit-tray-toggle[aria-pressed="true"] {
	border-color: var(--wc-brand);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-tray-toggle[aria-pressed="true"] .wkit-tray-toggle__box {
	border-color: var(--wc-brand);
	background: var(--wc-brand);
	color: var(--wc-on-brand);
}
.wkit-tray-toggle[aria-disabled="true"] {
	border-color: var(--wc-border);
	background: var(--wc-surface-chip);
	color: var(--wc-ink);
	box-shadow: none;
	cursor: not-allowed;
}
.wkit-tray-toggle[aria-disabled="true"] .wkit-tray-toggle__box {
	border-color: var(--wc-border-input);
	background: var(--wc-surface-chip);
	color: var(--wc-surface-chip);
}

/* ---------- Floating bar ---------- */
.wkit-tray {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: var(--wc-z-tray);
	background: var(--wc-page);
	border-top: 1px solid var(--wc-border);
	box-shadow: var(--wc-shadow-bar);
}
.wkit-tray__in {
	width: var(--wc-content-width);
	max-width: var(--wc-content-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	gap: var(--wc-space-5);
	align-items: center;
	padding: var(--wc-space-3) 0;
}
.wkit-tray__hd {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.35;
}
.wkit-tray__title {
	font-size: var(--wc-font-size-body);
	font-weight: var(--wc-weight-bold);
	color: var(--wc-ink-strong);
	white-space: nowrap;
}
.wkit-tray__count {
	font-size: var(--wc-font-size-small);
	color: var(--wc-ink-muted);
	white-space: nowrap;
}
.wkit-tray__slots,
.wkit-tray-m__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--wc-space-2);
	min-width: 0;
}
.wkit-tray-slot {
	display: flex;
	align-items: center;
	gap: var(--wc-space-2-5);
	height: var(--wc-tray-slot-height);
	box-sizing: border-box;
	min-width: 0;
	padding: 0 var(--wc-space-1) 0 var(--wc-space-1-5);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-slot);
	background: var(--wc-page);
}
.wkit-tray-slot--empty {
	justify-content: center;
	gap: var(--wc-space-1-5);
	padding: 0 var(--wc-space-2);
	border: 1.5px dashed var(--wc-border-input);
	background: var(--wc-surface-muted);
	color: var(--wc-ink-muted);
	font-size: var(--wc-font-size-small);
	font-weight: var(--wc-weight-semibold);
}
.wkit-tray-slot__thumb,
.wkit-tray-m__thumb {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	box-sizing: border-box;
	color: var(--wc-ink-faint);
	background: var(--wc-surface-muted);
}
.wkit-tray-slot__thumb {
	width: var(--wc-tray-thumb-width);
	height: var(--wc-tray-thumb-height);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-sm);
}
.wkit-tray-slot__thumb img,
.wkit-tray-m__thumb img,
.wkit-cmp__img img,
.wkit-cmp__sthumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
	background: var(--wc-page);
}
.wkit-tray-slot__text {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-width: 0;
	line-height: 1.3;
}
.wkit-tray-slot__text strong {
	font-size: var(--wc-font-size-small);
	font-weight: var(--wc-weight-bold);
	color: var(--wc-ink-strong);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.wkit-tray-slot__text span {
	font-size: var(--wc-font-size-badge);
	color: var(--wc-ink-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.wkit-tray__acts {
	display: flex;
	align-items: center;
	gap: var(--wc-space-2);
}
.wkit-tray__go {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: var(--wc-space-0-5);
}
.wkit-tray__hint {
	font-size: var(--wc-font-size-badge);
	color: var(--wc-ink-muted);
	line-height: 1.3;
	white-space: nowrap;
}
.wkit-tray-pad {
	height: var(--wc-tray-height);
	background: var(--wc-footer);
}
.wkit-tray-m {
	display: none;
}
@media (max-width: 1279px) {
	.wkit-tray__in { width: auto; margin: 0 var(--wc-gutter-laptop); }
	.wkit-tray-slot__text span { display: none; }
}
@media (max-width: 959px) {
	.wkit-tray__in {
		margin: 0 var(--wc-gutter-tablet);
		grid-template-columns: minmax(0, 1fr) auto;
		row-gap: var(--wc-space-2-5);
		column-gap: var(--wc-space-4);
	}
	.wkit-tray__hd { flex-direction: row; align-items: baseline; gap: var(--wc-space-2); }
	.wkit-tray__slots { grid-column: 1 / -1; grid-row: 2; }
	.wkit-tray-pad { height: var(--wc-tray-height-tablet); }
}
@media (max-width: 767px) {
	.wkit-tray, .wkit-tray-pad { display: none; }
	.wkit-tray-m { display: block; }
	.wkit-tray-m__bar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: var(--wc-z-tray);
		display: flex;
		align-items: center;
		gap: var(--wc-space-3);
		box-sizing: border-box;
		min-height: var(--wc-tray-height-mobile);
		padding: var(--wc-space-2-5) var(--wc-space-4);
		background: var(--wc-page);
		border-top: 1px solid var(--wc-border);
		box-shadow: var(--wc-shadow-bar);
	}
	.wkit-tray-pad.wkit-tray-pad { display: block; height: var(--wc-tray-pad-mobile); }
}
.wkit-tray-m__sum {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	gap: var(--wc-space-2-5);
	min-height: var(--wc-control-height);
	padding: 0;
	border: 0;
	border-radius: var(--wc-radius-btn);
	background: transparent;
	font: inherit;
	text-align: left;
	color: var(--wc-ink-strong);
	cursor: pointer;
}
.wkit-tray-m__sum:focus-visible {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
}
.wkit-tray-m__thumbs {
	display: flex;
	flex: none;
}
.wkit-tray-m__thumb {
	width: var(--wc-space-8);
	height: var(--wc-space-8);
	margin-left: calc(-1 * var(--wc-space-3-5));
	border-radius: var(--wc-radius-btn);
	box-shadow: 0 0 0 2px var(--wc-page), 0 0 0 3px var(--wc-border);
}
.wkit-tray-m__thumb:first-child {
	margin-left: 0;
}
.wkit-tray-m__text {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.3;
}
.wkit-tray-m__text strong {
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-bold);
	white-space: nowrap;
}
.wkit-tray-m__text span {
	font-size: var(--wc-font-size-badge);
	color: var(--wc-ink-muted);
	white-space: nowrap;
}
.wkit-tray-m__chev {
	flex: none;
	display: inline-flex;
	color: var(--wc-ink);
	transition: transform 0.15s;
}
.wkit-tray-m__chev.is-open {
	transform: rotate(180deg);
}
.wkit-tray-m__scrim {
	position: fixed;
	inset: 0;
	z-index: calc(var(--wc-z-tray) - 1);
	background: var(--wc-scrim);
}
.wkit-tray-m__sheet {
	position: fixed;
	left: 0;
	right: 0;
	bottom: var(--wc-tray-height-mobile);
	z-index: calc(var(--wc-z-tray) + 1);
	padding: var(--wc-space-1) 0 var(--wc-space-2);
	border-radius: var(--wc-radius-card) var(--wc-radius-card) 0 0;
	background: var(--wc-page);
	box-shadow: var(--wc-shadow-sheet);
}
.wkit-tray-m__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wc-space-3);
	padding: var(--wc-space-2) var(--wc-space-2) var(--wc-space-2) var(--wc-space-4);
	border-bottom: 1px solid var(--wc-border);
	font-size: var(--wc-font-size-body);
	color: var(--wc-ink-strong);
}
.wkit-tray-m__list {
	display: flex;
	flex-direction: column;
	padding: var(--wc-space-2) var(--wc-space-4);
}
.wkit-tray-m__list .wkit-tray-slot {
	height: auto;
	min-height: var(--wc-control-height);
	padding-block: var(--wc-space-1-5);
}
.wkit-tray-m__list .wkit-tray-slot__text span { display: block; }
.wkit-tray-m__foot {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 var(--wc-space-2) 0 var(--wc-space-4);
}
body.has-wkit-tray:has(.wkit-tray-m__sheet) {
	overflow: hidden;
}

/* ---------- Toast (a short notice at the bottom) ---------- */
.wkit-toast {
	position: fixed;
	left: 50%;
	bottom: var(--wc-space-6);
	transform: translateX(-50%);
	z-index: var(--wc-z-toast);
	display: flex;
	align-items: center;
	gap: var(--wc-space-3);
	box-sizing: border-box;
	min-height: var(--wc-control-height);
	width: max-content;
	max-width: min(560px, calc(100vw - 2 * var(--wc-space-4)));
	padding: var(--wc-space-1-5) var(--wc-space-1-5) var(--wc-space-1-5) var(--wc-space-4);
	border-radius: var(--wc-radius-md);
	background: var(--wc-toast);
	color: var(--wc-on-brand);
	box-shadow: var(--wc-shadow-menu);
	font-size: var(--wc-font-size-ui);
	line-height: 1.4;
}
.wkit-toast--tray { bottom: var(--wc-toast-bottom-tray); }
.wkit-toast strong { font-weight: var(--wc-weight-bold); color: var(--wc-on-brand); }
.wkit-toast__ic { flex: none; display: inline-flex; color: var(--wc-brand-tint-line); }
.wkit-toast__action {
	flex: none;
	padding: var(--wc-space-2);
	border: 0;
	background: transparent;
	color: var(--wc-brand-tint-line);
	font: inherit;
	font-weight: var(--wc-weight-bold);
	text-decoration: underline;
	cursor: pointer;
}
.wkit-toast__action:hover { color: var(--wc-on-brand); }
.wkit-toast__x {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--wc-control-height);
	height: var(--wc-control-height);
	border: 0;
	border-radius: var(--wc-radius-btn);
	background: transparent;
	color: var(--wc-border-input);
	cursor: pointer;
}
.wkit-toast__x:hover { background: var(--wc-toast-hover); color: var(--wc-on-brand); }
.wkit-toast button:focus-visible { outline: 2px solid var(--wc-brand-tint-line); outline-offset: 2px; }
@media (max-width: 959px) {
	.wkit-toast--tray { bottom: var(--wc-toast-bottom-tray-tablet); }
}
@media (max-width: 767px) {
	.wkit-toast { left: var(--wc-space-4); right: var(--wc-space-4); bottom: var(--wc-space-4); transform: none; width: auto; max-width: none; }
	.wkit-toast--tray { bottom: var(--wc-toast-bottom-tray-mobile); }
}
.wkit-tray-dialog { width: min(560px, 100%); }
.wkit-tray-dialog__text { margin: 0; font-size: var(--wc-font-size-body); line-height: var(--wc-line-height-body); color: var(--wc-ink); }

/* ---------- Comparison table: variant of the table, in columns ---------- */
.wkit-cmp-ctl {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--wc-space-3) var(--wc-space-6);
	border-bottom: 1px solid var(--wc-border);
}
.wkit-cmp-ctl__region { display: flex; flex-direction: column; gap: var(--wc-space-1-5); min-width: 0; }
.wkit-cmp-ctl__acts { display: flex; align-items: center; flex-wrap: wrap; gap: var(--wc-space-3); padding-bottom: var(--wc-space-1-5); }
.wkit-cmp-sum {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--wc-space-2) var(--wc-space-4);
	font-size: var(--wc-font-size-ui);
	color: var(--wc-ink);
}
.wkit-cmp-sum b { color: var(--wc-ink-strong); font-weight: var(--wc-weight-bold); }
.wkit-cmp-legend { display: inline-flex; align-items: center; gap: var(--wc-space-2); font-size: var(--wc-font-size-small); color: var(--wc-ink); }
.wkit-cmp-legend__sw {
	flex: none;
	width: var(--wc-space-7);
	height: var(--wc-space-4-5);
	border-radius: var(--wc-radius-xs);
	background: var(--wc-brand-tint);
	box-shadow: inset var(--wc-compare-diff-bar) 0 0 var(--wc-brand);
}
.wkit-cmp-dots { display: none; align-items: center; gap: var(--wc-space-2); font-size: var(--wc-font-size-badge); color: var(--wc-ink); }
.wkit-cmp-dots__d { display: flex; gap: var(--wc-space-1); }
.wkit-cmp-dots__d span { width: var(--wc-space-2); height: var(--wc-space-2); box-sizing: border-box; border-radius: 50%; border: 1.5px solid var(--wc-ink-muted); }
.wkit-cmp-dots__d span.is-on { background: var(--wc-brand); border-color: var(--wc-brand); }
.wkit-cmp-box {
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
	overflow: clip;
}
.wkit-table--compare { min-width: 0; font-size: var(--wc-font-size-ui); }
.wkit-cmp__x { min-width: 0; }
.wkit-cmp__row {
	display: grid;
	grid-template-columns: var(--wc-compare-label) minmax(0, 1fr);
	border-bottom: 1px solid var(--wc-border);
}
.wkit-cmp__row:last-child { border-bottom: 0; }
.wkit-cmp__lab {
	box-sizing: border-box;
	min-width: 0;
	padding: var(--wc-space-3) var(--wc-space-4) var(--wc-space-3) var(--wc-space-5);
	line-height: 1.45;
	color: var(--wc-ink);
	background: inherit;
}
.wkit-cmp__vals { display: grid; min-width: 0; grid-template-columns: repeat(var(--wkit-cmp-n, 2), minmax(0, 1fr)); }
.wkit-cmp__v {
	box-sizing: border-box;
	min-width: 0;
	padding: var(--wc-space-3) var(--wc-space-5);
	border-left: 1px solid var(--wc-border);
	font-weight: var(--wc-weight-semibold);
	color: var(--wc-ink-strong);
	line-height: 1.45;
	overflow-wrap: anywhere;
}
.wkit-cmp__v--none { color: var(--wc-ink-muted); font-weight: var(--wc-weight-regular); }
.wkit-cmp__v--warn { color: var(--wc-replaced-icon); }
.wkit-cmp__row.is-diff { background: var(--wc-brand-tint); }
.wkit-cmp__row.is-diff .wkit-cmp__lab { box-shadow: inset var(--wc-compare-diff-bar) 0 0 var(--wc-brand); color: var(--wc-ink-strong); font-weight: var(--wc-weight-semibold); }
.wkit-cmp__row.is-diff .wkit-cmp__v { border-left-color: var(--wc-brand-tint-line); }
.wkit-cmp__grp {
	padding: var(--wc-space-3-5) var(--wc-space-5) var(--wc-space-3);
	background: var(--wc-surface-muted);
	border-bottom: 1px solid var(--wc-border);
}
.wkit-cmp__grp h3 { margin: 0; font-size: var(--wc-font-size-body); font-weight: var(--wc-weight-bold); color: var(--wc-ink-strong); line-height: 1.4; }
.wkit-cmp__head { background: var(--wc-page); }
.wkit-cmp__head .wkit-cmp__lab { display: flex; flex-direction: column; justify-content: flex-end; gap: var(--wc-space-1); padding-block: var(--wc-space-4); }
.wkit-cmp__head .wkit-cmp__lab a { font-weight: var(--wc-weight-semibold); text-decoration: none; }
.wkit-cmp__ph { position: relative; display: flex; flex-direction: column; gap: var(--wc-space-2-5); box-sizing: border-box; min-width: 0; padding: var(--wc-space-4); border-left: 1px solid var(--wc-border); }
.wkit-cmp__img {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: var(--wc-space-1-5);
	height: var(--wc-compare-photo);
	box-sizing: border-box;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-slot);
	background: var(--wc-surface-muted);
	overflow: hidden;
	color: var(--wc-ink-faint);
	font-size: var(--wc-font-size-badge);
}
.wkit-cmp__rm { position: absolute; top: var(--wc-space-1-5); right: var(--wc-space-1-5); background: var(--wc-page); border: 1px solid var(--wc-border); color: var(--wc-ink-strong); }
.wkit-cmp__id { display: flex; flex-direction: column; gap: var(--wc-space-1-5); min-width: 0; }
.wkit-cmp__name { font-size: var(--wc-font-size-card-title); font-weight: var(--wc-weight-bold); line-height: 1.3; color: var(--wc-ink-strong); text-decoration: none; }
.wkit-cmp__name:hover { color: var(--wc-brand); text-decoration: underline; text-underline-offset: 3px; }
.wkit-cmp__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wc-space-2); }
.wkit-cmp__ver { position: relative; display: flex; flex-direction: column; gap: var(--wc-space-1); min-width: 0; }
.wkit-cmp__verbtn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wc-space-2);
	box-sizing: border-box;
	height: var(--wc-choice-height);
	padding: 0 var(--wc-space-2-5);
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-page);
	color: var(--wc-ink-strong);
	font: inherit;
	font-size: var(--wc-font-size-ui);
	text-align: left;
	cursor: pointer;
	min-width: 0;
}
.wkit-cmp__verbtn > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.wkit-cmp__verbtn[aria-expanded="true"] { border-color: var(--wc-brand); box-shadow: inset 0 0 0 1px var(--wc-brand); }
.wkit-cmp__verbtn:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 2px; }
.wkit-cmp__menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: calc(var(--wc-z-sticky) + 1);
	width: 340px;
	max-width: calc(100vw - 2 * var(--wc-space-4));
	margin-top: var(--wc-space-1);
	padding: var(--wc-space-1-5);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
	box-shadow: var(--wc-shadow-menu);
}
.wkit-cmp__menu h4 { margin: 0; padding: var(--wc-space-2) var(--wc-space-2-5); font-size: var(--wc-font-size-eyebrow); letter-spacing: var(--wc-letter-spacing-eyebrow); text-transform: uppercase; color: var(--wc-ink-muted); }
.wkit-cmp__menu ul { list-style: none; margin: 0; padding: 0; }
.wkit-cmp__opt { display: flex; align-items: flex-start; gap: var(--wc-space-2-5); padding: var(--wc-space-2-5); border-radius: var(--wc-radius-btn); cursor: pointer; }
.wkit-cmp__opt:hover, .wkit-cmp__opt:focus { background: var(--wc-surface-chip); outline: none; }
.wkit-cmp__opt[aria-selected="true"] { background: var(--wc-surface-chip); }
.wkit-cmp__opt .wkit-cmp__ck { flex: none; width: var(--wc-space-4-5); color: var(--wc-brand); visibility: hidden; }
.wkit-cmp__opt[aria-selected="true"] .wkit-cmp__ck { visibility: visible; }
.wkit-cmp__optx { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; flex: 1 1 auto; }
.wkit-cmp__optx b { font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-bold); color: var(--wc-ink-strong); }
.wkit-cmp__optx span { font-size: var(--wc-font-size-small); color: var(--wc-ink); }
.wkit-cmp__optx .wkit-status { align-self: flex-start; margin-top: var(--wc-space-1); }
.wkit-cmp__foot { margin: 0; padding: var(--wc-space-2) var(--wc-space-2-5); border-top: 1px solid var(--wc-border); font-size: var(--wc-font-size-small); color: var(--wc-ink-muted); }
.wkit-cmp__ph > .wkit-btn { width: 100%; }
.wkit-cmp__note { margin: 0; font-size: var(--wc-font-size-small); color: var(--wc-replaced-icon); }
.wkit-cmp-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wc-space-3);
	padding: var(--wc-space-14) var(--wc-space-6);
	border: 1.5px dashed var(--wc-border-input);
	border-radius: var(--wc-radius-card);
	background: var(--wc-page);
	text-align: center;
}
.wkit-cmp-empty h2 { margin: 0; font-size: var(--wc-font-size-subtitle); font-weight: var(--wc-weight-bold); color: var(--wc-ink-strong); }
.wkit-cmp-empty p { margin: 0; max-width: 52ch; }
.wkit-cmp-empty__ic { display: inline-flex; align-items: center; justify-content: center; width: var(--wc-control-height); height: var(--wc-control-height); border-radius: 50%; background: var(--wc-brand-tint); color: var(--wc-brand); }
.wkit-cmp-nodiff { display: flex; flex-direction: column; align-items: center; gap: var(--wc-space-2); padding: var(--wc-space-10) var(--wc-space-6); border-top: 1px solid var(--wc-border); text-align: center; }
.wkit-cmp-nodiff h3 { margin: 0; font-size: var(--wc-font-size-card-title); font-weight: var(--wc-weight-bold); color: var(--wc-ink-strong); }
.wkit-cmp-nodiff p { margin: 0; max-width: 56ch; font-size: var(--wc-font-size-ui); }
.wkit-cmp-notice { display: flex; align-items: center; flex-wrap: wrap; gap: var(--wc-space-2) var(--wc-space-3); }
.wkit-cmp-notice .wkit-link-btn { margin-left: auto; }
.wkit-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Compact header fixed at the top while the table scrolls */
.wkit-cmp-sticky {
	position: fixed;
	top: 0;
	z-index: var(--wc-z-sticky);
	overflow: hidden;
	background: var(--wc-page);
	border-bottom: 1px solid var(--wc-border);
	box-shadow: var(--wc-shadow-sticky);
}
.wkit-cmp-sticky[hidden] { display: none; }
.wkit-cmp-sticky__in { display: grid; grid-template-columns: var(--wc-compare-label) minmax(0, 1fr); will-change: transform; }
.wkit-cmp-sticky__lab { display: flex; flex-direction: column; justify-content: center; padding: var(--wc-space-2-5) var(--wc-space-4) var(--wc-space-2-5) var(--wc-space-5); font-size: var(--wc-font-size-small); color: var(--wc-ink); }
.wkit-cmp-sticky__lab b { font-size: var(--wc-font-size-ui); color: var(--wc-ink-strong); }
.wkit-cmp__sc { display: flex; align-items: center; gap: var(--wc-space-2-5); box-sizing: border-box; min-width: 0; padding: var(--wc-space-2-5) var(--wc-space-1) var(--wc-space-2-5) var(--wc-space-4); border-left: 1px solid var(--wc-border); }
.wkit-cmp__sthumb { flex: none; display: flex; align-items: center; justify-content: center; overflow: hidden; width: var(--wc-tray-thumb-width); height: var(--wc-tray-thumb-height); box-sizing: border-box; border: 1px solid var(--wc-border); border-radius: var(--wc-radius-sm); color: var(--wc-ink-faint); background: var(--wc-surface-muted); }
.wkit-cmp__stext { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; line-height: 1.3; }
.wkit-cmp__stext b { font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-bold); color: var(--wc-ink-strong); }
.wkit-cmp__stext span { font-size: var(--wc-font-size-badge); color: var(--wc-ink-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Laptop: a narrower names column */
@media (max-width: 1279px) {
	.wkit-cmp__v { padding-inline: var(--wc-space-4); }
}
/* Tablet: 3 products with a narrower names column; 4 products stack the name over the values */
@media (max-width: 959px) {
	.wkit-cmp--n3 .wkit-cmp__row, .wkit-cmp--n3 .wkit-cmp-sticky__in { grid-template-columns: var(--wc-compare-label-tablet) minmax(0, 1fr); }
	.wkit-cmp--n3 .wkit-cmp__lab { padding-left: var(--wc-space-4); }
	.wkit-cmp--n3 .wkit-cmp__v { padding: var(--wc-space-3) var(--wc-space-3-5); }
	.wkit-cmp--n3 .wkit-cmp__ph { padding: var(--wc-space-3-5) var(--wc-space-3); }
	.wkit-cmp--n3 .wkit-cmp__img, .wkit-cmp--n4 .wkit-cmp__img { height: var(--wc-compare-photo-tablet); }
	.wkit-cmp--n4 .wkit-cmp__row { display: block; }
	.wkit-cmp--n4 .wkit-cmp__lab { padding: var(--wc-space-3) var(--wc-space-4) var(--wc-space-0-5); font-size: var(--wc-font-size-small); }
	.wkit-cmp--n4 .wkit-cmp__row.is-diff .wkit-cmp__lab { box-shadow: none; }
	.wkit-cmp--n4 .wkit-cmp__row.is-diff { box-shadow: inset var(--wc-compare-diff-bar) 0 0 var(--wc-brand); }
	.wkit-cmp--n4 .wkit-cmp__vals { column-gap: var(--wc-space-3); padding: 0 var(--wc-space-4); }
	.wkit-cmp--n4 .wkit-cmp__v { border-left: 0; padding: var(--wc-space-0-5) 0 var(--wc-space-3); }
	.wkit-cmp--n4 .wkit-cmp__ph { border-left: 0; padding: var(--wc-space-1) 0 var(--wc-space-4); }
	.wkit-cmp--n4 .wkit-cmp__head .wkit-cmp__lab { flex-direction: row; justify-content: space-between; align-items: baseline; padding: var(--wc-space-3-5) var(--wc-space-4) var(--wc-space-2-5); }
	.wkit-cmp--n4 .wkit-cmp__name { font-size: var(--wc-font-size-body); }
	.wkit-cmp--n4 .wkit-cmp-sticky__in { grid-template-columns: minmax(0, 1fr); }
	.wkit-cmp--n4 .wkit-cmp-sticky__lab { display: none; }
	.wkit-cmp__stext span { display: none; }
	.wkit-cmp__ph > .wkit-btn { height: auto; min-height: var(--wc-choice-height); flex-wrap: wrap; padding: var(--wc-space-1-5) var(--wc-space-2); column-gap: var(--wc-space-1-5); row-gap: var(--wc-space-0-5); }
}
/* Phones: 2 products at a time; the rest by swiping; the name of the row is a line over its values */
@media (max-width: 767px) {
	.wkit-cmp-dots { display: flex; }
	.wkit-cmp-legend { display: none; }
	.wkit-cmp__x { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; --wkit-cmp-w: calc(100vw - 2 * var(--wc-gutter-mobile) - 2px); }
	.wkit-cmp__x::-webkit-scrollbar { display: none; }
	.wkit-cmp__row, .wkit-cmp__grp-row { display: block; width: max-content; min-width: 100%; }
	.wkit-cmp__grp-row { padding: var(--wc-space-3) 0 var(--wc-space-2-5); box-sizing: border-box; background: var(--wc-surface-muted); border-bottom: 1px solid var(--wc-border); }
	.wkit-cmp__grp { position: sticky; left: 0; width: var(--wkit-cmp-w); box-sizing: border-box; padding: 0 var(--wc-space-3); border: 0; background: transparent; }
	.wkit-cmp__lab, .wkit-cmp__head .wkit-cmp__lab { position: sticky; left: 0; z-index: 1; width: var(--wkit-cmp-w); padding: var(--wc-space-3) var(--wc-space-3) var(--wc-space-0-5); font-size: var(--wc-font-size-small); }
	.wkit-cmp__head .wkit-cmp__lab { flex-direction: row; justify-content: space-between; align-items: baseline; flex-wrap: wrap; padding-bottom: var(--wc-space-2); }
	.wkit-cmp__row.is-diff .wkit-cmp__lab { box-shadow: none; }
	.wkit-cmp__row.is-diff { box-shadow: inset var(--wc-compare-diff-bar) 0 0 var(--wc-brand); }
	.wkit-cmp__vals { display: grid; grid-template-columns: repeat(var(--wkit-cmp-n, 2), var(--wc-compare-col-mobile)); column-gap: var(--wc-space-3); padding: 0 var(--wc-space-3); }
	.wkit-cmp__v { border-left: 0; padding: var(--wc-space-0-5) 0 var(--wc-space-3); scroll-snap-align: start; scroll-margin-left: var(--wc-space-3); }
	.wkit-cmp__row.is-diff .wkit-cmp__v { border-left: 0; }
	.wkit-cmp__ph { border-left: 0; padding: var(--wc-space-1) 0 var(--wc-space-4); gap: var(--wc-space-2); scroll-snap-align: start; scroll-margin-left: var(--wc-space-3); }
	.wkit-cmp__img { height: var(--wc-compare-photo-mobile); }
	.wkit-cmp__name { font-size: var(--wc-font-size-body); }
	.wkit-cmp__verbtn { font-size: var(--wc-font-size-small); }
	.wkit-cmp__menu { width: 300px; }
	.wkit-cmp-sticky__in { display: block; width: max-content; }
	.wkit-cmp-sticky__lab { display: none; }
	.wkit-cmp-sticky__vals { display: grid; grid-template-columns: repeat(var(--wkit-cmp-n, 2), var(--wc-compare-col-mobile)); column-gap: var(--wc-space-3); padding: 0 var(--wc-space-3); }
	.wkit-cmp__sc { border-left: 0; padding: var(--wc-space-2) 0; }
	.wkit-cmp-ctl { flex-direction: column; flex-wrap: nowrap; align-items: stretch; border-bottom: 0; }
	.wkit-cmp-ctl__region { border-bottom: 1px solid var(--wc-border); }
	.wkit-cmp-ctl__acts { justify-content: space-between; gap: var(--wc-space-1); flex-wrap: nowrap; padding-bottom: 0; }
}
.wkit-ds-tray .wkit-tray { position: static; }
.wkit-ds-toast { position: relative; }
.wkit-ds-toast .wkit-toast { position: static; transform: none; }

/* K30 · document buttons (new tab / download) and the preference switch (CX5) */
.wkit-doc-label {
	min-width: 0;
}
.wkit-doc-ico--tab {
	margin-inline-start: var(--wc-space-0-5);
}
.wkit-switch__label {
	min-width: 0;
}
.wkit-switch[aria-busy="true"] {
	opacity: 0.7;
	cursor: progress;
}
.wkit-docpref {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-2);
}
.wkit-docpref .wkit-help {
	margin: 0;
}
.wkit-docpref__status {
	margin: 0;
	min-height: 0;
	font-size: var(--wc-font-size-small);
	line-height: var(--wc-line-height-small);
	font-weight: var(--wc-weight-semibold);
	color: var(--wc-success-ink);
}
.wkit-docpref__status:empty {
	display: none;
}
.wkit-docpref__status.is-error {
	color: var(--wc-error);
}

/* ==========================================================================
   K14 · My catalog (ACTA-CX1): the page, its tree with check boxes, the options, the saved catalogs, the access in the header
   and the button "Add to my catalog". Generic: nothing here names a product, a sensor or a region.
   ========================================================================== */

/* ---------- Access in the header: a pill with the counter ---------- */
.wkit-brand + .wkit-slot { margin-left: auto; } /* The first place after the logo pushes the rest to the right (My selection used to do it). */
.wkit-slot--quotes ~ .wkit-slot--account { margin-left: 0; }
.wkit-mc-pill {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-height: var(--wc-control-height);
	padding: 0 var(--wc-space-2) 0 var(--wc-space-4);
	border: 1px solid var(--wc-topbar);
	border-radius: var(--wc-radius-pill);
	background: transparent;
	color: var(--wc-topbar);
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-semibold);
	line-height: 1;
	text-decoration: none !important;
	white-space: nowrap;
	transition: background-color 0.15s, color 0.15s;
}
.wkit-mc-pill:hover,
.wkit-mc-pill:focus-visible { background: var(--wc-topbar); color: var(--wc-on-brand); }
.wkit-mc-pill.is-current { background: var(--wc-topbar); color: var(--wc-on-brand); }
.wkit-mc-pill__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--wc-counter-size);
	height: var(--wc-counter-size);
	padding: 0 var(--wc-space-1-5);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-brand);
	color: var(--wc-on-brand);
	font-size: var(--wc-font-size-badge);
	font-weight: var(--wc-weight-bold);
}
.wkit-mc-pill__count.is-empty { background: var(--wc-footer-divider); }
.wkit-mc-pill--drawer { display: flex; margin: var(--wc-space-3) var(--wc-space-4); width: fit-content; color: var(--wc-ink-strong); border-color: var(--wc-border-input); }
.wkit-mc-pill--mobile { display: none; }
@media (max-width: 1279px) {
	.wkit-mc-pill--bar { padding: 0 var(--wc-space-2) 0 var(--wc-space-3); }
	.wkit-mc-pill--bar .wkit-mc-pill__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (max-width: 767px) {
	.wkit-mc-pill--mobile {
		position: absolute;
		top: 6px;
		right: 56px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: var(--wc-control-height);
		height: var(--wc-control-height);
		min-height: 0;
		padding: 0;
		border: 0;
		color: var(--wc-on-brand);
	}
	.wkit-mc-pill--mobile .wkit-mc-pill__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.wkit-mc-pill--mobile .wkit-mc-pill__count { position: absolute; top: 2px; right: 0; border: 2px solid var(--wc-topbar); box-sizing: content-box; min-width: 14px; height: 14px; line-height: 14px; font-size: 11px; }
	.wkit-mc-pill--mobile .wkit-mc-pill__count.is-empty { display: none; }
	.wkit-mc-pill--mobile:hover, .wkit-mc-pill--mobile:focus-visible, .wkit-mc-pill--mobile.is-current { background: transparent; }
}

/* ---------- The button "Add to my catalog" ---------- */
.wkit-mc-add .wkit-mc-add__ico { display: inline-flex; }
.wkit-mc-add .wkit-mc-add__ico--added,
.wkit-mc-add.is-added .wkit-mc-add__ico--add { display: none; }
.wkit-mc-add.is-added .wkit-mc-add__ico--added { display: inline-flex; }
.wkit-mc-add.is-added { border-color: var(--wc-brand); background: var(--wc-brand-tint); color: var(--wc-brand); }
.wkit-item-actions .wkit-mc-add { width: 100%; }
.wkit-mc-customize { color: var(--wc-brand); }
.wkit-toast--mcbar { bottom: calc(var(--wc-tray-height-mobile) + var(--wc-space-6)); }
@media (min-width: 960px) { .wkit-toast--mcbar { bottom: var(--wc-space-6); } }

/* ---------- The page ---------- */
.wkit-mc { margin: var(--wc-space-6) 0 var(--wc-space-16); }
.wkit-mc__title { margin: var(--wc-space-4) 0 var(--wc-space-3); color: var(--wc-ink-strong); font-size: var(--wc-font-size-product-title); line-height: var(--wc-line-height-product-title); font-weight: var(--wc-weight-bold); letter-spacing: var(--wc-title-letter-spacing); }
.wkit-mc__lead { margin: 0 0 var(--wc-space-6); font-size: var(--wc-subtitle-catalog-size); color: var(--wc-ink); line-height: 1.5; }
.wkit-mc__toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wc-space-3) var(--wc-space-4); padding: var(--wc-space-3) var(--wc-space-3) var(--wc-space-3) var(--wc-space-4); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-card); background: var(--wc-surface-muted); }
.wkit-mc__current { display: flex; flex-direction: column; gap: var(--wc-space-0-5); min-width: 0; }
.wkit-mc__name-row { display: flex; align-items: center; flex-wrap: wrap; gap: var(--wc-space-2); }
.wkit-mc__name { color: var(--wc-ink-strong); font-size: var(--wc-font-size-body); font-weight: var(--wc-weight-bold); overflow-wrap: anywhere; }
.wkit-mc__tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wc-space-3); }
.wkit-mc__menu-wrap { position: relative; }
.wkit-mc__sep { width: 1px; height: var(--wc-space-7); background: var(--wc-border-input); }
.wkit-mc__notices { display: flex; flex-direction: column; gap: var(--wc-space-3); }
.wkit-mc__notices:not(:empty) { margin-top: var(--wc-space-4); }
.wkit-mc__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 380px); gap: var(--wc-space-8); align-items: start; margin-top: var(--wc-space-6); }
.wkit-mc-note { position: relative; display: flex; flex-direction: column; gap: var(--wc-space-0-5); padding: var(--wc-space-3-5) var(--wc-space-10) var(--wc-space-3-5) var(--wc-space-4); border: 1px solid var(--wc-info-line); border-radius: var(--wc-radius-md); background: var(--wc-info-bg); color: var(--wc-info-ink); font-size: var(--wc-font-size-ui); line-height: 1.5; }
.wkit-mc-note--warn { border-color: var(--wc-warning-line); background: var(--wc-warning-bg); color: var(--wc-warning-ink); padding-right: var(--wc-space-4); }
.wkit-mc-note__x { position: absolute; top: var(--wc-space-1-5); right: var(--wc-space-1-5); display: inline-flex; align-items: center; justify-content: center; width: var(--wc-control-height); height: var(--wc-control-height); border: 0; border-radius: var(--wc-radius-btn); background: transparent; color: inherit; cursor: pointer; }

/* ---------- The tree ---------- */
.wkit-mc-tree__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--wc-space-1) var(--wc-space-3); margin-bottom: var(--wc-space-4); }
.wkit-mc-tree__title { margin: 0; color: var(--wc-ink-strong); font-size: var(--wc-h2-side-size); font-weight: var(--wc-weight-bold); }
.wkit-mc-tree__meta { color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); }
.wkit-mc-tree__head .js-mc-clear { margin-left: auto; }
.wkit-mc-fam { margin-bottom: var(--wc-space-4); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-card); background: var(--wc-page); box-shadow: var(--wc-shadow-flat); overflow: hidden; }
.wkit-mc-fam[hidden], .wkit-mc-sub[hidden] { display: none; }
.wkit-mc-fam__head { display: flex; align-items: center; gap: var(--wc-space-2); padding: var(--wc-space-2) var(--wc-space-4) var(--wc-space-2) var(--wc-space-1); flex-wrap: wrap; }
.wkit-mc-fam.is-open > .wkit-mc-fam__head { background: var(--wc-surface-muted); border-bottom: 1px solid var(--wc-border); }
.wkit-mc-fam__title { display: flex; flex-direction: column; min-width: 0; flex: 1 1 160px; }
.wkit-mc-fam__name { color: var(--wc-ink-strong); font-size: var(--wc-font-size-card-title); font-weight: var(--wc-weight-bold); text-decoration: none; line-height: var(--wc-line-height-card-title); }
.wkit-mc-fam__name svg { margin-left: var(--wc-space-1); color: var(--wc-brand); vertical-align: -1px; }
a.wkit-mc-fam__name:hover { text-decoration: underline; text-underline-offset: 3px; }
.wkit-mc-fam__count { color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); }
.wkit-mc-chev { display: inline-flex; align-items: center; justify-content: center; width: var(--wc-control-height); height: var(--wc-control-height); border: 0; background: transparent; color: var(--wc-ink); cursor: pointer; border-radius: var(--wc-radius-btn); }
.wkit-mc-chev svg { transition: transform 0.15s; transform: rotate(180deg); }
.wkit-mc-chev[aria-expanded="false"] svg { transform: none; }
.wkit-mc-sub { border-top: 1px solid var(--wc-border); }
.wkit-mc-sub__head { display: flex; align-items: center; gap: var(--wc-space-3); padding: var(--wc-space-2) var(--wc-space-4) var(--wc-space-2) var(--wc-space-14); background: var(--wc-surface-muted); flex-wrap: wrap; }
.wkit-mc-sub .wkit-mc-fam__title { flex-direction: row; align-items: baseline; justify-content: space-between; gap: var(--wc-space-3); }
.wkit-mc-sub .wkit-mc-fam__name { font-size: var(--wc-font-size-body); }
.wkit-mc-sub .wkit-mc-item { padding-left: var(--wc-space-24); }
/* The check box: a button with a square inside; 44 px to touch. */
.wkit-mc-ck { position: relative; display: inline-flex; align-items: center; justify-content: center; flex: none; width: var(--wc-checkbox); height: var(--wc-checkbox); padding: 0; border: 0; background: transparent; cursor: pointer; }
.wkit-mc-ck::before { content: ""; position: absolute; inset: calc((var(--wc-control-height) - var(--wc-checkbox)) / -2); }
.wkit-mc-ck__box { display: inline-flex; align-items: center; justify-content: center; width: var(--wc-checkbox); height: var(--wc-checkbox); border: 2px solid var(--wc-ink-faint); border-radius: var(--wc-radius-xs); background: var(--wc-page); color: transparent; }
.wkit-mc-ck.is-on .wkit-mc-ck__box { border-color: var(--wc-brand); background: var(--wc-brand); color: var(--wc-on-brand); }
.wkit-mc-ck.is-mixed .wkit-mc-ck__box { border-color: var(--wc-brand); background: var(--wc-brand); color: transparent; position: relative; }
.wkit-mc-ck.is-mixed .wkit-mc-ck__box::after { content: ""; position: absolute; left: 3px; right: 3px; top: 50%; height: 2px; margin-top: -1px; background: var(--wc-on-brand); }
.wkit-mc-ck:focus-visible .wkit-mc-ck__box { outline: 2px solid var(--wc-brand); outline-offset: 2px; }
.wkit-mc-partial { margin-left: auto; }
/* "Per page": a segmented selector. */
.wkit-mc-opts { display: inline-flex; align-items: center; gap: var(--wc-space-2); margin-left: auto; }
.wkit-mc-partial + .wkit-mc-opts { margin-left: 0; }
.wkit-mc-opts__label { color: var(--wc-ink-muted); }
.wkit-mc-seg { display: inline-flex; padding: var(--wc-space-0-5) var(--wc-space-0-5); border: 1px solid var(--wc-border-input); border-radius: var(--wc-radius-btn); background: var(--wc-page); gap: var(--wc-space-0-5); }
.wkit-mc-seg__btn { min-width: var(--wc-space-10); height: var(--wc-segment-height); padding: 0 var(--wc-space-3); border: 0; border-radius: var(--wc-radius-sm); background: transparent; color: var(--wc-ink-strong); font: inherit; font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-semibold); cursor: pointer; }
.wkit-mc-seg__btn[aria-pressed="true"] { background: var(--wc-brand); color: var(--wc-on-brand); }
.wkit-mc-seg__btn:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 1px; }
/* Items. */
.wkit-mc-item { display: grid; grid-template-columns: var(--wc-checkbox) 48px minmax(0, 1fr) auto; align-items: center; gap: var(--wc-space-3-5); padding: var(--wc-space-2-5) var(--wc-space-4) var(--wc-space-2-5) var(--wc-space-14); border-top: 1px solid var(--wc-border); }
.wkit-mc-item:first-child { border-top: 0; }
.wkit-mc-item.is-out .wkit-mc-thumb { opacity: 0.5; }
.wkit-mc-item.is-out .wkit-mc-item__name, .wkit-mc-item.is-out .wkit-mc-item__code { color: var(--wc-ink-muted); }
.wkit-mc-thumb { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 36px; overflow: hidden; border-radius: var(--wc-radius-sm); background: var(--wc-photo-bg); color: var(--wc-noimage-ink); }
.wkit-mc-thumb img { width: 100%; height: 100%; object-fit: contain; }
.wkit-mc-item__text { display: flex; flex-direction: column; min-width: 0; }
.wkit-mc-item__name { color: var(--wc-ink-strong); font-size: var(--wc-font-size-body); font-weight: var(--wc-weight-semibold); }
.wkit-mc-item__code { color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); font-weight: var(--wc-weight-semibold); }
.wkit-mc-item__note { color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); }
.wkit-mc-item__out { display: flex; align-items: center; gap: var(--wc-space-1); color: var(--wc-replaced-icon); font-size: var(--wc-font-size-small); font-weight: var(--wc-weight-semibold); }
.wkit-mc-item__out[hidden] { display: none; }
.wkit-mc-item__badges { display: inline-flex; gap: var(--wc-space-1-5); }
.wkit-mc-iopt { grid-column: 3 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: var(--wc-space-2); }
.wkit-mc-iopt[hidden] { display: none; }
.wkit-mc-iopt__label { color: var(--wc-ink-strong); font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-semibold); }
.wkit-mc-iopt__note { color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); }
.wkit-mc.is-hide-disc .wkit-mc-item[data-state="discontinued"],
.wkit-mc.is-hide-disc .wkit-mc-item[data-state="replaced"] { display: none; }
.wkit-mc__empty-tree { padding: var(--wc-space-8); text-align: center; color: var(--wc-ink-muted); }

/* ---------- The panel ---------- */
.wkit-mc__panel { position: sticky; top: var(--wc-space-6); }
.wkit-mc-panel { display: flex; flex-direction: column; gap: var(--wc-space-5); padding: var(--wc-space-6); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-card); background: var(--wc-page); box-shadow: var(--wc-shadow-flat); }
.wkit-mc-panel__title { margin: 0; color: var(--wc-ink-strong); font-size: var(--wc-h3-size); font-weight: var(--wc-weight-bold); }
.wkit-mc-panel__rule { width: 100%; margin: 0; border: 0; border-top: 1px solid var(--wc-border); }
.wkit-mc-panel__result { display: flex; flex-direction: column; gap: var(--wc-space-3); }
.wkit-mc-panel__buttons { display: flex; flex-direction: column; gap: var(--wc-space-2-5); }
.wkit-mc-panel__need, .wkit-mc-panel__error { margin: 0; font-size: var(--wc-font-size-small); color: var(--wc-ink-muted); }
.wkit-mc-panel__error { color: var(--wc-error); font-weight: var(--wc-weight-semibold); }
.wkit-mc-panel__error[hidden], .wkit-mc-panel__need[hidden] { display: none; }
.wkit-mc-field { display: flex; flex-direction: column; gap: var(--wc-space-2); }
.wkit-mc-field[hidden] { display: none; }
.wkit-mc-field__label { color: var(--wc-ink-strong); font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-semibold); }
.wkit-mc-field__hint { margin: 0; color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); line-height: 1.5; }
.wkit-mc-field__error { margin: 0; color: var(--wc-error); font-size: var(--wc-font-size-small); font-weight: var(--wc-weight-semibold); }
.wkit-mc-field__error[hidden] { display: none; }
.wkit-mc-covers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wc-space-3); }
.wkit-mc-cover { display: flex; flex-direction: column; gap: var(--wc-space-2); padding: var(--wc-space-2); border: 1px solid var(--wc-border-input); border-radius: var(--wc-radius-md); background: var(--wc-page); text-align: left; font: inherit; color: var(--wc-ink-strong); cursor: pointer; }
.wkit-mc-cover.is-on { border: 2px solid var(--wc-brand); padding: calc(var(--wc-space-2) - 1px); }
.wkit-mc-cover__thumb { display: flex; flex-direction: column; gap: var(--wc-space-1); aspect-ratio: 8.5 / 11; padding: var(--wc-space-2); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-sm); background: var(--wc-page); }
.wkit-mc-cover__thumb span { display: block; height: var(--wc-space-1-5); border-radius: var(--wc-radius-xs); background: var(--wc-surface-chip); }
.wkit-mc-cover__thumb span:first-child { height: 38%; background: var(--wc-hero-ground); }
.wkit-mc-cover__thumb--selection span:first-child { height: 28%; }
.wkit-mc-cover__text { display: flex; align-items: center; gap: var(--wc-space-2); font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-semibold); line-height: 1.2; }
.wkit-mc-cover__dot { flex: none; width: var(--wc-space-4); height: var(--wc-space-4); border: 2px solid var(--wc-ink-faint); border-radius: 50%; }
.wkit-mc-cover.is-on .wkit-mc-cover__dot { border: 5px solid var(--wc-brand); }
.wkit-mc-cover:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 2px; }
.wkit-mc-counter__row { display: flex; align-items: baseline; gap: var(--wc-space-1); color: var(--wc-ink-strong); }
.wkit-mc-counter__n { font-size: var(--wc-font-size-screen-title); font-weight: var(--wc-weight-bold); font-variant-numeric: tabular-nums; }
.wkit-mc-counter__n.is-over { color: var(--wc-replaced-icon); }
.wkit-mc-counter__max { font-size: var(--wc-font-size-screen-title); font-weight: var(--wc-weight-bold); }
.wkit-mc-counter__unit { margin-left: var(--wc-space-1); color: var(--wc-ink); font-size: var(--wc-font-size-ui); }
.wkit-mc-meter { height: var(--wc-meter-height); margin-top: var(--wc-space-2); border-radius: var(--wc-radius-pill); background: var(--wc-border); overflow: hidden; }
.wkit-mc-meter > span { display: block; height: 100%; width: 0; border-radius: var(--wc-radius-pill); background: var(--wc-brand); transition: width 0.15s; }
.wkit-mc-meter > span.is-over { background: var(--wc-replaced-icon); }
.wkit-mc-counter__hint { margin: var(--wc-space-2) 0 0; color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); }
.wkit-mc-limit { padding: var(--wc-space-3) var(--wc-space-4); border: 1px solid var(--wc-warning-line); border-radius: var(--wc-radius-md); background: var(--wc-warning-bg); color: var(--wc-warning-ink); font-size: var(--wc-font-size-ui); line-height: 1.5; }
.wkit-mc-limit[hidden] { display: none; }
.wkit-mc-emptybox { display: flex; flex-direction: column; align-items: flex-start; gap: var(--wc-space-2); padding: var(--wc-space-4); border: 1px dashed var(--wc-border-input); border-radius: var(--wc-radius-md); background: var(--wc-surface-muted); color: var(--wc-ink); font-size: var(--wc-font-size-ui); }
.wkit-mc-emptybox[hidden] { display: none; }
.wkit-mc-emptybox strong { color: var(--wc-ink-strong); }
.wkit-mc-emptybox p { margin: 0; }
.wkit-btn.is-busy { opacity: 0.8; cursor: progress; }
.wkit-btn:disabled, .wkit-btn[aria-disabled="true"] { background: var(--wc-border-input); border-color: var(--wc-border-input); color: var(--wc-on-brand); cursor: not-allowed; }
.wkit-btn--secondary:disabled, .wkit-btn--secondary[aria-disabled="true"] { background: var(--wc-surface-muted); color: var(--wc-ink-faint); }
.wkit-mc-btn--danger { background: var(--wc-error); border-color: var(--wc-error); color: var(--wc-on-brand); }
.wkit-mc-btn--danger:hover, .wkit-mc-btn--danger:focus-visible { background: var(--wc-error-ink); border-color: var(--wc-error-ink); color: var(--wc-on-brand); }

/* ---------- The bar at the bottom (tablet and phone) ---------- */
.wkit-mc-bar { display: none; }

/* ---------- Saved and official catalogs: the menu (a sheet on a phone) ---------- */
.wkit-mc-menu { position: absolute; z-index: var(--wc-z-dialog); top: calc(100% + var(--wc-space-1)); right: 0; width: min(440px, 92vw); max-height: 70vh; overflow-y: auto; border: 1px solid var(--wc-border); border-radius: var(--wc-radius-search); background: var(--wc-page); box-shadow: var(--wc-shadow-menu); }
.wkit-mc-menu[hidden] { display: none; }
.wkit-mc-menu__head { display: none; align-items: center; justify-content: space-between; padding: var(--wc-space-3) var(--wc-space-3) var(--wc-space-3) var(--wc-space-4); border-bottom: 1px solid var(--wc-border); color: var(--wc-ink-strong); }
.wkit-mc-menu__section { padding: var(--wc-space-3) 0; }
.wkit-mc-menu__section + .wkit-mc-menu__section { border-top: 1px solid var(--wc-border); }
.wkit-mc-menu__title { display: flex; justify-content: space-between; padding: 0 var(--wc-space-4) var(--wc-space-2); color: var(--wc-ink-muted); font-size: var(--wc-font-size-eyebrow); font-weight: var(--wc-weight-semibold); letter-spacing: var(--wc-letter-spacing-eyebrow); text-transform: uppercase; }
.wkit-mc-menu__none { margin: 0; padding: var(--wc-space-2) var(--wc-space-4); color: var(--wc-ink-muted); font-size: var(--wc-font-size-ui); }
.wkit-mc-menu__foot { display: flex; flex-direction: column; align-items: flex-start; gap: var(--wc-space-2); padding: var(--wc-space-3) var(--wc-space-4) 0; color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); }
.wkit-mc-recipes { margin: 0; padding: 0; list-style: none; }
.wkit-mc-recipe { position: relative; display: flex; align-items: center; gap: var(--wc-space-2); min-height: 60px; padding: var(--wc-space-2) var(--wc-space-2) var(--wc-space-2) var(--wc-space-4); }
.wkit-mc-recipe.is-current { background: var(--wc-brand-tint); box-shadow: inset 3px 0 0 var(--wc-brand); }
.wkit-mc-recipe__text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.wkit-mc-recipe__text strong { color: var(--wc-ink-strong); font-size: var(--wc-font-size-body); }
.wkit-mc-recipe__text span { color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); }
.wkit-mc-recipe__more { position: relative; }
.wkit-mc-rowmenu { position: absolute; z-index: 2; right: 0; top: 100%; min-width: 200px; padding: var(--wc-space-1-5) 0; border: 1px solid var(--wc-border); border-radius: var(--wc-radius-md); background: var(--wc-page); box-shadow: var(--wc-shadow-menu); }
.wkit-mc-rowmenu[hidden] { display: none; }
.wkit-mc-rowmenu button { display: block; width: 100%; padding: var(--wc-space-2-5) var(--wc-space-4); border: 0; background: transparent; text-align: left; font: inherit; font-size: var(--wc-font-size-ui); color: var(--wc-ink-strong); cursor: pointer; }
.wkit-mc-rowmenu button:hover { background: var(--wc-surface-chip); }
.wkit-mc-rowmenu button.is-danger { color: var(--wc-error); }
.wkit-mc-dialog { width: min(480px, calc(100vw - 2 * var(--wc-space-4))); }
.wkit-mc-dialog__text { margin: 0; color: var(--wc-ink); font-size: var(--wc-font-size-body); line-height: var(--wc-line-height-body); }
.wkit-mc-dialog__foot { flex-direction: row; flex-wrap: wrap; justify-content: flex-end; }
.wkit-mc-choices { display: flex; flex-direction: column; gap: var(--wc-space-2); }
.wkit-mc-choice { display: flex; align-items: center; gap: var(--wc-space-3); min-height: var(--wc-control-height); padding: 0 var(--wc-space-3-5); border: 1px solid var(--wc-border-input); border-radius: var(--wc-radius-btn); cursor: pointer; color: var(--wc-ink-strong); font-weight: var(--wc-weight-semibold); }
.wkit-mc-choice:has(input:checked) { border-color: var(--wc-brand); background: var(--wc-brand-tint); }
.wkit-mc-choice input { accent-color: var(--wc-brand); }

@media (max-width: 959px) {
	.wkit-mc__layout { grid-template-columns: minmax(0, 1fr); gap: var(--wc-space-6); }
	.wkit-mc__panel { position: static; }
	.wkit-mc { padding-bottom: calc(var(--wc-tray-height-mobile) + var(--wc-space-6)); margin-bottom: 0; }
	.wkit-mc-panel__result .wkit-mc-counter, .wkit-mc-panel__buttons, .wkit-mc-panel__result .wkit-mc-limit { display: none; }
	.wkit-mc-bar { position: fixed; z-index: var(--wc-z-tray); left: 0; right: 0; bottom: 0; display: block; padding: var(--wc-space-3) var(--wc-gutter-tablet); border-top: 1px solid var(--wc-border); background: var(--wc-page); box-shadow: var(--wc-shadow-bar); }
	.wkit-mc-bar__row { display: flex; align-items: center; justify-content: space-between; gap: var(--wc-space-4); }
	.wkit-mc-bar__count { display: flex; flex-direction: column; min-width: 0; width: 220px; color: var(--wc-ink); font-size: var(--wc-font-size-ui); }
	.wkit-mc-bar__count strong { color: var(--wc-ink-strong); font-size: var(--wc-font-size-card-title); font-weight: var(--wc-weight-bold); font-variant-numeric: tabular-nums; }
	.wkit-mc-bar__count > span { display: inline; }
	.wkit-mc-meter--bar { height: 6px; margin-top: var(--wc-space-1); }
	.wkit-mc-bar__buttons { display: flex; gap: var(--wc-space-2-5); }
	.wkit-mc-bar__limit { margin: var(--wc-space-2) 0 0; padding: var(--wc-space-2) var(--wc-space-3); border-radius: var(--wc-radius-sm); background: var(--wc-warning-bg); color: var(--wc-warning-ink); font-size: var(--wc-font-size-small); font-weight: var(--wc-weight-semibold); }
	.wkit-mc-bar__limit[hidden] { display: none; }
}
@media (max-width: 767px) {
	.wkit-mc__title { font-size: var(--wc-title-catalog-size-mobile); }
	.wkit-mc__lead { font-size: var(--wc-subtitle-catalog-size-mobile); }
	.wkit-mc__toolbar { padding: var(--wc-space-3); }
	.wkit-mc__tools { width: 100%; }
	.wkit-mc__sep { display: none; }
	.wkit-mc-bar { padding: var(--wc-space-2-5) var(--wc-gutter-mobile); }
	.wkit-mc-bar__count { width: auto; flex: 1; max-width: 160px; }
	.wkit-mc-doc--icon .wkit-mc-doc__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.wkit-mc-doc--icon { width: var(--wc-control-height); padding: 0; }
	.wkit-mc-fam__head { padding-right: var(--wc-space-3); }
	.wkit-mc-item { padding: var(--wc-space-2-5) var(--wc-space-3) var(--wc-space-2-5) var(--wc-space-4); grid-template-columns: var(--wc-checkbox) 40px minmax(0, 1fr); }
	.wkit-mc-item__badges { grid-column: 3; }
	.wkit-mc-sub__head { padding-left: var(--wc-space-4); }
	.wkit-mc-sub .wkit-mc-item { padding-left: var(--wc-space-6); }
	.wkit-mc-iopt { grid-column: 3 / -1; }
	.wkit-mc-menu { position: fixed; z-index: var(--wc-z-dialog); left: 0; right: 0; bottom: 0; top: auto; width: auto; max-height: 86vh; border-radius: var(--wc-radius-card) var(--wc-radius-card) 0 0; box-shadow: var(--wc-shadow-sheet); }
	.wkit-mc-menu__head { display: flex; }
	body.wkit-mc-sheet-open::after { content: ""; position: fixed; inset: 0; z-index: calc(var(--wc-z-dialog) - 1); background: var(--wc-scrim); }
}
.wkit-mc [hidden],
.wkit-mc-bar [hidden] { display: none !important; }
.wkit-slot a.wkit-mc-customize { color: var(--wc-brand); font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-semibold); }
.wkit-slot a.wkit-mc-customize:hover,
.wkit-slot a.wkit-mc-customize:focus-visible { color: var(--wc-brand-hover); background: var(--wc-surface-muted); }

/* ---------- Filterable table (K23, ACTA-CX2) ---------- */
.wkit-tf [hidden] { display: none !important; }
.wkit-tf { display: flex; flex-direction: column; gap: var(--wc-space-6); }
.wkit-tf-controls { display: flex; flex-direction: column; gap: var(--wc-space-4); padding: var(--wc-space-5); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-box); background: var(--wc-surface-muted); }
.wkit-tf-searchrow { display: flex; gap: var(--wc-space-3); }
.wkit-tf-search { flex: 1; min-width: 0; }
.wkit-tf-search__box { display: flex; align-items: center; gap: var(--wc-space-3); box-sizing: border-box; min-height: var(--wc-search-height); padding: 0 var(--wc-space-2) 0 var(--wc-space-4); border: 1px solid var(--wc-border-input); border-radius: var(--wc-radius-search); background: var(--wc-page); color: var(--wc-brand); }
.wkit-tf-search__box:focus-within { border-color: var(--wc-brand); box-shadow: 0 0 0 1px var(--wc-brand); }
.wkit-tf-search__input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: var(--wc-font-size-search-input); color: var(--wc-ink-strong); }
.wkit-tf-search__input::-webkit-search-cancel-button { display: none; }
.wkit-tf-search__x { display: inline-flex; align-items: center; justify-content: center; width: var(--wc-control-height); height: var(--wc-control-height); padding: 0; border: 0; border-radius: var(--wc-radius-btn); background: transparent; color: var(--wc-ink-muted); cursor: pointer; }
.wkit-tf-search__x:hover { color: var(--wc-ink-strong); background: var(--wc-surface-chip); }
.wkit-tf-filterbtn { display: none; gap: var(--wc-space-2); min-height: var(--wc-search-height); }
.wkit-tf-filterbtn.is-set { border-color: var(--wc-brand); color: var(--wc-brand); }
.wkit-tf-panel { display: flex; flex-direction: column; gap: var(--wc-space-4); }
.wkit-tf-selects { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--wc-space-4); }
.wkit-tf-field { position: relative; display: flex; flex-direction: column; gap: var(--wc-space-1-5); min-width: 0; }
.wkit-tf-sel { display: flex; align-items: center; justify-content: space-between; gap: var(--wc-space-2); box-sizing: border-box; min-height: var(--wc-control-height); padding: 0 var(--wc-space-3) 0 var(--wc-space-4); border: 1px solid var(--wc-border-input); border-radius: var(--wc-radius-btn); background: var(--wc-page); color: var(--wc-ink-strong); font: inherit; font-size: var(--wc-font-size-ui); text-align: left; cursor: pointer; }
.wkit-tf-sel__value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wkit-tf-sel.is-set { border-color: var(--wc-brand); box-shadow: 0 0 0 1px var(--wc-brand); font-weight: var(--wc-weight-semibold); }
.wkit-tf-sel[aria-expanded="true"] svg { transform: rotate(180deg); }
.wkit-tf-menu { position: absolute; z-index: var(--wc-z-dialog); top: 100%; left: 0; min-width: 100%; max-width: 320px; max-height: 380px; margin: var(--wc-space-1) 0 0; padding: var(--wc-space-1) 0; overflow-y: auto; list-style: none; border: 1px solid var(--wc-border); border-radius: var(--wc-radius-search); background: var(--wc-page); box-shadow: var(--wc-shadow-menu); }
.wkit-tf-opt { display: flex; align-items: center; gap: var(--wc-space-2); min-height: var(--wc-control-height); padding: 0 var(--wc-space-4) 0 var(--wc-space-3); border-left: 3px solid transparent; font-size: var(--wc-font-size-ui); color: var(--wc-ink-strong); cursor: pointer; outline: 0; }
.wkit-tf-opt.is-all { border-bottom: 1px solid var(--wc-border); }
.wkit-tf-opt:hover, .wkit-tf-opt:focus { border-left-color: var(--wc-brand); background: var(--wc-surface-chip); }
.wkit-tf-opt__ck { flex: none; width: var(--wc-space-4); height: var(--wc-space-4); color: var(--wc-brand); }
.wkit-tf-opt__label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wkit-tf-opt__badge { flex: none; padding: var(--wc-space-0-5) var(--wc-space-2); border-radius: var(--wc-radius-pill); background: var(--wc-surface-chip); color: var(--wc-ink-chip); font-size: var(--wc-font-size-badge); font-weight: var(--wc-weight-semibold); }
.wkit-tf-opt__n { flex: none; font-size: var(--wc-font-size-badge); color: var(--wc-ink-muted); }
.wkit-tf-pillrow { display: flex; flex-direction: column; gap: var(--wc-space-1-5); }
.wkit-tf-pills { display: flex; flex-wrap: wrap; gap: var(--wc-space-2); }
.wkit-tf-pill { display: inline-flex; align-items: center; gap: var(--wc-space-1-5); min-height: var(--wc-pill-height); padding: 0 var(--wc-space-4); border: 1px solid var(--wc-border-input); border-radius: var(--wc-radius-pill); background: var(--wc-page); color: var(--wc-ink-strong); font: inherit; font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-semibold); cursor: pointer; }
.wkit-tf-pill:hover { border-color: var(--wc-brand); }
.wkit-tf-pill.is-active { border-color: var(--wc-brand); background: var(--wc-brand); color: var(--wc-on-brand); }
.wkit-tf-pill[aria-disabled="true"] { color: var(--wc-ink-faint); cursor: default; border-color: var(--wc-border); }
.wkit-tf-pill[aria-disabled="true"]:hover { border-color: var(--wc-border); }
.wkit-tf-pill__n { font-size: var(--wc-font-size-badge); font-weight: var(--wc-weight-regular); opacity: 0.8; }
.wkit-tf-panelfoot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wc-space-3); }
.wkit-tf-clear { display: inline-flex; align-items: center; gap: var(--wc-space-1); }
.wkit-tf-chips { display: none; flex-wrap: wrap; align-items: center; gap: var(--wc-space-2); }
.wkit-tf-chipx { display: inline-flex; align-items: center; gap: var(--wc-space-1); min-height: var(--wc-pill-height); padding: 0 var(--wc-space-1) 0 var(--wc-space-3); border: 1px solid var(--wc-brand-tint-line); border-radius: var(--wc-radius-pill); background: var(--wc-brand-tint); color: var(--wc-brand); font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-semibold); }
.wkit-tf-chipx__x { display: inline-flex; align-items: center; justify-content: center; width: var(--wc-pill-height); height: var(--wc-pill-height); padding: 0; border: 0; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.wkit-tf-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wc-space-3); }
.wkit-tf-actions__btns { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wc-space-3); }
.wkit-tf-count { margin: 0; color: var(--wc-ink-muted); font-size: var(--wc-font-size-body); }
.wkit-tf-count__n { margin-right: var(--wc-space-1); color: var(--wc-ink-strong); font-size: var(--wc-font-size-subtitle); font-weight: var(--wc-weight-bold); }
.wkit-tf-copy { gap: var(--wc-space-2); }
.wkit-tf a.is-off, .wkit-tf-actions a.is-off { background: var(--wc-border-input); color: var(--wc-on-brand); cursor: default; pointer-events: auto; }
.wkit-tf-link { display: inline-flex; align-items: center; gap: var(--wc-space-1-5); color: var(--wc-brand); font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-semibold); text-decoration: none; }
.wkit-tf-link:hover { text-decoration: underline; }

/* The table is a grid: the same rows are cards on a tablet and a phone. */
.wkit-tf-table { border: 1px solid var(--wc-border); border-radius: var(--wc-radius-card); overflow: hidden; background: var(--wc-page); }
.wkit-tf-head, .wkit-tf-row { display: grid; grid-template-columns: var(--tf-cols); }
.wkit-tf-th { padding: var(--wc-space-3) var(--wc-space-5); background: var(--wc-surface-muted); border-bottom: 1px solid var(--wc-border); color: var(--wc-ink-muted); font-size: var(--wc-font-size-eyebrow); font-weight: var(--wc-weight-bold); letter-spacing: var(--wc-letter-spacing-eyebrow); text-transform: uppercase; }
.wkit-tf-group { padding: var(--wc-space-2-5) var(--wc-space-5); background: var(--wc-surface-chip); border-bottom: 1px solid var(--wc-border); font-size: var(--wc-font-size-badge); font-weight: var(--wc-weight-bold); letter-spacing: var(--wc-letter-spacing-eyebrow); text-transform: uppercase; color: var(--wc-ink-strong); }
.wkit-tf-dot, .wkit-tf-groupn { color: var(--wc-ink-muted); }
.wkit-tf-row { border-bottom: 1px solid var(--wc-border); }
.wkit-tf-row:last-child { border-bottom: 0; }
.wkit-tf-row:hover { background: var(--wc-surface-muted); }
.wkit-tf-cell { min-width: 0; padding: var(--wc-space-3-5) var(--wc-space-5); font-size: var(--wc-font-size-ui); color: var(--wc-ink); overflow-wrap: anywhere; }
.wkit-tf-cell strong { color: var(--wc-ink-strong); }
.wkit-tf-cell .wkit-tf-sub { display: block; margin-top: var(--wc-space-1); font-size: var(--wc-font-size-badge); color: var(--wc-ink-muted); }
.wkit-tf-cell .wkit-tf-tags { display: flex; flex-wrap: wrap; gap: var(--wc-space-1-5); }
.wkit-tf-tag { display: inline-flex; align-items: center; gap: var(--wc-space-1); padding: var(--wc-space-1) var(--wc-space-2-5); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-pill); background: var(--wc-page); color: var(--wc-ink-strong); font-size: var(--wc-font-size-badge); font-weight: var(--wc-weight-semibold); text-decoration: none; }
a.wkit-tf-tag:hover { border-color: var(--wc-brand); }
.wkit-tf-tag b { color: var(--wc-brand); font-weight: var(--wc-weight-bold); }
.wkit-tf-tag--plain { background: var(--wc-surface-muted); }
.wkit-tf-tag.is-picked { background: var(--wc-brand-tint); border-color: var(--wc-brand-tint-line); }
.wkit-tf-state { display: inline-block; margin-top: var(--wc-space-1); padding: var(--wc-space-0-5) var(--wc-space-2); border-radius: var(--wc-radius-pill); font-size: var(--wc-font-size-badge); font-weight: var(--wc-weight-semibold); }
.wkit-tf-state--review { background: var(--wc-review-bg); color: var(--wc-review-ink); border: 1px solid var(--wc-review-line); }
.wkit-tf-state--replaced { background: var(--wc-replaced-bg); color: var(--wc-replaced-ink); border: 1px solid var(--wc-replaced-line); }
.wkit-tf-state--discontinued { background: var(--wc-surface-chip); color: var(--wc-ink-chip); border: 1px solid var(--wc-border); }
.wkit-tf-empty { display: flex; flex-direction: column; align-items: center; gap: var(--wc-space-3); padding: var(--wc-space-12) var(--wc-space-4); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-card); text-align: center; }
.wkit-tf-empty__ic { display: inline-flex; align-items: center; justify-content: center; width: var(--wc-space-14); height: var(--wc-space-14); border-radius: 50%; background: var(--wc-surface-chip); color: var(--wc-ink-muted); }
.wkit-tf-empty__title { margin: 0; font-size: var(--wc-font-size-card-title); color: var(--wc-ink-strong); }
.wkit-tf-empty__body { margin: 0; color: var(--wc-ink-muted); }

/* The sheet of filters (phone). */
.wkit-tf-noscroll { overflow: hidden; }
.wkit-tf-overlay { position: fixed; inset: 0; z-index: var(--wc-z-dialog); display: flex; align-items: flex-end; background: var(--wc-scrim); }
.wkit-tf-sheet { display: flex; flex-direction: column; box-sizing: border-box; width: 100%; max-height: 88vh; border-radius: var(--wc-radius-box) var(--wc-radius-box) 0 0; background: var(--wc-page); box-shadow: var(--wc-shadow-sheet); }
.wkit-tf-sheet__head { display: flex; align-items: center; justify-content: space-between; padding: var(--wc-space-4); border-bottom: 1px solid var(--wc-border); }
.wkit-tf-sheet__title { margin: 0; font-size: var(--wc-font-size-card-title); color: var(--wc-ink-strong); }
.wkit-tf-sheet__close { display: inline-flex; align-items: center; justify-content: center; width: var(--wc-control-height); height: var(--wc-control-height); border: 0; background: transparent; color: var(--wc-ink-strong); cursor: pointer; }
.wkit-tf-sheet__body { flex: 1; overflow-y: auto; padding: var(--wc-space-4); display: flex; flex-direction: column; gap: var(--wc-space-5); }
.wkit-tf-sheet__chips { display: flex; flex-wrap: wrap; gap: var(--wc-space-2); margin-top: var(--wc-space-2); }
.wkit-tf-chip { display: inline-flex; align-items: center; gap: var(--wc-space-1-5); min-height: var(--wc-pill-height); padding: 0 var(--wc-space-3-5); border: 1px solid var(--wc-border-input); border-radius: var(--wc-radius-pill); background: var(--wc-page); color: var(--wc-ink-strong); font: inherit; font-size: var(--wc-font-size-ui); cursor: pointer; }
.wkit-tf-chip[aria-pressed="true"] { border-color: var(--wc-brand); background: var(--wc-brand); color: var(--wc-on-brand); font-weight: var(--wc-weight-semibold); }
.wkit-tf-sheet__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--wc-space-3); padding: var(--wc-space-3) var(--wc-space-4); border-top: 1px solid var(--wc-border); }
.wkit-tf-sheet__show { flex: 1; max-width: 260px; }

@media (max-width: 959px) {
	.wkit-tf-head { display: none; }
	.wkit-tf-table { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wc-space-3); padding: var(--wc-space-3); border: 0; background: transparent; overflow: visible; }
	.wkit-tf-group { grid-column: 1 / -1; border: 1px solid var(--wc-border); border-radius: var(--wc-radius-sm); }
	.wkit-tf-row { display: flex; flex-direction: column; border: 1px solid var(--wc-border); border-radius: var(--wc-radius-card); background: var(--wc-page); overflow: hidden; }
	.wkit-tf-row:last-child { border-bottom: 1px solid var(--wc-border); }
	.wkit-tf-cell { padding: var(--wc-space-1-5) var(--wc-space-3-5); }
	.wkit-tf-cell.is-lead { padding-top: var(--wc-space-3); }
	.wkit-tf-cell:not(.is-lead) { background: var(--wc-surface-muted); }
	.wkit-tf-cell:not(.is-lead)::before { content: attr(data-label); display: block; color: var(--wc-ink-muted); font-size: var(--wc-font-size-eyebrow); font-weight: var(--wc-weight-bold); letter-spacing: var(--wc-letter-spacing-eyebrow); text-transform: uppercase; }
	.wkit-tf { padding-bottom: calc(var(--wc-control-height) + var(--wc-space-8)); }
	.wkit-tf-actions { position: fixed; z-index: var(--wc-z-sticky); left: 0; right: 0; bottom: 0; flex-wrap: nowrap; box-sizing: border-box; padding: var(--wc-space-3) var(--wc-space-8); background: var(--wc-page); box-shadow: var(--wc-shadow-bar); }
	.wkit-tf-toast { bottom: calc(var(--wc-control-height) + var(--wc-space-8)); }
}
@media (max-width: 767px) {
	.wkit-tf-table { grid-template-columns: minmax(0, 1fr); }
	.wkit-tf-controls { padding: 0; border: 0; background: transparent; }
	.wkit-tf-filterbtn { display: inline-flex; }
	.wkit-tf-panel { display: none; }
	.wkit-tf-chips:not([hidden]) { display: flex; }
	.wkit-tf-actions { padding: var(--wc-space-2-5) var(--wc-gutter-mobile); gap: var(--wc-space-3); }
	.wkit-tf-actions__btns { flex: 1; flex-wrap: nowrap; justify-content: flex-end; min-width: 0; }
	.wkit-tf-count { white-space: nowrap; font-size: var(--wc-font-size-ui); }
	.wkit-tf-count__n { font-size: var(--wc-font-size-card-title); }
	.wkit-tf-actions .wkit-split { min-width: 0; }
	.wkit-tf-actions .wkit-btn { padding-left: var(--wc-space-3); padding-right: var(--wc-space-3); }
	.wkit-tf-copy__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.wkit-tf-copy { width: var(--wc-control-height); padding: 0; }
	.wkit-tf-search__box { min-height: var(--wc-control-height); }
	.wkit-tf-filterbtn { min-height: var(--wc-control-height); }
}
.wkit-tf-brand { font-weight: var(--wc-weight-regular); color: var(--wc-ink); }
.wkit-tf-nodelink { color: var(--wc-brand); font-size: var(--wc-font-size-small); text-decoration: none; }
.wkit-tf-nodelink:hover { text-decoration: underline; }
.wkit-tf-tag.is-picked { background: var(--wc-brand-tint); border-color: var(--wc-brand-tint-line); }

/* ==========================================================================
   CX7 · entry of a tray in the header, line under the thumbnail, picker panel, annexes of My catalog
   ========================================================================== */

/* The entry of a tray in the dark bar (before "My quotes"): a link like My quotes and My requests, with its counter (no number while empty). */
.wkit-tray-entry {
	display: inline-flex;
	align-items: center;
	gap: var(--wc-space-2);
	min-height: var(--wc-control-height);
	padding: 0 var(--wc-space-4);
	color: var(--wc-topbar-link);
	font-size: var(--wc-font-size-small);
	font-weight: var(--wc-weight-semibold);
	line-height: 1;
	white-space: nowrap;
	text-decoration: none !important;
}
.wkit-slot a.wkit-tray-entry,
.wkit-slot a.wkit-tray-entry:hover,
.wkit-slot a.wkit-tray-entry:focus-visible { text-decoration: none !important; } /* The line goes under the text only, never under the number. */
.wkit-slot a.wkit-tray-entry:hover .wkit-tray-entry__label,
.wkit-slot a.wkit-tray-entry:focus-visible .wkit-tray-entry__label { color: var(--wc-on-brand); text-decoration: underline !important; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.wkit-tray-entry:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 2px; }
.wkit-tray-entry.is-current { color: var(--wc-on-brand); }
.wkit-tray-entry__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--wc-counter-size);
	height: var(--wc-counter-size);
	padding: 0 var(--wc-space-1-5);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-brand);
	color: var(--wc-on-brand);
	font-size: var(--wc-font-size-counter);
	font-weight: var(--wc-weight-bold);
	text-decoration: none !important;
}
.wkit-tray-entry__count.is-empty { display: none; }
.wkit-tray-entry--mobile { display: none; }
@media (max-width: 1279px) {
	.wkit-tray-entry { min-width: var(--wc-control-height); justify-content: center; padding: 0 var(--wc-space-2-5); }
	.wkit-tray-entry__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
.wkit-drawer-foot .wkit-tray-entry {
	display: flex;
	margin: 0;
	padding: var(--wc-space-3) 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-body);
	gap: var(--wc-space-2);
}
.wkit-drawer-foot .wkit-tray-entry__label { position: static; width: auto; height: auto; clip: auto; overflow: visible; }
@media (max-width: 767px) {
	.wkit-slot--quotes .wkit-tray-entry { display: none; }
	.wkit-tray-entry--mobile {
		position: absolute;
		top: var(--wc-space-1-5);
		right: calc(var(--wc-space-14) + var(--wc-control-height));
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: var(--wc-control-height);
		height: var(--wc-control-height);
		margin: 0;
		padding: 0;
		border: 0;
		color: var(--wc-on-brand);
	}
	.wkit-tray-entry--mobile .wkit-tray-entry__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.wkit-tray-entry--mobile:hover, .wkit-tray-entry--mobile.is-current { background: transparent; }
	.wkit-tray-entry--mobile .wkit-tray-entry__count {
		position: absolute;
		top: var(--wc-space-1);
		right: var(--wc-space-0-5);
		box-sizing: content-box;
		border: 2px solid var(--wc-topbar);
	}
	.wkit-tray-entry--mobile .wkit-tray-entry__count.is-empty { display: none; }
}

/* The line under the thumbnail of a slot of the bar. */
.wkit-tray-slot--sub { height: var(--wc-tray-slot-height-sub); }
.wkit-tray-slot__fig { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: var(--wc-space-0-5); }
.wkit-tray-slot__fig .wkit-tray-slot__thumb { width: var(--wc-tray-thumb-width); }
.wkit-tray-slot__sub {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: var(--wc-font-size-badge);
	font-weight: var(--wc-weight-bold);
	line-height: 1.2;
	color: var(--wc-ink-strong);
}
.wkit-tray-slot--sub .wkit-tray-slot__text { display: none; }
.wkit-tray-m__list .wkit-tray-slot--sub .wkit-tray-slot__text { display: flex; }

/* Picker panel: a search box and a list that takes the person one level at a time (CX7 "+ Add product"). */
.wkit-picker {
	position: absolute;
	z-index: var(--wc-z-sticky);
	display: flex;
	flex-direction: column;
	width: var(--wc-add-panel-w);
	max-width: calc(100% - 2 * var(--wc-space-4));
	max-height: var(--wc-add-panel-max-h);
	background: var(--wc-page);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-search);
	box-shadow: var(--wc-shadow-menu);
}
.wkit-picker__top { display: flex; flex-direction: column; gap: var(--wc-space-2-5); padding: var(--wc-space-3); border-bottom: 1px solid var(--wc-border); flex: none; }
.wkit-picker__bar { display: none; }
.wkit-picker__body { overflow: auto; padding: var(--wc-space-1-5) 0; flex: 1 1 auto; }
.wkit-picker__head { display: flex; align-items: center; justify-content: space-between; gap: var(--wc-space-2); padding: var(--wc-space-2) var(--wc-space-4) var(--wc-space-1); font-size: var(--wc-font-size-badge); color: var(--wc-ink-muted); }
.wkit-picker__head strong { font-size: var(--wc-font-size-badge); font-weight: var(--wc-weight-bold); letter-spacing: var(--wc-letter-spacing-eyebrow); text-transform: uppercase; color: var(--wc-ink); }
.wkit-picker__back { display: inline-flex; align-items: center; gap: var(--wc-space-1); min-height: 36px; padding: 0 var(--wc-space-2) 0 var(--wc-space-1); border: 0; border-radius: var(--wc-radius-btn); background: transparent; color: var(--wc-brand); font: inherit; font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-bold); cursor: pointer; }
.wkit-picker__back:hover { background: var(--wc-surface-muted); }
.wkit-picker__list { list-style: none; margin: 0; padding: 0; }
.wkit-picker__opt {
	display: flex;
	align-items: center;
	gap: var(--wc-space-3);
	width: 100%;
	min-height: 56px;
	box-sizing: border-box;
	padding: var(--wc-space-2) var(--wc-space-4) var(--wc-space-2) var(--wc-space-3-5);
	border: 0;
	border-left: 3px solid transparent;
	background: transparent;
	color: var(--wc-ink-strong);
	font: inherit;
	line-height: 1.35;
	text-align: left;
	cursor: pointer;
}
.wkit-picker__opt:hover, .wkit-picker__opt.is-active, .wkit-picker__opt:focus-visible { background: var(--wc-surface-chip); border-left-color: var(--wc-brand); outline: 0; }
.wkit-picker__opt[aria-disabled="true"] { cursor: not-allowed; background: transparent; border-left-color: transparent; }
.wkit-picker__opt[aria-disabled="true"] .wkit-picker__t strong, .wkit-picker__opt[aria-disabled="true"] .wkit-picker__t span { color: var(--wc-ink-muted); }
.wkit-picker__opt[aria-disabled="true"] .wkit-picker__th { opacity: 0.55; }
.wkit-picker__th { flex: none; display: flex; align-items: center; justify-content: center; overflow: hidden; width: var(--wc-tray-thumb-width); height: var(--wc-tray-thumb-height); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-sm); background: var(--wc-page); color: var(--wc-ink-faint); }
.wkit-picker__th img { width: 100%; height: 100%; object-fit: contain; display: block; }
.wkit-picker__fi { flex: none; display: flex; align-items: center; justify-content: center; width: var(--wc-control-height); height: var(--wc-control-height); border-radius: var(--wc-radius-md); background: var(--wc-brand-tint); color: var(--wc-brand); }
.wkit-picker__t { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.wkit-picker__t strong { font-size: var(--wc-font-size-ui); font-weight: var(--wc-weight-bold); color: var(--wc-ink-strong); }
.wkit-picker__t strong mark { background: transparent; color: var(--wc-brand); text-decoration: underline; text-underline-offset: 3px; }
.wkit-picker__t span { font-size: var(--wc-font-size-small); color: var(--wc-ink); }
.wkit-picker__r { flex: none; display: flex; align-items: center; gap: var(--wc-space-2); color: var(--wc-ink); font-size: var(--wc-font-size-badge); font-weight: var(--wc-weight-semibold); }
.wkit-picker__foot { flex: none; padding: var(--wc-space-2-5) var(--wc-space-4) var(--wc-space-3); border-top: 1px solid var(--wc-border); font-size: var(--wc-font-size-badge); line-height: 1.45; color: var(--wc-ink-muted); }
.wkit-picker__foot button { padding: 0; border: 0; background: none; color: var(--wc-brand); font: inherit; font-weight: var(--wc-weight-bold); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.wkit-picker__empty { margin: 0; padding: var(--wc-space-4); font-size: var(--wc-font-size-ui); color: var(--wc-ink); }
@media (max-width: 767px) {
	.wkit-picker { position: fixed; inset: 0; z-index: var(--wc-z-dialog); width: auto; max-width: none; max-height: none; border: 0; border-radius: 0; }
	.wkit-picker__bar { display: flex; align-items: center; justify-content: space-between; height: 56px; padding: var(--wc-space-1) var(--wc-space-1) var(--wc-space-1) var(--wc-space-4); border-bottom: 1px solid var(--wc-border); flex: none; font-size: var(--wc-font-size-card-title); color: var(--wc-ink-strong); }
	.wkit-picker__top { padding: var(--wc-space-3) var(--wc-space-4); }
	.wkit-picker__opt { min-height: 60px; }
}

/* An annex of My catalog (a named block that another plugin declares): section, rows, actions. */
.wkit-annex { display: flex; flex-direction: column; gap: var(--wc-space-3); margin-bottom: var(--wc-space-8); } /* Air before the next block (the title "Families"). */
.wkit-annex__head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--wc-space-2) var(--wc-space-4); }
.wkit-annex__title { margin: 0; font-size: var(--wc-font-size-subtitle); font-weight: var(--wc-weight-bold); color: var(--wc-ink-strong); }
.wkit-annex__meta { font-size: var(--wc-font-size-small); color: var(--wc-ink-muted); }
.wkit-annex__list { border: 1px solid var(--wc-border); border-radius: var(--wc-radius-card); background: var(--wc-page); box-shadow: var(--wc-shadow-flat); }
.wkit-annex__row { display: grid; grid-template-columns: var(--wc-control-height) minmax(0, 1fr) auto; gap: var(--wc-space-3-5); align-items: start; padding: var(--wc-space-4); border-bottom: 1px solid var(--wc-border); }
.wkit-annex__row:last-child { border-bottom: 0; }
.wkit-annex__ico { display: flex; align-items: center; justify-content: center; width: var(--wc-control-height); height: var(--wc-control-height); border-radius: var(--wc-radius-md); background: var(--wc-brand-tint); color: var(--wc-brand); }
.wkit-annex__text { display: flex; flex-direction: column; gap: var(--wc-space-1-5); min-width: 0; }
.wkit-annex__name { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wc-space-2); font-size: var(--wc-font-size-body); font-weight: var(--wc-weight-bold); color: var(--wc-ink-strong); line-height: 1.35; }
.wkit-annex__codes { display: flex; flex-wrap: wrap; gap: var(--wc-space-1-5); }
.wkit-annex__codes .is-off { color: var(--wc-ink-faint); text-decoration: line-through; }
.wkit-annex__note { font-size: var(--wc-font-size-small); line-height: 1.45; color: var(--wc-ink-muted); }
.wkit-annex__note--warn { color: var(--wc-warning-ink); font-weight: var(--wc-weight-semibold); }
.wkit-annex__acts { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: var(--wc-space-1); }
.wkit-annex__row.is-dim .wkit-annex__name { color: var(--wc-ink); }
.wkit-annex__empty { padding: var(--wc-space-5); border: 1.5px dashed var(--wc-border-input); border-radius: var(--wc-radius-card); background: var(--wc-surface-muted); }
.wkit-annex__empty strong { display: block; font-size: var(--wc-font-size-body); color: var(--wc-ink-strong); }
.wkit-annex__empty p { margin: var(--wc-space-1-5) 0 var(--wc-space-3); font-size: var(--wc-font-size-small); color: var(--wc-ink); }
@media (max-width: 767px) {
	.wkit-annex__row { grid-template-columns: var(--wc-space-8) minmax(0, 1fr); padding: var(--wc-space-3-5); }
	.wkit-annex__ico { width: var(--wc-space-8); height: var(--wc-space-8); }
	.wkit-annex__acts { grid-column: 1 / -1; justify-content: flex-start; }
}
.wkit-annex__family { padding: var(--wc-space-0-5) var(--wc-space-2-5); border-radius: var(--wc-radius-pill); background: var(--wc-brand-tint); color: var(--wc-brand); font-size: var(--wc-font-size-badge); font-weight: var(--wc-weight-semibold); }
.wkit-annex__list { list-style: none; margin: 0; padding: 0; }
.wkit-slot--quotes { display: flex; flex-direction: row; align-items: center; flex-wrap: nowrap; } /* CX7: the entries of the trays and "My quotes" side by side. */
.wkit-annex__remove, .wkit-annex__remove:hover { color: var(--wc-error); }
/* The links of the dark bar are 32 px apart whether they share a place or not: the gap between places is cancelled (the links carry their own padding). */
@media (min-width: 768px) {
	.wkit-topbar-inner > .wkit-slot--quotes ~ .wkit-slot--account { margin-left: calc(-1 * var(--wc-space-6)); }
}

/* ---------- Request pop-up and Help places (K26, CX6) ---------- */
.wkit-rqp .wkit-dialog__head {
	gap: var(--wc-space-3-5);
}
.wkit-rqp-tile {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: var(--wc-radius-btn);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
}
.wkit-rqp-title {
	margin: 0;
	color: var(--wc-ink-strong);
	font-size: var(--wc-text-dialog-title-size);
	font-weight: var(--wc-text-dialog-title-weight);
	line-height: 1.3;
}
.wkit-rqp-sub {
	margin: 0;
	color: var(--wc-ink-muted);
	font-size: var(--wc-font-size-ui);
}
.wkit-rqp-as {
	display: flex;
	align-items: center;
	gap: var(--wc-space-3);
	padding: var(--wc-space-3) var(--wc-space-4);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-surface-muted);
	color: var(--wc-ink-faint);
}
.wkit-rqp-as__ini {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: var(--wc-radius-pill);
	background: var(--wc-brand-tint);
	color: var(--wc-brand);
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-bold);
}
.wkit-rqp-as__txt {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
	font-size: var(--wc-font-size-ui);
	color: var(--wc-ink);
	overflow-wrap: anywhere;
}
.wkit-rqp-as__txt strong {
	color: var(--wc-ink-strong);
}
.wkit-rqp-as__lbl {
	color: var(--wc-ink-muted);
	font-size: var(--wc-font-size-eyebrow);
	font-weight: var(--wc-weight-semibold);
	text-transform: uppercase;
}
.wkit-rqp-fields {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wc-space-5-5) var(--wc-space-4);
}
.wkit-rqp-field {
	grid-column: 1 / -1;
	margin: 0;
}
.wkit-rqp-field.is-half {
	grid-column: auto;
}
.wkit-rqp-field .wkit-label em {
	color: var(--wc-ink-muted);
	font-style: normal;
	font-weight: var(--wc-weight-regular);
}
.wkit-rqp-choices {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wc-space-2);
}
.wkit-rqp-choice {
	min-height: var(--wc-choice-height);
	padding: 0 var(--wc-space-4);
	border: 1px solid var(--wc-border-input);
	border-radius: var(--wc-radius-pill);
	background: var(--wc-page);
	color: var(--wc-ink-strong);
	font: inherit;
	font-size: var(--wc-font-size-ui);
	font-weight: var(--wc-weight-semibold);
	cursor: pointer;
}
.wkit-rqp-choice:hover {
	border-color: var(--wc-brand);
}
.wkit-rqp-choice[aria-checked="true"] {
	border-color: var(--wc-brand);
	background: var(--wc-brand);
	color: var(--wc-on-brand);
}
.wkit-rqp-choice:disabled {
	opacity: 0.6;
	cursor: default;
}
.wkit-rqp-field.is-error .wkit-rqp-choice {
	border-color: var(--wc-error);
}
.wkit-rqp-note {
	display: flex;
	align-items: center;
	gap: var(--wc-space-2);
	margin: 0;
	color: var(--wc-ink-muted);
	font-size: var(--wc-font-size-eyebrow);
}
.wkit-rqp-note svg {
	flex: none;
}
.wkit-rqp-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.wkit-rqp-alert {
	display: flex;
	gap: var(--wc-space-3);
	padding: var(--wc-space-3) var(--wc-space-4);
	border: 1px solid var(--wc-warning-line);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-warning-bg);
	color: var(--wc-warning-ink);
	font-size: var(--wc-font-size-ui);
}
.wkit-rqp-alert[hidden] {
	display: none;
}
.wkit-rqp-alert.is-error {
	border-color: var(--wc-error-line);
	background: var(--wc-error-bg);
	color: var(--wc-error-ink);
}
.wkit-rqp-alert p {
	margin: var(--wc-space-0-5) 0 0;
}
.wkit-rqp-done {
	align-items: center;
	text-align: center;
	padding-top: var(--wc-space-8);
}
.wkit-rqp-done h2 {
	margin: 0;
	color: var(--wc-ink-strong);
	font-size: var(--wc-text-dialog-title-size);
}
.wkit-rqp-done p {
	margin: 0;
}
.wkit-rqp-ok {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: var(--wc-radius-pill);
	background: var(--wc-success-bg);
	color: var(--wc-success-icon);
}
.wkit-rqp-ref {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-1);
	min-width: 200px;
	padding: var(--wc-space-3) var(--wc-space-6);
	border: 1px solid var(--wc-success-line);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-success-bg);
	color: var(--wc-success-ink);
}
.wkit-rqp-ref span {
	font-size: var(--wc-font-size-eyebrow);
	font-weight: var(--wc-weight-semibold);
	text-transform: uppercase;
}
.wkit-rqp-ref strong {
	font-size: var(--wc-font-size-screen-title);
	line-height: 1.2;
}
.wkit-rqp-link {
	color: var(--wc-brand);
	font-weight: var(--wc-weight-semibold);
}
@media (max-width: 599px) {
	.wkit-rqp-fields {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wc-space-5);
	}
	.wkit-rqp-field.is-half {
		grid-column: 1 / -1;
	}
	.wkit-rqp-choice {
		min-height: var(--wc-control-height);
	}
	.wkit-rqp-title {
		font-size: var(--wc-font-size-card-title);
	}
}

/* Buttons in the page (My requests) and in the mobile menu. */
.wkit-myreq-helpbtns {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wc-space-3);
	margin-top: var(--wc-space-4);
}
.wkit-rqp-open svg {
	color: var(--wc-brand);
}
.wkit-drawer-help {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-2);
	padding: var(--wc-space-4) var(--wc-space-5) var(--wc-space-5);
	border-top: 1px solid var(--wc-border);
}
.wkit-drawer-help__lbl {
	color: var(--wc-ink-muted);
	font-size: var(--wc-font-size-eyebrow);
	font-weight: var(--wc-weight-semibold);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.wkit-drawer-help .wkit-btn {
	justify-content: flex-start;
	min-height: 48px;
	text-align: left;
}

/* Box with an action (search with no results) and the empty family. */
.wkit-actionbox {
	display: flex;
	align-items: center;
	gap: var(--wc-space-4);
	max-width: 720px;
	margin: var(--wc-space-5) auto 0;
	padding: var(--wc-space-5) var(--wc-space-6);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	background: var(--wc-surface-muted);
}
.wkit-actionbox__tile,
.wkit-famempty__tile {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-btn);
	background: var(--wc-page);
	color: var(--wc-brand);
}
.wkit-actionbox__txt {
	flex: 1 1 auto;
	min-width: 0;
}
.wkit-actionbox__txt strong {
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-card-title);
}
.wkit-actionbox__txt p {
	margin: var(--wc-space-1) 0 0;
	font-size: var(--wc-font-size-ui);
}
.wkit-actionbox__btns {
	flex: none;
}
.wkit-famempty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wc-space-3);
	max-width: 760px;
	margin: var(--wc-space-8) auto 0;
	padding: var(--wc-space-10) var(--wc-space-12);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	text-align: center;
}
.wkit-famempty h2 {
	margin: 0;
	color: var(--wc-ink-strong);
	font-size: var(--wc-font-size-footer-heading);
}
.wkit-famempty p {
	margin: 0;
}
.wkit-famempty__btns {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--wc-space-3);
	margin-top: var(--wc-space-2);
}
@media (max-width: 599px) {
	.wkit-actionbox {
		flex-direction: column;
		align-items: stretch;
	}
	.wkit-actionbox__btns .wkit-btn,
	.wkit-myreq-helpbtns .wkit-btn,
	.wkit-famempty__btns .wkit-btn {
		width: 100%;
		min-height: 48px;
	}
	.wkit-myreq-helpbtns,
	.wkit-famempty__btns {
		flex-direction: column;
		align-items: stretch;
	}
	.wkit-famempty {
		padding: var(--wc-space-7) var(--wc-space-5);
	}
}

/* ------------------------------------------------------------------ */
/* Site map (CX3, K07 / K12): the folding tree, the filter field and the pinned bar.              */
/* ------------------------------------------------------------------ */
.wkit-sm__title { margin: var(--wc-space-4) 0 var(--wc-space-3); color: var(--wc-ink-strong); font-size: var(--wc-font-size-product-title); line-height: var(--wc-line-height-product-title); font-weight: var(--wc-weight-bold); letter-spacing: var(--wc-title-letter-spacing); }
.wkit-sm__intro { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wc-space-2); margin: 0; color: var(--wc-ink); font-size: var(--wc-font-size-ui); line-height: 1.5; }
.wkit-sm__intro svg { color: var(--wc-ink-muted); }
.wkit-sm__intro a { color: var(--wc-ink-strong); font-weight: var(--wc-weight-semibold); text-decoration: underline; text-underline-offset: 3px; }
.wkit-sm__intro a:hover { color: var(--wc-brand); }
.wkit-sm [hidden] { display: none !important; }
.wkit-sm__sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Bar: filter + Expand all / Collapse all. */
.wkit-sm__bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wc-space-3); margin-top: var(--wc-space-7); padding: var(--wc-space-3); border: 1px solid var(--wc-border); border-radius: var(--wc-radius-card); background: var(--wc-surface-muted); }
.wkit-sm__bar.is-stuck { box-shadow: var(--wc-shadow-sticky); }
.wkit-sm__flt { position: relative; flex: 0 1 440px; min-width: 0; }
.wkit-sm__flt-ic { position: absolute; top: 50%; left: var(--wc-space-3-5); transform: translateY(-50%); color: var(--wc-ink-muted); pointer-events: none; display: flex; }
.wkit-sm__input { box-sizing: border-box; width: 100%; height: var(--wc-field-height); padding: 0 48px 0 44px; border: 1px solid var(--wc-border-input); border-radius: var(--wc-radius-btn); background: var(--wc-page); color: var(--wc-ink-strong); font: inherit; font-size: var(--wc-font-size-search-input); -webkit-appearance: none; appearance: none; }
.wkit-sm__input::placeholder { color: var(--wc-ink-muted); }
.wkit-sm__input::-webkit-search-cancel-button { display: none; }
.wkit-sm__input:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 2px; border-color: var(--wc-brand); }
.wkit-sm__x { position: absolute; top: 2px; right: 2px; display: flex; align-items: center; justify-content: center; width: var(--wc-control-height); height: var(--wc-control-height); padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--wc-ink); cursor: pointer; }
.wkit-sm__x:hover { background: var(--wc-surface-chip); color: var(--wc-ink-strong); }
.wkit-sm__x:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 0; }
.wkit-sm__act { display: flex; flex: none; gap: var(--wc-space-2); }
.wkit-sm__act .wkit-btn svg { color: var(--wc-brand); }
.wkit-sm__act .wkit-btn:disabled { border-color: var(--wc-border); background: var(--wc-page); color: var(--wc-ink-faint); cursor: not-allowed; }
.wkit-sm__act .wkit-btn:disabled svg { color: var(--wc-ink-faint); }
.wkit-sm__status { margin: var(--wc-space-3) 0 0; color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); line-height: var(--wc-line-height-small); }
.wkit-sm__status b { color: var(--wc-ink-strong); font-weight: var(--wc-weight-semibold); }

/* Groups: Products wide, the rest in a side column. */
.wkit-sm__body { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--wc-space-14); align-items: start; margin-top: var(--wc-space-7); }
.wkit-sm__body--solo { grid-template-columns: minmax(0, 1fr); }
.wkit-sm__aside { display: flex; flex-direction: column; gap: var(--wc-space-10); min-width: 0; }
.wkit-sm__col { min-width: 0; }
.wkit-sm__grp { display: flex; flex-direction: column; min-width: 0; }
.wkit-sm__grp-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--wc-space-1-5) var(--wc-space-4); margin-bottom: var(--wc-space-2); }
.wkit-sm__grp-act { display: flex; gap: var(--wc-space-4); }
.wkit-sm__link { padding: var(--wc-space-1-5) 0; border: 0; background: transparent; color: var(--wc-ink-strong); font: inherit; font-size: var(--wc-font-size-small); font-weight: var(--wc-weight-semibold); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.wkit-sm__link:hover { color: var(--wc-brand); }
.wkit-sm__link:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 2px; border-radius: 4px; }
.wkit-sm__link:disabled { color: var(--wc-ink-faint); text-decoration: none; cursor: not-allowed; }
.wkit-sm__grp-h { margin: 0; color: var(--wc-ink-strong); font-size: var(--wc-font-size-subtitle); font-weight: var(--wc-weight-bold); line-height: 1.3; }

/* Tree row: arrow · link · counter · badge. */
.wkit-sm__tree, .wkit-sm__kids { margin: 0; padding: 0; list-style: none; }
.wkit-sm__tree { --tg: var(--wc-tree-toggle); border-top: 1px solid var(--wc-border); border-bottom: 1px solid var(--wc-border); }
.wkit-sm__n { margin: 0; padding: 0; }
.wkit-sm__row { display: flex; flex-wrap: wrap; align-items: center; column-gap: 4px; min-height: var(--wc-tree-row); }
.wkit-sm__lv1 > .wkit-sm__row { min-height: var(--wc-tree-row-family); }
.wkit-sm__tree > .wkit-sm__n + .wkit-sm__n { border-top: 1px solid var(--wc-border); }
.wkit-sm__kids { margin-left: calc(var(--tg) / 2); padding-left: calc(var(--wc-tree-indent) - var(--tg) / 2); border-left: 1px solid var(--wc-border); }
.wkit-sm__n--leaf > .wkit-sm__row { padding-left: calc(var(--tg) + 4px); }
.wkit-sm__n--leaf.is-page > .wkit-sm__row { padding-left: 0; }
.wkit-sm__tg { position: relative; display: inline-flex; flex: none; align-items: center; justify-content: center; width: var(--tg); height: var(--tg); padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--wc-ink); cursor: pointer; }
.wkit-sm__tg:hover { background: var(--wc-surface-chip); color: var(--wc-ink-strong); }
.wkit-sm__tg:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 0; }
.wkit-sm__tg svg { transition: transform 0.15s; }
.wkit-sm__tg[aria-expanded="true"] svg { transform: rotate(90deg); }
.wkit-sm__ic { display: flex; flex: none; align-items: center; justify-content: center; width: var(--tg); height: var(--tg); color: var(--wc-ink-muted); }
.wkit-sm__a { min-width: 0; padding: 7px 2px; border-radius: 4px; color: var(--wc-ink-strong); font-size: 15px; font-weight: var(--wc-weight-semibold); line-height: 1.4; text-decoration: none; overflow-wrap: anywhere; }
.wkit-sm__lv1 > .wkit-sm__row > .wkit-sm__a { font-size: 16px; }
.wkit-sm__a:hover { color: var(--wc-brand); text-decoration: underline; text-underline-offset: 3px; }
.wkit-sm__a:focus-visible { outline: 2px solid var(--wc-brand); outline-offset: 2px; }
.wkit-sm__n--leaf.is-product > .wkit-sm__row > .wkit-sm__a, .wkit-sm__n--leaf.is-case > .wkit-sm__row > .wkit-sm__a { padding: 6px 2px; font-weight: var(--wc-weight-regular); }
.wkit-sm__code { color: var(--wc-ink-muted); font-size: var(--wc-font-size-small); font-weight: var(--wc-weight-regular); }
.wkit-sm__cnt { display: inline-flex; flex: none; align-items: center; justify-content: center; min-width: var(--wc-counter-size); height: var(--wc-counter-size); margin-left: 4px; padding: 0 8px; border-radius: var(--wc-radius-pill); background: var(--wc-surface-chip); color: var(--wc-ink-chip); font-size: 12px; font-weight: var(--wc-weight-semibold); line-height: 1; box-sizing: border-box; }
.wkit-sm__bd { display: inline-flex; flex: none; align-items: center; margin-left: 6px; padding: 1px 10px; border-radius: var(--wc-radius-pill); background: var(--wc-border); color: var(--wc-ink-chip); font-size: 12px; font-weight: var(--wc-weight-semibold); line-height: 1.5; white-space: nowrap; }
.wkit-sm__bd--replaced { background: var(--wc-replaced-bg); color: var(--wc-replaced-icon); }
.wkit-sm__n.is-off > .wkit-sm__row > .wkit-sm__a { color: var(--wc-ink); }
.wkit-sm mark { padding: 0 1px; border-radius: 3px; background: var(--wc-brand-tint); box-shadow: inset 0 -2px 0 var(--wc-brand); color: var(--wc-ink-strong); font-weight: var(--wc-weight-bold); }

/* No matches. */
.wkit-sm__empty { display: flex; flex-direction: column; align-items: center; gap: var(--wc-space-2-5); margin-top: var(--wc-space-7); padding: 48px var(--wc-space-6) 52px; border: 1px dashed var(--wc-border-input); border-radius: var(--wc-radius-card); background: var(--wc-surface-muted); text-align: center; }
.wkit-sm__empty-ic { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; margin-bottom: var(--wc-space-1-5); border: 1px solid var(--wc-border); border-radius: 12px; background: var(--wc-page); color: var(--wc-ink-muted); }
.wkit-sm__empty-h { margin: 0; color: var(--wc-ink-strong); font-size: 20px; font-weight: var(--wc-weight-bold); line-height: 1.3; overflow-wrap: anywhere; }
.wkit-sm__empty-a { display: inline-flex; align-items: center; min-height: var(--wc-control-height); color: var(--wc-ink-strong); font-size: 15px; font-weight: var(--wc-weight-semibold); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.wkit-sm__empty-a:hover { color: var(--wc-brand); }

/* Help link in the menu of the phone. */
.wkit-drawer-help .wkit-help-link { text-decoration: none; }
.wkit-drawer-help .wkit-help-link svg { color: var(--wc-brand); }
.wkit-footer a.wkit-helpbtn, .wkit-footer a.wkit-helpbtn:hover, .wkit-footer a.wkit-helpbtn:focus-visible, .wkit-footer a.wkit-helpbtn:active { color: var(--wc-on-brand); text-decoration: none; }
a.wkit-helpbtn { box-sizing: border-box; }

@media (max-width: 1279px) {
	.wkit-sm__body { grid-template-columns: minmax(0, 1fr) 288px; gap: var(--wc-space-10); }
	.wkit-sm__body--solo { grid-template-columns: minmax(0, 1fr); }
	.wkit-sm__flt { flex-basis: 360px; }
}
@media (max-width: 959px) {
	.wkit-sm__body { grid-template-columns: minmax(0, 1fr); }
	.wkit-sm__flt { flex: 1 1 300px; }
}
@media (max-width: 767px) {
	.wkit-sm__title { font-size: var(--wc-font-size-screen-title); }
	.wkit-sm__bar { position: sticky; top: var(--wc-header-top-mobile); z-index: 20; flex-direction: column; align-items: stretch; gap: var(--wc-space-2); margin-inline: calc(-1 * var(--wc-gutter-mobile)); margin-top: var(--wc-space-5); padding: var(--wc-space-3) var(--wc-gutter-mobile); border-width: 1px 0; border-radius: 0; background: var(--wc-page); }
	.admin-bar .wkit-sm__bar { top: calc(var(--wc-header-top-mobile) + 46px); } /* The site header is pinned too (the design leaves it loose): the bar stays under it. */
	.wkit-sm__flt { flex: none; width: 100%; }
	.wkit-sm__act { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wkit-sm__act .wkit-btn { padding-inline: 10px; }
	.wkit-sm__body { gap: var(--wc-space-8); margin-top: var(--wc-space-6); }
	.wkit-sm__aside { gap: var(--wc-space-8); }
	.wkit-sm__grp-h { font-size: 18px; }
	.wkit-sm__tree { --tg: var(--wc-tree-toggle-touch); }
	.wkit-sm__row { min-height: var(--wc-tree-row-touch); }
	.wkit-sm__lv1 > .wkit-sm__row { min-height: 52px; }
	.wkit-sm__a { padding: 10px 2px; }
	.wkit-sm__n--leaf.is-product > .wkit-sm__row > .wkit-sm__a, .wkit-sm__n--leaf.is-case > .wkit-sm__row > .wkit-sm__a { padding: 10px 2px; }
	.wkit-sm__empty { margin-top: var(--wc-space-6); padding: 36px var(--wc-space-4) 40px; }
}
@media (prefers-reduced-motion: reduce) {
	.wkit-sm__tg svg { transition: none; }
}

/* ---------- Quick links (K07 · CX8): section heading, grid of 3 / 3 / 2 / 1 columns and the card of a single item ---------- */
.wkit-ql {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-8);
	padding: var(--wc-space-20) 0 var(--wc-space-26);
}
.wkit-ql--notitle {
	padding-top: var(--wc-space-16);
}
.wkit-ql--target {
	/* CX12b: where a plain #quick-links link lands (the hero link measures the header itself): the title 24 px under the sticky header. */
	scroll-margin-top: calc(var(--wc-header-top) + var(--wc-header-nav) + var(--wc-space-6) - var(--wc-space-20));
}
.wkit-ql--target:focus,
.wkit-ql-title:focus {
	outline: none;
}
.wkit-ql-head {
	display: flex;
	flex-direction: column;
	gap: var(--wc-space-2);
}
.wkit-ql-title {
	margin: 0;
	font-size: var(--wc-section-title-size);
	font-weight: var(--wc-section-title-weight);
	line-height: var(--wc-section-title-lh);
	letter-spacing: var(--wc-title-letter-spacing);
	color: var(--wc-ink-strong);
	text-wrap: balance;
}
.wkit-ql-subtitle {
	margin: 0;
	max-width: 760px;
	font-size: var(--wc-section-subtitle-size);
	line-height: var(--wc-section-subtitle-lh);
	color: var(--wc-ink);
	text-wrap: pretty;
}
.wkit-main .wkit-ql-grid,
.wkit-ql-grid {
	grid-template-columns: repeat(var(--wc-ql-columns), minmax(0, 1fr));
	gap: var(--wc-space-6);
	margin: 0;
	align-items: stretch;
}
.wkit-ql-grid .wkit-hub-title {
	font-size: var(--wc-hub-card-title-size);
	transition: color var(--wc-motion-card);
}
.wkit-ql-grid .wkit-hub-card:hover .wkit-hub-title {
	color: var(--wc-brand);
}
/* A single item: its picture takes the icon box, the mark of its type sits at the top right, the code takes the counter's place. */
.wkit-hub-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--wc-space-3);
}
.wkit-hub-thumb {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: var(--wc-hub-icon);
	height: var(--wc-hub-icon);
	overflow: hidden;
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-search);
	background: var(--wc-page);
}
.wkit-hub-thumb:empty {
	background: var(--wc-surface-muted);
}
.wkit-hub-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.wkit-hub-kind {
	flex: none;
}
.wkit-hub-code {
	padding: var(--wc-space-0-5) var(--wc-space-2);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-sm);
	background: var(--wc-surface-chip);
	font-size: var(--wc-font-size-code);
	font-weight: var(--wc-weight-semibold);
	letter-spacing: 0.02em;
	color: var(--wc-ink-strong);
	white-space: nowrap;
}
.wkit-hub-code:empty {
	display: none;
}
.wkit-hub-card--item .wkit-hub-arrow {
	margin-left: auto;
}
@media (max-width: 1279px) {
	.wkit-ql-title {
		font-size: var(--wc-section-title-size-laptop);
	}
	.wkit-main .wkit-ql-grid,
	.wkit-ql-grid {
		gap: var(--wc-space-5);
	}
}
@media (max-width: 959px) {
	.wkit-ql--target {
		scroll-margin-top: calc(var(--wc-header-top) + var(--wc-header-nav) + var(--wc-space-6) - var(--wc-space-16));
	}
	.wkit-ql {
		gap: var(--wc-space-7);
		padding: var(--wc-space-16) 0 var(--wc-space-22);
	}
	.wkit-ql--notitle {
		padding-top: var(--wc-space-12);
	}
	.wkit-main .wkit-ql-grid,
	.wkit-ql-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--wc-space-4);
	}
}
@media (max-width: 767px) {
	.wkit-ql {
		gap: var(--wc-space-5);
		padding: var(--wc-space-10) 0 var(--wc-space-14);
	}
	.wkit-ql--notitle {
		padding-top: var(--wc-space-8);
	}
	.wkit-ql-head {
		gap: var(--wc-space-1);
	}
	.wkit-ql-title {
		font-size: var(--wc-section-title-size-mobile);
	}
	.wkit-ql-subtitle {
		font-size: var(--wc-section-subtitle-size-mobile);
	}
	.wkit-main .wkit-ql-grid,
	.wkit-ql-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wc-space-3-5);
	}
	.wkit-ql-grid .wkit-hub-card {
		padding: var(--wc-space-5-5);
	}
}

/* ---------- Front banner (K33 · CX12): the announcement card inside the home hero (CX12b) ----------
 * Corner, border, shadow and motion are the ones of the hub card (K05); sizes come from the tokens --wc-banner-*.
 * Card: desktop >= 1280 336 x 360 · laptop 960-1279 300 x 320 · tablet 768-959 full width x 280 · phone < 768 full width x 220. */
.wkit-fb {
	position: relative;
	display: block;
	overflow: hidden;
	isolation: isolate;
	box-sizing: border-box;
	width: 100%;
	height: var(--wc-banner-h-xl);
	border: 1px solid var(--wc-border);
	border-radius: var(--wc-radius-card);
	box-shadow: var(--wc-shadow-card);
	background: var(--wc-hero-ground, #1f2a22);
	color: var(--wc-on-brand);
	text-decoration: none;
	transition: transform var(--wc-motion-card), border-color var(--wc-motion-card), box-shadow var(--wc-motion-card);
}
.wkit-fb *,
.wkit-fb *::before,
.wkit-fb *::after {
	box-sizing: border-box;
}
.wkit-fb:hover,
.wkit-fb.is-hover {
	transform: translateY(var(--wc-card-lift));
	border-color: var(--wc-brand);
	box-shadow: var(--wc-shadow-card-hover);
	color: var(--wc-on-brand);
}
.wkit-fb:focus-visible,
.wkit-fb.is-focus {
	outline: 2px solid var(--wc-brand);
	outline-offset: 2px;
	box-shadow: 0 0 0 4px var(--wc-on-brand), var(--wc-shadow-card); /* the white ring of the dark bars: the green line alone does not show on the dark hero */
}
.wkit-fb__img {
	position: absolute;
	inset: 0;
	z-index: -2;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	max-width: none;
}
.wkit-fb__noimg {
	position: absolute;
	inset: 0;
	z-index: -2;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	padding: 14px 18px;
	background: repeating-linear-gradient(135deg, #334155 0 10px, #3b4a5e 10px 20px);
	color: var(--wc-border-input);
	font-size: 12px;
	font-weight: var(--wc-weight-bold);
	letter-spacing: 0.04em;
}
.wkit-fb__scrim {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--wc-banner-scrim);
	pointer-events: none;
}
.wkit-fb__txt {
	position: absolute;
	left: var(--wc-space-6);
	right: var(--wc-space-6);
	bottom: var(--wc-space-6);
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.wkit-fb__eyebrow {
	overflow: hidden;
	font-size: 12px;
	font-weight: var(--wc-weight-semibold);
	line-height: 1.3;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wc-on-brand);
	white-space: nowrap;
	text-overflow: ellipsis;
}
.wkit-fb__eyebrow[hidden] {
	display: none;
}
.wkit-fb__title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	line-clamp: 4;
	overflow: hidden;
	font-size: 22px;
	font-weight: var(--wc-weight-bold);
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--wc-on-brand);
	text-wrap: balance;
}
.wkit-fb__title.is-missing {
	font-style: italic;
	font-weight: var(--wc-weight-semibold);
	opacity: 0.8;
}
.wkit-fb__go {
	position: absolute;
	top: var(--wc-space-5);
	right: var(--wc-space-5);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: var(--wc-radius-pill);
	background: var(--wc-page);
	color: var(--wc-brand);
	transition: transform var(--wc-motion-card);
}
.wkit-fb__go svg {
	display: block;
}
.wkit-fb:hover .wkit-fb__go,
.wkit-fb.is-hover .wkit-fb__go {
	transform: translateX(4px);
}
@media (prefers-reduced-motion: reduce) {
	.wkit-fb,
	.wkit-fb__go {
		transition: none;
	}
	.wkit-fb:hover,
	.wkit-fb.is-hover,
	.wkit-fb:hover .wkit-fb__go,
	.wkit-fb.is-hover .wkit-fb__go {
		transform: none;
	}
}
@media (max-width: 1279px) {
	.wkit-fb {
		height: var(--wc-banner-h-lg);
	}
	.wkit-fb__txt {
		left: var(--wc-space-5);
		right: var(--wc-space-5);
		bottom: var(--wc-space-5);
	}
	.wkit-fb__title {
		font-size: 20px;
	}
	.wkit-fb__go {
		top: var(--wc-space-4);
		right: var(--wc-space-4);
	}
}
@media (max-width: 959px) {
	.wkit-fb {
		height: var(--wc-banner-h-md);
	}
	.wkit-fb__scrim {
		background: var(--wc-banner-scrim-tall);
	}
	.wkit-fb__txt {
		left: var(--wc-space-6);
		right: var(--wc-space-6);
		bottom: var(--wc-space-6);
		max-width: 600px;
	}
	.wkit-fb__title {
		font-size: 22px;
		-webkit-line-clamp: 2;
		line-clamp: 2;
	}
	.wkit-fb__go {
		top: var(--wc-space-5);
		right: var(--wc-space-5);
	}
}
@media (max-width: 767px) {
	.wkit-fb {
		height: var(--wc-banner-h-sm);
	}
	.wkit-fb__txt {
		left: var(--wc-space-5);
		right: var(--wc-space-5);
		bottom: var(--wc-space-5);
		max-width: none;
	}
	.wkit-fb__eyebrow {
		font-size: 11px;
	}
	.wkit-fb__title {
		font-size: 18px;
		line-height: 1.25;
		-webkit-line-clamp: 3;
		line-clamp: 3;
	}
	.wkit-fb__go {
		top: var(--wc-space-4);
		right: var(--wc-space-4);
	}
}
/* Fixed sizes (admin preview and /design-system/); after the media queries so they win. */
.wkit-fb.is-xl { width: var(--wc-banner-w-xl); height: var(--wc-banner-h-xl); }
.wkit-fb.is-xl .wkit-fb__scrim { background: var(--wc-banner-scrim); }
.wkit-fb.is-xl .wkit-fb__txt { left: var(--wc-space-6); right: var(--wc-space-6); bottom: var(--wc-space-6); max-width: none; }
.wkit-fb.is-xl .wkit-fb__eyebrow { font-size: 12px; }
.wkit-fb.is-xl .wkit-fb__title { font-size: 22px; line-height: 1.2; -webkit-line-clamp: 4; line-clamp: 4; }
.wkit-fb.is-xl .wkit-fb__go { top: var(--wc-space-5); right: var(--wc-space-5); }
.wkit-fb.is-lg { width: var(--wc-banner-w-lg); height: var(--wc-banner-h-lg); }
.wkit-fb.is-lg .wkit-fb__scrim { background: var(--wc-banner-scrim); }
.wkit-fb.is-lg .wkit-fb__txt { left: var(--wc-space-5); right: var(--wc-space-5); bottom: var(--wc-space-5); max-width: none; }
.wkit-fb.is-lg .wkit-fb__eyebrow { font-size: 12px; }
.wkit-fb.is-lg .wkit-fb__title { font-size: 20px; line-height: 1.2; -webkit-line-clamp: 4; line-clamp: 4; }
.wkit-fb.is-lg .wkit-fb__go { top: var(--wc-space-4); right: var(--wc-space-4); }
.wkit-fb.is-md { width: 704px; height: var(--wc-banner-h-md); }
.wkit-fb.is-md .wkit-fb__scrim { background: var(--wc-banner-scrim-tall); }
.wkit-fb.is-md .wkit-fb__txt { left: var(--wc-space-6); right: var(--wc-space-6); bottom: var(--wc-space-6); max-width: 600px; }
.wkit-fb.is-md .wkit-fb__eyebrow { font-size: 12px; }
.wkit-fb.is-md .wkit-fb__title { font-size: 22px; line-height: 1.2; -webkit-line-clamp: 2; line-clamp: 2; }
.wkit-fb.is-md .wkit-fb__go { top: var(--wc-space-5); right: var(--wc-space-5); }
.wkit-fb.is-sm { width: 358px; height: var(--wc-banner-h-sm); }
.wkit-fb.is-sm .wkit-fb__scrim { background: var(--wc-banner-scrim-tall); }
.wkit-fb.is-sm .wkit-fb__txt { left: var(--wc-space-5); right: var(--wc-space-5); bottom: var(--wc-space-5); max-width: none; }
.wkit-fb.is-sm .wkit-fb__eyebrow { font-size: 11px; }
.wkit-fb.is-sm .wkit-fb__title { font-size: 18px; line-height: 1.25; -webkit-line-clamp: 3; line-clamp: 3; }
.wkit-fb.is-sm .wkit-fb__go { top: var(--wc-space-4); right: var(--wc-space-4); }
/* END Front banner (K33) */
