.cerb-form-builder {
	H1,
	H2,
	H3,
	H4,
	H5,
	H6 {
		color: inherit;
		font-family: inherit;
		font-size: 1rem;
		font-weight: bold;
		margin: 0.5em 0;
		padding: 0;
	}

	H1 {
		font-size: 1.9em;
	}
	
	H2 {
		font-size: 1.75em;
	}
	
	H3 {
		font-size: 1.6em;
	}
	
	H4 {
		font-size: 1.45em;
	}
	
	H5 {
		font-size: 1.3em;
	}
	
	H6 {
		font-size: 1.15em;
	}

	.cerb-button {
		background: var(--cerb-color-action-primary) none;
		color: var(--cerb-color-action-primary-text);
		height: unset;
		font-size: 1.1em;
		border-radius: 50px;
		padding: 10px;
		margin: 0 5px;
		
		&:hover {
			background-color: var(--cerb-color-action-primary-hover);
		}
	}

	.cerb-button-style-secondary {
		background-color: var(--cerb-color-action-secondary);
		color: var(--cerb-color-action-secondary-text);
		
		&:hover {
			background-color: var(--cerb-color-action-secondary-hover);
		}
	}
	
	.cerb-button-style-outline {
		background: none;
		color: var(--cerb-color-action-primary);
		border: 2px solid var(--cerb-color-action-primary);
	}
	
	.cerb-form-builder-continue {
	}
	
	.cerb-form-builder-reset {
	}
	
	.cerb-form-builder-response-text {
		P {
			margin: 0 0 0.75em 0;
			padding: 0;
		}
	}
	
	.cerb-form-builder-response-llm-transcript {
		overflow: auto;
		max-height: 75vh;
		padding-right: 0.5em;

		[data-cerb-transcript-role="user"] {
			color: var(--cerb-color-action-primary-text);
			background-color: var(--cerb-color-background-contrast-230);
			border: 0;
			border-radius: 12px 12px 12px 0;
			font-size: 1.1em;

			> div {
				padding: 0 0.5em;
			}
		}

		[data-cerb-tool] {
			display: inline-block;
			background-color: var(--cerb-color-background-contrast-200);
			padding: 0.5em 1em;
			border-radius: 1em;
		}

		[data-cerb-dom="transcript-toolbar"] {
			margin-bottom: 1em;
		}
	}

	.cerb-form-builder-response-say {
		color: var(--cerb-color-text);
		background-color: var(--cerb-color-background-contrast-240);
		border:0;
		border-radius:12px 12px 12px 0;
		padding: 9px 10px;
		margin-bottom: 5px;
		display: inline-block;
	
		P {
			margin: 0;
			padding: 0;
		}
	}

	.cerb-form-builder-prompt {
		margin-bottom: 15px;
	}

	.cerb-form-builder-prompt-text INPUT[type=text],
	.cerb-form-builder-prompt-text INPUT[type=password],
	.cerb-form-builder-prompt-text TEXTAREA {
		border: 1px solid var(--cerb-color-background-contrast-220);
		width: 99%;
		box-sizing: border-box;
	}

	// Textarea auto-sizing
	// Source: https://css-tricks.com/the-cleanest-trick-for-autogrowing-textareas/
	.cerb-form-builder-prompt-text .cerb-form-textarea-grow {
		> textarea {
			resize: none;
			--max-lines: 20;
			max-height: calc(2ex * var(--max-lines));
		}
	}

	.cerb-form-builder-prompt-query .ace_editor {
		border: 1px solid var(--cerb-color-background-contrast-220);
		width: 99%;
		box-sizing: border-box;
	}

	.cerb-form-builder-prompt-captcha INPUT[type=text] {
		border: 1px solid var(--cerb-color-background-contrast-220);
		box-sizing: border-box;
	}

	.cerb-data-table {
		th {
			font-weight: bold;
			font-size: 1.25em;
			text-align: left;
			padding: 0 5px 5px 5px;
		}

		td {
			padding: 5px;
		}

		tbody:nth-child(even) td {
			background-color: var(--cerb-color-table-row-alt-background);
		}

		tbody {
			cursor: pointer;

			&.selected td {
				background-color: var(--cerb-color-table-row-selected-background);
			}

			&.hover tr td {
				background-color: var(--cerb-color-table-row-hover-background) !important;
			}
		}
	}

	.cerb-form-builder-error {
		background-color: var(--cerb-color-error-background);
		color: var(--cerb-color-error-text);
		padding: 15px;

		> H1 {
			margin: 0;
			color: var(--cerb-color-error-text);
		}
		
		> P {
			margin: 0;
			padding: 0;
			color: inherit;
		}
	}
}