/* QH Forms — CSS gốc của Contact Form 7 (để form trông y như cũ khi đã tắt plugin) + popup gửi thành công. Xem inc/qh-forms.php */

.wpcf7 .screen-reader-response {
	position: absolute;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	word-wrap: normal !important;
}

.wpcf7 form .wpcf7-response-output {
	margin: 2em 0.5em 1em;
	padding: 0.2em 1em;
	border: 2px solid #00a0d2; /* Blue */
}

.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
	display: none;
}

.wpcf7 form.sent .wpcf7-response-output {
	border-color: #46b450; /* Green */
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
	border-color: #dc3232; /* Red */
}

.wpcf7 form.spam .wpcf7-response-output {
	border-color: #f56e28; /* Orange */
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
	border-color: #ffb900; /* Yellow */
}

.wpcf7-form-control-wrap {
	position: relative;
}

.wpcf7-not-valid-tip {
	color: #dc3232; /* Red */
	font-size: 1em;
	font-weight: normal;
	display: block;
}

.use-floating-validation-tip .wpcf7-not-valid-tip {
	position: relative;
	top: -2ex;
	left: 1em;
	z-index: 100;
	border: 1px solid #dc3232;
	background: #fff;
	padding: .2em .8em;
	width: 24em;
}

.wpcf7-list-item {
	display: inline-block;
	margin: 0 0 0 1em;
}

.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
	content: " ";
}

.wpcf7-spinner {
	visibility: hidden;
	display: inline-block;
	background-color: #23282d; /* Dark Gray 800 */
	opacity: 0.75;
	width: 24px;
	height: 24px;
	border: none;
	border-radius: 100%;
	padding: 0;
	margin: 0 24px;
	position: relative;
}

form.submitting .wpcf7-spinner {
	visibility: visible;
}

.wpcf7-spinner::before {
	content: '';
	position: absolute;
	background-color: #fbfbfc; /* Light Gray 100 */
	top: 4px;
	left: 4px;
	width: 6px;
	height: 6px;
	border: none;
	border-radius: 100%;
	transform-origin: 8px 8px;
	animation-name: spin;
	animation-duration: 1000ms;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

@media (prefers-reduced-motion: reduce) {
	.wpcf7-spinner::before {
		animation-name: blink;
		animation-duration: 2000ms;
	}
}

@keyframes spin {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

@keyframes blink {
	from {
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	to {
		opacity: 0;
	}
}

.wpcf7 [inert] {
	opacity: 0.5;
}

.wpcf7 input[type="file"] {
	cursor: pointer;
}

.wpcf7 input[type="file"]:disabled {
	cursor: default;
}

.wpcf7 .wpcf7-submit:disabled {
	cursor: not-allowed;
}

.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
	direction: ltr;
}

.wpcf7-reflection > output {
	display: list-item;
	list-style: none;
}

.wpcf7-reflection > output[hidden] {
	display: none;
}

/* Ô honeypot chống spam (nằm trong khối display:none sẵn có, thêm cho chắc) */
.wpcf7 input[name="qh_hp"]{position:absolute !important;left:-9999px !important;width:1px;height:1px;opacity:0}

/* Popup "Gửi thành công" giữa màn hình — tự ẩn sau 1 giây (j/qh-forms.js) */
.qh-form-ok{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
.qh-form-ok.is-open{opacity:1;visibility:visible}
.qh-form-ok__box{width:100%;max-width:380px;padding:26px 24px 22px;border-radius:14px;background:#fff;color:#111;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.3);transform:scale(.92);transition:transform .2s}
.qh-form-ok.is-open .qh-form-ok__box{transform:scale(1)}
.qh-form-ok__icon{display:block;width:58px;height:58px;margin:0 auto 12px;border-radius:50%;background:#46b450;color:#fff;font-size:34px;font-weight:700;line-height:58px}
.qh-form-ok__msg{margin:0;font-size:17px;font-weight:600;line-height:1.5;color:#111 !important}
@media (prefers-reduced-motion:reduce){.qh-form-ok,.qh-form-ok__box{transition:none}}

/* ===== Thông báo lỗi (thay kiểu hộp xám + mũi tên mặc định của Flatsome cho CF7) ===== */
/* Ô sai: viền đỏ + quầng nhẹ, chữ khách gõ giữ màu bình thường */
.wpcf7 form .wpcf7-form-control.wpcf7-not-valid,
.wpcf7 form .wpcf7-not-valid .wpcf7-form-control{border-color:#e5484d !important;box-shadow:0 0 0 3px rgba(229,72,77,.15) !important;color:#222 !important}
/* Dòng lỗi dưới ô: nhãn nhỏ nền hồng nhạt (đọc rõ cả trên nền tối), 1 dòng, co theo chữ */
.wpcf7 form .wpcf7-form-control-wrap .wpcf7-not-valid-tip{
  position:static !important;display:flex !important;align-items:flex-start;gap:6px;width:fit-content !important;max-width:100%;
  margin:6px 0 4px !important;padding:4px 10px 4px 6px !important;border:0 !important;border-radius:8px !important;
  background:#fdecec !important;box-shadow:none !important;opacity:1 !important;z-index:auto !important;
  color:#c62828 !important;font-size:12.5px !important;font-weight:600 !important;line-height:1.35 !important;
  text-align:left !important;text-transform:none !important;letter-spacing:0 !important;white-space:normal;
  animation:qh-tip-in .18s ease-out}
.wpcf7 form .wpcf7-form-control-wrap .wpcf7-not-valid-tip::before{content:"!";flex:0 0 16px;width:16px;height:16px;margin-top:0;border-radius:50%;background:#e5484d;color:#fff;font-size:11px;font-weight:800;line-height:16px;text-align:center}
.wpcf7 form .wpcf7-form-control-wrap .wpcf7-not-valid-tip::after{content:none !important;display:none !important}
@keyframes qh-tip-in{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
/* Thông báo chung (dưới nút gửi): 1 dòng gọn thay hộp viền vàng */
.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.failed .wpcf7-response-output,.wpcf7 form.spam .wpcf7-response-output{
  display:flex !important;align-items:center;gap:8px;margin:12px 0 0 !important;padding:9px 12px !important;
  border:0 !important;border-left:4px solid #e5484d !important;border-radius:8px !important;background:#fff5f5 !important;
  color:#b42318 !important;font-size:13.5px !important;font-weight:500;line-height:1.45 !important;text-align:left !important}
.wpcf7 form.invalid .wpcf7-response-output::before,.wpcf7 form.failed .wpcf7-response-output::before,.wpcf7 form.spam .wpcf7-response-output::before{content:"⚠";font-size:15px;line-height:1}
@media (prefers-reduced-motion:reduce){.wpcf7 form .wpcf7-not-valid-tip{animation:none}}

/* Form liên hệ 1 (trang chủ): 2 ô Tỉnh/Thành | Phường/Xã thay 3 ô Tỉnh | Quận | Phường cũ.
   Thanh trắng bo tròn chia đôi; mobile (≤639px) Additional CSS đã cho mỗi ô 1 dòng (!important). */
.qh_s2 form .a p.qh-dvhc span:nth-child(1){width:50%}
.qh_s2 form .a p.qh-dvhc span:nth-child(2){width:50%;padding-right:10px;border-radius:0 40px 40px 0}
.wpcf7 select[data-qh-dvhc]:disabled{opacity:.55;cursor:not-allowed}
