@pdg/react-form 1.0.132 → 1.0.134

package/dist/assets/output-CGJoEFnm.css

@@ -0,0 +1,719 @@
+.FormHidden {
+  display: none !important;
+}
+
+.FormTextField {
+  min-width: 200px;
+}
+.FormTextField .clear-icon-button-wrap {
+  visibility: hidden;
+}
+.FormTextField.variant-filled .clear-icon-button-wrap {
+  margin-top: 9px;
+  margin-bottom: -9px;
+}
+.FormTextField:hover .clear-icon-button-wrap.show,
+.FormTextField .MuiInputBase-root.Mui-focused .clear-icon-button-wrap.show {
+  visibility: visible;
+}
+
+.FormSelect.is-selected-placeholder .MuiSelect-select {
+  opacity: 0.38;
+}
+.FormSelect .MuiInputBase-root.MuiInputBase-adornedEnd {
+  padding-right: 25px;
+}
+.FormSelect .MuiSelect-select.MuiSelect-multiple .selected-list:not(:empty) {
+  margin-top: -3px;
+  margin-bottom: -3px;
+}
+.FormSelect-Menu-Popover > .MuiPaper-root::-webkit-scrollbar {
+  width: 12px;
+}
+.FormSelect-Menu-Popover > .MuiPaper-root::-webkit-scrollbar-thumb {
+  background-color: rgba(0, 0, 0, 0.1882352941);
+  background-clip: padding-box;
+  border-left: 4px transparent solid;
+  border-right: 4px transparent solid;
+}
+.FormSelect-Menu-Popover > .MuiPaper-root::-webkit-scrollbar-button:start:decrement, .FormSelect-Menu-Popover > .MuiPaper-root::-webkit-scrollbar-button:end:increment {
+  display: block;
+  height: 4px;
+  background-color: transparent;
+}
+
+.FormTextarea .MuiInputBase-root .MuiInputBase-input {
+  overflow-y: scroll;
+}
+.FormTextarea .MuiInputBase-root .MuiInputBase-input::-webkit-scrollbar {
+  width: 8px;
+}
+.FormTextarea .MuiInputBase-root .MuiInputBase-input::-webkit-scrollbar-thumb {
+  background-color: rgba(0, 0, 0, 0.1882352941);
+  background-clip: padding-box;
+  border-left: 4px transparent solid;
+}
+
+.FormPassword .eye-icon-button-wrap {
+  visibility: hidden;
+}
+.FormPassword.variant-filled .eye-icon-button-wrap {
+  margin-top: 9px;
+  margin-bottom: -9px;
+}
+.FormPassword:hover .eye-icon-button-wrap.show,
+.FormPassword .MuiInputBase-root.Mui-focused .eye-icon-button-wrap.show {
+  visibility: visible;
+}
+
+.FormSearch input[type=search]::-webkit-search-decoration,
+.FormSearch input[type=search]::-webkit-search-cancel-button,
+.FormSearch input[type=search]::-webkit-search-results-button,
+.FormSearch input[type=search]::-webkit-search-results-decoration {
+  -webkit-appearance: none;
+}
+
+.FormToggleButtonGroup.loading .FormItemBase-Control-wrap .FormItemBase-Control {
+  align-items: center !important;
+}
+.FormToggleButtonGroup .ToggleButton {
+  display: inline-flex;
+  padding: 0 10px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  align-items: center;
+}
+.FormToggleButtonGroup .ToggleButton .__label__ {
+  height: 0;
+  line-height: 0 !important;
+  overflow: visible !important;
+}
+.FormToggleButtonGroup.type-checkbox .ToggleButton, .FormToggleButtonGroup.type-radio .ToggleButton {
+  padding-left: 3px;
+  padding-right: 5px;
+  border: 0 !important;
+  margin-left: 0 !important;
+  justify-content: flex-start;
+  display: flex;
+  background-color: transparent !important;
+}
+.FormToggleButtonGroup.type-checkbox .ToggleButton:not(:last-child), .FormToggleButtonGroup.type-radio .ToggleButton:not(:last-child) {
+  margin-right: 5px;
+}
+.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-checked__,
+.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-unchecked__, .FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-checked__,
+.FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-unchecked__ {
+  margin-right: 3px;
+}
+.FormToggleButtonGroup.type-checkbox .ToggleButton .__checkbox-checked__, .FormToggleButtonGroup.type-radio .ToggleButton .__checkbox-checked__ {
+  display: none;
+}
+.FormToggleButtonGroup.type-checkbox .ToggleButton.Mui-selected .__checkbox-checked__, .FormToggleButtonGroup.type-radio .ToggleButton.Mui-selected .__checkbox-checked__ {
+  display: block;
+}
+.FormToggleButtonGroup.type-checkbox .ToggleButton.Mui-selected .__checkbox-unchecked__, .FormToggleButtonGroup.type-radio .ToggleButton.Mui-selected .__checkbox-unchecked__ {
+  display: none;
+}
+.FormToggleButtonGroup:not(.with-label).variant-outlined .FormItemBase-Control-wrap {
+  margin-top: 15px;
+  margin-bottom: -15px;
+}
+.FormToggleButtonGroup:not(.with-label).variant-outlined .FormItemBase-Control-wrap .ToggleButton {
+  height: 37px;
+}
+.FormToggleButtonGroup:not(.with-label).variant-filled .FormItemBase-Control-wrap {
+  margin-top: 15px;
+  margin-bottom: -15px;
+}
+.FormToggleButtonGroup:not(.with-label).variant-filled .FormItemBase-Control-wrap .ToggleButton {
+  height: 37px;
+}
+.FormToggleButtonGroup:not(.with-label).variant-standard .FormItemBase-Control-wrap {
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+.FormToggleButtonGroup:not(.with-label).variant-standard .FormItemBase-Control-wrap .ToggleButton {
+  height: 28px;
+}
+.FormToggleButtonGroup:not(.with-label).size-small.variant-outlined .FormItemBase-Control-wrap {
+  margin-top: 13px;
+  margin-bottom: -13px;
+}
+.FormToggleButtonGroup:not(.with-label).size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {
+  height: 24px;
+}
+.FormToggleButtonGroup:not(.with-label).size-small.variant-filled .FormItemBase-Control-wrap {
+  margin-top: 13px;
+  margin-bottom: -13px;
+}
+.FormToggleButtonGroup:not(.with-label).size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {
+  height: 31px;
+}
+.FormToggleButtonGroup:not(.with-label).size-small.variant-standard .FormItemBase-Control-wrap {
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+.FormToggleButtonGroup:not(.with-label).size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {
+  height: 26px;
+}
+.FormToggleButtonGroup.with-label.variant-outlined .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.FormToggleButtonGroup.with-label.variant-outlined .FormItemBase-Control-wrap .ToggleButton {
+  height: 37px;
+}
+.FormToggleButtonGroup.with-label.variant-filled .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.FormToggleButtonGroup.with-label.variant-filled .FormItemBase-Control-wrap .ToggleButton {
+  height: 37px;
+}
+.FormToggleButtonGroup.with-label.variant-standard .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.FormToggleButtonGroup.with-label.variant-standard .FormItemBase-Control-wrap .ToggleButton {
+  height: 28px;
+}
+.FormToggleButtonGroup.with-label.size-small.variant-outlined .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.FormToggleButtonGroup.with-label.size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {
+  height: 24px;
+}
+.FormToggleButtonGroup.with-label.size-small.variant-filled .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.FormToggleButtonGroup.with-label.size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {
+  height: 31px;
+}
+.FormToggleButtonGroup.with-label.size-small.variant-standard .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.FormToggleButtonGroup.with-label.size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {
+  height: 26px;
+}
+
+.Form .FormCol.with-label .FormToggleButtonGroup.variant-outlined .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.variant-outlined .FormItemBase-Control-wrap .ToggleButton {
+  height: 37px;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.variant-filled .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.variant-filled .FormItemBase-Control-wrap .ToggleButton {
+  height: 37px;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.variant-standard .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.variant-standard .FormItemBase-Control-wrap .ToggleButton {
+  height: 28px;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-outlined .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-outlined .FormItemBase-Control-wrap .ToggleButton {
+  height: 24px;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-filled .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-filled .FormItemBase-Control-wrap .ToggleButton {
+  height: 31px;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-standard .FormItemBase-Control-wrap {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.Form .FormCol.with-label .FormToggleButtonGroup.size-small.variant-standard .FormItemBase-Control-wrap .ToggleButton {
+  height: 26px;
+}
+
+.FormImageFile .preview-img {
+  max-width: 100%;
+}
+.FormImageFile:not(.hide-file-name):not(.variant-standard) .preview-img {
+  padding-right: 14px;
+}
+
+.FormTextEditor.initializing textarea {
+  display: none;
+}
+.FormTextEditor.error .tox-tinymce {
+  border-color: #d32f2f;
+}
+
+.tox-menu.tox-collection.tox-collection--list .tox-collection__group .tox-menu-nav__js.tox-collection__item {
+  padding-right: 20px !important;
+}
+
+.tox-notifications-container {
+  display: none;
+}
+
+.FormItemBase .FormItemBase-InputLabel {
+  overflow: visible;
+  padding-left: 5px;
+}
+.FormItemBase .FormItemBase-InputLabel.MuiInputLabel-sizeSmall {
+  transform: translate(0, -1.5px) scale(0.7);
+}
+.FormItemBase.variant-standard .FormItemBase-Control-wrap {
+  margin-top: 16px;
+}
+
+.FormFile .control-wrap {
+  display: inline-flex;
+}
+.FormFile .control-wrap .file-name-wrap .file-name {
+  min-width: 350px;
+}
+.FormFile .control-wrap .file-name-wrap .file-name .MuiInputBase-root {
+  padding-right: 7px;
+}
+.FormFile .control-wrap .input-file {
+  display: none;
+}
+.FormFile .control-wrap .input-file-wrap {
+  display: flex;
+}
+.FormFile .control-wrap .input-file-wrap .input-file-btn:not(.hidden-label) .PdgIcon {
+  margin-left: -3px;
+}
+.FormFile.full-width .control-wrap {
+  display: flex;
+}
+.FormFile.full-width .control-wrap .file-name-wrap {
+  flex: 1;
+}
+.FormFile.variant-standard .file-name-wrap .file-name .MuiInputBase-root {
+  padding-right: 0;
+}
+.FormFile:not(.hide-file-name).variant-outlined .form-file-btn label, .FormFile:not(.hide-file-name).variant-filled .form-file-btn label {
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+.FormFile:not(.hide-file-name).variant-standard .form-file-btn label {
+  padding-top: 5px;
+  padding-bottom: 5px;
+}
+.FormFile:not(.hide-file-name).size-small .form-file-btn label {
+  padding-top: 5px;
+  padding-bottom: 5px;
+}
+
+.FormFile.hide-file-name:not(.with-label).variant-outlined .form-file-btn {
+  height: 52px;
+}
+.FormFile.hide-file-name:not(.with-label).variant-filled .form-file-btn {
+  height: 52px;
+}
+.FormFile.hide-file-name:not(.with-label).variant-standard .form-file-btn {
+  height: 28px;
+}
+.FormFile.hide-file-name:not(.with-label).size-small.variant-outlined .form-file-btn {
+  height: 37px;
+}
+.FormFile.hide-file-name:not(.with-label).size-small.variant-filled .form-file-btn {
+  height: 44px;
+}
+.FormFile.hide-file-name:not(.with-label).size-small.variant-standard .form-file-btn {
+  height: 26px;
+}
+.FormFile.hide-file-name.with-label.variant-outlined .form-file-btn {
+  height: 37px;
+}
+.FormFile.hide-file-name.with-label.variant-filled .form-file-btn {
+  height: 37px;
+}
+.FormFile.hide-file-name.with-label.variant-standard .form-file-btn {
+  height: 28px;
+}
+.FormFile.hide-file-name.with-label.size-small.variant-outlined .form-file-btn {
+  height: 24px;
+}
+.FormFile.hide-file-name.with-label.size-small.variant-filled .form-file-btn {
+  height: 31px;
+}
+.FormFile.hide-file-name.with-label.size-small.variant-standard .form-file-btn {
+  height: 26px;
+}
+
+.Form .FormCol.with-label .FormFile.hide-file-name.variant-outlined .form-file-btn {
+  height: 37px;
+}
+.Form .FormCol.with-label .FormFile.hide-file-name.variant-filled .form-file-btn {
+  height: 37px;
+}
+.Form .FormCol.with-label .FormFile.hide-file-name.variant-standard .form-file-btn {
+  height: 28px;
+}
+.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-outlined .form-file-btn {
+  height: 24px;
+}
+.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-filled .form-file-btn {
+  height: 31px;
+}
+.Form .FormCol.with-label .FormFile.hide-file-name.size-small.variant-standard .form-file-btn {
+  height: 26px;
+}
+
+.FormDateRangePickerTooltipPickerContainer {
+  display: inline-block;
+  position: relative;
+}
+.FormDateRangePickerTooltipPickerContainer .month-change-arrow-wrap {
+  position: absolute;
+  top: 15px;
+  left: 0;
+  right: 0;
+}
+.FormDateRangePickerTooltipPickerContainer .month-change-arrow-wrap > div:first-of-type {
+  padding-left: 20px;
+}
+.FormDateRangePickerTooltipPickerContainer .month-change-arrow-wrap > div:last-child {
+  padding-right: 20px;
+  text-align: right;
+}
+.FormDateRangePickerTooltipPickerContainer .month-title {
+  text-align: center;
+  padding-top: 13px;
+  padding-bottom: 10px;
+}
+.FormDateRangePickerTooltipPickerContainer .month-title button {
+  font-size: 15px;
+  padding-left: 8px;
+  padding-right: 0;
+  min-width: 0;
+}
+.FormDateRangePickerTooltipPickerContainer .month-title button:not(.active) {
+  color: unset;
+}
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap {
+  position: relative;
+}
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .year-select,
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .month-select {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  border-top: 1px solid #efefef;
+  padding-top: 15px;
+  background-color: white;
+}
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .year-select button.today:not(.selected),
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .month-select button.today:not(.selected) {
+  border: 1px solid rgba(0, 0, 0, 0.1);
+}
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .year-select button.active:not(.selected),
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .month-select button.active:not(.selected) {
+  background-color: #f5f5f5;
+}
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .year-select button.active:not(.selected):hover,
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .month-select button.active:not(.selected):hover {
+  background-color: rgb(229, 229, 229);
+}
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .year-select {
+  overflow-y: scroll;
+}
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .year-select button {
+  font-size: 14px;
+  font-weight: 400;
+  border-radius: 18px;
+}
+.FormDateRangePickerTooltipPickerContainer .date-picker-wrap .month-select button {
+  font-size: 15px;
+  font-weight: 400;
+  border-radius: 18px;
+}
+.FormDateRangePickerTooltipPickerContainer .action-buttons button {
+  min-width: 0;
+  color: unset;
+}
+.FormDateRangePickerTooltipPickerContainer .action-buttons button:not(:first-of-type) {
+  margin-left: 5px;
+}
+.FormDateRangePickerTooltipPickerContainer .action-buttons button.disabled {
+  color: rgba(0, 0, 0, 0.5);
+}
+
+.PrivateDateTimePicker .input-text-field.align-left .MuiInputBase-input {
+  text-align: left;
+}
+.PrivateDateTimePicker .input-text-field.align-center .MuiInputBase-input {
+  text-align: center;
+}
+.PrivateDateTimePicker .input-text-field.align-right .MuiInputBase-input {
+  text-align: right;
+}
+
+.PrivateDatePicker .input-text-field.align-left .MuiInputBase-input {
+  text-align: left;
+}
+.PrivateDatePicker .input-text-field.align-center .MuiInputBase-input {
+  text-align: center;
+}
+.PrivateDatePicker .input-text-field.align-right .MuiInputBase-input {
+  text-align: right;
+}
+
+.PrivateStaticDateTimePicker.time {
+  height: 400px;
+}
+.PrivateStaticDateTimePicker .MuiPickersCalendarHeader-root {
+  display: none;
+}
+.PrivateStaticDateTimePicker .month-title-container {
+  display: flex;
+  align-items: center;
+  margin-left: 5px;
+}
+.PrivateStaticDateTimePicker .month-title-container .month-title-wrap {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+}
+.PrivateStaticDateTimePicker .month-title-container .month-title-wrap .month-title button {
+  font-size: 15px;
+  padding-left: 8px;
+  padding-right: 0;
+  min-width: 0;
+}
+.PrivateStaticDateTimePicker .month-title-container .month-title-wrap .month-title button:not(.active) {
+  color: unset;
+}
+.PrivateStaticDateTimePicker .action-buttons {
+  border-top: 1px solid #efefef;
+  padding: 10px;
+  text-align: right;
+}
+.PrivateStaticDateTimePicker .action-buttons button {
+  min-width: 0;
+  color: inherit;
+}
+.PrivateStaticDateTimePicker .action-buttons button:not(:first-of-type) {
+  margin-left: 5px;
+}
+.PrivateStaticDateTimePicker .action-buttons button.disabled {
+  color: rgba(0, 0, 0, 0.5);
+}
+.PrivateStaticDateTimePicker .time {
+  border-left: 2px solid #bfbfbf;
+}
+.PrivateStaticDateTimePicker .time .time-container {
+  height: 100%;
+}
+.PrivateStaticDateTimePicker .time .time-container .time-title {
+  text-align: center;
+  padding: 22px 0;
+  font-size: 15px;
+}
+.PrivateStaticDateTimePicker .time .time-container .time-select-wrap {
+  flex: 1;
+  border-top: 1px solid #efefef;
+}
+.PrivateStaticDateTimePicker.time .time .time-container .time-select-wrap > div > div:not(:first-of-type) {
+  border-left: 1px solid #efefef;
+}
+
+.PrivateStaticDatePicker.time {
+  height: 400px;
+}
+.PrivateStaticDatePicker .MuiPickersCalendarHeader-root {
+  display: none;
+}
+.PrivateStaticDatePicker .month-title-container {
+  display: flex;
+  align-items: center;
+  margin-left: 5px;
+}
+.PrivateStaticDatePicker .month-title-container .month-title-wrap {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+}
+.PrivateStaticDatePicker .month-title-container .month-title-wrap .month-title button {
+  font-size: 15px;
+  padding-left: 8px;
+  padding-right: 0;
+  min-width: 0;
+}
+.PrivateStaticDatePicker .month-title-container .month-title-wrap .month-title button:not(.active) {
+  color: unset;
+}
+.PrivateStaticDatePicker .action-buttons {
+  border-top: 1px solid #efefef;
+  padding: 10px;
+  text-align: right;
+}
+.PrivateStaticDatePicker .action-buttons button {
+  min-width: 0;
+  color: inherit;
+}
+.PrivateStaticDatePicker .action-buttons button:not(:first-of-type) {
+  margin-left: 5px;
+}
+.PrivateStaticDatePicker .action-buttons button.disabled {
+  color: rgba(0, 0, 0, 0.5);
+}
+.PrivateStaticDatePicker .time {
+  border-left: 2px solid #bfbfbf;
+}
+.PrivateStaticDatePicker .time .time-container {
+  height: 100%;
+}
+.PrivateStaticDatePicker .time .time-container .time-title {
+  text-align: center;
+  padding: 22px 0;
+  font-size: 15px;
+}
+.PrivateStaticDatePicker .time .time-container .time-select-wrap {
+  flex: 1;
+  border-top: 1px solid #efefef;
+}
+.PrivateStaticDatePicker.time .time .time-container .time-select-wrap > div > div:not(:first-of-type) {
+  border-left: 1px solid #efefef;
+}
+
+.PrivateInputDatePicker.align-left .MuiInputBase-input {
+  text-align: left;
+}
+.PrivateInputDatePicker.align-center .MuiInputBase-input {
+  text-align: center;
+}
+.PrivateInputDatePicker.align-right .MuiInputBase-input {
+  text-align: right;
+}
+
+.PrivateYearSelect {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  background-color: white;
+}
+.PrivateYearSelect button {
+  font-size: 14px;
+  font-weight: 400;
+  border-radius: 18px;
+}
+
+.FormDateRangePickerTooltipPicker .MuiPickersCalendarHeader-root {
+  display: none;
+}
+.FormDateRangePickerTooltipPicker .MuiDayPicker-header > span {
+  margin: 0;
+}
+.FormDateRangePickerTooltipPicker .MuiPickerStaticWrapper-content {
+  min-width: 292px;
+}
+.FormDateRangePickerTooltipPicker .MuiPickerStaticWrapper-content .MuiCalendarOrClockPicker-root > div {
+  width: 292px;
+}
+.FormDateRangePickerTooltipPicker .MuiPickerStaticWrapper-content .MuiCalendarOrClockPicker-root > div .MuiCalendarPicker-root {
+  width: 292px;
+}
+.FormDateRangePickerTooltipPicker .selected-bg {
+  display: none;
+  position: absolute;
+}
+.FormDateRangePickerTooltipPicker .selected-bg.sel {
+  display: block;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: rgba(66, 165, 245, 0.6);
+}
+.FormDateRangePickerTooltipPicker .selected-bg.sel.ui-start, .FormDateRangePickerTooltipPicker .selected-bg.sel.s-start {
+  border-top-left-radius: 50%;
+  border-bottom-left-radius: 50%;
+}
+.FormDateRangePickerTooltipPicker .selected-bg.sel.ui-end, .FormDateRangePickerTooltipPicker .selected-bg.sel.s-end {
+  border-top-right-radius: 50%;
+  border-bottom-right-radius: 50%;
+}
+.FormDateRangePickerTooltipPicker .selected-bg.sel ~ .MuiPickersDay-root {
+  border: 0;
+}
+.FormDateRangePickerTooltipPicker .selected-bg.sel ~ .MuiPickersDay-root:not(:hover):not(:active):not(.Mui-selected) {
+  background-color: transparent;
+}
+.FormDateRangePickerTooltipPicker .focused-bg {
+  display: none;
+  position: absolute;
+}
+.FormDateRangePickerTooltipPicker .focused-bg.focused {
+  display: block;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  border: 2px solid #efefef;
+  border-left: 0;
+  border-right: 0;
+}
+.FormDateRangePickerTooltipPicker .focused-bg.focused.ui-start, .FormDateRangePickerTooltipPicker .focused-bg.focused.f-start {
+  border-left: 2px solid #efefef;
+  border-top-left-radius: 50%;
+  border-bottom-left-radius: 50%;
+}
+.FormDateRangePickerTooltipPicker .focused-bg.focused.ui-end, .FormDateRangePickerTooltipPicker .focused-bg.focused.f-end {
+  border-right: 2px solid #efefef;
+  border-top-right-radius: 50%;
+  border-bottom-right-radius: 50%;
+}
+.FormDateRangePickerTooltipPicker .focused-bg.focused ~ .MuiPickersDay-root:not(:hover):not(:active):not(.Mui-selected) {
+  background-color: transparent;
+}
+
+.PrivateMonthSelect {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  background-color: white;
+}
+.PrivateMonthSelect button {
+  font-size: 15px;
+  font-weight: 400;
+  border-radius: 18px;
+}
+
+.PrivateTimeSelect {
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+}
+.PrivateTimeSelect button {
+  border-radius: 0;
+}
+
+.simplebar-track.simplebar-vertical {
+  width: 8px !important;
+}
+.simplebar-track.simplebar-vertical .simplebar-scrollbar.simplebar-visible:before {
+  opacity: 0.3 !important;
+}