/**
 * Support Letter — front-end fixes, loaded only on forms that use the
 * Support Letter field. See functions/support-letter.php.
 */

/*
 * Choice rows: centre the label against the box and add a little row
 * spacing. The full selector chain is deliberate — a shorter one ties
 * the theme's own .gchoice rule and loses on load order, so alignment
 * silently did nothing.
 */
.gform_wrapper .gform_body .gform_fields .gfield .ginput_container .gchoice {
	align-items: center;
	margin-bottom: 10px;
}

/*
 * The theme gives every field label an 8px bottom margin. On an inline
 * choice label that margin is part of the flex row's centred box, so it
 * shoves the text up by ~4px. Zero it; the tiny residual left over is
 * the font's cap metrics (caps ride high in the em), so nudge 1px down.
 */
.gform_wrapper .gform_body .gform_fields .gfield .ginput_container .gchoice label {
	margin-bottom: 0;
	position: relative;
	top: 1px;
}

/*
 * The theme's generic input rule forces height:42px, padding,
 * border-radius and a 1px outline onto EVERY input. On a checkbox/radio
 * that spreads the rows and paints an unwanted outline; reset the box to
 * a 22px square with a matching-specificity selector.
 */
.gform_wrapper .gform_body .gform_fields .gfield .ginput_container input.gfield-choice-input {
	width: 22px;
	height: 22px;
	min-height: 0;
	padding: 0;
	border-radius: 2px;
	outline: none;
	flex-shrink: 0;
}

/*
 * The letter textarea has a 30px radius, so its scrollbar bleeds past the
 * rounded top/bottom corners. Clipping the wrapper (the scrollbar is
 * painted inside it) trims those corners reliably, whatever the OS
 * scrollbar mode. Give the thumb a slim inset pill on top.
 */
.sl-letter {
	border-radius: 30px;
	overflow: hidden;
}

.sl-letter textarea {
	scrollbar-width: thin;
	scrollbar-color: #b9b2a0 transparent;
}

.sl-letter textarea::-webkit-scrollbar {
	width: 14px;
}

.sl-letter textarea::-webkit-scrollbar-track {
	background: transparent;
}

.sl-letter textarea::-webkit-scrollbar-thumb {
	background-color: #b9b2a0;
	border-radius: 999px;
	border: 4px solid transparent;
	background-clip: content-box;
}