/* ─── Shared Form Field Styles ────────────────────────────────────────── */
/* Included in all layouts: admin, vendor, public                        */

.form-input {
  width: 100%;
  padding: 0.625rem 0.875rem;
  font-size: 0.8125rem;
  color: #524838;
  background: #fff;
  border: 1px solid #EBE2D6;
  border-radius: 0.625rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-input:focus {
  outline: none;
  border-color: #D4A017;
  box-shadow: 0 0 0 3px rgba(212, 160, 23, 0.12);
}

.form-input::placeholder {
  color: #C4B49A;
}

textarea.form-input {
  resize: vertical;
  min-height: 2.5rem;
}

.form-input:disabled,
.form-select:disabled {
  background-color: #F5F0EA;
  cursor: not-allowed;
  opacity: 0.7;
}

.form-select {
  width: 100%;
  padding: 0.625rem 2.25rem 0.625rem 0.875rem;
  font-size: 0.8125rem;
  color: #524838;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%238B7A5E' viewBox='0 0 16 16'%3E%3Cpath d='M4.646 5.646a.5.5 0 01.708 0L8 8.293l2.646-2.647a.5.5 0 01.708.708l-3 3a.5.5 0 01-.708 0l-3-3a.5.5 0 010-.708z'/%3E%3C/svg%3E") no-repeat right 0.75rem center;
  background-size: 1rem;
  border: 1px solid #EBE2D6;
  border-radius: 0.625rem;
  appearance: none;
  -webkit-appearance: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-select:focus {
  outline: none;
  border-color: #D4A017;
  box-shadow: 0 0 0 3px rgba(212, 160, 23, 0.12);
}

/* Multi-select: remove custom arrow and allow browser default height behavior */
.form-select[multiple] {
  background-image: none;
  padding-right: 0.875rem;
  min-height: 6rem;
}

/* Labels */
.form-label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #524838;
  margin-bottom: 0.375rem;
}

.form-label .required {
  color: #dc2626;
  margin-left: 0.125rem;
}

/* Form groups */
.form-group {
  margin-bottom: 1rem;
}

/* Help text below inputs */
.form-help {
  font-size: 0.75rem;
  color: #8B7A5E;
  margin-top: 0.25rem;
}

/* Checkbox & radio */
input[type="checkbox"],
input[type="radio"] {
  accent-color: #D4A017;
}

/* Number input spin buttons */
input[type="number"].form-input {
  -moz-appearance: textfield;
}