.elementor-1266 .elementor-element.elementor-element-152dea4f{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}body.elementor-page-1266:not(.elementor-motion-effects-element-type-background), body.elementor-page-1266 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0B0A0A;}:root{--page-title-display:none;}@media(max-width:1366px){.elementor-widget-text-editor{line-height:var( --e-global-typography-text-line-height );}}@media(max-width:1024px){.elementor-widget-text-editor{line-height:var( --e-global-typography-text-line-height );}}@media(max-width:767px){.elementor-widget-text-editor{line-height:var( --e-global-typography-text-line-height );}}/* Start custom CSS */.centrex-app-container {
    /* Design tokens pulled from the live Viva contact form */
    --viva-gold:        #C9A84C; /* labels, button fill, focus border          */
    --viva-gold-light:  #E8C97A; /* button hover fill                          */
    --viva-field-bg:    #181818; /* input / select / textarea fill             */
    --viva-panel-bg:    #0A0A0A; /* optional dark panel behind the whole form  */
    --viva-text:        #FFFFFF; /* typed field text                           */
    --viva-muted:       rgba(255, 255, 255, .58); /* placeholders / select val */
    --viva-border:      rgba(201, 168, 76, .35);  /* #C9A84C59 field border    */
    --viva-font:        "Montserrat", -apple-system, "Segoe UI", sans-serif;
}

/* ---------------------------------------------------------------------------
   OPTIONAL dark panel
   The Viva form sits on a dark section. If your Centrex form is on a light
   background, enable this block to wrap it in the same near-black panel so the
   gold labels and white field text stay readable. Delete it if the Elementor
   section behind the form is already dark.
   --------------------------------------------------------------------------- */
/*
.centrex-app-container {
    background-color: var(--viva-panel-bg);
    padding: 40px;
}
*/

/* ---------------------------------------------------------------------------
   Fields: text inputs, textarea, select
   --------------------------------------------------------------------------- */
.centrex-app-container input[type=email],
.centrex-app-container input[type=date],
.centrex-app-container input[type=search],
.centrex-app-container input[type=number],
.centrex-app-container input[type=text],
.centrex-app-container input[type=tel],
.centrex-app-container input[type=url],
.centrex-app-container input[type=password],
.centrex-app-container textarea,
.centrex-app-container select,
.centrex-app-container select.form-control {
    background-color: var(--viva-field-bg) !important;
    color: var(--viva-text) !important;
    border: 1px solid var(--viva-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: var(--viva-font) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.8 !important;
    min-height: 40px;
    padding: 8px 14px;
}

/* Select shows its chosen value slightly muted, matching the source form */
.centrex-app-container select,
.centrex-app-container select.form-control {
    color: var(--viva-muted) !important;
    /* gold chevron caret (replaces the plugin's dark grey one) */
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23C9A84C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right .7em top 50% !important;
    background-size: auto 16px !important;
    padding-right: 2em;
}

/* Placeholders */
.centrex-app-container input::placeholder,
.centrex-app-container textarea::placeholder {
    color: var(--viva-muted) !important;
    opacity: 1 !important;
}

/* Hover / focus: keep the dark fill, brighten the gold border */
.centrex-app-container input:hover,
.centrex-app-container textarea:hover,
.centrex-app-container select:hover,
.centrex-app-container input:focus,
.centrex-app-container textarea:focus,
.centrex-app-container select:focus {
    background-color: var(--viva-field-bg) !important;
    color: var(--viva-text) !important;
    border-color: var(--viva-gold) !important;
    box-shadow: 0 0 0 1px rgba(201, 168, 76, .35) !important;
    outline: 0 !important;
}

/* ---------------------------------------------------------------------------
   Labels
   --------------------------------------------------------------------------- */
.centrex-app-container label,
.centrex-app-container legend,
.centrex-app-container .formbuilder-checkbox-group-label,
.centrex-app-container .formbuilder-radio-group-label,
.centrex-app-container .formbuilder-plaid-label,
.centrex-app-container .formbuilder-address-composite-label {
    color: var(--viva-gold) !important;
    font-family: var(--viva-font) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.8 !important;
    text-transform: uppercase !important;
    letter-spacing: .5px;
    margin-bottom: 10px;
}

/* Required asterisk keeps the gold family */
.centrex-app-container .formbuilder-required {
    color: var(--viva-gold) !important;
}

/* Validation error text stays readable on the dark theme */
.centrex-app-container label.error {
    color: #ff6b6b !important;
    text-transform: none !important;
    font-size: 12px !important;
}
.centrex-app-container input.error,
.centrex-app-container select.error,
.centrex-app-container textarea.error {
    border-color: #ff6b6b !important;
}

/* Currency symbol on Number/Currency fields */
.centrex-app-container .centrex-currency-symbol {
    color: var(--viva-gold) !important;
}

/* Checkbox / radio accents */
.centrex-app-container input[type="checkbox"],
.centrex-app-container input[type="radio"] {
    accent-color: var(--viva-gold);
}
.centrex-app-container input[type=checkbox] + label,
.centrex-app-container input[type=radio] + label,
.centrex-app-container label > .label-body {
    text-transform: none !important;
    color: var(--viva-text) !important;
    font-size: 13px !important;
}

/* ---------------------------------------------------------------------------
   Section titles (header field: renders as h1-h6 inside .form-group)
   These were inheriting white from the dark theme; make them gold.
   --------------------------------------------------------------------------- */
.centrex-app-container .rendered-form h1,
.centrex-app-container .rendered-form h2,
.centrex-app-container .rendered-form h3,
.centrex-app-container .rendered-form h4,
.centrex-app-container .rendered-form h5,
.centrex-app-container .rendered-form h6 {
    color: var(--viva-gold) !important;
}

/* ---------------------------------------------------------------------------
   Multi-page progress bar (step bar) - retheme the green fill to gold
   .centrex-progress-bar-fill was rgb(43,194,83) green on a #555 grey track.
   --------------------------------------------------------------------------- */
.centrex-app-container .centrex-progress-bar-background {
    background: var(--viva-field-bg) !important;
    border: 1px solid var(--viva-border) !important;
    box-shadow: none !important;
}
.centrex-app-container .centrex-progress-bar-fill {
    background-color: var(--viva-gold) !important;
    box-shadow: none !important;
}
.centrex-app-container .step-text {
    color: var(--viva-gold) !important;
    font-family: var(--viva-font) !important;
}

/* ---------------------------------------------------------------------------
   Buttons - gold fill matching the Elementor button.
   Primary action = standalone Submit + multi-page Next/Submit. Previous is the
   dark, gold-outlined secondary.
   --------------------------------------------------------------------------- */
.centrex-app-container button,
.centrex-app-container .centrex-forms-button-container button.next-btn,
.centrex-app-container .centrex-forms-button-container button#centrex-submit {
    background-color: var(--viva-gold) !important;
    color: var(--viva-panel-bg) !important;
    border: 1px solid var(--viva-gold) !important;
    border-radius: 0 !important;
    font-family: var(--viva-font) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.12px !important;
    line-height: 1.8 !important;
    padding: 12px 24px;
    text-shadow: none !important;
    transition: background-color .25s ease, color .25s ease;
}
.centrex-app-container button:hover,
.centrex-app-container .centrex-forms-button-container button.next-btn:hover,
.centrex-app-container .centrex-forms-button-container button#centrex-submit:hover {
    background-color: var(--viva-gold-light) !important;
    color: var(--viva-panel-bg) !important;
    border-color: var(--viva-gold-light) !important;
}

/* Multi-page nav row: keep buttons on ONE line.
   Previous hugs the LEFT (margin-right:auto), Next/Submit sits on the RIGHT.
   A lone Next (page 1) lands on the right too. This overrides the earlier
   full-width so the buttons never stack. */
.centrex-app-container .centrex-forms-button-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;   /* keep the pair together, centered */
    align-items: center;
    gap: 16px;
}
.centrex-app-container .centrex-forms-button-container button {
    width: auto !important;
    max-width: 260px !important;
    min-width: 140px;
    flex: 0 1 auto;
    margin: 20px 0 !important;
}
.centrex-app-container .centrex-forms-button-container button.prev-btn {
    order: 1;                          /* left within the centered pair */
    background-color: var(--viva-field-bg) !important;
    color: var(--viva-text) !important;
    border: 1px solid var(--viva-gold) !important;
    border-radius: 0 !important;
    font-family: var(--viva-font) !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 1.12px !important;
}
.centrex-app-container .centrex-forms-button-container button.prev-btn:hover {
    background-color: rgba(201, 168, 76, .12) !important;
    color: var(--viva-text) !important;
}
.centrex-app-container .centrex-forms-button-container button.next-btn,
.centrex-app-container .centrex-forms-button-container button#centrex-submit {
    order: 2;                          /* right */
}

/* Plaid "Link account" button keeps the gold treatment too */
.centrex-app-container button.btn.centrex-plaid-link-button {
    background-color: var(--viva-gold) !important;
    color: var(--viva-panel-bg) !important;
    border-color: var(--viva-gold) !important;
}

/* ---------------------------------------------------------------------------
   OPTIONAL: file upload (FilePond) dark treatment, in case the form has a
   file field. The Viva contact form has none, so these are best-effort to
   keep uploads on-theme rather than a white box.
   --------------------------------------------------------------------------- */
.centrex-app-container .centrex-filepond-wrapper .filepond--panel-root {
    background-color: var(--viva-field-bg) !important;
    border: 1px solid var(--viva-border) !important;
    border-radius: 0 !important;
}
.centrex-app-container .centrex-filepond-wrapper .filepond--drop-label,
.centrex-app-container .centrex-filepond-wrapper .filepond--drop-label label {
    color: var(--viva-muted) !important;
}
.centrex-app-container .centrex-filepond-wrapper .filepond--label-action {
    color: var(--viva-gold) !important;
    text-decoration-color: var(--viva-gold) !important;
}


/* ---------------------------------------------------------------------------
   Required document upload — clear red state when a required upload is skipped.
   Your gold `.filepond--panel-root` border above is !important, which hides the
   plugin's own red error border. This re-asserts a red highlight (with the extra
   error hook + !important so it wins) only when a required upload was missed.
   Uses :has() so it works whether or not the upload hotfix is installed.
   --------------------------------------------------------------------------- */
.centrex-app-container .centrex-filepond-wrapper.centrex-filepond-error .filepond--panel-root,
.centrex-app-container .centrex-filepond-wrapper:has(label.error) .filepond--panel-root {
    border: 2px solid #ff6b6b !important;
    background-color: rgba(255, 107, 107, .08) !important;
}

/* Make the "please upload" message read clearly (your label.error already
   colors it; this just gives it room and weight). */
.centrex-app-container .centrex-filepond-wrapper label.error {
    display: block !important;
    margin-top: 6px !important;
    font-weight: 600 !important;
}/* End custom CSS */