/* ========================================================================
   Component: Autocomplete
 ========================================================================== */
/*
 * 1. Container width fits its content
 * 2. Create position context
 * 3. Prevent `inline-block` consequences
 * 4. Remove the gap between the container and its child element
 */
.f-autocomplete {
  /* 1 */
  display: inline-block;
  /* 2 */
  position: relative;
  /* 3 */
  max-width: 100%;
  /* 4 */
  vertical-align: middle;
}

/* Nav modifier .f-nav-autocomplete`
 ========================================================================== */
/*
 * Items
 */
.f-nav-autocomplete > li > a {
  color: #444444;
}

/*
 * Active
 * 1. Remove default focus style
 */
.f-nav-autocomplete > li.f-active > a {
  background: #00a8e6;
  color: white;
  /* 1 */
  outline: none;
}

/*
 * Sub-object: .f-nav-header`
 */
.f-nav-autocomplete .f-nav-header {
  color: #999999;
}

/*
 * Sub-object: .f-nav-divider`
 */
.f-nav-autocomplete .f-nav-divider {
  border-top: 1px solid #dddddd;
}