//	=================
//    	Imports
//	=================

@import '../base/color_variables';   	// Color Variables
@import '../base/fonticons';   			// Fonticons Variables
@import '../base/urls';   				// URLS Variables
@import '../base/utilities_variables';  // Utilities Variables

.form-control {
	border-radius: $br-30;
	&:focus {
		border-color: $color_86;
	}
}
h4 {
	color: $additional-color-7;
	text-transform: $transform-upper;
}
h1 {
	color: $color_56;
}
.popover {
	border-bottom-color: $light-gray;
	border-radius: $br-4;
	border: $b-width-1 $solid $light-gray;
	box-shadow: $shadow-3;
}
.popover-header {
	background-color: $white;
	border-bottom: $b-width-1 $solid $color_6;
	color: $color_59;
}
.login-footer {
	a {
		color: $color_57;
	}
}
.modal-content {
	border: $b-width-1 $solid $light-gray;
}
.modal-header {
	border-bottom: $b-width-1 $solid $light-gray;
}
.modal-footer {
	border-top: $b-width-1 $solid $color_6;
}
.close {
	color: $additional-color-6;
}
/*      Profile       */
.modal#profileModal {
	.modal-content {
		.rounded-circle {
			border: $solid $b-width-6 $color_442;
			box-shadow: $shadow-1;
		}
		border: none;
		background: $color_86;
		.modal-header {
			border-bottom: none;
		}
		.modal-body {
			p {
				font-size: 1rem;
				color: $white;
			}
		}
		.modal-footer {
			border: none;
			button {
				background-color: $color_none;
				box-shadow: none;
				color: $color_440;
				background-image: $additional-gradient-color-67;
				border-radius: $br-4;
				&:hover {
					background-color: $color_none;
					box-shadow: none;
					border-color: $color_none;
					box-shadow: $shadow-7;
				}
				&:focus {
					background-color: $color_none;
					box-shadow: none;
					border-color: $color_none;
					box-shadow: $shadow-7;
				}
			}
		}
	}
}
#loginModal {
	.rounded-circle {
		border: $solid $b-width-6 $color_442;
		box-shadow: $shadow-1;
	}
}
#registerModal {
	.rounded-circle {
		border: $solid $b-width-6 $color_442;
		box-shadow: $shadow-1;
	}
}
.modal-components {
	.modal {
		position: $pos-rel;
		display: block;
		z-index: 5;
	}
}
.modal-title {
	font-size: 14px;
	color: $additional-color-5;
	font-weight: 600;
	margin-top: $m-0;
}
.modal-heading {
	color: $additional-color-11;
	font-size: 1.5rem;
}
.modal-text {
	color: $color_117;
}
/*      Tooltips and Popovers       */
.tooltip-popovers-content {
	#exampleModalPopovers {
		a {
			color: $color_56;
		}
	}
}
/*  Scrolling-long Content    */
.scrolling-long-content {
	.modal-content {
		.modal-header {
			.modal-title {
				font-size: 16px;
				color: $color_56;
			}
		}
		.modal-body {
			.instruction {
				strong {
					color: $color_57;
					font-weight: 600;
					text-transform: $transform-upper;
				}
				.description {
					color: $additional-color-6;
					margin-bottom: $m-30;
					margin-top: 6px;
					a {
						color: $color_55;
						font-weight: normal;
					}
				}
				.picture {
					img {
						border-radius: 50% !important;
						width: 70px;
						height: 70px;
					}
				}
			}
			>p {
				color: $additional-color-11;
			}
		}
	}
}
/*  Success Alert     */
.success-alert {
	#exampleSuccessAlert {
		.modal-body {
			i {
				font-size: 90px;
				color: $color_55;
			}
			.modal-title {
				font-size: 22px;
				color: $additional-color-5;
			}
		}
	}
}
/*  Danger Alert     */
.danger-alert {
	#exampleDangerAlert {
		.modal-body {
			i {
				font-size: 90px;
				color: $color_149;
			}
			.modal-title {
				font-size: $fs-18;
				color: $color_59;
			}
		}
	}
}
/*Modal Video*/
.modal-video {
	/*  Video Container     */
	.video-container {
		position: $pos-rel;
		padding-bottom: 56.25%;
		padding-top: $p-30;
		height: 0;
		overflow: hidden;
		iframe {
			position: $pos-abs;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}
		object {
			position: $pos-abs;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}
		embed {
			position: $pos-abs;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}
	}
	.modal#videoMedia1 {
		.modal-content {
			background-color: $color_none;
			border: none;
		}
		.modal-header {
			border-bottom: none;
			padding: $p-0;
			.close {
				color: $white !important;
				opacity: 1;
			}
		}
		.modal-body {
			background: $black;
		}
	}
	.modal#videoMedia2 {
		.modal-content {
			background-color: $color_none;
			border: none;
		}
		.modal-header {
			border-bottom: none;
			padding: $p-0;
			.close {
				color: $white !important;
				opacity: 1;
			}
		}
		.modal-body {
			background: $black;
		}
	}
}
/*  Sign In Model    */
.signinModal-content {
	#signinModal {
		.modal-content {
			border: none;
			border-radius: 0;
		}
		.modal-body {
			padding: $p-0;
			.right-section {
				background-color: $color_47;
			}
			h4.form-info-title {
				color: $white;
				margin-top: 87px !important;
				text-transform: inherit;
			}
			button {
				border: none;
			}
			.modal-title {
				font-size: 1.5rem;
				color: $color_149;
			}
		}
	}
}
/*Login*/
.modal#loginModal {
	.modal-content {
		.modal-body {
			.division {
				float: none;
				margin: $m-0 auto 18px;
				overflow: hidden;
				position: $pos-rel;
				text-align: $align-center;
				width: 100%;
				color: $additional-color-4;
				.line {
					border-top: $b-width-1 $solid $color_84;
					position: $pos-abs;
					top: 10px;
					width: 34%;
				}
				.line.line-left {
					left: 0;
				}
				.line.line-right {
					right: 0;
				}
			}
		}
	}
}
/*Register*/
.modal#registerModal {
	.modal-content {
		.modal-body {
			.division {
				float: none;
				margin: $m-0 auto 18px;
				overflow: hidden;
				position: $pos-rel;
				text-align: $align-center;
				width: 100%;
				color: $additional-color-4;
				.line {
					border-top: $b-width-1 $solid $additional-color-4;
					position: $pos-abs;
					top: 10px;
					width: 34%;
				}
				.line.line-left {
					left: 0;
				}
				.line.line-right {
					right: 0;
				}
			}
		}
	}
}
/* Slider */
.modal#sliderModal {
	.modal-content {
		border: $b-width-1 $solid $color_none;
		background-color: $color_none;
		.modal-body {
			a.carousel-control-prev {
				span.carousel-control-prev-icon {
					position: $pos-abs;
					bottom: 14px;
					left: 7px;
					background-image: none;
					color: $additional-color-11;
				}
				span.carousel-control-prev-text {
					position: $pos-abs;
					bottom: 17px;
					left: 30px;
					color: $additional-color-11;
				}
			}
			a.carousel-control-next {
				span.carousel-control-next-icon {
					position: $pos-abs;
					bottom: 14px;
					right: 7px;
					background-image: none;
					color: $additional-color-11;
				}
				span.carousel-control-next-text {
					position: $pos-abs;
					bottom: 17px;
					right: 30px;
					color: $additional-color-11;
				}
			}
			button.close {
				position: $pos-abs;
				z-index: 2;
				right: 16px;
				top: 13px;
				opacity: 1;
				text-shadow: none;
				&:hover {
					color: $light-gray;
				}
			}
		}
	}
}
.carousel-indicators {
	li {
		background-color: $color_38;
	}
	.active {
		background-color: $additional-color-5;
	}
}
/*      Advance Modal         */
.advance-content {
	/*Basic*/
	#basicModal {
		.modal-content {
			.modal-header {
				border: none;
			}
			.modal-title {
				font-size: 1.5rem;
				color: $black;
			}
			.modal-text {
				color: $color_441;
			}
			.modal-footer {
				border: none;
			}
		}
	}
	/*Advance*/
	#standardModal {
		.modal-content {
			.modal-header {
				border: none;
				i {
					font-size: 1.9em;
					background-color: $light-gray;
					padding: 13px;
					border-radius: 50%;
				}
			}
			.modal-title {
				font-size: 1.5rem;
				color: $black;
			}
			.modal-text {
				color: $color_441;
			}
			.modal-footer {
				border: none;
			}
		}
	}
}
/*  Nifty Modals */
.nifty-modals {
	.btn-block {
		width: 90%;
	}
}
@media (max-width: 991px) {
	/*  Sign In Model    */
	.signinModal-content {
		#signinModal {
			.modal-body {
				h4.form-info-title {
					margin-top: $m-150 !important;
				}
			}
		}
	}
}
@media (max-width: 575px) {
	/*  Sign In Model    */
	.signinModal-content {
		#signinModal {
			.modal-body {
				h4.form-info-title {
					margin-top: $m-0 !important;
				}
				padding: $p-0 15px $p-0 15px;
			}
		}
	}
}
