/**
 * Bloomerang Form Styling v1.9
 * Matches the design system from listserv-page.css
 * Targets: #registration-form-container, .registration-form
 * 
 * Includes:
 * - Custom radio button styling
 * - Enhanced select/dropdown styling with custom arrow
 * - Credit card input field styling (#card-element)
 * - Registration summary table (Edward Tufte style) with compact inputs
 * - Mobile responsive design
 */

/* Main container - add distinctive border to verify CSS is loading */
#registration-form-container,
.registration-form,
.donation-form,
div[id*="bloomerang"],
div[class*="bloomerang"],
div[id*="donation"],
form[id*="bloomerang"],
form[class*="donation"],
form[id*="registration"] {
	max-width: 640px;
	margin: 0 auto 60px;
	padding: 0 16px;
	border-radius: 8px;
}

#registration-form-container *,
.registration-form *,
.donation-form *,
div[id*="bloomerang"] *,
div[class*="bloomerang"] *,
form[id*="bloomerang"] *,
form[class*="donation"] *,
form[id*="registration"] * {
	box-sizing: border-box;
}

#registration-form label,
.registration-form label,
.donation-form label,
div[id*="bloomerang"] label,
div[class*="bloomerang"] label,
form[id*="bloomerang"] label,
form[class*="donation"] label,
form[id*="registration"] label {
	font-family: "Source Code Pro", monospace !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	color: #ffd700 !important;
	display: block !important;
	margin-bottom: 8px !important;
}

#registration-form label span.required,
.registration-form label span.required,
.donation-form label span.required,
div[id*="bloomerang"] label span.required,
div[class*="bloomerang"] label span.required,
form[id*="bloomerang"] label span.required,
form[class*="donation"] label span.required,
form[id*="registration"] label span.required {
	color: #c00;
}

#registration-form .field input[type="text"],
#registration-form .field input[type="email"],
#registration-form .field input[type="tel"],
#registration-form .field input[type="number"],
#registration-form .field textarea,
#registration-form input[type="text"],
#registration-form input[type="email"],
#registration-form input[type="tel"],
#registration-form input[type="number"],
#registration-form textarea,
.registration-form .field input[type="text"],
.registration-form .field input[type="email"],
.registration-form .field input[type="tel"],
.registration-form .field input[type="number"],
.registration-form .field textarea,
.registration-form input[type="text"],
.registration-form input[type="email"],
.registration-form input[type="tel"],
.registration-form input[type="number"],
.registration-form textarea,
.donation-form .field input[type="text"],
.donation-form .field input[type="email"],
.donation-form .field input[type="tel"],
.donation-form .field input[type="number"],
.donation-form .field textarea,
.donation-form input[type="text"],
.donation-form input[type="email"],
.donation-form input[type="tel"],
.donation-form input[type="number"],
.donation-form textarea,
div[id*="bloomerang"] input[type="text"],
div[id*="bloomerang"] input[type="email"],
div[id*="bloomerang"] input[type="tel"],
div[id*="bloomerang"] input[type="number"],
div[id*="bloomerang"] textarea,
div[class*="bloomerang"] input[type="text"],
div[class*="bloomerang"] input[type="email"],
div[class*="bloomerang"] input[type="tel"],
div[class*="bloomerang"] input[type="number"],
div[class*="bloomerang"] textarea,
form[id*="bloomerang"] input[type="text"],
form[id*="bloomerang"] input[type="email"],
form[id*="bloomerang"] input[type="tel"],
form[id*="bloomerang"] input[type="number"],
form[id*="bloomerang"] textarea,
form[class*="donation"] input[type="text"],
form[class*="donation"] input[type="email"],
form[class*="donation"] input[type="tel"],
form[class*="donation"] input[type="number"],
form[class*="donation"] textarea,
form[id*="registration"] input[type="text"],
form[id*="registration"] input[type="email"],
form[id*="registration"] input[type="tel"],
form[id*="registration"] input[type="number"],
form[id*="registration"] textarea {
	font-family: "Poppins", sans-serif !important;
	font-weight: 400 !important;
	font-size: 32px !important;
	line-height: 32px !important;
	color: #000 !important;
	height: 80px !important;
	padding: 16px 32px !important;
	background-color: #ececec !important;
	border: none !important;
	border-radius: 4px 32px 32px 32px !important;
	outline: none !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	transition: all 0.2s ease-in-out !important;
	box-shadow: none !important;
	margin-bottom: 24px !important;
}

.donation-form textarea {
	height: 120px !important;
	min-height: 120px !important;
	resize: vertical !important;
}

.donation-form input::placeholder,
.donation-form textarea::placeholder {
	color: #999 !important;
}

.donation-form .field input[type="text"]:focus,
.donation-form .field input[type="email"]:focus,
.donation-form .field input[type="tel"]:focus,
.donation-form .field input[type="number"]:focus,
.donation-form .field textarea:focus,
.donation-form input[type="text"]:focus,
.donation-form input[type="email"]:focus,
.donation-form input[type="tel"]:focus,
.donation-form input[type="number"]:focus,
.donation-form textarea:focus {
	background-color: #fff !important;
	box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.4) !important;
	border: none !important;
	outline: none !important;
}

.donation-form select,
.donation-form .field select {
	font-family: "Poppins", sans-serif !important;
	font-weight: 400 !important;
	font-size: 20px !important;
	color: #000 !important;
	height: 60px !important;
	padding: 12px 24px !important;
	background-color: #ececec !important;
	border: none !important;
	border-radius: 4px 24px 24px 24px !important;
	outline: none !important;
	width: 100% !important;
	margin-bottom: 24px !important;
	cursor: pointer !important;
}

.donation-form select:focus,
.donation-form .field select:focus {
	background-color: #fff !important;
	box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.4) !important;
}

#registration-form button[type="submit"],
#registration-form input[type="submit"],
#registration-form button,
#registration-form .btn-group button,
.registration-form button[type="submit"],
.registration-form input[type="submit"],
.registration-form button,
.registration-form .btn-group button,
.donation-form button[type="submit"],
.donation-form input[type="submit"],
.donation-form .submit-button,
.donation-form button.submit,
div[id*="bloomerang"] button[type="submit"],
div[id*="bloomerang"] input[type="submit"],
div[id*="bloomerang"] button,
div[class*="bloomerang"] button[type="submit"],
div[class*="bloomerang"] input[type="submit"],
div[class*="bloomerang"] button,
form[id*="bloomerang"] button[type="submit"],
form[id*="bloomerang"] input[type="submit"],
form[id*="bloomerang"] button,
form[class*="donation"] button[type="submit"],
form[class*="donation"] input[type="submit"],
form[class*="donation"] button,
form[id*="registration"] button[type="submit"],
form[id*="registration"] input[type="submit"],
form[id*="registration"] button {
	width: 100% !important;
	font-family: "Poppins", sans-serif !important;
	font-weight: 700 !important;
	font-size: 20px !important;
	padding: 18px 36px !important;
	margin-top: 16px !important;
	background: #ffd700 !important;
	color: #000 !important;
	border: none !important;
	border-radius: 78px !important;
	cursor: pointer !important;
	transition: background 0.2s ease, opacity 0.2s ease !important;
	box-shadow: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}

.donation-form button[type="submit"]:hover,
.donation-form input[type="submit"]:hover,
.donation-form .submit-button:hover,
.donation-form button.submit:hover {
	background: #ffdf33 !important;
	color: #000 !important;
	opacity: 1 !important;
}

.donation-form button[type="submit"]:disabled,
.donation-form input[type="submit"]:disabled,
.donation-form .submit-button:disabled,
.donation-form button.submit:disabled {
	opacity: 0.6 !important;
	cursor: not-allowed !important;
}

#registration-form .field,
.registration-form .field,
.donation-form .field {
	margin-bottom: 24px !important;
}

.donation-form .error,
.donation-form .validation-error,
.donation-form .field-validation-error {
	padding: 14px 18px !important;
	border-radius: 8px !important;
	font-family: "Poppins", sans-serif !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	background: rgba(220, 38, 38, 0.15) !important;
	border: 1px solid rgba(220, 38, 38, 0.4) !important;
	color: #fca5a5 !important;
	margin-bottom: 16px !important;
}

.donation-form .success,
.donation-form .success-message {
	padding: 14px 18px !important;
	border-radius: 8px !important;
	font-family: "Poppins", sans-serif !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	background: rgba(34, 197, 94, 0.15) !important;
	border: 1px solid rgba(34, 197, 94, 0.4) !important;
	color: #86efac !important;
	margin-bottom: 16px !important;
}

.donation-form fieldset {
	border: none !important;
	padding: 0 !important;
	margin: 0 0 24px 0 !important;
}

.donation-form legend {
	font-family: "Source Code Pro", monospace !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	color: #ffd700 !important;
	margin-bottom: 8px !important;
}

/* Radio and checkbox styling */
.donation-form .field.radio label,
.donation-form .field.checkbox label,
#registration-form .field.radio label,
#registration-form .field.checkbox label,
.registration-form .field.radio label,
.registration-form .field.checkbox label {
	font-size: 16px !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: #fff !important;
	display: inline-block !important;
}

.registration-form .field.radio label span.label {
	margin-left: 8px !important;
}

/* Custom radio button styling */
#registration-form input[type="radio"],
.registration-form input[type="radio"],
.donation-form input[type="radio"],
div[id*="bloomerang"] input[type="radio"],
div[class*="bloomerang"] input[type="radio"],
form[id*="bloomerang"] input[type="radio"],
form[id*="registration"] input[type="radio"] {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	width: 20px !important;
	height: 20px !important;
	min-width: 20px !important;
	border: 2px solid #ececec !important;
	border-radius: 50% !important;
	background-color: #ececec !important;
	cursor: pointer !important;
	position: relative !important;
	vertical-align: middle !important;
	margin: 0 !important;
	padding: 0 !important;
	transition: all 0.2s ease-in-out !important;
	box-shadow: none !important;
}

#registration-form input[type="radio"]:checked,
.registration-form input[type="radio"]:checked,
.donation-form input[type="radio"]:checked,
div[id*="bloomerang"] input[type="radio"]:checked,
div[class*="bloomerang"] input[type="radio"]:checked,
form[id*="bloomerang"] input[type="radio"]:checked,
form[id*="registration"] input[type="radio"]:checked {
	background-color: #ffd700 !important;
	border-color: #ffd700 !important;
}

#registration-form input[type="radio"]:checked::after,
.registration-form input[type="radio"]:checked::after,
.donation-form input[type="radio"]:checked::after,
div[id*="bloomerang"] input[type="radio"]:checked::after,
div[class*="bloomerang"] input[type="radio"]:checked::after,
form[id*="bloomerang"] input[type="radio"]:checked::after,
form[id*="registration"] input[type="radio"]:checked::after {
	content: "" !important;
	display: block !important;
	width: 8px !important;
	height: 8px !important;
	border-radius: 50% !important;
	background-color: #000 !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
}

#registration-form input[type="radio"]:focus,
.registration-form input[type="radio"]:focus,
.donation-form input[type="radio"]:focus,
div[id*="bloomerang"] input[type="radio"]:focus,
div[class*="bloomerang"] input[type="radio"]:focus,
form[id*="bloomerang"] input[type="radio"]:focus,
form[id*="registration"] input[type="radio"]:focus {
	box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.4) !important;
	outline: none !important;
}

/* Registration summary table - Edward Tufte style */
table.registration-summary,
#registration-form table.registration-summary,
.registration-form table.registration-summary,
#registration-form-container table.registration-summary {
	width: 100% !important;
	max-width: 100% !important;
	border-collapse: collapse !important;
	margin: 24px 0 32px 0 !important;
	font-family: "Poppins", sans-serif !important;
	background: transparent !important;
	border: none !important;
}

table.registration-summary thead {
	border-bottom: 2px solid rgba(255, 215, 0, 0.3) !important;
}

table.registration-summary th {
	font-family: "Source Code Pro", monospace !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	color: #ffd700 !important;
	text-align: left !important;
	padding: 12px 16px 12px 0 !important;
	background: transparent !important;
	border: none !important;
}

table.registration-summary tbody tr {
	border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
	transition: background-color 0.15s ease !important;
}

table.registration-summary tbody tr:hover {
	background-color: rgba(255, 255, 255, 0.02) !important;
}

table.registration-summary tbody tr:last-child {
	border-bottom: none !important;
}

table.registration-summary td {
	font-size: 15px !important;
	line-height: 1.5 !important;
	color: rgba(255, 255, 255, 0.9) !important;
	padding: 14px 16px 14px 0 !important;
	vertical-align: middle !important;
	background: transparent !important;
	border: none !important;
}

table.registration-summary td.quantity-column {
	text-align: center !important;
	font-weight: 500 !important;
}

table.registration-summary td.price-column {
	text-align: right !important;
	font-weight: 500 !important;
	font-variant-numeric: tabular-nums !important;
	padding-right: 0 !important;
}

table.registration-summary th.tickets-column {
	font-size: 0px !important;
}

table.registration-summary td.tickets-column {
	text-align: right !important;
	padding-right: 0 !important;
}

/* Summary row styling */
table.registration-summary tr.summary-row,
table.registration-summary tr.additional-donation,
table.registration-summary tr.summary-total {
	font-weight: 600 !important;
	border-top: 2px solid rgba(255, 215, 0, 0.3) !important;
}

table.registration-summary tr.summary-total td {
	font-size: 18px !important;
	color: #ffd700 !important;
	padding-top: 16px !important;
	padding-bottom: 16px !important;
}

table.registration-summary tr.cannot-attend-donation {
	opacity: 0.7 !important;
}

/* Input fields within the table - much smaller */
table.registration-summary input[type="text"],
table.registration-summary input[type="number"],
table.registration-summary input[type="email"],
#registration-form table.registration-summary input[type="text"],
#registration-form table.registration-summary input[type="number"],
#registration-form table.registration-summary input[type="email"],
.registration-form table.registration-summary input[type="text"],
.registration-form table.registration-summary input[type="number"],
.registration-form table.registration-summary input[type="email"],
#registration-form-container table.registration-summary input[type="text"],
#registration-form-container table.registration-summary input[type="number"],
#registration-form-container table.registration-summary input[type="email"] {
	font-family: "Poppins", sans-serif !important;
	font-size: 15px !important;
	line-height: 1.4 !important;
	color: #000 !important;
	height: 36px !important;
	min-height: 36px !important;
	max-height: 36px !important;
	padding: 6px 10px !important;
	background-color: rgba(236, 236, 236, 0.95) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-radius: 4px !important;
	outline: none !important;
	width: 70px !important;
	max-width: 70px !important;
	min-width: 70px !important;
	text-align: center !important;
	transition: all 0.2s ease-in-out !important;
	box-shadow: none !important;
	margin: 0 !important;
	display: inline-block !important;
}

table.registration-summary input[type="text"]:focus,
table.registration-summary input[type="number"]:focus,
table.registration-summary input[type="email"]:focus,
#registration-form table.registration-summary input[type="text"]:focus,
#registration-form table.registration-summary input[type="number"]:focus,
#registration-form table.registration-summary input[type="email"]:focus,
.registration-form table.registration-summary input[type="text"]:focus,
.registration-form table.registration-summary input[type="number"]:focus,
.registration-form table.registration-summary input[type="email"]:focus {
	background-color: #fff !important;
	border-color: #ffd700 !important;
	box-shadow: 0 0 0 2px rgba(255, 215, 0, 0.2) !important;
	height: 36px !important;
	min-height: 36px !important;
	max-height: 36px !important;
}

/* Description column styling */
table.registration-summary td.description-column {
	font-size: 15px !important;
	color: rgba(255, 255, 255, 0.95) !important;
}

table.registration-summary td.description-column strong {
	color: #fff !important;
	font-weight: 600 !important;
}

/* Enhanced select/dropdown styling */
#registration-form select,
#registration-form .field select,
.registration-form select,
.registration-form .field select,
.donation-form select,
.donation-form .field select,
div[id*="bloomerang"] select,
div[class*="bloomerang"] select,
form[id*="bloomerang"] select,
form[id*="registration"] select {
	font-family: "Poppins", sans-serif !important;
	font-weight: 400 !important;
	font-size: 24px !important;
	color: #000 !important;
	height: 70px !important;
	padding: 16px 24px !important;
	background-color: #ececec !important;
	border: none !important;
	border-radius: 4px 24px 24px 24px !important;
	outline: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin-bottom: 24px !important;
	cursor: pointer !important;
	transition: all 0.2s ease-in-out !important;
	box-shadow: none !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23000000' d='M6 8L0 0h12z'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 20px center !important;
	padding-right: 50px !important;
}

#registration-form select:focus,
#registration-form .field select:focus,
.registration-form select:focus,
.registration-form .field select:focus,
.donation-form select:focus,
.donation-form .field select:focus,
div[id*="bloomerang"] select:focus,
div[class*="bloomerang"] select:focus,
form[id*="bloomerang"] select:focus,
form[id*="registration"] select:focus {
	background-color: #fff !important;
	box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.4) !important;
}

/* Credit card input styling */
.CardNumberField-input-wrapper,
.CardNumberField,
#registration-form .CardNumberField-input-wrapper,
#registration-form .CardNumberField,
.registration-form .CardNumberField-input-wrapper,
.registration-form .CardNumberField,
div[id*="bloomerang"] .CardNumberField-input-wrapper,
div[id*="bloomerang"] .CardNumberField {
	font-family: "Poppins", sans-serif !important;
	font-weight: 400 !important;
	font-size: 32px !important;
	line-height: 32px !important;
	color: #000 !important;
	min-height: 80px !important;
	padding: 16px 32px !important;
	background-color: #ececec !important;
	border: none !important;
	border-radius: 4px 32px 32px 32px !important;
	outline: none !important;
	box-sizing: border-box !important;
	width: 100% !important;
	transition: all 0.2s ease-in-out !important;
	box-shadow: none !important;
	margin-bottom: 24px !important;
	display: flex !important;
	align-items: center !important;
}

/* Credit card element iframe wrapper */
#card-element,
#registration-form #card-element,
.registration-form #card-element,
div[id*="bloomerang"] #card-element,
div[class*="bloomerang"] #card-element,
form[id*="bloomerang"] #card-element,
form[id*="registration"] #card-element {
	line-height: 32px !important;
	min-height: 80px !important;
	padding: 16px 32px !important;
	background-color: #ececec !important;
	border: none !important;
	border-radius: 4px 32px 32px 32px !important;
	outline: none !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 100% !important;
	transition: all 0.2s ease-in-out !important;
	box-shadow: none !important;
	margin-bottom: 24px !important;
}

#card-element.StripeElement--focus,
#registration-form #card-element.StripeElement--focus,
.registration-form #card-element.StripeElement--focus,
div[id*="bloomerang"] #card-element.StripeElement--focus {
	background-color: #fff !important;
	box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.4) !important;
}

.CardNumberField-input-wrapper input,
.CardNumberField input,
.CardNumberField-input-wrapper .InputElement,
.CardNumberField .InputElement,
.CardNumberField-input-wrapper .Input,
.CardNumberField .Input,
input.InputElement,
input.Input {
	font-family: "Poppins", sans-serif !important;
	font-size: 32px !important;
	line-height: 32px !important;
	color: #000 !important;
	background: transparent !important;
	border: none !important;
	outline: none !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
}

.CardNumberField-input-wrapper.is-focused,
.CardNumberField.is-focused,
#registration-form .CardNumberField-input-wrapper.is-focused,
#registration-form .CardNumberField.is-focused,
.registration-form .CardNumberField-input-wrapper.is-focused,
.registration-form .CardNumberField.is-focused {
	background-color: #fff !important;
	box-shadow: 0 0 0 3px rgba(255, 215, 0, 0.4) !important;
}

.CardNumberField-input-wrapper input::placeholder,
.CardNumberField input::placeholder,
.InputElement::placeholder,
.Input::placeholder {
	color: #999 !important;
	font-size: 32px !important;
}

@media screen and (max-width: 600px) {
	#registration-form .field input[type="text"],
	#registration-form .field input[type="email"],
	#registration-form .field input[type="tel"],
	#registration-form .field input[type="number"],
	#registration-form .field textarea,
	#registration-form input[type="text"],
	#registration-form input[type="email"],
	#registration-form input[type="tel"],
	#registration-form input[type="number"],
	#registration-form textarea,
	.registration-form .field input[type="text"],
	.registration-form .field input[type="email"],
	.registration-form .field input[type="tel"],
	.registration-form .field input[type="number"],
	.registration-form .field textarea,
	.registration-form input[type="text"],
	.registration-form input[type="email"],
	.registration-form input[type="tel"],
	.registration-form input[type="number"],
	.registration-form textarea,
	.donation-form .field input[type="text"],
	.donation-form .field input[type="email"],
	.donation-form .field input[type="tel"],
	.donation-form .field input[type="number"],
	.donation-form .field textarea,
	.donation-form input[type="text"],
	.donation-form input[type="email"],
	.donation-form input[type="tel"],
	.donation-form input[type="number"],
	.donation-form textarea {
		font-size: 20px !important;
		height: 64px !important;
		padding: 12px 24px !important;
	}

	.donation-form textarea,
	.registration-form textarea,
	#registration-form textarea {
		height: 100px !important;
		min-height: 100px !important;
	}

	#registration-form button[type="submit"],
	#registration-form input[type="submit"],
	#registration-form button,
	.registration-form button[type="submit"],
	.registration-form input[type="submit"],
	.registration-form button,
	.donation-form button[type="submit"],
	.donation-form input[type="submit"],
	.donation-form .submit-button,
	.donation-form button.submit {
		font-size: 16px !important;
		padding: 14px 28px !important;
	}

	#registration-form select,
	#registration-form .field select,
	.registration-form select,
	.registration-form .field select,
	.donation-form select,
	.donation-form .field select {
		font-size: 16px !important;
		height: 50px !important;
		padding: 10px 20px !important;
		background-position: right 15px center !important;
		padding-right: 40px !important;
	}

	/* Radio buttons remain same size on mobile */
	#registration-form input[type="radio"],
	.registration-form input[type="radio"],
	.donation-form input[type="radio"] {
		width: 18px !important;
		height: 18px !important;
		min-width: 18px !important;
	}

	#registration-form input[type="radio"]:checked::after,
	.registration-form input[type="radio"]:checked::after,
	.donation-form input[type="radio"]:checked::after {
		width: 7px !important;
		height: 7px !important;
	}

	/* Credit card input mobile sizing */
	.CardNumberField-input-wrapper,
	.CardNumberField,
	#registration-form .CardNumberField-input-wrapper,
	#registration-form .CardNumberField,
	.registration-form .CardNumberField-input-wrapper,
	.registration-form .CardNumberField,
	#card-element,
	#registration-form #card-element,
	.registration-form #card-element {
		font-size: 20px !important;
		min-height: 64px !important;
		padding: 12px 24px !important;
	}

	.CardNumberField-input-wrapper input,
	.CardNumberField input,
	.CardNumberField-input-wrapper .InputElement,
	.CardNumberField .InputElement,
	.CardNumberField-input-wrapper .Input,
	.CardNumberField .Input,
	input.InputElement,
	input.Input {
		font-size: 20px !important;
	}

	.CardNumberField-input-wrapper input::placeholder,
	.CardNumberField input::placeholder,
	.InputElement::placeholder,
	.Input::placeholder {
		font-size: 20px !important;
	}

	/* Registration summary table mobile */
	table.registration-summary th {
		font-size: 10px !important;
		padding: 10px 12px 10px 0 !important;
	}

	table.registration-summary td {
		font-size: 14px !important;
		padding: 12px 12px 12px 0 !important;
	}

	table.registration-summary tr.summary-total td {
		font-size: 16px !important;
	}

	table.registration-summary input[type="text"],
	table.registration-summary input[type="number"],
	table.registration-summary input[type="email"],
	#registration-form table.registration-summary input[type="text"],
	#registration-form table.registration-summary input[type="number"],
	#registration-form table.registration-summary input[type="email"],
	.registration-form table.registration-summary input[type="text"],
	.registration-form table.registration-summary input[type="number"],
	.registration-form table.registration-summary input[type="email"] {
		font-size: 14px !important;
		height: 32px !important;
		min-height: 32px !important;
		max-height: 32px !important;
		padding: 5px 8px !important;
		width: 60px !important;
		max-width: 60px !important;
		min-width: 60px !important;
	}

	table.registration-summary input[type="text"]:focus,
	table.registration-summary input[type="number"]:focus,
	table.registration-summary input[type="email"]:focus {
		height: 32px !important;
		min-height: 32px !important;
		max-height: 32px !important;
	}
}