/* Wrapper del form en página de contacto */
.of-form-wrap {
  background: var(--of-gris-1);
  padding: var(--of-space-12);
  border-radius: var(--of-radius-xl);
}

.of-form-wrap > h3 {
  margin: 0 0 var(--of-space-6);
}

@media (max-width: 768px) {
  .of-form-wrap { padding: var(--of-space-8); }
}

/* ============================
   Override de Fluent Forms
   ============================ */
.of-form-wrap .fluentform .ff-el-form-control,
.of-form-wrap .fluentform .ff_btn_style,
.of-form-wrap .fluentform input[type="text"],
.of-form-wrap .fluentform input[type="email"],
.of-form-wrap .fluentform input[type="tel"],
.of-form-wrap .fluentform input[type="url"],
.of-form-wrap .fluentform input[type="number"],
.of-form-wrap .fluentform select,
.of-form-wrap .fluentform textarea {
  width: 100%;
  padding: 14px 18px;
  font-family: var(--of-font-body);
  font-size: var(--of-fs-base);
  color: var(--of-grafito);
  background: var(--of-blanco);
  border: 1px solid var(--of-gris-2);
  border-radius: var(--of-radius);
  box-shadow: none;
  transition: border-color var(--of-trans-fast), box-shadow var(--of-trans-fast);
  line-height: 1.45;
  height: auto;
}

.of-form-wrap .fluentform input:focus,
.of-form-wrap .fluentform select:focus,
.of-form-wrap .fluentform textarea:focus {
  border-color: var(--of-naranja);
  box-shadow: 0 0 0 3px rgba(209, 123, 71, 0.15);
  outline: none;
}

.of-form-wrap .fluentform textarea {
  resize: vertical;
  min-height: 120px;
}

/* Labels */
.of-form-wrap .fluentform label,
.of-form-wrap .fluentform .ff-el-input--label label {
  display: block;
  font-size: var(--of-fs-sm);
  font-weight: 600;
  color: var(--of-grafito);
  margin-bottom: 6px;
  font-family: var(--of-font-body);
  letter-spacing: 0;
  text-transform: none;
}

.of-form-wrap .fluentform .ff-el-is-required label::after {
  color: var(--of-naranja);
  font-weight: 700;
}

/* Spacing entre inputs */
.of-form-wrap .fluentform .ff-el-group {
  margin-bottom: var(--of-space-5);
}

/* Botón submit */
.of-form-wrap .fluentform .ff-btn,
.of-form-wrap .fluentform button[type="submit"] {
  display: inline-flex;
  align-items: center;
  gap: var(--of-space-3);
  padding: 14px 28px;
  font-family: var(--of-font-body);
  font-size: var(--of-fs-sm);
  font-weight: 600;
  letter-spacing: 0.02em;
  background: var(--of-grafito);
  color: var(--of-blanco);
  border: none;
  border-radius: var(--of-radius-pill);
  cursor: pointer;
  transition: all var(--of-trans);
  box-shadow: none;
  width: auto;
  height: auto;
  line-height: 1.2;
}

.of-form-wrap .fluentform .ff-btn:hover,
.of-form-wrap .fluentform button[type="submit"]:hover {
  background: var(--of-naranja);
  color: var(--of-blanco);
  transform: translateY(-2px);
  box-shadow: var(--of-shadow-lg);
}

/* Mensaje de error */
.of-form-wrap .fluentform .error,
.of-form-wrap .fluentform .text-danger {
  color: #C53030;
  font-size: var(--of-fs-xs);
  margin-top: 4px;
}

.of-form-wrap .fluentform .ff-el-is-error input,
.of-form-wrap .fluentform .ff-el-is-error select,
.of-form-wrap .fluentform .ff-el-is-error textarea {
  border-color: #C53030;
}

/* Mensaje de éxito */
.of-form-wrap .fluentform .ff-message-success,
.of-form-wrap .fluentform_wrapper_form_id_1 .ff-message-success {
  background: rgba(43, 184, 196, 0.12);
  color: var(--of-azul-dark);
  border: 1px solid var(--of-cyan);
  border-radius: var(--of-radius);
  padding: var(--of-space-5);
  font-size: var(--of-fs-base);
}

/* Checkbox / Radio */
.of-form-wrap .fluentform .ff-el-form-check input[type="checkbox"],
.of-form-wrap .fluentform .ff-el-form-check input[type="radio"] {
  width: 18px;
  height: 18px;
  margin-right: 8px;
  accent-color: var(--of-naranja);
}

/* Two columns helper */
.of-form-wrap .fluentform .ff-t-cell {
  padding: 0 8px;
}
.of-form-wrap .fluentform .ff-t-row {
  margin: 0 -8px var(--of-space-5);
}

/* Fallback warning */
.of-form-fallback p { margin-bottom: var(--of-space-4); }
.of-form-fallback strong { color: var(--of-grafito); }