/**
 * @copyright  (C) 2016 Open Source Matters, Inc. <https://www.joomla.org>
 * @license    GNU General Public License version 2 or later; see LICENSE.txt
 */
.js-calendar {
  box-shadow: 0 0 15px 4px var(--bs-border-color) !important;
}

.calendar-container {
  z-index: 1100 !important;
  float: left;
  min-width: 160px;
  padding: 0;
  list-style: none;
  background-color: var(--bs-body-bg) !important;
  border-radius: 5px;
}

.calendar-container table {
  z-index: 1100 !important;
  max-width: 262px;
  table-layout: fixed;
  background-color: var(--bs-body-bg) !important;
  border-radius: 5px;
}

/* The main calendar widget.  DIV containing a table. */
div.calendar-container table th,
.calendar-container table td {
  padding: 8px 0;
  line-height: 1.1em;
  text-align: center;
  box-shadow: none;
}

div.calendar-container table body td {
  line-height: 2em;
}

.calendar-container table {
  border-collapse: separate;
}

div.calendar-container table td.title {
  text-align: center;
  /* This holds the current "month, year" */
  vertical-align: middle;
}

.calendar-container table thead td.headrow {
  color: var(--bs-body-color);
  /* Row <TR> containing navigation buttons */
  background: var(--bs-body-bg);
}

.calendar-container table thead td.name {
  color: var(--bs-body-color);
  text-align: center;
  /* Cells <TD> containing the day names */
  border-bottom: 1px solid var(--bs-body-bg);
}

.calendar-container table thead td.weekend {
  /* How a weekend day name shows in header */
  color: #999;
}

/* The body part -- contains all the days in month. */
.calendar-container table tbody td.day {
  /* Cells <TD> containing month days dates */
  text-align: right;
}

.calendar-container table tbody td.wn {
  background: var(--bs-body-bg);
}

.calendar-container table tbody td.weekend {
  /* Cells showing weekend days */
  color: #999;
}

.calendar-container table tbody td.hilite {
  color: var(--bs-body-bg);
  /* Hovered cells <TD> */
  background: #999;
}

.calendar-container table tbody td.day {
  min-width: 38px;
  font-size: 12px;
  cursor: pointer;
  border: 0;
}

.calendar-container table tbody td.day.wn {
  text-align: center;
  background-color: var(--bs-body-bg);
}

.calendar-container table tbody td.day.selected {
  color: var(--bs-body-bg);
  /* Cell showing today date */
  background: #3071a9;
  border: 0;
}

.calendar-container table tbody td.today {
  position: relative;
  width: auto;
  height: 100%;
  font-weight: bold;
}

.calendar-container table tbody td.today:after {
  position: absolute;
  right: 3px;
  bottom: 3px;
  left: 3px;
  height: 3px;
  content: "";
  background-color: #46a546;
  border-radius: 1.5px;
}

.calendar-container table tbody td.today.selected:after {
  background-color: #fff;
}

.calendar-container table tbody td.day:hover {
  color: var(--bs-body-bg);
  cursor: pointer;
  background: #3d8fd7;
}

.calendar-container table tbody td.day:hover:after {
  background-color: var(--bs-body-bg);
}

.calendar-container table tbody .disabled {
  color: #999;
  background-color: var(--bs-body-bg);
}

.calendar-container table tbody .emptycell {
  /* Empty cells (the best is to hide them) */
  visibility: hidden;
}

.calendar-container table tbody .emptyrow {
  /* Empty row (some months need less than 6 rows) */
  display: none;
}

.calendar-container .calendar-head-row td {
  padding: 4px 0 !important;
  border-bottom: none;
}

.calendar-container .day-name {
  font-size: 0.7rem;
  font-weight: bold;
}

.calendar-container .time td {
  padding: 8px 0 8px 8px;
}

.buttons-wrapper {
  width: 100%;
  padding: 5px;
}

.buttons-wrapper .btn {
  min-width: 60px;
  padding: 0 16px;
  margin-right: 0.5rem;
  line-height: 2.375rem;
  color: var(--bs-primary);
  border: 1px solid var(--bs-primary);
}

.buttons-wrapper .btn:hover {
  color: var(--bs-body-bg);
  background: var(--bs-primary);
  border: 1px solid var(--bs-primary);
}

.buttons-wrapper .btn:last-child {
  margin-right: 0;
}

.time .time-title {
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='22' height='22' viewBox='0 0 1792 1792' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1024 544v448q0 14-9 23t-23 9h-320q-14 0-23-9t-9-23v-64q0-14 9-23t23-9h224v-352q0-14 9-23t23-9h64q14 0 23 9t9 23zm416 352q0-148-73-273t-198-198-273-73-273 73-198 198-73 273 73 273 198 198 273 73 273-73 198-198 73-273zm224 0q0 209-103 385.5t-279.5 279.5-385.5 103-385.5-103-279.5-279.5-103-385.5 103-385.5 279.5-279.5 385.5-103 385.5 103 279.5 279.5 103 385.5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}