/* All rules are scoped to CF7. Colors follow the Bricks site variables.
 * Optional layout: .cf7-grid > .cf7-field; .cf7-field--full spans both columns.
 * Put checkbox/radio groups in a fieldset with a legend, not a wrapping label.
 */
.wpcf7 {
    --cf7-accent: var(--primary, #093a31);
    --cf7-hover: var(--secondary, #006362);
    --cf7-text: #263d37;
    --cf7-muted: #5c6d67;
    --cf7-border: #aabdb5;
    --cf7-surface: #f4f8f6;
    --cf7-error: #a32626;
    width: 100%;
    min-width: 0;
    color: var(--cf7-text);
    font-family: inherit;
    line-height: 1.6;
}

.wpcf7 *, .wpcf7 *::before, .wpcf7 *::after { box-sizing: border-box; }
.wpcf7 form { margin: 0; }
.wpcf7 form p { margin: 0 0 20px; }
.wpcf7 form label { display: block; color: var(--cf7-text); font-size: 16px; font-weight: 500; }
.wpcf7 .wpcf7-form-control-wrap { display: block; min-width: 0; margin-top: 8px; }
.wpcf7 :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], input[type="password"], input[type="search"], select, textarea) {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 50px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--cf7-border);
    border-radius: 6px;
    background-color: #fff;
    color: var(--cf7-text);
    font: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    box-shadow: none;
    transition: border-color .15s, box-shadow .15s;
}
.wpcf7 select { padding-right: 36px; }
.wpcf7 select[multiple] { min-height: 150px; }
.wpcf7 textarea { min-height: 150px; resize: vertical; }
.wpcf7 :is(input, textarea)::placeholder { color: var(--cf7-muted); opacity: 1; }
.wpcf7 :is(input, select, textarea, button, a):focus-visible {
    outline: 3px solid var(--cf7-hover);
    outline-offset: 3px;
}
.wpcf7 :is(input, select, textarea):focus { border-color: var(--cf7-accent); }
.wpcf7 :is(input, select, textarea, button):disabled {
    opacity: .6;
    cursor: not-allowed;
}
.wpcf7 :is(input, textarea)[readonly] { background-color: var(--cf7-surface); }

/* Optional two-column layout; plain CF7 label/paragraph markup works too. */
.wpcf7 .cf7-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.wpcf7 .cf7-field { min-width: 0; margin: 0; }
.wpcf7 .cf7-field > p { margin-bottom: 0; }
.wpcf7 .cf7-field--full { grid-column: 1 / -1; }
.wpcf7 fieldset { min-width: 0; margin: 0 0 28px; padding: 0; border: 0; }
.wpcf7 legend { float: none; width: 100%; margin-bottom: 16px; padding: 0; color: var(--cf7-accent); font-size: 20px; font-weight: 600; }
.wpcf7 .cf7-help { display: block; margin-top: 8px; color: var(--cf7-muted); font-size: 14px; font-weight: 400; }
.wpcf7 a { color: var(--cf7-accent); text-underline-offset: 3px; }

/* Native checkboxes and radio buttons retain keyboard and browser behavior. */
.wpcf7 :is(.wpcf7-checkbox, .wpcf7-radio) { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.wpcf7 .wpcf7-list-item { margin: 0; max-width: 100%; }
.wpcf7 .wpcf7-list-item label { display: inline-flex; align-items: flex-start; gap: 10px; font-weight: 400; cursor: pointer; }
.wpcf7 :is(input[type="checkbox"], input[type="radio"]) {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    min-height: 0;
    margin: 3px 0 0;
    padding: 0;
    accent-color: var(--cf7-accent);
}
.wpcf7 .wpcf7-list-item-label { min-width: 0; overflow-wrap: anywhere; }
.wpcf7 .wpcf7-acceptance { display: block; font-size: 14px; }
.wpcf7 .wpcf7-acceptance label { font-size: 14px; }

/* Standard file input and the installed Drag and Drop Multiple File Upload. */
.wpcf7 input[type="file"] {
    max-width: 100%;
    width: 100%;
    padding: 12px;
    border: 1px dashed var(--cf7-border);
    border-radius: 6px;
    background: var(--cf7-surface);
    color: var(--cf7-muted);
    font: inherit;
    font-size: 14px;
}
.wpcf7 input[type="file"]::file-selector-button {
    margin-right: 12px;
    padding: 10px 14px;
    border: 1px solid var(--cf7-accent);
    border-radius: 4px;
    background: #fff;
    color: var(--cf7-accent);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}
.wpcf7 .codedropz-upload-handler {
    margin: 0;
    border: 1px dashed var(--cf7-border);
    border-radius: 6px;
    background: var(--cf7-surface);
}
.wpcf7 .codedropz-upload-container { padding: 28px 20px 36px; }
.wpcf7 .codedropz-upload-inner h3 { margin: 0 0 8px; color: var(--cf7-accent); font-family: inherit; font-size: 18px; font-weight: 600; line-height: 1.5; }
.wpcf7 .codedropz-upload-inner > span { color: var(--cf7-muted); font-size: 14px; }
.wpcf7 .codedropz-upload-inner .codedropz-btn-wrap a.cd-upload-btn { display: inline-block; padding: 8px 12px; color: var(--cf7-accent); font-weight: 600; text-decoration: underline; }
.wpcf7 .codedropz-upload-handler:is(.codedropz-dragover, :focus-within) { border-color: var(--cf7-accent); background: #e8f2ed; }
.wpcf7 .dnd-upload-counter { right: 12px; bottom: 8px; color: var(--cf7-muted); }
.wpcf7 .dnd-upload-status { padding: 12px 0; }
.wpcf7 .dnd-upload-status .dnd-upload-details .name { color: var(--cf7-accent); font-size: 14px; }
.wpcf7 .dnd-upload-status .dnd-upload-details .dnd-progress-bar { background: #dce8e1; }
.wpcf7 .dnd-upload-status .dnd-upload-details .dnd-progress-bar span { background: var(--cf7-accent); }
.wpcf7 .dnd-upload-status .dnd-upload-details .remove-file:focus-visible { outline: 3px solid var(--cf7-hover); outline-offset: 3px; }

.wpcf7 .wpcf7-submit {
    display: inline-block;
    width: auto;
    max-width: 100%;
    min-height: 50px;
    margin: 0;
    padding: 13px 26px;
    border: 1px solid var(--cf7-accent);
    border-radius: 6px;
    background: var(--cf7-accent);
    color: #fff;
    font: inherit;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    white-space: normal;
    cursor: pointer;
    transition: background-color .15s, border-color .15s;
}
.wpcf7 .wpcf7-submit:not(:disabled):hover { background: var(--cf7-hover); border-color: var(--cf7-hover); }
.wpcf7 .wpcf7-spinner { margin: 0 12px; vertical-align: middle; background: var(--cf7-accent); }

/* Preserve CF7's hidden initial response and live-region behavior. */
.wpcf7 :is(input, select, textarea).wpcf7-not-valid,
.wpcf7 :is(input, select, textarea)[aria-invalid="true"],
.wpcf7 .codedropz-upload-wrapper.invalid .codedropz-upload-handler { border-color: var(--cf7-error); }
.wpcf7 .wpcf7-not-valid-tip,
.wpcf7 .codedropz-upload-wrapper span.has-error-msg,
.wpcf7 .dnd-upload-status .dnd-upload-details span.has-error { margin-top: 6px; color: var(--cf7-error); font-size: 14px; font-weight: 400; font-style: normal; }
.wpcf7 form .wpcf7-response-output { margin: 24px 0 0; padding: 14px 18px; border: 1px solid var(--cf7-border); border-left-width: 4px; border-radius: 6px; font-size: 15px; }
.wpcf7 form.sent .wpcf7-response-output { border-color: #267147; background: #edf7f0; color: #185031; }
.wpcf7 form:is(.failed, .aborted) .wpcf7-response-output { border-color: var(--cf7-error); background: #fff3f2; color: #852020; }
.wpcf7 form:is(.invalid, .unaccepted, .spam, .payment-required) .wpcf7-response-output { border-color: #976418; background: #fff8e9; color: #72480b; }

@media (max-width: 600px) {
    .wpcf7 .cf7-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .wpcf7 .wpcf7-submit { width: 100%; }
    .wpcf7 .wpcf7-spinner { margin-top: 8px; }
    .wpcf7 .codedropz-upload-container { padding: 20px 14px 32px; }
}
@media (prefers-reduced-motion: reduce) {
    .wpcf7 :is(input, select, textarea, button) { transition: none; }
}

/* Enquiry page: two independent forms, accessible without JavaScript. */
.sl-enquiry { width: min(100% - 40px, 900px); margin: 32px auto 64px; }
article:has(> .sl-enquiry) > h1 { width: min(100% - 40px, 900px); margin: 32px auto 0; }
.sl-enquiry > p { margin-bottom: 24px; }
.sl-enquiry details { margin: 0 0 20px; border: 1px solid #cbd8d1; border-radius: 8px; background: #fff; }
.sl-enquiry summary { padding: 20px 24px; color: var(--primary, #093a31); font-size: 22px; font-weight: 600; cursor: pointer; }
.sl-enquiry summary:focus-visible { outline: 3px solid var(--secondary, #006362); outline-offset: 3px; }
.sl-enquiry details[open] > summary { border-bottom: 1px solid #dce8e1; background: #f4f8f6; border-radius: 8px 8px 0 0; }
.sl-enquiry .sl-enquiry-body { padding: 28px; }
.sl-enquiry .sl-enquiry-body > p { margin: 0 0 24px; color: #5c6d67; }
@media (max-width: 600px) {
    .sl-enquiry { width: calc(100% - 32px); }
    .sl-enquiry summary { padding: 16px; font-size: 20px; }
    .sl-enquiry .sl-enquiry-body { padding: 20px 16px; }
}
