/*
 * CurioDock Fluent Forms Integration v0.1.6
 * Front-end form styling only.
 */

/* Keep Fluent Forms visually consistent with CurioDock fixed pages. */
.fluentform {
  --cd-form-ink: #171b22;
  --cd-form-text: #252b33;
  --cd-form-muted: #66717f;
  --cd-form-navy: #0b1f3a;
  --cd-form-blue: #0f4caa;
  --cd-form-cyan: #007f95;
  --cd-form-border: #d7dde5;
  --cd-form-soft: #f6f8fa;
  --cd-form-danger: #b42318;
  --cd-form-success: #157347;
  width: 100%;
  color: var(--cd-form-text);
}

.fluentform .ff-el-group {
  margin-bottom: 1.35rem;
}

.fluentform .ff-el-input--label {
  margin-bottom: .48rem;
}

.fluentform .ff-el-input--label label,
.fluentform .ff-el-form-check-label {
  color: var(--cd-form-ink);
  font-size: .94rem;
  font-weight: 700;
  line-height: 1.55;
}

.fluentform .ff-el-input--label.ff-el-is-required.asterisk-right label::after,
.fluentform .ff-el-input--label.ff-el-is-required.asterisk-left label::before {
  color: #c43d32;
}

.fluentform .ff-el-form-control {
  width: 100%;
  min-height: 46px;
  padding: .72rem .82rem;
  border: 1px solid var(--cd-form-border);
  border-radius: 5px;
  background: #fff;
  color: var(--cd-form-text);
  font: inherit;
  font-size: .94rem;
  line-height: 1.5;
  box-shadow: none;
  transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}

.fluentform textarea.ff-el-form-control {
  min-height: 180px;
  resize: vertical;
}

.fluentform select.ff-el-form-control {
  cursor: pointer;
}

.fluentform .ff-el-form-control::placeholder {
  color: #9099a5;
  opacity: 1;
}

.fluentform .ff-el-form-control:hover {
  border-color: #b7c2cf;
}

.fluentform .ff-el-form-control:focus {
  outline: 0;
  border-color: var(--cd-form-blue);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(15, 76, 170, .10);
}

/* Checkbox / agreement */
.fluentform input[type="checkbox"],
.fluentform input[type="radio"] {
  accent-color: var(--cd-form-navy);
}

.fluentform .ff-el-form-check {
  margin-top: .25rem;
}

.fluentform .ff-el-form-check-label {
  font-weight: 500;
}

.fluentform .ff-el-form-check-label a,
.fluentform .ff_t_c a {
  color: var(--cd-form-blue);
  font-weight: 650;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .16em;
}

.fluentform .ff-el-form-check-label a:hover,
.fluentform .ff_t_c a:hover {
  color: var(--cd-form-cyan);
}

/* Help / description text */
.fluentform .ff-el-help-message,
.fluentform .ff-el-form-check-label + small,
.fluentform .ff-el-input--content > small {
  color: var(--cd-form-muted);
  font-size: .78rem;
  line-height: 1.6;
}

/* Submit button: CurioDock navy by default, blue on hover. */
.fluentform .ff-btn-submit:not(.ff_btn_no_style),
.fluentform button.ff-btn-submit:not(.ff_btn_no_style),
.fluentform input[type="submit"].ff-btn-submit {
  min-height: 44px;
  padding: .7rem 1.25rem;
  border: 1px solid var(--cd-form-navy) !important;
  border-radius: 5px !important;
  background: var(--cd-form-navy) !important;
  color: #fff !important;
  font-size: .9rem !important;
  font-weight: 750 !important;
  line-height: 1.2;
  box-shadow: none !important;
  cursor: pointer;
  transition: background-color .16s ease, border-color .16s ease, transform .08s ease;
}

.fluentform .ff-btn-submit:not(.ff_btn_no_style):hover,
.fluentform button.ff-btn-submit:not(.ff_btn_no_style):hover,
.fluentform input[type="submit"].ff-btn-submit:hover {
  border-color: var(--cd-form-blue) !important;
  background: var(--cd-form-blue) !important;
  color: #fff !important;
}

.fluentform .ff-btn-submit:not(.ff_btn_no_style):active {
  transform: translateY(1px);
}

.fluentform .ff-btn-submit:focus-visible {
  outline: 3px solid rgba(15, 76, 170, .22);
  outline-offset: 2px;
}

.fluentform .ff-btn-submit[disabled],
.fluentform .ff-btn-submit:disabled {
  opacity: .58;
  cursor: not-allowed;
}

/* Validation */
.fluentform .ff-el-is-error .ff-el-form-control,
.fluentform .ff-el-is-error .ff-el-form-control:focus {
  border-color: var(--cd-form-danger) !important;
  box-shadow: 0 0 0 3px rgba(180, 35, 24, .08) !important;
}

.fluentform .text-danger,
.fluentform .error,
.fluentform .ff-el-is-error .text-danger {
  margin-top: .38rem;
  color: var(--cd-form-danger) !important;
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.55;
}

/* Submission success message. */
.ff-message-success,
.fluentform .ff-message-success {
  margin: 1rem 0 1.5rem !important;
  padding: 1.2rem 1.35rem !important;
  border: 1px solid #cbd7e6 !important;
  border-left: 4px solid var(--cd-form-blue, #0f4caa) !important;
  border-radius: 5px !important;
  background: #f5f8fc !important;
  color: var(--cd-form-text, #252b33) !important;
  box-shadow: 0 2px 8px rgba(11, 31, 58, .035) !important;
}

.ff-message-success p,
.fluentform .ff-message-success p {
  margin: .35rem 0 !important;
}

.ff-message-success p:first-child,
.fluentform .ff-message-success p:first-child {
  color: var(--cd-form-ink, #171b22);
  font-weight: 800;
}

/* Turnstile container: do not alter Cloudflare iframe itself. */
.fluentform .cf-turnstile,
.fluentform [data-sitekey],
.fluentform .ff-el-group:has(.cf-turnstile) {
  margin-top: .35rem;
  margin-bottom: .75rem;
}

/* Prevent overly wide form contents on fixed pages. */
.cd-page-content .fluentform {
  max-width: 100%;
}

@media (max-width: 680px) {
  .fluentform .ff-el-group {
    margin-bottom: 1.15rem;
  }

  .fluentform .ff-el-form-control {
    min-height: 45px;
    padding: .7rem .75rem;
    font-size: 16px; /* prevents iOS zoom on focus */
  }

  .fluentform textarea.ff-el-form-control {
    min-height: 165px;
  }

  .fluentform .ff-btn-submit:not(.ff_btn_no_style),
  .fluentform button.ff-btn-submit:not(.ff_btn_no_style),
  .fluentform input[type="submit"].ff-btn-submit {
    min-height: 46px;
    padding-inline: 1.2rem;
  }

  .ff-message-success,
  .fluentform .ff-message-success {
    padding: 1rem !important;
  }
}