/* ============================================================
   Ninja Forms skin - Riverside Custom Countertops
   Enqueued LAST (handle rcc-ninja-forms, dep rcc-main) so it beats
   Ninja Forms' default stylesheet and Divi. Element-level selectors
   scoped to .leadform--nf, every rule !important.
   ============================================================ */

.leadform--nf .nf-form-cont,
.leadform--nf .nf-form-layout,
.leadform--nf .nf-form-content{padding:0!important;margin:0!important;max-width:none!important;width:100%!important}
.leadform--nf .nf-form-content .nf-field-container{margin-bottom:14px!important}
.leadform--nf .nf-form-content .nf-field-container:last-child{margin-bottom:0!important}
.leadform--nf .nf-form-title,
.leadform--nf .nf-form-fields-required{display:none!important}
.leadform--nf .nf-before-form-content{display:none!important}
.leadform--nf .nf-form-content .nf-field-label{padding:0!important;margin:0 0 6px!important}
.leadform--nf .nf-field-element{margin:0!important}

/* Labels: uppercase, letterspaced, --ink-2 */
.leadform--nf label,
.leadform--nf .nf-form-content label,
.leadform--nf .nf-field-label label{display:block!important;font-family:var(--font-b)!important;font-size:12.5px!important;font-weight:700!important;letter-spacing:.09em!important;text-transform:uppercase!important;color:var(--ink-2)!important;line-height:1.4!important;margin:0 0 6px!important;padding:0!important}
.leadform--nf .nf-form-content label .ninja-forms-req-symbol,
.leadform--nf .ninja-forms-req-symbol{color:var(--clay)!important;font-weight:700!important}

/* Inputs: white fill, --line-2 border, square corners */
.leadform--nf input[type="text"],
.leadform--nf input[type="tel"],
.leadform--nf input[type="email"],
.leadform--nf input[type="number"],
.leadform--nf textarea,
.leadform--nf select,
.leadform--nf .nf-form-content input:not([type="button"]):not([type="submit"]),
.leadform--nf .nf-form-content textarea{display:block!important;width:100%!important;max-width:none!important;box-sizing:border-box!important;font-family:var(--font-b)!important;font-size:16px!important;line-height:1.4!important;color:var(--ink)!important;background:var(--paper)!important;border:1.5px solid var(--line-2)!important;border-radius:0!important;padding:13px 14px!important;min-height:50px!important;height:auto!important;margin:0!important;box-shadow:none!important;-webkit-appearance:none!important;appearance:none!important}
.leadform--nf textarea,
.leadform--nf .nf-form-content textarea{min-height:88px!important;resize:vertical!important}
.leadform--nf input::placeholder,
.leadform--nf textarea::placeholder{color:var(--muted)!important;opacity:1!important}

/* Teal focus ring */
.leadform--nf input:focus,
.leadform--nf textarea:focus,
.leadform--nf select:focus,
.leadform--nf .nf-form-content input:focus,
.leadform--nf .nf-form-content textarea:focus{outline:2px solid var(--teal)!important;outline-offset:-1px!important;border-color:var(--teal)!important;box-shadow:none!important}

/* Submit: full-width ink button, teal on hover */
.leadform--nf input[type="button"],
.leadform--nf input[type="submit"],
.leadform--nf button[type="submit"],
.leadform--nf .nf-form-content .submit-container input[type="button"],
.leadform--nf .nf-form-content input[type="button"],
.leadform--nf .nf-form-content button{display:block!important;width:100%!important;min-height:58px!important;padding:16px 32px!important;font-family:var(--font-b)!important;font-size:16.5px!important;font-weight:700!important;letter-spacing:.02em!important;line-height:1.2!important;color:var(--paper)!important;background:var(--ink)!important;border:1.5px solid var(--ink)!important;border-radius:0!important;cursor:pointer!important;text-transform:none!important;transition:background .16s,border-color .16s!important;margin:4px 0 0!important;box-shadow:none!important;height:auto!important}
.leadform--nf input[type="button"]:hover,
.leadform--nf input[type="submit"]:hover,
.leadform--nf button[type="submit"]:hover,
.leadform--nf .nf-form-content .submit-container input[type="button"]:hover,
.leadform--nf .nf-form-content input[type="button"]:hover,
.leadform--nf .nf-form-content button:hover,
.leadform--nf input[type="button"]:focus-visible,
.leadform--nf .nf-form-content input[type="button"]:focus-visible{background:var(--teal)!important;border-color:var(--teal)!important;color:#fff!important;outline:none!important}
.leadform--nf input[type="button"][disabled],
.leadform--nf .nf-form-content input[type="button"][disabled]{opacity:.6!important;cursor:wait!important}

/* Hidden "required field" banner + honeypot */
.leadform--nf .nf-form-fields-required,
.leadform--nf .nf-form-hp{display:none!important}

/* Errors and response messages in brand colours */
.leadform--nf .nf-error-msg,
.leadform--nf .nf-error-required-error,
.leadform--nf .ninja-forms-req-symbol{color:var(--clay)!important;font-family:var(--font-b)!important;font-size:13px!important;font-weight:600!important}
.leadform--nf .nf-error .ninja-forms-field{border-color:var(--clay)!important}
.leadform--nf .nf-error-wrap{margin-top:6px!important}
.leadform--nf .nf-response-msg{font-family:var(--font-b)!important;font-size:15.5px!important;color:var(--ink)!important;background:var(--bone-2)!important;border:1.5px solid var(--ink)!important;padding:16px 18px!important;margin:0!important}
.leadform--nf .nf-response-msg p{color:var(--ink)!important;margin:0!important}

/* Dark-section guard: the lead card is light even inside .cta / photo heroes */
.cta .leadform--nf label,
.hero--img .leadform--nf label,
.hero--photo .leadform--nf label,
.sect--ink .leadform--nf label{color:var(--ink-2)!important}
.cta .leadform--nf input,
.cta .leadform--nf textarea,
.hero--img .leadform--nf input,
.hero--img .leadform--nf textarea,
.hero--photo .leadform--nf input,
.hero--photo .leadform--nf textarea{color:var(--ink)!important;background:var(--paper)!important}
.cta .leadbox .form__fine,
.hero--img .leadbox .form__fine,
.hero--photo .leadbox .form__fine{color:var(--muted)!important}
.cta .leadbox .form__fine a,
.hero--img .leadbox .form__fine a,
.hero--photo .leadbox .form__fine a{color:var(--teal-dk)!important}

/* ------------------------------------------------------------
   Match the static build's card: Name full width, Phone + Email
   side by side, Project details full width, full-width button.
   Ninja Forms wraps every field in <nf-fields-wrap> > <nf-field> >
   .nf-field-container, so the grid lives on nf-fields-wrap and the
   <nf-field> elements are the grid items.
   ------------------------------------------------------------ */
.leadform--nf .nf-form-content{display:block!important;width:100%!important}
.leadform--nf nf-fields-wrap{display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important;width:100%!important}
.leadform--nf nf-field{display:block!important;grid-column:1 / -1!important;min-width:0!important;width:100%!important}
.leadform--nf nf-field:has(> .phone-container),
.leadform--nf nf-field:has(> .tel-container),
.leadform--nf nf-field:has(> .email-container){grid-column:auto!important}
.leadform--nf .nf-field-container{margin:0!important;width:100%!important}
.leadform--nf .nf-field-element{width:100%!important}
.leadform--nf .nf-form-content .submit-container{margin-top:4px!important}
.leadform--nf .nf-error-wrap{margin-top:6px!important}
.leadform--nf .nf-error-msg{display:block!important;margin:0!important;line-height:1.4!important}
.leadform--nf .nf-form-errors{margin-top:10px!important}
.leadform--nf .nf-form-errors .nf-error-msg{font-size:12.5px!important;color:var(--clay)!important}
.leadform--nf .nf-after-form-content{margin-top:12px!important}
@media (max-width:640px){
  .leadform--nf nf-fields-wrap{grid-template-columns:1fr!important}
  .leadform--nf nf-field:has(> .phone-container),
  .leadform--nf nf-field:has(> .tel-container),
  .leadform--nf nf-field:has(> .email-container){grid-column:1 / -1!important}
}
