/**
 * 秉办询盘通 · 前台样式
 *
 * 所有可定制项都是 CSS 变量（写法 var(--bbi-xxx, 默认值)）。
 * 定制方式：给表单元素加一个类（后台「自定义 CSS 类」或短代码 class 参数），然后覆盖变量即可，
 * 不需要 !important，也不会和插件升级冲突。
 *
 * 例：
 *   .my-inquiry-form {
 *     --bbi-primary: #c8a45c;
 *     --bbi-radius: 10px;
 *     --bbi-gap: 18px;
 *   }
 * 也可以写在 :root 或任意父容器上（变量会向下继承）。
 */

.bbi-form-wrap {
	max-width: 100%;
	margin: 0 0 24px;
}

.bbi-form-title {
	margin: 0 0 6px;
	font-size: var(--bbi-title-size, 20px);
	line-height: 1.4;
	color: var(--bbi-title-color, var(--bbi-text, #222));
}

.bbi-form-desc {
	margin: 0 0 16px;
	color: var(--bbi-muted, #666);
	font-size: 14px;
}

.bbi-form {
	margin: 0;
}

.bbi-fields {
	display: flex;
	flex-wrap: wrap;
	margin: 0 calc(var(--bbi-field-gap, 8px) * -1);
}

.bbi-row {
	width: 100%;
	box-sizing: border-box;
	padding: 0 var(--bbi-field-gap, 8px);
	margin: 0 0 var(--bbi-gap, 14px);
}

.bbi-col-half {
	width: 50%;
}

.bbi-col-third {
	width: 33.3333%;
}

.bbi-row-captcha,
.bbi-row-submit {
	width: 100%;
}

@media (max-width: 640px) {
	.bbi-col-half,
	.bbi-col-third {
		width: 100%;
	}
}

.bbi-hidden {
	display: none;
}

.bbi-label {
	display: block;
	margin: 0 0 6px;
	font-size: var(--bbi-font-size, 14px);
	font-weight: 600;
	color: var(--bbi-label, var(--bbi-text, #222));
}

.bbi-required {
	color: var(--bbi-error, #d94f4f);
	margin-left: 2px;
}

.bbi-input {
	width: 100%;
	box-sizing: border-box;
	padding: var(--bbi-input-py, 10px) var(--bbi-input-px, 12px);
	border: 1px solid var(--bbi-border, #d8dde3);
	border-radius: var(--bbi-radius, 4px);
	background: var(--bbi-input-bg, #fff);
	font-size: var(--bbi-font-size, 14px);
	line-height: 1.5;
	color: var(--bbi-text, #222);
	transition: border-color 0.15s;
}

.bbi-input:focus {
	outline: none;
	border-color: var(--bbi-primary, #2271b1);
	box-shadow: 0 0 0 1px var(--bbi-primary, #2271b1);
}

.bbi-textarea {
	min-height: var(--bbi-textarea-h, 96px);
	resize: vertical;
}

.bbi-select {
	height: var(--bbi-select-h, 42px);
}

.bbi-options {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	padding: 4px 0;
}

.bbi-option {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: var(--bbi-font-size, 14px);
	cursor: pointer;
}

.bbi-help {
	margin: 6px 0 0;
	font-size: 12px;
	color: var(--bbi-muted, #666);
}

/* 蜜罐：真人看不到，机器人会填。
   注意：这里靠定位移出屏幕隐藏，不要用 display:none 覆盖它——
   不少机器人会跳过 display:none 的字段，反而让蜜罐失效。 */
.bbi-hp {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.bbi-captcha-box {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.bbi-captcha-img {
	height: var(--bbi-captcha-h, 46px);
	width: var(--bbi-captcha-w, 140px);
	border: 1px solid var(--bbi-border, #d8dde3);
	border-radius: var(--bbi-radius, 4px);
	cursor: pointer;
	background: var(--bbi-captcha-bg, #f6f8fb);
}

.bbi-captcha-question {
	display: inline-block;
	padding: 10px 14px;
	background: var(--bbi-captcha-bg, #f2f4f7);
	border: 1px solid var(--bbi-border, #d8dde3);
	border-radius: var(--bbi-radius, 4px);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 1px;
}

.bbi-captcha-input {
	width: var(--bbi-captcha-input-w, 160px);
}

.bbi-captcha-refresh {
	border: none;
	background: none;
	color: var(--bbi-primary, #2271b1);
	cursor: pointer;
	font-size: 13px;
	padding: 4px;
	text-decoration: underline;
}

/* Cloudflare Turnstile 无感验证 */
.bbi-turnstile {
	margin: 4px 0 2px;
	min-height: 1px;
}

.bbi-turnstile .cf-turnstile {
	min-height: 65px;
}

.bbi-submit {
	display: inline-block;
	padding: var(--bbi-btn-py, 12px) var(--bbi-btn-px, 30px);
	border: none;
	border-radius: var(--bbi-radius, 4px);
	background: var(--bbi-btn-bg, var(--bbi-primary, #2271b1));
	color: var(--bbi-btn-color, #fff);
	font-size: var(--bbi-btn-font-size, 15px);
	cursor: pointer;
	transition: background 0.15s;
}

.bbi-submit:hover {
	background: var(--bbi-btn-hover, var(--bbi-primary-hover, #135e96));
}

.bbi-submit[disabled] {
	opacity: 0.6;
	cursor: not-allowed;
}

.bbi-loading {
	display: none;
	width: 16px;
	height: 16px;
	margin-left: 10px;
	border: 2px solid var(--bbi-border, #ccc);
	border-top-color: var(--bbi-primary, #2271b1);
	border-radius: 50%;
	animation: bbi-spin 0.7s linear infinite;
	vertical-align: middle;
}

.bbi-loading.is-on {
	display: inline-block;
}

@keyframes bbi-spin {
	to {
		transform: rotate(360deg);
	}
}

.bbi-msg {
	margin: 12px 0 0;
	padding: 10px 14px;
	border-radius: var(--bbi-radius, 4px);
	font-size: 14px;
	display: block;
}

.bbi-msg-success,
.bbi-msg .bbi-msg-success {
	background: var(--bbi-ok-bg, #edfaef);
	border: 1px solid var(--bbi-ok-border, #b8e1c1);
	color: var(--bbi-ok, #1d6b30);
}

.bbi-msg-error {
	background: var(--bbi-err-bg, #fdeeee);
	border: 1px solid var(--bbi-err-border, #f2c0c0);
	color: var(--bbi-error, #a32828);
}

/* 动态加载：占位容器（页面可缓存，表单由 JS 注入） */
.bbi-mount {
	min-height: 40px;
}

.bbi-mount-loading {
	width: 22px;
	height: 22px;
	border: 2px solid var(--bbi-border, #e2e8f0);
	border-top-color: var(--bbi-primary, #2271b1);
	border-radius: 50%;
	animation: bbi-spin 0.7s linear infinite;
}

.bbi-mount .bbi-form-wrap {
	margin: 0;
}