/* Wikipedia-style Form Elements */

.form-item {
  margin-bottom: 1em;
}

.form-item label {
  display: block;
  font-weight: bold;
  margin-bottom: 0.25em;
  color: #000;
  font-size: 0.9em;
}

.form-text,
.form-email,
.form-password,
.form-textarea,
.form-select {
  width: 95%;
  padding: 0.5em;
  border: 1px solid #a2a9b1;
  background: #fff;
  font-family: inherit;
  font-size: 0.9em;
}

.form-text:focus,
.form-email:focus,
.form-password:focus,
.form-textarea:focus,
.form-select:focus {
  border-color: #0645ad;
  outline: none;
  box-shadow: 0 0 3px rgba(6, 69, 173, 0.3);
}

.form-textarea {
  resize: vertical;
  min-height: 100px;
}

.form-checkbox,
.form-radio {
  margin-right: 0.5em;
}

.button,
.form-submit {
  background: #f8f9fa;
  border: 1px solid #a2a9b1;
  padding: 0.5em 1em;
  margin-right: 0.5em;
  cursor: pointer;
  font-size: 0.9em;
  color: #000;
}

.button:hover,
.form-submit:hover {
  background: #eaecf0;
}

.button--primary {
  background: #0645ad;
  color: #fff;
  border-color: #0645ad;
}

.button--primary:hover {
  background: #0b0080;
}

.form-required {
  color: #d33;
}

.form-actions {
  margin-top: 1em;
  padding-top: 1em;
  border-top: 1px solid #a2a9b1;
}

@media (max-width: 768px) {
  .form-text, .form-email, .form-password, .form-textarea, .form-select {
    width: 80%;
  }
}