.nfs-public-form {
  --nfs-primary: #2563eb;
  --nfs-primary-hover: #1d4ed8;
  --nfs-text: #111827;
  --nfs-muted: #6b7280;
  --nfs-border: #d1d5db;
  --nfs-border-focus: #2563eb;
  --nfs-bg: #ffffff;
  --nfs-error: #b91c1c;
  --nfs-input-text: #111827;
  --nfs-input-bg: #ffffff;
  --nfs-border-width: 1px;
  --nfs-radius: 12px;
  --nfs-font-size: 16px;
  --nfs-input-padding-y: 11px;
  --nfs-input-padding-x: 14px;
  --nfs-field-gap: 22px;
  --nfs-button-text: #ffffff;
  --nfs-button-radius: 12px;
  --nfs-button-font-size: 16px;
  --nfs-button-padding-y: 14px;
  --nfs-button-padding-x: 22px;
  --nfs-message-radius: 12px;
  --nfs-form-bg: #ffffff;
  --nfs-form-max-width: 860px;
  --nfs-form-padding-top: 0px;
  --nfs-form-padding-right: 0px;
  --nfs-form-padding-bottom: 0px;
  --nfs-form-padding-left: 0px;
  --nfs-form-shadow: none;
  --nfs-label-size: 0.95em;
  --nfs-label-weight: 700;
  --nfs-label-gap: 8px;
  --nfs-help-size: 0.9em;
  --nfs-help-color: var(--nfs-muted);
  --nfs-help-gap: 6px;
  --nfs-required-color: var(--nfs-error);
  --nfs-button-min-height: 48px;
  --nfs-button-gap: 26px;
  --nfs-button-text-transform: none;
  --nfs-button-hover-translate: 0px;
  --nfs-button-hover-scale: 1;
  --nfs-button-transition-ms: 200ms;
  --nfs-field-min-height: 48px;
  --nfs-textarea-min-height: 130px;
  --nfs-column-gap: 22px;
  --nfs-transition-ms: 200ms;
  --nfs-focus-ring-width: 3px;
  --nfs-focus-ring-color: var(--nfs-border-focus);
  --nfs-font-stack: inherit;
  --nfs-border-input-width-top: var(--nfs-border-width);
  --nfs-border-input-width-right: var(--nfs-border-width);
  --nfs-border-input-width-bottom: var(--nfs-border-width);
  --nfs-border-input-width-left: var(--nfs-border-width);
  --nfs-border-input-focus-width-top: var(--nfs-border-input-width-top);
  --nfs-border-input-focus-width-right: var(--nfs-border-input-width-right);
  --nfs-border-input-focus-width-bottom: var(--nfs-border-input-width-bottom);
  --nfs-border-input-focus-width-left: var(--nfs-border-input-width-left);
  --nfs-border-input-style: solid;
  --nfs-border-input-color: var(--nfs-border);
  --nfs-border-input-color-focus: var(--nfs-border-focus);
  --nfs-msg-success-bg: #ecfdf5;
  --nfs-msg-success-text: #047857;
  --nfs-msg-success-border: #a7f3d0;
  --nfs-msg-error-bg: #fef2f2;
  --nfs-msg-error-text: #b91c1c;
  --nfs-msg-error-border: #fecaca;
  --nfs-msg-warning-bg: #fffbeb;
  --nfs-msg-warning-text: #92400e;
  --nfs-msg-warning-border: #fcd34d;
  --nfs-msg-info-bg: #eff6ff;
  --nfs-msg-info-text: #1e40af;
  --nfs-msg-info-border: #93c5fd;
  --nfs-msg-success-radius: var(--nfs-message-radius);
  --nfs-msg-error-radius: var(--nfs-message-radius);
  --nfs-msg-warning-radius: var(--nfs-message-radius);
  --nfs-msg-info-radius: var(--nfs-message-radius);
  --nfs-msg-success-padding-y: 14px;
  --nfs-msg-success-padding-x: 16px;
  --nfs-msg-error-padding-y: 14px;
  --nfs-msg-error-padding-x: 16px;
  --nfs-msg-warning-padding-y: 14px;
  --nfs-msg-warning-padding-x: 16px;
  --nfs-msg-info-padding-y: 14px;
  --nfs-msg-info-padding-x: 16px;

  box-sizing: border-box;
  width: 100%;
  max-width: var(--nfs-form-max-width, 860px);
  margin: 0;
  margin-left: var(--nfs-form-margin-left, 0);
  margin-right: var(--nfs-form-margin-right, 0);
  padding:
    var(--nfs-form-padding-top, 0px)
    var(--nfs-form-padding-right, 0px)
    var(--nfs-form-padding-bottom, 0px)
    var(--nfs-form-padding-left, 0px);
  border-top-width: var(--nfs-border-form-width-top, 0px);
  border-right-width: var(--nfs-border-form-width-right, 0px);
  border-bottom-width: var(--nfs-border-form-width-bottom, 0px);
  border-left-width: var(--nfs-border-form-width-left, 0px);
  border-style: var(--nfs-border-form-style, solid);
  border-color: var(--nfs-border-form-color, transparent);
  border-radius: var(--nfs-radius-form-tl, 0px)
    var(--nfs-radius-form-tr, 0px)
    var(--nfs-radius-form-br, 0px)
    var(--nfs-radius-form-bl, 0px);
  background-color: var(--nfs-form-bg, var(--nfs-bg, #ffffff));
  box-shadow: var(--nfs-form-shadow, none);
  color: var(--nfs-text);
  font-family: var(--nfs-font-stack, inherit);
  font-size: var(--nfs-base-size, var(--nfs-font-size));
  font-weight: var(--nfs-base-weight, 400);
  letter-spacing: var(--nfs-letter-spacing, 0px);
  line-height: var(--nfs-base-line-height, 1.5);
}

.nfs-public-fields {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--nfs-field-gap, 22px);
  column-gap: var(--nfs-column-gap, var(--nfs-field-gap, 22px));
}

.nfs-public-form-layout-double .nfs-public-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--nfs-field-gap, 22px);
  column-gap: var(--nfs-column-gap, var(--nfs-field-gap, 22px));
}

.nfs-public-form-layout-double .nfs-public-fields > .nfs-public-field {
  width: auto;
  max-width: none;
  min-width: 0;
}

.nfs-public-form-layout-double .nfs-public-fields > .nfs-public-width-100 {
  grid-column: 1 / -1;
  width: auto;
  max-width: none;
}

.nfs-public-field {
  display: flex;
  flex-direction: column;
  gap: var(--nfs-label-gap, 8px);
  width: auto;
  max-width: none;
  box-sizing: border-box;
  min-width: 0;
}

.nfs-public-fields > .nfs-public-width-25 {
  grid-column: span 3;
  width: auto;
  max-width: none;
}

.nfs-public-fields > .nfs-public-width-33 {
  grid-column: span 4;
  width: auto;
  max-width: none;
}

.nfs-public-fields > .nfs-public-width-50 {
  grid-column: span 6;
  width: auto;
  max-width: none;
}

.nfs-public-fields > .nfs-public-width-66 {
  grid-column: span 8;
  width: auto;
  max-width: none;
}

.nfs-public-fields > .nfs-public-width-75 {
  grid-column: span 9;
  width: auto;
  max-width: none;
}

.nfs-public-fields > .nfs-public-width-100 {
  grid-column: 1 / -1;
  width: auto;
  max-width: none;
}

.nfs-public-fields > .nfs-public-field-step {
  grid-column: 1 / -1;
  width: auto;
  max-width: none;
}

.nfs-public-label {
  color: var(--nfs-label-color, var(--nfs-text));
  font-size: var(--nfs-label-size, 0.95em);
  font-weight: var(--nfs-label-weight, 700);
  line-height: var(--nfs-label-line-height, 1.3);
  letter-spacing: var(--nfs-label-letter-spacing, 0px);
  text-align: var(--nfs-label-align, left);
}

.nfs-public-required-marker,
.nfs-public-required-mark {
  color: var(--nfs-required-color, var(--nfs-error));
  margin-left: 3px;
  font-weight: 700;
}

.nfs-public-headline {
  margin: 0;
  color: var(--nfs-heading-color, var(--nfs-text));
  font-family: inherit;
  font-size: var(--nfs-heading-h3-size, var(--nfs-h3-size, calc(var(--nfs-font-size, 1rem) * 1.4)));
  line-height: var(--nfs-h3-line-height, 1.3);
  font-weight: var(--nfs-h3-weight, 800);
  margin-bottom: var(--nfs-h3-margin-bottom, 0px);
}

.nfs-public-headline.nfs-public-headline-h1,
.nfs-public-headline-h1 {
  font-size: var(--nfs-heading-h1-size, calc(var(--nfs-font-size, 1rem) * 2));
  line-height: var(--nfs-h1-line-height, 1.2);
  font-weight: var(--nfs-h1-weight, 800);
  margin-bottom: var(--nfs-h1-margin-bottom, 14px);
}

.nfs-public-headline.nfs-public-headline-h2,
.nfs-public-headline-h2 {
  font-size: var(--nfs-heading-h2-size, var(--nfs-h2-size, calc(var(--nfs-font-size, 1rem) * 1.65)));
  line-height: var(--nfs-h2-line-height, 1.3);
  font-weight: var(--nfs-h2-weight, 800);
  margin-bottom: var(--nfs-h2-margin-bottom, 12px);
}

.nfs-public-headline.nfs-public-headline-h3,
.nfs-public-headline-h3 {
  font-size: var(--nfs-heading-h3-size, var(--nfs-h3-size, calc(var(--nfs-font-size, 1rem) * 1.4)));
  line-height: var(--nfs-h3-line-height, 1.3);
  font-weight: var(--nfs-h3-weight, 700);
  margin-bottom: var(--nfs-h3-margin-bottom, 10px);
}

.nfs-public-headline.nfs-public-headline-h4,
.nfs-public-headline-h4 {
  font-size: var(--nfs-heading-h4-size, var(--nfs-h4-size, calc(var(--nfs-font-size, 1rem) * 1.2)));
  line-height: var(--nfs-h4-line-height, 1.3);
  font-weight: var(--nfs-h4-weight, 700);
  margin-bottom: var(--nfs-h4-margin-bottom, 8px);
}

.nfs-public-headline.nfs-public-headline-h5,
.nfs-public-headline-h5 {
  font-size: var(--nfs-heading-h5-size, calc(var(--nfs-font-size, 1rem) * 1.05));
  line-height: var(--nfs-h5-line-height, 1.35);
  font-weight: var(--nfs-h5-weight, 650);
  margin-bottom: var(--nfs-h5-margin-bottom, 6px);
}

.nfs-public-headline.nfs-public-headline-h6,
.nfs-public-headline-h6 {
  font-size: var(--nfs-heading-h6-size, var(--nfs-font-size, 1rem));
  line-height: var(--nfs-h6-line-height, 1.4);
  font-weight: var(--nfs-h6-weight, 600);
  margin-bottom: var(--nfs-h6-margin-bottom, 4px);
}

.nfs-public-form .nfs-public-field input.nfs-public-input,
.nfs-public-form .nfs-public-field textarea.nfs-public-input,
.nfs-public-form .nfs-public-field select.nfs-public-input {
  box-sizing: border-box;
  width: 100%;
  min-height: var(--nfs-field-min-height, 48px);
  padding: var(--nfs-input-padding-y) var(--nfs-input-padding-x);
  border-top-width: var(--nfs-border-input-width-top, var(--nfs-border-width));
  border-right-width: var(--nfs-border-input-width-right, var(--nfs-border-width));
  border-bottom-width: var(--nfs-border-input-width-bottom, var(--nfs-border-width));
  border-left-width: var(--nfs-border-input-width-left, var(--nfs-border-width));
  border-style: var(--nfs-border-input-style, solid);
  border-color: var(--nfs-border-input-color, var(--nfs-border));
  border-radius: var(--nfs-radius-input-tl, var(--nfs-radius))
    var(--nfs-radius-input-tr, var(--nfs-radius))
    var(--nfs-radius-input-br, var(--nfs-radius))
    var(--nfs-radius-input-bl, var(--nfs-radius));
  background-color: var(--nfs-input-bg);
  color: var(--nfs-input-text);
  font: inherit;
  font-size: var(--nfs-font-size);
  font-weight: var(--nfs-input-weight, 400);
  letter-spacing: var(--nfs-input-letter-spacing, 0px);
  line-height: var(--nfs-input-line-height, 1.4);
  box-shadow: var(--nfs-field-shadow, none);
  outline: none;
  transition:
    border-color var(--nfs-transition-ms, 200ms) ease,
    border-width var(--nfs-transition-ms, 200ms) ease,
    box-shadow var(--nfs-transition-ms, 200ms) ease;
}

.nfs-public-form .nfs-public-field input.nfs-public-input::placeholder,
.nfs-public-form .nfs-public-field textarea.nfs-public-input::placeholder {
  color: var(--nfs-placeholder-color, var(--nfs-text, #111827));
  opacity: var(--nfs-placeholder-opacity, 0.55);
}

.nfs-public-form .nfs-public-field textarea.nfs-public-input {
  border-top-width: var(--nfs-border-textarea-width-top, var(--nfs-border-input-width-top, var(--nfs-border-width)));
  border-right-width: var(--nfs-border-textarea-width-right, var(--nfs-border-input-width-right, var(--nfs-border-width)));
  border-bottom-width: var(--nfs-border-textarea-width-bottom, var(--nfs-border-input-width-bottom, var(--nfs-border-width)));
  border-left-width: var(--nfs-border-textarea-width-left, var(--nfs-border-input-width-left, var(--nfs-border-width)));
  border-style: var(--nfs-border-textarea-style, var(--nfs-border-input-style, solid));
  border-color: var(--nfs-border-textarea-color, var(--nfs-border-input-color, var(--nfs-border)));
  border-radius: var(--nfs-radius-textarea-tl, var(--nfs-radius))
    var(--nfs-radius-textarea-tr, var(--nfs-radius))
    var(--nfs-radius-textarea-br, var(--nfs-radius))
    var(--nfs-radius-textarea-bl, var(--nfs-radius));
}

.nfs-public-form .nfs-public-field select.nfs-public-input {
  border-top-width: var(--nfs-border-select-width-top, var(--nfs-border-input-width-top, var(--nfs-border-width)));
  border-right-width: var(--nfs-border-select-width-right, var(--nfs-border-input-width-right, var(--nfs-border-width)));
  border-bottom-width: var(--nfs-border-select-width-bottom, var(--nfs-border-input-width-bottom, var(--nfs-border-width)));
  border-left-width: var(--nfs-border-select-width-left, var(--nfs-border-input-width-left, var(--nfs-border-width)));
  border-style: var(--nfs-border-select-style, var(--nfs-border-input-style, solid));
  border-color: var(--nfs-border-select-color, var(--nfs-border-input-color, var(--nfs-border)));
  border-radius: var(--nfs-radius-select-tl, var(--nfs-radius))
    var(--nfs-radius-select-tr, var(--nfs-radius))
    var(--nfs-radius-select-br, var(--nfs-radius))
    var(--nfs-radius-select-bl, var(--nfs-radius));
}

.nfs-public-form .nfs-public-field input.nfs-public-input:not(.nfs-public-file),
.nfs-public-form .nfs-public-field select.nfs-public-input {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.nfs-public-form .nfs-public-field select.nfs-public-input {
  padding-right: calc(var(--nfs-input-padding-x) + 24px);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--nfs-muted) 50%),
    linear-gradient(135deg, var(--nfs-muted) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size: 6px 6px;
  background-repeat: no-repeat;
}

.nfs-public-form.nfs-public-select-no-arrow .nfs-public-field select.nfs-public-input {
  padding-right: var(--nfs-input-padding-x);
  background-image: none;
}

.nfs-public-form .nfs-public-field input.nfs-public-input:hover,
.nfs-public-form .nfs-public-field textarea.nfs-public-input:hover,
.nfs-public-form .nfs-public-field select.nfs-public-input:hover {
  box-shadow: var(--nfs-field-hover-shadow, var(--nfs-field-shadow, none));
}

.nfs-public-form .nfs-public-field input.nfs-public-input:focus,
.nfs-public-form .nfs-public-field textarea.nfs-public-input:focus,
.nfs-public-form .nfs-public-field select.nfs-public-input:focus {
  border-top-width: var(--nfs-border-input-focus-width-top, var(--nfs-border-input-width-top, var(--nfs-border-width)));
  border-right-width: var(--nfs-border-input-focus-width-right, var(--nfs-border-input-width-right, var(--nfs-border-width)));
  border-bottom-width: var(--nfs-border-input-focus-width-bottom, var(--nfs-border-input-width-bottom, var(--nfs-border-width)));
  border-left-width: var(--nfs-border-input-focus-width-left, var(--nfs-border-input-width-left, var(--nfs-border-width)));
  border-color: var(--nfs-border-input-color-focus, var(--nfs-border-focus));
  box-shadow:
    var(--nfs-field-focus-shadow, var(--nfs-field-shadow, none)),
    0 0 0 var(--nfs-focus-ring-width, 3px)
      color-mix(in srgb, var(--nfs-focus-ring-color, var(--nfs-border-focus)) 16%, transparent);
}

.nfs-public-form .nfs-public-field textarea.nfs-public-input:focus {
  border-top-width: var(--nfs-border-textarea-focus-width-top, var(--nfs-border-input-focus-width-top, var(--nfs-border-textarea-width-top, var(--nfs-border-width))));
  border-right-width: var(--nfs-border-textarea-focus-width-right, var(--nfs-border-input-focus-width-right, var(--nfs-border-textarea-width-right, var(--nfs-border-width))));
  border-bottom-width: var(--nfs-border-textarea-focus-width-bottom, var(--nfs-border-input-focus-width-bottom, var(--nfs-border-textarea-width-bottom, var(--nfs-border-width))));
  border-left-width: var(--nfs-border-textarea-focus-width-left, var(--nfs-border-input-focus-width-left, var(--nfs-border-textarea-width-left, var(--nfs-border-width))));
  border-color: var(--nfs-border-textarea-color-focus, var(--nfs-border-input-color-focus, var(--nfs-border-focus)));
}

.nfs-public-form .nfs-public-field select.nfs-public-input:focus {
  border-top-width: var(--nfs-border-select-focus-width-top, var(--nfs-border-input-focus-width-top, var(--nfs-border-select-width-top, var(--nfs-border-width))));
  border-right-width: var(--nfs-border-select-focus-width-right, var(--nfs-border-input-focus-width-right, var(--nfs-border-select-width-right, var(--nfs-border-width))));
  border-bottom-width: var(--nfs-border-select-focus-width-bottom, var(--nfs-border-input-focus-width-bottom, var(--nfs-border-select-width-bottom, var(--nfs-border-width))));
  border-left-width: var(--nfs-border-select-focus-width-left, var(--nfs-border-input-focus-width-left, var(--nfs-border-select-width-left, var(--nfs-border-width))));
  border-color: var(--nfs-border-select-color-focus, var(--nfs-border-input-color-focus, var(--nfs-border-focus)));
}

.nfs-public-form .nfs-public-field textarea.nfs-public-textarea {
  min-height: var(--nfs-textarea-min-height, 130px);
  resize: var(--nfs-textarea-resize, vertical);
}

.nfs-public-form .nfs-public-field input.nfs-public-file {
  padding: 10px;
}

.nfs-file-dropzone {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.nfs-public-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.nfs-file-dropzone-surface {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 120px;
  padding: 18px;
  border: 1.5px dashed var(--nfs-border-input-color, var(--nfs-border, #cbd5e1));
  border-radius: var(--nfs-radius-input, var(--nfs-radius, 10px));
  background: var(--nfs-input-bg, var(--nfs-bg-muted, #f8fafc));
  color: var(--nfs-muted, #64748b);
  text-align: center;
  cursor: pointer;
  transition: 140ms ease;
  box-sizing: border-box;
}

.nfs-file-dropzone.is-dragover .nfs-file-dropzone-surface,
.nfs-file-dropzone-surface:hover,
.nfs-file-dropzone-surface:focus-within {
  border-color: var(--nfs-border-input-color-focus, var(--nfs-border-focus, var(--nfs-primary)));
  color: var(--nfs-primary, #2563eb);
  background: var(--nfs-input-bg, var(--nfs-bg, #ffffff));
  box-shadow: 0 0 0 var(--nfs-focus-ring-width, 3px) var(--nfs-focus-ring-color, var(--nfs-border-focus));
}

.nfs-file-dropzone-icon {
  display: inline-flex;
  color: currentColor;
}

.nfs-file-dropzone-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.nfs-file-dropzone-title,
.nfs-file-dropzone-text,
.nfs-file-dropzone-meta {
  margin: 0;
  font-size: 0.95em;
  line-height: 1.4;
}

.nfs-file-dropzone-title {
  font-weight: 700;
  color: var(--nfs-text, #111827);
}

.nfs-file-dropzone-link {
  color: var(--nfs-link-color, var(--nfs-primary, #2563eb));
  font-weight: 700;
  text-decoration: underline;
}

.nfs-file-dropzone-link:hover {
  color: var(--nfs-link-hover-color, var(--nfs-primary-hover, #1d4ed8));
}

.nfs-file-dropzone-files {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.nfs-file-dropzone-file {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-radius: var(--nfs-radius-input, 8px);
  background: var(--nfs-bg-muted, #f1f5f9);
  color: var(--nfs-text, #334155);
  font-size: 0.9em;
}

.nfs-file-dropzone-file-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nfs-file-dropzone-file-remove {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--nfs-muted, #64748b);
  cursor: pointer;
}

.nfs-file-dropzone-file-remove:hover,
.nfs-file-dropzone-file-remove:focus {
  color: var(--nfs-error, #b91c1c);
  background: rgba(185, 28, 28, 0.08);
  outline: none;
}

.nfs-file-dropzone-file-remove .nfs-lucide-icon {
  width: 16px;
  height: 16px;
}

.nfs-file-dropzone-clear {
  display: none;
}

/* Upload style: dropzone (default) — large centered area */
.nfs-file-upload-style-dropzone .nfs-file-dropzone-surface {
  min-height: 132px;
  padding: 22px 18px;
}

/* Upload style: compact — single row */
.nfs-file-upload-style-compact .nfs-file-dropzone-surface {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  min-height: 56px;
  padding: 10px 14px;
  text-align: left;
}

.nfs-file-upload-style-compact .nfs-file-dropzone-copy {
  flex: 1 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 12px;
  text-align: left;
}

.nfs-file-upload-style-compact .nfs-file-dropzone-meta {
  font-size: 0.85em;
  white-space: nowrap;
}

/* Upload style: button — CTA + status */
.nfs-file-upload-style-button .nfs-file-dropzone-surface {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
  box-shadow: none;
}

.nfs-file-upload-style-button .nfs-file-dropzone-icon {
  display: none;
}

.nfs-file-upload-style-button .nfs-file-dropzone-copy {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  width: 100%;
}

.nfs-file-upload-style-button .nfs-file-dropzone-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--nfs-button-min-height, 48px);
  padding: var(--nfs-button-padding-y, 14px) var(--nfs-button-padding-x, 22px);
  border-radius: var(--nfs-button-radius, 12px);
  background: var(--nfs-primary, #2563eb);
  color: var(--nfs-button-text, #ffffff);
  font-size: var(--nfs-button-font-size, 16px);
  font-weight: var(--nfs-button-weight, 700);
  line-height: var(--nfs-button-line-height, 1);
  box-shadow: var(--nfs-button-shadow, none);
}

.nfs-file-upload-style-button.is-dragover .nfs-file-dropzone-action,
.nfs-file-upload-style-button .nfs-file-dropzone-surface:hover .nfs-file-dropzone-action,
.nfs-file-upload-style-button .nfs-file-dropzone-surface:focus-within .nfs-file-dropzone-action {
  background: var(--nfs-primary-hover, #1d4ed8);
  color: var(--nfs-button-text-hover, var(--nfs-button-text, #ffffff));
  box-shadow: var(--nfs-button-hover-shadow, var(--nfs-button-shadow, none));
}

.nfs-file-upload-style-button .nfs-file-dropzone-status,
.nfs-file-upload-style-button .nfs-file-dropzone-meta {
  color: var(--nfs-muted, #64748b);
}

.nfs-file-upload-style-button .nfs-file-dropzone-meta {
  flex: 1 0 100%;
}

/* Upload style: card — premium left-aligned card */
.nfs-file-upload-style-card .nfs-file-dropzone-surface {
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 14px;
  min-height: 0;
  padding: 16px;
  border-style: solid;
  border-width: var(--nfs-border-width, 1px);
  text-align: left;
  box-shadow: var(--nfs-form-shadow, none);
}

.nfs-file-upload-style-card .nfs-file-dropzone-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: var(--nfs-primary, #2563eb);
  color: var(--nfs-button-text, #ffffff);
}

.nfs-file-upload-style-card .nfs-file-dropzone-icon .nfs-lucide-icon,
.nfs-file-upload-style-card .nfs-file-dropzone-icon svg {
  width: 20px;
  height: 20px;
}

.nfs-file-upload-style-card .nfs-file-dropzone-copy {
  align-items: flex-start;
  text-align: left;
  gap: 2px;
}

@media (max-width: 640px) {
  .nfs-file-upload-style-compact .nfs-file-dropzone-surface {
    align-items: flex-start;
  }

  .nfs-file-upload-style-compact .nfs-file-dropzone-copy {
    flex-direction: column;
    align-items: flex-start;
  }

  .nfs-file-upload-style-compact .nfs-file-dropzone-meta {
    white-space: normal;
  }

  .nfs-file-upload-style-button .nfs-file-dropzone-action {
    width: 100%;
  }

  .nfs-file-upload-style-card .nfs-file-dropzone-surface {
    flex-wrap: wrap;
  }
}

.nfs-public-help {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 0;
  color: var(--nfs-help-color, var(--nfs-muted));
  font-size: var(--nfs-help-size, 0.9em);
  font-weight: var(--nfs-help-weight, 400);
  line-height: var(--nfs-help-line-height, 1.5);
  max-width: var(--nfs-help-max-width, none);
}

.nfs-public-help.nfs-help-position-above {
  margin-top: 0;
  margin-bottom: var(--nfs-help-gap, 6px);
}

.nfs-public-help.nfs-help-position-below {
  margin-top: var(--nfs-help-gap, 6px);
  margin-bottom: 0;
}

.nfs-public-help-icon {
  flex: 0 0 auto;
  display: inline-flex;
  width: var(--nfs-help-icon-size, 14px);
  height: var(--nfs-help-icon-size, 14px);
  margin-top: 0.15em;
  color: var(--nfs-help-icon-color, var(--nfs-help-color, var(--nfs-muted)));
}

/* display:inline-flex overrides the HTML hidden attribute without !important */
.nfs-public-help-icon[hidden] {
  display: none !important;
}

.nfs-public-help-icon svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: currentColor;
}

.nfs-public-help-text {
  flex: 1 1 auto;
  min-width: 0;
}

.nfs-public-choice-group {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: var(--nfs-choice-option-gap, 10px);
}

.nfs-public-choice-group-vertical {
  flex-direction: column;
  flex-wrap: nowrap;
}

.nfs-public-choice-group-horizontal {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
}

.nfs-public-choice {
  display: flex;
  align-items: flex-start;
  gap: var(--nfs-choice-gap, 9px);
  color: var(--nfs-text);
  font-size: 0.95em;
  line-height: 1.45;
}

.nfs-public-choice input[type="checkbox"],
.nfs-public-choice input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-sizing: border-box;
  margin-top: 3px;
  flex: 0 0 auto;
  border: 1.5px solid var(--nfs-choice-border, #d1d5db);
  background-color: var(--nfs-choice-bg, #ffffff);
  accent-color: var(--nfs-choice-accent, var(--nfs-primary));
  cursor: pointer;
}

.nfs-public-choice input[type="checkbox"] {
  width: var(--nfs-checkbox-size, 16px);
  height: var(--nfs-checkbox-size, 16px);
  border-radius: var(--nfs-radius-checkbox-tl, 4px);
}

.nfs-public-choice input[type="radio"] {
  width: var(--nfs-radio-size, 16px);
  height: var(--nfs-radio-size, 16px);
  border-radius: 999px;
}

.nfs-public-choice input[type="checkbox"]:checked,
.nfs-public-choice input[type="radio"]:checked {
  background-color: var(--nfs-choice-accent, var(--nfs-primary));
  border-color: var(--nfs-choice-accent, var(--nfs-primary));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23fff' d='M6.5 11.2 3.3 8l1.1-1.1 2.1 2.1 4.6-4.6L12.2 5.5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 75% 75%;
}

.nfs-public-choice input[type="radio"]:checked {
  background-image: radial-gradient(circle, #fff 0 35%, transparent 38%);
}

.nfs-public-actions {
  display: flex;
  margin-top: var(--nfs-button-gap, 26px);
}

.nfs-public-actions-align-left {
  justify-content: flex-start;
}

.nfs-public-actions-align-center {
  justify-content: center;
}

.nfs-public-actions-align-right {
  justify-content: flex-end;
}

.nfs-public-actions-width-auto .nfs-public-submit {
  width: auto;
}

.nfs-public-actions-width-25 .nfs-public-submit {
  width: 25%;
}

.nfs-public-actions-width-50 .nfs-public-submit {
  width: 50%;
}

.nfs-public-actions-width-75 .nfs-public-submit {
  width: 75%;
}

.nfs-public-actions-width-100 .nfs-public-submit {
  width: 100%;
}

.nfs-public-actions-width-custom .nfs-public-submit {
  width: var(--nfs-button-custom-width, auto);
}

.nfs-public-label-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.nfs-public-form .nfs-public-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--nfs-button-min-height, 48px);
  min-width: var(--nfs-button-min-width, 0px);
  padding: var(--nfs-button-padding-y) var(--nfs-button-padding-x);
  border-top-width: var(--nfs-border-button-width-top, 0px);
  border-right-width: var(--nfs-border-button-width-right, 0px);
  border-bottom-width: var(--nfs-border-button-width-bottom, 0px);
  border-left-width: var(--nfs-border-button-width-left, 0px);
  border-style: var(--nfs-border-button-style, solid);
  border-color: var(--nfs-border-button-color, transparent);
  border-radius: var(--nfs-radius-button-tl, var(--nfs-button-radius))
    var(--nfs-radius-button-tr, var(--nfs-button-radius))
    var(--nfs-radius-button-br, var(--nfs-button-radius))
    var(--nfs-radius-button-bl, var(--nfs-button-radius));
  background: var(--nfs-primary);
  color: var(--nfs-button-text);
  font: inherit;
  font-size: var(--nfs-button-font-size);
  font-weight: var(--nfs-button-weight, 700);
  letter-spacing: var(--nfs-button-letter-spacing, 0px);
  line-height: var(--nfs-button-line-height, 1);
  text-transform: var(--nfs-button-text-transform, none);
  box-shadow: var(--nfs-button-shadow, none);
  cursor: pointer;
  transition:
    background var(--nfs-button-transition-ms, var(--nfs-transition-ms, 200ms)) ease,
    transform var(--nfs-button-transition-ms, var(--nfs-transition-ms, 200ms)) ease,
    box-shadow var(--nfs-button-transition-ms, var(--nfs-transition-ms, 200ms)) ease,
    border-color var(--nfs-button-transition-ms, var(--nfs-transition-ms, 200ms)) ease;
}

.nfs-public-submit:hover,
.nfs-public-submit:focus {
  background: var(--nfs-primary-hover);
  color: var(--nfs-button-text-hover, #ffffff);
  border-color: var(--nfs-border-button-color-hover, var(--nfs-border-button-color, transparent));
  box-shadow: var(--nfs-button-hover-shadow, var(--nfs-button-shadow, none));
  transform: translateY(calc(-1 * var(--nfs-button-hover-translate, 0px)))
    scale(var(--nfs-button-hover-scale, 1));
}

.nfs-public-submit:active {
  transform: translateY(1px) scale(1);
}

.nfs-public-hp {
  position: absolute !important;
  left: -99999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.nfs-public-html {
  color: var(--nfs-text);
  line-height: 1.6;
}

.nfs-public-html p:first-child {
  margin-top: 0;
}

.nfs-public-html p:last-child {
  margin-bottom: 0;
}

.nfs-public-divider {
  width: 100%;
  height: 1px;
  border: 0;
  background: var(--nfs-divider-color, var(--nfs-border));
  margin: 6px 0;
}

@media (max-width: 782px) {
  .nfs-public-form-layout-double .nfs-public-fields {
    grid-template-columns: 1fr;
  }

  .nfs-public-width-25,
  .nfs-public-width-33,
  .nfs-public-width-50,
  .nfs-public-width-66,
  .nfs-public-width-75,
  .nfs-public-width-100 {
    box-sizing: border-box;
  }

  .nfs-public-form-full-mobile .nfs-public-fields > .nfs-public-width-25,
  .nfs-public-form-full-mobile .nfs-public-fields > .nfs-public-width-33,
  .nfs-public-form-full-mobile .nfs-public-fields > .nfs-public-width-50,
  .nfs-public-form-full-mobile .nfs-public-fields > .nfs-public-width-66,
  .nfs-public-form-full-mobile .nfs-public-fields > .nfs-public-width-75,
  .nfs-public-form-full-mobile .nfs-public-fields > .nfs-public-width-100,
  .nfs-public-form-full-mobile .nfs-public-width-25,
  .nfs-public-form-full-mobile .nfs-public-width-33,
  .nfs-public-form-full-mobile .nfs-public-width-50,
  .nfs-public-form-full-mobile .nfs-public-width-66,
  .nfs-public-form-full-mobile .nfs-public-width-75,
  .nfs-public-form-full-mobile .nfs-public-width-100,
  .nfs-public-form-full-mobile .nfs-public-form-layout-double .nfs-public-fields > .nfs-public-field {
    grid-column: 1 / -1;
    width: auto;
    max-width: none;
  }
}

.nfs-public-message {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0 0 var(--nfs-message-gap, 22px);
  padding: 14px 16px;
  border-radius: var(--nfs-message-radius);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
}

.nfs-public-message-area {
  margin-top: var(--nfs-message-gap, 22px);
}

.nfs-public-message-area:empty {
  margin-top: 0;
  margin-bottom: 0;
}

.nfs-public-message-icon {
  flex: 0 0 auto;
  display: inline-flex;
  width: 1.15em;
  height: 1.15em;
  margin-top: 0.1em;
  color: currentColor;
}

/* display:inline-flex overrides the HTML hidden attribute without !important */
.nfs-public-message-icon[hidden] {
  display: none !important;
}

.nfs-public-message-icon svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: currentColor;
}

.nfs-public-message-text {
  flex: 1 1 auto;
  min-width: 0;
}

.nfs-public-message p {
  margin: 0;
}

.nfs-public-message p + p {
  margin-top: 6px;
}

.nfs-public-message-success {
  background: var(--nfs-msg-success-bg, #ecfdf5);
  border-width: var(--nfs-msg-success-border-width, 1px);
  border-style: var(--nfs-msg-success-border-style, solid);
  border-color: var(--nfs-msg-success-border, #a7f3d0);
  color: var(--nfs-msg-success-text, #047857);
  border-radius: var(--nfs-msg-success-radius, var(--nfs-message-radius));
  padding: var(--nfs-msg-success-padding-y, 14px) var(--nfs-msg-success-padding-x, 16px);
  font-size: var(--nfs-msg-success-font-size, 15px);
  line-height: var(--nfs-msg-success-line-height, 1.5);
  margin-top: 0;
}

.nfs-public-message-error {
  background: var(--nfs-msg-error-bg, #fef2f2);
  border-width: var(--nfs-msg-error-border-width, 1px);
  border-style: var(--nfs-msg-error-border-style, solid);
  border-color: var(--nfs-msg-error-border, #fecaca);
  color: var(--nfs-msg-error-text, #b91c1c);
  border-radius: var(--nfs-msg-error-radius, var(--nfs-message-radius));
  padding: var(--nfs-msg-error-padding-y, 14px) var(--nfs-msg-error-padding-x, 16px);
  font-size: var(--nfs-msg-error-font-size, 15px);
  line-height: var(--nfs-msg-error-line-height, 1.5);
}

.nfs-public-message-warning {
  background: var(--nfs-msg-warning-bg, #fffbeb);
  border-width: var(--nfs-msg-warning-border-width, 1px);
  border-style: var(--nfs-msg-warning-border-style, solid);
  border-color: var(--nfs-msg-warning-border, #fcd34d);
  color: var(--nfs-msg-warning-text, #92400e);
  border-radius: var(--nfs-msg-warning-radius, var(--nfs-message-radius));
  padding: var(--nfs-msg-warning-padding-y, 14px) var(--nfs-msg-warning-padding-x, 16px);
  font-size: var(--nfs-msg-warning-font-size, 15px);
  line-height: var(--nfs-msg-warning-line-height, 1.5);
}

.nfs-public-message-info {
  background: var(--nfs-msg-info-bg, #eff6ff);
  border-width: var(--nfs-msg-info-border-width, 1px);
  border-style: var(--nfs-msg-info-border-style, solid);
  border-color: var(--nfs-msg-info-border, #bfdbfe);
  color: var(--nfs-msg-info-text, #1d4ed8);
  border-radius: var(--nfs-msg-info-radius, var(--nfs-message-radius));
  padding: var(--nfs-msg-info-padding-y, 14px) var(--nfs-msg-info-padding-x, 16px);
  font-size: var(--nfs-msg-info-font-size, 15px);
  line-height: var(--nfs-msg-info-line-height, 1.5);
}

.nfs-public-submit:disabled,
.nfs-public-submit[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.7;
}

.nfs-public-submit:disabled:hover,
.nfs-public-submit:disabled:focus,
.nfs-public-submit[aria-disabled="true"]:hover,
.nfs-public-submit[aria-disabled="true"]:focus {
  background: var(--nfs-primary);
  color: var(--nfs-button-text);
  border-color: var(--nfs-border-button-color, transparent);
  box-shadow: var(--nfs-button-shadow, none);
  transform: none;
}

/* Shared preview state helpers (admin live preview + public) */
.nfs-preview-state-hover .nfs-public-submit {
  background: var(--nfs-primary-hover);
}

.nfs-preview-state-focus .nfs-public-input {
  border-color: var(--nfs-border-input-color-focus, var(--nfs-border-focus));
  box-shadow: 0 0 0 var(--nfs-focus-ring-width, 3px)
    color-mix(in srgb, var(--nfs-focus-ring-color, var(--nfs-border-focus)) 16%, transparent);
}

.nfs-preview-state-error .nfs-public-input {
  border-color: var(--nfs-error);
}

.nfs-preview-state-disabled .nfs-public-input,
.nfs-preview-state-disabled .nfs-public-submit {
  opacity: 0.6;
  pointer-events: none;
}

.nfs-preview-state-loading .nfs-public-submit {
  opacity: 0.7;
}

@media (prefers-reduced-motion: reduce) {
  .nfs-public-form[style*="--nfs-reduced-motion:1"] .nfs-public-input,
  .nfs-public-form[style*="--nfs-reduced-motion:1"] .nfs-public-submit,
  .nfs-public-form:not([style*="--nfs-reduced-motion"]) .nfs-public-input,
  .nfs-public-form:not([style*="--nfs-reduced-motion"]) .nfs-public-submit {
    transition: none;
  }

  .nfs-public-form[style*="--nfs-reduced-motion:1"] .nfs-public-submit:hover,
  .nfs-public-form[style*="--nfs-reduced-motion:1"] .nfs-public-submit:focus,
  .nfs-public-form[style*="--nfs-reduced-motion:1"] .nfs-public-submit:active,
  .nfs-public-form:not([style*="--nfs-reduced-motion"]) .nfs-public-submit:hover,
  .nfs-public-form:not([style*="--nfs-reduced-motion"]) .nfs-public-submit:focus,
  .nfs-public-form:not([style*="--nfs-reduced-motion"]) .nfs-public-submit:active {
    transform: none;
  }
}

.nfs-public-form .nfs-public-privacy-link,
.nfs-public-privacy-choice .nfs-public-privacy-text a.nfs-public-privacy-link {
  font: inherit;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: var(--nfs-link-color, var(--nfs-primary, #2563eb));
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: from-font;
  text-underline-offset: 0.12em;
}

.nfs-public-form .nfs-public-privacy-link:hover,
.nfs-public-privacy-choice .nfs-public-privacy-text a.nfs-public-privacy-link:hover {
  color: var(--nfs-link-hover-color, var(--nfs-primary-hover, #1d4ed8));
  text-decoration-thickness: 2px;
}

.nfs-privacy-public{max-width:720px;margin:1.5em 0}
.nfs-privacy-public-section{margin:0 0 1.25em}
.nfs-privacy-public-title{margin:0 0 .4em;font:inherit;font-size:1.15em;font-weight:700}
.nfs-privacy-public-body{margin:0;line-height:1.6}

/* Multistep forms */
.nfs-public-form--multistep .nfs-form-step {
  display: none;
  margin: 0 0 var(--nfs-step-gap, 20px);
}
.nfs-public-form--multistep .nfs-form-step.is-active {
  display: block;
}
.nfs-form-step-title {
  margin: 0 0 8px;
  font-size: var(--nfs-step-title-size, 20px);
  font-weight: var(--nfs-step-title-weight, 700);
  color: var(--nfs-step-title-color, var(--nfs-text, #111827));
}
.nfs-form-step-description {
  margin: 0 0 16px;
  font-size: var(--nfs-step-desc-size, 14px);
  color: var(--nfs-muted, #6b7280);
}
.nfs-multistep-progress {
  margin: 0 0 var(--nfs-step-progress-gap, 12px);
}
.nfs-multistep-progress-align-left { text-align: left; }
.nfs-multistep-progress-align-center { text-align: center; }
.nfs-multistep-progress-align-right { text-align: right; }
.nfs-multistep-progress-list {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--nfs-step-progress-gap, 12px);
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center;
  justify-content: inherit;
}
.nfs-multistep-progress-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--nfs-step-indicator-pending, var(--nfs-multistep-muted-color, #cbd5e1));
  font-size: var(--nfs-step-indicator-label-size, 13px);
}
.nfs-multistep-progress-item.is-current {
  color: var(--nfs-step-indicator-active, var(--nfs-primary, #2563eb));
}
.nfs-multistep-progress-item.is-done {
  color: var(--nfs-step-indicator-done, var(--nfs-primary, #2563eb));
}
.nfs-multistep-progress-item:hover,
.nfs-multistep-progress-btn:hover {
  color: var(--nfs-step-indicator-hover, var(--nfs-accent, #2563eb));
}
.nfs-multistep-progress--numbers .nfs-multistep-progress-item:hover .nfs-multistep-progress-marker,
.nfs-multistep-progress--labels .nfs-multistep-progress-item:hover .nfs-multistep-progress-marker {
  background: var(--nfs-step-indicator-hover, var(--nfs-accent, #2563eb));
}
.nfs-multistep-progress-marker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--nfs-step-indicator-size, 12px);
  height: var(--nfs-step-indicator-size, 12px);
  min-width: var(--nfs-step-indicator-size, 12px);
  border-radius: 999px;
  background: var(--nfs-step-indicator-pending, var(--nfs-multistep-muted-color, #cbd5e1));
  color: transparent;
  font-size: 0;
}
.nfs-multistep-progress--dots .nfs-multistep-progress-marker {
  background: var(--nfs-step-indicator-pending, var(--nfs-multistep-muted-color, #cbd5e1));
  color: transparent;
  font-size: 0;
}
.nfs-multistep-progress--dots .is-current .nfs-multistep-progress-marker {
  background: var(--nfs-step-indicator-active, var(--nfs-primary, #2563eb));
}
.nfs-multistep-progress--dots .is-done .nfs-multistep-progress-marker {
  background: var(--nfs-step-indicator-done, var(--nfs-primary, #2563eb));
}
.nfs-multistep-progress--dots .nfs-multistep-progress-item:hover .nfs-multistep-progress-marker,
.nfs-multistep-progress--dots .nfs-multistep-progress-btn:hover .nfs-multistep-progress-marker {
  background: var(--nfs-step-indicator-hover, var(--nfs-accent, #2563eb));
}
.nfs-multistep-progress--numbers .nfs-multistep-progress-marker,
.nfs-multistep-progress--labels .nfs-multistep-progress-marker {
  width: calc(var(--nfs-step-indicator-size, 12px) + 14px);
  height: calc(var(--nfs-step-indicator-size, 12px) + 14px);
  font-size: var(--nfs-step-indicator-label-size, 13px);
  color: #fff;
  background: var(--nfs-step-indicator-pending, var(--nfs-multistep-muted-color, #cbd5e1));
}
.nfs-multistep-progress--numbers .is-current .nfs-multistep-progress-marker,
.nfs-multistep-progress--labels .is-current .nfs-multistep-progress-marker {
  background: var(--nfs-step-indicator-active, var(--nfs-primary, #2563eb));
}
.nfs-multistep-progress--numbers .is-done .nfs-multistep-progress-marker,
.nfs-multistep-progress--labels .is-done .nfs-multistep-progress-marker {
  background: var(--nfs-step-indicator-done, var(--nfs-primary, #2563eb));
}
.nfs-multistep-progress--dots .nfs-multistep-progress-label,
.nfs-multistep-progress--bar .nfs-multistep-progress-label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.nfs-multistep-progress--bar .nfs-multistep-progress-list,
.nfs-multistep-progress--count .nfs-multistep-progress-list {
  display: none;
}
.nfs-multistep-progress-bar {
  width: 100%;
  height: var(--nfs-step-bar-height, 6px);
  background: var(--nfs-step-bar-bg, var(--nfs-multistep-muted-color, #cbd5e1));
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 10px;
}
.nfs-multistep-progress-bar-fill {
  display: block;
  height: 100%;
  background: var(--nfs-step-bar-fill, #2563eb);
  transition: width var(--nfs-multistep-transition-ms, 200ms) ease;
}
.nfs-multistep-progress-btn {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font: inherit;
}
.nfs-step-navigation {
  display: flex;
  flex-wrap: wrap;
  gap: var(--nfs-step-nav-gap, 12px);
  align-items: center;
  margin-top: var(--nfs-step-gap, 20px);
  width: 100%;
}

/* outside: Prev | Submit area | Next on one row */
.nfs-step-navigation--layout-spread,
.nfs-step-navigation--layout-inline {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--nfs-step-nav-gap, 12px);
}
.nfs-step-navigation--layout-spread .nfs-step-btn-prev,
.nfs-step-navigation--layout-inline .nfs-step-btn-prev {
  grid-column: 1;
  justify-self: start;
}
.nfs-step-navigation--layout-spread .nfs-step-submit-wrap,
.nfs-step-navigation--layout-inline .nfs-step-submit-wrap {
  grid-column: 2;
  width: 100%;
  margin: 0;
  display: flex;
  align-items: center;
  flex: initial;
}
.nfs-step-navigation--layout-spread .nfs-step-submit-wrap[hidden],
.nfs-step-navigation--layout-inline .nfs-step-submit-wrap[hidden] {
  display: none !important;
}
.nfs-step-navigation--layout-spread .nfs-step-btn-next,
.nfs-step-navigation--layout-inline .nfs-step-btn-next {
  grid-column: 3;
  justify-self: end;
}

/* center: submit row, then centered nav row */
.nfs-step-navigation--layout-stacked {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
}
.nfs-step-navigation--layout-stacked .nfs-step-submit-wrap {
  flex: 0 0 100%;
  width: 100%;
  order: -1;
  margin: 0 0 var(--nfs-step-nav-gap, 12px);
}
.nfs-step-navigation--layout-stacked .nfs-step-submit-wrap[hidden] {
  display: none !important;
  margin: 0;
}

.nfs-step-navigation--outside {
  justify-content: flex-start;
}
.nfs-step-navigation--outside .nfs-step-btn-next:not([hidden]) {
  margin-left: 0;
}
.nfs-step-navigation--center {
  justify-content: center;
}
.nfs-step-navigation--center .nfs-step-btn-next:not([hidden]),
.nfs-step-navigation--center .nfs-step-btn-prev:not([hidden]) {
  margin-left: 0;
  margin-right: 0;
}

.nfs-public-form .nfs-step-btn {
  appearance: none;
  border: 1px solid var(--nfs-step-nav-border, var(--nfs-primary, #2563eb));
  background: var(--nfs-step-nav-bg, var(--nfs-primary, #2563eb));
  color: var(--nfs-step-nav-text, var(--nfs-button-text, #ffffff));
  border-radius: var(--nfs-step-nav-radius, var(--nfs-button-radius, 12px));
  min-height: var(--nfs-step-nav-min-height, var(--nfs-button-min-height, 48px));
  padding: var(--nfs-step-nav-padding-y, var(--nfs-button-padding-y, 14px))
    var(--nfs-step-nav-padding-x, var(--nfs-button-padding-x, 22px));
  font-size: var(--nfs-step-nav-size, var(--nfs-button-font-size, 16px));
  font-weight: var(--nfs-step-nav-weight, var(--nfs-button-weight, 700));
  letter-spacing: var(--nfs-button-letter-spacing, 0px);
  line-height: var(--nfs-button-line-height, 1);
  text-transform: var(--nfs-button-text-transform, none);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition:
    background var(--nfs-step-nav-transition-ms, var(--nfs-button-transition-ms, var(--nfs-transition-ms, 200ms))) ease,
    color var(--nfs-step-nav-transition-ms, var(--nfs-button-transition-ms, var(--nfs-transition-ms, 200ms))) ease,
    box-shadow var(--nfs-step-nav-transition-ms, var(--nfs-button-transition-ms, var(--nfs-transition-ms, 200ms))) ease,
    transform var(--nfs-step-nav-transition-ms, var(--nfs-button-transition-ms, var(--nfs-transition-ms, 200ms))) ease;
  box-shadow: var(--nfs-multistep-shadow, var(--nfs-button-shadow, none));
}
.nfs-public-form .nfs-step-btn:hover {
  background: var(--nfs-step-nav-bg-hover, var(--nfs-primary-hover, #1d4ed8));
  color: var(--nfs-step-nav-text-hover, var(--nfs-button-text-hover, var(--nfs-step-nav-text, var(--nfs-button-text, #ffffff))));
  box-shadow: var(--nfs-button-hover-shadow, var(--nfs-multistep-shadow, var(--nfs-button-shadow, none)));
}
.nfs-public-form .nfs-step-btn .nfs-step-icon,
.nfs-public-form .nfs-step-btn .nfs-lucide-icon {
  color: currentColor;
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
}
.nfs-step-submit-wrap {
  margin: 0;
  flex: 1 1 auto;
}
.nfs-step-navigation .nfs-step-submit-wrap.nfs-public-actions {
  margin-top: 0;
}

/* Flex/grid parent can override [hidden]; pin display:none explicitly */
.nfs-step-submit-wrap[hidden],
.nfs-public-form .nfs-step-btn[hidden] {
  display: none !important;
}
.nfs-step-field-error {
  margin: 6px 0 0;
  width: 100%;
}
.nfs-public-field.is-invalid .nfs-public-input,
.nfs-public-input.is-invalid {
  border-color: var(--nfs-msg-error-border, var(--nfs-error, #b91c1c));
}
.nfs-multistep-fields {
  display: flex;
  flex-direction: column;
  gap: var(--nfs-step-gap, 20px);
  width: 100%;
}
.nfs-form-step {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.nfs-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 640px) {
  .nfs-public-form--multistep .nfs-step-navigation--layout-inline,
  .nfs-public-form--multistep .nfs-step-navigation--layout-stacked {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  .nfs-public-form--multistep .nfs-step-navigation--layout-inline .nfs-step-btn-prev,
  .nfs-public-form--multistep .nfs-step-navigation--layout-inline .nfs-step-btn-next,
  .nfs-public-form--multistep .nfs-step-navigation--layout-inline .nfs-step-submit-wrap {
    grid-column: auto;
    justify-self: stretch;
    width: 100%;
    margin-left: 0;
  }
  .nfs-public-form--multistep .nfs-step-btn,
  .nfs-public-form--multistep .nfs-step-submit-wrap .nfs-public-submit {
    width: 100%;
    justify-content: center;
  }
  .nfs-public-form--multistep .nfs-step-navigation--outside .nfs-step-btn-next:not([hidden]) {
    margin-left: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .nfs-multistep-progress-bar-fill,
  .nfs-public-form .nfs-step-btn {
    transition: none;
  }
}