/**
 * Kadence Canvas — scoped reset + Kadence block defaults inside .kadence-canvas.
 * Header/footer stay on Tekglide theme; only main content is isolated.
 */

/* Fallback tokens when tokens.css fails to load in editor iframe. */
body.sb-kadence-canvas-page .kadence-canvas,
.editor-styles-wrapper {
	--sb-font: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--sb-heading: #555555;
	--sb-body: #333333;
	--sb-ink: #555555;
	--sb-orange: #ff9300;
	--sb-orange-hov: #eb7c09;
	--sb-blue: #396797;
	--sb-blue-pill: #45aaf8;
	--sb-white: #ffffff;
	--sb-text: 18px;
	--sb-h1: 52px;
	--sb-h1-sm: 34px;
	--sb-h2: 40px;
	--sb-h2-sm: 27px;
	--sb-h3: 24px;
	--sb-h3-sm: 21px;
	--sb-lead: 21px;
	--sb-lh: 1.55;
	--sb-lh-sm: 1.5;
	--sb-max: 1140px;
	--sb-scroll-margin: 100px;
	--sb-scroll-margin-sm: 80px;
	--wp--style--global--content-size: var(--sb-max);
	--wp--style--global--wide-size: var(--sb-max);
}

body.sb-kadence-canvas-page {
	padding: 0;
	overflow-x: hidden;
}

body.sb-kadence-canvas-page .kadence-canvas,
.editor-styles-wrapper,
.editor-styles-wrapper .sb-hub {
	box-sizing: border-box;
	color: var(--sb-body, #333333);
	font-family: var(--sb-font);
	font-size: var(--sb-text);
	font-weight: 400;
	line-height: var(--sb-lh, 1.55);
	margin: 0;
	max-width: none;
	padding: 0;
	width: 100%;
}

body.sb-kadence-canvas-page .entry-content,
body.sb-kadence-canvas-page .kadence-canvas,
body.sb-kadence-canvas-page main.kadence-canvas {
	margin: 0 !important;
	max-width: none !important;
	padding: 0 !important;
}

body.sb-kadence-canvas-page .kadence-canvas>.wp-block-post-content,
body.sb-kadence-canvas-page .kadence-canvas>.entry-content {
	margin: 0 !important;
	max-width: none !important;
	padding: 0 !important;
}

/* Kadence "inherit max width from theme" — uses --wp--style--global--content-size above. */
body.sb-kadence-canvas-page .kadence-canvas .kt-row-has-inherit-max-width .kt-row-column-wrap,
.editor-styles-wrapper .kt-row-has-inherit-max-width .kt-row-column-wrap {
	margin-inline: auto;
	max-width: var(--wp--style--global--content-size, var(--sb-max)) !important;
	width: 100%;
}

/* --- Editor parity (iframe body IS .editor-styles-wrapper; no admin body classes) */

body.sb-kadence-canvas-editor {
	--wp-editor-canvas-background: #ffffff;
}

body.sb-kadence-canvas-editor .block-editor-iframe__html {
	background: var(--sb-white, #ffffff) !important;
}

body.sb-kadence-canvas-editor .interface-interface-skeleton__content,
body.sb-kadence-canvas-editor .edit-post-visual-editor,
body.sb-kadence-canvas-editor .is-desktop-preview {
	background-color: var(--sb-white, #ffffff) !important;
	max-width: none !important;
	overflow-x: clip;
}

.editor-styles-wrapper {
	--wp--style--global--content-size: var(--sb-max);
	--wp--style--global--wide-size: var(--sb-max);
	--wp--style--root--padding-left: 0 !important;
	--wp--style--root--padding-right: 0 !important;
	--wp-editor-canvas-background: #ffffff;
	background-color: var(--sb-white, #ffffff) !important;
	box-sizing: border-box;
	color: var(--sb-body, #333333);
	font-family: var(--sb-font);
	font-size: var(--sb-text);
	font-weight: 400;
	line-height: var(--sb-lh, 1.55);
	margin: 0 !important;
	max-width: none !important;
	overflow-x: clip;
	padding: 0 !important;
	width: 100% !important;
}

/* Iframe edits post content only — no .kadence-canvas wrapper. Kill WP/Tekglide alignfull breakout. */
.editor-styles-wrapper :is(.alignfull, .alignwide, .wp-block-kadence-rowlayout.alignfull, .kb-row-layout-wrap.alignfull),
.editor-styles-wrapper .has-global-padding>.alignfull {
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: none !important;
	width: 100% !important;
}

.editor-styles-wrapper .sb-hub,
.editor-styles-wrapper .wp-block-group {
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: none !important;
	width: 100% !important;
}

.editor-styles-wrapper .block-editor-block-list__layout.is-root-container,
.editor-styles-wrapper .is-root-container {
	background-color: var(--sb-white, #ffffff);
	margin: 0 !important;
	max-width: none !important;
	padding: 0 !important;
	width: 100% !important;
}

.kadence-canvas .wp-block-kadence-column .kt-inside-inner-col {
	display: flex;
}

.kadence-canvas .flex-grow {
	flex-grow: 1;
}

.kadence-canvas .sb-mta {
	margin-top: auto;
	padding-top: 20px; /* min gap above bottom-aligned card links (packed equal-height rows) */
}

.kadence-canvas h1,
.kadence-canvas h2,
.kadence-canvas h3,
.kadence-canvas h4,
.kadence-canvas h5,
.kadence-canvas h6 {
	margin-top: 0;
	padding-top: 0;
}

/*
 * Kadence Standard defaults.
 * The scope class beats unscoped theme element rules.
 * Kadence uniqueID CSS and inline/editor attrs still win.
 * Scope: frontend .kadence-canvas · editor iframe .editor-styles-wrapper.
 */
.kadence-canvas :where(h1),
.editor-styles-wrapper :where(h1) {
	color: var(--sb-heading);
	font-family: var(--sb-font);
	font-size: var(--sb-h1);
	font-weight: 700;
	line-height: var(--sb-lh-h1, 1.15);
}

.kadence-canvas :where(h2),
.editor-styles-wrapper :where(h2) {
	color: var(--sb-heading);
	font-family: var(--sb-font);
	font-size: var(--sb-h2);
	font-weight: 700;
	line-height: var(--sb-lh-h2, 1.2);
}

.kadence-canvas :where(h3),
.editor-styles-wrapper :where(h3) {
	color: var(--sb-heading);
	font-family: var(--sb-font);
	font-size: var(--sb-h3);
	font-weight: 700;
	line-height: var(--sb-lh-h3, 1.25);
}

.kadence-canvas :where(p, li),
.editor-styles-wrapper :where(p, li) {
	color: var(--sb-body, #333333);
	font-family: var(--sb-font);
	font-size: var(--sb-text);
	font-weight: 400;
	line-height: var(--sb-lh, 1.55);
}

.kadence-canvas :where(.sb-lead),
.editor-styles-wrapper :where(.sb-lead) {
	font-size: var(--sb-lead);
	line-height: 1.5;
}

.kadence-canvas :where(small, figcaption, .sb-caption),
.editor-styles-wrapper :where(small, figcaption, .sb-caption) {
	font-size: var(--sb-caption);
	line-height: 1.5;
}

/*
 * Kill Kadence editor rowlayout `h1…p { margin-bottom: 24px }` (blocks-rowlayout.css).
 * That sheet is editor-only, which is why the canvas looked 24px taller in Gutenberg.
 * (0,1,0) beats the unscoped element rule; uniqueID CSS is (0,2,0) and still wins.
 */
.kadence-canvas :where(h1, h2, h3, h4, h5, h6, p, ul, ol),
.editor-styles-wrapper :where(h1, h2, h3, h4, h5, h6, p, ul, ol) {
	margin-top: 0;
	margin-bottom: 0;
}

/* 20px visible gap: heading → first copy, and between sibling copy blocks. */
.kadence-canvas :where(:is(h1, h2, h3, h4) + p, p + p),
.editor-styles-wrapper :where(:is(h1, h2, h3, h4) + p, p + p) {
	margin-top: var(--sb-gap);
}

.kadence-canvas :where(li),
.editor-styles-wrapper :where(li) {
	margin-bottom: var(--sb-gap-list);
}

/* Icon lists already set gap via Kadence listGap; don't double it. */
.kadence-canvas :where(.kt-svg-icon-list li),
.editor-styles-wrapper :where(.kt-svg-icon-list li) {
	margin-bottom: 0;
}

.kadence-canvas :where(p + .wp-block-kadence-singlebtn, p + .kb-buttons-wrap, p + .wp-block-kadence-advancedbtn),
.editor-styles-wrapper :where(p + .wp-block-kadence-singlebtn, p + .kb-buttons-wrap, p + .wp-block-kadence-advancedbtn) {
	margin-top: var(--sb-gap-btn);
}

:where(.kadence-canvas, .editor-styles-wrapper) :where(a):not(:where(.kb-button, .kt-button, .wp-block-button__link)) {
	color: var(--sb-blue);
	text-underline-offset: 4px;
}

/* Button chrome — min 48px tap. Hover/fill stay on the Kadence block. */
:where(.kadence-canvas, .editor-styles-wrapper) :where(.kb-button, .kt-button) {
	border-radius: var(--sb-radius, 50px);
	box-sizing: border-box;
	font-size: var(--sb-btn);
	font-weight: 600;
	line-height: 1;
	padding: 16px 32px;
}

:where(.kadence-canvas, .editor-styles-wrapper) :where(.kb-button, .kt-button):focus-visible {
	outline: 2px solid var(--sb-blue);
	outline-offset: 2px;
}

@media (max-width: 1024px) {
	.kadence-canvas :where(h1),
	.editor-styles-wrapper :where(h1) {
		font-size: var(--sb-h1-sm);
	}

	.kadence-canvas :where(h2),
	.editor-styles-wrapper :where(h2) {
		font-size: var(--sb-h2-sm);
	}

	.kadence-canvas :where(h3),
	.editor-styles-wrapper :where(h3) {
		font-size: var(--sb-h3-sm);
	}

	.kadence-canvas :where(p, li),
	.editor-styles-wrapper :where(p, li) {
		line-height: var(--sb-lh-sm, 1.5);
	}

	.kadence-canvas :where(.sb-lead),
	.editor-styles-wrapper :where(.sb-lead) {
		font-size: var(--sb-lead-sm);
	}
}

@media (max-width: 767px) {
	/* Pills: stretch the wrap and the fill button. Tertiary stays shrink-to-fit. */
	:where(.kadence-canvas, .editor-styles-wrapper) :where(.wp-block-kadence-column):has(:where(.kt-btn-global-fill, .kt-btn-width-type-full)) {
		width: 100%;
		max-width: 100%;
	}
	:where(.kadence-canvas, .editor-styles-wrapper) :where(.kb-buttons-wrap):has(:where(.kt-btn-global-fill, .kt-btn-width-type-full)) {
		width: 100%;
	}
	:where(.kadence-canvas, .editor-styles-wrapper) :where(.kb-button, .kt-button):where(.kt-btn-global-fill, .kt-btn-width-type-full) {
		justify-content: center;
		width: 100%;
	}
	:where(.kadence-canvas, .editor-styles-wrapper) :where(.kb-button, .kt-button):where(.kt-btn-global-outline) {
		width: auto;
		justify-content: flex-start;
	}
}

/* Viewport scroller is html, not body. */
html:has(body.sb-kadence-canvas-page) {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html:has(body.sb-kadence-canvas-page) {
		scroll-behavior: auto;
	}
}

body.sb-kadence-canvas-page .kadence-canvas [id] {
	scroll-margin-top: var(--sb-scroll-margin, 100px);
}

@media (max-width: 767px) {
	body.sb-kadence-canvas-page .kadence-canvas [id] {
		scroll-margin-top: var(--sb-scroll-margin-sm, 80px);
	}
}

:where(.kadence-canvas, .editor-styles-wrapper) :where(ol.wp-block-list li)::marker {
	font-weight: 600;
}