@jubayer11/vue-dynamic-form-builder
Version:
Vue 3 schema-driven dynamic form builder with flexible validation, styling, and real-world use case demos.
2 lines • 50.9 kB
CSS
.dp__input_wrap{position:relative;width:100%;box-sizing:unset}.dp__input_wrap:focus{border-color:var(--dp-border-color-hover);outline:none}.dp__input_valid{box-shadow:0 0 var(--dp-border-radius) var(--dp-success-color);border-color:var(--dp-success-color)}.dp__input_valid:hover{border-color:var(--dp-success-color)}.dp__input_invalid{box-shadow:0 0 var(--dp-border-radius) var(--dp-danger-color);border-color:var(--dp-danger-color)}.dp__input_invalid:hover{border-color:var(--dp-danger-color)}.dp__input{background-color:var(--dp-background-color);border-radius:var(--dp-border-radius);font-family:var(--dp-font-family);border:1px solid var(--dp-border-color);outline:none;transition:border-color .2s cubic-bezier(.645,.045,.355,1);width:100%;font-size:var(--dp-font-size);line-height:calc(var(--dp-font-size)*1.5);padding:var(--dp-input-padding);color:var(--dp-text-color);box-sizing:border-box}.dp__input::placeholder{opacity:.7}.dp__input:hover:not(.dp__input_focus){border-color:var(--dp-border-color-hover)}.dp__input_reg{caret-color:#0000}.dp__input_focus{border-color:var(--dp-border-color-focus)}.dp__disabled{background:var(--dp-disabled-color)}.dp__disabled::placeholder{color:var(--dp-disabled-color-text)}.dp__input_icons{display:inline-block;width:var(--dp-font-size);height:var(--dp-font-size);stroke-width:0;font-size:var(--dp-font-size);line-height:calc(var(--dp-font-size)*1.5);padding:6px 12px;color:var(--dp-icon-color);box-sizing:content-box}.dp__input_icon{cursor:pointer;position:absolute;top:50%;inset-inline-start:0;transform:translateY(-50%);color:var(--dp-icon-color)}.dp--clear-btn{position:absolute;top:50%;inset-inline-end:0;transform:translateY(-50%);cursor:pointer;color:var(--dp-icon-color);background:#0000;border:none;display:inline-flex;align-items:center;padding:0;margin:0}.dp__input_icon_pad{padding-inline-start:var(--dp-input-icon-padding)}.dp__menu{background:var(--dp-background-color);border-radius:var(--dp-border-radius);min-width:var(--dp-menu-min-width);font-family:var(--dp-font-family);font-size:var(--dp-font-size);-webkit-user-select:none;user-select:none;border:1px solid var(--dp-menu-border-color);box-sizing:border-box}.dp__menu:after{box-sizing:border-box}.dp__menu:before{box-sizing:border-box}.dp__menu:focus{border:1px solid var(--dp-menu-border-color);outline:none}.dp--menu-wrapper{position:absolute;z-index:99999}.dp__menu_inner{padding:var(--dp-menu-padding)}.dp--menu--inner-stretched{padding:6px 0}.dp__menu_index{z-index:99999}.dp-menu-loading,.dp__menu_readonly,.dp__menu_disabled{position:absolute;top:0;right:0;bottom:0;left:0;z-index:999999}.dp__menu_disabled{background:#ffffff80;cursor:not-allowed}.dp__menu_readonly{background:#0000;cursor:default}.dp-menu-loading{background:#ffffff80;cursor:default}.dp--menu-load-container{display:flex;height:100%;width:100%;justify-content:center;align-items:center}.dp--menu-loader{width:48px;height:48px;border:var(--dp-loader);border-bottom-color:#0000;border-radius:50%;display:inline-block;box-sizing:border-box;animation:dp-load-rotation 1s linear infinite;position:absolute}@keyframes dp-load-rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dp__arrow_top{left:var(--dp-arrow-left);top:0;height:12px;width:12px;background-color:var(--dp-background-color);position:absolute;border-inline-end:1px solid var(--dp-menu-border-color);border-top:1px solid var(--dp-menu-border-color);transform:translate(-50%,-50%) rotate(-45deg)}.dp__arrow_bottom{left:var(--dp-arrow-left);bottom:0;height:12px;width:12px;background-color:var(--dp-background-color);position:absolute;border-inline-end:1px solid var(--dp-menu-border-color);border-bottom:1px solid var(--dp-menu-border-color);transform:translate(-50%,50%) rotate(45deg)}.dp__action_extra{text-align:center;padding:2px 0}.dp--preset-dates{padding:5px;border-inline-end:1px solid var(--dp-border-color)}.dp--preset-dates[data-dp-mobile],.dp--preset-dates-collapsed{display:flex;align-self:center;border:none;overflow-x:auto;max-width:calc(var(--dp-menu-width) - var(--dp-action-row-padding)*2)}.dp__sidebar_left{padding:5px;border-inline-end:1px solid var(--dp-border-color)}.dp__sidebar_right{padding:5px;margin-inline-end:1px solid var(--dp-border-color)}.dp--preset-range{display:block;width:100%;padding:5px;text-align:left;white-space:nowrap;color:var(--dp-text-color);border-radius:var(--dp-border-radius);transition:var(--dp-common-transition)}.dp--preset-range:hover{background-color:var(--dp-hover-color);color:var(--dp-hover-text-color);cursor:pointer}.dp--preset-range[data-dp-mobile]{border:1px solid var(--dp-border-color);margin:0 3px}.dp--preset-range[data-dp-mobile]:first-child{margin-left:0}.dp--preset-range[data-dp-mobile]:last-child{margin-right:0}.dp--preset-range-collapsed{border:1px solid var(--dp-border-color);margin:0 3px}.dp--preset-range-collapsed:first-child{margin-left:0}.dp--preset-range-collapsed:last-child{margin-right:0}.dp__menu_content_wrapper{display:flex}.dp__menu_content_wrapper[data-dp-mobile],.dp--menu-content-wrapper-collapsed{flex-direction:column-reverse}.dp__calendar_header{position:relative;display:flex;justify-content:center;align-items:center;color:var(--dp-text-color);white-space:nowrap;font-weight:700}.dp__calendar_header_item{text-align:center;flex-grow:1;height:var(--dp-cell-size);padding:var(--dp-cell-padding);width:var(--dp-cell-size);box-sizing:border-box}.dp__calendar_row{display:flex;justify-content:center;align-items:center;margin:var(--dp-row-margin)}.dp__calendar_item{text-align:center;flex-grow:1;box-sizing:border-box;color:var(--dp-text-color)}.dp__calendar{position:relative}.dp__calendar_header_cell{border-bottom:thin solid var(--dp-border-color);padding:var(--dp-calendar-header-cell-padding)}.dp__cell_inner{display:flex;align-items:center;text-align:center;justify-content:center;border-radius:var(--dp-cell-border-radius);height:var(--dp-cell-size);padding:var(--dp-cell-padding);width:var(--dp-cell-size);border:1px solid rgba(0,0,0,0);box-sizing:border-box;position:relative}.dp__cell_inner:hover{transition:all .2s}.dp__cell_auto_range_start,.dp__date_hover_start:hover,.dp__range_start{border-end-end-radius:0;border-start-end-radius:0}.dp__cell_auto_range_end,.dp__date_hover_end:hover,.dp__range_end{border-end-start-radius:0;border-start-start-radius:0}.dp__range_end,.dp__range_start,.dp__active_date{background:var(--dp-primary-color);color:var(--dp-primary-text-color)}.dp__date_hover_end:hover,.dp__date_hover_start:hover,.dp__date_hover:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__cell_offset{color:var(--dp-secondary-color)}.dp__cell_disabled{color:var(--dp-secondary-color);cursor:not-allowed}.dp__range_between{background:var(--dp-range-between-dates-background-color);color:var(--dp-range-between-dates-text-color);border-radius:0;border:1px solid var(--dp-range-between-border-color)}.dp__range_between_week{background:var(--dp-primary-color);color:var(--dp-primary-text-color);border-radius:0;border-top:1px solid var(--dp-primary-color);border-bottom:1px solid var(--dp-primary-color)}.dp__today{border:1px solid var(--dp-primary-color)}.dp__week_num{color:var(--dp-secondary-color);text-align:center}.dp__cell_auto_range{border-radius:0;border-top:1px dashed var(--dp-primary-color);border-bottom:1px dashed var(--dp-primary-color)}.dp__cell_auto_range_start{border-start-start-radius:var(--dp-cell-border-radius);border-end-start-radius:var(--dp-cell-border-radius);border-inline-start:1px dashed var(--dp-primary-color);border-top:1px dashed var(--dp-primary-color);border-bottom:1px dashed var(--dp-primary-color)}.dp__cell_auto_range_end{border-start-end-radius:var(--dp-cell-border-radius);border-end-end-radius:var(--dp-cell-border-radius);border-top:1px dashed var(--dp-primary-color);border-bottom:1px dashed var(--dp-primary-color);border-inline-end:1px dashed var(--dp-primary-color)}.dp__calendar_header_separator{width:100%;height:1px;background:var(--dp-border-color)}.dp__calendar_next{margin-inline-start:var(--dp-multi-calendars-spacing)}.dp__marker_line,.dp__marker_dot{height:5px;background-color:var(--dp-marker-color);position:absolute;bottom:0}.dp__marker_dot{width:5px;border-radius:50%;left:50%;transform:translate(-50%)}.dp__marker_line{width:100%;left:0}.dp__marker_tooltip{position:absolute;border-radius:var(--dp-border-radius);background-color:var(--dp-tooltip-color);padding:5px;border:1px solid var(--dp-border-color);z-index:99999;box-sizing:border-box;cursor:default}.dp__tooltip_content{white-space:nowrap}.dp__tooltip_text{display:flex;align-items:center;flex-flow:row nowrap;color:var(--dp-text-color)}.dp__tooltip_mark{height:5px;width:5px;border-radius:50%;background-color:var(--dp-text-color);color:var(--dp-text-color);margin-inline-end:5px}.dp__arrow_bottom_tp{bottom:0;height:8px;width:8px;background-color:var(--dp-tooltip-color);position:absolute;border-inline-end:1px solid var(--dp-border-color);border-bottom:1px solid var(--dp-border-color);transform:translate(-50%,50%) rotate(45deg)}.dp__instance_calendar{position:relative;width:100%}.dp__flex_display[data-dp-mobile],.dp--flex-display-collapsed{flex-direction:column}.dp__cell_highlight{background-color:var(--dp-highlight-color)}.dp__month_year_row{display:flex;align-items:center;height:var(--dp-month-year-row-height);color:var(--dp-text-color);box-sizing:border-box}.dp__inner_nav{display:flex;align-items:center;justify-content:center;cursor:pointer;height:var(--dp-month-year-row-button-size);width:var(--dp-month-year-row-button-size);color:var(--dp-icon-color);text-align:center;border-radius:50%}.dp__inner_nav svg{height:var(--dp-button-icon-height);width:var(--dp-button-icon-height)}.dp__inner_nav:hover{background:var(--dp-hover-color);color:var(--dp-hover-icon-color)}[dir=rtl] .dp__inner_nav{transform:rotate(180deg)}.dp__inner_nav_disabled:hover,.dp__inner_nav_disabled{background:var(--dp-disabled-color);color:var(--dp-disabled-color-text);cursor:not-allowed}.dp--year-select,.dp__month_year_select{text-align:center;cursor:pointer;height:var(--dp-month-year-row-height);display:flex;align-items:center;justify-content:center;border-radius:var(--dp-border-radius);box-sizing:border-box;color:var(--dp-text-color)}.dp--year-select:hover,.dp__month_year_select:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color);transition:var(--dp-common-transition)}.dp__month_year_select{width:50%}.dp--year-select{width:100%}.dp__month_year_wrap{display:flex;flex-direction:row;width:100%}.dp__year_disable_select{justify-content:space-around}.dp--header-wrap{display:flex;width:100%;flex-direction:column}.dp__overlay{width:100%;background:var(--dp-background-color);transition:opacity 1s ease-out;z-index:99999;font-family:var(--dp-font-family);color:var(--dp-text-color);box-sizing:border-box}.dp--overlay-absolute{position:absolute;height:100%;top:0;left:0}.dp--overlay-relative{position:relative}.dp__overlay_container::-webkit-scrollbar-track{box-shadow:var(--dp-scroll-bar-background);background-color:var(--dp-scroll-bar-background)}.dp__overlay_container::-webkit-scrollbar{width:5px;background-color:var(--dp-scroll-bar-background)}.dp__overlay_container::-webkit-scrollbar-thumb{background-color:var(--dp-scroll-bar-color);border-radius:10px}.dp__overlay:focus{border:none;outline:none}.dp__container_flex{display:flex}.dp__container_block{display:block}.dp__overlay_container{flex-direction:column;overflow-y:auto;height:var(--dp-overlay-height)}.dp__time_picker_overlay_container{height:100%}.dp__overlay_row{padding:0;box-sizing:border-box;display:flex;margin-inline:auto;flex-wrap:wrap;max-width:100%;width:100%;align-items:center}.dp__flex_row{flex:1}.dp__overlay_col{box-sizing:border-box;width:33%;padding:var(--dp-overlay-col-padding);white-space:nowrap}.dp__overlay_cell_pad{padding:var(--dp-common-padding) 0}.dp__overlay_cell_active{cursor:pointer;border-radius:var(--dp-border-radius);text-align:center;background:var(--dp-primary-color);color:var(--dp-primary-text-color)}.dp__overlay_cell{cursor:pointer;border-radius:var(--dp-border-radius);text-align:center}.dp__overlay_cell:hover{background:var(--dp-hover-color);color:var(--dp-hover-text-color);transition:var(--dp-common-transition)}.dp__cell_in_between{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__over_action_scroll{right:5px;box-sizing:border-box}.dp__overlay_cell_disabled{cursor:not-allowed;background:var(--dp-disabled-color)}.dp__overlay_cell_disabled:hover{background:var(--dp-disabled-color)}.dp__overlay_cell_active_disabled{cursor:not-allowed;background:var(--dp-primary-disabled-color)}.dp__overlay_cell_active_disabled:hover{background:var(--dp-primary-disabled-color)}.dp__btn,.dp--qr-btn,.dp--time-overlay-btn,.dp--time-invalid{border:none;font:inherit;transition:var(--dp-common-transition);line-height:normal}.dp--year-mode-picker{display:flex;width:100%;align-items:center;justify-content:space-between;height:var(--dp-cell-size)}.dp--tp-wrap{max-width:var(--dp-menu-min-width)}.dp--tp-wrap[data-dp-mobile]{max-width:100%}.dp__time_input{width:100%;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;font-family:var(--dp-font-family);color:var(--dp-text-color)}.dp__time_col_reg_block{padding:0 20px}.dp__time_col_reg_inline{padding:0 10px}.dp__time_col_reg_with_button{padding:0 15px}.dp__time_col_reg_with_button[data-compact~=true]{padding:0 5px}.dp__time_col_sec{padding:0 10px}.dp__time_col_sec_with_button{padding:0 5px}.dp__time_col_sec_with_button[data-collapsed~=true]{padding:0}.dp__time_col{text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column}.dp__time_col_block{font-size:var(--dp-time-font-size)}.dp__time_display_block{padding:0 3px}.dp__time_display_inline{padding:5px}.dp__time_picker_inline_container{display:flex;width:100%;justify-content:center}.dp__inc_dec_button{padding:5px;margin:0;height:var(--dp-time-inc-dec-button-size);width:var(--dp-time-inc-dec-button-size);display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:50%;color:var(--dp-icon-color);box-sizing:border-box}.dp__inc_dec_button svg{height:var(--dp-time-inc-dec-button-size);width:var(--dp-time-inc-dec-button-size)}.dp__inc_dec_button:hover{background:var(--dp-hover-color);color:var(--dp-primary-color)}.dp__time_display{cursor:pointer;color:var(--dp-text-color);border-radius:var(--dp-border-radius);display:flex;align-items:center;justify-content:center}.dp__time_display:hover:enabled{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}.dp__inc_dec_button_inline{width:100%;padding:0;height:8px;cursor:pointer;display:flex;align-items:center}.dp__inc_dec_button_disabled,.dp__inc_dec_button_disabled:hover{background:var(--dp-disabled-color);color:var(--dp-disabled-color-text);cursor:not-allowed}.dp__pm_am_button{background:var(--dp-primary-color);color:var(--dp-primary-text-color);border:none;padding:var(--dp-common-padding);border-radius:var(--dp-border-radius);cursor:pointer}.dp__pm_am_button[data-compact~=true]{padding:7px}.dp__tp_inline_btn_bar{width:100%;height:4px;background-color:var(--dp-secondary-color);transition:var(--dp-common-transition);border-collapse:collapse}.dp__tp_inline_btn_top:hover .dp__tp_btn_in_r{background-color:var(--dp-primary-color);transform:rotate(12deg) scale(1.15) translateY(-2px)}.dp__tp_inline_btn_top:hover .dp__tp_btn_in_l,.dp__tp_inline_btn_bottom:hover .dp__tp_btn_in_r{background-color:var(--dp-primary-color);transform:rotate(-12deg) scale(1.15) translateY(-2px)}.dp__tp_inline_btn_bottom:hover .dp__tp_btn_in_l{background-color:var(--dp-primary-color);transform:rotate(12deg) scale(1.15) translateY(-2px)}.dp--time-overlay-btn{background:none}.dp--time-invalid{background-color:var(--dp-disabled-color)}.dp__action_row{display:flex;align-items:center;width:100%;padding:var(--dp-action-row-padding);box-sizing:border-box;color:var(--dp-text-color);flex-flow:row nowrap}.dp__action_row svg{height:var(--dp-button-icon-height);width:auto}.dp__selection_preview{display:block;color:var(--dp-text-color);font-size:var(--dp-preview-font-size);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dp__action_buttons{display:flex;flex:0;white-space:nowrap;align-items:center;justify-content:flex-end;margin-inline-start:auto}.dp__action_button{display:inline-flex;align-items:center;background:#0000;border:1px solid rgba(0,0,0,0);padding:var(--dp-action-buttons-padding);line-height:var(--dp-action-button-height);margin-inline-start:3px;height:var(--dp-action-button-height);cursor:pointer;border-radius:var(--dp-border-radius);font-size:var(--dp-preview-font-size);font-family:var(--dp-font-family)}.dp__action_cancel{color:var(--dp-text-color);border:1px solid var(--dp-border-color)}.dp__action_cancel:hover{border-color:var(--dp-primary-color);transition:var(--dp-action-row-transtion)}.dp__action_buttons .dp__action_select{background:var(--dp-primary-color);color:var(--dp-primary-text-color)}.dp__action_buttons .dp__action_select:hover{background:var(--dp-primary-color);transition:var(--dp-action-row-transtion)}.dp__action_buttons .dp__action_select:disabled{background:var(--dp-primary-disabled-color);cursor:not-allowed}.dp-quarter-picker-wrap{display:flex;flex-direction:column;height:100%;min-width:var(--dp-menu-min-width)}.dp--qr-btn-disabled{cursor:not-allowed;background:var(--dp-disabled-color)}.dp--qr-btn-disabled:hover{background:var(--dp-disabled-color)}.dp--qr-btn{width:100%;padding:var(--dp-common-padding)}.dp--qr-btn:not(.dp--highlighted,.dp--qr-btn-active,.dp--qr-btn-disabled,.dp--qr-btn-between){background:none}.dp--qr-btn:hover:not(.dp--qr-btn-active,.dp--qr-btn-disabled){background:var(--dp-hover-color);color:var(--dp-hover-text-color);transition:var(--dp-common-transition)}.dp--quarter-items{display:flex;flex-direction:column;flex:1;width:100%;height:100%;justify-content:space-evenly}.dp--qr-btn-active{background:var(--dp-primary-color);color:var(--dp-primary-text-color)}.dp--qr-btn-between{background:var(--dp-hover-color);color:var(--dp-hover-text-color)}:root{--dp-common-transition: all .1s ease-in;--dp-menu-padding: 6px 8px;--dp-animation-duration: .1s;--dp-menu-appear-transition-timing: cubic-bezier(.4, 0, 1, 1);--dp-transition-timing: ease-out;--dp-action-row-transtion: all .2s ease-in;--dp-font-family: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;--dp-border-radius: 4px;--dp-cell-border-radius: 4px;--dp-transition-length: 22px;--dp-transition-timing-general: .1s;--dp-button-height: 35px;--dp-month-year-row-height: 35px;--dp-month-year-row-button-size: 25px;--dp-button-icon-height: 20px;--dp-calendar-wrap-padding: 0 5px;--dp-cell-size: 35px;--dp-cell-padding: 5px;--dp-common-padding: 10px;--dp-input-icon-padding: 35px;--dp-input-padding: 6px 30px 6px 12px;--dp-menu-min-width: 260px;--dp-action-buttons-padding: 1px 6px;--dp-row-margin: 5px 0;--dp-calendar-header-cell-padding: .5rem;--dp-multi-calendars-spacing: 10px;--dp-overlay-col-padding: 3px;--dp-time-inc-dec-button-size: 32px;--dp-font-size: 1rem;--dp-preview-font-size: .8rem;--dp-time-font-size: 2rem;--dp-action-button-height: 22px;--dp-action-row-padding: 8px;--dp-direction: ltr}.dp__theme_dark{--dp-background-color: #212121;--dp-text-color: #fff;--dp-hover-color: #484848;--dp-hover-text-color: #fff;--dp-hover-icon-color: #959595;--dp-primary-color: #005cb2;--dp-primary-disabled-color: #61a8ea;--dp-primary-text-color: #fff;--dp-secondary-color: #a9a9a9;--dp-border-color: #2d2d2d;--dp-menu-border-color: #2d2d2d;--dp-border-color-hover: #aaaeb7;--dp-border-color-focus: #aaaeb7;--dp-disabled-color: #737373;--dp-disabled-color-text: #d0d0d0;--dp-scroll-bar-background: #212121;--dp-scroll-bar-color: #484848;--dp-success-color: #00701a;--dp-success-color-disabled: #428f59;--dp-icon-color: #959595;--dp-danger-color: #e53935;--dp-marker-color: #e53935;--dp-tooltip-color: #3e3e3e;--dp-highlight-color: rgb(0 92 178 / 20%);--dp-range-between-dates-background-color: var(--dp-hover-color, #484848);--dp-range-between-dates-text-color: var(--dp-hover-text-color, #fff);--dp-range-between-border-color: var(--dp-hover-color, #fff);--dp-loader: 5px solid #005cb2}.dp__theme_light{--dp-background-color: #fff;--dp-text-color: #212121;--dp-hover-color: #f3f3f3;--dp-hover-text-color: #212121;--dp-hover-icon-color: #959595;--dp-primary-color: #1976d2;--dp-primary-disabled-color: #6bacea;--dp-primary-text-color: #fff;--dp-secondary-color: #c0c4cc;--dp-border-color: #ddd;--dp-menu-border-color: #ddd;--dp-border-color-hover: #aaaeb7;--dp-border-color-focus: #aaaeb7;--dp-disabled-color: #f6f6f6;--dp-scroll-bar-background: #f3f3f3;--dp-scroll-bar-color: #959595;--dp-success-color: #76d275;--dp-success-color-disabled: #a3d9b1;--dp-icon-color: #959595;--dp-danger-color: #ff6f60;--dp-marker-color: #ff6f60;--dp-tooltip-color: #fafafa;--dp-disabled-color-text: #8e8e8e;--dp-highlight-color: rgb(25 118 210 / 10%);--dp-range-between-dates-background-color: var(--dp-hover-color, #f3f3f3);--dp-range-between-dates-text-color: var(--dp-hover-text-color, #212121);--dp-range-between-border-color: var(--dp-hover-color, #f3f3f3);--dp-loader: 5px solid #1976d2}.dp__flex{display:flex;align-items:center}.dp__btn{background:none}.dp__main{font-family:var(--dp-font-family);-webkit-user-select:none;user-select:none;box-sizing:border-box;position:relative;width:100%}.dp__main *{direction:var(--dp-direction, ltr)}.dp__pointer{cursor:pointer}.dp__icon{stroke:currentcolor;fill:currentcolor}.dp__button{width:100%;text-align:center;color:var(--dp-icon-color);cursor:pointer;display:flex;align-items:center;place-content:center center;padding:var(--dp-common-padding);box-sizing:border-box;height:var(--dp-button-height)}.dp__button.dp__overlay_action{position:absolute;bottom:0}.dp__button:hover{background:var(--dp-hover-color);color:var(--dp-hover-icon-color)}.dp__button svg{height:var(--dp-button-icon-height);width:auto}.dp__button_bottom{border-bottom-left-radius:var(--dp-border-radius);border-bottom-right-radius:var(--dp-border-radius)}.dp__flex_display{display:flex}.dp__flex_display_with_input{flex-direction:column;align-items:flex-start}.dp__relative{position:relative}.calendar-next-enter-active,.calendar-next-leave-active,.calendar-prev-enter-active,.calendar-prev-leave-active{transition:all var(--dp-transition-timing-general) ease-out}.calendar-next-enter-from{opacity:0;transform:translate(var(--dp-transition-length))}.calendar-next-leave-to,.calendar-prev-enter-from{opacity:0;transform:translate(calc(var(--dp-transition-length) * -1))}.calendar-prev-leave-to{opacity:0;transform:translate(var(--dp-transition-length))}.dp-menu-appear-bottom-enter-active,.dp-menu-appear-bottom-leave-active,.dp-menu-appear-top-enter-active,.dp-menu-appear-top-leave-active,.dp-slide-up-enter-active,.dp-slide-up-leave-active,.dp-slide-down-enter-active,.dp-slide-down-leave-active{transition:all var(--dp-animation-duration) var(--dp-transition-timing)}.dp-menu-appear-top-enter-from,.dp-menu-appear-top-leave-to,.dp-slide-down-leave-to,.dp-slide-up-enter-from{opacity:0;transform:translateY(var(--dp-transition-length))}.dp-menu-appear-bottom-enter-from,.dp-menu-appear-bottom-leave-to,.dp-slide-down-enter-from,.dp-slide-up-leave-to{opacity:0;transform:translateY(calc(var(--dp-transition-length) * -1))}.dp--arrow-btn-nav{transition:var(--dp-common-transition)}.dp--highlighted{background-color:var(--dp-highlight-color)}.dp--hidden-el{visibility:hidden}input[type=radio].custom-radio[data-v-9ab70f6d]{-moz-appearance:none;appearance:none;-webkit-appearance:none;box-sizing:border-box;background:#fff;border:2px solid #3b82f6;border-radius:50%;width:20px;height:20px;cursor:pointer;transition:border .2s;display:inline-block;vertical-align:middle;position:relative}input[type=radio].custom-radio[data-v-9ab70f6d]:checked{background:#3b82f6;border-color:#2563eb}input[type=radio].custom-radio[data-v-9ab70f6d]:checked:after{content:"";display:block;position:absolute;left:50%;top:50%;width:10px;height:10px;background:#fff;border-radius:50%;transform:translate(-50%,-50%)}input[type=radio].custom-radio[data-v-9ab70f6d]:focus{outline:2px solid #2563eb;outline-offset:2px;box-shadow:0 0 0 3px #60a5fa33}.multiselect__dropdown-list[data-v-ec32f3d7]{max-height:12em;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#2F80ED #E2E8F0}.multiselect__dropdown-list[data-v-ec32f3d7]::-webkit-scrollbar{width:3px}.multiselect__dropdown-list[data-v-ec32f3d7]::-webkit-scrollbar-thumb{background-color:#2f80ed}.multiselect__dropdown-list[data-v-ec32f3d7]::-webkit-scrollbar-track{background-color:#e2e8f0}.slide-enter[data-v-ec32f3d7]{opacity:0}.slide-enter-active[data-v-ec32f3d7]{animation:slide-in-ec32f3d7 .1s ease-out forwards;transition:opacity .1s}.slide-leave-active[data-v-ec32f3d7]{animation:slide-out-ec32f3d7 .1s ease-out forwards;transition:opacity .1s;opacity:0}@keyframes slide-in-ec32f3d7{0%{transform:translateY(10px)}to{transform:translateY(0)}}@keyframes slide-out-ec32f3d7{0%{transform:translateY(0)}to{transform:translateY(10px)}}.demo-card[data-v-a9a7940b]{background:#fff;border-radius:14px;padding:2.5em 2em 2em;max-width:38em;min-width:320px;margin:3em auto;box-shadow:0 2px 14px #0000001f;display:flex;flex-direction:column;align-items:stretch}.demo-title[data-v-a9a7940b]{font-size:2em;font-weight:700;margin-bottom:.3em;color:#135cb0;letter-spacing:1px}.demo-toggle-btn[data-v-a9a7940b]{background:#ef4444;color:#fff;border:none;font-size:1rem;padding:.5em 1.2em;border-radius:6px;margin-bottom:1.5em;cursor:pointer;font-weight:500;transition:background .2s}.demo-toggle-btn[data-v-a9a7940b]:hover{background:#b91c1c}.demo-desc[data-v-a9a7940b]{font-size:1em;color:#555;margin-bottom:1.2em}.demo-json[data-v-a9a7940b]{margin-top:2em;background:#fafafa;border-radius:8px;font-size:.95em;padding:1em 1.5em;color:#233;box-shadow:0 1px 4px #00000008}.demo-json h3[data-v-a9a7940b]{font-size:1.15em;color:#2686e2;font-weight:500;margin-bottom:.4em}.demo-card[data-v-8c42e2e9]{background:#fff;border-radius:14px;padding:2.5em 2em 2em;max-width:38em;min-width:320px;margin:3em auto;box-shadow:0 2px 14px #0000001f;display:flex;flex-direction:column;align-items:stretch}.demo-title[data-v-8c42e2e9]{font-size:2em;font-weight:700;margin-bottom:.3em;color:#135cb0;letter-spacing:1px}.demo-desc[data-v-8c42e2e9]{font-size:1em;color:#555;margin-bottom:1.2em}.demo-json[data-v-8c42e2e9]{margin-top:2em;background:#fafafa;border-radius:8px;font-size:.95em;padding:1em 1.5em;color:#233;box-shadow:0 1px 4px #00000008}.demo-json h3[data-v-8c42e2e9]{font-size:1.15em;color:#2686e2;font-weight:500;margin-bottom:.4em}.demo-card[data-v-d2119d29]{background:#fff;border-radius:14px;padding:2.5em 2em 2em;max-width:38em;min-width:320px;margin:3em auto;box-shadow:0 2px 14px #0000001f;display:flex;flex-direction:column;align-items:stretch}.demo-title[data-v-d2119d29]{font-size:2em;font-weight:700;margin-bottom:.3em;color:#135cb0;letter-spacing:1px}.demo-desc[data-v-d2119d29]{font-size:1em;color:#555;margin-bottom:1.2em}.manual-actions[data-v-d2119d29]{display:flex;justify-content:center;gap:1em;margin:1em 0 .5em}.action-btn[data-v-d2119d29]{padding:.65em 2.2em;border-radius:6px;border:none;font-size:1.13em;font-weight:600;cursor:pointer;transition:background .17s}.submit-btn[data-v-d2119d29]{background:#2686e2;color:#fff}.submit-btn[data-v-d2119d29]:hover{background:#135cb0}.reset-btn[data-v-d2119d29]{background:#eaeaea;color:#135cb0}.reset-btn[data-v-d2119d29]:hover{background:#ddd}.demo-json[data-v-d2119d29]{margin-top:2em;background:#fafafa;border-radius:8px;font-size:.95em;padding:1em 1.5em;color:#233;box-shadow:0 1px 4px #00000008}.demo-json h3[data-v-d2119d29]{font-size:1.15em;color:#2686e2;font-weight:500;margin-bottom:.4em}.dfutils__label_right{text-align:right!important}.dfutils__label_green{color:#299956!important}.dfutils__label_orange{color:#f70!important}.dfutils__bg_lightblue{background:#f0f7fd!important}.dfutils__bg_yellow{background:#fffbe6!important}.dfutils__border_blue{border:2px solid #53a2ec!important}.dfutils__border_orange{border:2px solid #ff7700!important}.dfutils__rounded_lg{border-radius:1em!important}.dfutils__font_big{font-size:1.13em!important}.dfutils__focus_ring_blue:focus,.dfutils__focus_ring_blue:focus-visible{box-shadow:0 0 0 2px #53a2ec!important;border-color:#53a2ec!important}.dfutils__focus_ring_green:focus,.dfutils__focus_ring_green:focus-visible{box-shadow:0 0 0 2px #27ae60!important;border-color:#27ae60!important}.dfutils__focus_ring_orange:focus,.dfutils__focus_ring_orange:focus-visible{box-shadow:0 0 0 2px #ff9800!important;border-color:#ff9800!important}.dfutils__focus_ring_red:focus,.dfutils__focus_ring_red:focus-visible{box-shadow:0 0 0 2px #e02a2a!important;border-color:#e02a2a!important}.dfutils__error_red_shadow{color:#d62e2e!important;border-radius:.4em;padding:.4em .9em!important;font-weight:600}.my-dropdown-bg-blue{background:#d8ecff!important}.my-dropdown-option-white{color:#444!important}.my-dropdown-option-active{background:#53a2ec!important;color:#fff!important}.my-dropdown-bg-red{background:#8b0000!important}.my-dropdown-item{color:#ff0!important}.my-dropdown-option:hover{background:#53a2ec!important;color:#fff!important}.my-dropdown-input{background:#006400!important;color:#fff!important}.dfutils__select_dropdown_custom{max-height:12em;overflow-y:auto;border:2px solid #ff7700!important;border-radius:.5em!important;box-shadow:0 2px 8px #ffe7c2}.dfutils__tag_purple{background:#a385e0!important;color:#fff!important}.dfutils__tag_remove_big{font-size:1.3em!important;color:#fff!important}.dfutils__icon_icon{height:1.5em!important;width:1.5em!important;color:#e02a2a!important}.dfutils__icon_icon{height:1.5em!important;width:1.5em!important;color:#0ba5c0!important}.dfutils__icon_path1,.dfutils__icon_path2{fill:#2ae0d1!important}.dfutils__submit_green{background:#2dcc7a!important;color:#fff!important;border:none!important;font-size:1.15em;border-radius:.5em;font-weight:700;transition:background .2s}.dfutils__submit_green:hover{background:#24a662!important}.dfutils__submit_green:focus{background:#24a662!important}.my-bio-field-class{background:#fff6da!important;color:#895c00!important;border:2px dashed #ffc300!important;min-height:5em;border-radius:.7em;font-family:monospace;font-size:1.13em;padding:1.2em 1.5em!important}.rainbow-dropdown-bg{background:linear-gradient(90deg,#ff3e3e,#ffb347,#ffff5e,#53e453,#53a2ec,#b388ff);border:2px solid #fff;padding:.5em;border-radius:1em}.rainbow-dropdown-item{color:#fff!important;font-weight:700!important;text-shadow:0 2px 6px rgba(50,50,50,.18);padding:.8em 1.1em;border-radius:.6em;transition:background .2s;cursor:pointer}.rainbow-dropdown-item:hover{background:#0000001c}.rainbow-dropdown-selected{background:#fff!important;color:#222!important;font-size:1.15em;box-shadow:0 0 8px 2px #ffb34777,0 0 .2em #ff3e3e66;transform:scale(1.05);transition:background .12s,color .12s,transform .12s}.demo-card[data-v-06629417]{background:#fff;border-radius:14px;padding:2.5em 2em 2em;max-width:38em;min-width:320px;margin:3em auto;box-shadow:0 2px 14px #0000001f;display:flex;flex-direction:column;align-items:stretch}.demo-title[data-v-06629417]{font-size:2em;font-weight:700;margin-bottom:.3em;color:#135cb0;letter-spacing:1px}.demo-desc[data-v-06629417]{font-size:1em;color:#555;margin-bottom:1.2em}.demo-json[data-v-06629417]{margin-top:2em;background:#fafafa;border-radius:8px;font-size:.95em;padding:1em 1.5em;color:#233;box-shadow:0 1px 4px #00000008}.demo-json h3[data-v-06629417]{font-size:1.15em;color:#2686e2;font-weight:500;margin-bottom:.4em}.popup-trigger-btn[data-v-c3c65e7e]{background:#3272dc;color:#fff;border:none;padding:.8em 2em;font-size:1.1em;border-radius:.5em;cursor:pointer;margin-bottom:1.7em;transition:background .2s}.popup-trigger-btn[data-v-c3c65e7e]:hover{background:#225299}.modal-overlay[data-v-c3c65e7e]{position:fixed;z-index:90;top:0;right:0;bottom:0;left:0;background:#1020305e;display:flex;justify-content:center;align-items:center;animation:fadeIn-c3c65e7e .12s}@keyframes fadeIn-c3c65e7e{0%{opacity:0}to{opacity:1}}.modal-content[data-v-c3c65e7e]{background:#fff;border-radius:1.1em;box-shadow:0 6px 24px #162e4c3b;width:98vw;max-width:400px;min-width:320px;padding:1.2em 1.7em 1.5em;position:relative;outline:none;display:flex;flex-direction:column;gap:.2em}.modal-header[data-v-c3c65e7e]{display:flex;justify-content:space-between;align-items:center;margin-bottom:.7em}.modal-header h2[data-v-c3c65e7e]{font-size:1.35em;color:#15457a;font-weight:700}.modal-close-btn[data-v-c3c65e7e]{background:none;border:none;font-size:2em;color:#666;cursor:pointer;margin-left:1em;transition:color .15s}.modal-close-btn[data-v-c3c65e7e]:hover{color:#e85151}.modal-body[data-v-c3c65e7e]{margin-bottom:1.3em}.modal-footer[data-v-c3c65e7e]{display:flex;justify-content:flex-end;gap:1em;margin-top:.2em}.modal-cancel-btn[data-v-c3c65e7e],.modal-submit-btn[data-v-c3c65e7e]{font-size:1.05em;border:none;border-radius:.5em;padding:.6em 1.5em;cursor:pointer;transition:background .18s}.modal-cancel-btn[data-v-c3c65e7e]{background:#ebeff3;color:#466}.modal-cancel-btn[data-v-c3c65e7e]:hover{background:#e1e1e1}.modal-submit-btn[data-v-c3c65e7e]{background:#18bb89;color:#fff;font-weight:600}.modal-submit-btn[data-v-c3c65e7e]:hover{background:#149e71}.fade-enter-active[data-v-c3c65e7e],.fade-leave-active[data-v-c3c65e7e]{transition:opacity .12s}.fade-enter-from[data-v-c3c65e7e],.fade-leave-to[data-v-c3c65e7e]{opacity:0}.demo-card[data-v-1722b19a]{background:#fff;border-radius:14px;padding:2.5em 2em 2em;max-width:38em;min-width:320px;margin:3em auto;box-shadow:0 2px 14px #0000001f;display:flex;flex-direction:column;align-items:stretch}.demo-title[data-v-1722b19a]{font-size:2em;font-weight:700;margin-bottom:.3em;color:#135cb0;letter-spacing:1px}.demo-desc[data-v-1722b19a]{font-size:1em;color:#555;margin-bottom:1.2em}.demo-json[data-v-1722b19a]{margin-top:2em;background:#fafafa;border-radius:8px;font-size:.95em;padding:1em 1.5em;color:#233;box-shadow:0 1px 4px #00000008}.demo-json h3[data-v-1722b19a]{font-size:1.15em;color:#2686e2;font-weight:500;margin-bottom:.4em}.form-footer[data-v-1722b19a]{margin-top:2em;display:flex;justify-content:flex-end}.form-submit-btn[data-v-1722b19a]{background:#18bb89;color:#fff;font-size:1.05em;font-weight:600;border:none;padding:.7em 1.8em;border-radius:.5em;cursor:pointer;transition:background .2s}.form-submit-btn[data-v-1722b19a]:hover{background:#149e71}.dfdemo__toc[data-v-9dd29637]{background:#f0f4f8;border:1px solid #d1d5db;border-radius:10px;padding:1.2em;margin:2em 0 2.5em;box-shadow:0 2px 8px #1e1e3c0f}.dfdemo__toc ul[data-v-9dd29637]{list-style:none;padding:0;margin:0}.dfdemo__toc li[data-v-9dd29637]{margin-bottom:.7em}.dfdemo__toc a[data-v-9dd29637]{color:#2563eb;text-decoration:none;font-size:1.05em;font-weight:500;transition:color .2s ease,text-decoration .2s ease}.dfdemo__toc a[data-v-9dd29637]:hover{color:#1d4ed8;text-decoration:underline}.dfdemo__section-title[data-v-9dd29637]{font-size:1.45em;color:#334155;margin-top:1.8em;margin-bottom:.3em;font-weight:600}.dfdemo__section-desc[data-v-9dd29637]{color:#6b7280;font-size:1.05em;margin-bottom:1.5em;line-height:1.65}.dfdemo__section-desc code[data-v-9dd29637]{background:#f3f4f6;padding:.1em .4em;border-radius:6px;font-size:.95em;font-family:Menlo,Monaco,Consolas,Courier New,monospace;color:#374151}.dfdemo__section-desc strong[data-v-9dd29637]{color:#111827;font-weight:600}@media (max-width: 640px){.dfdemo__section-title[data-v-9dd29637]{font-size:1.2em}.dfdemo__section-desc[data-v-9dd29637],.dfdemo__toc a[data-v-9dd29637]{font-size:1em}}html{scroll-behavior:smooth}html,body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}.dfdemo__container[data-v-fde6d27a]{max-width:850px;margin:0 auto;padding:2.5em 1em;background:#f7fafc;border-radius:18px;box-shadow:0 6px 30px #1e286e12;min-height:100vh}.dfdemo__header[data-v-fde6d27a]{text-align:center;margin-bottom:2.5em}.dfdemo__header h1[data-v-fde6d27a]{font-size:2.4em;font-weight:700;color:#2563eb;margin-bottom:.5em;letter-spacing:-.01em}.dfdemo__subtitle[data-v-fde6d27a]{font-size:1.2em;color:#4b5563}.dfdemo__subtitle small[data-v-fde6d27a]{display:block;font-size:.95em;margin-top:.5em;color:#64748b}.dfdemo__author[data-v-fde6d27a]{color:#2563eb;text-decoration:none}.dfdemo__author[data-v-fde6d27a]:hover{text-decoration:underline}.dfdemo__toc[data-v-fde6d27a]{background:#f0f4f8;border:1px solid #d1d5db;border-radius:10px;padding:1.2em;margin-bottom:2.5em;box-shadow:0 2px 8px #1e1e3c0f}.dfdemo__toc ul[data-v-fde6d27a]{list-style:none;padding:0;margin:0}.dfdemo__toc li[data-v-fde6d27a]{margin-bottom:.7em}.dfdemo__toc a[data-v-fde6d27a]{color:#2563eb;text-decoration:none;font-size:1.1em;font-weight:500;transition:color .2s,text-decoration .2s}.dfdemo__toc a[data-v-fde6d27a]:hover{color:#1d4ed8;text-decoration:underline}.dfdemo__main[data-v-fde6d27a]{display:flex;flex-direction:column;gap:3em}.dfdemo__section[data-v-fde6d27a]{background:#fff;border-radius:12px;box-shadow:0 1px 8px #1e1e3c17;padding:1.8em 1.2em 2.2em}.dfdemo__section-title[data-v-fde6d27a]{font-size:1.5em;color:#334155;margin-bottom:.3em;font-weight:600}.dfdemo__section-desc[data-v-fde6d27a]{color:#6b7280;font-size:1.05em;margin-bottom:1.2em;line-height:1.6em}.dfdemo__footer[data-v-fde6d27a]{margin-top:4em;padding-top:2em;border-top:1px solid #e5e7eb;text-align:center}.dfdemo__branding[data-v-fde6d27a]{color:#64748b;font-size:.95em;animation:fadeIn-fde6d27a 1s ease-out}.dfdemo__branding strong[data-v-fde6d27a]{color:#2563eb;font-weight:600}.dfdemo__branding span[data-v-fde6d27a]{margin:0 .4em;color:#9ca3af}.dfdemo__branding small[data-v-fde6d27a]{display:block;margin-top:.3em;font-size:.85em}@keyframes fadeIn-fde6d27a{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 640px){.dfdemo__container[data-v-fde6d27a]{padding:1em .6em}.dfdemo__section[data-v-fde6d27a]{padding:1em .4em 1.4em}.dfdemo__header h1[data-v-fde6d27a]{font-size:1.7em}.dfdemo__section-title[data-v-fde6d27a]{font-size:1.2em}.dfdemo__subtitle[data-v-fde6d27a]{font-size:1em}}*,*:before,*:after{box-sizing:border-box}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:16px;color:#111;background-color:#fff}input,select,textarea{color:#111;background-color:#fff;border:1px solid #ccc;border-radius:6px;padding:.5rem;font-size:1rem;outline:none}input:focus,select:focus,textarea:focus{border-color:#2563eb;box-shadow:0 0 0 1px #2563eb}.dp__input,.dp__menu{color:#111;background-color:#fff}label{font-weight:500;margin-bottom:.25rem;display:inline-block;color:#111}input:disabled,select:disabled,textarea:disabled{background-color:#f3f4f6;color:#9ca3af;cursor:not-allowed}.textField__default{margin-bottom:1.25rem}.textField__label{display:block;margin-bottom:.25rem;font-weight:600;color:#111}.textField__error{color:#dc2626;font-size:.875rem;margin-top:.25rem}.textField__default__mainDiv{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:center;align-items:center;width:100%;gap:.5em}.textField__default__field__mainDiv{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:center;align-items:center;width:100%;flex-grow:1;flex-shrink:1;column-gap:.5em}.textField__default__field__wrapper,.textField__default__field__container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%}.textField__default__field__container__label{width:100%;font-size:1.2em;color:#2f80ed;text-align:left;margin-bottom:.2em}.textField__default__field__container__label__mandatory{font-size:1.5em;color:#ef4444}.textField__default__field__container__fieldAndError__wrapper{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%}.textField__default__field__container__fieldAndError__field{background-color:#f3f4f6;border:1px solid #CBD5E0;color:#4a5568;border-radius:.375em;outline:none;width:100%;height:100%;padding:.5em}.textField__default__field__container__fieldAndError__field:focus,.textField__default__field__container__fieldAndError__field:focus-visible{outline:none;box-shadow:0 0 0 2px #2f80ed}.textField__default__field__container__fieldAndError__fieldAndIcon__wrapper{position:relative;display:flex;align-items:center;width:100%}.textField__default__field__container__fieldAndError__fieldAndIcon__fieldWithIcon{padding-left:2.5em}.textField__default__field__container__fieldAndError__radioField__wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%;padding:.5em .7em}.textField__default__field__container__fieldAndError__radioField__container{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%;padding-right:.5em}.textField__default__field__container__fieldAndError__radioField__input{width:.8em;height:.8em;margin-right:.3em;cursor:pointer}.textField__default__field__container__fieldAndError__radioField__label{color:#1c2332;font-size:1em;cursor:pointer}.textField__default__field__container__fieldAndError__select__wrapper{position:relative;display:inline-block;width:100%}.textField__default__field__container__fieldAndError__select__field{background-color:#f6f6f6;border:1px solid #CBD5E0;border-radius:.375em;outline:none;width:100%;height:100%;padding:.5em;cursor:pointer;box-sizing:border-box}.textField__default__field__container__fieldAndError__select__field:focus,.textField__default__field__container__fieldAndError__select__field:focus-visible{outline:none;box-shadow:0 0 0 2px #2f80ed}.textField__default__field__container__fieldAndError__select__labelAndIcon__wrapper{display:flex;justify-content:space-between;align-items:center}.textField__default__field__container__fieldAndError__select__labelAndIcon__label{color:#2f80ed}.textField__default__field__container__fieldAndError__select__labelAndIcon__icon__icon{height:1.5em;width:1.5em}.textField__default__field__container__fieldAndError__select__labelAndIcon__icon__path{stroke:#2f80ed!important}.textField__default__field__container__fieldAndError__select__dropdown__wrapper{position:absolute;background-color:#fff;display:flex;flex-direction:column;padding:.2em;width:100%;border:1px solid #2563EB;border-radius:.375rem;top:100%;left:0;margin-top:.25em;z-index:1000;color:#4a5568}.textField__default__field__container__fieldAndError__select__dropdown__input{background-color:#f3f4f6;border:1px solid #CBD5E0;color:#4a5568;outline:none;width:100%;padding:.7em;border-radius:.375em;margin-bottom:.5em}.textField__default__field__container__fieldAndError__select__dropdown__list{list-style:none;margin:0;padding:0;max-height:200px;overflow-y:scroll;scroll-snap-type:y mandatory}.textField__default__field__container__fieldAndError__select__dropdown__list::-webkit-scrollbar{width:8px}.textField__default__field__container__fieldAndError__select__dropdown__list::-webkit-scrollbar-thumb{background-color:#2f80ed;border-radius:4px}.textField__default__field__container__fieldAndError__select__dropdown__list::-webkit-scrollbar-thumb:hover{background-color:#2f80ed}.textField__default__field__container__fieldAndError__select__dropdown__list::-webkit-scrollbar-track{background-color:#f3f4f6}.textField__default__field__container__fieldAndError__select__dropdown__item{padding:.5em 1em;cursor:pointer;transition:background-color .2s;border-radius:4px}.textField__default__field__container__fieldAndError__select__dropdown__item:hover{outline:none;background-color:#2563eb;color:#1c2332}.textField__default__field__container__fieldAndError__select__dropdown__item__selected{font-weight:600;background-color:#2563eb;color:#fff}.textField__default__field__container__fieldAndError__multiSelect__mainWrapper{width:100%;position:relative}.textField__default__field__container__fieldAndError__multiSelect__field{background-color:#f3f4f6;border:1px solid #CBD5E0;color:#4a5568;border-radius:.375em;outline:none;width:100%;min-height:2.5em;padding:.7em;cursor:pointer;transition:border .2s}.textField__default__field__container__fieldAndError__multiSelect__field:focus,.textField__default__field__container__fieldAndError__multiSelect__field:focus-visible{outline:none;box-shadow:0 0 0 2px #2f80ed;border-color:#2f80ed}.textField__default__field__container__fieldAndError__multiSelect__labelAndIcon__wrapper{display:flex;align-items:center;justify-content:space-between;width:100%;gap:.5em;flex-wrap:wrap}.textField__default__field__container__fieldAndError__multiSelect__labelAndIcon__label{color:#2f80ed;opacity:.75;font-size:1em;flex:1 1 auto}.textField__default__field__container__fieldAndError__multiSelect__labelAndIcon__icon__icon{height:1.5em;width:1.5em}.textField__default__field__container__fieldAndError__multiSelect__labelAndIcon__icon__path{stroke:#2f80ed!important}.textField__default__field__container__fieldAndError__multiSelect__tag__view{display:flex;flex-wrap:wrap;align-items:center;gap:.25em;width:100%}.textField__default__field__container__fieldAndError__multiSelect__tag__view__wrapper{display:flex;flex-wrap:wrap;align-items:center;gap:.25em}.textField__default__field__container__fieldAndError__multiSelect__tag__view__container{display:flex;align-items:center;background-color:#2f80ed;color:#fff;border-radius:.375em;padding:.3em .75em;margin-right:.25em}.textField__default__field__container__fieldAndError__multiSelect__tag__view__value{font-size:1em;margin-right:.4em}.textField__default__field__container__fieldAndError__multiSelect__tag__view__remove__container{cursor:pointer;border:2px solid #FFFFFF;color:#fff;padding:.1em .5em;border-radius:9999px;font-size:1em;font-weight:700}.textField__default__field__container__fieldAndError__multiSelect__tag__view__remove__value{font-weight:700;font-size:1em}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__wrapper{position:absolute;left:0;top:calc(100% + .25em);width:100%;z-index:100;background:#fff;border:1px solid #CBD5E0;border-radius:.375em;box-shadow:0 4px 8px #0000000a;padding:.5em;max-height:12em;overflow-y:auto}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__input{width:100%;padding:.5em;border-radius:.375em;border:1px solid #CBD5E0;background:#f3f4f6;color:#4a5568;margin-bottom:.4em}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__container{display:flex;align-items:center;padding:.35em .2em;cursor:pointer;border-radius:.2em;color:#4a5568}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__container:hover{background:#2563eb;color:#fff}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__container__box{min-width:1.2em;min-height:1.2em;background:#fff;border:1px solid #CBD5E0;border-radius:.2em;margin-right:.4em}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__container__icon__icon{height:1.5em;width:1.5em}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__container__icon__path1{fill:#2f80ed}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__container__icon__path2{stroke:#d0d0e0}.textField__default__field__container__fieldAndError__multiSelect__tag__dropdown__container__item{font-size:1em}.textField__default__field__container__fieldAndError__error__wrapper{width:100%;text-align:center;font-size:1em}.textField__default__field__container__fieldAndError__error__message{color:#dc2626}.textField__default__field__insetIcon__wrapper{position:absolute;left:.75em;top:50%;transform:translateY(-50%);pointer-events:none;z-index:50}.textField__default__field__insetIcon__icon{height:1.5em;width:1.5em}.textField__default__field__insetIcon__path1,.textField__default__field__insetIcon__path2{fill:#2f80ed!important}.textField__default__field__insetIcon__stroke1,.textField__default__field__insetIcon__stroke2{stroke:#2f80ed!important}.textField__default__submit__wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%;padding:.5em 0}.textField__default__submit__button{width:100%;min-width:8em;max-width:16em;font-size:1.2em;background-color:#2f80ed;color:#f5f5f5;padding:.75em 0;font-weight:700;border:.2em solid #2F80ED;border-radius:.375em;transition:background .2s,color .2s;cursor:pointer;text-align:center}.textField__default__submit__button:hover,.textField__default__submit__button:focus{background-color:#146de5;color:#f5f5f5;outline:none}@media (min-width: 640px){.textField__default__submit__button{width:auto;min-width:10em;max-width:100%;padding:.75em 2.5em;margin-left:auto;margin-right:auto;display:block}}.textField__default__error{border:1px solid #DC2626!important;box-shadow:none!important}.textField__default__error:focus,.textField__default__error:focus-visible{outline:none;box-shadow:0 0 0 1px #dc2626!important}.textField__password__field__container{display:flex;justify-content:center;width:100%}.textField__password__field__show{background-color:green;color:#fff;border:1px solid #008000;border-radius:5px;display:flex;justify-content:center;padding:.6em .3em;min-width:4em;text-transform:uppercase;font-size:.8em;cursor:pointer;font-weight:700;margin-left:-.3em}.icon__default__icon{height:1.5em;width:1.5em}.icon__default__icon__path1,.icon__default__icon__path2{fill:#0049b7!important;stroke:#0049b7!important}.icon__default__icon__stroke1,.icon__default__icon__stroke2{stroke:#0049b7!important}.dfutils__row{display:flex;flex-direction:row;flex-wrap:wrap;column-gap:1em!important}.dfutils__half{width:calc(50% - 1em)}.dfutils__w_full{width:100%!important}.dfutils__label_right{text-align:right}.dfutils__text_center{text-align:center}.dfutils__p_sm{padding:.5em!important}.dfutils__p_lg{padding:1.5em!important}.dfutils__input_transparent{background:transparent!important;border:none!important}.dfutils__mt_lg{margin-top:1.5em!important}.dfutils__mb_lg{margin-bottom:1.5em!important}.dfutils__hidden{display:none!important}.dfutils__label_bold{font-weight:700!important}.dfutils__py_sm{padding-top:.6em!important;padding-bottom:.6em!important}.dfutils__py_md{padding-top:1em!important;padding-bottom:1em!important}.dfutils__py_lg{padding-top:1.4em!important;padding-bottom:1.4em!important}.dfutils__px_sm{padding-left:.9em!important;padding-right:.9em!important}.dfutils__px_md{padding-left:1.3em!important;padding-right:1.3em!important}.dfutils__px_lg{padding-left:1.8em!important;padding-right:1.8em!important}.dfutils__p_sm{padding:.6em .9em!important}.dfutils__p_md{padding:1em 1.3em!important}.dfutils__p_lg{padding:1.4em 1.8em!important}@media (max-width: 640px){.dfutils__half,.dfutils__w_full{width:100%!important}}