/* The main calendar widget.  DIV containing a table. */
.calendar {
  z-index: 12001;
}
/* JRADEV-17715 Setting this one higher than ajs-layer */
div.calendar {
  border-radius: 3.01px;
  /* 3.01px for IE10*/
  background-clip: padding-box;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2);
  padding: 2px;
  position: relative;
}
.calendar,
.calendar table {
  background-color: #fff;
  cursor: default;
  font-size: 12px;
}
.calendar table .wn {
  background-color: #f4f5f7;
  color: #666;
  padding: 2px 4px 2px 2px;
}
.calendar {
  border: 1px solid #c1c7d0;
}
/* buttons */
/* "<<", "<", ">", ">>" buttons have this class */
.calendar thead td {
  font-weight: 700;
  padding: 2px;
  text-align: center;
}
.calendar .nav > div {
  position: relative;
}
.calendar .nav > div:after {
  content: "";
  position: absolute;
  right: 1px;
  top: 50%;
  width: 0;
  height: 0;
  margin-top: -2px;
  border-left: 2px solid transparent;
  border-right: 2px solid transparent;
  border-top: 4px solid;
  color: #7a869a;
}
.calendar .nav.active > div:after {
  color: #fff;
}
/* Header part -- contains navigation buttons and day names. */
.calendar .headrow {
  background-color: #f4f5f7;
}
.calendar .headrow td {
  border-top: 1px solid #c1c7d0;
}
.calendar .daynames td {
  background-color: #0065ff;
  color: #fff;
}
.calendar .daynames td.wn {
  background-color: #f4f5f7;
  color: #888;
}
.calendar thead .name {
  font-weight: 400;
}
/* buttons hover */
.calendar td.hilite,
.calendar .combo .hilite,
.calendar td.time span.hilite {
  background-color: #ffe9a8;
}
.calendar .daysrow .emptycell + .day.hilite,
.calendar .daysrow .day + .day.hilite {
  border-radius: 3.01px;
  /* 3.01px for IE10*/
  background-clip: padding-box;
  color: #333;
  background-color: #ffe9a8;
}
.calendar .name.day.hilite {
  background-color: #3572b0;
}
/* active (pressed) buttons */
.calendar td.active,
.calendar .combo .active,
.calendar td.time span.active {
  background-color: #0065ff;
  color: #fff;
}
/* Combo boxes (menus that display months/years for direct selection) */
.calendar .combo {
  background-color: #fff;
  border: 1px solid #c1c7d0;
  border-top: none;
  cursor: default;
  display: none;
  left: 0;
  position: absolute;
  top: 0;
  width: 4em;
  z-index: 100;
}
.calendar .combo .label,
.calendar .combo .label-IEfix {
  text-align: center;
  padding: 2px;
}
/* The body part -- contains all the days in month. */
.calendar tbody .day {
  padding: 2px 4px 2px 2px;
  text-align: right;
  width: 2em;
}
.calendar tbody .emptycell + .day,
.calendar tbody .day + .day {
  border-radius: 3.01px;
  /* 3.01px for IE10*/
  background-clip: padding-box;
}
.calendar tbody .day.othermonth {
  color: #999;
}
.calendar tbody .day.othermonth.oweekend {
  color: #f99;
}
.calendar tbody td.today {
  font-weight: 700;
}
.calendar tbody td.weekend {
  color: #de350b;
}
/* Cell showing selected date */
.calendar tbody td.selected {
  background-color: #3572b0;
  color: #fff;
  font-weight: 700;
}
.calendar tbody .disabled {
  color: #999;
}
.calendar tbody .emptycell {
  visibility: hidden;
}
.calendar tbody .emptyrow {
  display: none;
}
/* time related */
.calendar td.time {
  background-color: #f4f5f7;
  border-top: 1px solid #c1c7d0;
  padding: 2px;
  text-align: center;
}
.calendar td.time span {
  background-color: #fff;
  font-weight: 700;
  padding: 2px 5px 2px 6px;
}
.calendar td.time .colon {
  background-color: #f4f5f7;
}
/* The footer part -- status bar and "Close" button */
.calendar tfoot .footrow {
  text-align: center;
}
.calendar tfoot .ttip {
  border-top: 1px solid #c1c7d0;
  padding: 2px;
}
/* Hover style for buttons in footer - is this even used?*/
.calendar tfoot .hilite {
  background: #afa;
  border: 1px solid #084;
  color: #000;
  padding: 1px;
}
/* Active (pressed) style for buttons in footer - is this even used?*/
.calendar tfoot .active {
  background: #7c7;
  padding: 2px 0 0 2px;
}
