/* Fluent Forms — Zervinar v2026 forest/cream overrides */

.fluentform,
.fluentform * {
  box-sizing: border-box;
}

.fluentform {
  font-family: var(--font, "Plus Jakarta Sans", system-ui, sans-serif);
  color: var(--ink-2, #555555);
}

.fluentform .ff-el-group {
  margin-bottom: 18px;
}

.fluentform .ff-el-input--label label {
  font-family: var(--font, "Plus Jakarta Sans", system-ui, sans-serif);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-3, #8A8A8A);
  margin-bottom: 8px;
}

.fluentform .ff-el-form-control,
.fluentform select.ff-el-form-control,
.fluentform textarea.ff-el-form-control {
  width: 100%;
  border: 1px solid var(--line, rgba(34, 34, 34, 0.08));
  border-radius: var(--btn-radius, 8px);
  padding: 14px 16px;
  font-family: var(--font, "Plus Jakarta Sans", system-ui, sans-serif);
  font-size: 15px;
  color: var(--ink, #222222);
  background: var(--bg, #F8F7F4);
  transition: border-color .25s, box-shadow .25s, background .25s;
  box-shadow: none;
}

.fluentform .ff-el-form-control:focus,
.fluentform select.ff-el-form-control:focus,
.fluentform textarea.ff-el-form-control:focus {
  outline: none;
  border-color: var(--forest, #1E3A34);
  background: #fff;
  box-shadow: 0 0 0 3px var(--forest-soft, #E8EFEC);
}

.fluentform .ff-btn-submit,
.fluentform button.ff-btn-submit,
.fluentform .ff-btn-submit.ff-btn-lg,
.fluentform input[type="submit"].ff-btn-submit,
.form-card .fluentform .ff-btn-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font, "Plus Jakarta Sans", system-ui, sans-serif) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.2 !important;
  min-height: 52px;
  padding: 16px 32px !important;
  background: var(--forest, #1E3A34) !important;
  color: #fff !important;
  border: 1.5px solid var(--forest, #1E3A34) !important;
  border-radius: var(--btn-radius, 8px) !important;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(30, 58, 52, 0.2) !important;
  transition: background .4s cubic-bezier(0.22, 1, 0.36, 1),
    border-color .4s cubic-bezier(0.22, 1, 0.36, 1),
    transform .4s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow .4s cubic-bezier(0.22, 1, 0.36, 1);
}

.fluentform .ff-btn-submit:hover,
.fluentform button.ff-btn-submit:hover,
.fluentform input[type="submit"].ff-btn-submit:hover,
.form-card .fluentform .ff-btn-submit:hover {
  background: var(--forest-hover, #16302B) !important;
  border-color: var(--forest-hover, #16302B) !important;
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(30, 58, 52, 0.28) !important;
}

.fluentform .ff-btn-submit:focus-visible {
  outline: 2px solid var(--forest, #1E3A34);
  outline-offset: 3px;
}

.fluentform .ff-t-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.fluentform .ff-el-group.ff-field-half {
  display: inline-block;
  width: calc(50% - 8px);
  vertical-align: top;
}

.fluentform .ff-el-group.ff-field-half:nth-child(odd) {
  margin-right: 16px;
}

@media (max-width: 640px) {
  .fluentform .ff-t-container { grid-template-columns: 1fr; }
  .fluentform .ff-el-group.ff-field-half {
    width: 100%;
    margin-right: 0;
  }
}

.fluentform .ff-message-success {
  padding: 16px 18px;
  border: 1px solid var(--line, rgba(34, 34, 34, 0.08));
  border-radius: var(--btn-radius, 8px);
  background: var(--forest-soft, #E8EFEC);
  color: var(--forest, #1E3A34);
  font-size: 15px;
}

.fluentform .ff-errors-in-stack,
.fluentform .error.text-danger {
  color: #b00020;
  font-size: 14px;
}

/* Wrappers used around Fluent Forms in theme templates */
.form-card .fluentform,
.contact-grid .fluentform {
  max-width: 100%;
}

.zerv-contact .fluentform .ff-el-form-control::placeholder {
  color: var(--ink-3, #8A8A8A);
  opacity: 0.8;
}
