:root{
  --litepicker-container-months-color-bg: var(--background-section-color-callendar) !important;
  --litepicker-container-months-box-shadow-color: #ddd !important;
  --litepicker-footer-color-bg: var(--background-section-color-callendar) !important;
  --litepicker-footer-box-shadow-color: #ddd !important;
  --litepicker-tooltip-color-bg: var(--background-section-color-callendar) !important;
  --litepicker-month-header-color: var(--calendar-text-color) !important;
  --litepicker-button-prev-month-color: var(--calendar-text-color) !important;
  --litepicker-button-next-month-color: var(--calendar-text-color) !important;
  --litepicker-button-prev-month-color-hover: var(--calendar-day-highlight) !important;
  --litepicker-button-next-month-color-hover: var(--calendar-day-highlight) !important;
  --litepicker-month-width: calc(var(--litepicker-day-width) * 7) !important;
  --litepicker-month-weekday-color: var(--calendar-text-color) !important;
  --litepicker-month-week-number-color: var(--calendar-text-color) !important;
  --litepicker-day-width: 50px !important;
  --litepicker-day-color: var(--calendar-text-color) !important;
  --litepicker-day-color-hover: var(--calendar-day-highlight) !important;
  --litepicker-is-today-color: #f44336 !important;
  --litepicker-is-in-range-color: var(--calendar-day-highlight) !important;
  --litepicker-is-locked-color: #ddd !important;
  --litepicker-is-start-color: var(--calendar-day-highlight-color) !important;
  --litepicker-is-start-color-bg: var(--calendar-day-highlight) !important;
  --litepicker-is-end-color: var(--calendar-day-highlight-color) !important;
  --litepicker-is-end-color-bg: var(--calendar-day-highlight) !important;
  --litepicker-button-cancel-color: var(--background-section-color-callendar) !important;
  --litepicker-button-cancel-color-bg: var(--supportcolor1) !important;
  --litepicker-button-apply-color: var(--background-section-color-callendar) !important;
  --litepicker-button-apply-color-bg: var(--calendar-day-highlight) !important;
  --litepicker-button-reset-color: var(--supportcolor1) !important;
  --litepicker-button-reset-color-hover: var(--calendar-day-highlight) !important;

  --litepicker-highlighted-day-color: #333;
  --litepicker-highlighted-day-color-bg: #ffeb3b;
}

.shadow:before {
  content: "";
  background-color: #000;
  opacity: 0.5;
  width: 100%;
  height: 100%;
  z-index: 9998;
  top: 0;
  left: 0;
  right: 0;
  position: fixed;
}
.litepicker {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
  font-size: 1.3rem;
  overflow: hidden;
  border-radius: 5px;
}

.isIframe .litepicker {
  top: 90px !important;
  transform: translate(-50%, 0%) !important;
}

@media (min-width: 757px) {
  .isIframe .litepicker {
    top: 145px !important;
  }
}

@media (min-width: 979px) {
  .litepicker .month-item:first-child .container__days {
    position: relative;
  }
  .litepicker .month-item:first-child .container__days:after {
    content: "";
    position: absolute;
    display: block;
    right: -5px;
    top: 0;
    height: 100%;
    width: 1px;
    background: #f5f5f5;
  }
  .litepicker__legend {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: calc((var(--litepicker-month-width) * 2) + 20px);
    align-items: center;
  }
}
.litepicker.container__months {
  box-shadow: none;
  padding: 10px;
  border-radius: 0;
}

.litepicker .container__months .month-item-header .button-next-month, .litepicker .container__months .month-item-header .button-previous-month {
  cursor: pointer;
}

.litepicker .container__days {
  min-height: calc(var(--litepicker-day-width) * 6);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
}

.litepicker .container__days a, .litepicker .container__days div {
  height: var(--litepicker-day-width);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  padding: 0;
}

.litepicker .container__months {
  border-radius: 0;
}

.litepicker .container__days .day-item:not(.is-locked) {
  cursor: pointer;
}
.litepicker .container__days .day-item {
  border-radius: 0;
}
.litepicker .container__days .day-item.is-in-range:hover {
  color: var(--litepicker-day-color);
}
.litepicker .container__days .day-item.is-end-date , .litepicker .container__days .day-item.is-start-date {
  border-radius: 0 !important;
}

.litepicker__legend {
  background-color: var(--background-section-color-callendar);
  padding: 10px 15px 10px;
  color: var(--calendar-text-color);
}

.litepicker__legend > div {
  padding-left: 15px;
  position: relative;
}

.litepicker__legend > div:before {
  margin-bottom: 5px;
  content: '';
  width: 5px;
  height: 5px;
  background: #40a350;
  position: absolute;
  display: block;
  border-radius: 50%;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.litepicker__legend > div.legend__halfEnd:before {
  background: #dfa53a;
}


.litepicker .day-item.is-locked:not(.tempLockDay):not(.is-end-date):not(.is-start-date) {
  text-decoration: line-through;
}

.litepicker .day-item.halfBegin:not(.is-locked) , .litepicker .day-item.halfEnd:not(.is-locked) {
  position: relative;
}
.litepicker .day-item.halfBegin:not(.is-locked):after , .litepicker .day-item.halfEnd:not(.is-locked):after {
  content: '';
  width: 5px;
  height: 5px;
  background: #40a350;
  position: absolute;
  display: block;
  border-radius: 50%;
  top: 10px;
  right: 5px;
}

.litepicker .day-item.halfEnd:not(.is-locked):after {
  background: #dfa53a;
}
.litepicker .day-item.is-in-range {
  opacity: 0.75;
}

.litepicker.errorDate .--errorDate {
  display: block;
}

.litepicker__val {
  position: absolute;
  padding: 15px;
  z-index: 9999;
  color: #fff;
  background-color: #da5e61;
  font-size: 14px;
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .2);
  text-align: center;
  transition: .3s all;
  top: 50%;
  left: 50%;
  transform: translate(-50% , -50%);
  display: none;
}

.litepicker__val.--errorDate {
  background-color: #da5e61;
}

.litepicker .litepicker__loader {
  -webkit-animation: spin 2s linear infinite;
  animation: 2s linear 0s normal none infinite running spin;
  border-image: none;
  border-radius: 50%;
  border-style: solid;
  border-width: 3px;
  display: block;
  height: 100px;
  left: 50%;
  margin: -50px 0 0 -50px;
  position: absolute;
  top: 50%;
  width: 100px;
  border-color: var(--button1-background) transparent transparent;
  display: none;
  z-index: 999;
}
.litepicker .litepicker__loader:before {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  -webkit-animation: spin 3s linear infinite;
  animation: 3s linear 0s normal none infinite running spin;
  border-color: var(--button2-background) transparent transparent;
  border-image: none;
  border-radius: 50%;
  border-style: solid;
  border-width: 3px;
  bottom: 5px;
  content: "";
  left: 5px;
  position: absolute;
  right: 5px;
  top: 5px;
}
.litepicker .litepicker__loader:after {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  -webkit-animation: spin 1.5s linear infinite;
  animation: 1.5s linear 0s normal none infinite running spin;
  border-color: var(--button-top-login) transparent transparent;
  border-image: none;
  border-radius: 50%;
  border-style: solid;
  border-width: 3px;
  bottom: 15px;
  content: "";
  left: 15px;
  position: absolute;
  right: 15px;
  top: 15px;
}

.litepicker.--loader:after {
  content: '';
  width: 100%;
  height: calc(100% - 55px);
  position: absolute;
  top: 55px;
  left: 0;
  background: rgba(255, 255, 255, .6);
}
.litepicker.--loader .litepicker__loader {
  display: block;
}

.litepicker .day-item {
 position: relative;
}
.litepicker .day-close {
  position: absolute;
  top: -6px;
  right: -6px;
  padding: 4px 8px;
  border-radius: 50%;
  background-color: var(--litepicker-tooltip-color-bg);
  -webkit-box-shadow: 0 1px 3px rgb(0 0 0 / 25%);
  box-shadow: 0 1px 3px rgb(0 0 0 / 25%);
  white-space: nowrap;
  font-size: 11px;
  display: none;
  color: var(--calendar-text-color);
  z-index: 9999;
}
.litepicker .day-close.--active {
  display: block;
}

.container__tooltip {
  display: none;
}

.litepicker-backdrop {
  z-index: 0 !important;
}