/* --------------------------------------------------------

  Date picker:

-------------------------------------------------------- */

.ui-datepicker * { .reset; }

.ui-datepicker {
  .box-sizing;
  display: none;
  position: relative;
  z-index: 2;
  margin-top: -@border-width;
  padding: .75em;
  border: @datepicker-border;
  min-width: 14em;
  width: @input-width;
  background: @datepicker-bg;
  border-radius: 0 0 @border-radius @border-radius;
  font-size: @small-font-size;
  font-family: @font-family;
  .box-shadow(0 @border-width @border-width rgba(0,0,0,.2));

/* --------------------------------------------------------
  Header:
-------------------------------------------------------- */

  .ui-datepicker-header {
    position: relative;
    margin-bottom: .75em;
  }

  .ui-datepicker-prev,
  .ui-datepicker-next  {
    position: absolute;
    top: 50%;
    margin-top: -@datepicker-icon-size/2;
    cursor: pointer;
    width: @datepicker-icon-size;
    height: @datepicker-icon-size;
    background: url("@{datepicker-sprite}") left no-repeat;
    span { display: none; }
    &:hover {
      border: none;
    }
    &:active {
      margin-top: -@datepicker-icon-size/2 + 1;
   }
  }
  .ui-datepicker-prev { left: 0; }
  .ui-datepicker-next {
    right: 0;
    background-position: right;
  }
  .ui-datepicker-title {
    text-align: center;
    color: @datepicker-monthyear-text;
  }

/* --------------------------------------------------------
  Calendar:
-------------------------------------------------------- */

  .ui-datepicker-calendar {
    font-size: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    th {
      padding: 0;
      padding-bottom: .2em;
      text-align: center;
    }
    a {
      .reset;
      padding: .1em 0;
      text-align: center;
    }
    .ui-state-default {
      color: @datepicker-day-text;
      font-weight: normal;
    }
    .ui-state-hover,
    .ui-state-active {
      color: @datepicker-day-selected-text;
      font-weight: bold;
    }
  }

}

/* --------------------------------------------------------
  Input:
-------------------------------------------------------- */

input.hasDatepicker.open {
  border-radius: @border-radius @border-radius 0 0;
}
