.donate-form {
	max-width: fit-content;
	margin: 0px !important;
	padding: 0px !important;
}

[data-mdp-role="preset-amounts"] .btn {
    min-width: 60px;
}

.mdp-donation-form.mdp-currency-chf [data-mdp-role="preset-amounts"] .btn {
	min-width: 68px;
}

.modal-header {
	border-bottom: none;
}

.modal-content {
	border-radius: 0;
	box-shadow: none;
	border: none;
	color: black !important;
}

.btn-close {
	opacity: 1;
	--bs-btn-close-hover-opacity: 1;
}

.modal-body {
	padding-bottom: 2rem;
	padding-top: 0rem;
}

.custom_input_group {
    margin: 0px !important;
	width: max-content;
}

.custom_amount_currency {
    background-color: white !important;
	width: fit-content !important;
	padding: 0px 0px 0px 4px !important;
	border: 1px white solid !important;
    border-right: none !important;
	border-radius: 0px !important;
	text-align: start !important;
	font-size: 1rem !important;
	color: black !important;
	font-weight: 300 !important;
	text-transform: lowercase;
}

.custom_amount_input {
    flex: none !important;
	width: 4.5rem !important;
	min-width: 4.5rem !important;
	margin: 0px 6px 0px 0px !important;
	padding: 0px 8px !important;
	border: 1px white solid !important;
    border-left: none !important;
	border-radius: 0px !important;
	text-align: start !important;
	font-size: 1rem !important;
	color: black !important;
	font-weight: 300 !important;
	text-transform: lowercase;
	box-sizing: border-box;
}

.custom_amount_input::placeholder {
    color: black !important;
    opacity: 80%;
}

.custom_amount_input.active::placeholder {
    color: white !important;
    opacity: 80%;
}

.custom_amount_input.active, .custom_amount_input:focus  {
	box-shadow: none !important;
    background-color: black !important;
    color: white !important;
    border-left: none !important;
}

.custom_amount_currency.active, .custom_amount_currency:focus {
    background-color: black !important;
    color: white !important;
    border-right: none !important;
}

.donation_type_btn, .donation_amount_btn {
	background-color: white !important;
	border: 1px white solid !important;
	border-radius: 0px !important;
	padding: 6px !important;
	text-align: center !important;
	/* font-family: 'Roboto' !important; */
	font-weight: 300 !important;
	font-size: 1rem !important;
	color: black !important;
	width: fit-content;
	height: fit-content;
	text-transform: lowercase;
}

.btn.btn-dark.donation_type_btn.active,  .btn.btn-dark.donation_amount_btn.active{
    background-color: black !important;
    color: white !important;
}

.donate_btn {
    display: block;
	background-color: white !important;
	border: 1px white solid !important;
	border-radius: 0px !important;
	padding: 12px !important;
	text-align: center !important;
	/* font-family: 'Roboto' !important; */
	letter-spacing: 4px !important;
	font-weight: 300 !important;
	font-size: 1.4rem !important;
	color: black !important;
	width: fit-content;
	height: 60px;
	align-content: center;
	text-transform: lowercase;
}

.donate_btn:disabled {
    opacity: 20% !important;
}

.donate_btn:hover, .donation_type_btn:hover, .donation_amount_btn:hover {
    color: white !important;
	background-color: black !important; 
}

.frequency_picker, .currency_picker {
	margin: 0px !important;
}

.currency_picker {
	padding-top: 12px;
    font-size: 0.8rem;
    color: white;
	opacity: 60%;
}

.other_currencies {
    margin-bottom: 0 !important;
}

a.different_currency {
	text-decoration: none !important;
	color: white !important;
	height: fit-content;
}

a.different_currency:hover {
    color: white !important;
    opacity: 100% !important;
    text-decoration: underline dotted !important;
    text-underline-offset: .2em !important;
}

a.different_currency:active, a.different_currency:focus {
    outline-style: none !important;
    text-decoration: underline dotted !important;
    text-underline-offset: .2em !important;
}

.donation_note {
	padding-top: 4px;
	font-size: 0.8rem;
	color: white;
	margin-bottom: 0 !important;
}