/*
	Theme Name: Hello Elementor Child — Associated Air Services
	Theme URI: http://associatedair.test
	Description: Child theme of Hello Elementor for the Associated Air Services site.
	Author: Vooba
	Author URI: https://vooba.co.uk
	Template: hello-elementor
	Version: 1.0.0
	Requires at least: 6.0
	Requires PHP: 7.4
	Text Domain: hello-elementor-child
*/

/* Online Portal (418): logged out, hide Courier Navigator's menu and show the login panel. */
.portal-logged-out #courier-navigator-body {
	display: none !important;
}

body:not(.portal-logged-out) .portal-login-prompt {
	display: none !important;
}

/* ==========================================================================
   Online Portal (418) — Courier Navigator in the AAS system.
   Navigator's markup (Coda) + Bootstrap 3; navigator.css loads after this
   file, so selectors are anchored on body + Navigator's ids.
   ========================================================================== */

/* --- Login pop-up --------------------------------------------------------- */

body .modal-backdrop.in {
	background-color: var(--midnight);
	opacity: 0.8;
}

body #loginDialog-modal {
	font-family: var(--font-sans);
	color: var(--ink);
}

body #loginDialog-modal .modal-dialog {
	width: auto;
	max-width: 480px;
	margin: 96px auto;
	padding: 0 24px;
}

body #loginDialog-modal .modal-content {
	position: relative;
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: var(--radius-card);
	background: var(--paper);
	box-shadow: 0 24px 64px color-mix(in srgb, var(--midnight) 30%, transparent);
}

body #loginDialog-modal .modal-header,
body #loginDialog-modal .modal-footer {
	display: none;
}

body #loginDialog-modal .container-fluid,
body #loginDialog-modal .row {
	margin: 0;
	padding: 0;
}

body #loginDialog-modal #loginDialog {
	float: none;
	width: 100%;
	padding: 40px;
	border-radius: 0 !important;
	background: transparent;
}

/* Close button: Navigator puts it in an empty right-hand panel. */
body #loginDialog-modal .login-modal-right {
	display: block !important;
	position: absolute;
	top: 16px;
	right: 16px;
	float: none;
	width: auto;
	min-height: 0;
	padding: 0;
	background: none;
}

body #loginDialog-modal .btn-close,
body #loginDialog-modal .close {
	float: none;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: var(--radius-pill);
	background: var(--surface);
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-sm);
	font-weight: 600;
	line-height: 36px;
	text-shadow: none;
	opacity: 1;
	transition: all 150ms;
}

body #loginDialog-modal .btn-close:hover,
body #loginDialog-modal .btn-close:focus-visible,
body #loginDialog-modal .close:hover,
body #loginDialog-modal .close:focus-visible {
	background: var(--surface-strong);
	color: var(--ink);
	opacity: 1;
}

body #loginDialog-modal .loginWelcome {
	margin: 0 48px 24px 0;
	color: var(--ink);
	font-size: var(--text-lg);
	font-weight: 300;
	letter-spacing: -0.02em;
	line-height: 1.25;
}

body #loginDialog-modal form {
	margin: 0;
}

body #loginDialog-modal .login-modal-user-label {
	display: block;
	margin: 16px 0 6px;
	color: var(--ink);
	font-size: var(--text-xs);
	font-weight: 600;
	letter-spacing: 0.025em;
	line-height: 16px;
	text-transform: uppercase;
}

body #loginDialog-modal .login-modal-user-label:first-of-type {
	margin-top: 0;
}

body #loginDialog-modal .form-control {
	width: 100%;
	height: auto;
	padding: 12px 16px;
	border: 1px solid var(--ink-muted);
	border-radius: var(--radius-input);
	background: var(--paper);
	box-shadow: none;
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-sm);
	line-height: 20px;
}

body #loginDialog-modal .form-control::placeholder {
	color: var(--ink-muted);
}

body #loginDialog-modal .form-control:focus {
	border-color: transparent;
	outline: 2px solid var(--cta);
	outline-offset: 0;
	box-shadow: none;
}

body #loginDialog-modal .termsholder {
	margin: 20px 0 24px;
}

body #loginDialog-modal .termsholder .checkbox {
	margin: 0;
}

body #loginDialog-modal .termsholder label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin: 0;
	padding: 0;
	color: var(--ink-muted);
	font-size: var(--text-sm);
	font-weight: 400;
	line-height: 20px;
}

body #loginDialog-modal .termsholder input[type="checkbox"] {
	position: static;
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	margin: 2px 0 0;
	accent-color: var(--cta);
}

body #loginDialog-modal .btn-primary {
	width: 100%;
	padding: 14px 28px;
	border: 0;
	border-radius: var(--radius-pill);
	background: var(--cta);
	color: var(--paper);
	font-family: var(--font-sans);
	font-size: var(--text-button);
	font-weight: 600;
	line-height: 1.5;
	transition: all 150ms;
}

body #loginDialog-modal .btn-primary:hover,
body #loginDialog-modal .btn-primary:focus-visible {
	background: var(--cta-hover);
	color: var(--paper);
}

body #loginDialog-modal .forgotten-button-link {
	display: inline-block;
	margin-top: 16px;
	color: var(--link);
	font-size: var(--text-sm);
	font-weight: 500;
	line-height: 20px;
	text-decoration: none;
}

body #loginDialog-modal .forgotten-button-link:hover,
body #loginDialog-modal .forgotten-button-link:focus-visible {
	color: var(--cta-hover);
	text-decoration: underline;
}

@media (max-width: 767px) {
	body #loginDialog-modal .modal-dialog {
		margin: 64px auto;
		padding: 0 16px;
	}

	body #loginDialog-modal #loginDialog {
		padding: 32px 24px 24px;
	}
}

/* --- Portal body (tracking and other screens) ----------------------------- */

body #courier-navigator-body {
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-sm);
}

body #courier-navigator-body .row {
	margin: 0;
}

body #courier-navigator-body .btn-breadcrumb {
	display: inline-flex;
	float: none;
	margin: 0 0 24px;
	padding: 0;
}

body #courier-navigator-body .btn-breadcrumb .btn {
	margin: 0;
	padding: 8px 14px;
	border: 1px solid var(--line);
	border-radius: 0;
	background: var(--paper);
	color: var(--ink-muted);
	font-family: var(--font-sans);
	font-size: var(--text-xs);
	font-weight: 500;
	line-height: 16px;
	transition: all 150ms;
}

body #courier-navigator-body .btn-breadcrumb .btn + .btn {
	margin-left: -1px;
}

body #courier-navigator-body .btn-breadcrumb .btn:first-child {
	border-radius: var(--radius-pill) 0 0 var(--radius-pill);
}

body #courier-navigator-body .btn-breadcrumb .btn:last-child {
	border-radius: 0 var(--radius-pill) var(--radius-pill) 0;
	background: var(--surface);
	color: var(--ink);
}

body #courier-navigator-body .btn-breadcrumb .btn:hover,
body #courier-navigator-body .btn-breadcrumb .btn:focus-visible {
	background: var(--surface);
	color: var(--cta);
}

body #courier-navigator-body .table-responsive {
	overflow: visible;
	border: 0;
}

body #courier-navigator-body form.form-inline {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: flex-end;
}

body #courier-navigator-body #trackingContainer {
	display: flex;
	flex: 1 1 320px;
	flex-direction: column;
	gap: 6px;
	max-width: 480px;
	margin: 0;
}

body #courier-navigator-body #trackingContainer label {
	margin: 0;
	color: var(--ink);
	font-size: var(--text-xs);
	font-weight: 600;
	letter-spacing: 0.025em;
	line-height: 16px;
	text-transform: uppercase;
}

body #courier-navigator-body .form-control {
	width: 100%;
	height: auto;
	padding: 12px 16px;
	border: 1px solid var(--ink-muted);
	border-radius: var(--radius-input);
	background: var(--paper);
	box-shadow: none;
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-sm);
	line-height: 20px;
}

body #courier-navigator-body .form-control:focus {
	border-color: transparent;
	outline: 2px solid var(--cta);
	outline-offset: 0;
	box-shadow: none;
}

body #courier-navigator-body form .btn-primary {
	margin: 0;
}

body #courier-navigator-body #trackingResults:not(:empty) {
	margin-top: 32px;
}

/* Login pop-up: centred in the viewport (auto margins keep a tall pop-up scrollable). */
body #loginDialog-modal.in {
	display: flex !important;
}

body #loginDialog-modal .modal-dialog {
	width: 100%;
	margin: auto;
	padding: 24px;
}

@media (max-width: 767px) {
	body #loginDialog-modal .modal-dialog {
		margin: auto;
		padding: 16px;
	}
}

/* --- Other Navigator dialogs (Forgotten Password and the rest) ------------ */
/* Same card, header and close button as the login pop-up; centred. */

body .navigator-modal.in {
	display: flex !important;
}

body .navigator-modal:not(#loginDialog-modal) {
	font-family: var(--font-sans);
	color: var(--ink);
}

body .navigator-modal:not(#loginDialog-modal) .modal-dialog {
	margin: auto;
	padding: 24px;
}

body .navigator-modal:not(#loginDialog-modal) .modal-content {
	position: relative;
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: var(--radius-card);
	background: var(--paper);
	box-shadow: 0 24px 64px color-mix(in srgb, var(--midnight) 30%, transparent);
}

body .navigator-modal:not(#loginDialog-modal) .modal-header {
	padding: 40px 88px 0 40px;
	border: 0;
	background: var(--paper);
	color: var(--ink);
}

body .navigator-modal:not(#loginDialog-modal) .modal-title {
	margin: 0;
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-lg);
	font-weight: 300;
	letter-spacing: -0.02em;
	line-height: 1.25;
}

body .navigator-modal:not(#loginDialog-modal) .modal-header .close,
body .navigator-modal:not(#loginDialog-modal) .modal-header .btn-close {
	position: absolute;
	top: 16px;
	right: 16px;
	float: none;
	width: 36px;
	height: 36px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: var(--radius-pill);
	background: var(--surface);
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-sm);
	font-weight: 600;
	line-height: 36px;
	text-shadow: none;
	opacity: 1;
	transition: all 150ms;
}

body .navigator-modal:not(#loginDialog-modal) .modal-header .close:hover,
body .navigator-modal:not(#loginDialog-modal) .modal-header .close:focus-visible {
	background: var(--surface-strong);
	color: var(--ink);
	opacity: 1;
}

body .navigator-modal:not(#loginDialog-modal) .modal-body {
	padding: 16px 40px 40px;
	color: var(--ink-muted);
	font-size: var(--text-sm);
	line-height: 20px;
}

body .navigator-modal:not(#loginDialog-modal) .modal-footer:empty {
	display: none;
}

body .navigator-modal:not(#loginDialog-modal) .form-control {
	width: 100%;
	height: auto;
	padding: 12px 16px;
	border: 1px solid var(--ink-muted);
	border-radius: var(--radius-input);
	background: var(--paper);
	box-shadow: none;
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-sm);
	line-height: 20px;
}

body .navigator-modal:not(#loginDialog-modal) .form-control::placeholder {
	color: var(--ink-muted);
}

body .navigator-modal:not(#loginDialog-modal) .form-control:focus {
	border-color: transparent;
	outline: 2px solid var(--cta);
	outline-offset: 0;
	box-shadow: none;
}

body .navigator-modal:not(#loginDialog-modal) .btn-primary {
	padding: 14px 28px;
	border: 0;
	border-radius: var(--radius-pill);
	background: var(--cta);
	color: var(--paper);
	font-family: var(--font-sans);
	font-size: var(--text-button);
	font-weight: 600;
	line-height: 1.5;
	transition: all 150ms;
}

body .navigator-modal:not(#loginDialog-modal) .btn-primary:hover,
body .navigator-modal:not(#loginDialog-modal) .btn-primary:focus-visible {
	background: var(--cta-hover);
	color: var(--paper);
}

/* Forgotten Password: same width and form rhythm as the login pop-up. */
body #passwordDialog-modal .modal-dialog {
	width: 100%;
	max-width: 480px;
}

body #passwordDialog-modal #passwordForm {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 16px;
}

body #passwordDialog-modal #passwordForm input {
	position: static;
	margin: 0;
}

body #passwordDialog-modal #passwordForm .btn-primary {
	width: 100%;
}

@media (max-width: 767px) {
	body .navigator-modal:not(#loginDialog-modal) .modal-dialog {
		padding: 16px;
	}

	body .navigator-modal:not(#loginDialog-modal) .modal-header {
		padding: 32px 72px 0 24px;
	}

	body .navigator-modal:not(#loginDialog-modal) .modal-body {
		padding: 16px 24px 24px;
	}
}

/* --- Navigator messages: errors and success (v1.0.5) ---------------------- */
/* Form errors: Navigator prepends div.input-invalid-text.bg-danger to the form.
   Field errors: span.input-invalid-text after the field. Info / success: the
   #messageDialog pop-up. Tokens danger-700 6.05:1 on danger-50; green-700
   4.98:1 on green-50. */

body .navigator-modal div.input-invalid-text,
body #courier-navigator-body div.input-invalid-text {
	position: relative;
	display: flex;
	gap: 10px;
	align-items: flex-start;
	float: none;
	width: auto;
	min-height: 0;
	margin: 0 0 20px;
	padding: 12px 16px;
	border: 1px solid color-mix(in srgb, var(--danger-700) 24%, transparent);
	border-radius: var(--radius-input);
	background: var(--danger-50) !important;
	color: var(--danger-700) !important;
	font-family: var(--font-sans);
	font-size: var(--text-sm);
	font-weight: 500;
	line-height: 20px;
}

body .navigator-modal div.input-invalid-text::before,
body #courier-navigator-body div.input-invalid-text::before {
	content: "!";
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	border-radius: var(--radius-pill);
	background: var(--danger-700);
	color: var(--paper);
	font-size: var(--text-xs);
	font-weight: 700;
	line-height: 20px;
	text-align: center;
}

body #passwordDialog-modal #passwordForm div.input-invalid-text {
	margin: 0;
}

body .navigator-modal span.input-invalid-text,
body .navigator-modal .invalid-text,
body #courier-navigator-body span.input-invalid-text,
body #courier-navigator-body .invalid-text {
	display: block;
	margin: 6px 0 0;
	color: var(--danger-700) !important;
	font-family: var(--font-sans);
	font-size: var(--text-xs);
	font-weight: 500;
	line-height: 16px;
}

body .navigator-modal .form-control:has(+ span.input-invalid-text),
body #courier-navigator-body .form-control:has(+ span.input-invalid-text),
body #courier-navigator-body .input-invalid .form-control {
	border-color: var(--danger-700);
}

/* Info / success pop-up. */
body #messageDialog-modal .modal-dialog {
	width: 100%;
	max-width: 480px;
}

body #messageDialog-modal.navigator-modal .modal-body {
	color: var(--ink);
}

/* Bootstrap state colours inside the portal screens. */
body #courier-navigator-body .bg-success {
	border-radius: var(--radius-input);
	background: var(--green-50) !important;
}

body #courier-navigator-body .text-success {
	color: var(--green-700) !important;
}

body #courier-navigator-body .bg-danger {
	border-radius: var(--radius-input);
	background: var(--danger-50) !important;
}

body #courier-navigator-body .text-danger {
	color: var(--danger-700) !important;
}

/* ==========================================================================
   Contact Form 7 — AAS forms: New Customer Enquiry (435, Become a Customer
   53), General Enquiry (436) and Request a Quote (437) on Contact 52.
   Shortcodes carry html_class="aas-cf7". Mirrors the V4 form classes
   form-field / form-label / form-input; tokens only. Selectors start with
   .elementor-kit-7 so they outrank the kit's Form Fields rules (post-7.css,
   which loads after this file).
   ========================================================================== */

.elementor-kit-7 .wpcf7 form.aas-cf7 {
	margin: 0;
	color: var(--ink);
	font-family: var(--font-sans);
}

.elementor-kit-7 .aas-cf7 .aas-cf7-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	align-items: start;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-full {
	grid-column: 1 / -1;
}

/* --- Fields --------------------------------------------------------------- */

.elementor-kit-7 .aas-cf7 .aas-cf7-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-field > label {
	margin: 0;
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-xs);
	font-weight: 600;
	letter-spacing: 0.025em;
	line-height: 16px;
	text-transform: uppercase;
}

.elementor-kit-7 .aas-cf7 .wpcf7-form-control-wrap {
	display: block;
}

.elementor-kit-7 .aas-cf7 input.wpcf7-text,
.elementor-kit-7 .aas-cf7 select.wpcf7-select,
.elementor-kit-7 .aas-cf7 textarea.wpcf7-textarea {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 12px 16px;
	border: 1px solid var(--ink-muted);
	border-radius: var(--radius-input);
	background-color: var(--paper);
	box-shadow: none;
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-sm);
	font-weight: 400;
	line-height: 20px;
	transition: all 150ms;
}

.elementor-kit-7 .aas-cf7 select.wpcf7-select {
	appearance: auto;
	cursor: pointer;
}

.elementor-kit-7 .aas-cf7 textarea.wpcf7-textarea {
	resize: none;
}

.elementor-kit-7 .aas-cf7 input.wpcf7-text::placeholder,
.elementor-kit-7 .aas-cf7 textarea.wpcf7-textarea::placeholder {
	color: var(--ink-muted);
	opacity: 1;
}

.elementor-kit-7 .aas-cf7 .wpcf7-form-control-wrap input.wpcf7-text:focus,
.elementor-kit-7 .aas-cf7 .wpcf7-form-control-wrap select.wpcf7-select:focus,
.elementor-kit-7 .aas-cf7 .wpcf7-form-control-wrap textarea.wpcf7-textarea:focus {
	border-color: transparent;
	outline: 2px solid var(--cta);
	outline-offset: 0;
	box-shadow: none;
}

/* --- Validation ----------------------------------------------------------- */

.elementor-kit-7 .wpcf7 .aas-cf7 .wpcf7-form-control-wrap input.wpcf7-not-valid,
.elementor-kit-7 .wpcf7 .aas-cf7 .wpcf7-form-control-wrap select.wpcf7-not-valid,
.elementor-kit-7 .wpcf7 .aas-cf7 .wpcf7-form-control-wrap textarea.wpcf7-not-valid {
	border-color: var(--danger-700);
}

.elementor-kit-7 .aas-cf7 .wpcf7-not-valid-tip {
	display: block;
	margin: 6px 0 0;
	color: var(--danger-700);
	font-family: var(--font-sans);
	font-size: var(--text-xs);
	font-weight: 500;
	line-height: 16px;
}

/* --- Consent checkbox ----------------------------------------------------- */

.elementor-kit-7 .aas-cf7 .aas-cf7-consent .wpcf7-list-item {
	display: block;
	margin: 0;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-consent label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin: 0;
	color: var(--ink-muted);
	font-size: var(--text-sm);
	font-weight: 400;
	line-height: 20px;
	cursor: pointer;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-consent input[type="checkbox"] {
	display: grid;
	flex: 0 0 auto;
	place-items: center;
	width: 18px;
	height: 18px;
	margin: 1px 0 0;
	padding: 0;
	border: 1px solid var(--ink-muted);
	border-radius: 4px;
	background-color: var(--paper);
	appearance: none;
	cursor: pointer;
	transition: all 150ms;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-consent input[type="checkbox"]::before {
	content: "";
	width: 65%;
	height: 65%;
	background-color: var(--paper);
	clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
	opacity: 0;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-consent input[type="checkbox"]:checked {
	border-color: var(--cta);
	background-color: var(--cta);
}

.elementor-kit-7 .aas-cf7 .aas-cf7-consent input[type="checkbox"]:checked::before {
	opacity: 1;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-consent input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--cta);
	outline-offset: 2px;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-consent .wpcf7-not-valid-tip {
	margin-left: 28px;
}

/* --- Footer + submit ------------------------------------------------------ */

.elementor-kit-7 .aas-cf7 .aas-cf7-footer {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	justify-content: space-between;
	align-items: center;
	margin-top: 8px;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-footer--end {
	justify-content: flex-end;
	margin-top: 4px;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-note {
	margin: 0;
	color: var(--ink-muted);
	font-size: var(--text-xs);
	line-height: 1.33;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-submit {
	position: relative;
	display: inline-flex;
}

.elementor-kit-7 .aas-cf7 .wpcf7-submit {
	display: inline-flex;
	gap: 8px;
	justify-content: center;
	align-items: center;
	width: auto;
	margin: 0;
	padding: 14px 28px;
	border: 0;
	border-radius: var(--radius-pill);
	background-color: var(--cta);
	color: var(--paper);
	font-family: var(--font-sans);
	font-size: var(--text-body);
	font-weight: 600;
	line-height: 1.5;
	text-transform: none;
	cursor: pointer;
	transition: all 150ms;
}

.elementor-kit-7 .aas-cf7 .wpcf7-submit:hover,
.elementor-kit-7 .aas-cf7 .wpcf7-submit:focus-visible {
	background-color: var(--cta-hover);
	color: var(--paper);
}

.elementor-kit-7 .aas-cf7 .wpcf7-submit:disabled {
	cursor: wait;
}

.elementor-kit-7 .aas-cf7 button.wpcf7-submit::after {
	content: "";
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
	background-color: currentColor;
	-webkit-mask: url(/wp-content/uploads/2026/10/icon-send.svg) center / contain no-repeat;
	mask: url(/wp-content/uploads/2026/10/icon-send.svg) center / contain no-repeat;
}

/* Become a Customer: wider button, 15px icon (as the V4 form). */
.elementor-kit-7 .aas-cf7 .aas-cf7-footer:not(.aas-cf7-footer--end) .wpcf7-submit {
	padding-inline: 32px;
}

.elementor-kit-7 .aas-cf7 .aas-cf7-footer:not(.aas-cf7-footer--end) button.wpcf7-submit::after {
	width: 15px;
	height: 15px;
}

/* Spinner sits to the left of the button so the layout doesn't shift. */
.elementor-kit-7 .aas-cf7 .wpcf7-spinner {
	position: absolute;
	top: 50%;
	right: 100%;
	margin: -12px 12px 0 0;
	background-color: var(--ink-muted);
}

/* --- Response message ----------------------------------------------------- */

.elementor-kit-7 .wpcf7 form.aas-cf7 .wpcf7-response-output {
	margin: 20px 0 0;
	padding: 12px 16px;
	border: 0;
	border-radius: var(--radius-input);
	background-color: var(--surface);
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--text-sm);
	line-height: 20px;
}

.elementor-kit-7 .wpcf7 form.aas-cf7.failed .wpcf7-response-output,
.elementor-kit-7 .wpcf7 form.aas-cf7.aborted .wpcf7-response-output {
	background-color: var(--surface-strong);
}

.elementor-kit-7 .wpcf7 form.aas-cf7.invalid .wpcf7-response-output,
.elementor-kit-7 .wpcf7 form.aas-cf7.unaccepted .wpcf7-response-output,
.elementor-kit-7 .wpcf7 form.aas-cf7.spam .wpcf7-response-output {
	border: 1px solid color-mix(in srgb, var(--danger-700) 24%, transparent);
	background-color: var(--danger-50);
	color: var(--danger-700);
	font-weight: 500;
}

@media (max-width: 767px) {
	.elementor-kit-7 .aas-cf7 .aas-cf7-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.elementor-kit-7 .aas-cf7 .aas-cf7-footer:not(.aas-cf7-footer--end) {
		flex-direction: column;
		align-items: stretch;
	}

	.elementor-kit-7 .aas-cf7 .aas-cf7-footer:not(.aas-cf7-footer--end) .aas-cf7-submit,
	.elementor-kit-7 .aas-cf7 .aas-cf7-footer:not(.aas-cf7-footer--end) .wpcf7-submit {
		width: 100%;
	}
}