.lux-form-root {
  box-sizing: border-box;
  width: 100%;
  margin: var(--lux-root-margin, 0px);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-family: var(--lux-font);
  background: var(--lux-page-bg);
  color: var(--lux-black);
}
.lux-form-root *, .lux-form-root *::before, .lux-form-root *::after { box-sizing: border-box; }

/* Block theme global input rules (Quere, Elementor, etc.) from adding margins/heights. */
.lux-form-root .lux-form input[type="text"],
.lux-form-root .lux-form input[type="email"],
.lux-form-root .lux-form input[type="tel"],
.lux-form-root .lux-form input[type="url"],
.lux-form-root .lux-form input[type="search"],
.lux-form-root .lux-form input[type="number"],
.lux-form-root .lux-form input[type="password"],
.lux-form-root .lux-form input[type="date"],
.lux-form-root .lux-form input[type="time"],
.lux-form-root .lux-form select,
.lux-form-root .lux-form textarea,
.lux-form-root .lux-form .ts-wrapper,
.lux-form-root .lux-form .ts-control,
.lux-form-root .lux-form .iti__tel-input {
  margin: 0 !important;
}

.lux-form-root .lux-form-page {
  max-width: var(--lux-page-max);
  margin: 0 auto;
  padding: var(--lux-page-padding);
}

.lux-form-root .lux-form-page-hero {
  text-align: var(--lux-page-title-align);
  margin-bottom: 2.25rem;
  padding: 0 0.5rem;
}

.lux-form-root .lux-form-page-hero-title {
  margin: 0 0 0.65rem;
  font-size: var(--lux-page-title-size);
  font-weight: var(--lux-page-title-weight);
  color: var(--lux-page-title-color);
  letter-spacing: var(--lux-page-title-ls);
  line-height: var(--lux-page-title-lh);
}

.lux-form-root .lux-form-page-hero-subtitle {
  margin: 0;
  font-size: var(--lux-page-subtitle-size);
  font-weight: var(--lux-page-subtitle-weight);
  color: var(--lux-page-subtitle-color);
  text-align: var(--lux-page-subtitle-align);
  letter-spacing: var(--lux-page-subtitle-ls);
  line-height: var(--lux-page-subtitle-lh);
}

.lux-form-root .lux-form-card {
  background: var(--lux-surface);
  border-radius: var(--lux-card-radius);
  box-shadow: var(--lux-card-shadow);
  padding: var(--lux-card-padding);
  border: 1px solid var(--lux-card-border);
  width: 100%;
  max-width: var(--lux-card-max);
  margin-left: auto;
  margin-right: auto;
}

.lux-form-root .lux-form-header { text-align: var(--lux-title-align); margin-bottom: var(--lux-header-mb); }
.lux-form-root .lux-form-header.is-hidden { display: none; }
.lux-form-root .lux-form-title {
  margin: 0 0 var(--lux-title-mb);
  font-size: var(--lux-title-size);
  font-weight: var(--lux-title-weight);
  color: var(--lux-title-color);
  letter-spacing: var(--lux-title-ls);
  line-height: var(--lux-title-lh);
  text-align: var(--lux-title-align);
}
.lux-form-root .lux-form-subtitle {
  margin: 0;
  color: var(--lux-subtitle-color);
  font-size: var(--lux-subtitle-size);
  font-weight: var(--lux-subtitle-weight);
  letter-spacing: var(--lux-subtitle-ls);
  text-align: var(--lux-subtitle-align);
}

.lux-form-root .lux-form {
  display: grid;
  grid-template-columns: repeat(var(--lux-columns), minmax(0, 1fr));
  column-gap: var(--lux-column-gap);
  row-gap: calc(var(--lux-field-mb) + var(--lux-row-gap));
  width: 100%;
  align-items: start;
}

.lux-form-root .lux-form .field {
  width: 100%;
  min-width: 0;
  margin-bottom: 0;
}

.lux-form-root .lux-form .field.field-full,
.lux-form-root .lux-form .field[data-field="message"],
.lux-form-root .lux-form .submit-btn { grid-column: 1 / -1; }

.lux-form-root .field-custom-style .lux-field-control,
.lux-form-root .field-custom-style .text-input,
.lux-form-root .field-custom-style .text-area,
.lux-form-root .field-custom-style .phone-wrap.phone-split .iti__tel-input,
.lux-form-root .field-custom-style .phone-wrap.phone-split input[type="tel"] {
  background: var(--lux-field-bg, var(--lux-surface-2)) !important;
  color: var(--lux-field-text, var(--lux-white)) !important;
  border-color: var(--lux-field-border, var(--lux-border)) !important;
  border-radius: var(--lux-field-radius, var(--lux-radius)) !important;
  font-size: var(--lux-field-fs, var(--lux-input-fs)) !important;
  font-weight: var(--lux-field-fw, inherit);
  border-width: var(--lux-field-border-w, 1.5px);
  padding: var(--lux-field-padding, inherit);
}

.lux-form-root .field-custom-style .country-wrap .ts-wrapper.single .ts-control,
.lux-form-root .field-custom-style .lux-select-wrap .ts-wrapper.single .ts-control,
.lux-form-root .field-custom-style .phone-prefix-wrap .ts-wrapper.single .ts-control {
  background: var(--lux-field-bg, var(--lux-surface-2));
  color: var(--lux-field-text, var(--lux-white));
  border-color: var(--lux-field-border, var(--lux-border));
  border-radius: var(--lux-field-radius, var(--lux-radius));
  font-size: var(--lux-field-fs, var(--lux-input-fs));
  font-weight: var(--lux-field-fw, inherit);
  border-width: var(--lux-field-border-w, 1.5px);
}

/* Phone field: per-field font size applies to prefix dropdown AND number input */
.lux-form-root .field-custom-style[data-field="phone"] .phone-prefix-wrap .ts-wrapper.single .ts-control,
.lux-form-root .field-custom-style[data-field="phone"] .phone-prefix-wrap .ts-control .item,
.lux-form-root .field-custom-style[data-field="phone"] .phone-prefix-wrap .ts-control input,
.lux-form-root .field-custom-style[data-field="phone"] .phone-wrap.phone-split .iti__tel-input,
.lux-form-root .field-custom-style[data-field="phone"] .phone-wrap.phone-split input[type="tel"] {
  font-size: var(--lux-field-fs, var(--lux-input-fs)) !important;
}

.lux-form-root .lux-radio-group,
.lux-form-root .lux-checkbox-group {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  padding: 0.25rem 0;
}

.lux-form-root .lux-choice {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--lux-choice-text);
  font-size: var(--lux-choice-fs);
  font-weight: var(--lux-choice-fw);
  cursor: pointer;
}

.lux-form-root .lux-choice input { accent-color: var(--lux-gold); }

.lux-form-root .lux-checkbox-group .lux-choice,
.lux-form-root .lux-choice.lux-single-checkbox {
  color: var(--lux-checkbox-text);
}

.lux-form-root .lux-checkbox-group .lux-choice input[type="checkbox"],
.lux-form-root .lux-choice.lux-single-checkbox input[type="checkbox"] {
  accent-color: var(--lux-checkbox-accent);
}

.lux-form-root .lux-file-input {
  width: 100%;
  padding: 10px var(--lux-input-px);
  font-family: var(--lux-font);
  font-size: var(--lux-input-fs);
  font-weight: var(--lux-input-fw);
  line-height: var(--lux-input-lh);
  color: var(--lux-file-input-text);
  background: var(--lux-file-input-bg);
  border: var(--lux-input-border-w) dashed var(--lux-file-input-border);
  border-radius: var(--lux-radius);
}

.lux-form-root .lux-file-input::file-selector-button {
  margin-right: 12px;
  padding: 8px 14px;
  border: none;
  border-radius: 8px;
  background: var(--lux-file-btn-bg);
  color: var(--lux-file-btn-text);
  font-family: var(--lux-font);
  cursor: pointer;
}

.lux-form-root .lux-form .submit-btn { margin-bottom: 0; }

.lux-form-root .field[data-field="phone"] .phone-wrap.phone-split {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--lux-phone-gap);
  width: 100%;
  position: relative;
}

.lux-form-root .field[data-field="phone"] .phone-prefix-wrap {
  flex: 0 0 var(--lux-phone-prefix);
  max-width: var(--lux-phone-prefix);
  min-width: 0;
}

.lux-form-root .field[data-field="phone"] .phone-number-wrap { flex: 1 1 0; min-width: 0; }

.lux-form-root .field[data-field="phone"] .phone-wrap.phone-split .iti,
.lux-form-root .field[data-field="phone"] .phone-number-wrap .iti { width: 100%; }

.lux-form-root .country-wrap,
.lux-form-root .lux-select-wrap,
.lux-form-root .phone-prefix-wrap,
.lux-form-root .country-wrap .ts-wrapper,
.lux-form-root .lux-select-wrap .ts-wrapper,
.lux-form-root .phone-prefix-wrap .ts-wrapper { width: 100%; }

.lux-form-root .lux-select-wrap { position: relative; }

.lux-form-root .lux-select-wrap .ts-dropdown {
  width: 100% !important;
  left: 0 !important;
  right: auto !important;
  box-sizing: border-box;
}

.lux-form-root .error-msg {
  display: none;
  margin-top: 0.45rem;
  font-size: var(--lux-error-fs);
  color: var(--lux-error);
}

.lux-form-root .field.is-invalid .error-msg { display: block; }

.lux-form-root .text-input,
.lux-form-root .native-select {
  width: 100%;
  margin: 0 !important;
  padding: var(--lux-input-py) var(--lux-input-px) !important;
  font-family: var(--lux-font) !important;
  font-size: var(--lux-input-fs) !important;
  font-weight: var(--lux-input-fw) !important;
  line-height: var(--lux-input-lh) !important;
  text-transform: none !important;
  color: var(--lux-input-text) !important;
  background: var(--lux-input-bg) !important;
  background-color: var(--lux-input-bg) !important;
  border: var(--lux-input-border-w) solid var(--lux-input-border) !important;
  border-radius: var(--lux-radius) !important;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  max-width: none;
  height: var(--lux-input-height) !important;
  box-sizing: border-box;
}

.lux-form-root .text-area {
  width: 100%;
  margin: 0 !important;
  padding: var(--lux-textarea-py) var(--lux-input-px) !important;
  font-family: var(--lux-font) !important;
  font-size: var(--lux-input-fs) !important;
  font-weight: var(--lux-input-fw) !important;
  line-height: var(--lux-input-lh) !important;
  text-transform: none !important;
  color: var(--lux-input-text) !important;
  background: var(--lux-input-bg) !important;
  background-color: var(--lux-input-bg) !important;
  border: var(--lux-input-border-w) solid var(--lux-input-border) !important;
  border-radius: var(--lux-radius) !important;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  max-width: none;
  min-height: var(--lux-textarea-min);
  resize: vertical;
  box-sizing: border-box;
  vertical-align: top;
}

.lux-form-root .text-input::placeholder,
.lux-form-root .text-area::placeholder { color: var(--lux-input-placeholder); opacity: 1; }

.lux-form-root .text-input:focus,
.lux-form-root .text-area:focus,
.lux-form-root .native-select:focus {
  border-color: var(--lux-input-border-focus) !important;
  box-shadow: var(--lux-focus-shadow) !important;
}

.lux-form-root .field.is-invalid .text-input,
.lux-form-root .field.is-invalid .text-area,
.lux-form-root .field.is-invalid .native-select {
  border-color: var(--lux-error) !important;
  box-shadow: var(--lux-error-shadow) !important;
}

.lux-form-root .phone-wrap .iti__country-container { display: none !important; }

.lux-form-root .phone-wrap.phone-split .iti__tel-input,
.lux-form-root .phone-wrap.phone-split input[type="tel"] {
  display: block;
  width: 100% !important;
  height: var(--lux-input-height) !important;
  padding: var(--lux-input-py) var(--lux-input-px) !important;
  font-family: var(--lux-font) !important;
  font-size: var(--lux-input-fs) !important;
  line-height: var(--lux-input-lh) !important;
  color: var(--lux-input-text) !important;
  background: var(--lux-input-bg) !important;
  border: var(--lux-input-border-w) solid var(--lux-input-border) !important;
  border-radius: var(--lux-radius) !important;
  outline: none;
  box-sizing: border-box;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.lux-form-root .phone-wrap.phone-split .iti__tel-input::placeholder { color: var(--lux-input-placeholder); }

.lux-form-root .phone-number-wrap:focus-within .iti__tel-input,
.lux-form-root .phone-number-wrap:focus-within input[type="tel"] {
  border-color: var(--lux-input-border-focus) !important;
  box-shadow: var(--lux-focus-shadow) !important;
}

.lux-form-root .field.is-invalid .phone-wrap.phone-split .iti__tel-input,
.lux-form-root .field.is-invalid .phone-wrap.phone-split input[type="tel"] {
  border-color: var(--lux-error) !important;
  box-shadow: var(--lux-error-shadow) !important;
}

.lux-form-root .field.is-invalid .phone-prefix-wrap .ts-wrapper.single .ts-control,
.lux-form-root .field.is-invalid .country-wrap .ts-wrapper.single .ts-control,
.lux-form-root .field.is-invalid .lux-select-wrap .ts-wrapper.single .ts-control {
  border-color: var(--lux-error) !important;
  box-shadow: var(--lux-error-shadow) !important;
}

.lux-form-root .phone-prefix-wrap:focus-within .ts-wrapper.single .ts-control,
.lux-form-root .country-wrap:focus-within .ts-wrapper.single .ts-control,
.lux-form-root .lux-select-wrap:focus-within .ts-wrapper.single .ts-control,
.lux-form-root .country-wrap .ts-wrapper.single.focus .ts-control,
.lux-form-root .lux-select-wrap .ts-wrapper.single.focus .ts-control,
.lux-form-root .phone-prefix-wrap .ts-wrapper.single.focus .ts-control {
  border-color: var(--lux-select-border-focus) !important;
  box-shadow: var(--lux-focus-shadow) !important;
}

.lux-form-root .country-wrap .ts-wrapper.single .ts-control,
.lux-form-root .lux-select-wrap .ts-wrapper.single .ts-control,
.lux-form-root .phone-prefix-wrap .ts-wrapper.single .ts-control {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  height: var(--lux-input-height);
  min-height: var(--lux-input-height);
  max-height: var(--lux-input-height);
  padding: var(--lux-select-py) var(--lux-select-px);
  font-family: var(--lux-font);
  font-size: var(--lux-input-fs);
  color: var(--lux-input-text);
  background: var(--lux-input-bg);
  border: var(--lux-input-border-w) solid var(--lux-input-border);
  border-radius: var(--lux-radius);
  box-shadow: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  background-image: none !important;
  overflow: hidden;
}

.lux-form-root .lux-form .ts-wrapper .clear-button,
.lux-form-root .lux-form .ts-wrapper.single .ts-control::after,
.lux-form-root .lux-form .ts-wrapper .caret { display: none !important; content: none !important; }

.lux-form-root .country-wrap .ts-control .item,
.lux-form-root .lux-select-wrap .ts-control .item,
.lux-form-root .phone-prefix-wrap .ts-control .item {
  color: var(--lux-input-text);
  font-size: var(--lux-input-fs);
  line-height: var(--lux-input-lh);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  align-self: center;
}

.lux-form-root .phone-prefix-wrap .ts-control .item {
  justify-content: center;
  gap: 4px;
}
.lux-form-root .phone-prefix-wrap .ts-control .item .name { color: var(--lux-dial-code); flex: 0 0 auto; }

.lux-form-root .country-wrap .ts-control input,
.lux-form-root .lux-select-wrap .ts-control input,
.lux-form-root .phone-prefix-wrap .ts-control input {
  color: var(--lux-input-text) !important;
  font-family: var(--lux-font) !important;
  font-size: var(--lux-input-fs) !important;
  line-height: var(--lux-input-lh) !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  margin: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  min-width: 0;
  flex: 1 1 auto;
  align-self: center;
}

.lux-form-root .country-wrap .ts-control input::placeholder,
.lux-form-root .lux-select-wrap.lux-select-plain .ts-control input::placeholder,
.lux-form-root .phone-prefix-wrap .ts-control input::placeholder {
  color: var(--lux-input-placeholder);
  opacity: 1;
}

/* Plain dropdowns: readonly (no keyboard), placeholder on empty */
.lux-form-root .lux-select-wrap.lux-select-plain .ts-control input {
  cursor: pointer;
}

.lux-form-root .lux-select-wrap.lux-select-plain .ts-dropdown .dropdown-input-wrap {
  display: none !important;
}

.lux-form-root .phone-prefix-wrap .ts-wrapper.single .ts-control {
  padding: var(--lux-select-py) var(--lux-phone-prefix-px);
  justify-content: center;
}

.lux-form-root .phone-wrap.phone-split .ts-dropdown {
  width: 100% !important;
  left: 0 !important;
  background: var(--lux-dropdown-bg) !important;
  border: 1px solid var(--lux-dropdown-border) !important;
  border-radius: var(--lux-radius);
  box-shadow: var(--lux-card-shadow);
  margin-top: var(--lux-dropdown-offset);
  overflow: hidden;
}

.lux-form-root .country-wrap .ts-dropdown .ts-dropdown-content,
.lux-form-root .lux-select-wrap .ts-dropdown .ts-dropdown-content,
.lux-form-root .phone-wrap.phone-split .ts-dropdown .ts-dropdown-content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.lux-form-root .country-wrap .ts-dropdown,
.lux-form-root .lux-select-wrap .ts-dropdown,
.lux-form-root .ts-dropdown {
  background: var(--lux-dropdown-bg);
  border: 1px solid var(--lux-dropdown-border);
  border-radius: var(--lux-radius);
  box-shadow: var(--lux-card-shadow);
  margin-top: var(--lux-dropdown-offset);
  overflow: hidden;
}

.lux-form-root .country-wrap .ts-dropdown .dropdown-input,
.lux-form-root .country-wrap .ts-dropdown .dropdown-input:focus,
.lux-form-root .phone-wrap.phone-split .ts-dropdown .dropdown-input,
.lux-form-root .phone-wrap.phone-split .ts-dropdown .dropdown-input:focus {
  width: 100%;
  background: var(--lux-dropdown-search-bg) !important;
  color: var(--lux-dropdown-text) !important;
  border: none !important;
  border-bottom: 1px solid var(--lux-dropdown-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  padding: var(--lux-dropdown-search-py) var(--lux-select-px) !important;
  font-family: var(--lux-font) !important;
  font-size: var(--lux-input-fs) !important;
}

.lux-form-root .country-wrap .ts-dropdown .dropdown-input::placeholder,
.lux-form-root .phone-wrap.phone-split .ts-dropdown .dropdown-input::placeholder {
  color: var(--lux-muted);
  opacity: 1;
}

.lux-form-root .country-wrap .ts-dropdown .option,
.lux-form-root .lux-select-wrap .ts-dropdown .option,
.lux-form-root .phone-wrap.phone-split .ts-dropdown .option,
.lux-form-root .ts-dropdown .option {
  padding: var(--lux-dropdown-option-py) var(--lux-select-px);
  font-family: var(--lux-font);
  font-size: var(--lux-input-fs);
  color: var(--lux-dropdown-text);
}

.lux-form-root .ts-dropdown .option[data-value=""],
.lux-form-root .ts-dropdown .option[data-value="undefined"] {
  display: none !important;
}

.lux-form-root .country-wrap .ts-dropdown .active,
.lux-form-root .lux-select-wrap .ts-dropdown .active,
.lux-form-root .phone-wrap.phone-split .ts-dropdown .active,
.lux-form-root .ts-dropdown .active {
  background: var(--lux-dropdown-active-bg);
  color: var(--lux-dropdown-active-text);
}

.lux-form-root .country-option { display: flex; align-items: center; gap: 10px; }
.lux-form-root .country-option .flag { font-size: 1.2rem; width: 1.5rem; text-align: center; flex-shrink: 0; }
.lux-form-root .country-option .name { flex: 1; }
.lux-form-root .country-option .dial { color: var(--lux-country-dial); margin-left: auto; flex-shrink: 0; }

.lux-form-root .ts-dropdown .option.lux-section-start {
  border-top: 1px solid var(--lux-dropdown-separator);
  margin-top: 4px;
}

.lux-form-root .submit-btn {
  width: 100%;
  height: var(--lux-submit-height);
  margin-top: 0.5rem;
  border: var(--lux-submit-border-w) solid var(--lux-submit-border);
  border-radius: var(--lux-radius);
  background: var(--lux-gold-btn);
  color: var(--lux-submit-text);
  font-family: var(--lux-font);
  font-size: var(--lux-submit-fs);
  font-weight: var(--lux-submit-fw);
  letter-spacing: var(--lux-submit-ls);
  text-transform: var(--lux-submit-transform);
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.1s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
}

.lux-form-root .submit-btn:hover { background: var(--lux-gold-btn-hover); color: var(--lux-submit-text-hover); border-color: var(--lux-submit-border-hover); }
.lux-form-root .submit-btn:active { transform: scale(0.985); }
.lux-form-root .submit-btn:disabled { opacity: 0.65; cursor: not-allowed; }

.lux-form-root .result {
  display: none;
  margin-top: 1.5rem;
  padding: 1.15rem 1.25rem;
  border-radius: var(--lux-radius);
  background: var(--lux-result-bg);
  border: 1px solid var(--lux-result-border);
  font-size: var(--lux-result-fs);
  line-height: var(--lux-result-lh);
  color: var(--lux-result-text);
}

.lux-form-root .result.visible { display: block; }
.lux-form-root .result.is-error {
  background: var(--lux-result-error-bg);
  border-color: var(--lux-result-error-border);
  color: var(--lux-result-error-text);
}
.lux-form-root .result strong { display: block; margin-bottom: 0.65rem; color: var(--lux-result-title); font-size: var(--lux-result-title-fs); }
.lux-form-root .result.is-error strong { color: var(--lux-result-error-title); }

body.lux-form-modal-open { overflow: hidden; }

.lux-form-success-modal {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.lux-form-success-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.lux-form-success-backdrop {
  position: absolute;
  inset: 0;
  background: var(--lux-popup-backdrop);
}

.lux-form-success-dialog {
  position: relative;
  z-index: 1;
  width: min(100%, 420px);
  padding: 2rem 1.75rem 1.5rem;
  border-radius: 16px;
  background: var(--lux-popup-bg);
  color: var(--lux-popup-text);
  text-align: center;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.28);
}

.lux-form-success-close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--lux-popup-close);
  font-size: 1.625rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.lux-form-success-close:hover {
  background: var(--lux-popup-close-hover-bg);
  color: var(--lux-popup-title-color);
}

.lux-form-success-close:focus-visible {
  outline: 2px solid #111;
  outline-offset: 2px;
}

.lux-form-success-close span {
  display: block;
  margin-top: -0.1em;
}

.lux-form-success-icon {
  display: flex;
  justify-content: center;
  margin-bottom: 1.25rem;
}

.lux-form-success-circle {
  stroke: var(--lux-popup-check-circle);
  stroke-width: 2;
  fill: var(--lux-popup-check-fill);
}

.lux-form-success-check {
  stroke: var(--lux-popup-check-mark);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.lux-form-success-title {
  margin: 0 0 0.75rem;
  font-size: var(--lux-popup-title-fs);
  font-weight: var(--lux-popup-title-fw);
  color: var(--lux-popup-title-color);
  line-height: 1.2;
}

.lux-form-success-text {
  margin: 0 0 1.35rem;
  font-size: var(--lux-popup-message-fs);
  line-height: 1.55;
  color: var(--lux-popup-text);
}

.lux-form-success-text.is-no-buttons {
  margin-bottom: 0;
}

.lux-form-success-actions {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
}

.lux-form-success-actions.is-hidden {
  display: none;
}

.lux-form-success-actions.is-dual {
  width: 100%;
}

.lux-form-success-actions.is-dual .lux-form-success-btn {
  flex: 1 1 calc(50% - 0.375rem);
  min-width: 120px;
}

.lux-form-success-btn {
  min-width: 120px;
  height: 44px;
  padding: 0 1.25rem;
  border-radius: 10px;
  font-size: var(--lux-popup-btn-fs);
  font-weight: var(--lux-popup-btn-fw);
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.lux-form-root .lux-btn-icon {
  width: 1.15em;
  height: 1.15em;
  object-fit: contain;
  flex-shrink: 0;
  pointer-events: none;
}

.lux-form-root .submit-btn .lux-btn-icon {
  width: 1.2em;
  height: 1.2em;
}

.lux-form-success-btn.is-primary {
  border: none;
  background: var(--lux-popup-btn-primary-bg);
  color: var(--lux-popup-btn-primary-text);
}

.lux-form-success-btn.is-primary:hover { filter: brightness(1.08); }

.lux-form-success-btn.is-secondary {
  border: 1.5px solid var(--lux-popup-btn-secondary-border);
  background: var(--lux-popup-btn-secondary-bg);
  color: var(--lux-popup-btn-secondary-text);
}

.lux-form-success-btn.is-secondary:hover {
  filter: brightness(0.97);
}

.lux-form-root .lux-honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.lux-form-root input:-webkit-autofill,
.lux-form-root input:-webkit-autofill:hover,
.lux-form-root input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--lux-input-bg) inset !important;
  -webkit-text-fill-color: var(--lux-input-text) !important;
  transition: background-color 9999s ease-out 0s;
}

@media (prefers-reduced-motion: reduce) {
  .lux-form-root .submit-btn,
  .lux-form-root .text-input,
  .lux-form-root .text-area,
  .lux-form-root .native-select,
  .lux-form-success-modal,
  .lux-form-success-btn,
  .lux-form-success-close {
    transition: none !important;
  }
  .lux-form-root .submit-btn:active { transform: none; }
}