body.demo-devcom-direct-selling .ds-contact-form .wpcf7 {
margin: 0;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form {
margin: 0;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 .hidden-fields-container {
display: none;
}
body.demo-devcom-direct-selling .ds-contact-form .screen-reader-response {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form br {
display: none;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 p:empty {
display: none;
} body.demo-devcom-direct-selling .ds-contact-form .ds-cf7-form > p {
display: contents;
margin: 0;
padding: 0;
} body.demo-devcom-direct-selling .ds-contact-form .ds-cf7-form {
display: flex;
flex-direction: column;
row-gap: 1rem;
} body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form > p:has(.ds-cf7-field),
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form > p:has(label.block) {
display: flex;
flex-direction: column;
row-gap: 1rem;
margin: 0;
padding: 0;
}
body.demo-devcom-direct-selling .ds-contact-form label.ds-cf7-field,
body.demo-devcom-direct-selling .ds-contact-form label.block {
display: block;
margin: 0;
padding: 0;
font-weight: inherit;
cursor: default;
}
body.demo-devcom-direct-selling .ds-contact-form .ds-cf7-label,
body.demo-devcom-direct-selling .ds-contact-form label.ds-cf7-field .ds-cf7-label,
body.demo-devcom-direct-selling .ds-contact-form label.block > span:first-child {
display: block;
margin: 0 0 0.375rem;
font-size: 12.5px;
font-weight: 400;
line-height: 1.4;
color: var(--muted-foreground);
}
body.demo-devcom-direct-selling .ds-contact-form .ds-cf7-required,
body.demo-devcom-direct-selling .ds-contact-form .text-primary-glow {
color: var(--primary-glow);
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7-form-control-wrap {
display: block;
margin: 0;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input[type="text"],
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input[type="email"],
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input.ds-cf7-input,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 textarea {
box-sizing: border-box;
width: 100%;
margin: 0;
padding: 0.875rem 1rem;
border: 1px solid var(--border);
border-radius: 0.75rem;
background: oklch(100% 0 0 / 3%);
font-family: inherit;
font-size: 14px;
font-weight: 400;
line-height: 1.5;
color: var(--foreground);
outline: none;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input.ds-cf7-input:focus,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input[type="text"]:focus,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input[type="email"]:focus {
border-color: oklch(72% 0.14 224 / 60%);
background: oklch(100% 0 0 / 5%);
box-shadow: 0 0 0 2px oklch(72% 0.14 224 / 20%);
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7-not-valid-tip {
font-size: 12px;
margin-top: 0.35rem;
color: var(--destructive);
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7-response-output {
display: none;
margin: 1rem 0 0;
padding: 0.875rem 1rem 0.875rem 2.75rem;
border: 1px solid var(--border-strong);
border-radius: 0.75rem;
background: linear-gradient(oklch(100% 0 0 / 5%), oklch(100% 0 0 / 2%));
box-shadow: inset 0 1px oklch(100% 0 0 / 4%);
font-size: 13px;
font-weight: 400;
line-height: 1.55;
color: var(--muted-foreground);
text-align: left;
position: relative;
} body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.sent .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.invalid .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.unaccepted .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.payment-required .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.failed .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.spam .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.aborted .wpcf7-response-output {
display: block;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7-response-output::before {
content: "";
position: absolute;
left: 1rem;
top: 50%;
width: 1.125rem;
height: 1.125rem;
transform: translateY(-50%);
background-color: currentColor;
opacity: 0.9;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.sent .wpcf7-response-output {
border-color: oklch(72% 0.14 224 / 45%);
background: linear-gradient(oklch(72% 0.14 224 / 12%), oklch(72% 0.14 224 / 6%));
color: var(--primary-glow);
box-shadow:
inset 0 1px oklch(100% 0 0 / 6%),
0 0 24px -8px oklch(72% 0.14 224 / 35%);
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.sent .wpcf7-response-output::before {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.invalid .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.unaccepted .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.failed .wpcf7-response-output,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.spam .wpcf7-response-output {
border-color: oklch(62% 0.22 25 / 50%);
background: linear-gradient(oklch(62% 0.22 25 / 12%), oklch(62% 0.22 25 / 6%));
color: oklch(78% 0.14 25);
box-shadow: inset 0 1px oklch(100% 0 0 / 4%);
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.invalid .wpcf7-response-output::before,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.unaccepted .wpcf7-response-output::before,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.failed .wpcf7-response-output::before,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 form.spam .wpcf7-response-output::before {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6'/%3E%3Cpath d='m9 9 6 6'/%3E%3C/svg%3E");
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6'/%3E%3Cpath d='m9 9 6 6'/%3E%3C/svg%3E");
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7-spinner {
display: none;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 button.ds-cf7-submit,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input.ds-cf7-submit,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input[type="submit"] {
box-sizing: border-box;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
width: 100%;
margin: 0;
padding: 1rem 1.4rem;
border: 0;
border-radius: 999px;
background: linear-gradient(oklch(82% 0.11 220), oklch(68% 0.15 226));
box-shadow:
0 0 0 1px oklch(82% 0.11 220 / 50%),
0 10px 30px -10px oklch(72% 0.14 224 / 70%),
inset 0 1px oklch(100% 0 0 / 35%);
font-family: inherit;
font-size: 15px;
font-weight: 500;
line-height: 1.5;
color: oklch(14% 0.02 260);
cursor: pointer;
-webkit-appearance: none;
appearance: none;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 button.ds-cf7-submit::after {
content: "";
width: 1rem;
height: 1rem;
flex-shrink: 0;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 button.ds-cf7-submit:has(.ds-cf7-submit-icon)::after {
display: none;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 button.ds-cf7-submit .ds-cf7-submit-icon {
width: 1rem;
height: 1rem;
flex-shrink: 0;
}
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 button.ds-cf7-submit:hover,
body.demo-devcom-direct-selling .ds-contact-form .wpcf7 input[type="submit"]:hover {
filter: brightness(1.05);
transform: translateY(-1px);
}