/**
 * Form — split / centered families + shell width tokens.
 * Companion to form-overrides.css. Do not fork that sheet.
 */
.tw-form-split,
.tw-form-split__copy,
.tw-form-split__panel,
.tw-form-centered,
.tw-form-centered__panel,
.tw-form-column {
	min-width: 0;
}

.tw-form-split,
.tw-form-centered {
	display: flex;
	flex-direction: column;
	gap: var(--tw-intro-panel-gap, calc(var(--tw-content-gap, 1rem) * 2));
}

.tw-form-split__panel,
.tw-form-centered__panel {
	display: flex;
	flex-direction: column;
	gap: var(--tw-content-gap, 1rem);
}

.tw-form-centered__panel {
	align-items: center;
	width: 100%;
}

.tw-form-split .tw-section-intro,
.tw-form-centered .tw-section-intro {
	display: flex;
	flex-direction: column;
	gap: var(--tw-content-gap, 1rem);
}

.tw-form-column {
	width: 100%;
}

.tw-form-column[data-tw-form-width="theme"] {
	max-width: var(--tw-container-max-width, 80rem);
}

.tw-form-column[data-tw-form-width="sm"] {
	max-width: 28rem;
}

.tw-form-column[data-tw-form-width="md"] {
	max-width: 32rem;
}

.tw-form-column[data-tw-form-width="lg"] {
	max-width: 36rem;
}

.tw-form-column[data-tw-form-width="full"] {
	max-width: 48rem;
}

.tw-form-column[data-tw-form-span="bleed"] {
	max-width: none;
	width: 100%;
}

.tw-form-centered__panel .tw-form-column {
	margin-inline: auto;
}

/* TWF `.twf-form` is max 36rem. Theme/full columns can be hub-wide; hug the
   raised shell to the form so the card is not an empty slab. Bleed stretches. */
.tw-form-column .tw-form-shell {
	width: 100%;
	max-width: 36rem;
	margin-inline: auto;
}

.tw-form-column[data-tw-form-span="bleed"] .tw-form-shell {
	max-width: none;
}

.tw-form-column[data-tw-form-span="bleed"] .twf-form {
	max-width: none;
	width: 100%;
}

.tw-form-column[data-tw-form-shell-fill="page"] .tw-form-shell {
	background-color: var(--tw-color-page, #fff);
}

.tw-form-column[data-tw-form-shell-fill="surface"] .tw-form-shell {
	background-color: var(--tw-color-surface, #fff);
}

.tw-form-column[data-tw-form-shell-fill="soft"] .tw-form-shell {
	background-color: var(--tw-color-surface-alt, #f8fafc);
}

.tw-form-column[data-tw-form-shell-fill="dark"] .tw-form-shell {
	background-color: var(--tw-color-text, #0f172a);
	color: var(--tw-color-page, #fff);
}

.tw-form-column[data-tw-form-shell-fill="brand"] .tw-form-shell {
	background-color: var(--tw-color-brand-primary);
}

.tw-form-column[data-tw-form-shell-fill="secondary"] .tw-form-shell {
	background-color: var(--tw-color-brand-secondary);
}

.tw-form-column[data-tw-form-shell-fill="accent"] .tw-form-shell {
	background-color: var(--tw-color-brand-accent);
}

@media (max-width: 1023.98px) {
	[data-tw-form-mobile-stack="above"] .tw-form-split__panel {
		order: -1;
	}
}

@media (min-width: 1024px) {
	.tw-form-split {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: stretch;
	}

	.tw-form-split[data-tw-form-split-ratio="60_40"] {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	}

	.tw-form-split[data-tw-form-split-ratio="75_25"] {
		grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
	}

	.tw-form-split[data-tw-form-panel-side="start"][data-tw-form-split-ratio="60_40"] {
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	}

	.tw-form-split[data-tw-form-panel-side="start"][data-tw-form-split-ratio="75_25"] {
		grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
	}

	.tw-form-split[data-tw-form-panel-side="start"] .tw-form-split__panel {
		order: -1;
	}

	.tw-form-split .tw-form-split__copy {
		align-self: stretch;
	}

	.tw-form-split .tw-form-split__copy .tw-section-intro {
		position: sticky;
		top: 6rem;
	}
}
