/**
 * DXB overrides for Contact Form 7 on the contact page.
 */

.dxb-contact-form-col {
	display: grid;
	gap: 0;
	align-content: start;
}

.dxb-contact-form-col .dxb-contact-thanks:not(.dxb-hidden) {
	margin-bottom: 0;
}

.dxb-contact-form .wpcf7 {
	margin: 0;
}

.dxb-contact-form .wpcf7-form {
	display: grid;
	gap: 18px;
}

.dxb-contact-form .wpcf7-form p {
	margin: 0;
}

.dxb-contact-form .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
}

.dxb-contact-form .dxb-form-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.dxb-contact-form .dxb-form-label {
	font-family: var(--font-display);
	font-size: 11px;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--fg-3);
}

.dxb-contact-form .wpcf7-form-control,
.dxb-contact-form .dxb-form-input,
.dxb-contact-form .dxb-form-select,
.dxb-contact-form .dxb-form-textarea {
	width: 100%;
	box-sizing: border-box;
	font-family: var(--font-body);
	font-size: var(--fs-sm);
	color: var(--fg-1);
	background: var(--bg);
	border: 1px solid var(--border-strong);
	border-radius: 2px;
	padding: 12px 14px;
	outline: none;
}

.dxb-contact-form .dxb-form-textarea,
.dxb-contact-form textarea.wpcf7-form-control {
	resize: vertical;
	min-height: 80px;
}

.dxb-contact-form .wpcf7-spinner {
	margin-inline-start: 8px;
	vertical-align: middle;
}

[dir="rtl"] .dxb-contact-form .dxb-form-label {
	letter-spacing: normal;
	text-transform: none;
}

[dir="rtl"] .dxb-contact-form .wpcf7-form-control,
[dir="rtl"] .dxb-contact-form .dxb-form-input,
[dir="rtl"] .dxb-contact-form .dxb-form-select,
[dir="rtl"] .dxb-contact-form .dxb-form-textarea {
	text-align: right;
}

.dxb-contact-form .wpcf7-response-output {
	display: none !important;
}

.dxb-contact-form .wpcf7-not-valid-tip {
	font-size: 12px;
	color: #b42318;
	margin-top: 4px;
}

.dxb-contact-form .wpcf7-not-valid {
	border-color: #b42318 !important;
}

.dxb-contact-form .dxb-form-field--error .wpcf7-form-control {
	border-color: #b42318 !important;
}

.dxb-contact-form .dxb-field-error {
	display: block;
}

.dxb-contact-form input[type="submit"].dxb-btn,
.dxb-contact-form .wpcf7-submit.dxb-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	cursor: pointer;
	border: none;
	font-family: var(--font-display);
	font-size: var(--fs-xs);
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 14px 24px;
}

.dxb-contact-form input[type="submit"].dxb-btn--primary,
.dxb-contact-form .wpcf7-submit.dxb-btn--primary {
	width: auto;
	background: var(--bg-inverse);
	color: var(--fg-on-dark);
}

.dxb-contact-form input[type="submit"].dxb-btn--primary:hover,
.dxb-contact-form .wpcf7-submit.dxb-btn--primary:hover {
	opacity: 0.92;
}

.dxb-contact-form.dxb-hidden {
	display: none !important;
}

.dxb-contact-form-col .dxb-contact-thanks.dxb-hidden + .dxb-contact-form {
	margin-top: 0;
}