/*
 * Copyright (c) 2016-present, Parse, LLC
 * All rights reserved.
 *
 * This source code is licensed under the license found in the LICENSE file in
 * the root directory of this source tree.
 */
@import 'stylesheets/globals.scss';
.radiobutton {
  display: inline-block;
  margin-right: 12px;
  input[type=radio] {
    opacity: 0;
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
    position: absolute;
  }
  span {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    background: #d0d0d0;
    border-radius: 10px;
    cursor: pointer;
    top: 4px;

    &:hover {
      background: #b0b0b0;
    }

    &:after {
      position: absolute;
      content: '';
      width: 0;
      height: 0;
      border-radius: 100%;
      background: white;

      top: 50%;
      left: 50%;
      @include transform(translate(-50%, -50%));

      transition: all 0.2s cubic-bezier(0, 0, 0.74, 2.2);
    }
  }

  input:checked + span {
    background: #5298fc;

    &:after {
      width: 8px;
      height: 8px;
    }
  }
}
