/**
 * Hub Prompt Gallery — 认证与常规页面样式
 * 参考 BW2 Design System：Field 输入框、Button 渐变 CTA、Card 圆角边框
 */

/* ========== 认证页布局 ========== */
.hub-auth-page-main {
	min-height: calc(100vh - 12rem);
	display: flex;
	flex-direction: column;
}

.hub-auth-page-layout {
	width: 100%;
	margin-inline: auto;
}

.hub-pg-header-shell--auth .hub-pg-header-tag {
	margin: 0;
}

/* ========== 认证表单（BW2 Field 对齐） ========== */
.hub-auth-form {
	width: 100%;
}

.hub-auth-form__shell {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.hub-auth-form__shell::before {
	content: "";
	position: absolute;
	inset: -35% auto auto -15%;
	width: 55%;
	height: 55%;
	background: radial-gradient(
		circle,
		color-mix(in srgb, var(--wp--preset--color--accent-1, #7c3aed) 18%, transparent) 0%,
		transparent 70%
	);
	pointer-events: none;
	z-index: 0;
}

.hub-auth-form__shell > * {
	position: relative;
	z-index: 1;
}

.hub-auth-form__masthead {
	margin-bottom: clamp(1.25rem, 3vw, 1.75rem);
}

.hub-auth-form__eyebrow {
	margin: 0 0 0.45rem;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent-glow, #22d3ee);
}

.hub-auth-form__heading {
	margin: 0;
	font-family: var(--wp--preset--font-family--fraunces, Georgia, serif);
	font-size: clamp(1.55rem, 3.8vw, 2rem);
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -0.02em;
}

.hub-auth-form__tagline {
	margin: 0.5rem 0 0;
	font-size: 0.94rem;
	line-height: 1.6;
	color: var(--wp--preset--color--muted, #71717a);
}

.hub-auth-form__notices {
	margin-bottom: 1rem;
}

.hub-auth-form__notice {
	margin: 0 0 0.5rem;
	padding: 0.65rem 0.85rem;
	border-radius: var(--hub-radius-sm, 8px);
	font-size: 0.8125rem;
	line-height: 1.45;
	font-weight: 550;
}

.hub-auth-form__notice--error {
	background: color-mix(in srgb, #fe5938 12%, #ffffff);
	border: 1px solid color-mix(in srgb, #fe5938 35%, transparent);
	color: #9a3412;
}

.hub-auth-form__notice--success {
	background: color-mix(in srgb, #22c55e 10%, #ffffff);
	border: 1px solid color-mix(in srgb, #22c55e 30%, transparent);
	color: #166534;
}

.hub-auth-form__form {
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}

.hub-auth-form__field {
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
}

.hub-auth-form__label-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
}

.hub-auth-form__label {
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--contrast, #09090b);
}

.hub-auth-form__inline-link {
	font-size: 0.75rem;
	font-weight: 550;
	color: var(--wp--preset--color--muted, #71717a);
	text-decoration: none;
	opacity: 0.85;
	transition: opacity 0.2s ease, color 0.2s ease;
	cursor: pointer;
}

.hub-auth-form__inline-link:hover,
.hub-auth-form__inline-link:focus-visible {
	opacity: 1;
	color: var(--wp--preset--color--accent-1, #7c3aed);
}

.hub-auth-form__input-wrap {
	position: relative;
}

.hub-auth-form__input {
	width: 100%;
	height: 3rem;
	padding: 0 1.1rem;
	border: 1.5px solid #e2e2e2;
	border-radius: var(--hub-radius-md, 12px);
	background: #fcfcfc;
	font-family: inherit;
	font-size: 0.8125rem;
	line-height: 1.25;
	color: var(--wp--preset--color--contrast, #09090b);
	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		background 0.2s ease;
}

.hub-auth-form__input-wrap .hub-auth-form__input {
	padding-right: 3rem;
}

.hub-auth-form__input::placeholder {
	color: #7b7b7b;
}

.hub-auth-form__input:hover {
	box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.12);
}

.hub-auth-form__input:focus {
	outline: none;
	border-color: color-mix(
		in srgb,
		var(--wp--preset--color--accent-1, #7c3aed) 45%,
		#e2e2e2
	);
	box-shadow:
		0 1px 4px -1px rgba(0, 0, 0, 0.12),
		0 0 0 3px color-mix(in srgb, var(--wp--preset--color--accent-1, #7c3aed) 14%, transparent);
	background: #ffffff;
}

.hub-auth-form__toggle-pwd {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 3rem;
	border: none;
	background: transparent;
	cursor: pointer;
	opacity: 0.65;
	transition: opacity 0.2s ease;
}

.hub-auth-form__toggle-pwd:hover,
.hub-auth-form__toggle-pwd:focus-visible {
	opacity: 1;
	outline: none;
}

.hub-auth-form__toggle-pwd::before {
	content: "";
	display: block;
	width: 1.25rem;
	height: 1.25rem;
	margin: 0 auto;
	background-color: #7b7b7b;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M2.11 9.267l-.652-.371h0l.652.371zm15.883 0l.652-.371h0l-.652.371zM2.11 10.736l-.652.371h0l.652-.371zm15.883 0l.652.371h0l-.652-.371zM2.11 9.267l.652.371c1.912-3.356 4.651-4.929 7.29-4.929s5.378 1.573 7.29 4.929l.652-.371.652-.371c-2.12-3.721-5.306-5.686-8.593-5.686S3.578 5.175 1.458 8.896l.652.371zm0 1.469l-.652.371c2.12 3.721 5.306 5.686 8.593 5.686s6.473-1.965 8.593-5.686l-.652-.371-.652-.371c-1.912 3.356-4.651 4.929-7.29 4.929s-5.378-1.573-7.29-4.929l-.652.371zm0-1.469l-.652-.371c-.391.685-.391 1.526 0 2.211l.652-.371.652-.371c-.128-.225-.128-.501 0-.726l-.652-.371zm15.883 0l-.652.371c.128.225.128.501 0 .726l.652.371.652.371c.391-.685.391-1.526 0-2.211l-.652.371z'/%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
}

.hub-auth-form__toggle-pwd.is-visible::before {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M7.652 3.563a.75.75 0 1 0 .432 1.436l-.432-1.436zm10.339 5.7l.652-.371h0l-.652.371z'/%3E%3C/svg%3E");
}

.hub-auth-form__remember {
	margin: 0;
}

.hub-auth-form__checkbox {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--muted, #71717a);
	cursor: pointer;
}

.hub-auth-form__checkbox input {
	width: 1rem;
	height: 1rem;
	accent-color: var(--wp--preset--color--accent-1, #7c3aed);
	cursor: pointer;
}

.hub-auth-form__hint {
	margin: 0;
	font-size: 0.75rem;
	line-height: 1.55;
	color: var(--wp--preset--color--muted, #71717a);
}

.hub-auth-form__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 0.35rem;
}

/* BW2 Button primary + theme accent blend */
.hub-auth-form__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.5rem;
	padding: 0.55rem 1.35rem;
	border-radius: var(--hub-radius-md, 12px);
	font-family: inherit;
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.25;
	text-decoration: none;
	cursor: pointer;
	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease,
		background 0.2s ease,
		border-color 0.2s ease;
	border: none;
}

.hub-auth-form__btn--primary {
	background: linear-gradient(
		135deg,
		var(--wp--preset--color--accent-1, #7c3aed) 0%,
		color-mix(in srgb, var(--wp--preset--color--accent-1, #7c3aed) 78%, #09090b) 100%
	);
	color: #ffffff;
	box-shadow:
		0 3px 4px -1px rgba(124, 58, 237, 0.35),
		inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.hub-auth-form__btn--primary:hover,
.hub-auth-form__btn--primary:focus-visible {
	box-shadow: 0 10px 28px -6px rgba(124, 58, 237, 0.45);
	transform: translateY(-1px);
}

.hub-auth-form__btn--ghost {
	background: transparent;
	color: var(--wp--preset--color--contrast, #09090b);
	border: 1px solid var(--hub-glass-border, #e4e4e7);
}

.hub-auth-form__btn--ghost:hover,
.hub-auth-form__btn--ghost:focus-visible {
	background: color-mix(in srgb, var(--wp--preset--color--surface, #f4f4f5) 80%, transparent);
}

.hub-auth-form__footer {
	margin-top: 1.35rem;
	padding-top: 1.15rem;
	border-top: 1px solid var(--hub-glass-border, rgba(9, 9, 11, 0.07));
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--wp--preset--color--muted, #71717a);
}

.hub-auth-form__footer p {
	margin: 0 0 0.35rem;
}

.hub-auth-form__footer a {
	color: var(--wp--preset--color--accent-1, #7c3aed);
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.hub-auth-form__footer a:hover,
.hub-auth-form__footer a:focus-visible {
	text-decoration: underline;
}

.hub-auth-form__muted-link {
	font-weight: 550 !important;
	opacity: 0.85;
}

/* ========== 404 / 常规错误页 ========== */
.hub-error-page-main {
	min-height: calc(100vh - 14rem);
}

.hub-error-page-layout {
	margin-inline: auto;
}

.hub-error-card {
	text-align: center;
}

.hub-error-card__code {
	margin: 0;
	font-family: var(--wp--preset--font-family--fraunces, Georgia, serif);
	background: linear-gradient(
		135deg,
		var(--wp--preset--color--accent-glow, #22d3ee),
		var(--wp--preset--color--accent-1, #7c3aed)
	);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.hub-error-card__title {
	font-family: var(--wp--preset--font-family--fraunces, Georgia, serif);
}

.hub-error-card__search {
	max-width: 22rem;
	margin-inline: auto;
}

.hub-error-card__search .wp-block-search__inside-wrapper {
	border: 1.5px solid #e2e2e2;
	border-radius: var(--hub-radius-md, 12px);
	background: #fcfcfc;
	overflow: hidden;
}

.hub-error-card__search .wp-block-search__input {
	border: none;
	font-size: 0.8125rem;
	padding: 0.65rem 1rem;
}

.hub-error-card__search .wp-block-search__button {
	background: var(--wp--preset--color--accent-1, #7c3aed);
	color: #fff;
	border: none;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
}

.hub-error-card__actions {
	justify-content: center;
}

.hub-error-btn-ghost .wp-block-button__link {
	background: transparent !important;
	border: 1px solid var(--hub-glass-border, #e4e4e7) !important;
	color: var(--wp--preset--color--contrast, #09090b) !important;
	border-radius: var(--hub-radius-md, 12px) !important;
	cursor: pointer;
}

/* ========== wp-login.php 后备样式 ========== */
body.login {
	background: #fafafa;
	background-image:
		radial-gradient(ellipse 120% 85% at 10% -14%, rgba(124, 58, 237, 0.1), transparent 56%),
		linear-gradient(168deg, #fafafa 0%, #f4f4f5 44%, #fafafa 100%);
	font-family: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
}

body.login #login {
	width: min(92vw, 26rem);
	padding-top: 6vh;
}

body.login #login h1 a {
	background-size: contain;
	width: 100%;
	height: 3rem;
}

body.login form {
	border: 1px solid rgba(9, 9, 11, 0.07);
	border-radius: 18px;
	box-shadow: var(--hub-shadow-soft, 0 2px 8px rgba(9, 9, 11, 0.05));
	background: rgba(255, 255, 255, 0.88);
}

body.login form .input,
body.login input[type="text"],
body.login input[type="password"],
body.login input[type="email"] {
	border: 1.5px solid #e2e2e2;
	border-radius: 12px;
	font-size: 0.8125rem;
}

body.login .button-primary {
	background: #7c3aed !important;
	border-color: #7c3aed !important;
	border-radius: 12px !important;
	text-shadow: none !important;
	box-shadow: 0 3px 4px -1px rgba(124, 58, 237, 0.35) !important;
}

@media (prefers-reduced-motion: reduce) {
	.hub-auth-form__btn--primary:hover,
	.hub-auth-form__btn--primary:focus-visible {
		transform: none;
	}
}