/*! UIkit 2.20.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
/* ========================================================================
   Component: Form advanced
   Note: Only works in Webkit at the moment
 ========================================================================== */
/*
 * 1. Style
 * 2. Makes box more robust so it clips the child element
 * 3. Vertical alignment
 * 4. Remove default style
 * 5. Fix black background on iOS
 */

.uk-form input {
  &[type="radio"], &[type="checkbox"] {
    /* 1 */
    display: inline-block;
    height: 14px;
    width: 14px;
    border: 1px solid #aaaaaa;
    /* 2 */
    overflow: hidden;
    /* 3 */
    margin-top: -4px;
    vertical-align: middle;
    /* 4 */
    -webkit-appearance: none;
    outline: 0;
    /* 5 */
    background: transparent;
  }
  &[type="radio"] {
    border-radius: 50%;
  }
  &[type=radio]:before, &[type=checkbox]:before {
    display: block;
  }
  &[type=radio]:checked:before {
    content: '';
    width: 8px;
    height: 8px;
    margin: 2px auto 0;
    border-radius: 50%;
    background: #00a8e6;
  }
  &[type=checkbox] {
    &:checked:before {
      content: "\f00c";
      font-family: FontAwesome;
      font-size: 12px;
      -webkit-font-smoothing: antialiased;
      text-align: center;
      line-height: 12px;
      color: #00a8e6;
    }
    &:indeterminate:before {
      content: "\f00c";
      font-family: FontAwesome;
      font-size: 12px;
      -webkit-font-smoothing: antialiased;
      text-align: center;
      line-height: 12px;
      color: #00a8e6;
      content: "\f068";
    }
  }
  &[type=radio]:disabled, &[type=checkbox]:disabled {
    border-color: #dddddd;
  }
  &[type=radio]:disabled:checked:before {
    background-color: #aaaaaa;
  }
  &[type=checkbox]:disabled {
    &:checked:before, &:indeterminate:before {
      color: #aaaaaa;
    }
  }
}

/* Radio */

/*
 * Checked
 */

/* Radio */

/* Checkbox */

/*
 * Disabled
 */