
.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);   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);   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);   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: 0.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; }