/*
Module Name: Variable Compensation (Main CSS)
Author: Prosoft Phils
Author URL: http://prosoft-phils.com/
Description: Main CSS for Global Partials
*/

/*--------------------------------------------------------------
Universal
--------------------------------------------------------------*/
	button,
	input,
	select,
	textarea {
		color: #2F4F4F;
	}

	.login-pg,
	.fp-pg,
	.reset-pg {
		margin-top: 15vh;
		min-height: 65vh;
	}

	img.logo {
	    margin: 0 auto 3rem;
	}

	button[type='submit'] {
		width: 100%;
		box-shadow: 4px 4px 16px #00000029;
	}

	.error {
		color: var(--bs-danger);
	}

	.input-group-text {
		background-color: #fff;
	}

	input[type="text"],
	input[type="password"] {
	    background-color: #fff;
	    background-repeat: no-repeat;
	    background-position: left .5rem center;
	    background-size: 14px;
	    padding: 5px 0.5rem;
	    box-shadow: none !important;
   		outline: 0 !important;
   		background-image: none !important;
	}

	input[type="text"]:focus,
	input[type="password"]:focus {
		border-color: #ced4da;
	}

	#response .alert {
		font-size: 12px;
		line-height: 12px;
		padding: 5px;
	}

	.border-end-0 {
		border-right: none !important;
	}

/*--------------------------------------------------------------
General
--------------------------------------------------------------*/
	.fp-pg .fa-envelope {
		display: block;
		color: #495057;
		border: 1px solid #ced4da;
		border-right: none !important;
		border-radius: 4px 0 0 4px;
		padding: 9px;
	}

	.fp-pg input[name='email'] {
		border-radius:  0 4px 4px 0 !important;
		border-left: none !important;
	}

/*------------------------------------------------------------
Login
-------------------------------------------------------------*/
	input[name="username"] {
		border-left: none !important;
		border-radius: 0 4px 4px 0 !important;
	}

	input[name="username"].is-invalid,
	input[name="password"] + span.is-invalid {
		border-top-right-radius: .25rem !important;
		border-bottom-right-radius: .25rem !important;
	}

	input[name="password"] {
	    border-left: none !important;
	    border-right: none !important;
	}

	input[name="password"] + a {
		min-width: 45px;
	}

	input[name="password"] + span {
		min-width: 47px;
		border-left: none !important;
	}

/*------------------------------------------------------------
Forgot Password
-------------------------------------------------------------*/
	.fp-pg h5 {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.fp-pg h5 a {
		position: absolute;
		left: 0;
	}

	.fp-pg h5 a:hover {
		opacity: 0.6;
	}