/*
 * Shortcode: single-give-form.scss
 * -----------------------------------------------
*/

body.single-give_forms {
	.give-form-title {
		margin-bottom: 50px;
	}
	.give-goal-progress {
		.donation-info {
			margin-bottom: 0;
			li {
				.label {
					margin-right: 10px;
				}
				&.goal {
					float: left;
				}
				&.raised {
					float: right;
				}
			}
		}
	}
	#give-payment-mode-select {
		margin-top: 50px;
	}
	#give_purchase_form_wrap {
		margin-top: 40px;
	}
}


[id*='give-form'] {
	div.give-form-content-wrap {
		clear: both;
	}
	div#give-sidebar-left {
		width: 100%;
		float: left;
	}

	div.summary {
		width: 100%;
		float: right;
	}
}
#give-recurring-form,
form.give-form,
form[id*=give-form] {
	margin-bottom: 60px;
}
[id*=give-form].give-display-modal,
[id*=give-form].give-display-reveal,
	{
	.give-btn {
		margin: 0;
		font-size: 1rem;
		padding: 15px 30px;
	}
}

#give-donation-level-button-wrap {
	>li {
		.give-btn {
			border-radius: 0;
			padding: 15px 30px;
			margin: 0;
			font-size: 0.8em;
		}
	}
}

form[id*=give-form] {
	.form-row {
		margin-bottom: 25px;
		input[type=text],
		input[type=email] {

			height: form-control-height();
			padding: 8px 16px;
			outline: 0;
			border-radius: 0;
			&:focus {
				border-color: #a9a9a9;
				box-shadow: none;
				outline: 0 none;
			}

		}
		label {
			margin-bottom: .5rem;
		}
	}
	.give-donation-amount {
		.give-currency-symbol.give-currency-position-before,
		#give-amount-text,
		#give-amount {
			border-width: 1px;
			padding: 5px 25px;
			height: inherit;
		}
		.give-currency-symbol.give-currency-position-before {
			border-radius: 5px 0 0 5px;
			color: #999;
		}
		#give-amount {
			border-radius: 0 5px 5px 0 !important;
		}
	}
	#give-final-total-wrap {
		.give-donation-total-label,
		.give-final-total-amount {
			border-width: 1px;
			padding: 7px 15px;
			height: inherit;
		}
		.give-donation-total-label {
			font-size: 0.9rem;
			border-radius: 3px 0 0 3px;
		}
		.give-final-total-amount {
			border-radius: 0 3px 3px 0;
			padding: 7px 40px;
		}
	}
}


.tm-sc-give-single-form {
	&.give-single-form-current-theme-style1 {
		background-color: #fff;
		border: 1px solid #f4f3f0;
		border-radius: 5px;
		@include media-breakpoint-up(xl) {
			.form-right {
				padding-left: 0;
			}
		}
		.form-info {
			padding: 80px;
			padding-bottom: 55px;

			.donated {
				color: #000;
				width: 126px;
				height: 123px;
				display: block;
				text-align: center;
				font-size: 1.1rem;
				line-height: 1.4;
				padding-top: 35px;
				background: url(../images/current-theme/circle-btn-lg-color2.png) no-repeat center center;
				-webkit-background-size: cover;
				background-size: cover;
				z-index: 2;
				position: absolute;
				top: 50%;
				right: -19%;
				-webkit-transform: translate(-50%, -50%);
				-ms-transform: translate(-50%, -50%);
				-o-transform: translate(-50%, -50%);
				transform: translate(-50%, -50%);
				@include media-breakpoint-down(xl) {
					top: 10px;
					right: 20px;
					@include translate(0%, 0%);
				}
			}
			.subtitle {
				margin-top: 0;
				margin-bottom: 0;
				font-family: $font-current-theme2;
			}
			.title {
				margin-top: 0;
			}
			.excerpt {
				font-size: 1.2rem;
				margin: 30px 0;
			}

			.give-goal-progress {
				.donation-info {
					li {
						width: 100%;
						padding: 0;
						margin-bottom: 5px;
						font-weight: $body-font-bold;
						span {
							font-size: 1.1rem;
							line-height: 1.3;
						}
						.label {
							margin-right: 10px;
						}
						.value {
							display: inline-block;
						}
					}
				}
			}
		}
		.form-right {
			.form-thumbnail {
				overflow: hidden;
				img {
					transition: 600ms;
				}
			}
		}
		&:hover {
			.form-right {
				.form-thumbnail {
					img {
						transform: scale(1.07);
					}
				}
			}
		}
	}



	&.give-single-form-only-form {
		form[id*=give-form] {
			margin-bottom: 0;
			.give-currency-position-before,
			legend,
			.give-label,
			#give-final-total-wrap {
				display: none;
			}
			#give-donation-level-button-wrap {
				margin-bottom: 5px;
				li {
					width: 32%;
					.give-donation-level-btn {
						background-color: #fafafa;
						border: 1px solid #ddd;
						color: #111;
						font-size: 0.9rem;
						width: 100%;
						&:hover {
							background-color: #ddd;
						}
					}
				}
				.give-btn-level-custom {
					display: none;
				}
			}
			.give-donation-amount #give-amount {
				border-radius: 5px !important;
				width: 100%;
			}

			.give-input, .give-donation-amount #give-amount {
				color: #111;
				background-color: #f7f7f7;
				font-size: 0.9rem;
				height: form-control-height();
				padding: 8px 16px;
				outline: 0;
				border-radius: 0;
				&:focus {
					box-shadow: 0 0 0 2px #d55342;
					color: #495057;
					background-color: #fff;
					border-color: #80bdff;
					outline: 0;
				}
			}
			.form-row, .give-donation-amount {
				margin-bottom: 15px;
			}
		}
	}


	&.give-single-form-pie-chart-form {
		.tm-sc-pie-chart {
			margin-bottom: 35px;
		}
		.percent {
			font-size: 20px;
		}
		.title {
			margin-bottom: 25px;
		}
		.excerpt {
			margin-bottom: 25px;
		}
		.give-goal-progress {
			.donation-info {
				display: block;
				margin-bottom: 25px;
				li {
					padding: 0;
					.label {
						color: #eee;
						margin-right: 5px;
					}
					.value {
						color: #bbb;
						display: inline-block;
					}
				}
			}
		}
	}
}