.wsf-datetime-picker {
  background: var(--wsf-field-color-background);
  border: var(--wsf-field-border);
  padding: var(--wsf-field-datetime-padding);
  z-index: 999999;
}

.wsf-datetime-picker.xdsoft_inline {
  display: flex;
}

.wsf-datetime-picker.xdsoft_inline .xdsoft_datepicker {
  float: none;
  width: 100%;
}

.wsf-datetime-picker.xdsoft_inline .xdsoft_datepicker.active + .xdsoft_timepicker {
  width: 25%;
}

.wsf-datetime-picker.xdsoft_inline .xdsoft_datepicker:not(.active) + .xdsoft_timepicker {
  width: 100%;
}

.wsf-datetime-picker.xdsoft_inline .xdsoft_timepicker {
  float: none;
}

.wsf-datetime-picker .xdsoft_datepicker,
.wsf-datetime-picker .xdsoft_timepicker {
  margin: 0;
}

.wsf-datetime-picker .xdsoft_datepicker {
  width: auto;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker {
  align-content: space-between;
  display: flex;
  height: var(--wsf-field-datetime-nav-icon-size);
  margin-bottom: var(--wsf-field-datetime-padding-vertical);
  flex-direction: column;
  flex-wrap: wrap;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_prev {
  background: none;
  border-top: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid transparent !important;
  border-bottom: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid transparent !important;
  border-right: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid var(--wsf-field-datetime-nav-icon-color) !important;
  height: var(--wsf-field-datetime-nav-icon-size);
  margin: 0 var(--wsf-field-datetime-nav-icon-gap) 0 0;
  opacity: 1;
  width: 0;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_today_button {
  background: none;
  background-color: var(--wsf-field-datetime-nav-icon-color);
  border: none;
  cursor: pointer;
  height: calc(var(--wsf-field-datetime-nav-icon-size) * 0.6);
  margin: 0 var(--wsf-field-datetime-nav-icon-gap) 0 0;
  opacity: 1;
  overflow: visible;
  position: relative;
  top: calc(var(--wsf-field-datetime-nav-icon-size) * 0.4);
  width: var(--wsf-field-datetime-nav-icon-size);
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_today_button::before {
  content: '';
  position: absolute;
  top: calc(-1 * (var(--wsf-field-datetime-nav-icon-size) * 0.4));
  left: 0;
  right: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-left: calc(var(--wsf-field-datetime-nav-icon-size) * 0.5) solid transparent;
  border-right: calc(var(--wsf-field-datetime-nav-icon-size) * 0.5) solid transparent;
  border-bottom: calc(var(--wsf-field-datetime-nav-icon-size) * 0.41) solid var(--wsf-field-datetime-nav-icon-color);
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_today_button::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: calc(var(--wsf-field-datetime-nav-icon-size) * 0.2);
  height: calc(var(--wsf-field-datetime-nav-icon-size) * 0.4);
  background-color: white;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_next {
  align-self: flex-end;
  background: none;
  width: 0;
  height: var(--wsf-field-datetime-nav-icon-size);
  border-top: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid transparent !important;
  border-bottom: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid transparent !important;
  border-left: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid var(--wsf-field-datetime-nav-icon-color) !important;
  margin: 0 0 0 var(--wsf-field-datetime-nav-icon-gap);
  opacity: 1;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label {
  background-color: var(--wsf-field-color-background);
  color: var(--wsf-field-datetime-nav-color);
  font-family: var(--wsf-field-datetime-nav-font-family);
  font-size: var(--wsf-field-datetime-nav-font-size);
  font-style: var(--wsf-field-datetime-nav-font-style);
  font-weight: var(--wsf-field-datetime-nav-font-weight);
  height: var(--wsf-field-datetime-nav-font-size);
  letter-spacing: var(--wsf-field-datetime-nav-letter-spacing);
  line-height: var(--wsf-field-datetime-nav-line-height);
  margin: 0;
  padding: 0;
  -webkit-text-decoration: var(--wsf-field-datetime-nav-text-decoration);
          text-decoration: var(--wsf-field-datetime-nav-text-decoration);
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
          text-size-adjust: 100%;
  text-transform: var(--wsf-field-datetime-nav-text-transform);
  text-wrap: nowrap;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label i {
  background: none;
  width: 0;
  height: 0;
  border-left: calc(var(--wsf-field-datetime-nav-icon-size) / 3) solid transparent !important;
  border-right: calc(var(--wsf-field-datetime-nav-icon-size) / 3) solid transparent !important;
  border-top: calc(var(--wsf-field-datetime-nav-icon-size) / 3) solid var(--wsf-field-datetime-nav-color) !important;
  margin: 0 0 0 calc(var(--wsf-field-datetime-nav-icon-gap) / 2);
  opacity: 1;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label > .xdsoft_select {
  border: var(--wsf-field-datetime-nav-border-width) var(--wsf-field-datetime-nav-border-style) var(--wsf-field-datetime-nav-border-color);
  top: calc(var(--wsf-field-datetime-nav-height) - ((var(--wsf-field-datetime-nav-height) - var(--wsf-field-datetime-nav-icon-size)) / 2));
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label > .xdsoft_select > div > div.xdsoft_option {
  background-color: var(--wsf-field-color-background);
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label > .xdsoft_select > div > div.xdsoft_option.xdsoft_current {
  background-color: var(--wsf-field-datetime-nav-current-color-background) !important;
  box-shadow: none;
  color: var(--wsf-field-datetime-nav-current-color) !important;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label > .xdsoft_select > div > div.xdsoft_option:hover {
  background-color: var(--wsf-field-datetime-nav-hover-color-background) !important;
  color: var(--wsf-field-datetime-nav-hover-color) !important;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar th {
  background-color: var(--wsf-field-datetime-calendar-heading-color-background);
  border: var(--wsf-field-datetime-calendar-border-width) var(--wsf-field-datetime-calendar-border-style) var(--wsf-field-datetime-calendar-border-color);
  color: var(--wsf-field-datetime-calendar-heading-color);
  font-size: var(--wsf-field-datetime-calendar-font-size);
  line-height: var(--wsf-field-datetime-calendar-font-size);
  padding: var(--wsf-field-datetime-calendar-padding-vertical) var(--wsf-field-datetime-calendar-padding-horizontal);
  height: auto;
  opacity: 1;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td {
  background-color: var(--wsf-field-datetime-calendar-color-background);
  border: var(--wsf-field-datetime-calendar-border-width) var(--wsf-field-datetime-calendar-border-style) var(--wsf-field-datetime-calendar-border-color);
  color: var(--wsf-field-datetime-calendar-color);
  font-size: var(--wsf-field-datetime-calendar-font-size);
  line-height: var(--wsf-field-datetime-calendar-font-size);
  padding: var(--wsf-field-datetime-calendar-padding-vertical) var(--wsf-field-datetime-calendar-padding-horizontal);
  height: auto;
  opacity: 1;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td.xdsoft_today {
  background-color: var(--wsf-field-datetime-calendar-today-color-background) !important;
  color: var(--wsf-field-datetime-calendar-today-color) !important;
  font-weight: bold;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td.xdsoft_current {
  background: var(--wsf-field-datetime-calendar-current-color-background) !important;
  box-shadow: none;
  color: var(--wsf-field-datetime-calendar-current-color) !important;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td.xdsoft_disabled, .wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td.xdsoft_other_month {
  color: var(--wsf-field-datetime-calendar-disabled-color) !important;
}

.wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td:hover {
  background: var(--wsf-field-datetime-calendar-hover-color-background) !important;
  color: var(--wsf-field-datetime-calendar-hover-color) !important;
}

.wsf-datetime-picker .xdsoft_datepicker.active + .xdsoft_timepicker {
  margin: 0;
}

.wsf-datetime-picker .xdsoft_datepicker.active + .xdsoft_timepicker.active {
  margin: var(--wsf-field-datetime-padding-vertical) 0 0 var(--wsf-field-datetime-padding-horizontal);
}

.wsf-datetime-picker.xdsoft_showweeks .xdsoft_datepicker {
  width: auto;
}

.wsf-datetime-picker .xdsoft_timepicker {
  width: auto;
}

.wsf-datetime-picker .xdsoft_timepicker .xdsoft_prev {
  background: none;
  border-left: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid transparent !important;
  border-right: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid transparent !important;
  border-bottom: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid var(--wsf-field-datetime-nav-icon-color) !important;
  bottom: calc(var(--wsf-field-datetime-nav-icon-size) / 3);
  height: var(--wsf-field-datetime-nav-icon-size);
  margin: 0 auto;
  opacity: 1;
  width: 0;
}

.wsf-datetime-picker .xdsoft_timepicker .xdsoft_next {
  background: none;
  height: var(--wsf-field-datetime-nav-icon-size);
  border-left: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid transparent !important;
  border-right: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid transparent !important;
  border-top: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid var(--wsf-field-datetime-nav-icon-color) !important;
  margin: 0 auto;
  opacity: 1;
  top: calc(var(--wsf-field-datetime-nav-icon-size) / 3);
  width: 0;
}

.wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box {
  border: var(--wsf-field-datetime-calendar-border-width) var(--wsf-field-datetime-calendar-border-style) var(--wsf-field-datetime-calendar-border-color);
  height: calc(6 * ( ( var(--wsf-field-datetime-calendar-padding-vertical) * 2 ) + var(--wsf-field-datetime-calendar-font-size) + var(--wsf-field-datetime-calendar-border-width) ));
}

.wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box > div > div {
  background-color: var(--wsf-field-color-background);
  border-top: var(--wsf-field-datetime-calendar-border-width) var(--wsf-field-datetime-calendar-border-style) var(--wsf-field-datetime-calendar-border-color);
  color: var(--wsf-field-color);
  font-size: var(--wsf-field-datetime-calendar-font-size);
  line-height: var(--wsf-field-datetime-calendar-font-size);
  padding: var(--wsf-field-datetime-calendar-padding-vertical) var(--wsf-field-datetime-calendar-padding-horizontal);
  height: auto;
}

.wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current {
  background: var(--wsf-field-datetime-calendar-current-color-background) !important;
  box-shadow: none;
  color: var(--wsf-field-datetime-calendar-current-color) !important;
}

.wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box > div > div:hover {
  background: var(--wsf-field-datetime-calendar-hover-color-background) !important;
  color: var(--wsf-field-datetime-calendar-hover-color) !important;
}

.wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_disabled {
  opacity: .25;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker {
  background: var(--wsf-field-color-background-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_prev {
  border-right: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid var(--wsf-field-datetime-nav-icon-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_today_button {
  background-color: var(--wsf-field-datetime-nav-icon-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_today_button::before {
  border-bottom: calc(var(--wsf-field-datetime-nav-icon-size) * 0.41) solid var(--wsf-field-datetime-nav-icon-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_next {
  border-left: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid var(--wsf-field-datetime-nav-icon-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label {
  background-color: var(--wsf-field-color-background-alt);
  color: var(--wsf-field-datetime-nav-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label i {
  border-top: calc(var(--wsf-field-datetime-nav-icon-size) / 3) solid var(--wsf-field-datetime-nav-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label > .xdsoft_select {
  border: var(--wsf-field-datetime-nav-border-width) var(--wsf-field-datetime-nav-border-style) var(--wsf-field-datetime-nav-border-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label > .xdsoft_select > div > div.xdsoft_option {
  background-color: var(--wsf-field-color-background-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label > .xdsoft_select > div > div.xdsoft_option.xdsoft_current {
  background-color: var(--wsf-field-datetime-nav-current-color-background-alt) !important;
  color: var(--wsf-field-datetime-nav-current-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_monthpicker .xdsoft_label > .xdsoft_select > div > div.xdsoft_option:hover {
  background-color: var(--wsf-field-datetime-nav-hover-color-background-alt) !important;
  color: var(--wsf-field-datetime-nav-hover-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar th {
  background-color: var(--wsf-field-datetime-calendar-heading-color-background-alt);
  border: var(--wsf-field-datetime-calendar-border-width) var(--wsf-field-datetime-calendar-border-style) var(--wsf-field-datetime-calendar-border-color-alt);
  color: var(--wsf-field-datetime-calendar-heading-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td {
  background-color: var(--wsf-field-datetime-calendar-color-background-alt);
  border: var(--wsf-field-datetime-calendar-border-width) var(--wsf-field-datetime-calendar-border-style) var(--wsf-field-datetime-calendar-border-color-alt);
  color: var(--wsf-field-datetime-calendar-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td.xdsoft_today {
  background-color: var(--wsf-field-datetime-calendar-today-color-background-alt) !important;
  color: var(--wsf-field-datetime-calendar-today-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td.xdsoft_current {
  background: var(--wsf-field-datetime-calendar-current-color-background-alt) !important;
  color: var(--wsf-field-datetime-calendar-current-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td:hover {
  background: var(--wsf-field-datetime-calendar-hover-color-background-alt) !important;
  color: var(--wsf-field-datetime-calendar-hover-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td.xdsoft_disabled, html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_datepicker .xdsoft_calendar td.xdsoft_other_month {
  color: var(--wsf-field-datetime-calendar-disabled-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_timepicker .xdsoft_prev {
  border-bottom: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid var(--wsf-field-datetime-nav-icon-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_timepicker .xdsoft_next {
  border-top: calc(var(--wsf-field-datetime-nav-icon-size) / 2) solid var(--wsf-field-datetime-nav-icon-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box {
  border: var(--wsf-field-datetime-calendar-border-width) var(--wsf-field-datetime-calendar-border-style) var(--wsf-field-datetime-calendar-border-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box > div > div {
  background-color: var(--wsf-field-color-background-alt);
  border-top: var(--wsf-field-datetime-calendar-border-width) var(--wsf-field-datetime-calendar-border-style) var(--wsf-field-datetime-calendar-border-color-alt);
  color: var(--wsf-field-color-alt);
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current {
  background: var(--wsf-field-datetime-calendar-current-color-background-alt) !important;
  color: var(--wsf-field-datetime-calendar-current-color-alt) !important;
}

html.wsf-styler-scheme-alt .wsf-form[data-wsf-style-has-alt] .wsf-datetime-picker .xdsoft_timepicker .xdsoft_time_box > div > div:hover {
  background: var(--wsf-field-datetime-calendar-hover-color-background-alt) !important;
  color: var(--wsf-field-datetime-calendar-hover-color-alt) !important;
}