.lhc-alert-form {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 28px auto 0;
	padding: 24px;
	border: 1px solid var(--lhc-color-border, #d8e0e7);
	border-left: 4px solid var(--lhc-brand-blue, #1687F8);
	border-radius: 16px;
	background: var(--lhc-surface-soft, #f6f9ff);
	color: var(--lhc-ink, #102033);
}

.lhc-alert-form * {
	box-sizing: border-box;
}

.lhc-alert-form h2 {
	font-weight: 800;
	margin: 0 0 6px;
	color: var(--lhc-ink-strong, #08182c);
	font-size: var(--lhc-type-h3-size, 20px);
	letter-spacing: 0;
}

.lhc-alert-form > p {
	margin: 0 0 18px;
	color: var(--lhc-muted, #5c6b7a);
	font-size: var(--lhc-type-small-size, 13px);
}

.lhc-alert-fields {
	display: flex;
	flex-wrap: wrap;
	gap: 14px 16px;
}

.lhc-alert-fields p {
	margin: 0;
}

.lhc-alert-fields label {
	display: grid;
	gap: 6px;
	color: var(--lhc-ink, #102033);
	font-size: var(--lhc-type-small-size, 13px);
	font-weight: 700;
}

/* Column widths are sized to what each field actually holds — email and
   school need more room for long values, budgets and dropdowns don't.
   All seven fields (including frequency) share one flex row; the basis
   widths are kept narrow on purpose so frequency does not wrap alone
   onto its own full-width row at typical desktop/tablet widths. */
.lhc-alert-fields p:nth-child(1) { flex: 1.2 1 180px; }  /* Email */
.lhc-alert-fields p:nth-child(2) { flex: 0.9 1 110px; }  /* Listing type */
.lhc-alert-fields p:nth-child(3) { flex: 1.3 1 170px; }  /* School */
.lhc-alert-fields p:nth-child(4) { flex: 1 1 120px; }    /* Area */
.lhc-alert-fields p:nth-child(5) { flex: 0.7 1 90px; }   /* Min budget */
.lhc-alert-fields p:nth-child(6) { flex: 0.7 1 90px; }   /* Max budget */
.lhc-alert-fields p:nth-child(7) { flex: 0.9 1 110px; }  /* Frequency */

.lhc-alert-fields input,
.lhc-alert-fields select {
	box-sizing: border-box;
	width: 100%;
	min-height: 44px;
	padding: 9px 12px;
	border: 1px solid var(--lhc-color-border, #d8e0e7);
	border-radius: 8px;
	background: var(--lhc-surface, #fff);
	color: var(--lhc-ink, #102033);
	font: inherit;
	/* v1.0.233: `font: inherit` above pulls in every font property from the
	   parent <label> -- including its own font-weight: 700 two rules up,
	   meant only for the small field-name text (邮箱/学校/提醒频率/etc). That
	   700 weight was landing on the actual field values too (typed input
	   text, and a <select>'s displayed selected option, e.g. "住宿"/"每天"),
	   which read as unintentionally bold. Reset back to normal weight here,
	   after `font: inherit`, so only the field-name labels stay bold. */
	font-weight: 400;
}

.lhc-alert-fields input:focus,
.lhc-alert-fields select:focus {
	outline: none;
	border-color: var(--lhc-brand-blue, #1687F8);
	box-shadow: 0 0 0 3px rgba(22, 135, 248, 0.15);
}

/* v1.0.184：这颗"发送验证邮件"按钮的圆角其实早就被 frontend.css 里
   .lhc-alert-form button.button 那条更高优先级的规则改成了 999px 胶囊
   （见那条规则上的注释），但 font-size 两边都没写，一直继承浏览器/主题
   默认的按钮字号——全站专项筛查时顺带发现并补上，跟其它胶囊按钮统一
   收到 14px，内边距/最小高度也一起收紧到跟"查看详情"参照尺寸一致。 */
.lhc-alert-form .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 7px 20px;
	border: 1px solid var(--lhc-brand-blue, #1687F8);
	border-radius: 8px;
	background: var(--lhc-brand-action, var(--lhc-brand-blue, #1687F8));
	color: var(--lhc-surface, #fff);
	font-size: 14px;
	font-weight: 700;
	transition: background 140ms ease, box-shadow 140ms ease;
}

.lhc-alert-form .button:hover {
	background: var(--lhc-brand-action-hover, #0f6fd6);
	box-shadow: 0 6px 16px rgba(22, 135, 248, 0.25);
}

.lhc-alert-privacy,
.lhc-alert-safety {
	margin: 0;
	color: var(--lhc-muted, #5c6b7a);
	font-size: var(--lhc-type-eyebrow-size, 12px);
}

.lhc-alert-safety {
	max-width: none;
	margin: 16px 0;
	padding: 12px 16px;
	border-left: 4px solid var(--lhc-color-warning, #b7791f);
	border-radius: 10px;
	background: var(--lhc-color-warning-bg, #fff8e6);
	color: var(--lhc-color-warning, #b7791f);
}

.lhc-alert-admin-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.lhc-alert-admin-actions form {
	margin: 0;
}

@media (max-width: 900px) {
	.lhc-alert-fields p:nth-child(1) { flex-basis: 45%; }
	.lhc-alert-fields p:nth-child(2) { flex-basis: 45%; }
	.lhc-alert-fields p:nth-child(3) { flex-basis: 100%; }
	.lhc-alert-fields p:nth-child(4) { flex-basis: 45%; }
	.lhc-alert-fields p:nth-child(5) { flex-basis: 45%; }
	.lhc-alert-fields p:nth-child(6) { flex-basis: 45%; }
	.lhc-alert-fields p:nth-child(7) { flex-basis: 45%; }
}

@media (max-width: 640px) {
	.lhc-alert-form {
		padding: 18px;
	}

	.lhc-alert-fields p {
		flex-basis: 100% !important;
	}

	.lhc-alert-form .button {
		width: 100%;
	}
}
