/*
 *
 *  IN LOCO
 *  www.inlocomedia.com
 *
 *  Copyright 2016 - All Rights Reserved.
 *
 *  -------- SUPERNOVA ---------
 *     pills component file
 *  ----------- *** ------------
 *
 */

@import "pills_variables";


// Pills


.sn-pills {
  margin: $default-pills-margin;
  //&:hover, &:active, &:focus {
  //  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26), 0 2px 10px 0 rgba(0, 0, 0, 0.16);
  //  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26), 0 2px 10px 0 rgba(0, 0, 0, 0.16);
  //}

  &.sn-pills--sm {
    font-size: 11px;
    .sn-pills__label {
      .sn-pills__label--content {
        padding: 4px 8px;
      }
    }
  }

  .sn-pills__label {
    display: inline-block;
    float: left;
    width: auto;
    height: 32px;
    padding: 0;
    margin: 0;

    .sn-pills__label--content {
      display: inline-block;
      border: 1px solid $palette-blue-grey-200;
      width: auto;
      margin: 0;
      padding: 6px 12px 6px 12px;
      color: $default-text-color-primary;
      cursor: pointer;
    }
    input[type=radio] {
      display: none;
    }
  }

  .sn-pills__label .active.sn-pills__label--content {
    background-color: $button-primary-color-alt;
    color: #FFF;
  }

  .sn-pills__label:first-child {
    margin-left: 0;
    .sn-pills__label--content {
      border-right: 0;
      -webkit-border-top-left-radius: 4px;
      border-top-left-radius: 4px;
      -webkit-border-bottom-left-radius: 4px;
      border-bottom-left-radius: 4px;
    }
  }

  .sn-pills__label:last-child {
    .sn-pills__label--content {
      border-left: 0;
      -webkit-border-top-right-radius: 4px;
      border-top-right-radius: 4px;
      -webkit-border-bottom-right-radius: 4px;
      border-bottom-right-radius: 4px;
    }
  }

  .active {
    background-color: $button-primary-color-alt;
    color: #FFF;
  }
}