@charset "UTF-8";

@mixin pat-button() {
  font-family: $body-font-family;
  margin: 0 0.5em 0 0;
  border: 1px solid rgba(0, 0, 0, 0.3);
  cursor: default;
  border-radius: 0.2em;
  background-image: -moz-linear-gradient(bottom, rgba(0,0,0,0.2) 0%, rgba(255,255,255,0.2) 100%);
  background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,0.2) 0%, rgba(255,255,255,0.2) 100%);
  background-image: linear-gradient(bottom, rgba(0,0,0,0.2) 0%, rgba(255,255,255,0.2) 100%);
  text-decoration: none !important;
  line-height: 1.5;
  white-space: nowrap;
  background-color: transparent;
  display: inline-block;
  padding-top: 0;
  padding-left: 1em;
  padding-right: 1em;
  font-size: 0.98em;

  &:active, 
  &.active {
    box-shadow: inset 0 0 0.3em rgba(0, 0, 0, 0.3);
  }

  &.no-label {
    padding-left: 0;
    padding-right: 0;
    width: 1.7em;

    &:before {
      width: 100%;
      text-align: center;
      margin: 0;
    }
  }
}

.pat-button {
  @include pat-button();
}

::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

::-webkit-search-cancel-button {
    &:hover {
        color: $colour-accent;
    }
    &::after {
        content: '\e803';
        font-family: fontello;
        right: 1em;
        position: absolute;
        top: 50%;
        line-height: 1;
        // == $base-font-size, not $base-line-height, to vertically align
        margin-top: -.5em;
    }
}

.pat-button:focus, 
*[data-option].focus:after, 
input:focus, 
.select2-container-multi.select2-container-active, 
textarea:focus {
  border-color: #0081be;
  box-shadow: 0 0 4px #0081be;
}

.pat-button.link {
  border-style: none;
  background-image: none;
}

.pat-button.dropdown {
  position: relative;
  padding-right: 1.6em;
}

.pat-button.dropdown:after {
  content: '\25be';
  display: inline-block;
  font: 18px fontello;
  position: absolute;
  right: 4px;
}

.pat-button.dropdown[class*="icon-"] {
  padding-right: 12px;
}

a.button.dropdown[class*="icon-"]:after, button.dropdown[class*="icon-"]:after {
  display: none;
}

a.button.tentative, button.tentative, ul.cal-events label[data-option="Tentative"] select {
  background-color: #ff9300;
  color: white;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9de96', endColorstr='#398235',GradientType=0 );
  border: 1px solid #c46f00;
}

a.button.confirmative, button.confirmative, ul.cal-events label[data-option="Confirmed"] select {
  background-color: #5bb75b;
  color: white;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9de96', endColorstr='#398235',GradientType=0 );
  border: 1px solid #298f00;
}

a.button.negative, button.negative, ul.cal-events label[data-option="Declined"] select {
  background-color: red;
  color: white;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffcb91', endColorstr='#ff1a00',GradientType=0 );
  border: 1px solid #941100;
}

.pat-button.on, 
a.button:active {
  box-shadow: inset 0 1px 10px rgba(0, 0, 0, 0.3);
}

.pat-button.disabled {
  opacity: 0.4;
  filter: alpha(opacity = 40);
}

button.pat-button {
  &[disabled="disabled"], &:disabled {
    opacity: 0.4;
    filter: alpha(opacity = 40);
  }
}

// Button cluster

.button-cluster {
  overflow: hidden;
  display: inline-block;
  margin: 0;
}

.button-cluster {
  &.float-before {
    margin-right: 5px;
  }
  button, a.button {
    margin: 0;
    border-radius: 0;
    border-left-style: none;
    float: left;
  }
  :first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-left-style: none;
    border-left-style: solid;
  }
}

.button-cluster :last-child {
  border-top-right-radius: 4px !important;
  border-bottom-right-radius: 4px !important;
}
