#wp-members-bloomi-login {
}
#wpmem_restricted_msg {
	display: flex;
	justify-content: center;
}

.wpmem_msg {
	display: none;
}

.member-area-banner {
	flex: 1 1 100%;
	order: -1;
	display: flex;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 5rem;
	padding-right: 5rem;
	border-top: 3px solid #08395b;
	background: #573f73;
	z-index: 999;
	justify-content: center;
	align-items: center;

	@media (min-width: 701px) {
		order: 0;
	}

	.member-area-banner-content {
		display: grid;
		justify-content: center;
		align-items: center;
		gap: 17px;
		align-self: stretch;

		@media (min-width: 797px) {
			display: flex;
		}

		.icon-banner-content-wrapper {
			display: flex;
			gap: 9px;
			align-items: center;

			svg {
				flex-shrink: 0;
			}

			span.member-area-content {
				color: #fff;
				font-family: "Raleway", sans-serif;
				font-size: 18px;
				font-style: normal;
				line-height: 26px;

				strong {
					font-weight: 700;
				}
			}
		}

		.member-area-cta-button {
			display: flex;
			padding: 12px 46px;
			justify-content: center;
			align-items: center;
			border-radius: 6px;
			background: #fff;
			color: #08395b;
			font-family: "Raleway", sans-serif;
			font-size: 18px;
			font-style: normal;
			font-weight: 500;
			line-height: 20px;
			text-decoration: none;
			width: fit-content;
			margin: 0 auto;
		}
	}
}

/* ========================================
   Bloomi Create Account - Step 1 Styles
   ======================================== */
#wp-members-bloomi-login {
	max-width: 544px;
	margin: 0 auto;
}
#wpmember-bloomi-step-form,
#wp-members-bloomi-login,
#wpmember-bloomi-profile,
#wpmember-change-password,
#wpmember-forgot-password,
#wpmember-bloomi-profile-update {
	.step-content {
		width: 100%;
		text-align: left;
		padding-top: 20px;
		padding-bottom: 20px;
		display: grid;
		gap: 24px;

		.info-wrapper {
			display: grid;
			gap: 7px;
		}

		.profile-fields {
			display: grid;
			gap: 12px;

			.profile-item {
				display: flex;
				align-items: center;
				gap: 9px;

				span:first-child {
					color: #183858;
					font-family: "Raleway", sans-serif;
					font-size: 15px;
					font-style: normal;
					font-weight: 400;
					line-height: 18px;
					flex: 0 0 150px;
				}
				span:last-child {
					color: #08395b;
					font-family: "Raleway", sans-serif;
					font-size: 18px;
					font-style: normal;
					font-weight: 600;
					line-height: 26px;
					letter-spacing: -0.36px;
					flex: 1;
				}
			}
		}

		.update-profile-form {
			.profile-row {
				display: grid;
				grid-template-columns: 155px 1fr;
				align-items: center;
				margin-bottom: 12px;

				label {
					font-family: "Raleway", sans-serif;
					color: #183858;
					font-size: 15px;
					font-style: normal;
					font-weight: 400;
					line-height: 18px;
				}

				input {
					width: 100%;
					font-size: 1.1rem;
					padding: 7px 17px;
					border: 1px solid #949494;
					transition: border-color 0.25s ease;
					color: #08395b;
					font-family: "Raleway", sans-serif;
					font-size: 18px;
					font-style: normal;
					font-weight: 600;
					line-height: 26px;
					letter-spacing: -0.36px;

					margin: unset;
					&:focus {
						border-color: #663f84;
						outline: none;
					}
				}

				.readonly-value {
					color: #08395b;
					font-family: "Raleway", sans-serif;
					font-size: 18px;
					font-style: normal;
					font-weight: 600;
					line-height: 26px;
					letter-spacing: -0.36px;
					display: flex;
					align-items: center;
					gap: 6px;
				}
			}

			.profile-success-message {
				display: flex;
				gap: 9px;
				align-items: center;
				color: #007a00;
				font-family: "Raleway", sans-serif;
				font-size: 15px;
				font-style: normal;
				font-weight: 500;
				line-height: 18px;
			}

			.profile-error-message {
				display: block;
				color: #be0000;
				font-family: "Raleway", sans-serif;
				font-size: 15px;
				font-style: normal;
				font-weight: 500;
				line-height: 18px;

				&::before {
					content: "";
					width: 20px;
					height: 20px;
					flex-shrink: 0;
					background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'><path d='M9.9995 15C10.2332 15 10.4291 14.921 10.5875 14.763C10.7458 14.605 10.825 14.4092 10.825 14.1755C10.825 13.9419 10.746 13.7458 10.588 13.5875C10.43 13.4291 10.2341 13.35 10.0005 13.35C9.76685 13.35 9.57085 13.429 9.4125 13.587C9.25415 13.745 9.175 13.9408 9.175 14.1745C9.175 14.4081 9.254 14.6042 9.412 14.7625C9.57 14.9209 9.76585 15 9.9995 15ZM10.0795 11.175C10.2931 11.175 10.4708 11.1031 10.6125 10.9593C10.7542 10.8156 10.825 10.6375 10.825 10.425V5.6C10.825 5.3875 10.7527 5.20935 10.608 5.0655C10.4635 4.92185 10.2844 4.85 10.0705 4.85C9.85685 4.85 9.67915 4.92185 9.5375 5.0655C9.39585 5.20935 9.325 5.3875 9.325 5.6V10.425C9.325 10.6375 9.39735 10.8156 9.542 10.9593C9.6865 11.1031 9.86565 11.175 10.0795 11.175ZM10.0068 20C8.62775 20 7.3319 19.7375 6.11925 19.2125C4.9064 18.6875 3.84585 17.9708 2.9375 17.0625C2.02917 16.1542 1.3125 15.093 0.7875 13.879C0.2625 12.665 0 11.3679 0 9.9875C0 8.60715 0.2625 7.31 0.7875 6.096C1.3125 4.882 2.02917 3.825 2.9375 2.925C3.84585 2.025 4.907 1.3125 6.121 0.7875C7.335 0.2625 8.63215 0 10.0125 0C11.3928 0 12.69 0.2625 13.904 0.7875C15.118 1.3125 16.175 2.025 17.075 2.925C17.975 3.825 18.6875 4.88335 19.2125 6.1C19.7375 7.31665 20 8.6144 20 9.99325C20 11.3722 19.7375 12.6681 19.2125 13.8807C18.6875 15.0936 17.975 16.1527 17.075 17.058C16.175 17.9632 15.1166 18.6798 13.9 19.208C12.6833 19.736 11.3856 20 10.0068 20ZM10.0125 18.5C12.3708 18.5 14.375 17.6709 16.025 16.0125C17.675 14.3542 18.5 12.3458 18.5 9.9875C18.5 7.62915 17.6766 5.625 16.0298 3.975C14.3829 2.325 12.373 1.5 10 1.5C7.65 1.5 5.64585 2.32342 3.9875 3.97025C2.32917 5.6171 1.5 7.627 1.5 10C1.5 12.35 2.32917 14.3542 3.9875 16.0125C5.64585 17.6709 7.65415 18.5 10.0125 18.5Z' fill='%23BE0000'/></svg>")
						no-repeat center center;
					background-size: contain;
					display: inline-block;
					vertical-align: middle;
					margin-right: 5px;
				}
			}
		}

		.step-title {
			color: #000;
			font-family: "Raleway", sans-serif;
			font-size: 24px;
			font-style: normal;
			font-weight: 700;
			line-height: 110%;
			letter-spacing: -0.24px;
			margin: unset;
		}

		.step-description {
			color: #183858;
			font-family: "Raleway", sans-serif;
			font-size: 15px !important;
			font-style: normal;
			font-weight: 400;
			line-height: 22px !important;
			margin: unset;

			.profile-links-wrapper {
				display: flex;
				gap: 20px;

				a {
					display: flex;
					align-items: center;
					gap: 6px;
				}
			}

			a {
				color: #573f73;
				font-family: "Raleway", sans-serif;
				font-size: 15px;
				font-style: normal;
				font-weight: 400;
				line-height: 18px;
				text-decoration-line: underline;
				text-decoration-style: solid;
				text-decoration-skip-ink: auto;
				text-decoration-thickness: auto;
				text-underline-offset: auto;
				text-underline-position: from-font;
				&:hover {
					text-decoration: none;
				}
			}
		}

		.login-form-links {
			display: flex;
			gap: 2rem;
			justify-content: center;
			a {
				color: #573f73;
				font-family: "Raleway", sans-serif;
				font-size: 15px;
				font-style: normal;
				font-weight: 400;
				line-height: 18px;
				text-decoration-line: underline;
				text-decoration-style: solid;
				text-decoration-skip-ink: auto;
				text-decoration-thickness: auto;
				text-underline-offset: auto;
				text-underline-position: from-font;
				&:hover {
					text-decoration: none;
				}
			}
		}

		.wp-bloomi-form {
			&.form-disabled {
				opacity: 0.7;
				pointer-events: none;
			}

			.form-group {
				margin: unset;
				border: unset;
				padding: unset;
				display: grid;
				gap: 9px;

				.form-group-item {
					display: grid;
					gap: 9px;
				}

				label {
					/* display: flex;
					align-items: center;
					gap: 0; */
					color: #183858;
					font-family: "Raleway", sans-serif;
					font-size: 18px;
					font-style: normal;
					font-weight: 400;
					line-height: 22px;
					margin: unset;

					&.checbox {
						gap: 16px;
					}
				}

				input[name="email"],
				input[name="first_name"],
				input[name="last_name"],
				input[name="foundation"],
				input[name="foundation_role"],
				input[name="log"],
				input[name="pwd"],
				input[name="password"],
				input[name="confirm_password"],
				input[name="user"] {
					width: 100%;
					font-size: 1.1rem;
					padding: 7px 17px;
					border: 1px solid #949494;
					transition: border-color 0.25s ease;
					color: #08395b;
					font-family: "Raleway", sans-serif;
					font-size: 18px;
					font-style: normal;
					font-weight: 600;
					line-height: 26px;
					letter-spacing: -0.36px;
					margin: unset;
					&:focus {
						border-color: #663f84;
						outline: none;
					}
				}

				.form-note {
					display: block;
					color: #183858;
					font-family: "Raleway", sans-serif;
					font-size: 15px;
					font-style: italic;
					font-weight: 400;
					line-height: 18px;
					margin: unset;
				}

				.form-error-message {
					display: block;
					color: #be0000;
					font-family: "Raleway", sans-serif;
					font-size: 15px;
					font-style: normal;
					font-weight: 500;
					line-height: 18px;

					&::before {
						content: "";
						width: 20px;
						height: 20px;
						flex-shrink: 0;
						background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'><path d='M9.9995 15C10.2332 15 10.4291 14.921 10.5875 14.763C10.7458 14.605 10.825 14.4092 10.825 14.1755C10.825 13.9419 10.746 13.7458 10.588 13.5875C10.43 13.4291 10.2341 13.35 10.0005 13.35C9.76685 13.35 9.57085 13.429 9.4125 13.587C9.25415 13.745 9.175 13.9408 9.175 14.1745C9.175 14.4081 9.254 14.6042 9.412 14.7625C9.57 14.9209 9.76585 15 9.9995 15ZM10.0795 11.175C10.2931 11.175 10.4708 11.1031 10.6125 10.9593C10.7542 10.8156 10.825 10.6375 10.825 10.425V5.6C10.825 5.3875 10.7527 5.20935 10.608 5.0655C10.4635 4.92185 10.2844 4.85 10.0705 4.85C9.85685 4.85 9.67915 4.92185 9.5375 5.0655C9.39585 5.20935 9.325 5.3875 9.325 5.6V10.425C9.325 10.6375 9.39735 10.8156 9.542 10.9593C9.6865 11.1031 9.86565 11.175 10.0795 11.175ZM10.0068 20C8.62775 20 7.3319 19.7375 6.11925 19.2125C4.9064 18.6875 3.84585 17.9708 2.9375 17.0625C2.02917 16.1542 1.3125 15.093 0.7875 13.879C0.2625 12.665 0 11.3679 0 9.9875C0 8.60715 0.2625 7.31 0.7875 6.096C1.3125 4.882 2.02917 3.825 2.9375 2.925C3.84585 2.025 4.907 1.3125 6.121 0.7875C7.335 0.2625 8.63215 0 10.0125 0C11.3928 0 12.69 0.2625 13.904 0.7875C15.118 1.3125 16.175 2.025 17.075 2.925C17.975 3.825 18.6875 4.88335 19.2125 6.1C19.7375 7.31665 20 8.6144 20 9.99325C20 11.3722 19.7375 12.6681 19.2125 13.8807C18.6875 15.0936 17.975 16.1527 17.075 17.058C16.175 17.9632 15.1166 18.6798 13.9 19.208C12.6833 19.736 11.3856 20 10.0068 20ZM10.0125 18.5C12.3708 18.5 14.375 17.6709 16.025 16.0125C17.675 14.3542 18.5 12.3458 18.5 9.9875C18.5 7.62915 17.6766 5.625 16.0298 3.975C14.3829 2.325 12.373 1.5 10 1.5C7.65 1.5 5.64585 2.32342 3.9875 3.97025C2.32917 5.6171 1.5 7.627 1.5 10C1.5 12.35 2.32917 14.3542 3.9875 16.0125C5.64585 17.6709 7.65415 18.5 10.0125 18.5Z' fill='%23BE0000'/></svg>")
							no-repeat center center;
						background-size: contain;
						display: inline-block;
						vertical-align: middle;
						margin-right: 5px;
					}

					a {
						color: #be0000;
					}
				}
				.form-success-message {
					display: flex;
					gap: 9px;
					align-items: center;
					color: #007a00;
					font-family: "Raleway", sans-serif;
					font-size: 15px;
					font-style: normal;
					font-weight: 500;
					line-height: 18px;
				}
			}
		}

		.continue-button,
		.create-account-button,
		.eligibility-modal-button,
		.login-button,
		.reset-password-button,
		.profile-save-button {
			display: flex;
			justify-content: center;
			margin: 0 auto;
			margin-top: 42px;
			color: #fff;
			font-family: "Raleway", sans-serif;
			font-size: 18px;
			font-style: normal;
			font-weight: 500;
			line-height: 20px;
			padding: 12px 46px;
			border-radius: 6px;
			background-color: #573f73;
			cursor: pointer;
			transition: background-color 0.3s ease;

			&:hover {
				background-color: #4d2e64;
			}
		}

		.login-link {
			margin: unset;
			margin-top: 20px;
			display: flex;
			justify-content: center;

			a {
				color: #573f73;
				font-family: "Raleway", sans-serif;
				font-size: 15px;
				font-style: normal;
				font-weight: 400;
				line-height: 18px;
				text-decoration-line: underline;
				text-decoration-style: solid;
				text-decoration-skip-ink: auto;
				text-decoration-thickness: auto;
				text-underline-offset: auto;
				text-underline-position: from-font;

				&:hover {
					text-decoration: none;
				}
			}
		}
	}

	/* Step transition states */
	&.account-step {
		opacity: 0;
		transform: translateY(10px);
		pointer-events: none;

		&.active {
			opacity: 1;
			transform: translateY(0);
			pointer-events: auto;
		}
	}

	/* Responsive adjustments */
	@media (max-width: 600px) {
		.step-content {
			padding: 2rem 1.5rem;

			.step-title {
				font-size: 1.5rem;
			}
		}
	}
}