/* Only the form wrapper area gets a background: */
#BiginWebToRecordFormParent104540000000370944 { background-color: #0F0F0F; }

/* From here down are your original component styles. */
.wf-form-component { padding: 30px 40px 60px; }
.wf-form-paid { padding-bottom: 45px; }
.wf-parent { padding: 30px 0; height: 100%; box-sizing: border-box; overflow: auto; background-repeat: no-repeat; background-size: 100% 100%; }
.wf-wrapper * { box-sizing: border-box; }
.wf-wrapper { width: 100%; max-width: 700px; border-radius: 10px; margin: auto; border: none; background-color: #fff; color: #222; box-shadow: 0px 0px 2px 0 #00000033; }
.iframe-container { height: 100%; width: 100%; border: none; min-height: 365px; }
.wf-logo { display: flex; margin-bottom: 30px; max-height: 60px; justify-content: center; }
.wf-logo[data-ux-logo-size='lg'] { height: 60px; }
.wf-logo[data-ux-logo-size='md'] { height: 50px; }
.wf-logo[data-ux-logo-size='sm'] { height: 30px; }
.wf-logo[data-ux-logo-pos='left'] { justify-content: left; }
.wf-logo[data-ux-logo-pos='center'] { justify-content: center; }
.wf-logo[data-ux-logo-pos='right'] { justify-content: right; }
.wf-header { font-size: 22px; padding-bottom: 35px; font-weight: bold; word-break: break-word; }
.wf-sec-wrap { margin-bottom: 40px; }
.wf-sec-wrap:first-child .wf-sec-head { margin-top: 0; }
.wf-sec-head { margin-bottom: 20px; margin-top: 35px; }
.wf-sec-title { font-size: 18px; font-weight: bold; word-break: break-word; }
.wf-sec-desc { margin: 0; margin-top: 5px; word-break: break-word; }
.wf-row { margin-bottom: 20px; }
.wf-row-with-supplementary { margin-bottom: 10px; }
.wf-label { padding: 7px 0; word-break: break-word; }
.wf-field:not(.multiple-fields-div) { text-align: left; word-break: break-word; border: 0; position: relative; }
.wf-field-inner { position: relative; display: flex; flex: 1; }
.wf-field-input:focus { border: 1px solid #DE4D4D; }
.wf-field-dropdown .wf-field-input:focus { border: none; }
.wf-input-focus.wf-field::after { opacity: 1; }
.wf-input-focus.wf-field::after, .wf-field-error-active.wf-field .wf-field-error { display: block; }
.wf-field-error-active.wf-field .wf-error-view-more { display: flex; }
.wf-field-error-active.wf-field .wf-field-input:not(.date-input-container .wf-field-input), .wf-field-error-active.wf-field .wf-field-dropdown, .wf-field-error-active .date-input-container { border: 1px solid #FD6B6D; box-shadow: 0 0 1px 1px #F4A2A2; }
.wf-field-mandatory .wf-field-inner::before { content: ''; position: absolute; left: 0px; background-color: #ff6a6a; width: 3px; height: 100%; border-top-left-radius: 4px; border-bottom-left-radius: 4px; z-index: 2; top: 0; bottom: 0; }
.wf-field-mandatory .wf-field-inner.no-results-elem::before { height: 98%; }
.wf-field-input, .wf-field-dropdown { width: 100%; border: 1px solid #BDC8D3; border-radius: 4px; padding: 10px 15px; min-height: 38px; font-size: 15px; font-family: inherit; }
select:not([data-wform-field='select-multiple']) { -webkit-appearance: none; -moz-appearance: none; background: transparent; background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='34' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>"); background-repeat: no-repeat; background-position-x: 99%; background-color: #fff; min-width: 70px; }
input, select { background-color: #fff; }
.wf-field-item { min-height: 38px; }
.wf-time-field-wrapper { display: flex; flex: 1; }
.wf-time-field-wrapper select { margin-left: 10px; }
.wf-form-component .wf-field-error, .wf-form-component .wf-field-help-text { text-align: left; }
.wf-form-component .wf-field-error { text-align: right; }
.wf-field-error { color: #FF5050; font-size: 12px; margin-top: 4px; display: none; animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both; transform: translate3d(0, 0, 0); backface-visibility: hidden; perspective: 1000px; }
.wf-field-error-long { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wf-error-view-more { font-size: 12px; display: none; white-space: nowrap; align-items: center; color: #1880d8; margin-top: 4px; }
.wf-error-view-more:hover { text-decoration: underline; cursor: pointer; }
.wf-error-parent-ele { display: flex; justify-content: end; }
.wf-field-help-text { color: #515159; font-size: 12px; margin-top: 5px; }
.wf-field-help-text + .wf-error-parent-ele .wf-field-error, .wf-field-help-text + .wf-error-parent-ele .wf-error-view-more { margin: 0; }
.wf-field-help-text-link { text-decoration: none; }
.wf-field-checkbox { cursor: pointer; border-radius: 3px; min-width: 14px; min-height: 20px; box-sizing: initial; accent-color: #DE4D4D; margin-right: 10px; margin-bottom: auto; }
.wf-field-dropdown-date { padding: 8px 12px; border-radius: 4px; font-size: 15px; cursor: pointer; }
.wf-field-dropdown-date { border: 1px solid #BDC8D3; }
.wf-field-dropdown-date:hover { border: 1px solid #65C199; }
.wform-field-item-upload-input { min-height: 5rem; background-color: #FBFCFD; border: 1px dashed #bdc8d3; line-height: 2.1; cursor: pointer; }
.wform-field-item-upload-input:focus { border: 1px dashed #bdc8d3; }
.wform-file-upload-input-label { background-color: #fff; background-image: linear-gradient(to top, #F5F8FA, #ffffff); color: #212129; border-color: #d3dbe3; border: 1px solid #d3dbe3; border-radius: 4px; padding: 0.7rem 2rem; font-size: 1.4rem; right: 1rem; transform: translateY(-50%); top: 50%; position: absolute; }
input[type='file']::file-selector-button, input[type='file']::-webkit-file-upload-button { opacity: 0; width: 0; height: 28px; }
.wf-row[data-ux-field-appearance='captcha'] .wf-field { display: flex; align-items: center; }
.wform-field-item-captcha-input { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.wf-field-captcha-img-wrap { border: 1px solid #BDC8D3; border-radius: 4px; border-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; height: initial; overflow: hidden; min-width: 120px; }
.wf-field-captcha-img { height: 38px; width: 100%; }
.reload-img { font-size: 23px; color: #4B5569; margin-right: 5px; }
.reload-captcha { margin-left: 10px; user-select: none }
.wf-btn { padding: 10px 20px; border-radius: 4px; font-size: 15px; cursor: pointer; font-weight: bold; font-family: inherit; }
.wf-btn[data-ux-btn-type='default'] { border-radius: 0; }
.wf-btn[data-ux-btn-type='primary'] { border-radius: 4px; }
.wf-btn[data-ux-btn-type='secondary'] { border-radius: 20px; }
.wform-btn-wrap { display: flex; margin-top: 40px; align-items: center; justify-content: flex-end; flex: 1; }
.wform-poweredby-container { position: absolute; left: 0; bottom: 0; border-top-right-radius: 10px; border-bottom-left-radius: 10px; background-color: #23384F; font-size: 13px; padding: 6px 8px; font-family: sans-serif; display: flex; align-items: center; }
.wf-text-area-input { resize: vertical; height: 100px; min-height: 100px; max-height: 200px; }
.dropdown-contents::after { border-left: 0.4rem solid transparent; border-right: 0.4rem solid transparent; border-top: 0.4rem solid black; top: 45%; content: ''; position: absolute; right: 1rem; pointer-events: none; }

/* RTL tweaks */
html[dir=rtl] .multiple-fields-div .wf-field-item:not(.selected-options) { border-radius: 4px 0 0 4px; }
html[dir=rtl] .multiple-fields-div .wf-field-dropdown { border-radius: 0 4px 4px 0; border-left: 0; border-right: 1px solid #BDC8D3; }
html[dir=rtl] .ux-pick-mixed .dropdown-menu { right: -1px; }
html[dir=rtl] .wf-form-component[data-ux-form-alignment='left'] .wf-label { padding-left: 2rem; padding-right: 0; }
html[dir=rtl] .wf-time-field-wrapper select { margin-left: 0; margin-right: 10px; }
html[dir=rtl] .wf-calendar-nav-icons.nav-icon-with-space { margin-left: 10px; }

/* Alignment */
.wf-form-component:not([data-ux-form-alignment='top']) .wf-row { display: flex; }
.wf-form-component:not([data-ux-form-alignment='top']) .wf-label { word-break: break-word; width: 30%; padding: 1.2rem 2rem 0; }
.wf-form-component[data-ux-form-alignment='left'] .wf-label { text-align: left; padding-left: 0; }
.wf-form-component[data-ux-form-alignment='right'] .wf-label { text-align: right; }
.wf-form-component[data-ux-form-alignment='center'] .wf-label { text-align: center; }
.wform-btn-wrap[data-ux-pos='left'] { justify-content: flex-start; }
.wform-btn-wrap[data-ux-pos='center'] { justify-content: center; }
.wform-btn-wrap[data-ux-pos='right'] { justify-content: flex-end; }
.wf-form-component:not([data-ux-form-alignment='top']) .wf-field { width: 70%; }
.wf-form-component[data-ux-form-alignment='top'] .wf-label { padding-top: 0; }
.wf-form-component[data-ux-form-alignment='top'] .reload-captcha { text-align: right; }
.wf-row[data-ux-field-appearance='captcha'] .wf-field-inner { height: 38px; }
.wf-row[data-ux-field-appearance='captcha'] .wf-field.wf-field-error-active { flex-wrap: wrap; }
.wf-row[data-ux-field-appearance='captcha'] .wf-field-error { flex-basis: 100%; width: 100%; }

/* Animations */
@keyframes shake {
  10%,90% {transform: translate3d(-1px, 0, 0);}
  20%,80% {transform: translate3d(2px, 0, 0);}
  30%,50%,70% {transform: translate3d(-4px, 0, 0);}
  40%,60% {transform: translate3d(4px, 0, 0);}
}

/* Media */
@media screen and (max-width: 1024px) {
  .wf-wrapper { max-width: 700px; width: calc(100% - 40px); border: 0; }
  .wf-field input[type=text], .wf-field select, .wf-field textarea { width: 100% !important; }
  .wf-label:empty { display: none; }
  .wf-field-checkbox { min-width: 18px; min-height: 18px; }
}
@media screen and (max-width: 768px) {
  .wf-wrapper { max-width: 700px; width: calc(100% - 40px); border: 0; }
  .wf-field input[type=text], .wf-field select, .wf-field textarea { width: 100% !important; }
  .wf-label:empty { display: none; }
  .wf-form-component[data-ux-form-alignment='top'] .wform-btn-wrap { justify-content: flex-start; }
}
@media screen and (max-width: 590px) {
  .wf-parent { padding: 20px 0; }
  .wf-wrapper { width: calc(100% - 40px) !important; border: 0; }
  .wf-form-component { padding: 20px; padding-bottom: 60px; }
  .wf-field input[type=text], .wf-field select, .wf-field textarea { width: 100% !important; }
  .wf-label:empty { display: none; }
  .wf-row[data-ux-field-appearance='date-time'] .wf-field-inner { flex-direction: column; }
  .wf-row[data-ux-field-appearance='date-time'] .wf-time-field-wrapper { margin-top: 10px; }
  .wf-row[data-ux-field-appearance='date-time'] .wf-field-item:first-child { margin-left: 0; }
  .wf-row[data-ux-field-appearance='date-time'] .wf-field-item { flex: 1; }
  .wf-row[data-ux-field-appearance='captcha'] .wf-field { flex-direction: column; }
  .wf-row[data-ux-field-appearance='captcha'] .reload-captcha { margin-left: auto; }
  .wf-row[data-ux-field-appearance='captcha'] .wf-field-inner { width: 100%; }
}

/* Added to match */
/* === Bigin/Zoho form — theme-scoped overrides =========================
   Scope: only inside .bigin-form (wrap your shortcode/output with this class).
   Uses WP theme.json tokens with fallbacks so it matches your site instantly.
========================================================================= */

.bigin-form {
  /* Let the site’s font + colors drive the form */
  --bigin-bg: var(--wp--preset--color--background, #ffffff);
  --bigin-surface: var(--wp--preset--color--base, #ffffff);
  --bigin-text: var(--wp--preset--color--contrast, #111111);
  --bigin-muted: var(--wp--preset--color--neutral-700, #515159);
  --bigin-border: var(--wp--preset--color--neutral-300, #cfd6dd);
  --bigin-primary: var(--wp--preset--color--primary, #0057d9);
  --bigin-primary-contrast: var(--wp--preset--color--base, #ffffff);
  --bigin-danger: var(--wp--preset--color--vivid-red, #e11d48);

  --bigin-radius: var(--wp--custom--radius--md, 8px);
  --bigin-shadow: 0 1px 2px rgba(0,0,0,.08), 0 6px 24px rgba(0,0,0,.06);

  --bigin-gap: var(--wp--style--block-gap, 1.25rem);
  --bigin-field-height: 44px;

  --bigin-font: var(--wp--preset--font-family--system, inherit);
  --bigin-fs-body: var(--wp--preset--font-size--medium, 16px);
  --bigin-fs-label: var(--wp--preset--font-size--small, 14px);
  --bigin-fs-title: clamp(20px, 2.2vw, 28px);
}

/* Container */
.bigin-form .wf-parent {
  background: var(--bigin-bg) !important;
  padding: max(20px, var(--bigin-gap));
}
.bigin-form .wf-wrapper {
  background: var(--bigin-surface) !important;
  color: var(--bigin-text) !important;
  border-radius: var(--bigin-radius) !important;
  box-shadow: var(--bigin-shadow) !important;
  border: 1px solid color-mix(in srgb, var(--bigin-border) 80%, transparent) !important;
  font-family: var(--bigin-font) !important;
  font-size: var(--bigin-fs-body) !important;
}

/* Header / section titles */
.bigin-form .wf-header {
  font-size: var(--bigin-fs-title) !important;
  font-weight: 700 !important;
  letter-spacing: -.01em;
  padding-bottom: calc(var(--bigin-gap) * 1) !important;
}
.bigin-form .wf-sec-title {
  font-size: clamp(16px, 1.6vw, 20px) !important;
  font-weight: 700 !important;
}

/* Labels */
.bigin-form .wf-label {
  color: var(--bigin-muted) !important;
  font-size: var(--bigin-fs-label) !important;
}

/* Fields (inputs, selects, textarea) */
.bigin-form .wf-field-input,
.bigin-form .wf-field-dropdown,
.bigin-form .dropdown-input,
.bigin-form .wf-text-area-input {
  background: #fff !important;
  color: var(--bigin-text) !important;
  border: 1px solid var(--bigin-border) !important;
  border-radius: 10px !important;
  min-height: var(--bigin-field-height) !important;
  padding: 10px 14px !important;
  box-shadow: none !important;
  transition: border-color .2s, box-shadow .2s;
}
.bigin-form .wf-field-input:focus,
.bigin-form .wf-field-dropdown:focus,
.bigin-form .dropdown-input:focus,
.bigin-form .wf-text-area-input:focus {
  border-color: var(--bigin-primary) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--bigin-primary) 15%, transparent) !important;
}

/* Select chevron color visibility in dark themes */
.bigin-form select:not([data-wform-field='select-multiple']) {
  background-color: #fff !important;
}

/* Error state */
.bigin-form .wf-field-error {
  color: var(--bigin-danger) !important;
}
.bigin-form .wf-field-error-active .wf-field-input,
.bigin-form .wf-field-error-active .wf-field-dropdown,
.bigin-form .wf-field-error-active .date-input-container {
  border-color: var(--bigin-danger) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--bigin-danger) 15%, transparent) !important;
}

/* Mandatory stripe color nudge to theme primary */
.bigin-form .wf-field-mandatory .wf-field-inner::before {
  background-color: var(--bigin-primary) !important;
}

/* Buttons */
.bigin-form .wf-btn {
  background: var(--bigin-primary) !important;
  color: var(--bigin-primary-contrast) !important;
  border: 1px solid var(--bigin-primary) !important;
  border-radius: 999px !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  transition: filter .2s, transform .02s;
}
.bigin-form .wf-btn:hover { filter: brightness(1.05) !important; }
.bigin-form .wf-btn:active { transform: translateY(1px); }

/* Links and accents */
.bigin-form .link,
.bigin-form .reload-captcha,
.bigin-form .wf-error-view-more {
  color: var(--bigin-primary) !important;
}

/* Checkboxes, radios */
.bigin-form .wf-field-checkbox {
  accent-color: var(--bigin-primary) !important;
}

/* Dropdown (country, multipick) */
.bigin-form .multiselect.wf-field-dropdown {
  border-color: var(--bigin-border) !important;
  border-radius: 10px !important;
}
.bigin-form .dropdown-menu {
  border: 1px solid var(--bigin-border) !important;
  border-radius: 10px !important;
  box-shadow: var(--bigin-shadow) !important;
}
.bigin-form .option:hover {
  background: color-mix(in srgb, var(--bigin-primary) 8%, #fff) !important;
}
.bigin-form .option[data-selected='true'] {
  background: color-mix(in srgb, var(--bigin-primary) 12%, #fff) !important;
}

/* Date picker popup */
.bigin-form .wf-calendar-popup-wrapper {
  border: 1px solid var(--bigin-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--bigin-shadow) !important;
}
.bigin-form .wf-calendar-date.selected {
  background: var(--bigin-primary) !important;
  color: #fff !important;
}
.bigin-form .wf-calendar-date.current-date {
  box-shadow: 0 0 0 2px var(--bigin-primary) inset !important;
  border-radius: 999px !important;
}

/* “Powered by” tag muted */
.bigin-form #poweredBy104540000000376163,
.bigin-form #poweredBy104540000000370944 {
  background: color-mix(in srgb, var(--bigin-text) 70%, transparent) !important;
}

/* Respect WordPress “is-dark-theme” if used */
.is-dark-theme .bigin-form .wf-wrapper {
  background: color-mix(in srgb, var(--bigin-surface) 92%, black) !important;
  color: var(--bigin-text) !important;
}
.is-dark-theme .bigin-form .wf-field-input,
.is-dark-theme .bigin-form .wf-field-dropdown,
.is-dark-theme .bigin-form .dropdown-input,
.is-dark-theme .bigin-form .wf-text-area-input,
.is-dark-theme .bigin-form select {
  background: color-mix(in srgb, #000 7%, var(--bigin-surface)) !important;
  color: var(--bigin-text) !important;
  border-color: color-mix(in srgb, var(--bigin-border) 70%, #000) !important;
}

/* Form background */
.bigin-form .wf-parent {
  background-color: #0f0f0f !important;
}

/* Wrapper stays white so the form itself has contrast */
.bigin-form .wf-wrapper {
  background-color: #ffffff !important;
  border-radius: 10px;
  padding: 20px;
  color: #111;
}

/* Submit button */
.bigin-form .wf-btn.wf-btn-custom {
  background-color: #aa2b00 !important;
  color: #fff !important;
  border: 1px solid #aa2b00 !important;
  border-radius: 10px !important;
  padding: 12px 18px !important;
  font-weight: 600;
  transition: filter .2s, transform .02s;
}
.bigin-form .wf-btn.wf-btn-custom:hover {
  filter: brightness(1.1);
}
.bigin-form .wf-btn.wf-btn-custom:active {
  transform: translateY(1px);
}

.bigin-form .wf-parent,
.bigin-form .wf-wrapper {
  overflow-x: hidden !important;
}
.bigin-form .wf-wrapper * {
  max-width: 100% !important;
  box-sizing: border-box;
}

.wf-row[data-ux-field-appearance='recaptcha'] .wf-field {
  display: flex;
  justify-content: flex-end;
}
.wf-row[data-ux-field-appearance='recaptcha'] .wf-field-inner {
  width: auto;
}

/* Right-align reCAPTCHA */
.wf-row[data-ux-field-appearance='recaptcha'] .wf-field-inner {
  display: flex !important;
  justify-content: flex-end !important;
  width: 100% !important;
}

/* In case the captcha div tries to expand */
.wf-row[data-ux-field-appearance='recaptcha'] .g-recaptcha {
  margin-left: auto !important;
}

.multi-select-container {
    width: 100%;
}

.multi-select-container .dropdown {
    width: 100%;
}
