/**
 * Password form — base front-end styles.
 *
 * @package wpepp
 * @since   2.0.0
 */

.wpepp-password-form {
	max-width: 480px;
	margin: 2em auto;
	padding: 2em;
	border-radius: 8px;
	text-align: center;
}

/* Logo */
.wpepp-form-logo {
	text-align: center;
	margin-bottom: 1.2em;
}
.wpepp-form-logo img {
	display: inline-block;
	max-width: 100%;
}
.wpepp-form-logo-text {
	display: inline-block;
	font-weight: 700;
	line-height: 1.3;
}

.wpepp-password-top-text,
.wpepp-password-bottom-text {
	margin-bottom: 1.5em;
}

.wpepp-password-top-text h3,
.wpepp-password-bottom-text h3 {
	margin: 0 0 0.5em;
	font-size: 1.3em;
}

.wpepp-password-top-text p,
.wpepp-password-bottom-text p {
	margin: 0;
	color: #555;
}

.wpepp-password-form-inner {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	align-items: flex-end;
	margin: 1.5em 0;
}

form.wpepp-password-form-inner p {
	margin: 0;
}

.wpepp-password-form-inner label {
	display: block;
	font-weight: 600;
	margin-bottom: 4px;
	font-size: 14px;
}

.wpepp-password-form input[type="password"] {
	padding: 8px 12px;
	border: 1px solid #949494;
	border-radius: 4px;
	font-size: 14px;
	min-width: 200px;
	box-sizing: border-box;
}

.wpepp-submit input[type="submit"] {
	display: inline-block;
	padding: 8px 20px;
	background: #2271b1;
	color: #fff;
	border: none;
	border-radius: 4px;
	font-size: 14px;
	cursor: pointer;
	transition: background 0.2s;
}

.wpepp-submit input[type="submit"]:hover {
	background: #135e96;
}

.wpepp-error-message {
	color: #d63638;
	font-size: 13px;
	margin-top: 0.5em;
}

/* Social Icons */
.wpepp-social-icons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 1em 0;
}

/* Social alignment */
.wpepp-social-icons.wpepp-social-left {
	justify-content: flex-start;
}
.wpepp-social-icons.wpepp-social-center {
	justify-content: center;
}
.wpepp-social-icons.wpepp-social-right {
	justify-content: flex-end;
}

.wpepp-social-icons a.wpepp-social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 0;
	color: #fff;
	text-decoration: none;
	transition: background 0.3s, color 0.3s, opacity 0.3s;
}

.wpepp-social-icons a.wpepp-social-icon:hover {
	opacity: 0.85;
}

/* Icon shapes */
.wpepp-icon-shape-circle a.wpepp-social-icon {
	border-radius: 50%;
	width: 40px;
	height: 40px;
}
.wpepp-icon-shape-quarter a.wpepp-social-icon {
	border-radius: 30%;
}

/* Social icon brand colours — using .wpepp-social-icons a. for specificity */
.wpepp-social-icons a.wpepp-social-facebook {
	background: #4862A3;
}
.wpepp-social-icons a.wpepp-social-facebook:hover {
	background: #375192;
}
.wpepp-social-icons a.wpepp-social-twitter {
	background: #000;
}
.wpepp-social-icons a.wpepp-social-twitter:hover {
	background: #2a2a2a;
}
.wpepp-social-icons a.wpepp-social-youtube {
	background: #E02F2F;
}
.wpepp-social-icons a.wpepp-social-youtube:hover {
	background: #c52323;
}
.wpepp-social-icons a.wpepp-social-instagram {
	background: #000;
}
.wpepp-social-icons a.wpepp-social-instagram:hover {
	background: #312a2a;
}
.wpepp-social-icons a.wpepp-social-linkedin {
	background: #007BB5;
}
.wpepp-social-icons a.wpepp-social-linkedin:hover {
	background: #0671a4;
}
.wpepp-social-icons a.wpepp-social-pinterest {
	background: #B31217;
}
.wpepp-social-icons a.wpepp-social-pinterest:hover {
	background: #a91015;
}
.wpepp-social-icons a.wpepp-social-tumblr {
	background: #001935;
}
.wpepp-social-icons a.wpepp-social-tumblr:hover {
	background: #021428;
}
.wpepp-social-icons a.wpepp-social-custom {
	background: #25ACE3;
}
.wpepp-social-icons a.wpepp-social-custom:hover {
	background: #229bcc;
}

.wpepp-social-icons svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.wpepp-social-icons a svg {
	padding: 0;
}

/* Style 2 — inline with shadow card */
.wpepp-style-two {
	background: #ededed;
	border: none;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	border-radius: 5px;
	max-width: 600px;
}

.wpepp-style-two .wpepp-password-form-inner {
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-end;
}

.wpepp-style-two .wpepp-password-form-inner > p:first-child {
	flex: 1 1 auto;
	margin: 0;
}

.wpepp-style-two .wpepp-password-form-inner > .wpepp-submit {
	flex: 0 0 auto;
	margin: 0;
}

.wpepp-style-two .wpepp-password-form-inner input[type="password"] {
	width: 100%;
}

.wpepp-style-two .wpepp-password-form-inner input[type="submit"] {
	min-width: 150px;
	white-space: nowrap;
}

/* Style 3 — dark purple card */
.wpepp-style-three {
	background: #42276A;
	box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
	color: #fff;
}

.wpepp-style-three h1,
.wpepp-style-three h2,
.wpepp-style-three h3,
.wpepp-style-three h4,
.wpepp-style-three span,
.wpepp-style-three p,
.wpepp-style-three label {
	color: #fff;
}

.wpepp-style-three .wpepp-password-form-inner {
	flex-direction: column;
	max-width: 500px;
	margin: 20px auto;
	padding: 50px;
	background: transparent;
	box-shadow:
		rgb(0 0 0 / 6%) 0px 54px 55px,
		rgb(0 0 0 / 12%) 0px -12px 30px,
		rgb(0 0 0 / 12%) 0px 4px 6px,
		rgb(0 0 0 / 17%) 0px 12px 13px,
		rgb(0 0 0 / 9%) 0px -3px 5px;
}

.wpepp-style-three .wpepp-password-form-inner p {
	width: 100%;
}

.wpepp-style-three .wpepp-password-form-inner input {
	width: 100%;
}

/* Style 4 — vertical full-width */
.wpepp-style-four {
	max-width: 100%;
	min-height: 50vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border-radius: 0;
	padding: 50px 20px;
}

.wpepp-style-four .wpepp-password-form-inner {
	flex-direction: column;
	max-width: 500px;
	background: #ededed;
	box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;
	margin: 20px auto;
	padding: 50px;
}

.wpepp-style-four .wpepp-password-form-inner p {
	width: 100%;
}

.wpepp-style-four .wpepp-password-form-inner input {
	width: 100%;
}

/* Bottom text alignment */
.wpepp-password-bottom-text.wpepp-text-left,
.wpepp-password-bottom-text.wpepp-text-left p {
	text-align: left;
}
.wpepp-password-bottom-text.wpepp-text-center,
.wpepp-password-bottom-text.wpepp-text-center p {
	text-align: center;
}
.wpepp-password-bottom-text.wpepp-text-right,
.wpepp-password-bottom-text.wpepp-text-right p {
	text-align: right;
}

/* Error text */
.wpepp-error-message.wpepp-error-bottom {
	margin-top: 1em;
}

/* Social icons middle position spacing */
.wpepp-social-icons.wpepp-social-middle {
	margin: 5px 0;
}