/* Residual CSS only — prefer theme.json + block attributes.
   Keep this file for sticky chrome, shortcode wrappers, and nav CTAs
   that core blocks cannot express. */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	font-size: 16px;
	/* Sticky header (~5rem) + air; keeps #anchor jumps below the header. Site-wide. */
	scroll-padding-top: calc(5rem + 0.75rem + 0.9375rem + var(--wp-admin--admin-bar--position-offset, 0px));
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	display: flex;
	flex-direction: column;
	margin: 0;
	min-height: 100vh;
}

body > .wp-site-blocks {
	display: flex;
	flex: 1 0 auto;
	flex-direction: column;
	min-height: 100vh;
}

main,
.wp-site-blocks > main,
.wp-block-group.wsft-main {
	flex: 1 0 auto;
}

img {
	height: auto;
	max-width: 100%;
}

/* Classic theme: body is 300; bold needs an explicit weight. */
b,
strong {
	font-weight: 700;
}

/*
 * Default page / product / article titles — KB single, default Pages
 * template (.wsft-page-title), integrations, features, blog. Home + page-no-title
 * marketing headers (Pricing, etc.) keep their own title chrome.
 */
.wsft-knowledgebase-title h1,
.wsft-page-title .wp-block-post-title,
.wsft-integration-hero__title,
.wsft-feature-hero__title,
.single-post .wp-block-post-title {
	color: var(--wp--preset--color--black);
	font-size: 3rem;
	font-weight: 300;
	line-height: 1.25;
}

/* Category / search heading under section title pattern (KB + Form Template Library). */
.tax-knowledgebase_category .wp-block-query-title,
.wsft-kb-category__title,
.wsft-kb-search__title,
.tax-template_category .wp-block-query-title,
.wsft-templates-archive__title {
	color: var(--wp--preset--color--black);
	font-size: 2rem;
	font-weight: 300;
	line-height: 1.3;
	margin: 0 0 1.25rem;
}

/*
 * Heading links inherit the heading color (home feature tiles, etc.).
 * Theme `elements.link` is logo-blue and would otherwise paint whole headings.
 */
:is(.entry-content, .wp-block-post-content)
	:is(h1, h2, h3, h4, h5, h6)
	a:not(.wp-block-button__link):not(.wp-element-button) {
	color: inherit;
	font-weight: inherit;
	text-decoration: none;
}

/*
 * Prose headings — KB / integration / feature / blog article bodies, plus
 * default-template doc pages (e.g. Readmes). Exclude .home; marketing pages
 * on page-no-title (Pricing, etc.) keep theme.json + block heading styles.
 */
:is(
		.single-knowledgebase,
		.single-integration,
		.single-feature,
		.single-post,
		.page-template-default:not(.home)
	)
	:is(.entry-content, .wp-block-post-content)
	:is(h2, h3, h4, h5, h6) {
	color: var(--wp--preset--color--black);
	font-weight: 300;
	line-height: 1.3;
}

:is(
		.single-knowledgebase,
		.single-integration,
		.single-feature,
		.single-post,
		.page-template-default:not(.home)
	)
	:is(.entry-content, .wp-block-post-content)
	h2 {
	font-size: 2rem;
	margin: 2.25rem 0 0.875rem;
}

:is(
		.single-knowledgebase,
		.single-integration,
		.single-feature,
		.single-post,
		.page-template-default:not(.home)
	)
	:is(.entry-content, .wp-block-post-content)
	h3 {
	font-size: 1.6rem;
	margin: 1.75rem 0 0.75rem;
}

:is(
		.single-knowledgebase,
		.single-integration,
		.single-feature,
		.single-post,
		.page-template-default:not(.home)
	)
	:is(.entry-content, .wp-block-post-content)
	h4 {
	font-size: 1.4rem;
	margin: 1.5rem 0 0.625rem;
}

:is(
		.single-knowledgebase,
		.single-integration,
		.single-feature,
		.single-post,
		.page-template-default:not(.home)
	)
	:is(.entry-content, .wp-block-post-content)
	h5 {
	font-size: 1rem;
	margin: 1.25rem 0 0.5rem;
}

:is(
		.single-knowledgebase,
		.single-integration,
		.single-feature,
		.single-post,
		.page-template-default:not(.home)
	)
	:is(.entry-content, .wp-block-post-content)
	h6 {
	font-size: 0.9375rem;
	margin: 1.25rem 0 0.5rem;
}

:is(
		.single-knowledgebase,
		.single-integration,
		.single-feature,
		.single-post,
		.page-template-default:not(.home)
	)
	:is(.entry-content, .wp-block-post-content)
	> :is(h2, h3, h4, h5, h6):first-child {
	margin-top: 0;
}

/*
 * Prose links — Logo Blue + underline (a11y). Not buttons, cards, tabs, chrome.
 * (A blanket `.entry-content a` rule out-specifies component `text-decoration: none`.)
 */
.entry-content :is(p, li, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button),
.wp-block-post-content :is(p, li, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button),
.wsft-hooks a,
.wsft-php-functions a {
	color: var(--wp--preset--color--logo-blue);
	font-weight: 300;
	text-decoration: underline;
}

.entry-content :is(p, li, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):hover,
.entry-content :is(p, li, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):focus,
.wp-block-post-content :is(p, li, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):hover,
.wp-block-post-content :is(p, li, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):focus,
.wsft-hooks a:hover,
.wsft-hooks a:focus,
.wsft-php-functions a:hover,
.wsft-php-functions a:focus {
	color: var(--wp--preset--color--accent-blue);
}

/*
 * Home reviews + features — beat prose-link underline/color.
 * Prose rule specificity is high (li + three :not(.class)); match that chain.
 */
body.home :is(.entry-content, .wp-block-post-content) :is(.wsft-features, .wsft-reviews, .wsft-review) :is(p, li, cite, footer, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button),
body.home :is(.entry-content, .wp-block-post-content) :is(.wsft-features, .wsft-reviews, .wsft-review) :is(p, li, cite, footer, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):hover,
body.home :is(.entry-content, .wp-block-post-content) :is(.wsft-features, .wsft-reviews, .wsft-review) :is(p, li, cite, footer, td, th, figcaption, .wp-block-paragraph, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):focus {
	text-decoration: none;
}

/*
 * Pricing Features & Integrations — component chrome, not prose.
 * style.css loads after block CSS; beat equal-specificity prose li a underline.
 */
:is(.entry-content, .wp-block-post-content) .wsft-download-features li.wsft-download-features__item a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button),
:is(.entry-content, .wp-block-post-content) .wsft-download-features li.wsft-download-features__item a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):hover,
:is(.entry-content, .wp-block-post-content) .wsft-download-features li.wsft-download-features__item a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):focus {
	color: inherit;
	font-weight: inherit;
	text-decoration: none;
}

:is(.entry-content, .wp-block-post-content) .wsft-download-features li.wsft-download-features__item a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):hover,
:is(.entry-content, .wp-block-post-content) .wsft-download-features li.wsft-download-features__item a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):focus {
	color: var(--wp--preset--color--accent-blue);
}

/*
 * Integrations interactive — list chrome, not prose.
 * Beat entry-content li a underline/color (style.css loads after block CSS).
 */
:is(.entry-content, .wp-block-post-content) .wsft-int-interactive li.wsft-int-item a.wsft-int-item__link:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button),
:is(.entry-content, .wp-block-post-content) .wsft-int-interactive li.wsft-int-item a.wsft-int-item__link:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):hover,
:is(.entry-content, .wp-block-post-content) .wsft-int-interactive li.wsft-int-item a.wsft-int-item__link:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):focus {
	color: inherit;
	font-weight: inherit;
	text-decoration: none;
}

body.home :is(.entry-content, .wp-block-post-content) .wsft-features :is(p, li, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button),
body.home :is(.entry-content, .wp-block-post-content) .wsft-features :is(p, li, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):hover,
body.home :is(.entry-content, .wp-block-post-content) .wsft-features :is(p, li, .wp-block-list-item) a:not(.wp-block-button__link):not(.wp-element-button):not(.wsft-button):focus {
	color: var(--wp--preset--color--white);
	text-decoration: none;
}

/*
 * Content lists — classic .entry-content (wsform.old.theme/style.css).
 * Top margin separates lists from the preceding paragraph/heading (classic
 * relied on p { margin-bottom: 20px } + browser ul/ol defaults; block content
 * often has no paragraph bottom margin, so lists need their own top space).
 */
.entry-content ul,
.entry-content ol,
.wp-block-post-content ul,
.wp-block-post-content ol {
	margin: 1.25rem 0; /* 20px */
	padding-left: 1.25rem; /* 20px */
}

.entry-content ol ol,
.entry-content ul ul,
.entry-content ol ul,
.entry-content ul ol,
.wp-block-post-content ol ol,
.wp-block-post-content ul ul,
.wp-block-post-content ol ul,
.wp-block-post-content ul ol {
	margin-top: 0;
	margin-bottom: 0;
}

.entry-content li,
.wp-block-post-content li {
	margin-bottom: 0.9375rem; /* 15px */
}

.entry-content li > ul,
.entry-content li > ol,
.wp-block-post-content li > ul,
.wp-block-post-content li > ol {
	font-size: 1rem;
	margin-top: 0.9375rem; /* 15px */
	margin-bottom: 0;
}

/*
 * Images — classic aligncenter (block + centered + vertical spacing).
 * Content images sit on their own line like the old editor “Align center”.
 */
.wp-block-image {
	display: block;
	margin: 1.25rem auto;
	text-align: center;
}

.wp-block-image img {
	display: block;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
}

.aligncenter {
	display: block;
	height: auto;
	margin: 2rem auto;
	max-width: 100%;
}

.alignleft,
.alignright {
	display: block;
	height: auto;
	margin-bottom: 1.25rem;
	max-width: 100%;
}

.wp-block-image.alignleft,
.wp-block-image.alignright {
	text-align: left;
}

.wp-block-image.alignleft img,
.alignleft {
	margin-left: 0;
	margin-right: auto;
}

.wp-block-image.alignright img,
.alignright {
	margin-left: auto;
	margin-right: 0;
}

@media (min-width: 34rem) {
	.wp-block-image.alignleft,
	.alignleft {
		float: left;
		margin-right: 1.25rem;
	}

	.wp-block-image.alignright,
	.alignright {
		float: right;
		margin-left: 1.25rem;
	}
}

::selection {
	background-color: var(--wp--preset--color--logo-blue);
	color: var(--wp--preset--color--white);
	text-shadow: none;
}

/*
 * Sticky header — Position: Sticky is set on the Group in parts/header.html.
 * Core only sticks that Group inside the short template-part wrapper, so lift
 * sticky to <header> when it contains the sticky group (block settings alone
 * cannot target the template-part wrapper).
 *
 * Do not put margin-bottom on the sticky header/group: that margin stays in the
 * sticky stacking context and blocks clicks on content that scrolls underneath.
 * Spacing below the header lives on main instead.
 */
header.wp-block-template-part:has(> .is-position-sticky) {
	position: sticky;
	top: calc(0px + var(--wp-admin--admin-bar--position-offset, 0px));
	width: 100%;
	z-index: 10000;
}

/* Was header margin-bottom: 3rem — kept off the sticky element (see above). */
.wp-site-blocks > main {
	margin-top: 3rem !important;
}

/* Core Navigation overlay switches at 600px — keep mobile UI through 949px */
@media (min-width: 600px) and (max-width: 949px) {
	header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

@media (max-width: 949px) {
	.wsft-header-inner > .wp-block-buttons {
		display: none;
	}

	/*
	 * Menu open control — match overlay close (logo-blue block, white icon,
	 * top-right). Classic used the same treatment for .navigation-toggle.
	 * Nav is position:static so the button can pin to the sticky header edge.
	 */
	header .wp-block-navigation {
		position: static;
	}

	header .wp-block-navigation__responsive-container-open {
		align-items: center;
		background-color: var(--wp--preset--color--logo-blue);
		border: none;
		border-radius: 0;
		box-sizing: border-box;
		color: var(--wp--preset--color--white);
		cursor: pointer;
		display: flex;
		flex-shrink: 0;
		height: 6rem;
		justify-content: center;
		line-height: 1;
		margin: 0;
		padding: 0;
		position: absolute;
		right: 0;
		top: 0;
		width: 6rem;
		z-index: 2;
	}

	header .wp-block-navigation__responsive-container-open svg {
		display: block;
		fill: currentColor;
	}

	/*
	 * Core applies overlay-menu__fade-in-animation (opacity + translateY 0.5em)
	 * on .is-menu-open — makes the fixed 6rem close control jump. Keep open instant.
	 */
	header .wp-block-navigation__responsive-container.is-menu-open {
		animation: none;
	}

	/* Overlay top bar — same chrome as sticky header (logo + 6rem control + shadow). */
	.wsft-navigation-overlay__bar {
		position: relative;
		z-index: 1;
	}

	/*
	 * Keep header / overlay logos pixel-aligned. Global .wp-block-image uses
	 * 1.25rem vertical margins + core flex-grow:1; reset chrome logos fully.
	 */
	.wsft-header-inner .wp-block-image,
	.wsft-header-inner .wp-block-image a {
		border: 0;
		display: block;
		flex-grow: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		text-align: left;
	}

	.wsft-header-inner .wp-block-image img {
		display: block;
		line-height: 0;
		margin: 0;
		padding: 0;
		vertical-align: top;
	}

	.wsft-navigation-overlay .wsft-navigation-overlay-close {
		align-items: center;
		border: none;
		border-radius: 0;
		box-sizing: border-box;
		cursor: pointer;
		display: flex;
		flex-shrink: 0;
		height: 6rem;
		justify-content: center;
		line-height: 1;
		margin: 0;
		padding: 0;
		position: absolute;
		right: 0;
		top: 0;
		width: 6rem;
		z-index: 2;
	}

	.wsft-navigation-overlay .wsft-navigation-overlay-close svg {
		display: block;
		fill: currentColor;
	}

	/*
	 * Mobile overlay links — WCAG 2.5.5 / common mobile guidance: ≥44×44px
	 * targets (2.75rem). Type at least 1.25rem for comfortable reading.
	 */
	.wsft-navigation-overlay .wsft-navigation-overlay-menu {
		width: 100%;
	}

	.wsft-navigation-overlay .wsft-navigation-overlay-menu .wp-block-navigation-item {
		width: 100%;
	}

	.wsft-navigation-overlay .wsft-navigation-overlay-menu .wp-block-navigation-item__content {
		align-items: center;
		box-sizing: border-box;
		display: flex;
		font-size: 1.25rem;
		font-weight: 300;
		line-height: 1.4;
		min-height: 2.75rem;
		padding: 0.75rem 0;
		width: 100%;
	}

	.wsft-navigation-overlay .wsft-navigation-overlay-menu .wp-block-navigation-submenu__toggle,
	.wsft-navigation-overlay .wsft-navigation-overlay-menu .wp-block-navigation__submenu-icon {
		align-items: center;
		box-sizing: border-box;
		display: inline-flex;
		flex-shrink: 0;
		justify-content: center;
		min-height: 2.75rem;
		min-width: 2.75rem;
	}

	.wsft-navigation-overlay .wp-block-navigation__submenu-container {
		box-shadow: none;
		min-width: 0;
		padding-left: 1.25rem;
		position: static;
	}

	.wsft-navigation-overlay .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		font-size: 1.125rem;
		min-height: 2.75rem;
	}
}

/*
 * Button system — .wsft-button* + core is-style-primary|secondary|outline aliases.
 * Secondary = header My Account. Outline = on-dark (white border/text).
 */
.wsft-button,
.wp-block-button.is-style-primary .wp-block-button__link,
.wp-block-button.is-style-secondary .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
	border-radius: var(--wp--custom--border-radius);
	border-style: solid;
	border-width: 1px;
	box-sizing: border-box;
	display: inline-block;
	font-weight: 300;
	line-height: 1.4;
	padding: 0.5rem 1.25rem 0.625rem;
	text-decoration: none;
	transition: background-color var(--wp--custom--transition), border-color var(--wp--custom--transition), color var(--wp--custom--transition);
}

.wsft-button-primary,
.wp-block-button.is-style-primary .wp-block-button__link {
	background-color: var(--wp--preset--color--logo-blue);
	border-color: var(--wp--preset--color--logo-blue);
	color: var(--wp--preset--color--white);
}

.wsft-button-primary:hover,
.wsft-button-primary:focus,
.wp-block-button.is-style-primary .wp-block-button__link:hover,
.wp-block-button.is-style-primary .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--accent-blue);
	border-color: var(--wp--preset--color--accent-blue);
	color: var(--wp--preset--color--white);
}

.wsft-button-secondary,
.wp-block-button.is-style-secondary .wp-block-button__link {
	background-color: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--text-lighter);
	color: var(--wp--preset--color--text-dark);
}

.wsft-button-secondary:hover,
.wsft-button-secondary:focus,
.wp-block-button.is-style-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-secondary .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--soft-gray);
	border-color: var(--wp--preset--color--border);
	color: var(--wp--preset--color--text-dark);
}

/* On-dark / blue bands — white outline. */
.wsft-button-outline,
.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	border-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--white);
}

.wsft-button-outline:hover,
.wsft-button-outline:focus,
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--logo-blue);
}

.wsft-button-large,
.wp-block-button .wp-block-button__link.has-nav-button-font-size {
	font-size: var(--wp--preset--font-size--nav-button);
	padding: 0.5rem 1.25rem 0.625rem;
}

.wsft-button-small {
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.2;
	min-height: 1.75rem;
	padding: 0.25rem 0.75rem;
}

/* 404 search chrome: blocks/shared/search.css (enqueued on is_404). */

/*
 * Style Guide page — content heading scale specimen (page-no-title).
 * Home / Pricing / Checkout are excluded elsewhere; this page opts in.
 */
.wsft-style-guide h1 {
	color: var(--wp--preset--color--black);
	font-size: 3rem;
	font-weight: 300;
	line-height: 1.25;
}

.wsft-style-guide h2 {
	color: var(--wp--preset--color--black);
	font-size: 2rem;
	font-weight: 300;
	line-height: 1.3;
}

.wsft-style-guide h3 {
	color: var(--wp--preset--color--black);
	font-size: 1.6rem;
	font-weight: 300;
	line-height: 1.3;
}

.wsft-style-guide h4 {
	color: var(--wp--preset--color--black);
	font-size: 1.4rem;
	font-weight: 300;
	line-height: 1.3;
}

/* Footer — match classic #footer list spacing */
.wsft-footer .wsft-footer-list {
	list-style: none;
}

.wsft-footer .wsft-footer-list li + li {
	margin-top: 5px;
}

@media (max-width: 800px) {
	.wsft-footer .wsft-footer-list li {
		margin-bottom: 15px;
	}
}

/*
 * WP global styles emit:
 *   :where(.wp-site-blocks) > * { margin-block-start: 24px; … }
 * That is the root blockGap between header / main / footer.
 * .wp-site-blocks is display:flex here, so margins do not collapse — the
 * 24px stacks on top of main margin-top / content→footer spacing.
 * Spacing between those regions is owned by theme CSS / block attributes;
 * kill the root gap for every top-level child (not only footer).
 */
.wp-site-blocks > * {
	margin-block-start: 0;
}

.wsft-footer {
	margin-top: 0;
}

/*
 * Tables — classic `table small responsive [fixed]` baked in as the default.
 * Preferred opt-in: .wsft-table / .wsft-table-small / .wsft-table-fixed (aliases).
 * Source: wsform.old.theme/style.css (.table / .small / .responsive / .fixed).
 */
table,
.wsft-table {
	border-collapse: collapse;
	border-spacing: 0;
}

table caption,
table th,
.wsft-table caption,
.wsft-table th {
	text-align: left;
}

/* .table / .wsft-table */
table,
.wsft-table,
.wp-block-table table,
table.edd-table,
table#edd_subscription_receipt,
table#edd_user_history {
	margin-bottom: 1.25rem; /* 20px */
	width: 100%;
}

.wp-block-table {
	margin: 0 0 1.25rem;
	width: 100%;
}

.single-knowledgebase :is(.entry-content, .wp-block-post-content) .wp-block-table {
	margin-top: 1.25rem;
}

.wp-block-table table {
	margin-bottom: 0;
}

/* .fixed / .wsft-table-fixed — only when present */
table.has-fixed-layout,
table.fixed,
.wsft-table-fixed,
.wp-block-table table.has-fixed-layout {
	table-layout: fixed;
}

/* Kill WordPress core cell borders so only classic horizontal rules remain */
.wp-block-table table,
.wp-block-table thead,
.wp-block-table tbody,
.wp-block-table tfoot,
.wp-block-table tr,
.wp-block-table th,
.wp-block-table td {
	border: none;
}

/* Base .table / .wsft-table caption / thead (then .small sizes override below) */
table > caption,
table > thead > tr > th,
.wsft-table > caption,
.wsft-table > thead > tr > th,
.wp-block-table table > caption,
.wp-block-table table > thead > tr > th {
	color: var(--wp--preset--color--text-light);
	font-size: 1.125rem; /* 18px */
	font-weight: 400;
	padding: 0.625rem; /* 10px */
	vertical-align: top;
}

table > tbody > tr,
.wsft-table > tbody > tr {
	transition: background-color 200ms ease-in-out;
}

table > tbody > tr > th,
.wsft-table > tbody > tr > th,
.wp-block-table table > tbody > tr > th {
	color: var(--wp--preset--color--text-light);
	font-size: 1.125rem;
	font-weight: 400;
	padding: 0.625rem;
	vertical-align: top;
}

table > tbody > tr > td,
.wsft-table > tbody > tr > td,
.wp-block-table table > tbody > tr > td {
	border-top: 1px solid var(--wp--preset--color--border);
	padding: 0.625rem;
	vertical-align: top;
}

table > tfoot > tr > th,
.wsft-table > tfoot > tr > th,
.wp-block-table table > tfoot > tr > th {
	font-size: 1.125rem;
	font-weight: 400;
	padding: 0.625rem;
	vertical-align: top;
}

/*
 * .small / .wsft-table-small — default for KB / blog content tables
 * (classic: table.table.small … font-size 14px; padding 8.5px)
 */
table > caption,
table > thead > tr > th,
table > tbody > tr > th,
table > tbody > tr > td,
table > tfoot > tr > th,
.wsft-table > caption,
.wsft-table > thead > tr > th,
.wsft-table > tbody > tr > th,
.wsft-table > tbody > tr > td,
.wsft-table > tfoot > tr > th,
.wsft-table-small > caption,
.wsft-table-small > thead > tr > th,
.wsft-table-small > tbody > tr > th,
.wsft-table-small > tbody > tr > td,
.wsft-table-small > tfoot > tr > th,
.wp-block-table table > caption,
.wp-block-table table > thead > tr > th,
.wp-block-table table > tbody > tr > th,
.wp-block-table table > tbody > tr > td,
.wp-block-table table > tfoot > tr > th {
	font-size: 0.875rem; /* 14px */
	padding: 0.53125rem; /* 8.5px */
}

/*
 * Demo form dashed frame — classic .wsft-form.wsft-demo
 * (wsform.old.theme/style.css). Covers:
 * - Shortcode forms with custom class wsft-demo on the form
 * - ws-form/demo block wrapper (.wsft-demo form)
 */
.wsft-form.wsft-demo,
.wsft-demo form {
	border: 2px dashed var(--wp--preset--color--text-lighter);
	margin-bottom: 1.25rem; /* 20px */
	padding: 1.25rem 1.25rem 0; /* 20px 20px 0 */
}

/* Enlighter — classic used 16px; 1em matches surrounding text.
 * Plugin defaults to margin-bottom: 20px; use top spacing instead. */
.enlighter-default {
	font-size: 1em !important;
	margin: 1.25rem 0 0 !important; /* 20px top */
}

/*
 * Inline code — classic theme (wsform.old.theme/style.css):
 * background var(--wp--preset--color--soft-gray), font-size 16px (= body, no shrink), padding 2.5px 5px.
 * Use 1em so code matches surrounding text (including table.small cells).
 * System mono stack (no Source Code Pro webfont).
 */
code,
kbd,
samp {
	background-color: var(--wp--preset--color--soft-gray);
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	font-size: 1em;
	padding: 0.15625rem 0.3125rem; /* 2.5px 5px */
}

pre {
	background-color: var(--wp--preset--color--soft-gray);
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	font-size: 1em;
	margin: 0 0 1.25rem;
	overflow: auto;
	padding: 0.15625rem 0.3125rem;
}

pre > code {
	padding: 0;
}

/* Optional table modifiers (legacy class names still appear in content) */
table.large > thead > tr > th,
table.large > tbody > tr > th,
table.large > tbody > tr > td {
	font-size: 1.25rem; /* 20px */
	padding: 0.78125rem; /* 12.5px */
}

table.bordered {
	border: 1px solid var(--wp--preset--color--text-lighter);
}

table.bordered > caption,
table.bordered > thead > tr > th,
table.bordered > tbody > tr td {
	border: 1px solid var(--wp--preset--color--text-lighter);
}

table.striped > tbody > tr:nth-child(odd) {
	background-color: var(--wp--preset--color--background-light);
}

table.hover > tbody > tr:not(.table-row-hidden):hover {
	background-color: color-mix(in srgb, var(--wp--preset--color--logo-blue) 25%, transparent);
}

/* Demo request page — sticky form column. */
.wsft-demo-sidebar {
	position: sticky;
	top: calc(9.375rem + var(--wp-admin--admin-bar--position-offset, 0px)); /* 150px + admin bar */
	align-self: flex-start;
}

@media (max-width: 781px) {
	.wsft-demo-sidebar {
		position: static;
		top: auto;
	}
}

/* .responsive — classic @media (max-width: 767px) */
@media (max-width: 767px) {
	table > thead,
	.wp-block-table table > thead {
		display: none;
	}

	table > tbody,
	.wp-block-table table > tbody {
		display: block;
	}

	table > tbody > tr:not(.table-row-hidden),
	.wp-block-table table > tbody > tr:not(.table-row-hidden) {
		border-top: 1px solid var(--wp--preset--color--text-lighter);
		display: block;
		padding: 0.625rem; /* 10px */
	}

	table > tbody > tr:not(.table-row-hidden) > th,
	table > tbody > tr:not(.table-row-hidden) > td,
	.wp-block-table table > tbody > tr:not(.table-row-hidden) > th,
	.wp-block-table table > tbody > tr:not(.table-row-hidden) > td {
		border-top: none;
		display: block;
		padding: 0;
		width: 100%;
	}

	table > tbody > tr:not(.table-row-hidden) > td + td,
	.wp-block-table table > tbody > tr:not(.table-row-hidden) > td + td {
		margin-top: 0.3125rem; /* 5px */
	}
}