/* ======================================================
   <!-- Login Templates -->
/* ====================================================== */
@import '@uixkit/core/_global/scss/mixins';
@import '@uixkit/core/_global/scss/functions';
@import '@uixkit/core/_global/scss/variables';

$white: #ffffff;
$black: #000000;
$dark-gray: lighten($black, 20%);
$gray: lighten($black, 40%);
$light-gray: lighten($black, 60%);
$lighter-gray: lighten($black, 80%);

/* Form Module */
.uix-special-login__container {
	position: relative;
	background: $white;
	max-width: 400px;
	width: 100%;
	overflow: hidden;
	margin: 0 auto;
	@include outer-shadow( 'regular' );
	border-radius: 8px;

	.uix-striking-msg {
		position: absolute;
		top: -10px;
		right: 50px;
		z-index: 1;
	}

	.uix-special-login__toggle {
		cursor: pointer;
		position: absolute;
		top: -60px;
		right: -65px;
		width: 110px;
		height: 110px;
		margin: -5px 0 0;
		color: $white;
		line-height: 30px;
		transform-origin: center center;
		text-align: center;
		transform: rotate(45deg);
		overflow: hidden;


		> span {
			display: inline-block;
			transform: rotate(-45deg) translate(-57px,58px);

			i {
				color: #333;
				font-size: 50px;

				&:last-child {
					display: none;
				}
			}

		}

	}
	.uix-special-login__form {
		overflow: hidden;
		height: auto;

		> div {
			padding: 80px 40px;
		}

		&:nth-last-child(2) {
			height: 0;
		}

	}


	.uix-special-login__bottom {
		background: darken($white, 5%);
		width: 100%;
		padding: .5rem 1rem;
		box-sizing: border-box;
		color: $gray;
		font-size: 0.875rem;
		text-align: center;

		a {
			color: $dark-gray;
			text-decoration: none;
		}
	}

}