/**
 * @file
 * Form Styling
 */

/* Wrapper for a form element (or group of form elements) and its label */
.form-item {
  margin: 1.5em 0;
}

.form-item input.error,
.form-item textarea.error,
.form-item select.error {
  /* Highlight form elements that caused an error */
  border: 1px solid #e72d2c;
}

.form-item label {
  display: block;
  font-weight: bold;
}

/* Label for a radio button or checkbox */
.form-item label.option {
  display: inline;
  font-weight: normal;
}

/* Label for a required field */
.form-required {
  color: #c00;
}

.form-required::after {
  content: "*";
  -webkit-margin-start: .1em;
  margin-inline-start: .1em;
}

.webform-required .form-required::after {
  margin-inline: 0 .1em;
}

/* Help text (separate from the label) */
.form-item .description {
  font-size: 0.85em;
}

.form-checkboxes .form-item,
.form-radios .form-item {
  /* Pack groups of checkboxes and radio buttons closer */
  margin: 0;
}

/* Buttons used by contrib modules and submit button */
a.button,
.form-submit {
  font-size: 1em;
  color: white;
  background-color: var(--color-dk-blue);
  padding: 0.5em 1.0em;
  border: none;
  text-decoration: none;
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
}

a.button:hover,
.form-submit:hover {
  background-color: #4077ba;
}

a.button:focus,
.form-submit:focus {
  outline: 4px solid rgba(var(--color-dk-blue-rgb), .5);
}

/* Inline labels and form divs */
.container-inline div,
.container-inline label {
  display: inline;
}


/*
 * Password confirmation
 */

.password-parent,
.confirm-parent {
  margin: 0;
}

/*
 * Search
 */

/* Wrapper for the search form */
#block-searchform-2 {
  margin: 0 0 1em;
  font-size: 1em;
}

#block-searchform-2 .form-submit {
  padding: 0.3em 1em;
  vertical-align: middle;
}

#block-searchform-2 input {
  vertical-align: middle;
}

#block-searchform-2 .form-submit:focus,
#block-searchform-2 input:focus {
  outline: 3px solid rgba(var(--color-dk-blue-rgb), .5);
}


/*
 * Drupal admin tables
 *
 * We overrode these styles in normalize.css, but restore them for the admin
 * section of the site.
 */

form th {
  text-align: left; /* LTR */
  padding-right: 1em; /* LTR */
  border-bottom: 3px solid #ccc;
}

form tbody {
  border-top: 1px solid #ccc;
}

form tr.even {
  background-color: #fff;
}

form table .item-list ul {
  margin: 0;
}

/*
 * Drupal core wrongly puts this in system.menus.css.
 * Since we override that, add it back.
 */
td.menu-disabled {
  background: #ccc;
}


/* Media Queries */

@media only screen and (max-width: 768px) {
  /* Fix mobile user agent contrast */
  input[type="search"] {
    background-color: white;
    border: 1px solid #333;
  }
}

@media only screen and (min-width: 600px) {
  #block-searchform-2 {
    position: absolute;
    top: -45px;
    right: 0px;
    font-size: 0.9em;
    margin: 0;
  }
}
