/**
 * field-float-fix.css
 *
 * Floating-label positioning for `.field` (an <input>/<select> + its
 * <label>), driven by the `.has-value` class from field-float-fix.js as
 * well as `:focus` and the existing `:not(:placeholder-shown)` trick - so
 * the label reliably clears the value for plain text inputs, the
 * <select>, and autofilled fields alike.
 *
 * Also fixes the Industry dropdown's near-invisible option text (see the
 * "select option contrast fix" block below).
 *
 * Load this AFTER style.css (see header.php) so it wins on equal
 * specificity. The floated position/size below is a reasonable default -
 * nudge `top` / `font-size` / add a background chip if it doesn't quite
 * line up with the rest of style.css's look.
 */

/*.field {
  position: relative;
}

.field label {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  transition: top .15s ease, font-size .15s ease, color .15s ease;
  pointer-events: none;
}

.field input:focus + label,
.field select:focus + label,
.field input:not(:placeholder-shown) + label,
.field select:not(:placeholder-shown) + label,
.field.has-value label {
  top: 0;
  font-size: .75rem;
}*/

/* ============ select option contrast fix ============
   style.css styles the CLOSED <select> as light text on a dark field
   (so "Industry" reads correctly against the dark page). But most
   browsers render the OPEN dropdown panel with a native, near-white
   background that this page's CSS can't restyle - and without an
   explicit color on <option>, the light text it inherited from the
   closed select becomes near-white-on-white once the panel opens.
   Only the option under the mouse is readable, via the OS's own
   highlight color - everything else disappears.

   Giving <option> its own explicit (dark-on-light) colors fixes this
   regardless of what style.css does for the select itself. */
.field select option {
  color: #1a1a1a;
  background-color: #ffffff;
}

.field select option:checked,
.field select option:hover {
  color: #1a1a1a;
  background-color: #e8f0fe;
}