@vchasno/ui-kit 0.4.104 → 0.4.106
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +32 -0
- package/dist/components/Datepicker/DateRangePicker/DateRangePicker.d.ts +15 -1
- package/dist/components/Datepicker/DateRangePicker/DateRangePicker.js +1 -1
- package/dist/components/Datepicker/DateRangePicker/DateRangePicker.js.map +1 -1
- package/dist/components/Datepicker/DateRangePicker/DateRangePicker.reducer.js +1 -1
- package/dist/components/Datepicker/DateRangePicker/DateRangePicker.reducer.js.map +1 -1
- package/dist/components/Datepicker/DateRangePicker/utils.js +2 -0
- package/dist/components/Datepicker/DateRangePicker/utils.js.map +1 -0
- package/dist/components/Pagination/BasePagination.d.ts +10 -0
- package/dist/components/Pagination/BasePagination.js +1 -1
- package/dist/components/Pagination/BasePagination.js.map +1 -1
- package/dist/components/Pagination/Pagination.d.ts +4 -0
- package/dist/components/Pagination/Pagination.js +1 -1
- package/dist/components/Pagination/Pagination.js.map +1 -1
- package/dist/css/vchasno-ui.css +2 -2
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,38 @@ All notable changes to this project will be documented in this file.
|
|
|
5
5
|
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
6
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
7
|
|
|
8
|
+
## [0.4.106] - 2026-06-23
|
|
9
|
+
|
|
10
|
+
### Added
|
|
11
|
+
|
|
12
|
+
- **Pagination** — gap buttons now open a page picker popover with optional search for large hidden page ranges
|
|
13
|
+
|
|
14
|
+
### Changed
|
|
15
|
+
|
|
16
|
+
- **Pagination** — single-page gaps navigate directly to the hidden page instead of opening the picker
|
|
17
|
+
- **Pagination** — deprecated `gapStep`, `onPrevGapClick`, and `onNextGapClick`; gap buttons no longer jump by a fixed step
|
|
18
|
+
|
|
19
|
+
## [0.4.105] - 2026-06-11
|
|
20
|
+
|
|
21
|
+
### Added
|
|
22
|
+
|
|
23
|
+
- **DateRangePicker** — manual range typing through a masked input: both dates can be typed directly (`react-text-mask`, mask derived from `dateFormat`) with round-trip validation (rejects overflow like `32/13/2025`), `minDate`/`maxDate` bounds, and `Enter` to commit a fully valid range
|
|
24
|
+
- **DateRangePicker** — add `mask?` prop to override the input mask (defaults to a mask derived from `dateFormat`)
|
|
25
|
+
- **DateRangePicker** — add `endDefaultsToToday?: boolean` — when only a start date is entered/selected, Save auto-fills the end with the current moment (`new Date()`), clamped down to `maxDate`; a reversed-range guard leaves the tuple untouched when the start is in the future
|
|
26
|
+
- **DateRangePicker** — preset label display: when the committed range exactly matches a named preset, the input shows the preset's label (e.g. "За весь час") instead of the raw dates via a non-interactive overlay; opening the calendar restores the editable masked dates
|
|
27
|
+
|
|
28
|
+
### Changed
|
|
29
|
+
|
|
30
|
+
- **DateRangePicker** — deduplicated the input commit logic: a single `commitRange` helper now owns the `applyEndFallback → onChange → onConfirm → close` sequence (previously duplicated between Save and the Enter handler), and a shared `parseBounds` object replaces the repeated `parseRange` options; the capture-phase Enter interception is documented in place (why: `react-datepicker` clones `customInput` with its own `onKeyDown` that would reset the range to `[start, null]`)
|
|
31
|
+
- **DateRangePicker** — `parseRange` now splits the typed text on the spaced range separator (`' - '`) instead of a bare `-`, so `-`-separated date formats like `yyyy-MM-dd` parse correctly
|
|
32
|
+
- **DateRangePicker** — documented in the `presets` prop JSDoc and stories that preset labels must be ttag-wrapped in consuming products (ui-kit receives ready-made strings; ttag is not a ui-kit dependency)
|
|
33
|
+
|
|
34
|
+
### Fixed
|
|
35
|
+
|
|
36
|
+
- **DateRangePicker** — clicking the input while the calendar is open no longer wipes an in-progress (unsaved) selection — `handleOpen` re-seeds the temporary range from committed props only on the first open, keeping the temporary state as the source of truth while the calendar stays open
|
|
37
|
+
- **DateRangePicker** — the floating label no longer overlaps the start date after picking a preset: the label now floats whenever the input shows a value (including the unsaved temporary range), not only on focus or a committed value — previously the un-floated label covered the start (e.g. hid `01/01/2000` in «За весь час»), and it only appeared after clicking back into the input
|
|
38
|
+
- **DateRangePicker** — clicking the input to edit an unsaved range no longer clears it: `react-datepicker`'s `onClickOutside` fired even for clicks on the picker's own input (it tracks `open` internally while we drive it via the `open` prop), cancelling and reopening from the empty committed props; `onClickOutside` now ignores clicks inside the wrapper, so the click just places the caret. The input also shows a text caret instead of a pointer cursor to signal it is editable
|
|
39
|
+
|
|
8
40
|
## [0.4.104] - 2026-05-12
|
|
9
41
|
|
|
10
42
|
### Changed
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ReactDatePickerProps } from 'react-datepicker';
|
|
3
|
+
import { MaskedInputProps } from 'react-text-mask';
|
|
3
4
|
import Select from '../../Select/Select.js';
|
|
4
5
|
import { LoadingFeedback, WithHint, ErrorFeedback, DataQa, HideEmptyMeta, WithPulseAnimation } from '../../types.js';
|
|
5
6
|
|
|
6
|
-
type ControlledReactDatePickerProps = 'selectsRange' | 'selectsMultiple' | 'startDate' | 'endDate' | 'onChange' | 'value' | 'open' | 'onInputClick' | 'onClickOutside' | 'monthsShown' | 'shouldCloseOnSelect' | 'renderCustomHeader' | 'children';
|
|
7
|
+
type ControlledReactDatePickerProps = 'selectsRange' | 'selectsMultiple' | 'startDate' | 'endDate' | 'onChange' | 'value' | 'open' | 'onInputClick' | 'onClickOutside' | 'monthsShown' | 'shouldCloseOnSelect' | 'renderCustomHeader' | 'children' | 'onChangeRaw' | 'customInput';
|
|
7
8
|
interface DateRangePickerProps extends Omit<ReactDatePickerProps<true>, ControlledReactDatePickerProps>, Partial<LoadingFeedback & WithHint & ErrorFeedback & DataQa & HideEmptyMeta & WithPulseAnimation> {
|
|
8
9
|
startDate: Date | null;
|
|
9
10
|
endDate: Date | null;
|
|
@@ -12,16 +13,29 @@ interface DateRangePickerProps extends Omit<ReactDatePickerProps<true>, Controll
|
|
|
12
13
|
wide?: boolean;
|
|
13
14
|
cancelLabel?: string;
|
|
14
15
|
saveLabel?: string;
|
|
16
|
+
/**
|
|
17
|
+
* перелік іменованих діапазонів для швидкого вибору.
|
|
18
|
+
* У продуктових проєктах підписи слід обгортати через ttag (наприклад t`Сьогодні`),
|
|
19
|
+
* щоб вони потрапили до перекладу — ui-kit отримує вже готові рядки.
|
|
20
|
+
*/
|
|
15
21
|
presets?: {
|
|
16
22
|
label: string;
|
|
17
23
|
range: [Date, Date];
|
|
18
24
|
}[];
|
|
19
25
|
presetPlaceholder?: string;
|
|
20
26
|
presetSelectProps?: Omit<React.ComponentProps<typeof Select>, 'options' | 'onChange' | 'value'>;
|
|
27
|
+
/**
|
|
28
|
+
* якщо обрано або введено лише дату початку, при збереженні автоматично підставляє
|
|
29
|
+
* поточний момент (точний `new Date()` із часом, без нормалізації до кінця дня) як
|
|
30
|
+
* дату завершення. Для цілодобових діапазонів нормалізуйте кінець у власному onChange.
|
|
31
|
+
*/
|
|
32
|
+
endDefaultsToToday?: boolean;
|
|
21
33
|
/** викликається при скасуванні вибору */
|
|
22
34
|
onCancel?: () => void;
|
|
23
35
|
/** викликається при підтвердженні вибору */
|
|
24
36
|
onConfirm?: (dates: [Date | null, Date | null]) => void;
|
|
37
|
+
/** маска для ручного вводу діапазону (типово виводиться з dateFormat) */
|
|
38
|
+
mask?: MaskedInputProps['mask'];
|
|
25
39
|
disabled?: ReactDatePickerProps<true>['disabled'];
|
|
26
40
|
required?: ReactDatePickerProps<true>['required'];
|
|
27
41
|
isClearable?: ReactDatePickerProps<true>['isClearable'];
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"react";import
|
|
1
|
+
import e from"react";import t from"react-datepicker";import a from"react-text-mask";import n from"classnames";import{format as r,subMonths as l}from"date-fns";import{uk as c}from"date-fns/locale/uk";import i from"../../../icons/arrowLeft.js";import o from"../../../icons/arrowRight.js";import s from"../../../icons/calendar.js";import p from"../../../icons/clear.js";import m from"../../InputMeta/InputMeta.js";import u from"../../LabelText/LabelText.js";import d from"../../Select/Select.js";import"../../Select/SelectCreatable.js";import"react-select/async";import"react-select";import g from"../../Spinner/Spinner.js";import{pickerReducer as y,initialState as h}from"./DateRangePicker.reducer.js";import{buildRangeMask as k,formatRange as v,matchPresetLabel as _,parseRange as f,applyEndFallback as b}from"./utils.js";let E=()=>e.createElement("span",{className:"vchasno-ui-date-range-picker__custom-close-icon"},p),N=({startDate:p,endDate:N,onChange:C,label:D,disabled:w,required:x,loading:j,hint:T,error:S,className:L,dateFormat:M="dd/MM/yyyy",dataQa:R,hideEmptyMeta:I=!1,wide:A=!1,endDefaultsToToday:P=!1,pulse:H,isClearable:O=!1,minDate:q,maxDate:K,popperClassName:z,portalId:B,cancelLabel:F="Скасувати",saveLabel:G="Зберегти",locale:J=c,presets:Q=[],presetPlaceholder:U="Обрати період",presetSelectProps:V,onCancel:W,onConfirm:X,mask:Y,...Z})=>{var $,ee;let[et,ea]=e.useReducer(y,h),{isOpen:en,tempStartDate:er,tempEndDate:el,selectedPreset:ec,calendarKey:ei,inputText:eo}=et,es=e.useRef(null),ep=(Array.isArray(M)?M[0]:M)??"dd/MM/yyyy",em=Y??k(ep),eu={minDate:q,maxDate:K,allowStartOnly:P},ed=v(p,N,ep),eg=_(p,N,Q),ey=(e,t)=>{let[a,n]=b(e,t,P,new Date,K);C([a,n]),X?.([a,n]),ea({type:"close"})},eh=()=>{W?.(),ea({type:"cancel",startDate:p,endDate:N,inputText:ed})},ek=!!p||!!N,ev=!en&&null!==eg&&ek,e_=en?eo:ed;return e.createElement("label",{onClick:e=>e.preventDefault(),"data-qa":R,className:n("vchasno-ui-date-picker","vchasno-ui-date-range-picker",{"--loading":j,"--required":x,"--disabled":w,"--error":S,"--wide":A,"--not-empty":ek,"--filled":!!e_,"--preset-label":ev,"--is-label":!!D},L),onKeyDown:e=>{"Escape"===e.key&&en&&eh()},onKeyDownCapture:e=>{if("Enter"!==e.key)return;let t=e.target;if(!t.matches?.(".react-datepicker__input-container input"))return;e.preventDefault(),e.stopPropagation();let a=f(eo,ep,eu);a&&"empty"!==a&&ey(a.start,a.end)}},e.createElement("span",{ref:es,className:n("vchasno-ui-date-range-picker__wrapper",{"vchasno-ui-pulse-animation":H&&!w})},D&&e.createElement(u,null,D),e.createElement(t,{key:ei,openToDate:($=en?er:p,(ee=en?el:N)?l(ee,1):$||new Date),fixedHeight:!0,locale:J,disabled:w,placeholderText:"ДД/ММ/РРРР - ДД/ММ/РРРР",showPopperArrow:!1,className:n("vchasno-ui-date-range-picker__picker","vchasno-ui-date-picker__picker"),popperClassName:n("vchasno-ui-date-range-picker-popper",z),selectsRange:!0,startDate:en?er:p,endDate:en?el:N,onChange:e=>{let[t,a]=e;ea({type:"tempChange",start:t,end:a,inputText:v(t,a,ep)})},monthsShown:2,shouldCloseOnSelect:!1,open:en,onInputClick:()=>{w||en||ea({type:"open",startDate:p,endDate:N,inputText:ed})},onClickOutside:e=>{let t=e.target;t instanceof Node&&es.current?.contains(t)||eh()},enableTabLoop:!1,minDate:q,maxDate:K,portalId:B,value:e_,onChangeRaw:e=>{if(!(e.target instanceof HTMLInputElement))return;e.preventDefault();let t=e.target.value;ea({type:"typeChange",inputText:t,parsed:f(t,ep,eu)})},customInput:e.createElement(a,{inputMode:"numeric",mask:em,guide:!0}),renderCustomHeader:({monthDate:t,decreaseMonth:a,increaseMonth:n,prevMonthButtonDisabled:l,nextMonthButtonDisabled:c})=>e.createElement("div",{className:"vchasno-ui-date-range-picker__header"},e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__nav-btn",onClick:a,disabled:l},e.createElement(i,null)),e.createElement("span",{className:"vchasno-ui-date-range-picker__month-title"},r(t,"LLLL, yyyy",{locale:"string"==typeof J?void 0:J})),e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__nav-btn",onClick:n,disabled:c},e.createElement(o,null))),...Z},e.createElement("div",{className:"vchasno-ui-date-range-picker__presets"},Q.length>0&&e.createElement(d,{className:"vchasno-ui-date-range-picker__preset-select",isClearable:!0,options:Q.map(e=>({label:e.label,value:e.label})),value:ec,placeholder:U,onChange:e=>{let t=Array.isArray(e)?null:e;if(!t){ea({type:"reset"});return}let a=Q.find(e=>e.label===t.value);a&&ea({type:"presetSelect",option:t,start:a.range[0],end:a.range[1],inputText:v(a.range[0],a.range[1],ep)})},hideEmptyMeta:!0,wide:!0,...V})),e.createElement("div",{className:"vchasno-ui-date-range-picker__actions"},e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__cancel-btn",onClick:eh},F),e.createElement("button",{type:"button",className:"vchasno-ui-date-range-picker__save-btn",onClick:()=>{ey(er,el)}},G))),ev&&e.createElement("span",{className:"vchasno-ui-date-range-picker__preset-label","aria-hidden":"true"},eg),j?e.createElement(g,{className:"vchasno-ui-date-range-picker__spinner"}):e.createElement(s,{className:"vchasno-ui-date-range-picker__custom-calendar-icon"}),O&&ek&&!w&&e.createElement("button",{type:"button","aria-label":"Очистити",className:"vchasno-ui-date-range-picker__clear-btn",onClick:()=>{C([null,null]),ea({type:"reset"})}},e.createElement(E,null))),!I||S||T?e.createElement(m,{hint:T,error:S}):null)};N.displayName="DateRangePicker";export{N as default};
|
|
2
2
|
//# sourceMappingURL=DateRangePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangePicker.js","sources":["../../../../src/components/Datepicker/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["import React from 'react';\nimport type { ReactDatePickerProps } from 'react-datepicker';\nimport ReactDatePicker from 'react-datepicker';\n\nimport cn from 'classnames';\nimport { format, subMonths } from 'date-fns';\nimport { uk } from 'date-fns/locale/uk';\n\nimport ArrowLeftIcon from '../../../icons/arrowLeft';\nimport ArrowRightIcon from '../../../icons/arrowRight';\nimport CalendarIcon from '../../../icons/calendar';\nimport clearRawSvg from '../../../icons/clear';\nimport InputMeta from '../../InputMeta';\nimport LabelText from '../../LabelText';\nimport Select from '../../Select';\nimport type { SelectOption } from '../../Select';\nimport Spinner from '../../Spinner';\nimport type {\n DataQa,\n ErrorFeedback,\n HideEmptyMeta,\n LoadingFeedback,\n WithHint,\n WithPulseAnimation,\n} from '../../types';\nimport { initialState, pickerReducer } from './DateRangePicker.reducer';\n\nimport '../DatePicker.global.css';\nimport './DateRangePicker.global.css';\n\nconst CloseSvg = () => (\n <span className=\"vchasno-ui-date-range-picker__custom-close-icon\">{clearRawSvg}</span>\n);\n\ntype ControlledReactDatePickerProps =\n | 'selectsRange'\n | 'selectsMultiple'\n | 'startDate'\n | 'endDate'\n | 'onChange'\n | 'value'\n | 'open'\n | 'onInputClick'\n | 'onClickOutside'\n | 'monthsShown'\n | 'shouldCloseOnSelect'\n | 'renderCustomHeader'\n | 'children';\n\nexport interface DateRangePickerProps\n extends Omit<ReactDatePickerProps<true>, ControlledReactDatePickerProps>,\n Partial<\n LoadingFeedback & WithHint & ErrorFeedback & DataQa & HideEmptyMeta & WithPulseAnimation\n > {\n // Required controlled props (range-mode contract)\n startDate: Date | null;\n endDate: Date | null;\n onChange: (dates: [Date | null, Date | null]) => void;\n\n // UI-kit additions\n label?: string;\n wide?: boolean;\n cancelLabel?: string;\n saveLabel?: string;\n presets?: { label: string; range: [Date, Date] }[];\n presetPlaceholder?: string;\n presetSelectProps?: Omit<React.ComponentProps<typeof Select>, 'options' | 'onChange' | 'value'>;\n\n /** викликається при скасуванні вибору */\n onCancel?: () => void;\n /** викликається при підтвердженні вибору */\n onConfirm?: (dates: [Date | null, Date | null]) => void;\n\n // Explicit re-declarations for Storybook Controls visibility\n // (types inherited from ReactDatePickerProps<true> via indexed access — zero drift)\n disabled?: ReactDatePickerProps<true>['disabled'];\n required?: ReactDatePickerProps<true>['required'];\n isClearable?: ReactDatePickerProps<true>['isClearable'];\n minDate?: ReactDatePickerProps<true>['minDate'];\n maxDate?: ReactDatePickerProps<true>['maxDate'];\n dateFormat?: ReactDatePickerProps<true>['dateFormat'];\n className?: ReactDatePickerProps<true>['className'];\n popperClassName?: ReactDatePickerProps<true>['popperClassName'];\n portalId?: ReactDatePickerProps<true>['portalId'];\n locale?: ReactDatePickerProps<true>['locale'];\n}\n\nconst DateRangePicker: React.FC<DateRangePickerProps> = ({\n startDate,\n endDate,\n onChange,\n label,\n disabled,\n required,\n loading,\n hint,\n error,\n className,\n dateFormat = 'dd/MM/yyyy',\n dataQa,\n hideEmptyMeta = false,\n wide = false,\n pulse,\n isClearable = false,\n minDate,\n maxDate,\n popperClassName,\n portalId,\n cancelLabel = 'Скасувати',\n saveLabel = 'Зберегти',\n locale = uk,\n presets = [],\n presetPlaceholder = 'Обрати період',\n presetSelectProps,\n onCancel,\n onConfirm,\n ...props\n}) => {\n const [state, dispatch] = React.useReducer(pickerReducer, initialState);\n const { isOpen, tempStartDate, tempEndDate, selectedPreset, calendarKey } = state;\n\n const resolveOpenToDate = (start: Date | null, end: Date | null): Date => {\n if (end) return subMonths(end, 1);\n if (start) return start;\n return new Date();\n };\n\n const handleOpen = () => {\n if (disabled) return;\n dispatch({ type: 'open', startDate, endDate });\n };\n\n const handleTempChange = (dates: [Date | null, Date | null]) => {\n const [start, end] = dates;\n dispatch({ type: 'tempChange', start, end });\n };\n\n const handleSave = () => {\n onChange([tempStartDate, tempEndDate]);\n onConfirm?.([tempStartDate, tempEndDate]);\n dispatch({ type: 'close' });\n };\n\n const handleCancel = () => {\n onCancel?.();\n dispatch({ type: 'cancel', startDate, endDate });\n };\n\n const handleClear = () => {\n onChange([null, null]);\n dispatch({ type: 'reset' });\n };\n\n const handlePresetChange = (newValue: SelectOption | readonly SelectOption[] | null) => {\n const option = Array.isArray(newValue) ? null : (newValue as SelectOption | null);\n if (!option) {\n dispatch({ type: 'reset' });\n return;\n }\n const preset = presets.find((p) => p.label === option.value);\n if (preset) {\n dispatch({\n type: 'presetSelect',\n option,\n start: preset.range[0],\n end: preset.range[1],\n });\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape' && isOpen) {\n handleCancel();\n }\n };\n\n const formatDisplayValue = (): string => {\n if (!startDate && !endDate) return '';\n const displayFormat = Array.isArray(dateFormat) ? dateFormat[0] : dateFormat;\n if (!displayFormat) return '';\n const startStr = startDate ? format(startDate, displayFormat) : '';\n const endStr = endDate ? format(endDate, displayFormat) : '';\n if (startStr && endStr) return `${startStr} - ${endStr}`;\n if (startStr) return startStr;\n return '';\n };\n\n const displayValue = formatDisplayValue();\n const valueExists = !!startDate || !!endDate;\n\n return (\n <label\n onClick={(e) => e.preventDefault()}\n data-qa={dataQa}\n className={cn(\n 'vchasno-ui-date-picker',\n 'vchasno-ui-date-range-picker',\n {\n '--loading': loading,\n '--required': required,\n '--disabled': disabled,\n '--error': error,\n '--wide': wide,\n '--not-empty': valueExists,\n '--is-label': !!label,\n },\n className,\n )}\n onKeyDown={handleKeyDown}\n >\n <span\n className={cn('vchasno-ui-date-range-picker__wrapper', {\n 'vchasno-ui-pulse-animation': pulse && !disabled,\n })}\n >\n {label && <LabelText>{label}</LabelText>}\n <ReactDatePicker\n key={calendarKey}\n openToDate={resolveOpenToDate(\n isOpen ? tempStartDate : startDate,\n isOpen ? tempEndDate : endDate,\n )}\n fixedHeight\n locale={locale}\n disabled={disabled}\n placeholderText=\"ДД/ММ/РРРР - ДД/ММ/РРРР\"\n showPopperArrow={false}\n className={cn(\n 'vchasno-ui-date-range-picker__picker',\n 'vchasno-ui-date-picker__picker',\n )}\n popperClassName={cn('vchasno-ui-date-range-picker-popper', popperClassName)}\n selectsRange\n startDate={isOpen ? tempStartDate : startDate}\n endDate={isOpen ? tempEndDate : endDate}\n onChange={handleTempChange}\n monthsShown={2}\n shouldCloseOnSelect={false}\n open={isOpen}\n onInputClick={handleOpen}\n onClickOutside={handleCancel}\n enableTabLoop={false}\n minDate={minDate}\n maxDate={maxDate}\n portalId={portalId}\n value={displayValue}\n renderCustomHeader={({\n monthDate,\n decreaseMonth,\n increaseMonth,\n prevMonthButtonDisabled,\n nextMonthButtonDisabled,\n }) => (\n <div className=\"vchasno-ui-date-range-picker__header\">\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__nav-btn\"\n onClick={decreaseMonth}\n disabled={prevMonthButtonDisabled}\n >\n <ArrowLeftIcon />\n </button>\n <span className=\"vchasno-ui-date-range-picker__month-title\">\n {format(monthDate, 'LLLL, yyyy', {\n locale: typeof locale === 'string' ? undefined : locale,\n })}\n </span>\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__nav-btn\"\n onClick={increaseMonth}\n disabled={nextMonthButtonDisabled}\n >\n <ArrowRightIcon />\n </button>\n </div>\n )}\n {...props}\n >\n <div className=\"vchasno-ui-date-range-picker__presets\">\n {presets.length > 0 && (\n <Select\n className=\"vchasno-ui-date-range-picker__preset-select\"\n isClearable\n options={presets.map((p) => ({\n label: p.label,\n value: p.label,\n }))}\n value={selectedPreset}\n placeholder={presetPlaceholder}\n onChange={handlePresetChange}\n hideEmptyMeta\n wide\n {...presetSelectProps}\n />\n )}\n </div>\n\n <div className=\"vchasno-ui-date-range-picker__actions\">\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__cancel-btn\"\n onClick={handleCancel}\n >\n {cancelLabel}\n </button>\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__save-btn\"\n onClick={handleSave}\n >\n {saveLabel}\n </button>\n </div>\n </ReactDatePicker>\n {loading ? (\n <Spinner className=\"vchasno-ui-date-range-picker__spinner\" />\n ) : (\n <CalendarIcon className=\"vchasno-ui-date-range-picker__custom-calendar-icon\" />\n )}\n {isClearable && valueExists && !disabled && (\n <button\n type=\"button\"\n aria-label=\"Очистити\"\n className=\"vchasno-ui-date-range-picker__clear-btn\"\n onClick={handleClear}\n >\n <CloseSvg />\n </button>\n )}\n </span>\n {hideEmptyMeta && !error && !hint ? null : <InputMeta hint={hint} error={error} />}\n </label>\n );\n};\n\nDateRangePicker.displayName = 'DateRangePicker';\n\nexport default DateRangePicker;\n"],"names":["CloseSvg","React","span","className","clearRawSvg","DateRangePicker","startDate","endDate","onChange","label","disabled","required","loading","hint","error","dateFormat","dataQa","hideEmptyMeta","wide","pulse","isClearable","minDate","maxDate","popperClassName","portalId","cancelLabel","saveLabel","locale","uk","presets","presetPlaceholder","presetSelectProps","onCancel","onConfirm","props","start","end","state","dispatch","useReducer","pickerReducer","initialState","isOpen","tempStartDate","tempEndDate","selectedPreset","calendarKey","handleCancel","type","displayValue","formatDisplayValue","displayFormat","Array","isArray","startStr","format","endStr","valueExists","onClick","e","preventDefault","data-qa","cn","onKeyDown","key","createElement","LabelText","ReactDatePicker","openToDate","subMonths","Date","fixedHeight","placeholderText","showPopperArrow","selectsRange","dates","monthsShown","shouldCloseOnSelect","open","onInputClick","onClickOutside","enableTabLoop","value","renderCustomHeader","monthDate","decreaseMonth","increaseMonth","prevMonthButtonDisabled","nextMonthButtonDisabled","div","button","ArrowLeftIcon","undefined","ArrowRightIcon","length","Select","options","map","p","placeholder","newValue","option","preset","find","range","Spinner","CalendarIcon","aria-label","InputMeta","displayName"],"mappings":"6pBA8BA,IAAMA,EAAW,IACbC,EAACC,aAAAA,CAAAA,OAAAA,CAAKC,UAAU,iDAAmDC,EAAAA,GAwDjEC,EAAkD,CAAC,CACrDC,UAAAA,CAAS,CACTC,QAAAA,CAAO,CACPC,SAAAA,CAAQ,CACRC,MAAAA,CAAK,CACLC,SAAAA,CAAQ,CACRC,SAAAA,CAAQ,CACRC,QAAAA,CAAO,CACPC,KAAAA,CAAI,CACJC,MAAAA,CAAK,CACLX,UAAAA,CAAS,CACTY,WAAAA,EAAa,YAAY,CACzBC,OAAAA,CAAM,CACNC,cAAAA,EAAgB,CAAA,CAAK,CACrBC,KAAAA,EAAO,CAAA,CAAK,CACZC,MAAAA,CAAK,CACLC,YAAAA,EAAc,CAAA,CAAK,CACnBC,QAAAA,CAAO,CACPC,QAAAA,CAAO,CACPC,gBAAAA,CAAe,CACfC,SAAAA,CAAQ,CACRC,YAAAA,EAAc,WAAW,CACzBC,UAAAA,EAAY,UAAU,CACtBC,OAAAA,EAASC,CAAE,CACXC,QAAAA,EAAU,EAAE,CACZC,kBAAAA,EAAoB,eAAe,CACnCC,kBAAAA,CAAiB,CACjBC,SAAAA,CAAQ,CACRC,UAAAA,CAAS,CACT,GAAGC,EACN,QAI8BC,EAAoBC,EAH/C,GAAM,CAACC,EAAOC,EAAS,CAAGrC,EAAMsC,UAAU,CAACC,EAAeC,GACpD,CAAEC,OAAAA,CAAM,CAAEC,cAAAA,CAAa,CAAEC,YAAAA,CAAW,CAAEC,eAAAA,CAAc,CAAEC,YAAAA,CAAW,CAAE,CAAGT,EAwBtEU,GAAe,KACjBf,MACAM,EAAS,CAAEU,KAAM,SAAU1C,UAAAA,EAAWC,QAAAA,CAAQ,EAClD,EAyCM0C,GAAeC,AAXM,CAAA,KACvB,GAAI,CAAC5C,GAAa,CAACC,EAAS,MAAO,GACnC,IAAM4C,EAAgBC,MAAMC,OAAO,CAACtC,GAAcA,CAAU,CAAC,EAAE,CAAGA,EAClE,GAAI,CAACoC,EAAe,MAAO,GAC3B,IAAMG,EAAWhD,EAAYiD,EAAOjD,EAAW6C,GAAiB,GAC1DK,EAASjD,EAAUgD,EAAOhD,EAAS4C,GAAiB,UAC1D,AAAIG,GAAYE,EAAe,GAAGF,EAAS,GAAG,EAAEE,EAAQ,CAAA,CACpDF,GACG,EACX,CAAA,IAGMG,GAAc,CAAC,CAACnD,GAAa,CAAC,CAACC,EAErC,OACIN,EAACQ,aAAAA,CAAAA,QAAAA,CACGiD,QAAS,AAACC,GAAMA,EAAEC,cAAc,GAChCC,UAAS7C,EACTb,UAAW2D,EACP,yBACA,+BACA,CACI,YAAalD,EACb,aAAcD,EACd,aAAcD,EACd,UAAWI,EACX,SAAUI,EACV,cAAeuC,GACf,aAAc,CAAC,CAAChD,CAEpBN,EAAAA,GAEJ4D,UAtCc,AAACJ,IACL,WAAVA,EAAEK,GAAG,EAAiBtB,GACtBK,IAER,GAoCQ9C,EAACC,aAAAA,CAAAA,OAAAA,CACGC,UAAW2D,EAAG,wCAAyC,CACnD,6BAA8B3C,GAAS,CAACT,CAC5C,IAECD,GAASR,EAAAgE,aAAA,CAACC,EAAWzD,KAAAA,GACtBR,EAACkE,aAAAA,CAAAA,EAAAA,CACGH,IAAKlB,EACLsB,UAAAA,EAjGWjC,EAkGPO,EAASC,EAAgBrC,EAjGzC,CAD2C8B,EAmG3BM,EAASE,EAAcrC,GAlGvB8D,EAAUjC,EAAK,GAC3BD,GACG,IAAImC,MAkGCC,YAAAA,CAAAA,EACA5C,OAAQA,EACRjB,SAAUA,EACV8D,gBAAgB,0BAChBC,gBAAiB,CAAA,EACjBtE,UAAW2D,EACP,uCACA,kCAEJvC,gBAAiBuC,EAAG,sCAAuCvC,GAC3DmD,aAAAA,CAAAA,EACApE,UAAWoC,EAASC,EAAgBrC,EACpCC,QAASmC,EAASE,EAAcrC,EAChCC,SAvGS,AAACmE,IACtB,GAAM,CAACxC,EAAOC,EAAI,CAAGuC,EACrBrC,EAAS,CAAEU,KAAM,aAAcb,MAAAA,EAAOC,IAAAA,CAAI,EAC9C,EAqGgBwC,YAAa,EACbC,oBAAqB,CAAA,EACrBC,KAAMpC,EACNqC,aAhHG,KACXrE,GACJ4B,EAAS,CAAEU,KAAM,OAAQ1C,UAAAA,EAAWC,QAAAA,CAAQ,EAChD,EA8GgByE,eAAgBjC,GAChBkC,cAAe,CAAA,EACf5D,QAASA,EACTC,QAASA,EACTE,SAAUA,EACV0D,MAAOjC,GACPkC,mBAAoB,CAAC,CACjBC,UAAAA,CAAS,CACTC,cAAAA,CAAa,CACbC,cAAAA,CAAa,CACbC,wBAAAA,CAAuB,CACvBC,wBAAAA,CAAuB,CAC1B,GACGvF,EAACwF,aAAAA,CAAAA,MAAAA,CAAItF,UAAU,wCACXF,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL7C,UAAU,wCACVuD,QAAS2B,EACT3E,SAAU6E,CAEV,EAAAtF,EAAAgE,aAAA,CAAC0B,SAEL1F,EAACC,aAAAA,CAAAA,OAAAA,CAAKC,UAAU,2CACXoD,EAAAA,EAAO6B,EAAW,aAAc,CAC7BzD,OAAQ,AAAkB,UAAlB,OAAOA,EAAsBiE,KAAAA,EAAYjE,CACrD,IAEJ1B,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL7C,UAAU,wCACVuD,QAAS4B,EACT5E,SAAU8E,GAEVvF,EAAC4F,aAAAA,CAAAA,EAAAA,QAIZ,GAAG3D,CAAAA,EAEJjC,EAACwF,aAAAA,CAAAA,MAAAA,CAAItF,UAAU,yCACV0B,EAAQiE,MAAM,CAAG,GACd7F,EAAC8F,aAAAA,CAAAA,EAAAA,CACG5F,UAAU,8CACViB,YAAAA,CAAAA,EACA4E,QAASnE,EAAQoE,GAAG,CAAC,AAACC,GAAO,CAAA,CACzBzF,MAAOyF,EAAEzF,KAAK,CACdyE,MAAOgB,EAAEzF,KAAAA,IAEbyE,MAAOrC,EACPsD,YAAarE,EACbtB,SAzID,AAAC4F,IACxB,IAAMC,EAASjD,MAAMC,OAAO,CAAC+C,GAAY,KAAQA,EACjD,GAAI,CAACC,EAAQ,CACT/D,EAAS,CAAEU,KAAM,OAAQ,GACzB,MACJ,CACA,IAAMsD,EAASzE,EAAQ0E,IAAI,CAAC,AAACL,GAAMA,EAAEzF,KAAK,GAAK4F,EAAOnB,KAAK,EACvDoB,GACAhE,EAAS,CACLU,KAAM,eACNqD,OAAAA,EACAlE,MAAOmE,EAAOE,KAAK,CAAC,EAAE,CACtBpE,IAAKkE,EAAOE,KAAK,CAAC,EAAE,AACxB,EAER,EA2H4BvF,cAAAA,CAAAA,EACAC,KAAAA,CAAAA,EACC,GAAGa,CAAAA,IAKhB9B,EAACwF,aAAAA,CAAAA,MAAAA,CAAItF,UAAU,yCACXF,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL7C,UAAU,2CACVuD,QAASX,EAERtB,EAAAA,GAELxB,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL7C,UAAU,yCACVuD,QA5KL,KACflD,EAAS,CAACmC,EAAeC,EAAY,EACrCX,IAAY,CAACU,EAAeC,EAAY,EACxCN,EAAS,CAAEU,KAAM,OAAQ,EAC7B,CA0KyBtB,EAAAA,KAIZd,EACGX,EAACwG,aAAAA,CAAAA,EAAAA,CAAQtG,UAAU,0CAEnBF,EAACyG,aAAAA,CAAAA,EAAAA,CAAavG,UAAU,uDAE3BiB,GAAeqC,IAAe,CAAC/C,GAC5BT,EAACyF,aAAAA,CAAAA,SAAAA,CACG1C,KAAK,SACL2D,aAAW,WACXxG,UAAU,0CACVuD,QAjLA,KAChBlD,EAAS,CAAC,KAAM,KAAK,EACrB8B,EAAS,CAAEU,KAAM,OAAQ,EAC7B,CAgLoB,EAAA/C,EAAAgE,aAAA,CAACjE,UAIZiB,CAAAA,GAAkBH,GAAUD,EAAcZ,EAAC2G,aAAAA,CAAAA,EAAAA,CAAU/F,KAAMA,EAAMC,MAAOA,IAArC,KAGhD,CAEAT,CAAAA,EAAgBwG,WAAW,CAAG"}
|
|
1
|
+
{"version":3,"file":"DateRangePicker.js","sources":["../../../../src/components/Datepicker/DateRangePicker/DateRangePicker.tsx"],"sourcesContent":["import React from 'react';\nimport type { ReactDatePickerProps } from 'react-datepicker';\nimport ReactDatePicker from 'react-datepicker';\nimport MaskedInput, { type MaskedInputProps } from 'react-text-mask';\n\nimport cn from 'classnames';\nimport { format, subMonths } from 'date-fns';\nimport { uk } from 'date-fns/locale/uk';\n\nimport ArrowLeftIcon from '../../../icons/arrowLeft';\nimport ArrowRightIcon from '../../../icons/arrowRight';\nimport CalendarIcon from '../../../icons/calendar';\nimport clearRawSvg from '../../../icons/clear';\nimport InputMeta from '../../InputMeta';\nimport LabelText from '../../LabelText';\nimport Select from '../../Select';\nimport type { SelectOption } from '../../Select';\nimport Spinner from '../../Spinner';\nimport type {\n DataQa,\n ErrorFeedback,\n HideEmptyMeta,\n LoadingFeedback,\n WithHint,\n WithPulseAnimation,\n} from '../../types';\nimport { initialState, pickerReducer } from './DateRangePicker.reducer';\nimport {\n applyEndFallback,\n buildRangeMask,\n formatRange,\n matchPresetLabel,\n parseRange,\n} from './utils';\n\nimport '../DatePicker.global.css';\nimport './DateRangePicker.global.css';\n\nconst CloseSvg = () => (\n <span className=\"vchasno-ui-date-range-picker__custom-close-icon\">{clearRawSvg}</span>\n);\n\ntype ControlledReactDatePickerProps =\n | 'selectsRange'\n | 'selectsMultiple'\n | 'startDate'\n | 'endDate'\n | 'onChange'\n | 'value'\n | 'open'\n | 'onInputClick'\n | 'onClickOutside'\n | 'monthsShown'\n | 'shouldCloseOnSelect'\n | 'renderCustomHeader'\n | 'children'\n | 'onChangeRaw'\n | 'customInput';\n\nexport interface DateRangePickerProps\n extends Omit<ReactDatePickerProps<true>, ControlledReactDatePickerProps>,\n Partial<\n LoadingFeedback & WithHint & ErrorFeedback & DataQa & HideEmptyMeta & WithPulseAnimation\n > {\n // Required controlled props (range-mode contract)\n startDate: Date | null;\n endDate: Date | null;\n onChange: (dates: [Date | null, Date | null]) => void;\n\n // UI-kit additions\n label?: string;\n wide?: boolean;\n cancelLabel?: string;\n saveLabel?: string;\n /**\n * перелік іменованих діапазонів для швидкого вибору.\n * У продуктових проєктах підписи слід обгортати через ttag (наприклад t`Сьогодні`),\n * щоб вони потрапили до перекладу — ui-kit отримує вже готові рядки.\n */\n presets?: { label: string; range: [Date, Date] }[];\n presetPlaceholder?: string;\n presetSelectProps?: Omit<React.ComponentProps<typeof Select>, 'options' | 'onChange' | 'value'>;\n\n /**\n * якщо обрано або введено лише дату початку, при збереженні автоматично підставляє\n * поточний момент (точний `new Date()` із часом, без нормалізації до кінця дня) як\n * дату завершення. Для цілодобових діапазонів нормалізуйте кінець у власному onChange.\n */\n endDefaultsToToday?: boolean;\n\n /** викликається при скасуванні вибору */\n onCancel?: () => void;\n /** викликається при підтвердженні вибору */\n onConfirm?: (dates: [Date | null, Date | null]) => void;\n\n /** маска для ручного вводу діапазону (типово виводиться з dateFormat) */\n mask?: MaskedInputProps['mask'];\n\n // Explicit re-declarations for Storybook Controls visibility\n // (types inherited from ReactDatePickerProps<true> via indexed access — zero drift)\n disabled?: ReactDatePickerProps<true>['disabled'];\n required?: ReactDatePickerProps<true>['required'];\n isClearable?: ReactDatePickerProps<true>['isClearable'];\n minDate?: ReactDatePickerProps<true>['minDate'];\n maxDate?: ReactDatePickerProps<true>['maxDate'];\n dateFormat?: ReactDatePickerProps<true>['dateFormat'];\n className?: ReactDatePickerProps<true>['className'];\n popperClassName?: ReactDatePickerProps<true>['popperClassName'];\n portalId?: ReactDatePickerProps<true>['portalId'];\n locale?: ReactDatePickerProps<true>['locale'];\n}\n\nconst DateRangePicker: React.FC<DateRangePickerProps> = ({\n startDate,\n endDate,\n onChange,\n label,\n disabled,\n required,\n loading,\n hint,\n error,\n className,\n dateFormat = 'dd/MM/yyyy',\n dataQa,\n hideEmptyMeta = false,\n wide = false,\n endDefaultsToToday = false,\n pulse,\n isClearable = false,\n minDate,\n maxDate,\n popperClassName,\n portalId,\n cancelLabel = 'Скасувати',\n saveLabel = 'Зберегти',\n locale = uk,\n presets = [],\n presetPlaceholder = 'Обрати період',\n presetSelectProps,\n onCancel,\n onConfirm,\n mask,\n ...props\n}) => {\n const [state, dispatch] = React.useReducer(pickerReducer, initialState);\n const { isOpen, tempStartDate, tempEndDate, selectedPreset, calendarKey, inputText } = state;\n\n const wrapperRef = React.useRef<HTMLSpanElement>(null);\n\n const displayFormat = (Array.isArray(dateFormat) ? dateFormat[0] : dateFormat) ?? 'dd/MM/yyyy';\n const resolvedMask = mask ?? buildRangeMask(displayFormat);\n const parseBounds = { minDate, maxDate, allowStartOnly: endDefaultsToToday };\n\n const resolveOpenToDate = (start: Date | null, end: Date | null): Date => {\n if (end) return subMonths(end, 1);\n if (start) return start;\n return new Date();\n };\n\n const displayValue = formatRange(startDate, endDate, displayFormat);\n const presetLabel = matchPresetLabel(startDate, endDate, presets);\n\n // Єдине місце коміту діапазону: applyEndFallback → onChange → onConfirm → close.\n const commitRange = (start: Date | null, end: Date | null) => {\n const [finalStart, finalEnd] = applyEndFallback(\n start,\n end,\n endDefaultsToToday,\n new Date(),\n maxDate,\n );\n onChange([finalStart, finalEnd]);\n onConfirm?.([finalStart, finalEnd]);\n dispatch({ type: 'close' });\n };\n\n /*\n * Карта workaround-ів: інтеграція з react-datepicker 6.9.0 у controlled-open режимі\n * (кнопки «Зберегти/Скасувати», пресети та masked-ввід змушують тримати `open` зовні,\n * тож бібліотека фаєрить власні події навіть для наших елементів). Шість обхідних місць,\n * кожне з власним «чому»-коментарем біля коду:\n * 1. handleOpen — guard від повторного засіювання temp-стану → проп `onInputClick`;\n * 2. handleClickOutside — containment у власному wrapper → проп `onClickOutside`;\n * 3. handleRawChange — відсіч подій від кліків по днях → проп `onChangeRaw`;\n * 4. handleInputKeyDownCapture — перехоплення Enter → `onKeyDownCapture` на <label>;\n * 5. calendarKey — remount для скиду стану календаря → проп `key` (інкремент у reducer);\n * 6. resolveOpenToDate (вище) — позиціонування місяців при відкритті → проп `openToDate`.\n */\n const handleOpen = () => {\n // Guard against re-seeding temp state on every input click: react-datepicker's\n // onInputClick fires on each click, and `open` reseeds temp from the committed\n // props — so clicking the input again while open would wipe an unsaved selection.\n // First click opens (seeds from props); while open the temp state stays the source\n // of truth so the user can keep editing.\n if (disabled || isOpen) return;\n dispatch({ type: 'open', startDate, endDate, inputText: displayValue });\n };\n\n const handleTempChange = (dates: [Date | null, Date | null]) => {\n const [start, end] = dates;\n dispatch({\n type: 'tempChange',\n start,\n end,\n inputText: formatRange(start, end, displayFormat),\n });\n };\n\n const handleSave = () => {\n commitRange(tempStartDate, tempEndDate);\n };\n\n const handleCancel = () => {\n onCancel?.();\n dispatch({ type: 'cancel', startDate, endDate, inputText: displayValue });\n };\n\n const handleClickOutside = (event: React.MouseEvent<HTMLDivElement>) => {\n // react-datepicker fires onClickOutside for clicks on our own input/icons too: it tracks\n // `open` internally while we drive it via the `open` prop, so its outside-click-ignore class\n // never lands on the input. Skip cancel for clicks inside our wrapper — otherwise clicking the\n // input to start editing wipes an unsaved range (cancel resets temp from empty committed props,\n // closes, then onInputClick reopens empty).\n const target = event.target;\n if (target instanceof Node && wrapperRef.current?.contains(target)) return;\n handleCancel();\n };\n\n const handleClear = () => {\n onChange([null, null]);\n dispatch({ type: 'reset' });\n };\n\n const handlePresetChange = (newValue: SelectOption | readonly SelectOption[] | null) => {\n const option = Array.isArray(newValue) ? null : (newValue as SelectOption | null);\n if (!option) {\n dispatch({ type: 'reset' });\n return;\n }\n const preset = presets.find((p) => p.label === option.value);\n if (preset) {\n dispatch({\n type: 'presetSelect',\n option,\n start: preset.range[0],\n end: preset.range[1],\n inputText: formatRange(preset.range[0], preset.range[1], displayFormat),\n });\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Escape' && isOpen) {\n handleCancel();\n }\n };\n\n const handleRawChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n // react-datepicker fires onChangeRaw from calendar selection too (handleSelect),\n // where the event is a day-cell click with no input value. Only handle real input\n // typing here; otherwise return so the calendar's own onChange (selection) proceeds.\n if (!(e.target instanceof HTMLInputElement)) return;\n e.preventDefault(); // disable react-datepicker's built-in single-date parsing — we own the input\n const raw = e.target.value;\n dispatch({\n type: 'typeChange',\n inputText: raw,\n parsed: parseRange(raw, displayFormat, parseBounds),\n });\n };\n\n /**\n * Перехоплює Enter у capture-фазі, щоб власний onKeyDown react-datepicker\n * (який скидає діапазон до [start, null] і стирає другу дату) ніколи не спрацював.\n *\n * Повністю валідний введений діапазон комітиться; з endDefaultsToToday валідний\n * лише початок комітить [start, зараз]; усе інше невалідне/неповне — no-op.\n *\n * Чому capture-фаза: react-datepicker клонує customInput і навішує власний\n * onKeyDown, тож єдиний спосіб випередити його — перехопити подію на батьківському\n * елементі через onKeyDownCapture. Актуально для react-datepicker 6.9.0.\n */\n const handleInputKeyDownCapture = (e: React.KeyboardEvent<HTMLElement>) => {\n if (e.key !== 'Enter') return;\n const target = e.target as HTMLElement;\n if (!target.matches?.('.react-datepicker__input-container input')) return;\n e.preventDefault();\n e.stopPropagation();\n const parsed = parseRange(inputText, displayFormat, parseBounds);\n if (parsed && parsed !== 'empty') {\n commitRange(parsed.start, parsed.end);\n }\n };\n\n const valueExists = !!startDate || !!endDate;\n const showPresetLabel = !isOpen && presetLabel !== null && valueExists;\n // Текст, який реально бачить користувач в інпуті: під час редагування — тимчасовий ввід,\n // інакше — збережене значення. Використовується і для value, і щоб тримати лейбл піднятим.\n const inputDisplayValue = isOpen ? inputText : displayValue;\n\n return (\n <label\n onClick={(e) => e.preventDefault()}\n data-qa={dataQa}\n className={cn(\n 'vchasno-ui-date-picker',\n 'vchasno-ui-date-range-picker',\n {\n '--loading': loading,\n '--required': required,\n '--disabled': disabled,\n '--error': error,\n '--wide': wide,\n '--not-empty': valueExists,\n '--filled': !!inputDisplayValue,\n '--preset-label': showPresetLabel,\n '--is-label': !!label,\n },\n className,\n )}\n onKeyDown={handleKeyDown}\n onKeyDownCapture={handleInputKeyDownCapture}\n >\n <span\n ref={wrapperRef}\n className={cn('vchasno-ui-date-range-picker__wrapper', {\n 'vchasno-ui-pulse-animation': pulse && !disabled,\n })}\n >\n {label && <LabelText>{label}</LabelText>}\n <ReactDatePicker\n key={calendarKey}\n openToDate={resolveOpenToDate(\n isOpen ? tempStartDate : startDate,\n isOpen ? tempEndDate : endDate,\n )}\n fixedHeight\n locale={locale}\n disabled={disabled}\n placeholderText=\"ДД/ММ/РРРР - ДД/ММ/РРРР\"\n showPopperArrow={false}\n className={cn(\n 'vchasno-ui-date-range-picker__picker',\n 'vchasno-ui-date-picker__picker',\n )}\n popperClassName={cn('vchasno-ui-date-range-picker-popper', popperClassName)}\n selectsRange\n startDate={isOpen ? tempStartDate : startDate}\n endDate={isOpen ? tempEndDate : endDate}\n onChange={handleTempChange}\n monthsShown={2}\n shouldCloseOnSelect={false}\n open={isOpen}\n onInputClick={handleOpen}\n onClickOutside={handleClickOutside}\n enableTabLoop={false}\n minDate={minDate}\n maxDate={maxDate}\n portalId={portalId}\n value={inputDisplayValue}\n onChangeRaw={handleRawChange}\n customInput={<MaskedInput inputMode=\"numeric\" mask={resolvedMask} guide />}\n renderCustomHeader={({\n monthDate,\n decreaseMonth,\n increaseMonth,\n prevMonthButtonDisabled,\n nextMonthButtonDisabled,\n }) => (\n <div className=\"vchasno-ui-date-range-picker__header\">\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__nav-btn\"\n onClick={decreaseMonth}\n disabled={prevMonthButtonDisabled}\n >\n <ArrowLeftIcon />\n </button>\n <span className=\"vchasno-ui-date-range-picker__month-title\">\n {format(monthDate, 'LLLL, yyyy', {\n locale: typeof locale === 'string' ? undefined : locale,\n })}\n </span>\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__nav-btn\"\n onClick={increaseMonth}\n disabled={nextMonthButtonDisabled}\n >\n <ArrowRightIcon />\n </button>\n </div>\n )}\n {...props}\n >\n <div className=\"vchasno-ui-date-range-picker__presets\">\n {presets.length > 0 && (\n <Select\n className=\"vchasno-ui-date-range-picker__preset-select\"\n isClearable\n options={presets.map((p) => ({\n label: p.label,\n value: p.label,\n }))}\n value={selectedPreset}\n placeholder={presetPlaceholder}\n onChange={handlePresetChange}\n hideEmptyMeta\n wide\n {...presetSelectProps}\n />\n )}\n </div>\n\n <div className=\"vchasno-ui-date-range-picker__actions\">\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__cancel-btn\"\n onClick={handleCancel}\n >\n {cancelLabel}\n </button>\n <button\n type=\"button\"\n className=\"vchasno-ui-date-range-picker__save-btn\"\n onClick={handleSave}\n >\n {saveLabel}\n </button>\n </div>\n </ReactDatePicker>\n {showPresetLabel && (\n <span className=\"vchasno-ui-date-range-picker__preset-label\" aria-hidden=\"true\">\n {presetLabel}\n </span>\n )}\n {loading ? (\n <Spinner className=\"vchasno-ui-date-range-picker__spinner\" />\n ) : (\n <CalendarIcon className=\"vchasno-ui-date-range-picker__custom-calendar-icon\" />\n )}\n {isClearable && valueExists && !disabled && (\n <button\n type=\"button\"\n aria-label=\"Очистити\"\n className=\"vchasno-ui-date-range-picker__clear-btn\"\n onClick={handleClear}\n >\n <CloseSvg />\n </button>\n )}\n </span>\n {hideEmptyMeta && !error && !hint ? null : <InputMeta hint={hint} error={error} />}\n </label>\n );\n};\n\nDateRangePicker.displayName = 'DateRangePicker';\n\nexport default DateRangePicker;\n"],"names":["CloseSvg","React","span","className","clearRawSvg","DateRangePicker","startDate","endDate","onChange","label","disabled","required","loading","hint","error","dateFormat","dataQa","hideEmptyMeta","wide","endDefaultsToToday","pulse","isClearable","minDate","maxDate","popperClassName","portalId","cancelLabel","saveLabel","locale","uk","presets","presetPlaceholder","presetSelectProps","onCancel","onConfirm","mask","props","start","end","state","dispatch","useReducer","pickerReducer","initialState","isOpen","tempStartDate","tempEndDate","selectedPreset","calendarKey","inputText","wrapperRef","useRef","displayFormat","Array","isArray","resolvedMask","buildRangeMask","parseBounds","allowStartOnly","displayValue","formatRange","presetLabel","matchPresetLabel","commitRange","finalStart","finalEnd","applyEndFallback","Date","type","handleCancel","valueExists","showPresetLabel","inputDisplayValue","onClick","e","preventDefault","data-qa","cn","onKeyDown","key","onKeyDownCapture","target","matches","stopPropagation","parsed","parseRange","ref","createElement","LabelText","ReactDatePicker","openToDate","subMonths","fixedHeight","placeholderText","showPopperArrow","selectsRange","dates","monthsShown","shouldCloseOnSelect","open","onInputClick","onClickOutside","event","Node","current","contains","enableTabLoop","value","onChangeRaw","HTMLInputElement","raw","customInput","MaskedInput","inputMode","guide","renderCustomHeader","monthDate","decreaseMonth","increaseMonth","prevMonthButtonDisabled","nextMonthButtonDisabled","div","button","ArrowLeftIcon","format","undefined","ArrowRightIcon","length","Select","options","map","p","placeholder","newValue","option","preset","find","range","aria-hidden","Spinner","CalendarIcon","aria-label","InputMeta","displayName"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
let e={isOpen:!1,tempStartDate:null,tempEndDate:null,selectedPreset:null,calendarKey:0};function t(e,t){switch(t.type){case"open":return{...e,isOpen:!0,tempStartDate:t.startDate,tempEndDate:t.endDate};case"close":return{...e,isOpen:!1};case"tempChange":return{...e,tempStartDate:t.start,tempEndDate:t.end,selectedPreset:null};case"cancel":return{...e,isOpen:!1,tempStartDate:t.startDate,tempEndDate:t.endDate,selectedPreset:null};case"reset":return{...e,tempStartDate:null,tempEndDate:null,selectedPreset:null,calendarKey:e.calendarKey+1};case"presetSelect":return{...e,selectedPreset:t.option,tempStartDate:t.start,tempEndDate:t.end,calendarKey:e.calendarKey+1}}}export{e as initialState,t as pickerReducer};
|
|
1
|
+
let e={isOpen:!1,tempStartDate:null,tempEndDate:null,selectedPreset:null,calendarKey:0,inputText:""};function t(e,t){switch(t.type){case"open":return{...e,isOpen:!0,tempStartDate:t.startDate,tempEndDate:t.endDate,inputText:t.inputText};case"close":return{...e,isOpen:!1};case"tempChange":return{...e,tempStartDate:t.start,tempEndDate:t.end,selectedPreset:null,inputText:t.inputText};case"typeChange":{let n={...e,inputText:t.inputText,selectedPreset:null};if("empty"===t.parsed)return{...n,tempStartDate:null,tempEndDate:null};if(null!==t.parsed)return{...n,tempStartDate:t.parsed.start,tempEndDate:t.parsed.end};return n}case"cancel":return{...e,isOpen:!1,tempStartDate:t.startDate,tempEndDate:t.endDate,selectedPreset:null,inputText:t.inputText};case"reset":return{...e,tempStartDate:null,tempEndDate:null,selectedPreset:null,calendarKey:e.calendarKey+1,inputText:""};case"presetSelect":return{...e,selectedPreset:t.option,tempStartDate:t.start,tempEndDate:t.end,calendarKey:e.calendarKey+1,inputText:t.inputText}}}export{e as initialState,t as pickerReducer};
|
|
2
2
|
//# sourceMappingURL=DateRangePicker.reducer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangePicker.reducer.js","sources":["../../../../src/components/Datepicker/DateRangePicker/DateRangePicker.reducer.ts"],"sourcesContent":["import type { SelectOption } from '../../Select';\n\nexport type PickerState = {\n isOpen: boolean;\n tempStartDate: Date | null;\n tempEndDate: Date | null;\n selectedPreset: SelectOption | null;\n calendarKey: number;\n};\n\nexport type PickerAction =\n | { type: 'open'; startDate: Date | null; endDate: Date | null }\n | { type: 'close' }\n | { type: 'tempChange'; start: Date | null; end: Date | null }\n | { type: 'cancel'; startDate: Date | null; endDate: Date | null }\n | { type: 'reset' }\n | { type: 'presetSelect'; option: SelectOption; start: Date; end: Date };\n\nexport const initialState: PickerState = {\n isOpen: false,\n tempStartDate: null,\n tempEndDate: null,\n selectedPreset: null,\n calendarKey: 0,\n};\n\nexport function pickerReducer(state: PickerState, action: PickerAction): PickerState {\n switch (action.type) {\n case 'open':\n return {\n ...state,\n isOpen: true,\n tempStartDate: action.startDate,\n tempEndDate: action.endDate,\n };\n case 'close':\n return { ...state, isOpen: false };\n case 'tempChange':\n return {\n ...state,\n tempStartDate: action.start,\n tempEndDate: action.end,\n selectedPreset: null,\n };\n case 'cancel':\n return {\n ...state,\n isOpen: false,\n tempStartDate: action.startDate,\n tempEndDate: action.endDate,\n selectedPreset: null,\n };\n case 'reset':\n return {\n ...state,\n tempStartDate: null,\n tempEndDate: null,\n selectedPreset: null,\n calendarKey: state.calendarKey + 1,\n };\n case 'presetSelect':\n return {\n ...state,\n selectedPreset: action.option,\n tempStartDate: action.start,\n tempEndDate: action.end,\n calendarKey: state.calendarKey + 1,\n };\n }\n}\n"],"names":["initialState","isOpen","tempStartDate","tempEndDate","selectedPreset","calendarKey","pickerReducer","state","action","type","startDate","endDate","start","end","option"],"mappings":"
|
|
1
|
+
{"version":3,"file":"DateRangePicker.reducer.js","sources":["../../../../src/components/Datepicker/DateRangePicker/DateRangePicker.reducer.ts"],"sourcesContent":["import type { SelectOption } from '../../Select';\nimport type { ParsedRange, ParsedStart } from './utils';\n\nexport type PickerState = {\n isOpen: boolean;\n tempStartDate: Date | null;\n tempEndDate: Date | null;\n selectedPreset: SelectOption | null;\n calendarKey: number;\n inputText: string;\n};\n\nexport type PickerAction =\n | { type: 'open'; startDate: Date | null; endDate: Date | null; inputText: string }\n | { type: 'close' }\n | { type: 'tempChange'; start: Date | null; end: Date | null; inputText: string }\n | { type: 'typeChange'; inputText: string; parsed: ParsedRange | ParsedStart | 'empty' | null }\n | { type: 'cancel'; startDate: Date | null; endDate: Date | null; inputText: string }\n | { type: 'reset' }\n | { type: 'presetSelect'; option: SelectOption; start: Date; end: Date; inputText: string };\n\nexport const initialState: PickerState = {\n isOpen: false,\n tempStartDate: null,\n tempEndDate: null,\n selectedPreset: null,\n calendarKey: 0,\n inputText: '',\n};\n\nexport function pickerReducer(state: PickerState, action: PickerAction): PickerState {\n switch (action.type) {\n case 'open':\n return {\n ...state,\n isOpen: true,\n tempStartDate: action.startDate,\n tempEndDate: action.endDate,\n inputText: action.inputText,\n };\n case 'close':\n return { ...state, isOpen: false };\n case 'tempChange':\n return {\n ...state,\n tempStartDate: action.start,\n tempEndDate: action.end,\n selectedPreset: null,\n inputText: action.inputText,\n };\n case 'typeChange': {\n const base = {\n ...state,\n inputText: action.inputText,\n selectedPreset: null,\n };\n if (action.parsed === 'empty') {\n return { ...base, tempStartDate: null, tempEndDate: null };\n }\n if (action.parsed !== null) {\n return {\n ...base,\n tempStartDate: action.parsed.start,\n tempEndDate: action.parsed.end,\n };\n }\n // parsed === null: invalid/incomplete — leave temp dates unchanged\n return base;\n }\n case 'cancel':\n return {\n ...state,\n isOpen: false,\n tempStartDate: action.startDate,\n tempEndDate: action.endDate,\n selectedPreset: null,\n inputText: action.inputText,\n };\n case 'reset':\n return {\n ...state,\n tempStartDate: null,\n tempEndDate: null,\n selectedPreset: null,\n calendarKey: state.calendarKey + 1,\n inputText: '',\n };\n case 'presetSelect':\n return {\n ...state,\n selectedPreset: action.option,\n tempStartDate: action.start,\n tempEndDate: action.end,\n calendarKey: state.calendarKey + 1,\n inputText: action.inputText,\n };\n }\n}\n"],"names":["initialState","isOpen","tempStartDate","tempEndDate","selectedPreset","calendarKey","inputText","pickerReducer","state","action","type","startDate","endDate","start","end","base","parsed","option"],"mappings":"IAqBaA,EAA4B,CACrCC,OAAQ,CAAA,EACRC,cAAe,KACfC,YAAa,KACbC,eAAgB,KAChBC,YAAa,EACbC,UAAW,EACf,EAEO,SAASC,EAAcC,CAAkB,CAAEC,CAAoB,EAClE,OAAQA,EAAOC,IAAI,EACf,IAAK,OACD,MAAO,CACH,GAAGF,CAAK,CACRP,OAAQ,CAAA,EACRC,cAAeO,EAAOE,SAAS,CAC/BR,YAAaM,EAAOG,OAAO,CAC3BN,UAAWG,EAAOH,SAAAA,AACtB,CACJ,KAAK,QACD,MAAO,CAAE,GAAGE,CAAK,CAAEP,OAAQ,CAAA,CAAM,CACrC,KAAK,aACD,MAAO,CACH,GAAGO,CAAK,CACRN,cAAeO,EAAOI,KAAK,CAC3BV,YAAaM,EAAOK,GAAG,CACvBV,eAAgB,KAChBE,UAAWG,EAAOH,SAAAA,AACtB,CACJ,KAAK,aAAc,CACf,IAAMS,EAAO,CACT,GAAGP,CAAK,CACRF,UAAWG,EAAOH,SAAS,CAC3BF,eAAgB,IACpB,EACA,GAAIK,AAAkB,UAAlBA,EAAOO,MAAM,CACb,MAAO,CAAE,GAAGD,CAAI,CAAEb,cAAe,KAAMC,YAAa,IAAK,EAE7D,GAAIM,AAAkB,OAAlBA,EAAOO,MAAM,CACb,MAAO,CACH,GAAGD,CAAI,CACPb,cAAeO,EAAOO,MAAM,CAACH,KAAK,CAClCV,YAAaM,EAAOO,MAAM,CAACF,GAAAA,AAC/B,EAGJ,OAAOC,CACX,CACA,IAAK,SACD,MAAO,CACH,GAAGP,CAAK,CACRP,OAAQ,CAAA,EACRC,cAAeO,EAAOE,SAAS,CAC/BR,YAAaM,EAAOG,OAAO,CAC3BR,eAAgB,KAChBE,UAAWG,EAAOH,SAAAA,AACtB,CACJ,KAAK,QACD,MAAO,CACH,GAAGE,CAAK,CACRN,cAAe,KACfC,YAAa,KACbC,eAAgB,KAChBC,YAAaG,EAAMH,WAAW,CAAG,EACjCC,UAAW,EACf,CACJ,KAAK,eACD,MAAO,CACH,GAAGE,CAAK,CACRJ,eAAgBK,EAAOQ,MAAM,CAC7Bf,cAAeO,EAAOI,KAAK,CAC3BV,YAAaM,EAAOK,GAAG,CACvBT,YAAaG,EAAMH,WAAW,CAAG,EACjCC,UAAWG,EAAOH,SAAAA,AACtB,CACR,CACJ"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{format as e,parse as t,isValid as l}from"date-fns";let n=(t,l,n)=>{let i=t?e(t,n):"",r=l?e(l,n):"";return i&&r?`${i} - ${r}`:i||""},i=(e,t,l)=>{let n=(e,t)=>null===e?null===t:null!==t&&e.getTime()===t.getTime(),i=l.find(l=>n(e,l.range[0])&&n(t,l.range[1]));return i?i.label:null},r=e=>[...e].map(e=>/[a-zA-Z]/.test(e)?/\d/:e),g=e=>{let t=r(e);return[...t," ","-"," ",...t]},m=(n,i)=>{let r=n.trim();if(r.length!==i.length)return null;let g=t(r,i,new Date);return l(g)&&e(g,i)===r?g:null},u=(e,t,{minDate:l,maxDate:n,allowStartOnly:i=!1}={})=>{let r=e.trim();if(""===r)return"empty";let g=r.split(" - "),u=g[0],a=void 0!==u?m(u,t):null;if(2===g.length){let e=g[1],i=void 0!==e?m(e,t):null;if(a&&i)return a.getTime()>i.getTime()||l&&a.getTime()<l.getTime()||n&&i.getTime()>n.getTime()?null:{start:a,end:i}}return i&&a?l&&a.getTime()<l.getTime()||n&&a.getTime()>n.getTime()?null:{start:a,end:null}:null},a=(e,t,l,n,i)=>{if(!l||!e||t||e.getTime()>n.getTime())return[e,t];let r=i&&i.getTime()<n.getTime()?i:n;return e.getTime()>r.getTime()?[e,t]:[e,r]};export{a as applyEndFallback,g as buildRangeMask,n as formatRange,i as matchPresetLabel,u as parseRange};
|
|
2
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../src/components/Datepicker/DateRangePicker/utils.ts"],"sourcesContent":["import { format, isValid, parse } from 'date-fns';\n\nconst SEPARATOR = ' - ';\n\nexport const formatRange = (\n start: Date | null,\n end: Date | null,\n displayFormat: string,\n): string => {\n const startStr = start ? format(start, displayFormat) : '';\n const endStr = end ? format(end, displayFormat) : '';\n if (startStr && endStr) return `${startStr}${SEPARATOR}${endStr}`;\n if (startStr) return startStr;\n return '';\n};\n\ntype PresetEntry = { label: string; range: [Date, Date] };\n\n/**\n * Якщо діапазон точно збігається з діапазоном іменованого пресету — повертає його підпис,\n * інакше null. Порівняння за getTime() з урахуванням null; за колізії — перший збіг.\n */\nexport const matchPresetLabel = (\n start: Date | null,\n end: Date | null,\n presets: ReadonlyArray<PresetEntry>,\n): string | null => {\n const sameInstant = (a: Date | null, b: Date | null): boolean =>\n a === null ? b === null : b !== null && a.getTime() === b.getTime();\n const match = presets.find(\n (p) => sameInstant(start, p.range[0]) && sameInstant(end, p.range[1]),\n );\n return match ? match.label : null;\n};\n\n/**\n * Builds a react-text-mask mask for a single date from a date-fns format string:\n * every pattern letter becomes a digit slot, every other character stays a literal.\n * Targets numeric date formats (dd/MM/yyyy, dd.MM.yyyy, yyyy-MM-dd, …).\n */\nconst buildDateMask = (displayFormat: string): (string | RegExp)[] =>\n [...displayFormat].map((char) => (/[a-zA-Z]/.test(char) ? /\\d/ : char));\n\n/** Builds the full range mask (`<date> - <date>`) derived from the given format. */\nexport const buildRangeMask = (displayFormat: string): (string | RegExp)[] => {\n const dateMask = buildDateMask(displayFormat);\n return [...dateMask, ' ', '-', ' ', ...dateMask];\n};\n\nexport interface ParsedRange {\n start: Date;\n end: Date;\n}\n\n/** результат, коли введено лише валідну дату початку (кінець підставляється окремо) */\nexport interface ParsedStart {\n start: Date;\n end: null;\n}\n\ninterface ParseBounds {\n minDate?: Date | null;\n maxDate?: Date | null;\n /** дозволити введення лише дати початку — для режиму endDefaultsToToday */\n allowStartOnly?: boolean;\n}\n\nconst parseToken = (token: string, displayFormat: string): Date | null => {\n const trimmed = token.trim();\n if (trimmed.length !== displayFormat.length) return null;\n const parsed = parse(trimmed, displayFormat, new Date());\n if (!isValid(parsed)) return null;\n // round-trip guard rejects overflow values like 32/13/2025\n if (format(parsed, displayFormat) !== trimmed) return null;\n return parsed;\n};\n\n/**\n * Parses a typed range string.\n * Returns 'empty' for blank input, a full {start, end} range when both dates are\n * valid, and — when `allowStartOnly` is set (endDefaultsToToday) — a {start, end: null}\n * result when only a valid start date has been entered. null otherwise.\n */\nexport const parseRange = (\n text: string,\n displayFormat: string,\n { minDate, maxDate, allowStartOnly = false }: ParseBounds = {},\n): ParsedRange | ParsedStart | 'empty' | null => {\n const trimmed = text.trim();\n if (trimmed === '') return 'empty';\n\n // Split on the spaced range separator ' - ' — the exact literal the mask inserts between\n // the two dates. Using the spaced form (not a bare '-') keeps date-internal dashes intact,\n // so '-'-separated formats like yyyy-MM-dd parse correctly too.\n const parts = trimmed.split(SEPARATOR);\n const startPart = parts[0];\n const start = startPart !== undefined ? parseToken(startPart, displayFormat) : null;\n\n if (parts.length === 2) {\n const endPart = parts[1];\n const end = endPart !== undefined ? parseToken(endPart, displayFormat) : null;\n if (start && end) {\n if (start.getTime() > end.getTime()) return null;\n if (minDate && start.getTime() < minDate.getTime()) return null;\n if (maxDate && end.getTime() > maxDate.getTime()) return null;\n return { start, end };\n }\n }\n\n // start-only: a valid start with the end still blank (or mask placeholders)\n if (allowStartOnly && start) {\n if (minDate && start.getTime() < minDate.getTime()) return null;\n if (maxDate && start.getTime() > maxDate.getTime()) return null;\n return { start, end: null };\n }\n\n return null;\n};\n\n/**\n * Commit-time fallback for the end date.\n * When enabled and the user committed a start but no end, fills the end with `now`.\n * `now` is injected so the whole computation does a single clock read per commit\n * and stays a pure function (the caller passes `new Date()` at Save).\n *\n * Returns the tuple unchanged when disabled, when both are empty / end is already\n * set, or when start is in the future relative to `now` (would yield a reversed\n * range). When `maxDate` precedes `now`, the filled end is clamped down to it.\n */\nexport const applyEndFallback = (\n start: Date | null,\n end: Date | null,\n enabled: boolean,\n now: Date,\n maxDate?: Date | null,\n): [Date | null, Date | null] => {\n if (!enabled) return [start, end];\n if (!start || end) return [start, end];\n if (start.getTime() > now.getTime()) return [start, end]; // reversed-range guard\n // Clamp DOWN to maxDate only — mirrors parseRange's instant comparison above\n // (end.getTime() > maxDate.getTime()); may no-op against a day-granular maxDate.\n const filledEnd = maxDate && maxDate.getTime() < now.getTime() ? maxDate : now;\n if (start.getTime() > filledEnd.getTime()) return [start, end]; // post-clamp guard\n return [start, filledEnd];\n};\n"],"names":["formatRange","start","end","displayFormat","startStr","format","endStr","matchPresetLabel","presets","sameInstant","a","b","getTime","match","find","p","range","label","buildDateMask","map","char","test","buildRangeMask","dateMask","parseToken","token","trimmed","trim","length","parsed","parse","Date","isValid","parseRange","text","minDate","maxDate","allowStartOnly","parts","split","startPart","undefined","endPart","applyEndFallback","enabled","now","filledEnd"],"mappings":"0DAIaA,IAAAA,EAAc,CACvBC,EACAC,EACAC,KAEA,IAAMC,EAAWH,EAAQI,EAAOJ,EAAOE,GAAiB,GAClDG,EAASJ,EAAMG,EAAOH,EAAKC,GAAiB,UAClD,AAAIC,GAAYE,EAAe,GAAGF,OAAuBE,GAAQ,CAC7DF,GACG,EACX,EAQaG,EAAmB,CAC5BN,EACAC,EACAM,KAEA,IAAMC,EAAc,CAACC,EAAgBC,IACjCD,AAAM,OAANA,EAAaC,AAAM,OAANA,EAAaA,AAAM,OAANA,GAAcD,EAAEE,OAAO,KAAOD,EAAEC,OAAO,GAC/DC,EAAQL,EAAQM,IAAI,CACtB,AAACC,GAAMN,EAAYR,EAAOc,EAAEC,KAAK,CAAC,EAAE,GAAKP,EAAYP,EAAKa,EAAEC,KAAK,CAAC,EAAE,GAExE,OAAOH,EAAQA,EAAMI,KAAK,CAAG,IACjC,EAOMC,EAAgB,AAACf,GACnB,IAAIA,EAAc,CAACgB,GAAG,CAAC,AAACC,GAAU,WAAWC,IAAI,CAACD,GAAQ,KAAOA,GAGxDE,EAAiB,AAACnB,IAC3B,IAAMoB,EAAWL,EAAcf,GAC/B,MAAO,IAAIoB,EAAU,IAAK,IAAK,OAAQA,EAAS,AACpD,EAoBMC,EAAa,CAACC,EAAetB,KAC/B,IAAMuB,EAAUD,EAAME,IAAI,GAC1B,GAAID,EAAQE,MAAM,GAAKzB,EAAcyB,MAAM,CAAE,OAAO,KACpD,IAAMC,EAASC,EAAMJ,EAASvB,EAAe,IAAI4B,aACjD,AAAKC,EAAQH,IAETxB,EAAOwB,EAAQ1B,KAAmBuB,EAC/BG,EAHsB,IAIjC,EAQaI,EAAa,CACtBC,EACA/B,EACA,CAAEgC,QAAAA,CAAO,CAAEC,QAAAA,CAAO,CAAEC,eAAAA,EAAiB,CAAA,CAAK,CAAe,CAAG,EAAE,IAE9D,IAAMX,EAAUQ,EAAKP,IAAI,GACzB,GAAID,AAAY,KAAZA,EAAgB,MAAO,QAK3B,IAAMY,EAAQZ,EAAQa,KAAK,CA5Fb,OA6FRC,EAAYF,CAAK,CAAC,EAAE,CACpBrC,EAAQuC,AAAcC,KAAAA,IAAdD,EAA0BhB,EAAWgB,EAAWrC,GAAiB,KAE/E,GAAImC,AAAiB,IAAjBA,EAAMV,MAAM,CAAQ,CACpB,IAAMc,EAAUJ,CAAK,CAAC,EAAE,CAClBpC,EAAMwC,AAAYD,KAAAA,IAAZC,EAAwBlB,EAAWkB,EAASvC,GAAiB,KACzE,GAAIF,GAASC,SACT,AAAID,EAAMW,OAAO,GAAKV,EAAIU,OAAO,IAC7BuB,GAAWlC,EAAMW,OAAO,GAAKuB,EAAQvB,OAAO,IAC5CwB,GAAWlC,EAAIU,OAAO,GAAKwB,EAAQxB,OAAO,GAFF,KAGrC,CAAEX,MAAAA,EAAOC,IAAAA,CAAI,CAE5B,QAGA,AAAImC,GAAkBpC,EAClB,AAAIkC,GAAWlC,EAAMW,OAAO,GAAKuB,EAAQvB,OAAO,IAC5CwB,GAAWnC,EAAMW,OAAO,GAAKwB,EAAQxB,OAAO,GADW,KAEpD,CAAEX,MAAAA,EAAOC,IAAK,IAAK,EAGvB,IACX,EAYayC,EAAmB,CAC5B1C,EACAC,EACA0C,EACAC,EACAT,KAEA,GAAI,CAACQ,GACD,CAAC3C,GAASC,GACVD,EAAMW,OAAO,GAAKiC,EAAIjC,OAAO,GAFnB,MAAO,CAACX,EAAOC,EAAI,CAKjC,IAAM4C,EAAYV,GAAWA,EAAQxB,OAAO,GAAKiC,EAAIjC,OAAO,GAAKwB,EAAUS,SAC3E,AAAI5C,EAAMW,OAAO,GAAKkC,EAAUlC,OAAO,GAAW,CAACX,EAAOC,EAAI,CACvD,CAACD,EAAO6C,EAAU,AAC7B"}
|
|
@@ -9,13 +9,23 @@ interface BasePaginationProps {
|
|
|
9
9
|
simple?: boolean;
|
|
10
10
|
hideNext?: boolean;
|
|
11
11
|
hidePrev?: boolean;
|
|
12
|
+
/**
|
|
13
|
+
* @deprecated Gap buttons now open a page picker instead of using click callbacks.
|
|
14
|
+
*/
|
|
12
15
|
onPrevGapClick?: () => void;
|
|
16
|
+
/**
|
|
17
|
+
* @deprecated Gap buttons now open a page picker instead of using click callbacks.
|
|
18
|
+
*/
|
|
13
19
|
onNextGapClick?: () => void;
|
|
14
20
|
onPrevClick: () => void;
|
|
15
21
|
onNextClick: () => void;
|
|
16
22
|
isPrevDisabled?: boolean;
|
|
17
23
|
isNextDisabled?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* @deprecated Gap buttons now open a page picker instead of jumping by a fixed step.
|
|
26
|
+
*/
|
|
18
27
|
gapStep?: number;
|
|
28
|
+
gapSearchThreshold?: number;
|
|
19
29
|
}
|
|
20
30
|
declare function BasePagination(props: BasePaginationProps): React.JSX.Element | null;
|
|
21
31
|
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from"react";import t from"classnames";import{composePaginationSteps as
|
|
1
|
+
import e from"react";import{Combobox as a}from"@base-ui/react";import t from"classnames";import{composePaginationSteps as n}from"./utils.js";function i(a){return a.hide?null:e.createElement("div",{className:t("vchasno-ui-pagination",a.className,{"vchasno-ui-pagination--simple":a.simple})},e.createElement(s,{type:"prev",onClick:a.onPrevClick,isDisabled:a.isPrevDisabled??!1,isHidden:a.hidePrev??!1}),!a.simple&&e.createElement("div",{className:"vchasno-ui-pagination__pages"},n(a.total??0,a.currentPage).map(t=>Array.isArray(t)?t[0]?e.createElement(l,{key:t[0]<a.currentPage?"prev":"next",pages:t,onPageChange:a.onPageChange,searchThreshold:a.gapSearchThreshold??7}):null:e.createElement(r,{key:t.toString(),isActive:t===a.currentPage,onClick:()=>a.onPageChange?.(t),text:t.toString()}))),e.createElement(s,{type:"next",onClick:a.onNextClick,isDisabled:a.isNextDisabled??!1,isHidden:a.hideNext??!1}))}function l(a){let t=a.pages[0];return 1===a.pages.length&&"number"==typeof t?e.createElement(r,{isActive:!1,onClick:()=>a.onPageChange?.(t),text:"..."}):e.createElement(o,a)}function o(n){let i=a.useFilter(),[l,o]=e.useState(!1),[s,r]=e.useState(""),p=n.pages.length>=n.searchThreshold;return e.createElement(a.Root,{open:l,onOpenChange:e=>{o(e),e||r("")},value:null,onValueChange:e=>{"number"==typeof e&&(n.onPageChange?.(e),o(!1),r(""))},inputValue:s,onInputValueChange:r,items:n.pages,filter:i.contains,itemToStringLabel:e=>e.toString(),modal:!1},e.createElement(a.Trigger,{type:"button",className:"vchasno-ui-pagination__item"},"..."),e.createElement(a.Portal,null,e.createElement(a.Positioner,{sideOffset:4,align:"center"},e.createElement(a.Popup,{className:t("vchasno-ui-pagination__gap-popup",{"vchasno-ui-pagination__gap-popup--with-search":p})},p&&e.createElement("div",{className:"vchasno-ui-pagination__gap-search"},e.createElement(c,null),e.createElement(a.Input,{className:"vchasno-ui-pagination__gap-search-input",placeholder:"Пошук"})),e.createElement("div",{className:"vchasno-ui-pagination__gap-viewport"},p&&e.createElement(a.Empty,null,e.createElement("div",{className:"vchasno-ui-pagination__gap-empty"},e.createElement("span",{className:"vchasno-ui-pagination__gap-empty-icon","aria-hidden":"true"},"\uD83D\uDD0D"),e.createElement("span",null,"Сторінку",e.createElement("br",null),"не знайдено"))),e.createElement(a.List,{className:"vchasno-ui-pagination__gap-list"},(t,n)=>e.createElement(a.Item,{key:t,index:n,value:t,className:"vchasno-ui-pagination__gap-option"},t)))))))}function s(a){return e.createElement("button",{type:"button",onClick:a.onClick,disabled:a.isDisabled,className:t("vchasno-ui-pagination__item","vchasno-ui-pagination__item-arrow",{"vchasno-ui-pagination__item-disabled":a.isDisabled,"vchasno-ui-pagination__item-hidden":a.isHidden})},e.createElement("svg",{style:"next"===a.type?{transform:"rotate(180deg)",transformOrigin:"center center"}:void 0,width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M7 9.99253C7 9.73253 7.1 9.48252 7.29 9.28253L11.29 5.29253C11.68 4.90253 12.32 4.90253 12.71 5.29253C13.1 5.68253 13.1 6.32253 12.71 6.71253L9.42 9.99253L12.71 13.2825C13.1 13.6725 13.1 14.3125 12.71 14.7025C12.32 15.0925 11.68 15.0925 11.29 14.7025L7.3 10.7125C7.1 10.5125 7 10.2525 7 9.99253Z",fill:"currentColor"})))}function r(a){return e.createElement("button",{type:"button",onClick:a.onClick,className:t("vchasno-ui-pagination__item",{"vchasno-ui-pagination__item-active":a.isActive})},a.text)}function c(){return e.createElement("svg",{"aria-hidden":"true",className:"vchasno-ui-pagination__gap-search-icon",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M7.333 12.667A5.333 5.333 0 1 1 7.333 2a5.333 5.333 0 0 1 0 10.667ZM7.333 3.333a4 4 0 1 0 0 8 4 4 0 0 0 0-8ZM13.333 14a.665.665 0 0 1-.473-.193l-2.14-2.14a.669.669 0 0 1 .947-.947l2.14 2.14a.667.667 0 0 1-.474 1.14Z",fill:"currentColor"}))}export{i as BasePagination};
|
|
2
2
|
//# sourceMappingURL=BasePagination.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BasePagination.js","sources":["../../../src/components/Pagination/BasePagination.tsx"],"sourcesContent":["import React from 'react';\n\nimport cn from 'classnames';\n\nimport { composePaginationSteps } from './utils';\n\nimport './Pagination.global.css';\n\nexport interface BasePaginationProps {\n hide?: boolean;\n className?: string;\n currentPage: number;\n total?: number | null;\n onPageChange?: (page: number) => void;\n simple?: boolean;\n hideNext?: boolean;\n hidePrev?: boolean;\n onPrevGapClick?: () => void;\n onNextGapClick?: () => void;\n onPrevClick: () => void;\n onNextClick: () => void;\n isPrevDisabled?: boolean;\n isNextDisabled?: boolean;\n gapStep?: number;\n}\n\nexport function BasePagination(props: BasePaginationProps) {\n if (props.hide) {\n return null;\n }\n\n return (\n <div className={cn('vchasno-ui-pagination', props.className)}>\n <PaginationArrowButton\n type=\"prev\"\n onClick={props.onPrevClick}\n isDisabled={props.isPrevDisabled ?? false}\n isHidden={props.hidePrev ?? false}\n />\n {!props.simple &&\n composePaginationSteps(props.total ?? 0, props.currentPage).map((item) => {\n if (Array.isArray(item)) {\n if (!item[0]) return null;\n // Це три крапки між сторінками і стрілочками:\n // < 1 ... 5 6 7 ... 20 >\n // ^^^ ^^^\n if (item[0] < props.currentPage) {\n return (\n <PaginationItem\n key=\"prev\"\n isActive={false}\n onClick={() => props.onPrevGapClick?.()}\n text=\"...\"\n />\n );\n } else {\n return (\n <PaginationItem\n key=\"next\"\n isActive={false}\n onClick={() => props.onNextGapClick?.()}\n text=\"...\"\n />\n );\n }\n }\n return (\n <PaginationItem\n key={item.toString()}\n isActive={item === props.currentPage}\n onClick={() => props.onPageChange?.(item)}\n text={item.toString()}\n />\n );\n })}\n <PaginationArrowButton\n type=\"next\"\n onClick={props.onNextClick}\n isDisabled={props.isNextDisabled ?? false}\n isHidden={props.hideNext ?? false}\n />\n </div>\n );\n}\n\nfunction PaginationArrowButton(props: {\n onClick: () => void;\n isDisabled: boolean;\n isHidden: boolean;\n type: 'prev' | 'next';\n}) {\n return (\n <button\n type=\"button\"\n onClick={props.onClick}\n disabled={props.isDisabled}\n className={cn('vchasno-ui-pagination__item', 'vchasno-ui-pagination__item-arrow', {\n ['vchasno-ui-pagination__item-disabled']: props.isDisabled,\n ['vchasno-ui-pagination__item-hidden']: props.isHidden,\n })}\n >\n <svg\n // Без стилів SVG зображує кнопку назад\n style={\n props.type === 'next'\n ? { transform: 'rotate(180deg)', transformOrigin: 'center center' }\n : undefined\n }\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 9.99253C7 9.73253 7.1 9.48252 7.29 9.28253L11.29 5.29253C11.68 4.90253 12.32 4.90253 12.71 5.29253C13.1 5.68253 13.1 6.32253 12.71 6.71253L9.42 9.99253L12.71 13.2825C13.1 13.6725 13.1 14.3125 12.71 14.7025C12.32 15.0925 11.68 15.0925 11.29 14.7025L7.3 10.7125C7.1 10.5125 7 10.2525 7 9.99253Z\"\n fill=\"currentColor\"\n />\n </svg>\n </button>\n );\n}\n\nfunction PaginationItem(props: { isActive: boolean; text: string; onClick: () => void }) {\n return (\n <button\n type=\"button\"\n onClick={props.onClick}\n className={cn('vchasno-ui-pagination__item', {\n ['vchasno-ui-pagination__item-active']: props.isActive,\n })}\n >\n {props.text}\n </button>\n );\n}\n"],"names":["BasePagination","props","hide","React","div","className","cn","PaginationArrowButton","type","onClick","onPrevClick","isDisabled","isPrevDisabled","isHidden","hidePrev","simple","composePaginationSteps","total","currentPage","map","item","Array","isArray","PaginationItem","key","isActive","onPrevGapClick","text","onNextGapClick","toString","onPageChange","onNextClick","isNextDisabled","hideNext","button","disabled","svg","style","transform","transformOrigin","undefined","width","height","viewBox","fill","xmlns","path","d"],"mappings":"mGA0BO,SAASA,EAAeC,CAA0B,SACrD,AAAIA,EAAMC,IAAI,CACH,KAIPC,EAACC,aAAAA,CAAAA,MAAAA,CAAIC,UAAWC,EAAG,wBAAyBL,EAAMI,SAAS,GACvDF,EAACI,aAAAA,CAAAA,EAAAA,CACGC,KAAK,OACLC,QAASR,EAAMS,WAAW,CAC1BC,WAAYV,EAAMW,cAAc,EAAI,CAAA,EACpCC,SAAUZ,EAAMa,QAAQ,EAAI,CAAA,CAE/B,GAAA,CAACb,EAAMc,MAAM,EACVC,EAAuBf,EAAMgB,KAAK,EAAI,EAAGhB,EAAMiB,WAAW,EAAEC,GAAG,CAAC,AAACC,GAC7D,AAAIC,MAAMC,OAAO,CAACF,GACd,AAAKA,CAAI,CAAC,EAAE,CAIRA,CAAI,CAAC,EAAE,CAAGnB,EAAMiB,WAAW,CAEvBf,EAACoB,aAAAA,CAAAA,EAAAA,CACGC,IAAI,OACJC,SAAU,CAAA,EACVhB,QAAS,IAAMR,EAAMyB,cAAc,KACnCC,KAAK,QAKTxB,EAACoB,aAAAA,CAAAA,EAAAA,CACGC,IAAI,OACJC,SAAU,CAAA,EACVhB,QAAS,IAAMR,EAAM2B,cAAc,KACnCD,KAAK,QAnBI,KAyBrBxB,EAACoB,aAAAA,CAAAA,EAAAA,CACGC,IAAKJ,EAAKS,QAAQ,GAClBJ,SAAUL,IAASnB,EAAMiB,WAAW,CACpCT,QAAS,IAAMR,EAAM6B,YAAY,GAAGV,GACpCO,KAAMP,EAAKS,QAAQ,MAInC1B,EAACI,aAAAA,CAAAA,EAAAA,CACGC,KAAK,OACLC,QAASR,EAAM8B,WAAW,CAC1BpB,WAAYV,EAAM+B,cAAc,EAAI,CAAA,EACpCnB,SAAUZ,EAAMgC,QAAQ,EAAI,CAAA,IAI5C,CAEA,SAAS1B,EAAsBN,CAK9B,EACG,OACIE,EAAC+B,aAAAA,CAAAA,SAAAA,CACG1B,KAAK,SACLC,QAASR,EAAMQ,OAAO,CACtB0B,SAAUlC,EAAMU,UAAU,CAC1BN,UAAWC,EAAG,8BAA+B,oCAAqC,CAC7E,uCAAyCL,EAAMU,UAAU,CACzD,qCAAuCV,EAAMY,QAAAA,AAClD,IAEAV,EAACiC,aAAAA,CAAAA,MAAAA,CAEGC,MACIpC,AAAe,SAAfA,EAAMO,IAAI,CACJ,CAAE8B,UAAW,iBAAkBC,gBAAiB,iBAChDC,KAAAA,EAEVC,MAAM,KACNC,OAAO,KACPC,QAAQ,YACRC,KAAK,OACLC,MAAM,8BAEN1C,EAAC2C,aAAAA,CAAAA,OAAAA,CACGC,EAAE,0SACFH,KAAK,kBAKzB,CAEA,SAASrB,EAAetB,CAA+D,EACnF,OACIE,EAAC+B,aAAAA,CAAAA,SAAAA,CACG1B,KAAK,SACLC,QAASR,EAAMQ,OAAO,CACtBJ,UAAWC,EAAG,8BAA+B,CACxC,qCAAuCL,EAAMwB,QAAAA,AAClD,EAECxB,EAAAA,EAAM0B,IAAI,CAGvB"}
|
|
1
|
+
{"version":3,"file":"BasePagination.js","sources":["../../../src/components/Pagination/BasePagination.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Combobox } from '@base-ui/react';\nimport cn from 'classnames';\n\nimport { composePaginationSteps } from './utils';\n\nimport './Pagination.global.css';\n\nconst DEFAULT_GAP_SEARCH_THRESHOLD = 7;\n\nexport interface BasePaginationProps {\n hide?: boolean;\n className?: string;\n currentPage: number;\n total?: number | null;\n onPageChange?: (page: number) => void;\n simple?: boolean;\n hideNext?: boolean;\n hidePrev?: boolean;\n /**\n * @deprecated Gap buttons now open a page picker instead of using click callbacks.\n */\n onPrevGapClick?: () => void;\n /**\n * @deprecated Gap buttons now open a page picker instead of using click callbacks.\n */\n onNextGapClick?: () => void;\n onPrevClick: () => void;\n onNextClick: () => void;\n isPrevDisabled?: boolean;\n isNextDisabled?: boolean;\n /**\n * @deprecated Gap buttons now open a page picker instead of jumping by a fixed step.\n */\n gapStep?: number;\n gapSearchThreshold?: number;\n}\n\nexport function BasePagination(props: BasePaginationProps) {\n if (props.hide) {\n return null;\n }\n\n return (\n <div\n className={cn('vchasno-ui-pagination', props.className, {\n ['vchasno-ui-pagination--simple']: props.simple,\n })}\n >\n <PaginationArrowButton\n type=\"prev\"\n onClick={props.onPrevClick}\n isDisabled={props.isPrevDisabled ?? false}\n isHidden={props.hidePrev ?? false}\n />\n {!props.simple && (\n <div className=\"vchasno-ui-pagination__pages\">\n {composePaginationSteps(props.total ?? 0, props.currentPage).map((item) => {\n if (Array.isArray(item)) {\n if (!item[0]) return null;\n // Це три крапки між сторінками і стрілочками:\n // < 1 ... 5 6 7 ... 20 >\n // ^^^ ^^^\n return (\n <PaginationGapPicker\n key={item[0] < props.currentPage ? 'prev' : 'next'}\n pages={item}\n onPageChange={props.onPageChange}\n searchThreshold={\n props.gapSearchThreshold ?? DEFAULT_GAP_SEARCH_THRESHOLD\n }\n />\n );\n }\n return (\n <PaginationItem\n key={item.toString()}\n isActive={item === props.currentPage}\n onClick={() => props.onPageChange?.(item)}\n text={item.toString()}\n />\n );\n })}\n </div>\n )}\n <PaginationArrowButton\n type=\"next\"\n onClick={props.onNextClick}\n isDisabled={props.isNextDisabled ?? false}\n isHidden={props.hideNext ?? false}\n />\n </div>\n );\n}\n\nfunction PaginationGapPicker(props: {\n pages: number[];\n onPageChange?: (page: number) => void;\n searchThreshold: number;\n}) {\n const singlePage = props.pages[0];\n\n if (props.pages.length === 1 && typeof singlePage === 'number') {\n return (\n <PaginationItem\n isActive={false}\n onClick={() => props.onPageChange?.(singlePage)}\n text=\"...\"\n />\n );\n }\n\n return <PaginationGapCombobox {...props} />;\n}\n\nfunction PaginationGapCombobox(props: {\n pages: number[];\n onPageChange?: (page: number) => void;\n searchThreshold: number;\n}) {\n const filter = Combobox.useFilter();\n const [open, setOpen] = React.useState(false);\n const [inputValue, setInputValue] = React.useState('');\n const shouldShowSearch = props.pages.length >= props.searchThreshold;\n\n const handleOpenChange = (nextOpen: boolean) => {\n setOpen(nextOpen);\n\n if (!nextOpen) {\n setInputValue('');\n }\n };\n\n const handleValueChange = (page: number | null) => {\n if (typeof page !== 'number') {\n return;\n }\n\n props.onPageChange?.(page);\n setOpen(false);\n setInputValue('');\n };\n\n return (\n <Combobox.Root<number>\n open={open}\n onOpenChange={handleOpenChange}\n value={null}\n onValueChange={handleValueChange}\n inputValue={inputValue}\n onInputValueChange={setInputValue}\n items={props.pages}\n filter={filter.contains}\n itemToStringLabel={(page) => page.toString()}\n modal={false}\n >\n <Combobox.Trigger type=\"button\" className=\"vchasno-ui-pagination__item\">\n ...\n </Combobox.Trigger>\n <Combobox.Portal>\n <Combobox.Positioner sideOffset={4} align=\"center\">\n <Combobox.Popup\n className={cn('vchasno-ui-pagination__gap-popup', {\n ['vchasno-ui-pagination__gap-popup--with-search']: shouldShowSearch,\n })}\n >\n {shouldShowSearch && (\n <div className=\"vchasno-ui-pagination__gap-search\">\n <SearchIcon />\n <Combobox.Input\n className=\"vchasno-ui-pagination__gap-search-input\"\n placeholder=\"Пошук\"\n />\n </div>\n )}\n <div className=\"vchasno-ui-pagination__gap-viewport\">\n {shouldShowSearch && (\n <Combobox.Empty>\n <div className=\"vchasno-ui-pagination__gap-empty\">\n <span\n className=\"vchasno-ui-pagination__gap-empty-icon\"\n aria-hidden=\"true\"\n >\n 🔍\n </span>\n <span>\n Сторінку\n <br />\n не знайдено\n </span>\n </div>\n </Combobox.Empty>\n )}\n <Combobox.List className=\"vchasno-ui-pagination__gap-list\">\n {(page: number, index: number) => (\n <Combobox.Item\n key={page}\n index={index}\n value={page}\n className=\"vchasno-ui-pagination__gap-option\"\n >\n {page}\n </Combobox.Item>\n )}\n </Combobox.List>\n </div>\n </Combobox.Popup>\n </Combobox.Positioner>\n </Combobox.Portal>\n </Combobox.Root>\n );\n}\n\nfunction PaginationArrowButton(props: {\n onClick: () => void;\n isDisabled: boolean;\n isHidden: boolean;\n type: 'prev' | 'next';\n}) {\n return (\n <button\n type=\"button\"\n onClick={props.onClick}\n disabled={props.isDisabled}\n className={cn('vchasno-ui-pagination__item', 'vchasno-ui-pagination__item-arrow', {\n ['vchasno-ui-pagination__item-disabled']: props.isDisabled,\n ['vchasno-ui-pagination__item-hidden']: props.isHidden,\n })}\n >\n <svg\n // Без стилів SVG зображує кнопку назад\n style={\n props.type === 'next'\n ? { transform: 'rotate(180deg)', transformOrigin: 'center center' }\n : undefined\n }\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7 9.99253C7 9.73253 7.1 9.48252 7.29 9.28253L11.29 5.29253C11.68 4.90253 12.32 4.90253 12.71 5.29253C13.1 5.68253 13.1 6.32253 12.71 6.71253L9.42 9.99253L12.71 13.2825C13.1 13.6725 13.1 14.3125 12.71 14.7025C12.32 15.0925 11.68 15.0925 11.29 14.7025L7.3 10.7125C7.1 10.5125 7 10.2525 7 9.99253Z\"\n fill=\"currentColor\"\n />\n </svg>\n </button>\n );\n}\n\nfunction PaginationItem(props: { isActive: boolean; text: string; onClick: () => void }) {\n return (\n <button\n type=\"button\"\n onClick={props.onClick}\n className={cn('vchasno-ui-pagination__item', {\n ['vchasno-ui-pagination__item-active']: props.isActive,\n })}\n >\n {props.text}\n </button>\n );\n}\n\nfunction SearchIcon() {\n return (\n <svg\n aria-hidden=\"true\"\n className=\"vchasno-ui-pagination__gap-search-icon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M7.333 12.667A5.333 5.333 0 1 1 7.333 2a5.333 5.333 0 0 1 0 10.667ZM7.333 3.333a4 4 0 1 0 0 8 4 4 0 0 0 0-8ZM13.333 14a.665.665 0 0 1-.473-.193l-2.14-2.14a.669.669 0 0 1 .947-.947l2.14 2.14a.667.667 0 0 1-.474 1.14Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n"],"names":["BasePagination","props","hide","React","div","className","cn","simple","PaginationArrowButton","type","onClick","onPrevClick","isDisabled","isPrevDisabled","isHidden","hidePrev","composePaginationSteps","total","currentPage","map","item","Array","isArray","PaginationGapPicker","key","pages","onPageChange","searchThreshold","gapSearchThreshold","PaginationItem","toString","isActive","text","onNextClick","isNextDisabled","hideNext","singlePage","length","PaginationGapCombobox","filter","Combobox","useFilter","open","setOpen","useState","inputValue","setInputValue","shouldShowSearch","createElement","Root","onOpenChange","nextOpen","value","onValueChange","page","onInputValueChange","items","contains","itemToStringLabel","modal","Trigger","Portal","Positioner","sideOffset","align","Popup","SearchIcon","Input","placeholder","Empty","span","aria-hidden","br","List","index","Item","button","disabled","svg","style","transform","transformOrigin","undefined","width","height","viewBox","fill","xmlns","path","d"],"mappings":"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"}
|
|
@@ -8,9 +8,13 @@ interface PaginationProps {
|
|
|
8
8
|
onChange?: (page: number) => void;
|
|
9
9
|
current?: number;
|
|
10
10
|
scrollOnChange?: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* @deprecated Gap buttons now open a page picker instead of jumping by a fixed step.
|
|
13
|
+
*/
|
|
11
14
|
gapStep?: number;
|
|
12
15
|
hideArrows?: boolean;
|
|
13
16
|
simple?: boolean;
|
|
17
|
+
gapSearchThreshold?: number;
|
|
14
18
|
}
|
|
15
19
|
declare const Pagination: React.FC<PaginationProps>;
|
|
16
20
|
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e,{useState as a}from"react";import{BasePagination as
|
|
1
|
+
import e,{useState as a}from"react";import{BasePagination as t}from"./BasePagination.js";let i=({className:i,initPage:o=1,total:l=1,hideOnSinglePage:r,onChange:n,current:s,scrollOnChange:c=!0,hideArrows:d=!1,simple:m=!1,gapSearchThreshold:P})=>{let[g,h]=a(s||o),p=s||g,N=e=>{h(e),n&&n(e),c&&e!==g&&window.scrollTo(0,0)};return isNaN(l)?(console.error('Component "Pagination" received invalid "total" data'),null):r&&l<=1?null:e.createElement(t,{className:i,currentPage:p,total:l,onPageChange:N,simple:m,hideNext:d&&!m,hidePrev:d&&!m,onPrevClick:()=>{1!==p&&N(p<=1?1:p-1)},onNextClick:()=>{p!==l&&N(p>=l?l:p+1)},isPrevDisabled:1===p,isNextDisabled:p===l,gapSearchThreshold:P})};export{i as default};
|
|
2
2
|
//# sourceMappingURL=Pagination.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.js","sources":["../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport { BasePagination } from './BasePagination';\n\nimport './Pagination.global.css';\n\nexport interface PaginationProps {\n className?: string;\n initPage?: number;\n total?: number;\n hideOnSinglePage?: boolean;\n onChange?: (page: number) => void;\n current?: number;\n scrollOnChange?: boolean;\n gapStep?: number;\n hideArrows?: boolean;\n simple?: boolean;\n}\n\nconst Pagination: React.FC<PaginationProps> = ({\n className,\n initPage = 1,\n total = 1,\n
|
|
1
|
+
{"version":3,"file":"Pagination.js","sources":["../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport { BasePagination } from './BasePagination';\n\nimport './Pagination.global.css';\n\nexport interface PaginationProps {\n className?: string;\n initPage?: number;\n total?: number;\n hideOnSinglePage?: boolean;\n onChange?: (page: number) => void;\n current?: number;\n scrollOnChange?: boolean;\n /**\n * @deprecated Gap buttons now open a page picker instead of jumping by a fixed step.\n */\n gapStep?: number;\n hideArrows?: boolean;\n simple?: boolean;\n gapSearchThreshold?: number;\n}\n\nconst Pagination: React.FC<PaginationProps> = ({\n className,\n initPage = 1,\n total = 1,\n hideOnSinglePage,\n onChange,\n current,\n scrollOnChange = true,\n hideArrows = false,\n simple = false,\n gapSearchThreshold,\n}) => {\n const [_currentPage, setCurrentPage] = useState(current || initPage);\n const currentPage = current || _currentPage;\n\n const setPage = (page: number) => {\n setCurrentPage(page);\n\n if (onChange) {\n onChange(page);\n }\n\n if (scrollOnChange && page !== _currentPage) {\n window.scrollTo(0, 0);\n }\n };\n\n if (isNaN(total)) {\n console.error('Component \"Pagination\" received invalid \"total\" data');\n return null;\n }\n\n if (hideOnSinglePage && total <= 1) {\n return null;\n }\n\n const handlePrevClick = () => {\n if (currentPage !== 1) {\n setPage(currentPage <= 1 ? 1 : currentPage - 1);\n }\n };\n\n const handleNextClick = () => {\n if (currentPage !== total) {\n setPage(currentPage >= total ? total : currentPage + 1);\n }\n };\n\n return (\n <BasePagination\n className={className}\n currentPage={currentPage}\n total={total}\n onPageChange={setPage}\n simple={simple}\n hideNext={hideArrows && !simple}\n hidePrev={hideArrows && !simple}\n onPrevClick={handlePrevClick}\n onNextClick={handleNextClick}\n isPrevDisabled={currentPage === 1}\n isNextDisabled={currentPage === total}\n gapSearchThreshold={gapSearchThreshold}\n />\n );\n};\n\nexport default Pagination;\n"],"names":["Pagination","className","initPage","total","hideOnSinglePage","onChange","current","scrollOnChange","hideArrows","simple","gapSearchThreshold","_currentPage","setCurrentPage","useState","currentPage","setPage","page","window","scrollTo","isNaN","console","error","React","BasePagination","onPageChange","hideNext","hidePrev","onPrevClick","onNextClick","isPrevDisabled","isNextDisabled"],"mappings":"yFAuBMA,IAAAA,EAAwC,CAAC,CAC3CC,UAAAA,CAAS,CACTC,SAAAA,EAAW,CAAC,CACZC,MAAAA,EAAQ,CAAC,CACTC,iBAAAA,CAAgB,CAChBC,SAAAA,CAAQ,CACRC,QAAAA,CAAO,CACPC,eAAAA,EAAiB,CAAA,CAAI,CACrBC,WAAAA,EAAa,CAAA,CAAK,CAClBC,OAAAA,EAAS,CAAA,CAAK,CACdC,mBAAAA,CAAkB,CACrB,IACG,GAAM,CAACC,EAAcC,EAAe,CAAGC,EAASP,GAAWJ,GACrDY,EAAcR,GAAWK,EAEzBI,EAAU,AAACC,IACbJ,EAAeI,GAEXX,GACAA,EAASW,GAGTT,GAAkBS,IAASL,GAC3BM,OAAOC,QAAQ,CAAC,EAAG,EAE3B,SAEA,AAAIC,MAAMhB,IACNiB,QAAQC,KAAK,CAAC,wDACP,MAGPjB,GAAoBD,GAAS,EACtB,KAgBPmB,EAACC,aAAAA,CAAAA,EAAAA,CACGtB,UAAWA,EACXa,YAAaA,EACbX,MAAOA,EACPqB,aAAcT,EACdN,OAAQA,EACRgB,SAAUjB,GAAc,CAACC,EACzBiB,SAAUlB,GAAc,CAACC,EACzBkB,YArBgB,KACA,IAAhBb,GACAC,EAAQD,GAAe,EAAI,EAAIA,EAAc,EAErD,EAkBQc,YAhBgB,KAChBd,IAAgBX,GAChBY,EAAQD,GAAeX,EAAQA,EAAQW,EAAc,EAE7D,EAaQe,eAAgBf,AAAgB,IAAhBA,EAChBgB,eAAgBhB,IAAgBX,EAChCO,mBAAoBA,GAGhC"}
|
package/dist/css/vchasno-ui.css
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
.vchasno-ui-pulse-animation{animation:box-shadow-pulse var(--vchasno-pulse-animation-duration) infinite;box-shadow:0 0 0 0 rgb(var(--vchasno-pulse-animation-color)/30%)}@keyframes box-shadow-pulse{0%{box-shadow:0 0 0 0 rgb(var(--vchasno-pulse-animation-color)/80%)}70%{box-shadow:0 0 0 10px rgb(var(--vchasno-pulse-animation-color)/0)}to{box-shadow:0 0 0 30px rgb(var(--vchasno-pulse-animation-color)/0)}}:root{--vchasno-ui-border-radius-none:0;--vchasno-ui-border-radius-xs:2px;--vchasno-ui-border-radius-sm:4px;--vchasno-ui-border-radius-md:8px;--vchasno-ui-border-radius-lg:12px;--vchasno-ui-border-radius-xl:16px;--vchasno-ui-border-radius-full:9999px;--vchasno-ui-font-size-2xs:10px;--vchasno-ui-font-size-xs:12px;--vchasno-ui-font-size-sm:14px;--vchasno-ui-font-size-md:16px;--vchasno-ui-font-size-lg:20px;--vchasno-ui-font-size-xl:24px;--vchasno-ui-font-size-2xl:32px;--vchasno-ui-font-weight-thin:100;--vchasno-ui-font-weight-extralight:200;--vchasno-ui-font-weight-light:300;--vchasno-ui-font-weight-regular:400;--vchasno-ui-font-weight-medium:500;--vchasno-ui-font-weight-semibold:600;--vchasno-ui-font-weight-bold:700;--vchasno-ui-font-weight-extrabold:800;--vchasno-ui-font-weight-black:900;--vchasno-ui-spacing-0:0px;--vchasno-ui-spacing-2:2px;--vchasno-ui-spacing-4:4px;--vchasno-ui-spacing-6:6px;--vchasno-ui-spacing-8:8px;--vchasno-ui-spacing-10:10px;--vchasno-ui-spacing-12:12px;--vchasno-ui-spacing-16:16px;--vchasno-ui-spacing-20:20px;--vchasno-ui-spacing-24:24px;--vchasno-ui-spacing-32:32px;--vchasno-ui-spacing-40:40px;--vchasno-ui-spacing-48:48px;--vchasno-ui-spacing-52:52px;--vchasno-ui-spacing-120:120px;--vchasno-ui-color-brand-ttn-25:#f2f3fa;--vchasno-ui-color-brand-ttn-50:#d9d6f6;--vchasno-ui-color-brand-ttn-100:#c6c0f2;--vchasno-ui-color-brand-ttn-200:#b4abef;--vchasno-ui-color-brand-ttn-300:#9f93eb;--vchasno-ui-color-brand-ttn-400:#8e7fe8;--vchasno-ui-color-brand-ttn-500:#7b69e4;--vchasno-ui-color-brand-ttn-600:#604adf;--vchasno-ui-color-brand-ttn-700:#5443bc;--vchasno-ui-color-brand-edo-25:#fffbf5;--vchasno-ui-color-brand-edo-50:#fff3e0;--vchasno-ui-color-brand-edo-100:#ffe8c2;--vchasno-ui-color-brand-edo-400:#ffb200;--vchasno-ui-color-brand-edo-500:#ff9c01;--vchasno-ui-color-brand-edo-600:#f58700;--vchasno-ui-color-brand-qes-25:#fff5f5;--vchasno-ui-color-brand-qes-50:#ffe9ea;--vchasno-ui-color-brand-qes-100:#ffd8d9;--vchasno-ui-color-brand-qes-200:#ffc0c2;--vchasno-ui-color-brand-qes-300:#ffaeb0;--vchasno-ui-color-brand-qes-400:#ff9a9d;--vchasno-ui-color-brand-qes-500:#ff878b;--vchasno-ui-color-brand-qes-600:#ff7c80;--vchasno-ui-color-brand-qes-700:#ff5a5f;--vchasno-ui-color-brand-qes-800:#e75459;--vchasno-ui-color-brand-kadry-25:#f8fcfb;--vchasno-ui-color-brand-kadry-50:#e4f3f1;--vchasno-ui-color-brand-kadry-100:#c7eae5;--vchasno-ui-color-brand-kadry-200:#b1e3dc;--vchasno-ui-color-brand-kadry-300:#9bdcd3;--vchasno-ui-color-brand-kadry-400:#86d5ca;--vchasno-ui-color-brand-kadry-500:#70cec1;--vchasno-ui-color-brand-kadry-600:#5bc7b8;--vchasno-ui-color-brand-kadry-700:#12747d;--vchasno-ui-color-brand-kadry-800:#07626a;--vchasno-ui-color-brand-zvit-25:#fff8f5;--vchasno-ui-color-brand-zvit-50:#ffe8db;--vchasno-ui-color-brand-zvit-100:#ffd7c2;--vchasno-ui-color-brand-zvit-200:#ffc7a8;--vchasno-ui-color-brand-zvit-300:#ffb68f;--vchasno-ui-color-brand-zvit-400:#ffa675;--vchasno-ui-color-brand-zvit-500:#ff955c;--vchasno-ui-color-brand-zvit-600:#ff8542;--vchasno-ui-color-brand-zvit-700:#ff752a;--vchasno-ui-color-brand-zvit-800:#f55d0b;--vchasno-ui-color-brand-edi-25:#f5f9ff;--vchasno-ui-color-brand-edi-50:#e0eeff;--vchasno-ui-color-brand-edi-100:#b8dafc;--vchasno-ui-color-brand-edi-200:#9cccfa;--vchasno-ui-color-brand-edi-300:#80bdf8;--vchasno-ui-color-brand-edi-400:#63aef6;--vchasno-ui-color-brand-edi-500:#469ff4;--vchasno-ui-color-brand-edi-600:#007cef;--vchasno-ui-color-brand-edi-700:#1a66c8;--vchasno-ui-color-brand-kasa-25:#fff5fb;--vchasno-ui-color-brand-kasa-50:#ffeff8;--vchasno-ui-color-brand-kasa-100:#ffd3eb;--vchasno-ui-color-brand-kasa-200:#ffc0e3;--vchasno-ui-color-brand-kasa-300:#ffb5de;--vchasno-ui-color-brand-kasa-400:#f39ecd;--vchasno-ui-color-brand-kasa-500:#e582b8;--vchasno-ui-color-brand-kasa-600:#ce6fa3;--vchasno-ui-color-utility-blue-25:#f5f9ff;--vchasno-ui-color-utility-blue-50:#ecf4ff;--vchasno-ui-color-utility-blue-100:#dbe9fa;--vchasno-ui-color-utility-blue-200:#4e9aff;--vchasno-ui-color-utility-blue-500:#1a66c8;--vchasno-ui-color-utility-blue-600:#14509e;--vchasno-ui-color-utility-blue-700:#124587;--vchasno-ui-color-utility-green-50:#f5fdec;--vchasno-ui-color-utility-green-100:#d3efc8;--vchasno-ui-color-utility-green-200:#abdf96;--vchasno-ui-color-utility-green-300:#1cb800;--vchasno-ui-color-utility-green-400:#138000;--vchasno-ui-color-utility-red-50:#fee;--vchasno-ui-color-utility-red-100:#ffd8d6;--vchasno-ui-color-utility-red-200:#fb7a7a;--vchasno-ui-color-utility-red-300:#f54f4f;--vchasno-ui-color-utility-red-400:#c1261a;--vchasno-ui-color-utility-orange-50:#fff2d6;--vchasno-ui-color-utility-orange-100:#ffebcc;--vchasno-ui-color-utility-orange-400:#ffb200;--vchasno-ui-color-utility-orange-500:#f58700;--vchasno-ui-color-gray-0:#fff;--vchasno-ui-color-gray-25:#f3f8fb;--vchasno-ui-color-gray-50:#e2e9f3;--vchasno-ui-color-gray-100:#bfcede;--vchasno-ui-color-gray-200:#9aaabf;--vchasno-ui-color-gray-300:#8194ac;--vchasno-ui-color-gray-400:#6e809a;--vchasno-ui-color-gray-500:#3b4250;--vchasno-ui-color-gray-600:#252d3d;--vchasno-ui-color-gray-700:#1d1d1f;--vchasno-ui-color-surface-disabled-subtle:var(--vchasno-ui-color-gray-25);--vchasno-ui-color-surface-disabled-default:var(--vchasno-ui-color-gray-50);--vchasno-ui-color-surface-disabled-strong:var(--vchasno-ui-color-gray-100);--vchasno-ui-color-surface-disabled-1:var(--vchasno-ui-color-gray-200);--vchasno-ui-color-surface-success-muted:var(--vchasno-ui-color-utility-green-50);--vchasno-ui-color-surface-success-subtle:var(--vchasno-ui-color-utility-green-100);--vchasno-ui-color-surface-success-default:var(--vchasno-ui-color-utility-green-300);--vchasno-ui-color-surface-error-muted:var(--vchasno-ui-color-utility-red-50);--vchasno-ui-color-surface-error-subtle:var(--vchasno-ui-color-utility-red-100);--vchasno-ui-color-surface-error-default:var(--vchasno-ui-color-utility-red-300);--vchasno-ui-color-surface-info-muted:var(--vchasno-ui-color-utility-blue-50);--vchasno-ui-color-surface-info-subtle:var(--vchasno-ui-color-utility-blue-100);--vchasno-ui-color-surface-info-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-surface-warning-muted:var(--vchasno-ui-color-utility-orange-50);--vchasno-ui-color-surface-warning-subtle:var(--vchasno-ui-color-utility-orange-100);--vchasno-ui-color-surface-warning-default:var(--vchasno-ui-color-utility-orange-400);--vchasno-ui-color-surface-accent-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-content-disabled-default:var(--vchasno-ui-color-gray-200);--vchasno-ui-color-content-accent-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-content-error-default:var(--vchasno-ui-color-utility-red-400);--vchasno-ui-color-content-info-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-content-success-default:var(--vchasno-ui-color-utility-green-400);--vchasno-ui-color-content-warning-default:var(--vchasno-ui-color-utility-orange-500);--vchasno-ui-color-border-accent-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-border-error-default:var(--vchasno-ui-color-utility-red-300);--vchasno-ui-color-border-success-default:var(--vchasno-ui-color-utility-green-300);--vchasno-ui-color-border-warning-default:var(--vchasno-ui-color-utility-orange-400);--vchasno-ui-transition-duration-sec:0.3s;--vchasno-ui-btn-default-bg:transparent;--vchasno-ui-btn-default-hover-bg:#e1e4ff;--vchasno-ui-btn-default-color:#6e809a;--vchasno-ui-btn-disabled-color:#6e809a;--vchasno-ui-btn-default-hover-color:#604adf;--vchasno-ui-btn-primary-bg:#604adf;--vchasno-ui-btn-primary-disabled-bg:#e2e9f3;--vchasno-ui-btn-primary-hover-bg:#3f328c;--vchasno-ui-btn-primary-color:#fff;--vchasno-ui-btn-secondary-bg:hsla(0,0%,100%,.04);--vchasno-ui-btn-secondary-disabled-bg:#f3f8fb;--vchasno-ui-btn-pink-bg:#ff5a5f;--vchasno-ui-btn-pink-hover-bg:#e75459;--vchasno-ui-btn-secondary-border-color:#e2e9f3;--vchasno-ui-btn-secondary-hover-bg:#e0eeff;--vchasno-ui-btn-secondary-color:var(--vchasno-ui-color-border-accent-default);--vchasno-ui-btn-light-bg:#fff;--vchasno-ui-btn-light-hover-bg:rgba(96,74,223,.2);--vchasno-ui-btn-light-color:#604adf;--vchasno-ui-btn-font-size:14px;--vchasno-ui-btn-danger-color:#f54f4f;--vchasno-ui-btn-danger-bg:rgba(231,52,52,.1);--vchasno-ui-btn-danger-hover-bg:#f54f4f;--vchasno-ui-btn-danger-hover-color:#fff;--vchasno-ui-input-bg-color:#fff;--vchasno-ui-input-bg-color-disabled:#f3f8fb;--vchasno-ui-input-border-color-default:#e2e9f3;--vchasno-ui-input-border-color-focused:#1a66c8;--vchasno-ui-input-outline-color-focused:rgba(196,233,255,.4);--vchasno-ui-input-outline-color-error:#ffeaeb;--vchasno-ui-input-color-error:#f54f4f;--vchasno-ui-input-bg-error:hsla(1,82%,66%,.1);--vchasno-ui-input-font-size:14px;--vchasno-ui-input-font-color:#252d3d;--vchasno-ui-input-placeholder-color:#6e809a;--vchasno-ui-input-font-color-disabled:#bfcede;--vchasno-ui-label-color-default:#6e809a;--vchasno-ui-label-color-focused:#1a66c8;--vchasno-ui-checkbox-bg-color:var(--vchasno-ui-color-surface-accent-default);--vchasno-ui-checkbox-outline-color:rgba(196,233,255,.4);--vchasno-ui-checkbox-disabled-bg:#bfcede;--vchasno-ui-checkbox-border-color:#bfcede;--vchasno-ui-checkbox-icon-color:#fff;--vchasno-ui-checkbox-font-size:14px;--vchasno-ui-select-option-bg-selected:#f3f8fb;--vchasno-ui-select-option-color-selected:#252d3d;--vchasno-ui-select-menu-border-color:transparent;--vchasno-ui-calendar-color:#6b5fff;--vchasno-ui-calendar-select-color:#1a66c8;--vchasno-ui-calendar-default-icon-color:#6e809a;--vchasno-ui-calendar-bg-hover:#ff9c01;--vchasno-ui-text-primary-color:#252d3d;--vchasno-ui-text-secondary-color:#5a6a81;--vchasno-ui-text-success-color:#1cb800;--vchasno-ui-text-warning-color:#ff9c01;--vchasno-ui-text-error-color:#f54f4f;--vchasno-ui-text-link-color:var(--vchasno-ui-color-content-accent-default);--vchasno-ui-alert-info-color:#1a66c8;--vchasno-ui-alert-info-bg:#e0eeff;--vchasno-ui-alert-warning-color:#ff9c01;--vchasno-ui-alert-warning-bg:#fff2d6;--vchasno-ui-alert-error-color:#f54f4f;--vchasno-ui-alert-error-bg:#ffe8e8;--vchasno-ui-alert-success-color:#1cb800;--vchasno-ui-alert-success-bg:#e7f3d9;--vchasno-ui-alert-config-color:#1a66c8;--vchasno-ui-alert-config-bg:#f3f8fb;--vchasno-ui-tabs-active-color:var(--vchasno-ui-color-surface-accent-default);--vchasno-ui-pagination-border-color:#1a66c8;--vchasno-ui-pagination-hover-bg-color:rgba(0,0,0,.1);--vchasno-ui-pagination-focus-shadow-color:rgba(196,233,255,.4);--vchasno-ui-pagination-size:32px;--vchasno-ui-switch-height:30px;--vchasno-ui-switch-color-bg:#bfcede;--vchasno-ui-switch-spinner-color:#bfcede;--vchasno-ui-switch-circle-color:#fff;--vchasno-ui-switch-active-color-bg:var(--vchasno-ui-color-surface-accent-default);--vchasno-ui-pulse-dot-color:#604adf;--vchasno-ui-pulse-dot-size:35px;--vchasno-ui-menu-button-bg:#f3f8fb;--vchasno-ui-menu-item-hover-bg:#f3f8fb;--vchasno-ui-slider-color:var(--vchasno-ui-color-surface-accent-default);--vchasno-ui-slider-thumb-box-shadow-color:rgba(196,233,255,.4);--vchasno-ui-tooltip-font-size:14px;--vchasno-ui-tooltip-line-height:18px;--vchasno-ui-tooltip-padding:10px;--vchasno-ui-tooltip-bg-mui:rgba(37,45,61,.9);--vchasno-ui-tooltip-text-color:#fff;--vchasno-ui-snackbar-color-light:#fff;--vchasno-ui-snackbar-color-dark:#fff;--vchasno-ui-snackbar-color-info:#1a66c8;--vchasno-ui-snackbar-color-success:#1cb800;--vchasno-ui-snackbar-color-warning:#ff9c01;--vchasno-ui-snackbar-color-error:#f54f4f;--vchasno-ui-snackbar-color-transparent:hsla(0,0%,100%,.7);--vchasno-ui-snackbar-icon-color-info:var(--vchasno-ui-snackbar-color-info);--vchasno-ui-snackbar-icon-color-success:var(--vchasno-ui-snackbar-color-success);--vchasno-ui-snackbar-icon-color-warning:var(--vchasno-ui-snackbar-color-warning);--vchasno-ui-snackbar-icon-color-error:var(--vchasno-ui-snackbar-color-error);--vchasno-ui-snackbar-toast-min-width:335px;--vchasno-ui-snackbar-toast-width:auto;--vchasno-ui-snackbar-toast-max-width:560px;--vchasno-ui-snackbar-toast-offset:16px;--vchasno-ui-snackbar-toast-top:max(var(--vchasno-ui-snackbar-toast-offset),env(safe-area-inset-top));--vchasno-ui-snackbar-toast-right:max(var(--vchasno-ui-snackbar-toast-offset),env(safe-area-inset-right));--vchasno-ui-snackbar-toast-left:max(var(--vchasno-ui-snackbar-toast-offset),env(safe-area-inset-left));--vchasno-ui-snackbar-toast-bottom:max(var(--vchasno-ui-snackbar-toast-offset),env(safe-area-inset-bottom));--vchasno-ui-snackbar-toast-background:rgba(0,0,0,.9);--vchasno-ui-snackbar-toast-min-height:24px;--vchasno-ui-snackbar-toast-max-height:800px;--vchasno-ui-snackbar-toast-bd-radius:var(--vchasno-ui-border-radius-md);--vchasno-ui-snackbar-font-family:sans-serif;--vchasno-ui-snackbar-z-index:9999;--vchasno-ui-snackbar-text-color-light:#757575;--vchasno-ui-snackbar-text-color-dark:#fff;--vchasno-ui-snackbar-text-color-info:#fff;--vchasno-ui-snackbar-text-color-success:#fff;--vchasno-ui-snackbar-text-color-warning:#fff;--vchasno-ui-snackbar-text-color-error:#fff;--vchasno-ui-snackbar-spinner-color:#616161;--vchasno-ui-snackbar-spinner-color-empty-area:#e0e0e0;--vchasno-ui-snackbar-color-progress-light:linear-gradient(90deg,#4cd964,#5ac8fa,#007aff,#34aadc,#5856d6,#ff2d55);--vchasno-ui-snackbar-color-progress-dark:#bb86fc;--vchasno-ui-snackbar-color-progress-info:var(--vchasno-ui-snackbar-color-info);--vchasno-ui-snackbar-color-progress-success:var(--vchasno-ui-snackbar-color-success);--vchasno-ui-snackbar-color-progress-warning:var(--vchasno-ui-snackbar-color-warning);--vchasno-ui-snackbar-color-progress-error:var(--vchasno-ui-snackbar-color-error);--vchasno-ui-snackbar-color-progress-bgo:0.2;--vchasno-ui-snackbar-action-button-color:#0094ff;--vchasno-pulse-animation-color:107 95 255;--vchasno-pulse-animation-duration:1.5s;--vchasno-ui-full-screen-modal-z-index:998;--vchasno-ui-full-screen-modal-header-height:60px;--vchasno-ui-full-screen-modal-bg-color:#fff}[data-brand=edo]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-edo-500);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-edo-500);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-edo-600);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-edo-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-edo-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-edo-500)}[data-brand=qes]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-qes-700);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-qes-700);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-qes-800);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-qes-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-qes-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-qes-700)}[data-brand=ttn]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-ttn-500);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-ttn-600);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-ttn-700);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-ttn-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-ttn-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-ttn-500)}[data-brand=kadry]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-kadry-700);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-kadry-700);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-kadry-800);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-kadry-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-kadry-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-kadry-700)}[data-brand=zvit]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-zvit-600);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-zvit-700);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-zvit-800);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-zvit-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-zvit-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-zvit-600)}[data-brand=edi]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-edi-600);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-edi-600);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-edi-700);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-edi-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-edi-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-edi-600)}[data-brand=kasa]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-kasa-500);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-kasa-500);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-kasa-600);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-kasa-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-kasa-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-kasa-500)}.vchasno-ui-scrollable-box{-webkit-overflow-scrolling:touch;box-sizing:border-box;max-height:unset}.vchasno-ui-scrollable-box__shadow{display:block;height:0;pointer-events:none;position:sticky;width:100%;z-index:2}.vchasno-ui-scrollable-box__shadow:after{content:"";display:block;height:10px;left:0;position:absolute;right:0}.vchasno-ui-scrollable-box__shadow.--top{top:0}.vchasno-ui-scrollable-box__shadow.--top:after{box-shadow:inset 0 10px 10px -10px rgba(0,0,0,.1);top:0}.vchasno-ui-scrollable-box__shadow.--bottom{bottom:0}.vchasno-ui-scrollable-box__shadow.--bottom:after{bottom:0;box-shadow:inset 0 -10px 10px -10px rgba(0,0,0,.1)}.vchasno-ui-scrollable-box.--is-scrollable{overflow-y:auto;transform:translateZ(0)}.vchasno-ui-scrollable-box.--hide-scroll{-ms-overflow-style:none;scrollbar-width:none}.vchasno-ui-scrollable-box.--hide-scroll::-webkit-scrollbar{display:none}.vchasno-ui-scrollable-box.--prevent-parent-scroll{overscroll-behavior-y:contain}.vchasno-ui-scrollable-box.--smooth-scroll{scroll-behavior:smooth}.vchasno-ui-full-screen-modal{background-color:var(--vchasno-ui-full-screen-modal-bg-color);height:100%;left:0;position:fixed;top:0;width:100%;z-index:var(--vchasno-ui-full-screen-modal-z-index)}.vchasno-ui-full-screen-modal__header{align-items:center;border-bottom:1px solid var(--vchasno-ui-input-border-color-default);box-sizing:border-box;display:flex;height:var(--vchasno-ui-full-screen-modal-header-height);justify-content:space-between;padding-left:20px;padding-right:20px}.vchasno-ui-full-screen-modal__content{box-sizing:border-box;height:calc(100% - var(--vchasno-ui-full-screen-modal-header-height));overflow-y:auto}.vchasno-ui-full-screen-modal--animation{animation:vchasno-full-screen-modal-show var(--vchasno-ui-transition-duration-sec) ease-in-out}@keyframes vchasno-full-screen-modal-show{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.vchasno-ui-overflow-hidden{overflow:hidden}.vchasno-ui-alert{align-items:center;border-left:3px solid transparent;border-radius:var(--vchasno-ui-border-radius-sm);box-sizing:border-box;display:inline-flex;flex-shrink:0;font-size:14px;gap:12px;line-height:20px;min-height:40px;padding:12px 16px}.vchasno-ui-alert b,.vchasno-ui-alert strong{font-weight:700}.vchasno-ui-alert.--wide{width:100%}.vchasno-ui-alert.--left-border{border-left-width:4px}.vchasno-ui-alert__close-icon,.vchasno-ui-alert__icon-wrapper{align-items:center;display:flex;flex-shrink:0;font-size:20px;height:20px;justify-content:center;line-height:20px;width:20px}.vchasno-ui-alert.--info{background-color:var(--vchasno-ui-alert-info-bg,#e0eeff);border-color:var(--vchasno-ui-alert-info-color,#1a66c8)}.vchasno-ui-alert.--warning{background-color:var(--vchasno-ui-alert-warning-bg,#fff2d6);border-color:var(--vchasno-ui-alert-warning-color,#ff9c01)}.vchasno-ui-alert.--error{background-color:var(--vchasno-ui-alert-error-bg,#ffe8e8);border-color:var(--vchasno-ui-alert-error-color,#f54f4f)}.vchasno-ui-alert.--success{background-color:var(--vchasno-ui-alert-success-bg,#e7f3d9);border-color:var(--vchasno-ui-alert-success-color,#00b700)}.vchasno-ui-alert.--config{background-color:var(--vchasno-ui-alert-config-bg,#f3f8fb);border-color:var(--vchasno-ui-alert-config-color,#1a66c8)}.vchasno-ui-alert__close-icon{border-radius:var(--vchasno-ui-border-radius-sm);height:30px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s);width:30px}.vchasno-ui-alert__close-icon:hover{background-color:hsla(0,0%,100%,.5);cursor:pointer}.vchasno-ui-alert.--close{display:none}.vchasno-ui-BubbleBox{--vchasno-ui-bubble-height:40px;--vchasno-ui-bubble-width:40px;--vchasno-ui-bubble-shadow:2px 4px 6px rgba(0,0,0,.2);box-sizing:border-box;min-height:calc(var(--vchasno-ui-bubble-height)*2);position:relative}.vchasno-ui-BubbleBox,.vchasno-ui-BubbleBox__svg{transition:var(--vchasno-ui-transition-duration-sec)}.vchasno-ui-BubbleBox__svg{left:0;overflow:visible;pointer-events:none;position:absolute;top:0;transform:translateZ(0);z-index:-1}.vchasno-ui-BubbleBox__svg path{transition:var(--vchasno-ui-transition-duration-sec)}.vchasno-ui-BubbleBox__svg.vchasno-ui-BubbleBox__shadow{filter:drop-shadow(var(--vchasno-ui-bubble-shadow))}.vchasno-ui-BubbleBox__bubble{align-items:center;border:0;border-radius:var(--vchasno-ui-border-radius-full);bottom:0;cursor:pointer;display:flex;height:var(--vchasno-ui-bubble-height);justify-content:center;margin:0;padding:0;position:absolute;right:0;transition:var(--vchasno-ui-transition-duration-sec);width:var(--vchasno-ui-bubble-width);z-index:1}.vchasno-ui-spinner{display:inline-block;height:20px;position:relative;width:20px}.vchasno-ui-spinner__svg{height:100%;inset:0;margin:auto;pointer-events:none;position:absolute;transform-origin:center center;width:100%}.vchasno-ui-spinner--circle .vchasno-ui-spinner__svg{animation:spinner-rotate 1.3s linear infinite}.vchasno-ui-spinner--circle .vchasno-ui-spinner__svg__circle{stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;stroke-width:5px;animation:spinner-rotate-dash 2s ease-in-out infinite}.vchasno-ui-spinner--logo .vchasno-ui-spinner__svg__path{stroke-dasharray:200;stroke-dashoffset:200;animation:spinner-logo-draw 2s ease-in-out infinite alternate,spinner-logo-pulse 2s linear infinite;animation-delay:0s,1s}.vchasno-ui-spinner--logo .vchasno-ui-spinner__svg{transform:scale(2)}@keyframes spinner-rotate{to{transform:rotate(1turn)}}@keyframes spinner-rotate-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}@keyframes spinner-logo-draw{0%{stroke-dashoffset:195}to{stroke-dashoffset:0}}@keyframes spinner-logo-pulse{0%,50%,to{opacity:1}25%,75%{opacity:.5}}.vchasno-ui-button{align-items:center;background-color:var(--vchasno-ui-btn-default-bg);border:0;border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-btn-default-color);display:inline-flex;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;gap:5px;justify-content:center;min-height:40px;transition:min-height var(--vchasno-ui-transition-duration-sec,.3s),padding var(--vchasno-ui-transition-duration-sec,.3s),background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s);user-select:none}.vchasno-ui-button:disabled{cursor:not-allowed;opacity:.8}.vchasno-ui-button:not(:disabled):hover{background-color:var(--vchasno-ui-btn-default-hover-bg);color:var(--vchasno-ui-btn-default-hover-color);cursor:pointer}.vchasno-ui-button.--sm{min-width:40px;padding:0 15px}.vchasno-ui-button.--md{min-width:40px;padding:0 24px}.vchasno-ui-button.--lg{min-height:50px;min-width:50px;padding:0 32px}.vchasno-ui-button.--wide{width:100%}.vchasno-ui-button.--primary{background-color:var(--vchasno-ui-btn-primary-bg);border:1px solid transparent;color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-button.--primary.--outline{background-color:transparent;border:1px solid var(--vchasno-ui-btn-primary-bg);box-shadow:none;color:var(--vchasno-ui-btn-primary-bg)}.vchasno-ui-button.--secondary{background-color:var(--vchasno-ui-btn-secondary-bg);border:1px solid var(--vchasno-ui-btn-secondary-border-color);color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-button:disabled.--pink,.vchasno-ui-button:disabled.--primary,.vchasno-ui-button:disabled.--secondary{color:var(--vchasno-ui-btn-disabled-color)}.vchasno-ui-button:disabled.--primary{background-color:var(--vchasno-ui-btn-primary-disabled-bg)}.vchasno-ui-button:disabled.--secondary{background-color:var(--vchasno-ui-btn-secondary-disabled-bg)}.vchasno-ui-button.--primary:not(:disabled):hover{background-color:var(--vchasno-ui-btn-primary-hover-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-button.--primary.--outline:not(:disabled):hover{background-color:var(--vchasno-ui-btn-default-hover-bg);border:1px solid var(--vchasno-ui-btn-primary-bg);color:var(--vchasno-ui-btn-primary-bg)}.vchasno-ui-button.--secondary.--outline{background-color:transparent;border:1px solid var(--vchasno-ui-btn-secondary-bg);box-shadow:none;color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-button.--secondary:not(:disabled):hover{background-color:var(--vchasno-ui-btn-secondary-hover-bg);color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-button.--pink{background-color:var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-button.--pink.--outline{background-color:transparent;border:1px solid var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-pink-bg)}.vchasno-ui-button.--pink:disabled{background-color:var(--vchasno-ui-btn-primary-disabled-bg)}.vchasno-ui-button.--pink:not(:disabled):hover{background-color:var(--vchasno-ui-btn-pink-hover-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-button.--pink.--outline:not(:disabled):hover{background-color:transparent;border:1px solid var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-pink-bg)}.vchasno-ui-button.--danger{background-color:var(--vchasno-ui-btn-danger-bg);border:0;color:var(--vchasno-ui-btn-danger-color)}.vchasno-ui-button.--danger.--outline{background-color:transparent;border:1px solid var(--vchasno-ui-btn-danger-color);color:var(--vchasno-ui-btn-danger-color)}.vchasno-ui-button:disabled.--danger{background-color:rgba(182,202,219,.2);border:1px solid #bfcede;color:#bfcede}.vchasno-ui-button.--danger:not(:disabled):hover{background-color:var(--vchasno-ui-btn-danger-hover-bg);color:var(--vchasno-ui-btn-danger-hover-color)}.vchasno-ui-button.--danger.--outline:not(:disabled):hover{background-color:rgba(0,0,0,.1);border:1px solid var(--vchasno-ui-btn-danger-color,#ef6562);color:var(--vchasno-ui-btn-danger-color,#ef6562)}.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-btn-default-color);transition:stroke var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-btn-default-hover-color)}.vchasno-ui-button:disabled.--transparent{color:#bfcede}.vchasno-ui-button.--light{background-color:var(--vchasno-ui-btn-light-bg,#fff);border:1px solid transparent;color:var(--vchasno-ui-btn-light-color)}.vchasno-ui-button:disabled.--light{background-color:rgba(182,202,219,.2);border:none;color:#bfcede}.vchasno-ui-button.--light.--outline{background-color:var(--vchasno-ui-btn-primary-color);border:1px solid var(--vchasno-ui-btn-primary-bg);color:var(--vchasno-ui-btn-primary-bg)}.vchasno-ui-button.--light:not(:disabled):hover{background-color:var(--vchasno-ui-btn-light-hover-bg);color:var(--vchasno-ui-btn-primary-bg)}.vchasno-ui-button.--suppress-padding{padding:0}.vchasno-ui-checkbox{align-items:center;cursor:pointer;display:inline-flex;gap:8px;user-select:none}.vchasno-ui-checkbox__box{align-items:center;border:1px solid var(--vchasno-ui-checkbox-border-color);border-radius:var(--vchasno-ui-border-radius-xs);display:inline-flex;flex-shrink:0;height:16px;justify-content:center;outline:2px solid transparent;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),border var(--vchasno-ui-transition-duration-sec,.3s),outline var(--vchasno-ui-transition-duration-sec,.3s);width:16px}.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-checkbox-bg-color)}.vchasno-ui-checkbox__svg{color:transparent;transform:scale(0) translateZ(0);transition:color var(--vchasno-ui-transition-duration-sec),transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(.12,.4,.29,1.46)}.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg{display:none}.vchasno-ui-checkbox>input:checked+.vchasno-ui-checkbox__box{background-color:var(--vchasno-ui-checkbox-bg-color);border-color:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-checkbox>input:checked+.vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg{color:var(--vchasno-ui-checkbox-icon-color);transform:scale(1) translateZ(0)}.vchasno-ui-checkbox.--hover>input:not(:disabled)+.vchasno-ui-checkbox__box,.vchasno-ui-checkbox:hover>input:not(:disabled)+.vchasno-ui-checkbox__box,.vchasno-ui-checkbox>input:not(:disabled):active+.vchasno-ui-checkbox__box{border-color:var(--vchasno-ui-input-border-color-focused);outline:2px solid var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-checkbox>input:disabled:checked+.vchasno-ui-checkbox__box{background-color:var(--vchasno-ui-checkbox-disabled-bg,#bfcede);border-color:var(--vchasno-ui-checkbox-disabled-bg,#bfcede)}.vchasno-ui-checkbox>input:disabled:not(:checked)+.vchasno-ui-checkbox__box{border-color:var(--vchasno-ui-checkbox-disabled-border-color,#e2e9f3)}.vchasno-ui-checkbox>input:checked+.vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-checkbox-icon-color)}.vchasno-ui-checkbox__label{font-size:var(--vchasno-ui-checkbox-font-size);line-height:1;user-select:none}.vchasno-ui-checkbox.--disabled{color:var(--vchasno-ui-checkbox-disabled-bg,#bfcede);cursor:not-allowed}.vchasno-ui-meta{display:block;font-size:calc(var(--vchasno-ui-input-font-size)*.8);height:calc(var(--vchasno-ui-input-font-size)*.9);line-height:calc(var(--vchasno-ui-input-font-size)*.9);max-width:100%;padding-left:16px}.vchasno-ui-meta__error,.vchasno-ui-meta__hint{display:inline-block;max-width:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-meta__hint{color:var(--vchasno-ui-label-color-default)}.vchasno-ui-meta__error{color:var(--vchasno-ui-input-color-error)}.vchasno-ui-label-text{align-self:flex-start;background-color:var(--vchasno-ui-input-bg-color);border-radius:var(--vchasno-ui-border-radius-sm);color:var(--vchasno-ui-label-color-default);display:inline-flex;font-size:var(--vchasno-ui-input-font-size);gap:3px;left:12px;line-height:calc(var(--vchasno-ui-input-font-size)*1.2);max-width:calc(100% - 20px);padding:0 4px;pointer-events:none;position:absolute;text-overflow:ellipsis;top:50%;transform:translateY(-50%);transition:color var(--vchasno-ui-transition-duration-sec,.3s),top .3s,font-size .3s;white-space:nowrap;z-index:1}.vchasno-ui-select .vchasno-ui-label-text{max-width:calc(100% - 40px)}.vchasno-ui-select__floating-label,[class^=vchasno-ui-]:focus:not(.--disabled,[aria-hidden])+*+.vchasno-ui-label-text,[class^=vchasno-ui-]:focus:not(.--disabled,[aria-hidden])+.vchasno-ui-label-text,[class^=vchasno-ui-]:not(:placeholder-shown,[aria-hidden])+*+.vchasno-ui-label-text,[class^=vchasno-ui-]:not(:placeholder-shown,[aria-hidden])+.vchasno-ui-label-text{background-color:var(--vchasno-ui-input-bg-color);font-size:12px;top:0}.vchasno-ui-date-picker.--disabled:not(.--not-empty) .vchasno-ui-label-text,.vchasno-ui-input__wrapper:has(input:disabled):has(:placeholder-shown) .vchasno-ui-label-text,.vchasno-ui-select:not(:has(.vchasno-ui-select__value-container--has-value)).--disabled .vchasno-ui-label-text{background-color:var(--vchasno-ui-input-bg-color-disabled)}label[class^=vchasno-ui-]:not(.--error):focus-within .vchasno-ui-label-text{color:var(--vchasno-ui-label-color-focused)}label[class^=vchasno-ui-]:not(.--disabled).--error .vchasno-ui-label-text{color:var(--vchasno-ui-input-color-error)}label[class^=vchasno-ui-]:not(.--disabled).--required .vchasno-ui-label-text:hover{cursor:text}.vchasno-ui-label-text sup{color:var(--vchasno-ui-input-color-error);display:none;font-size:calc(var(--vchasno-ui-input-font-size)*1.4);position:relative;top:-.2em;vertical-align:top}label[class^=vchasno-ui-].--required .vchasno-ui-label-text sup{display:inline-block}.vchasno-ui-label-text__title-icon{color:var(--vchasno-ui-label-color-default);display:none;transform:scale(.8)}.vchasno-ui-input[title] .vchasno-ui-label-text__title-icon{display:block}.vchasno-ui-label-text__content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.react-datepicker__triangle{left:50px;position:absolute}.react-datepicker-popper[data-placement^=bottom]{margin-top:-6px}.react-datepicker-popper[data-placement^=top]{margin-top:6px}.react-datepicker-popper[data-placement^=right]{margin-left:-6px}.react-datepicker-popper[data-placement^=left]{margin-left:6px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker__month-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow{margin-left:-6px;position:absolute}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:before,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow:before,.react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow:before{border:6px solid transparent;box-sizing:content-box;height:0;position:absolute;width:1px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:before,.react-datepicker__month-read-view--down-arrow:before,.react-datepicker__year-read-view--down-arrow:before{border-bottom-color:var(--vchasno-ui-calendar-color);border-width:6px;content:"";left:-6px;z-index:-1}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{margin-top:-6px;top:0}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:before{border-bottom-color:var(--vchasno-ui-input-bg-color);border-top:none}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:before{border-bottom-color:var(--vchasno-ui-calendar-color);top:-1px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:after{background-color:var(--vchasno-ui-input-bg-color);content:"";display:block;height:7px;left:-3px;position:absolute;top:1px;transform:rotate(45deg);width:7px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker__month-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow{bottom:0;margin-bottom:-6px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:before,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow:before,.react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow:before{border-bottom:none;border-top-color:var(--vchasno-ui-input-bg-color)}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:before,.react-datepicker__month-read-view--down-arrow:before,.react-datepicker__year-read-view--down-arrow:before{border-top-color:var(--vchasno-ui-calendar-color);bottom:-1px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:after{background-color:var(--vchasno-ui-input-bg-color);bottom:1px;content:"";display:block;height:7px;left:-3px;position:absolute;transform:rotate(45deg);width:7px}.react-datepicker{background-color:var(--vchasno-ui-input-bg-color);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-shadow:0 4px 10px 0 #252d3d26;color:var(--vchasno-ui-input-font-color);display:inline-flex;font-size:14px;padding:10px;position:relative}.react-datepicker__time-container{float:right;width:85px}.react-datepicker__time-container--with-today-button{border:1px solid #aeaeae;border-radius:var(--vchasno-ui-border-radius-sm);display:inline;position:absolute;right:-87px;top:0}.react-datepicker__time-container .react-datepicker__time{background:#fff;border-bottom-right-radius:var(--vchasno-ui-border-radius-sm);position:relative}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box{border-bottom-right-radius:var(--vchasno-ui-border-radius-sm);margin:0 auto;overflow-x:hidden;text-align:center;width:85px}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list{box-sizing:content-box;height:calc(195px + .85rem);list-style:none;margin:0;overflow-y:scroll;padding-left:0;padding-right:0;width:100%}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item{border-radius:var(--vchasno-ui-border-radius-md);height:30px;line-height:20px;padding:5px 10px;white-space:nowrap}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover{background-color:#f0f0f0;cursor:pointer}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected{background-color:var(--vchasno-ui-calendar-color);color:#fff;font-weight:700}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover{background-color:var(--vchasno-ui-calendar-color)}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled{color:#ccc}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover{background-color:transparent;cursor:default}.react-datepicker__header--time{padding-bottom:8px;padding-left:5px;padding-right:5px}.react-datepicker__header--time:not(.react-datepicker__header--time--only){border-top-left-radius:var(--vchasno-ui-border-radius-none)}.react-datepicker__header{padding-top:5px;position:relative;text-align:center}.react-datepicker__header:not(.react-datepicker__header--has-time-select){border-top-right-radius:var(--vchasno-ui-border-radius-sm)}@media (width <= 480px){.react-datepicker{padding:0}}.react-datepicker-popper{z-index:100}.react-datepicker-popper[data-placement^=right] .react-datepicker__triangle{left:auto;right:42px}.react-datepicker-popper[data-placement^=left] .react-datepicker__triangle{left:42px;right:auto}.react-datepicker-time__header,.react-datepicker__current-month{color:var(--vchasno-ui-input-font-color);font-size:14px;font-weight:500;margin-top:0;padding:8px 0 15px;text-transform:capitalize}.react-datepicker__month-container{float:left}.react-datepicker__aria-live{display:none}.react-datepicker__month{display:flex;flex-direction:column;gap:1px;margin:0;text-align:center}.react-datepicker__day-names,.react-datepicker__week{white-space:nowrap}.react-datepicker__week{display:flex;gap:1px}.react-datepicker__day-name{text-transform:none}.react-datepicker__day,.react-datepicker__day-name,.react-datepicker__time-name{box-sizing:border-box;color:var(--vchasno-ui-input-font-color);cursor:pointer;display:inline-block;height:32px;line-height:30px;text-align:center;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s);width:32px}.react-datepicker__day-names .react-datepicker__day-name{font-weight:700;text-transform:capitalize}.react-datepicker__day:hover{background-color:#f2f6f7;border-radius:var(--vchasno-ui-border-radius-md)}.react-datepicker__day--today{border:1px solid var(--vchasno-ui-calendar-select-color);border-radius:var(--vchasno-ui-border-radius-md);font-weight:500}.react-datepicker__day--weekend{font-weight:400}.react-datepicker__day--outside-month{color:var(--vchasno-ui-color-surface-disabled-1)}.react-datepicker__day--disabled{color:#bfcede;cursor:not-allowed}.react-datepicker__day--disabled:hover{background-color:transparent}.react-datepicker__day--in-range,.react-datepicker__day--in-selecting-range,.react-datepicker__day--selected{background-color:var(--vchasno-ui-calendar-select-color);border-radius:var(--vchasno-ui-border-radius-md);color:#fff;font-weight:700}.react-datepicker__day--in-range:hover,.react-datepicker__day--in-selecting-range:hover,.react-datepicker__day--selected:hover{background-color:var(--vchasno-ui-calendar-select-color)}.react-datepicker__day--keyboard-selected:not(.react-datepicker__day--keyboard-selected){background-color:var(--vchasno-ui-calendar-select-color);border-radius:var(--vchasno-ui-border-radius-md);color:#fff}.react-datepicker__day--keyboard-selected:not(.react-datepicker__day--keyboard-selected):hover{background-color:var(--vchasno-ui-calendar-select-color)}.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range){background-color:rgba(33,107,165,.5)}.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range){background-color:#f0f0f0;color:var(--vchasno-ui-input-font-color)}.react-datepicker__input-container{position:relative}.react-datepicker__close-icon{background-color:transparent;border:0;bottom:0;cursor:pointer;height:20px;margin:auto;outline:none;position:absolute;right:35px;top:0;width:20px}.react-datepicker__today-button{background:#f0f0f0;border-top:1px solid #aeaeae;clear:left;cursor:pointer;font-weight:700;padding:5px 0;text-align:center}.react-datepicker__portal{align-items:center;background-color:rgba(0,0,0,.8);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:2147483647}.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__time-name{line-height:3rem;width:3rem}@media (height <= 550px),(width <= 400px){.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__time-name{line-height:2rem;width:2rem}}.react-datepicker__portal .react-datepicker-time__header,.react-datepicker__portal .react-datepicker__current-month{font-size:14px}.react-datepicker__navigation{align-items:center;background-size:cover;border:none;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;height:30px;justify-content:center;line-height:1;position:absolute;top:15px;width:30px;z-index:1}.react-datepicker__navigation:hover{background-color:#f2f6f7}.react-datepicker__navigation--previous{left:10px}.react-datepicker__navigation-icon{display:none}.react-datepicker__navigation--next:before,.react-datepicker__navigation--previous:before{height:10px;inset:0;margin:auto;position:absolute;width:10px}.react-datepicker__navigation--previous:before{color:var(--vchasno-ui-calendar-default-icon-color);content:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSIxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMCA0Ljk5MmMwLS4yNi4xLS41MS4yOS0uNzFsNC0zLjk5Yy4zOS0uMzkgMS4wMy0uMzkgMS40MiAwIC4zOS4zOS4zOSAxLjAzIDAgMS40MmwtMy4yOSAzLjI4IDMuMjkgMy4yOWMuMzkuMzkuMzkgMS4wMyAwIDEuNDItLjM5LjM5LTEuMDMuMzktMS40MiAwTC4zIDUuNzEyYy0uMi0uMi0uMy0uNDYtLjMtLjcyWiIgZmlsbD0iIzZlODA5YSIvPjwvc3ZnPg==")}.react-datepicker__navigation--next{color:var(--vchasno-ui-calendar-default-icon-color);right:10px}.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button){right:110px}.react-datepicker__navigation--next:before{content:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSIxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNi4wMDMgNS4wMDNjMCAuMjYtLjEuNTEtLjI5LjcxbC00IDMuOTljLS4zOS4zOS0xLjAzLjM5LTEuNDIgMC0uMzktLjM5LS4zOS0xLjAzIDAtMS40MmwzLjI5LTMuMjgtMy4yOS0zLjI5Yy0uMzktLjM5LS4zOS0xLjAzIDAtMS40Mi4zOS0uMzkgMS4wMy0uMzkgMS40MiAwbDMuOTkgMy45OWMuMi4yLjMuNDYuMy43MloiIGZpbGw9IiM2ZTgwOWEiLz48L3N2Zz4=")}.react-datepicker__input-container input{appearance:none;background:var(--vchasno-ui-input-bg-color);border:1px solid var(--vchasno-ui-input-border-color-default,#bfcede);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;font-size:var(--vchasno-ui-input-font-size,.8rem);height:30px;line-height:calc(var(--vchasno-ui-input-font-size, .8rem)*2);outline:1px solid transparent;padding:10px 15px;transition:border var(--vchasno-ui-transition-duration-sec,.3s),outline-color var(--vchasno-ui-transition-duration-sec,.3s);vertical-align:middle;width:100%}.react-datepicker__input-container input:disabled{background:var(--vchasno-ui-input-bg-color-disabled);color:var(--vchasno-ui-input-font-color)}.react-datepicker__input-container input:hover{cursor:default}.react-datepicker__input-container input:focus{border-color:var(--vchasno-ui-input-border-color-focused);outline:2px solid var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-date-picker{display:inline-flex;flex-direction:column;gap:5px}.vchasno-ui-date-picker.--wide{width:100%}.vchasno-ui-date-picker .vchasno-ui-date-picker__picker{height:50px}.vchasno-ui-date-picker__wrapper{border-radius:var(--vchasno-ui-border-radius-md);position:relative}.vchasno-ui-date-picker__wrapper .vchasno-ui-date-picker__custom-close-icon{color:var(--vchasno-ui-input-border-color-default);height:20px;pointer-events:none;position:absolute;right:35px;top:50%;transform:translateY(-50%) scale(0);transition:color var(--vchasno-ui-transition-duration-sec,.3s),transform var(--vchasno-ui-transition-duration-sec,.3s);width:20px}.vchasno-ui-date-picker__wrapper:has(.react-datepicker__close-icon) .vchasno-ui-date-picker__custom-close-icon{transform:translateY(-50%) scale(1)}@supports not selector(.vchasno-ui-date-picker__wrapper:has(.react-datepicker__close-icon)){.vchasno-ui-date-picker__wrapper .vchasno-ui-date-picker__custom-close-icon{transform:translateY(-50%) scale(1)}}.vchasno-ui-date-picker:not(.--disabled) .vchasno-ui-date-picker__wrapper:has(.react-datepicker__close-icon:hover) .vchasno-ui-date-picker__custom-close-icon{color:var(--vchasno-ui-calendar-default-icon-color)}.vchasno-ui-date-picker.--not-empty .vchasno-ui-label-text,.vchasno-ui-date-picker.--with-mask .vchasno-ui-label-text,.vchasno-ui-date-picker__wrapper:focus-within .vchasno-ui-label-text{font-size:var(--vchasno-ui-font-size-xs);top:0}.vchasno-ui-date-picker__wrapper>.vchasno-ui-date-picker__custom-calendar-icon{color:var(--vchasno-ui-calendar-default-icon-color);pointer-events:none;position:absolute;right:10px;top:50%;transform:translateY(-50%);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-picker.--loading .vchasno-ui-date-picker__wrapper>.vchasno-ui-spinner{position:absolute;right:10px;top:50%;transform:translateY(-50%)}.vchasno-ui-date-picker.--loading .vchasno-ui-date-picker__wrapper .vchasno-ui-spinner circle{stroke:var(--vchasno-ui-calendar-color)}.vchasno-ui-date-picker .react-datepicker__input-container input{color:var(--vchasno-ui-input-font-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);overflow:hidden;padding:var(--vchasno-ui-spacing-16);padding-right:24px;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-date-picker .react-datepicker__aria-live{display:none}.vchasno-ui-date-picker.--disabled,.vchasno-ui-date-picker.--disabled .vchasno-ui-date-picker__wrapper .vchasno-ui-date-picker__picker{cursor:not-allowed;opacity:.8}.vchasno-ui-date-picker:not(.--disabled):hover,.vchasno-ui-date-picker:not(.--disabled):hover .vchasno-ui-date-picker__wrapper .vchasno-ui-date-picker__picker{cursor:pointer}.vchasno-ui-date-picker:not(.--disabled):hover .react-datepicker__input-container input{border-color:var(--vchasno-ui-input-border-color-focused);outline:2px solid var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-date-picker:not(.--disabled).--error .react-datepicker__input-container input{border-color:var(--vchasno-ui-input-color-error);color:var(--vchasno-ui-input-color-error);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-date-picker.--is-label input::placeholder{visibility:hidden}.vchasno-ui-date-picker.--is-label:focus-within input::placeholder{visibility:visible}.vchasno-ui-date-picker[class*="--today-button-"] .react-datepicker{display:flex;flex-direction:column}.vchasno-ui-date-picker[class*="--today-button-"] .react-datepicker__today-button{align-items:center;border:0;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;gap:5px;justify-content:center;margin-top:12px;min-height:40px;padding:0 24px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-picker.--today-button-primary .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-primary-bg);border:1px solid transparent;color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-date-picker.--today-button-secondary .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-secondary-bg);border:1px solid var(--vchasno-ui-btn-secondary-border-color);color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-date-picker.--today-button-danger .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-danger-bg);border:0;color:var(--vchasno-ui-btn-danger-color)}.vchasno-ui-date-picker.--today-button-pink .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-date-picker.--today-button-primary .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-primary-hover-bg)}.vchasno-ui-date-picker.--today-button-secondary .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-secondary-hover-bg)}.vchasno-ui-date-picker.--today-button-danger .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-danger-hover-bg);color:var(--vchasno-ui-btn-danger-hover-color)}.vchasno-ui-date-picker.--today-button-pink .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-pink-hover-bg)}.vchasno-ui-datepicker-popper--today-button-danger .react-datepicker,.vchasno-ui-datepicker-popper--today-button-pink .react-datepicker,.vchasno-ui-datepicker-popper--today-button-primary .react-datepicker,.vchasno-ui-datepicker-popper--today-button-secondary .react-datepicker{display:flex;flex-direction:column}.vchasno-ui-datepicker-popper--today-button-danger .react-datepicker__today-button,.vchasno-ui-datepicker-popper--today-button-pink .react-datepicker__today-button,.vchasno-ui-datepicker-popper--today-button-primary .react-datepicker__today-button,.vchasno-ui-datepicker-popper--today-button-secondary .react-datepicker__today-button{align-items:center;border:0;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;gap:5px;justify-content:center;margin-top:12px;min-height:40px;padding:0 24px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-datepicker-popper--today-button-primary .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-primary-bg);border:1px solid transparent;color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-datepicker-popper--today-button-secondary .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-secondary-bg);border:1px solid var(--vchasno-ui-btn-secondary-border-color);color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-datepicker-popper--today-button-danger .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-danger-bg);border:0;color:var(--vchasno-ui-btn-danger-color)}.vchasno-ui-datepicker-popper--today-button-pink .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-datepicker-popper--today-button-primary .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-primary-hover-bg)}.vchasno-ui-datepicker-popper--today-button-secondary .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-secondary-hover-bg)}.vchasno-ui-datepicker-popper--today-button-danger .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-danger-hover-bg);color:var(--vchasno-ui-btn-danger-hover-color)}.vchasno-ui-datepicker-popper--today-button-pink .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-pink-hover-bg)}.vchasno-ui-select{display:inline-flex;flex-direction:column;gap:5px;position:relative}.vchasno-ui-select .vchasno-ui-label-text{top:0;transform:translateY(16px);transition:font-size .3s,transform .3s}.vchasno-ui-select:focus-within .vchasno-ui-label-text,.vchasno-ui-select:has(.vchasno-ui-select__value-container--has-value) .vchasno-ui-label-text{font-size:12px;transform:translateY(-8px)}@supports not selector(.vchasno-ui-select:has(.vchasno-ui-select__value-container--has-value)){.vchasno-ui-select .vchasno-ui-label-text{font-size:12px;transform:translateY(-42px)}}.vchasno-ui-select.--wide{width:100%}.vchasno-ui-select .vchasno-ui-select__control{border-color:var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;font-family:Roboto,Arial,Tahoma,Helvetica,Liberation Sans,sans-serif;min-height:50px;min-width:200px;outline:3px solid transparent;transition:border var(--vchasno-ui-transition-duration-sec,.3s),outline var(--vchasno-ui-transition-duration-sec,.3s)}.--pulse .vchasno-ui-select__control{animation:box-shadow-pulse 1.5s infinite;box-shadow:0 0 0 0 rgb(var(--vchasno-pulse-animation-color)/30%)}.vchasno-ui-select .vchasno-ui-select__control:has(.vchasno-ui-select__input){cursor:text}.vchasno-ui-select.--disabled .vchasno-ui-select__control{background-color:var(--vchasno-ui-input-bg-color-disabled);border:1px solid var(--vchasno-ui-input-border-color-default)}.vchasno-ui-select .vchasno-ui-select__control.vchasno-ui-select__control--is-disabled{opacity:.8}.vchasno-ui-select .vchasno-ui-select__option,.vchasno-ui-select__menu-portal .vchasno-ui-select__option{transition:opacity var(--vchasno-ui-transition-duration-sec,.3s),background-color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select.--disabled .vchasno-ui-select__option,.vchasno-ui-select__menu-portal.--disabled .vchasno-ui-select__option{background-color:#f3f8fb;opacity:.8;pointer-events:none}.vchasno-ui-select .vchasno-ui-select__menu,.vchasno-ui-select__menu-portal .vchasno-ui-select__menu{border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-shadow:none;margin-bottom:6px;margin-top:4px;transition:border var(--vchasno-ui-transition-duration-sec,.3s);z-index:100}.vchasno-ui-select .vchasno-ui-select__control--menu-is-open{border-color:red;outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-select.--error .vchasno-ui-select__control,.vchasno-ui-select.--error:hover .vchasno-ui-select__control--menu-is-open{border:1px solid var(--vchasno-ui-text-error-color);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-select .vchasno-ui-select__control:hover{border-color:var(--vchasno-ui-input-border-color-focused);outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-select .vchasno-ui-select__dropdown-indicator,.vchasno-ui-select .vchasno-ui-select__input-container{color:var(--vchasno-ui-input-font-color)}.vchasno-ui-select.--error .vchasno-ui-select__control:hover{border-color:var(--vchasno-ui-text-error-color);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-select .vchasno-ui-select__control--menu-is-open .vchasno-ui-select__dropdown-indicator{transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select.--error .vchasno-ui-select__dropdown-indicator{color:var(--vchasno-ui-text-error-color)}.vchasno-ui-select.--error .vchasno-ui-select__control--menu-is-open .vchasno-ui-select__dropdown-indicator{color:var(--vchasno-ui-text-error-color);transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select.--error .vchasno-ui-select__control:hover .vchasno-ui-select__dropdown-indicator,.vchasno-ui-select.--error .vchasno-ui-select__dropdown-indicator:hover{color:var(--vchasno-ui-text-error-color)}.vchasno-ui-select.--error .vchasno-ui-select__control--menu-is-open+.vchasno-ui-select__menu,.vchasno-ui-select.--error .vchasno-ui-select__control.vchasno-ui-select__control--menu-is-open{border:1px solid var(--vchasno-ui-text-error-color)}.vchasno-ui-select .vchasno-ui-select__control.vchasno-ui-select__control--is-focused{border-color:var(--vchasno-ui-input-border-color-focused);box-shadow:none;outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-select .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-select .vchasno-ui-select__placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);font-weight:400}.vchasno-ui-select:not(:focus-within,:not(:has(.vchasno-ui-label-text))) .vchasno-ui-select__placeholder{visibility:hidden}.vchasno-ui-select .vchasno-ui-select__clear-indicator{border-radius:var(--vchasno-ui-border-radius-sm);color:var(--vchasno-ui-input-font-color);padding:0;transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select .vchasno-ui-select__clear-indicator:hover{color:var(--vchasno-ui-input-color-error);cursor:pointer}.vchasno-ui-select .vchasno-ui-select__option--is-focused,.vchasno-ui-select .vchasno-ui-select__option--is-selected,.vchasno-ui-select .vchasno-ui-select__option:hover,.vchasno-ui-select__menu-portal .vchasno-ui-select__option--is-focused,.vchasno-ui-select__menu-portal .vchasno-ui-select__option--is-selected,.vchasno-ui-select__menu-portal .vchasno-ui-select__option:hover{background-color:var(--vchasno-ui-select-option-bg-selected);color:var(--vchasno-ui-select-option-color-selected)}.vchasno-ui-select .vchasno-ui-select__option:hover,.vchasno-ui-select__menu-portal .vchasno-ui-select__option:hover{cursor:pointer}.vchasno-ui-select.--disabled{cursor:not-allowed}.vchasno-ui-select .vchasno-ui-select__multi-value{background-color:var(--vchasno-ui-select-option-bg-selected);border-radius:var(--vchasno-ui-border-radius-md);outline:1px solid var(--vchasno-ui-select-menu-border-color,transparent)}.vchasno-ui-select .vchasno-ui-select__multi-value__remove{background-color:transparent;color:var(--vchasno-ui-label-color-default);padding:0 3px 0 0;transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select .vchasno-ui-select__multi-value__remove:hover{background-color:transparent;color:var(--vchasno-ui-input-color-error);cursor:pointer}.vchasno-ui-select .vchasno-ui-select__multi-value__remove svg{height:20px;width:20px}.vchasno-ui-select .vchasno-ui-select__indicators{padding-right:5px}.vchasno-ui-select .vchasno-ui-select__value-container{padding:5px 14px}.vchasno-ui-select .vchasno-ui-select__multi-value__label{font-size:14px;padding:6px 0 6px 6px}.vchasno-ui-select .vchasno-ui-select .vchasno-ui-select__multi-value__remove{font-size:14px;padding:6px}.vchasno-ui-date-range-picker{display:inline-flex;flex-direction:column;gap:5px;max-width:260px;width:100%}.vchasno-ui-date-range-picker .vchasno-ui-date-range-picker__picker{height:50px}.vchasno-ui-date-range-picker__wrapper{border-radius:var(--vchasno-ui-border-radius-md);position:relative}.vchasno-ui-date-range-picker__wrapper>.vchasno-ui-date-range-picker__custom-calendar-icon{background-color:var(--vchasno-ui-btn-light-bg);color:var(--vchasno-ui-calendar-default-icon-color);pointer-events:none;position:absolute;right:10px;top:50%;transform:translateY(-50%);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-range-picker.--loading .vchasno-ui-date-range-picker__wrapper>.vchasno-ui-spinner{height:18px;position:absolute;right:10px;top:50%;transform:translateY(-50%)}.vchasno-ui-date-range-picker.--loading .vchasno-ui-date-range-picker__wrapper .vchasno-ui-spinner circle{stroke:var(--vchasno-ui-calendar-color)}.vchasno-ui-date-range-picker__clear-btn{align-items:center;background:transparent;border:none;cursor:pointer;display:flex;justify-content:center;padding:0}.vchasno-ui-date-range-picker__wrapper .vchasno-ui-date-range-picker__custom-close-icon{background-color:var(--vchasno-ui-btn-light-bg);color:var(--vchasno-ui-input-border-color-default);cursor:pointer;height:20px;position:absolute;right:35px;top:50%;transform:translateY(-50%);transition:color var(--vchasno-ui-transition-duration-sec,.3s);width:20px}.vchasno-ui-date-range-picker__wrapper .vchasno-ui-date-range-picker__custom-close-icon:hover{color:var(--vchasno-ui-calendar-default-icon-color)}.vchasno-ui-date-range-picker__preset-select .vchasno-ui-label-text,.vchasno-ui-date-range-picker__preset-select:focus-within .vchasno-ui-label-text{font-size:var(--vchasno-ui-input-font-size);top:50%;transform:translateY(-50%)}.vchasno-ui-date-range-picker.--not-empty .vchasno-ui-label-text,.vchasno-ui-date-range-picker__wrapper:focus-within .vchasno-ui-label-text{font-size:var(--vchasno-ui-font-size-xs);top:0}.vchasno-ui-date-range-picker.--disabled,.vchasno-ui-date-range-picker.--disabled .vchasno-ui-date-range-picker__wrapper .vchasno-ui-date-range-picker__picker{cursor:not-allowed;opacity:.8}.vchasno-ui-date-range-picker:not(.--disabled):hover,.vchasno-ui-date-range-picker:not(.--disabled):hover .vchasno-ui-date-range-picker__wrapper .vchasno-ui-date-range-picker__picker{cursor:pointer}.vchasno-ui-date-range-picker:not(.--disabled):hover .react-datepicker__input-container input{border-color:var(--vchasno-ui-input-border-color-focused);outline:2px solid var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-date-range-picker:not(.--disabled).--error .react-datepicker__input-container input{border-color:var(--vchasno-ui-input-color-error);color:var(--vchasno-ui-input-color-error);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-date-range-picker.--is-label input::placeholder{visibility:hidden}.vchasno-ui-date-range-picker.--is-label:focus-within input::placeholder{visibility:visible}.vchasno-ui-date-range-picker-popper .react-datepicker{display:grid;grid:". ." "buttons buttons";grid-auto-columns:1fr;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;padding:0}.vchasno-ui-date-range-picker .react-datepicker__children-container{align-items:start;border-top:1px solid var(--vchasno-ui-input-border-color-default);display:flex;gap:16px;grid-area:buttons;padding:20px 12px}.vchasno-ui-date-range-picker .react-datepicker__week{gap:1px 0}.vchasno-ui-date-range-picker.--wide{width:100%}.vchasno-ui-date-range-picker-popper .react-datepicker__month-container{float:none;padding:8px}.vchasno-ui-date-range-picker__presets{width:100%}.vchasno-ui-date-range-picker__preset-select .vchasno-ui-select__control{height:40px;min-height:auto}.vchasno-ui-date-range-picker__preset-select .vchasno-ui-select__value-container{padding:0 14px}.vchasno-ui-date-range-picker__actions{display:flex;gap:8px;justify-content:flex-end;width:100%}.vchasno-ui-date-range-picker__cancel-btn{background-color:var(--vchasno-ui-btn-secondary-bg);border:1px solid var(--vchasno-ui-btn-secondary-border-color);border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-btn-secondary-color);cursor:pointer;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;min-height:40px;padding:0 24px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-range-picker__cancel-btn:hover{background-color:var(--vchasno-ui-btn-secondary-hover-bg)}.vchasno-ui-date-range-picker__save-btn{background-color:var(
|
|
1
|
+
.vchasno-ui-pulse-animation{animation:box-shadow-pulse var(--vchasno-pulse-animation-duration) infinite;box-shadow:0 0 0 0 rgb(var(--vchasno-pulse-animation-color)/30%)}@keyframes box-shadow-pulse{0%{box-shadow:0 0 0 0 rgb(var(--vchasno-pulse-animation-color)/80%)}70%{box-shadow:0 0 0 10px rgb(var(--vchasno-pulse-animation-color)/0)}to{box-shadow:0 0 0 30px rgb(var(--vchasno-pulse-animation-color)/0)}}:root{--vchasno-ui-border-radius-none:0;--vchasno-ui-border-radius-xs:2px;--vchasno-ui-border-radius-sm:4px;--vchasno-ui-border-radius-md:8px;--vchasno-ui-border-radius-lg:12px;--vchasno-ui-border-radius-xl:16px;--vchasno-ui-border-radius-full:9999px;--vchasno-ui-font-size-2xs:10px;--vchasno-ui-font-size-xs:12px;--vchasno-ui-font-size-sm:14px;--vchasno-ui-font-size-md:16px;--vchasno-ui-font-size-lg:20px;--vchasno-ui-font-size-xl:24px;--vchasno-ui-font-size-2xl:32px;--vchasno-ui-font-weight-thin:100;--vchasno-ui-font-weight-extralight:200;--vchasno-ui-font-weight-light:300;--vchasno-ui-font-weight-regular:400;--vchasno-ui-font-weight-medium:500;--vchasno-ui-font-weight-semibold:600;--vchasno-ui-font-weight-bold:700;--vchasno-ui-font-weight-extrabold:800;--vchasno-ui-font-weight-black:900;--vchasno-ui-spacing-0:0px;--vchasno-ui-spacing-2:2px;--vchasno-ui-spacing-4:4px;--vchasno-ui-spacing-6:6px;--vchasno-ui-spacing-8:8px;--vchasno-ui-spacing-10:10px;--vchasno-ui-spacing-12:12px;--vchasno-ui-spacing-16:16px;--vchasno-ui-spacing-20:20px;--vchasno-ui-spacing-24:24px;--vchasno-ui-spacing-32:32px;--vchasno-ui-spacing-40:40px;--vchasno-ui-spacing-48:48px;--vchasno-ui-spacing-52:52px;--vchasno-ui-spacing-120:120px;--vchasno-ui-color-brand-ttn-25:#f2f3fa;--vchasno-ui-color-brand-ttn-50:#d9d6f6;--vchasno-ui-color-brand-ttn-100:#c6c0f2;--vchasno-ui-color-brand-ttn-200:#b4abef;--vchasno-ui-color-brand-ttn-300:#9f93eb;--vchasno-ui-color-brand-ttn-400:#8e7fe8;--vchasno-ui-color-brand-ttn-500:#7b69e4;--vchasno-ui-color-brand-ttn-600:#604adf;--vchasno-ui-color-brand-ttn-700:#5443bc;--vchasno-ui-color-brand-edo-25:#fffbf5;--vchasno-ui-color-brand-edo-50:#fff3e0;--vchasno-ui-color-brand-edo-100:#ffe8c2;--vchasno-ui-color-brand-edo-400:#ffb200;--vchasno-ui-color-brand-edo-500:#ff9c01;--vchasno-ui-color-brand-edo-600:#f58700;--vchasno-ui-color-brand-qes-25:#fff5f5;--vchasno-ui-color-brand-qes-50:#ffe9ea;--vchasno-ui-color-brand-qes-100:#ffd8d9;--vchasno-ui-color-brand-qes-200:#ffc0c2;--vchasno-ui-color-brand-qes-300:#ffaeb0;--vchasno-ui-color-brand-qes-400:#ff9a9d;--vchasno-ui-color-brand-qes-500:#ff878b;--vchasno-ui-color-brand-qes-600:#ff7c80;--vchasno-ui-color-brand-qes-700:#ff5a5f;--vchasno-ui-color-brand-qes-800:#e75459;--vchasno-ui-color-brand-kadry-25:#f8fcfb;--vchasno-ui-color-brand-kadry-50:#e4f3f1;--vchasno-ui-color-brand-kadry-100:#c7eae5;--vchasno-ui-color-brand-kadry-200:#b1e3dc;--vchasno-ui-color-brand-kadry-300:#9bdcd3;--vchasno-ui-color-brand-kadry-400:#86d5ca;--vchasno-ui-color-brand-kadry-500:#70cec1;--vchasno-ui-color-brand-kadry-600:#5bc7b8;--vchasno-ui-color-brand-kadry-700:#12747d;--vchasno-ui-color-brand-kadry-800:#07626a;--vchasno-ui-color-brand-zvit-25:#fff8f5;--vchasno-ui-color-brand-zvit-50:#ffe8db;--vchasno-ui-color-brand-zvit-100:#ffd7c2;--vchasno-ui-color-brand-zvit-200:#ffc7a8;--vchasno-ui-color-brand-zvit-300:#ffb68f;--vchasno-ui-color-brand-zvit-400:#ffa675;--vchasno-ui-color-brand-zvit-500:#ff955c;--vchasno-ui-color-brand-zvit-600:#ff8542;--vchasno-ui-color-brand-zvit-700:#ff752a;--vchasno-ui-color-brand-zvit-800:#f55d0b;--vchasno-ui-color-brand-edi-25:#f5f9ff;--vchasno-ui-color-brand-edi-50:#e0eeff;--vchasno-ui-color-brand-edi-100:#b8dafc;--vchasno-ui-color-brand-edi-200:#9cccfa;--vchasno-ui-color-brand-edi-300:#80bdf8;--vchasno-ui-color-brand-edi-400:#63aef6;--vchasno-ui-color-brand-edi-500:#469ff4;--vchasno-ui-color-brand-edi-600:#007cef;--vchasno-ui-color-brand-edi-700:#1a66c8;--vchasno-ui-color-brand-kasa-25:#fff5fb;--vchasno-ui-color-brand-kasa-50:#ffeff8;--vchasno-ui-color-brand-kasa-100:#ffd3eb;--vchasno-ui-color-brand-kasa-200:#ffc0e3;--vchasno-ui-color-brand-kasa-300:#ffb5de;--vchasno-ui-color-brand-kasa-400:#f39ecd;--vchasno-ui-color-brand-kasa-500:#e582b8;--vchasno-ui-color-brand-kasa-600:#ce6fa3;--vchasno-ui-color-utility-blue-25:#f5f9ff;--vchasno-ui-color-utility-blue-50:#ecf4ff;--vchasno-ui-color-utility-blue-100:#dbe9fa;--vchasno-ui-color-utility-blue-200:#4e9aff;--vchasno-ui-color-utility-blue-500:#1a66c8;--vchasno-ui-color-utility-blue-600:#14509e;--vchasno-ui-color-utility-blue-700:#124587;--vchasno-ui-color-utility-green-50:#f5fdec;--vchasno-ui-color-utility-green-100:#d3efc8;--vchasno-ui-color-utility-green-200:#abdf96;--vchasno-ui-color-utility-green-300:#1cb800;--vchasno-ui-color-utility-green-400:#138000;--vchasno-ui-color-utility-red-50:#fee;--vchasno-ui-color-utility-red-100:#ffd8d6;--vchasno-ui-color-utility-red-200:#fb7a7a;--vchasno-ui-color-utility-red-300:#f54f4f;--vchasno-ui-color-utility-red-400:#c1261a;--vchasno-ui-color-utility-orange-50:#fff2d6;--vchasno-ui-color-utility-orange-100:#ffebcc;--vchasno-ui-color-utility-orange-400:#ffb200;--vchasno-ui-color-utility-orange-500:#f58700;--vchasno-ui-color-gray-0:#fff;--vchasno-ui-color-gray-25:#f3f8fb;--vchasno-ui-color-gray-50:#e2e9f3;--vchasno-ui-color-gray-100:#bfcede;--vchasno-ui-color-gray-200:#9aaabf;--vchasno-ui-color-gray-300:#8194ac;--vchasno-ui-color-gray-400:#6e809a;--vchasno-ui-color-gray-500:#3b4250;--vchasno-ui-color-gray-600:#252d3d;--vchasno-ui-color-gray-700:#1d1d1f;--vchasno-ui-color-surface-disabled-subtle:var(--vchasno-ui-color-gray-25);--vchasno-ui-color-surface-disabled-default:var(--vchasno-ui-color-gray-50);--vchasno-ui-color-surface-disabled-strong:var(--vchasno-ui-color-gray-100);--vchasno-ui-color-surface-disabled-1:var(--vchasno-ui-color-gray-200);--vchasno-ui-color-surface-success-muted:var(--vchasno-ui-color-utility-green-50);--vchasno-ui-color-surface-success-subtle:var(--vchasno-ui-color-utility-green-100);--vchasno-ui-color-surface-success-default:var(--vchasno-ui-color-utility-green-300);--vchasno-ui-color-surface-error-muted:var(--vchasno-ui-color-utility-red-50);--vchasno-ui-color-surface-error-subtle:var(--vchasno-ui-color-utility-red-100);--vchasno-ui-color-surface-error-default:var(--vchasno-ui-color-utility-red-300);--vchasno-ui-color-surface-info-muted:var(--vchasno-ui-color-utility-blue-50);--vchasno-ui-color-surface-info-subtle:var(--vchasno-ui-color-utility-blue-100);--vchasno-ui-color-surface-info-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-surface-warning-muted:var(--vchasno-ui-color-utility-orange-50);--vchasno-ui-color-surface-warning-subtle:var(--vchasno-ui-color-utility-orange-100);--vchasno-ui-color-surface-warning-default:var(--vchasno-ui-color-utility-orange-400);--vchasno-ui-color-surface-accent-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-content-disabled-default:var(--vchasno-ui-color-gray-200);--vchasno-ui-color-content-accent-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-content-error-default:var(--vchasno-ui-color-utility-red-400);--vchasno-ui-color-content-info-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-content-success-default:var(--vchasno-ui-color-utility-green-400);--vchasno-ui-color-content-warning-default:var(--vchasno-ui-color-utility-orange-500);--vchasno-ui-color-border-accent-default:var(--vchasno-ui-color-utility-blue-500);--vchasno-ui-color-border-error-default:var(--vchasno-ui-color-utility-red-300);--vchasno-ui-color-border-success-default:var(--vchasno-ui-color-utility-green-300);--vchasno-ui-color-border-warning-default:var(--vchasno-ui-color-utility-orange-400);--vchasno-ui-transition-duration-sec:0.3s;--vchasno-ui-btn-default-bg:transparent;--vchasno-ui-btn-default-hover-bg:#e1e4ff;--vchasno-ui-btn-default-color:#6e809a;--vchasno-ui-btn-disabled-color:#6e809a;--vchasno-ui-btn-default-hover-color:#604adf;--vchasno-ui-btn-primary-bg:#604adf;--vchasno-ui-btn-primary-disabled-bg:#e2e9f3;--vchasno-ui-btn-primary-hover-bg:#3f328c;--vchasno-ui-btn-primary-color:#fff;--vchasno-ui-btn-secondary-bg:hsla(0,0%,100%,.04);--vchasno-ui-btn-secondary-disabled-bg:#f3f8fb;--vchasno-ui-btn-pink-bg:#ff5a5f;--vchasno-ui-btn-pink-hover-bg:#e75459;--vchasno-ui-btn-secondary-border-color:#e2e9f3;--vchasno-ui-btn-secondary-hover-bg:#e0eeff;--vchasno-ui-btn-secondary-color:var(--vchasno-ui-color-border-accent-default);--vchasno-ui-btn-light-bg:#fff;--vchasno-ui-btn-light-hover-bg:rgba(96,74,223,.2);--vchasno-ui-btn-light-color:#604adf;--vchasno-ui-btn-font-size:14px;--vchasno-ui-btn-danger-color:#f54f4f;--vchasno-ui-btn-danger-bg:rgba(231,52,52,.1);--vchasno-ui-btn-danger-hover-bg:#f54f4f;--vchasno-ui-btn-danger-hover-color:#fff;--vchasno-ui-input-bg-color:#fff;--vchasno-ui-input-bg-color-disabled:#f3f8fb;--vchasno-ui-input-border-color-default:#e2e9f3;--vchasno-ui-input-border-color-focused:#1a66c8;--vchasno-ui-input-outline-color-focused:rgba(196,233,255,.4);--vchasno-ui-input-outline-color-error:#ffeaeb;--vchasno-ui-input-color-error:#f54f4f;--vchasno-ui-input-bg-error:hsla(1,82%,66%,.1);--vchasno-ui-input-font-size:14px;--vchasno-ui-input-font-color:#252d3d;--vchasno-ui-input-placeholder-color:#6e809a;--vchasno-ui-input-font-color-disabled:#bfcede;--vchasno-ui-label-color-default:#6e809a;--vchasno-ui-label-color-focused:#1a66c8;--vchasno-ui-checkbox-bg-color:var(--vchasno-ui-color-surface-accent-default);--vchasno-ui-checkbox-outline-color:rgba(196,233,255,.4);--vchasno-ui-checkbox-disabled-bg:#bfcede;--vchasno-ui-checkbox-border-color:#bfcede;--vchasno-ui-checkbox-icon-color:#fff;--vchasno-ui-checkbox-font-size:14px;--vchasno-ui-select-option-bg-selected:#f3f8fb;--vchasno-ui-select-option-color-selected:#252d3d;--vchasno-ui-select-menu-border-color:transparent;--vchasno-ui-calendar-color:#6b5fff;--vchasno-ui-calendar-select-color:#1a66c8;--vchasno-ui-calendar-default-icon-color:#6e809a;--vchasno-ui-calendar-bg-hover:#ff9c01;--vchasno-ui-text-primary-color:#252d3d;--vchasno-ui-text-secondary-color:#5a6a81;--vchasno-ui-text-success-color:#1cb800;--vchasno-ui-text-warning-color:#ff9c01;--vchasno-ui-text-error-color:#f54f4f;--vchasno-ui-text-link-color:var(--vchasno-ui-color-content-accent-default);--vchasno-ui-alert-info-color:#1a66c8;--vchasno-ui-alert-info-bg:#e0eeff;--vchasno-ui-alert-warning-color:#ff9c01;--vchasno-ui-alert-warning-bg:#fff2d6;--vchasno-ui-alert-error-color:#f54f4f;--vchasno-ui-alert-error-bg:#ffe8e8;--vchasno-ui-alert-success-color:#1cb800;--vchasno-ui-alert-success-bg:#e7f3d9;--vchasno-ui-alert-config-color:#1a66c8;--vchasno-ui-alert-config-bg:#f3f8fb;--vchasno-ui-tabs-active-color:var(--vchasno-ui-color-surface-accent-default);--vchasno-ui-pagination-border-color:#1a66c8;--vchasno-ui-pagination-hover-bg-color:rgba(0,0,0,.1);--vchasno-ui-pagination-focus-shadow-color:rgba(196,233,255,.4);--vchasno-ui-pagination-size:32px;--vchasno-ui-switch-height:30px;--vchasno-ui-switch-color-bg:#bfcede;--vchasno-ui-switch-spinner-color:#bfcede;--vchasno-ui-switch-circle-color:#fff;--vchasno-ui-switch-active-color-bg:var(--vchasno-ui-color-surface-accent-default);--vchasno-ui-pulse-dot-color:#604adf;--vchasno-ui-pulse-dot-size:35px;--vchasno-ui-menu-button-bg:#f3f8fb;--vchasno-ui-menu-item-hover-bg:#f3f8fb;--vchasno-ui-slider-color:var(--vchasno-ui-color-surface-accent-default);--vchasno-ui-slider-thumb-box-shadow-color:rgba(196,233,255,.4);--vchasno-ui-tooltip-font-size:14px;--vchasno-ui-tooltip-line-height:18px;--vchasno-ui-tooltip-padding:10px;--vchasno-ui-tooltip-bg-mui:rgba(37,45,61,.9);--vchasno-ui-tooltip-text-color:#fff;--vchasno-ui-snackbar-color-light:#fff;--vchasno-ui-snackbar-color-dark:#fff;--vchasno-ui-snackbar-color-info:#1a66c8;--vchasno-ui-snackbar-color-success:#1cb800;--vchasno-ui-snackbar-color-warning:#ff9c01;--vchasno-ui-snackbar-color-error:#f54f4f;--vchasno-ui-snackbar-color-transparent:hsla(0,0%,100%,.7);--vchasno-ui-snackbar-icon-color-info:var(--vchasno-ui-snackbar-color-info);--vchasno-ui-snackbar-icon-color-success:var(--vchasno-ui-snackbar-color-success);--vchasno-ui-snackbar-icon-color-warning:var(--vchasno-ui-snackbar-color-warning);--vchasno-ui-snackbar-icon-color-error:var(--vchasno-ui-snackbar-color-error);--vchasno-ui-snackbar-toast-min-width:335px;--vchasno-ui-snackbar-toast-width:auto;--vchasno-ui-snackbar-toast-max-width:560px;--vchasno-ui-snackbar-toast-offset:16px;--vchasno-ui-snackbar-toast-top:max(var(--vchasno-ui-snackbar-toast-offset),env(safe-area-inset-top));--vchasno-ui-snackbar-toast-right:max(var(--vchasno-ui-snackbar-toast-offset),env(safe-area-inset-right));--vchasno-ui-snackbar-toast-left:max(var(--vchasno-ui-snackbar-toast-offset),env(safe-area-inset-left));--vchasno-ui-snackbar-toast-bottom:max(var(--vchasno-ui-snackbar-toast-offset),env(safe-area-inset-bottom));--vchasno-ui-snackbar-toast-background:rgba(0,0,0,.9);--vchasno-ui-snackbar-toast-min-height:24px;--vchasno-ui-snackbar-toast-max-height:800px;--vchasno-ui-snackbar-toast-bd-radius:var(--vchasno-ui-border-radius-md);--vchasno-ui-snackbar-font-family:sans-serif;--vchasno-ui-snackbar-z-index:9999;--vchasno-ui-snackbar-text-color-light:#757575;--vchasno-ui-snackbar-text-color-dark:#fff;--vchasno-ui-snackbar-text-color-info:#fff;--vchasno-ui-snackbar-text-color-success:#fff;--vchasno-ui-snackbar-text-color-warning:#fff;--vchasno-ui-snackbar-text-color-error:#fff;--vchasno-ui-snackbar-spinner-color:#616161;--vchasno-ui-snackbar-spinner-color-empty-area:#e0e0e0;--vchasno-ui-snackbar-color-progress-light:linear-gradient(90deg,#4cd964,#5ac8fa,#007aff,#34aadc,#5856d6,#ff2d55);--vchasno-ui-snackbar-color-progress-dark:#bb86fc;--vchasno-ui-snackbar-color-progress-info:var(--vchasno-ui-snackbar-color-info);--vchasno-ui-snackbar-color-progress-success:var(--vchasno-ui-snackbar-color-success);--vchasno-ui-snackbar-color-progress-warning:var(--vchasno-ui-snackbar-color-warning);--vchasno-ui-snackbar-color-progress-error:var(--vchasno-ui-snackbar-color-error);--vchasno-ui-snackbar-color-progress-bgo:0.2;--vchasno-ui-snackbar-action-button-color:#0094ff;--vchasno-pulse-animation-color:107 95 255;--vchasno-pulse-animation-duration:1.5s;--vchasno-ui-full-screen-modal-z-index:998;--vchasno-ui-full-screen-modal-header-height:60px;--vchasno-ui-full-screen-modal-bg-color:#fff}[data-brand=edo]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-edo-500);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-edo-500);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-edo-600);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-edo-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-edo-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-edo-500)}[data-brand=qes]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-qes-700);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-qes-700);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-qes-800);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-qes-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-qes-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-qes-700)}[data-brand=ttn]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-ttn-500);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-ttn-600);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-ttn-700);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-ttn-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-ttn-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-ttn-500)}[data-brand=kadry]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-kadry-700);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-kadry-700);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-kadry-800);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-kadry-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-kadry-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-kadry-700)}[data-brand=zvit]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-zvit-600);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-zvit-700);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-zvit-800);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-zvit-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-zvit-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-zvit-600)}[data-brand=edi]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-edi-600);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-edi-600);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-edi-700);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-edi-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-edi-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-edi-600)}[data-brand=kasa]{--vchasno-ui-color-content-brand-default:var(--vchasno-ui-color-brand-kasa-500);--vchasno-ui-color-surface-brand-default:var(--vchasno-ui-color-brand-kasa-500);--vchasno-ui-color-surface-brand-default-hover:var(--vchasno-ui-color-brand-kasa-600);--vchasno-ui-color-surface-brand-muted:var(--vchasno-ui-color-brand-kasa-25);--vchasno-ui-color-surface-brand-muted-hover:var(--vchasno-ui-color-brand-kasa-50);--vchasno-ui-color-border-brand-default:var(--vchasno-ui-color-brand-kasa-500)}.vchasno-ui-scrollable-box{-webkit-overflow-scrolling:touch;box-sizing:border-box;max-height:unset}.vchasno-ui-scrollable-box__shadow{display:block;height:0;pointer-events:none;position:sticky;width:100%;z-index:2}.vchasno-ui-scrollable-box__shadow:after{content:"";display:block;height:10px;left:0;position:absolute;right:0}.vchasno-ui-scrollable-box__shadow.--top{top:0}.vchasno-ui-scrollable-box__shadow.--top:after{box-shadow:inset 0 10px 10px -10px rgba(0,0,0,.1);top:0}.vchasno-ui-scrollable-box__shadow.--bottom{bottom:0}.vchasno-ui-scrollable-box__shadow.--bottom:after{bottom:0;box-shadow:inset 0 -10px 10px -10px rgba(0,0,0,.1)}.vchasno-ui-scrollable-box.--is-scrollable{overflow-y:auto;transform:translateZ(0)}.vchasno-ui-scrollable-box.--hide-scroll{-ms-overflow-style:none;scrollbar-width:none}.vchasno-ui-scrollable-box.--hide-scroll::-webkit-scrollbar{display:none}.vchasno-ui-scrollable-box.--prevent-parent-scroll{overscroll-behavior-y:contain}.vchasno-ui-scrollable-box.--smooth-scroll{scroll-behavior:smooth}.vchasno-ui-full-screen-modal{background-color:var(--vchasno-ui-full-screen-modal-bg-color);height:100%;left:0;position:fixed;top:0;width:100%;z-index:var(--vchasno-ui-full-screen-modal-z-index)}.vchasno-ui-full-screen-modal__header{align-items:center;border-bottom:1px solid var(--vchasno-ui-input-border-color-default);box-sizing:border-box;display:flex;height:var(--vchasno-ui-full-screen-modal-header-height);justify-content:space-between;padding-left:20px;padding-right:20px}.vchasno-ui-full-screen-modal__content{box-sizing:border-box;height:calc(100% - var(--vchasno-ui-full-screen-modal-header-height));overflow-y:auto}.vchasno-ui-full-screen-modal--animation{animation:vchasno-full-screen-modal-show var(--vchasno-ui-transition-duration-sec) ease-in-out}@keyframes vchasno-full-screen-modal-show{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.vchasno-ui-overflow-hidden{overflow:hidden}.vchasno-ui-alert{align-items:center;border-left:3px solid transparent;border-radius:var(--vchasno-ui-border-radius-sm);box-sizing:border-box;display:inline-flex;flex-shrink:0;font-size:14px;gap:12px;line-height:20px;min-height:40px;padding:12px 16px}.vchasno-ui-alert b,.vchasno-ui-alert strong{font-weight:700}.vchasno-ui-alert.--wide{width:100%}.vchasno-ui-alert.--left-border{border-left-width:4px}.vchasno-ui-alert__close-icon,.vchasno-ui-alert__icon-wrapper{align-items:center;display:flex;flex-shrink:0;font-size:20px;height:20px;justify-content:center;line-height:20px;width:20px}.vchasno-ui-alert.--info{background-color:var(--vchasno-ui-alert-info-bg,#e0eeff);border-color:var(--vchasno-ui-alert-info-color,#1a66c8)}.vchasno-ui-alert.--warning{background-color:var(--vchasno-ui-alert-warning-bg,#fff2d6);border-color:var(--vchasno-ui-alert-warning-color,#ff9c01)}.vchasno-ui-alert.--error{background-color:var(--vchasno-ui-alert-error-bg,#ffe8e8);border-color:var(--vchasno-ui-alert-error-color,#f54f4f)}.vchasno-ui-alert.--success{background-color:var(--vchasno-ui-alert-success-bg,#e7f3d9);border-color:var(--vchasno-ui-alert-success-color,#00b700)}.vchasno-ui-alert.--config{background-color:var(--vchasno-ui-alert-config-bg,#f3f8fb);border-color:var(--vchasno-ui-alert-config-color,#1a66c8)}.vchasno-ui-alert__close-icon{border-radius:var(--vchasno-ui-border-radius-sm);height:30px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s);width:30px}.vchasno-ui-alert__close-icon:hover{background-color:hsla(0,0%,100%,.5);cursor:pointer}.vchasno-ui-alert.--close{display:none}.vchasno-ui-BubbleBox{--vchasno-ui-bubble-height:40px;--vchasno-ui-bubble-width:40px;--vchasno-ui-bubble-shadow:2px 4px 6px rgba(0,0,0,.2);box-sizing:border-box;min-height:calc(var(--vchasno-ui-bubble-height)*2);position:relative}.vchasno-ui-BubbleBox,.vchasno-ui-BubbleBox__svg{transition:var(--vchasno-ui-transition-duration-sec)}.vchasno-ui-BubbleBox__svg{left:0;overflow:visible;pointer-events:none;position:absolute;top:0;transform:translateZ(0);z-index:-1}.vchasno-ui-BubbleBox__svg path{transition:var(--vchasno-ui-transition-duration-sec)}.vchasno-ui-BubbleBox__svg.vchasno-ui-BubbleBox__shadow{filter:drop-shadow(var(--vchasno-ui-bubble-shadow))}.vchasno-ui-BubbleBox__bubble{align-items:center;border:0;border-radius:var(--vchasno-ui-border-radius-full);bottom:0;cursor:pointer;display:flex;height:var(--vchasno-ui-bubble-height);justify-content:center;margin:0;padding:0;position:absolute;right:0;transition:var(--vchasno-ui-transition-duration-sec);width:var(--vchasno-ui-bubble-width);z-index:1}.vchasno-ui-spinner{display:inline-block;height:20px;position:relative;width:20px}.vchasno-ui-spinner__svg{height:100%;inset:0;margin:auto;pointer-events:none;position:absolute;transform-origin:center center;width:100%}.vchasno-ui-spinner--circle .vchasno-ui-spinner__svg{animation:spinner-rotate 1.3s linear infinite}.vchasno-ui-spinner--circle .vchasno-ui-spinner__svg__circle{stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round;stroke-width:5px;animation:spinner-rotate-dash 2s ease-in-out infinite}.vchasno-ui-spinner--logo .vchasno-ui-spinner__svg__path{stroke-dasharray:200;stroke-dashoffset:200;animation:spinner-logo-draw 2s ease-in-out infinite alternate,spinner-logo-pulse 2s linear infinite;animation-delay:0s,1s}.vchasno-ui-spinner--logo .vchasno-ui-spinner__svg{transform:scale(2)}@keyframes spinner-rotate{to{transform:rotate(1turn)}}@keyframes spinner-rotate-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}@keyframes spinner-logo-draw{0%{stroke-dashoffset:195}to{stroke-dashoffset:0}}@keyframes spinner-logo-pulse{0%,50%,to{opacity:1}25%,75%{opacity:.5}}.vchasno-ui-button{align-items:center;background-color:var(--vchasno-ui-btn-default-bg);border:0;border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-btn-default-color);display:inline-flex;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;gap:5px;justify-content:center;min-height:40px;transition:min-height var(--vchasno-ui-transition-duration-sec,.3s),padding var(--vchasno-ui-transition-duration-sec,.3s),background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s);user-select:none}.vchasno-ui-button:disabled{cursor:not-allowed;opacity:.8}.vchasno-ui-button:not(:disabled):hover{background-color:var(--vchasno-ui-btn-default-hover-bg);color:var(--vchasno-ui-btn-default-hover-color);cursor:pointer}.vchasno-ui-button.--sm{min-width:40px;padding:0 15px}.vchasno-ui-button.--md{min-width:40px;padding:0 24px}.vchasno-ui-button.--lg{min-height:50px;min-width:50px;padding:0 32px}.vchasno-ui-button.--wide{width:100%}.vchasno-ui-button.--primary{background-color:var(--vchasno-ui-btn-primary-bg);border:1px solid transparent;color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-button.--primary.--outline{background-color:transparent;border:1px solid var(--vchasno-ui-btn-primary-bg);box-shadow:none;color:var(--vchasno-ui-btn-primary-bg)}.vchasno-ui-button.--secondary{background-color:var(--vchasno-ui-btn-secondary-bg);border:1px solid var(--vchasno-ui-btn-secondary-border-color);color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-button:disabled.--pink,.vchasno-ui-button:disabled.--primary,.vchasno-ui-button:disabled.--secondary{color:var(--vchasno-ui-btn-disabled-color)}.vchasno-ui-button:disabled.--primary{background-color:var(--vchasno-ui-btn-primary-disabled-bg)}.vchasno-ui-button:disabled.--secondary{background-color:var(--vchasno-ui-btn-secondary-disabled-bg)}.vchasno-ui-button.--primary:not(:disabled):hover{background-color:var(--vchasno-ui-btn-primary-hover-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-button.--primary.--outline:not(:disabled):hover{background-color:var(--vchasno-ui-btn-default-hover-bg);border:1px solid var(--vchasno-ui-btn-primary-bg);color:var(--vchasno-ui-btn-primary-bg)}.vchasno-ui-button.--secondary.--outline{background-color:transparent;border:1px solid var(--vchasno-ui-btn-secondary-bg);box-shadow:none;color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-button.--secondary:not(:disabled):hover{background-color:var(--vchasno-ui-btn-secondary-hover-bg);color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-button.--pink{background-color:var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-button.--pink.--outline{background-color:transparent;border:1px solid var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-pink-bg)}.vchasno-ui-button.--pink:disabled{background-color:var(--vchasno-ui-btn-primary-disabled-bg)}.vchasno-ui-button.--pink:not(:disabled):hover{background-color:var(--vchasno-ui-btn-pink-hover-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-button.--pink.--outline:not(:disabled):hover{background-color:transparent;border:1px solid var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-pink-bg)}.vchasno-ui-button.--danger{background-color:var(--vchasno-ui-btn-danger-bg);border:0;color:var(--vchasno-ui-btn-danger-color)}.vchasno-ui-button.--danger.--outline{background-color:transparent;border:1px solid var(--vchasno-ui-btn-danger-color);color:var(--vchasno-ui-btn-danger-color)}.vchasno-ui-button:disabled.--danger{background-color:rgba(182,202,219,.2);border:1px solid #bfcede;color:#bfcede}.vchasno-ui-button.--danger:not(:disabled):hover{background-color:var(--vchasno-ui-btn-danger-hover-bg);color:var(--vchasno-ui-btn-danger-hover-color)}.vchasno-ui-button.--danger.--outline:not(:disabled):hover{background-color:rgba(0,0,0,.1);border:1px solid var(--vchasno-ui-btn-danger-color,#ef6562);color:var(--vchasno-ui-btn-danger-color,#ef6562)}.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-btn-default-color);transition:stroke var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-btn-default-hover-color)}.vchasno-ui-button:disabled.--transparent{color:#bfcede}.vchasno-ui-button.--light{background-color:var(--vchasno-ui-btn-light-bg,#fff);border:1px solid transparent;color:var(--vchasno-ui-btn-light-color)}.vchasno-ui-button:disabled.--light{background-color:rgba(182,202,219,.2);border:none;color:#bfcede}.vchasno-ui-button.--light.--outline{background-color:var(--vchasno-ui-btn-primary-color);border:1px solid var(--vchasno-ui-btn-primary-bg);color:var(--vchasno-ui-btn-primary-bg)}.vchasno-ui-button.--light:not(:disabled):hover{background-color:var(--vchasno-ui-btn-light-hover-bg);color:var(--vchasno-ui-btn-primary-bg)}.vchasno-ui-button.--suppress-padding{padding:0}.vchasno-ui-checkbox{align-items:center;cursor:pointer;display:inline-flex;gap:8px;user-select:none}.vchasno-ui-checkbox__box{align-items:center;border:1px solid var(--vchasno-ui-checkbox-border-color);border-radius:var(--vchasno-ui-border-radius-xs);display:inline-flex;flex-shrink:0;height:16px;justify-content:center;outline:2px solid transparent;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),border var(--vchasno-ui-transition-duration-sec,.3s),outline var(--vchasno-ui-transition-duration-sec,.3s);width:16px}.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-checkbox-bg-color)}.vchasno-ui-checkbox__svg{color:transparent;transform:scale(0) translateZ(0);transition:color var(--vchasno-ui-transition-duration-sec),transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(.12,.4,.29,1.46)}.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg{display:none}.vchasno-ui-checkbox>input:checked+.vchasno-ui-checkbox__box{background-color:var(--vchasno-ui-checkbox-bg-color);border-color:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-checkbox>input:checked+.vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg{color:var(--vchasno-ui-checkbox-icon-color);transform:scale(1) translateZ(0)}.vchasno-ui-checkbox.--hover>input:not(:disabled)+.vchasno-ui-checkbox__box,.vchasno-ui-checkbox:hover>input:not(:disabled)+.vchasno-ui-checkbox__box,.vchasno-ui-checkbox>input:not(:disabled):active+.vchasno-ui-checkbox__box{border-color:var(--vchasno-ui-input-border-color-focused);outline:2px solid var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-checkbox>input:disabled:checked+.vchasno-ui-checkbox__box{background-color:var(--vchasno-ui-checkbox-disabled-bg,#bfcede);border-color:var(--vchasno-ui-checkbox-disabled-bg,#bfcede)}.vchasno-ui-checkbox>input:disabled:not(:checked)+.vchasno-ui-checkbox__box{border-color:var(--vchasno-ui-checkbox-disabled-border-color,#e2e9f3)}.vchasno-ui-checkbox>input:checked+.vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-checkbox-icon-color)}.vchasno-ui-checkbox__label{font-size:var(--vchasno-ui-checkbox-font-size);line-height:1;user-select:none}.vchasno-ui-checkbox.--disabled{color:var(--vchasno-ui-checkbox-disabled-bg,#bfcede);cursor:not-allowed}.vchasno-ui-meta{display:block;font-size:calc(var(--vchasno-ui-input-font-size)*.8);height:calc(var(--vchasno-ui-input-font-size)*.9);line-height:calc(var(--vchasno-ui-input-font-size)*.9);max-width:100%;padding-left:16px}.vchasno-ui-meta__error,.vchasno-ui-meta__hint{display:inline-block;max-width:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-meta__hint{color:var(--vchasno-ui-label-color-default)}.vchasno-ui-meta__error{color:var(--vchasno-ui-input-color-error)}.vchasno-ui-label-text{align-self:flex-start;background-color:var(--vchasno-ui-input-bg-color);border-radius:var(--vchasno-ui-border-radius-sm);color:var(--vchasno-ui-label-color-default);display:inline-flex;font-size:var(--vchasno-ui-input-font-size);gap:3px;left:12px;line-height:calc(var(--vchasno-ui-input-font-size)*1.2);max-width:calc(100% - 20px);padding:0 4px;pointer-events:none;position:absolute;text-overflow:ellipsis;top:50%;transform:translateY(-50%);transition:color var(--vchasno-ui-transition-duration-sec,.3s),top .3s,font-size .3s;white-space:nowrap;z-index:1}.vchasno-ui-select .vchasno-ui-label-text{max-width:calc(100% - 40px)}.vchasno-ui-select__floating-label,[class^=vchasno-ui-]:focus:not(.--disabled,[aria-hidden])+*+.vchasno-ui-label-text,[class^=vchasno-ui-]:focus:not(.--disabled,[aria-hidden])+.vchasno-ui-label-text,[class^=vchasno-ui-]:not(:placeholder-shown,[aria-hidden])+*+.vchasno-ui-label-text,[class^=vchasno-ui-]:not(:placeholder-shown,[aria-hidden])+.vchasno-ui-label-text{background-color:var(--vchasno-ui-input-bg-color);font-size:12px;top:0}.vchasno-ui-date-picker.--disabled:not(.--not-empty) .vchasno-ui-label-text,.vchasno-ui-input__wrapper:has(input:disabled):has(:placeholder-shown) .vchasno-ui-label-text,.vchasno-ui-select:not(:has(.vchasno-ui-select__value-container--has-value)).--disabled .vchasno-ui-label-text{background-color:var(--vchasno-ui-input-bg-color-disabled)}label[class^=vchasno-ui-]:not(.--error):focus-within .vchasno-ui-label-text{color:var(--vchasno-ui-label-color-focused)}label[class^=vchasno-ui-]:not(.--disabled).--error .vchasno-ui-label-text{color:var(--vchasno-ui-input-color-error)}label[class^=vchasno-ui-]:not(.--disabled).--required .vchasno-ui-label-text:hover{cursor:text}.vchasno-ui-label-text sup{color:var(--vchasno-ui-input-color-error);display:none;font-size:calc(var(--vchasno-ui-input-font-size)*1.4);position:relative;top:-.2em;vertical-align:top}label[class^=vchasno-ui-].--required .vchasno-ui-label-text sup{display:inline-block}.vchasno-ui-label-text__title-icon{color:var(--vchasno-ui-label-color-default);display:none;transform:scale(.8)}.vchasno-ui-input[title] .vchasno-ui-label-text__title-icon{display:block}.vchasno-ui-label-text__content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.react-datepicker__triangle{left:50px;position:absolute}.react-datepicker-popper[data-placement^=bottom]{margin-top:-6px}.react-datepicker-popper[data-placement^=top]{margin-top:6px}.react-datepicker-popper[data-placement^=right]{margin-left:-6px}.react-datepicker-popper[data-placement^=left]{margin-left:6px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker__month-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow{margin-left:-6px;position:absolute}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:before,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow:before,.react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow:before{border:6px solid transparent;box-sizing:content-box;height:0;position:absolute;width:1px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:before,.react-datepicker__month-read-view--down-arrow:before,.react-datepicker__year-read-view--down-arrow:before{border-bottom-color:var(--vchasno-ui-calendar-color);border-width:6px;content:"";left:-6px;z-index:-1}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{margin-top:-6px;top:0}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:before{border-bottom-color:var(--vchasno-ui-input-bg-color);border-top:none}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:before{border-bottom-color:var(--vchasno-ui-calendar-color);top:-1px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle:after{background-color:var(--vchasno-ui-input-bg-color);content:"";display:block;height:7px;left:-3px;position:absolute;top:1px;transform:rotate(45deg);width:7px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker__month-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow{bottom:0;margin-bottom:-6px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:before,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow:before,.react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view--down-arrow:before{border-bottom:none;border-top-color:var(--vchasno-ui-input-bg-color)}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:before,.react-datepicker__month-read-view--down-arrow:before,.react-datepicker__year-read-view--down-arrow:before{border-top-color:var(--vchasno-ui-calendar-color);bottom:-1px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle:after{background-color:var(--vchasno-ui-input-bg-color);bottom:1px;content:"";display:block;height:7px;left:-3px;position:absolute;transform:rotate(45deg);width:7px}.react-datepicker{background-color:var(--vchasno-ui-input-bg-color);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-shadow:0 4px 10px 0 #252d3d26;color:var(--vchasno-ui-input-font-color);display:inline-flex;font-size:14px;padding:10px;position:relative}.react-datepicker__time-container{float:right;width:85px}.react-datepicker__time-container--with-today-button{border:1px solid #aeaeae;border-radius:var(--vchasno-ui-border-radius-sm);display:inline;position:absolute;right:-87px;top:0}.react-datepicker__time-container .react-datepicker__time{background:#fff;border-bottom-right-radius:var(--vchasno-ui-border-radius-sm);position:relative}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box{border-bottom-right-radius:var(--vchasno-ui-border-radius-sm);margin:0 auto;overflow-x:hidden;text-align:center;width:85px}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list{box-sizing:content-box;height:calc(195px + .85rem);list-style:none;margin:0;overflow-y:scroll;padding-left:0;padding-right:0;width:100%}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item{border-radius:var(--vchasno-ui-border-radius-md);height:30px;line-height:20px;padding:5px 10px;white-space:nowrap}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover{background-color:#f0f0f0;cursor:pointer}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected{background-color:var(--vchasno-ui-calendar-color);color:#fff;font-weight:700}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover{background-color:var(--vchasno-ui-calendar-color)}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled{color:#ccc}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover{background-color:transparent;cursor:default}.react-datepicker__header--time{padding-bottom:8px;padding-left:5px;padding-right:5px}.react-datepicker__header--time:not(.react-datepicker__header--time--only){border-top-left-radius:var(--vchasno-ui-border-radius-none)}.react-datepicker__header{padding-top:5px;position:relative;text-align:center}.react-datepicker__header:not(.react-datepicker__header--has-time-select){border-top-right-radius:var(--vchasno-ui-border-radius-sm)}@media (width <= 480px){.react-datepicker{padding:0}}.react-datepicker-popper{z-index:100}.react-datepicker-popper[data-placement^=right] .react-datepicker__triangle{left:auto;right:42px}.react-datepicker-popper[data-placement^=left] .react-datepicker__triangle{left:42px;right:auto}.react-datepicker-time__header,.react-datepicker__current-month{color:var(--vchasno-ui-input-font-color);font-size:14px;font-weight:500;margin-top:0;padding:8px 0 15px;text-transform:capitalize}.react-datepicker__month-container{float:left}.react-datepicker__aria-live{display:none}.react-datepicker__month{display:flex;flex-direction:column;gap:1px;margin:0;text-align:center}.react-datepicker__day-names,.react-datepicker__week{white-space:nowrap}.react-datepicker__week{display:flex;gap:1px}.react-datepicker__day-name{text-transform:none}.react-datepicker__day,.react-datepicker__day-name,.react-datepicker__time-name{box-sizing:border-box;color:var(--vchasno-ui-input-font-color);cursor:pointer;display:inline-block;height:32px;line-height:30px;text-align:center;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s);width:32px}.react-datepicker__day-names .react-datepicker__day-name{font-weight:700;text-transform:capitalize}.react-datepicker__day:hover{background-color:#f2f6f7;border-radius:var(--vchasno-ui-border-radius-md)}.react-datepicker__day--today{border:1px solid var(--vchasno-ui-calendar-select-color);border-radius:var(--vchasno-ui-border-radius-md);font-weight:500}.react-datepicker__day--weekend{font-weight:400}.react-datepicker__day--outside-month{color:var(--vchasno-ui-color-surface-disabled-1)}.react-datepicker__day--disabled{color:#bfcede;cursor:not-allowed}.react-datepicker__day--disabled:hover{background-color:transparent}.react-datepicker__day--in-range,.react-datepicker__day--in-selecting-range,.react-datepicker__day--selected{background-color:var(--vchasno-ui-calendar-select-color);border-radius:var(--vchasno-ui-border-radius-md);color:#fff;font-weight:700}.react-datepicker__day--in-range:hover,.react-datepicker__day--in-selecting-range:hover,.react-datepicker__day--selected:hover{background-color:var(--vchasno-ui-calendar-select-color)}.react-datepicker__day--keyboard-selected:not(.react-datepicker__day--keyboard-selected){background-color:var(--vchasno-ui-calendar-select-color);border-radius:var(--vchasno-ui-border-radius-md);color:#fff}.react-datepicker__day--keyboard-selected:not(.react-datepicker__day--keyboard-selected):hover{background-color:var(--vchasno-ui-calendar-select-color)}.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range){background-color:rgba(33,107,165,.5)}.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range){background-color:#f0f0f0;color:var(--vchasno-ui-input-font-color)}.react-datepicker__input-container{position:relative}.react-datepicker__close-icon{background-color:transparent;border:0;bottom:0;cursor:pointer;height:20px;margin:auto;outline:none;position:absolute;right:35px;top:0;width:20px}.react-datepicker__today-button{background:#f0f0f0;border-top:1px solid #aeaeae;clear:left;cursor:pointer;font-weight:700;padding:5px 0;text-align:center}.react-datepicker__portal{align-items:center;background-color:rgba(0,0,0,.8);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:2147483647}.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__time-name{line-height:3rem;width:3rem}@media (height <= 550px),(width <= 400px){.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__time-name{line-height:2rem;width:2rem}}.react-datepicker__portal .react-datepicker-time__header,.react-datepicker__portal .react-datepicker__current-month{font-size:14px}.react-datepicker__navigation{align-items:center;background-size:cover;border:none;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;height:30px;justify-content:center;line-height:1;position:absolute;top:15px;width:30px;z-index:1}.react-datepicker__navigation:hover{background-color:#f2f6f7}.react-datepicker__navigation--previous{left:10px}.react-datepicker__navigation-icon{display:none}.react-datepicker__navigation--next:before,.react-datepicker__navigation--previous:before{height:10px;inset:0;margin:auto;position:absolute;width:10px}.react-datepicker__navigation--previous:before{color:var(--vchasno-ui-calendar-default-icon-color);content:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSIxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMCA0Ljk5MmMwLS4yNi4xLS41MS4yOS0uNzFsNC0zLjk5Yy4zOS0uMzkgMS4wMy0uMzkgMS40MiAwIC4zOS4zOS4zOSAxLjAzIDAgMS40MmwtMy4yOSAzLjI4IDMuMjkgMy4yOWMuMzkuMzkuMzkgMS4wMyAwIDEuNDItLjM5LjM5LTEuMDMuMzktMS40MiAwTC4zIDUuNzEyYy0uMi0uMi0uMy0uNDYtLjMtLjcyWiIgZmlsbD0iIzZlODA5YSIvPjwvc3ZnPg==")}.react-datepicker__navigation--next{color:var(--vchasno-ui-calendar-default-icon-color);right:10px}.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button){right:110px}.react-datepicker__navigation--next:before{content:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSIxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNi4wMDMgNS4wMDNjMCAuMjYtLjEuNTEtLjI5LjcxbC00IDMuOTljLS4zOS4zOS0xLjAzLjM5LTEuNDIgMC0uMzktLjM5LS4zOS0xLjAzIDAtMS40MmwzLjI5LTMuMjgtMy4yOS0zLjI5Yy0uMzktLjM5LS4zOS0xLjAzIDAtMS40Mi4zOS0uMzkgMS4wMy0uMzkgMS40MiAwbDMuOTkgMy45OWMuMi4yLjMuNDYuMy43MloiIGZpbGw9IiM2ZTgwOWEiLz48L3N2Zz4=")}.react-datepicker__input-container input{appearance:none;background:var(--vchasno-ui-input-bg-color);border:1px solid var(--vchasno-ui-input-border-color-default,#bfcede);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;font-size:var(--vchasno-ui-input-font-size,.8rem);height:30px;line-height:calc(var(--vchasno-ui-input-font-size, .8rem)*2);outline:1px solid transparent;padding:10px 15px;transition:border var(--vchasno-ui-transition-duration-sec,.3s),outline-color var(--vchasno-ui-transition-duration-sec,.3s);vertical-align:middle;width:100%}.react-datepicker__input-container input:disabled{background:var(--vchasno-ui-input-bg-color-disabled);color:var(--vchasno-ui-input-font-color)}.react-datepicker__input-container input:hover{cursor:default}.react-datepicker__input-container input:focus{border-color:var(--vchasno-ui-input-border-color-focused);outline:2px solid var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-date-picker{display:inline-flex;flex-direction:column;gap:5px}.vchasno-ui-date-picker.--wide{width:100%}.vchasno-ui-date-picker .vchasno-ui-date-picker__picker{height:50px}.vchasno-ui-date-picker__wrapper{border-radius:var(--vchasno-ui-border-radius-md);position:relative}.vchasno-ui-date-picker__wrapper .vchasno-ui-date-picker__custom-close-icon{color:var(--vchasno-ui-input-border-color-default);height:20px;pointer-events:none;position:absolute;right:35px;top:50%;transform:translateY(-50%) scale(0);transition:color var(--vchasno-ui-transition-duration-sec,.3s),transform var(--vchasno-ui-transition-duration-sec,.3s);width:20px}.vchasno-ui-date-picker__wrapper:has(.react-datepicker__close-icon) .vchasno-ui-date-picker__custom-close-icon{transform:translateY(-50%) scale(1)}@supports not selector(.vchasno-ui-date-picker__wrapper:has(.react-datepicker__close-icon)){.vchasno-ui-date-picker__wrapper .vchasno-ui-date-picker__custom-close-icon{transform:translateY(-50%) scale(1)}}.vchasno-ui-date-picker:not(.--disabled) .vchasno-ui-date-picker__wrapper:has(.react-datepicker__close-icon:hover) .vchasno-ui-date-picker__custom-close-icon{color:var(--vchasno-ui-calendar-default-icon-color)}.vchasno-ui-date-picker.--not-empty .vchasno-ui-label-text,.vchasno-ui-date-picker.--with-mask .vchasno-ui-label-text,.vchasno-ui-date-picker__wrapper:focus-within .vchasno-ui-label-text{font-size:var(--vchasno-ui-font-size-xs);top:0}.vchasno-ui-date-picker__wrapper>.vchasno-ui-date-picker__custom-calendar-icon{color:var(--vchasno-ui-calendar-default-icon-color);pointer-events:none;position:absolute;right:10px;top:50%;transform:translateY(-50%);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-picker.--loading .vchasno-ui-date-picker__wrapper>.vchasno-ui-spinner{position:absolute;right:10px;top:50%;transform:translateY(-50%)}.vchasno-ui-date-picker.--loading .vchasno-ui-date-picker__wrapper .vchasno-ui-spinner circle{stroke:var(--vchasno-ui-calendar-color)}.vchasno-ui-date-picker .react-datepicker__input-container input{color:var(--vchasno-ui-input-font-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);overflow:hidden;padding:var(--vchasno-ui-spacing-16);padding-right:24px;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-date-picker .react-datepicker__aria-live{display:none}.vchasno-ui-date-picker.--disabled,.vchasno-ui-date-picker.--disabled .vchasno-ui-date-picker__wrapper .vchasno-ui-date-picker__picker{cursor:not-allowed;opacity:.8}.vchasno-ui-date-picker:not(.--disabled):hover,.vchasno-ui-date-picker:not(.--disabled):hover .vchasno-ui-date-picker__wrapper .vchasno-ui-date-picker__picker{cursor:pointer}.vchasno-ui-date-picker:not(.--disabled):hover .react-datepicker__input-container input{border-color:var(--vchasno-ui-input-border-color-focused);outline:2px solid var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-date-picker:not(.--disabled).--error .react-datepicker__input-container input{border-color:var(--vchasno-ui-input-color-error);color:var(--vchasno-ui-input-color-error);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-date-picker.--is-label input::placeholder{visibility:hidden}.vchasno-ui-date-picker.--is-label:focus-within input::placeholder{visibility:visible}.vchasno-ui-date-picker[class*="--today-button-"] .react-datepicker{display:flex;flex-direction:column}.vchasno-ui-date-picker[class*="--today-button-"] .react-datepicker__today-button{align-items:center;border:0;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;gap:5px;justify-content:center;margin-top:12px;min-height:40px;padding:0 24px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-picker.--today-button-primary .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-primary-bg);border:1px solid transparent;color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-date-picker.--today-button-secondary .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-secondary-bg);border:1px solid var(--vchasno-ui-btn-secondary-border-color);color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-date-picker.--today-button-danger .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-danger-bg);border:0;color:var(--vchasno-ui-btn-danger-color)}.vchasno-ui-date-picker.--today-button-pink .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-date-picker.--today-button-primary .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-primary-hover-bg)}.vchasno-ui-date-picker.--today-button-secondary .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-secondary-hover-bg)}.vchasno-ui-date-picker.--today-button-danger .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-danger-hover-bg);color:var(--vchasno-ui-btn-danger-hover-color)}.vchasno-ui-date-picker.--today-button-pink .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-pink-hover-bg)}.vchasno-ui-datepicker-popper--today-button-danger .react-datepicker,.vchasno-ui-datepicker-popper--today-button-pink .react-datepicker,.vchasno-ui-datepicker-popper--today-button-primary .react-datepicker,.vchasno-ui-datepicker-popper--today-button-secondary .react-datepicker{display:flex;flex-direction:column}.vchasno-ui-datepicker-popper--today-button-danger .react-datepicker__today-button,.vchasno-ui-datepicker-popper--today-button-pink .react-datepicker__today-button,.vchasno-ui-datepicker-popper--today-button-primary .react-datepicker__today-button,.vchasno-ui-datepicker-popper--today-button-secondary .react-datepicker__today-button{align-items:center;border:0;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;gap:5px;justify-content:center;margin-top:12px;min-height:40px;padding:0 24px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-datepicker-popper--today-button-primary .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-primary-bg);border:1px solid transparent;color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-datepicker-popper--today-button-secondary .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-secondary-bg);border:1px solid var(--vchasno-ui-btn-secondary-border-color);color:var(--vchasno-ui-btn-secondary-color)}.vchasno-ui-datepicker-popper--today-button-danger .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-danger-bg);border:0;color:var(--vchasno-ui-btn-danger-color)}.vchasno-ui-datepicker-popper--today-button-pink .react-datepicker__today-button{background-color:var(--vchasno-ui-btn-pink-bg);color:var(--vchasno-ui-btn-primary-color)}.vchasno-ui-datepicker-popper--today-button-primary .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-primary-hover-bg)}.vchasno-ui-datepicker-popper--today-button-secondary .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-secondary-hover-bg)}.vchasno-ui-datepicker-popper--today-button-danger .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-danger-hover-bg);color:var(--vchasno-ui-btn-danger-hover-color)}.vchasno-ui-datepicker-popper--today-button-pink .react-datepicker__today-button:hover{background-color:var(--vchasno-ui-btn-pink-hover-bg)}.vchasno-ui-select{display:inline-flex;flex-direction:column;gap:5px;position:relative}.vchasno-ui-select .vchasno-ui-label-text{top:0;transform:translateY(16px);transition:font-size .3s,transform .3s}.vchasno-ui-select:focus-within .vchasno-ui-label-text,.vchasno-ui-select:has(.vchasno-ui-select__value-container--has-value) .vchasno-ui-label-text{font-size:12px;transform:translateY(-8px)}@supports not selector(.vchasno-ui-select:has(.vchasno-ui-select__value-container--has-value)){.vchasno-ui-select .vchasno-ui-label-text{font-size:12px;transform:translateY(-42px)}}.vchasno-ui-select.--wide{width:100%}.vchasno-ui-select .vchasno-ui-select__control{border-color:var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;font-family:Roboto,Arial,Tahoma,Helvetica,Liberation Sans,sans-serif;min-height:50px;min-width:200px;outline:3px solid transparent;transition:border var(--vchasno-ui-transition-duration-sec,.3s),outline var(--vchasno-ui-transition-duration-sec,.3s)}.--pulse .vchasno-ui-select__control{animation:box-shadow-pulse 1.5s infinite;box-shadow:0 0 0 0 rgb(var(--vchasno-pulse-animation-color)/30%)}.vchasno-ui-select .vchasno-ui-select__control:has(.vchasno-ui-select__input){cursor:text}.vchasno-ui-select.--disabled .vchasno-ui-select__control{background-color:var(--vchasno-ui-input-bg-color-disabled);border:1px solid var(--vchasno-ui-input-border-color-default)}.vchasno-ui-select .vchasno-ui-select__control.vchasno-ui-select__control--is-disabled{opacity:.8}.vchasno-ui-select .vchasno-ui-select__option,.vchasno-ui-select__menu-portal .vchasno-ui-select__option{transition:opacity var(--vchasno-ui-transition-duration-sec,.3s),background-color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select.--disabled .vchasno-ui-select__option,.vchasno-ui-select__menu-portal.--disabled .vchasno-ui-select__option{background-color:#f3f8fb;opacity:.8;pointer-events:none}.vchasno-ui-select .vchasno-ui-select__menu,.vchasno-ui-select__menu-portal .vchasno-ui-select__menu{border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-shadow:none;margin-bottom:6px;margin-top:4px;transition:border var(--vchasno-ui-transition-duration-sec,.3s);z-index:100}.vchasno-ui-select .vchasno-ui-select__control--menu-is-open{border-color:red;outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-select.--error .vchasno-ui-select__control,.vchasno-ui-select.--error:hover .vchasno-ui-select__control--menu-is-open{border:1px solid var(--vchasno-ui-text-error-color);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-select .vchasno-ui-select__control:hover{border-color:var(--vchasno-ui-input-border-color-focused);outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-select .vchasno-ui-select__dropdown-indicator,.vchasno-ui-select .vchasno-ui-select__input-container{color:var(--vchasno-ui-input-font-color)}.vchasno-ui-select.--error .vchasno-ui-select__control:hover{border-color:var(--vchasno-ui-text-error-color);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-select .vchasno-ui-select__control--menu-is-open .vchasno-ui-select__dropdown-indicator{transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select.--error .vchasno-ui-select__dropdown-indicator{color:var(--vchasno-ui-text-error-color)}.vchasno-ui-select.--error .vchasno-ui-select__control--menu-is-open .vchasno-ui-select__dropdown-indicator{color:var(--vchasno-ui-text-error-color);transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select.--error .vchasno-ui-select__control:hover .vchasno-ui-select__dropdown-indicator,.vchasno-ui-select.--error .vchasno-ui-select__dropdown-indicator:hover{color:var(--vchasno-ui-text-error-color)}.vchasno-ui-select.--error .vchasno-ui-select__control--menu-is-open+.vchasno-ui-select__menu,.vchasno-ui-select.--error .vchasno-ui-select__control.vchasno-ui-select__control--menu-is-open{border:1px solid var(--vchasno-ui-text-error-color)}.vchasno-ui-select .vchasno-ui-select__control.vchasno-ui-select__control--is-focused{border-color:var(--vchasno-ui-input-border-color-focused);box-shadow:none;outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-select .vchasno-ui-spinner__svg__circle{stroke:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-select .vchasno-ui-select__placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);font-weight:400}.vchasno-ui-select:not(:focus-within,:not(:has(.vchasno-ui-label-text))) .vchasno-ui-select__placeholder{visibility:hidden}.vchasno-ui-select .vchasno-ui-select__clear-indicator{border-radius:var(--vchasno-ui-border-radius-sm);color:var(--vchasno-ui-input-font-color);padding:0;transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select .vchasno-ui-select__clear-indicator:hover{color:var(--vchasno-ui-input-color-error);cursor:pointer}.vchasno-ui-select .vchasno-ui-select__option--is-focused,.vchasno-ui-select .vchasno-ui-select__option--is-selected,.vchasno-ui-select .vchasno-ui-select__option:hover,.vchasno-ui-select__menu-portal .vchasno-ui-select__option--is-focused,.vchasno-ui-select__menu-portal .vchasno-ui-select__option--is-selected,.vchasno-ui-select__menu-portal .vchasno-ui-select__option:hover{background-color:var(--vchasno-ui-select-option-bg-selected);color:var(--vchasno-ui-select-option-color-selected)}.vchasno-ui-select .vchasno-ui-select__option:hover,.vchasno-ui-select__menu-portal .vchasno-ui-select__option:hover{cursor:pointer}.vchasno-ui-select.--disabled{cursor:not-allowed}.vchasno-ui-select .vchasno-ui-select__multi-value{background-color:var(--vchasno-ui-select-option-bg-selected);border-radius:var(--vchasno-ui-border-radius-md);outline:1px solid var(--vchasno-ui-select-menu-border-color,transparent)}.vchasno-ui-select .vchasno-ui-select__multi-value__remove{background-color:transparent;color:var(--vchasno-ui-label-color-default);padding:0 3px 0 0;transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-select .vchasno-ui-select__multi-value__remove:hover{background-color:transparent;color:var(--vchasno-ui-input-color-error);cursor:pointer}.vchasno-ui-select .vchasno-ui-select__multi-value__remove svg{height:20px;width:20px}.vchasno-ui-select .vchasno-ui-select__indicators{padding-right:5px}.vchasno-ui-select .vchasno-ui-select__value-container{padding:5px 14px}.vchasno-ui-select .vchasno-ui-select__multi-value__label{font-size:14px;padding:6px 0 6px 6px}.vchasno-ui-select .vchasno-ui-select .vchasno-ui-select__multi-value__remove{font-size:14px;padding:6px}.vchasno-ui-date-range-picker{display:inline-flex;flex-direction:column;gap:5px;max-width:260px;width:100%}.vchasno-ui-date-range-picker .vchasno-ui-date-range-picker__picker{height:50px}.vchasno-ui-date-range-picker__wrapper{border-radius:var(--vchasno-ui-border-radius-md);position:relative}.vchasno-ui-date-range-picker__wrapper>.vchasno-ui-date-range-picker__custom-calendar-icon{background-color:var(--vchasno-ui-btn-light-bg);color:var(--vchasno-ui-calendar-default-icon-color);pointer-events:none;position:absolute;right:10px;top:50%;transform:translateY(-50%);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-range-picker.--loading .vchasno-ui-date-range-picker__wrapper>.vchasno-ui-spinner{height:18px;position:absolute;right:10px;top:50%;transform:translateY(-50%)}.vchasno-ui-date-range-picker.--loading .vchasno-ui-date-range-picker__wrapper .vchasno-ui-spinner circle{stroke:var(--vchasno-ui-calendar-color)}.vchasno-ui-date-range-picker__clear-btn{align-items:center;background:transparent;border:none;cursor:pointer;display:flex;justify-content:center;padding:0}.vchasno-ui-date-range-picker__wrapper .vchasno-ui-date-range-picker__custom-close-icon{background-color:var(--vchasno-ui-btn-light-bg);color:var(--vchasno-ui-input-border-color-default);cursor:pointer;height:20px;position:absolute;right:35px;top:50%;transform:translateY(-50%);transition:color var(--vchasno-ui-transition-duration-sec,.3s);width:20px}.vchasno-ui-date-range-picker__wrapper .vchasno-ui-date-range-picker__custom-close-icon:hover{color:var(--vchasno-ui-calendar-default-icon-color)}.vchasno-ui-date-range-picker__preset-select .vchasno-ui-label-text,.vchasno-ui-date-range-picker__preset-select:focus-within .vchasno-ui-label-text{font-size:var(--vchasno-ui-input-font-size);top:50%;transform:translateY(-50%)}.vchasno-ui-date-range-picker.--filled .vchasno-ui-label-text,.vchasno-ui-date-range-picker.--not-empty .vchasno-ui-label-text,.vchasno-ui-date-range-picker__wrapper:focus-within .vchasno-ui-label-text{font-size:var(--vchasno-ui-font-size-xs);top:0}.vchasno-ui-date-range-picker.--disabled,.vchasno-ui-date-range-picker.--disabled .vchasno-ui-date-range-picker__wrapper .vchasno-ui-date-range-picker__picker{cursor:not-allowed;opacity:.8}.vchasno-ui-date-range-picker:not(.--disabled) .react-datepicker__input-container input,.vchasno-ui-date-range-picker:not(.--disabled) .react-datepicker__input-container input:hover{cursor:text}.vchasno-ui-date-range-picker:not(.--disabled):hover{cursor:pointer}.vchasno-ui-date-range-picker:not(.--disabled):hover .react-datepicker__input-container input{border-color:var(--vchasno-ui-input-border-color-focused);outline:2px solid var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-date-range-picker:not(.--disabled).--error .react-datepicker__input-container input{border-color:var(--vchasno-ui-input-color-error);color:var(--vchasno-ui-input-color-error);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-date-range-picker.--is-label input::placeholder{visibility:hidden}.vchasno-ui-date-range-picker.--is-label:focus-within input::placeholder{visibility:visible}.vchasno-ui-date-range-picker.--preset-label .vchasno-ui-date-range-picker__wrapper .react-datepicker__input-container input{caret-color:transparent;color:transparent}.vchasno-ui-date-range-picker__preset-label{align-items:center;color:var(--vchasno-ui-input-font-color);display:flex;font-size:var(--vchasno-ui-input-font-size);inset:0;line-height:normal;overflow:hidden;padding:0 45px 0 16px;pointer-events:none;position:absolute;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-date-range-picker-popper .react-datepicker{display:grid;grid:". ." "buttons buttons";grid-auto-columns:1fr;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;padding:0}.vchasno-ui-date-range-picker .react-datepicker__children-container{align-items:start;border-top:1px solid var(--vchasno-ui-input-border-color-default);display:flex;gap:16px;grid-area:buttons;padding:20px 12px}.vchasno-ui-date-range-picker .react-datepicker__week{gap:1px 0}.vchasno-ui-date-range-picker.--wide{width:100%}.vchasno-ui-date-range-picker-popper .react-datepicker__month-container{float:none;padding:8px}.vchasno-ui-date-range-picker__presets{width:100%}.vchasno-ui-date-range-picker__preset-select .vchasno-ui-select__control{height:40px;min-height:auto}.vchasno-ui-date-range-picker__preset-select .vchasno-ui-select__value-container{padding:0 14px}.vchasno-ui-date-range-picker__actions{display:flex;gap:8px;justify-content:flex-end;width:100%}.vchasno-ui-date-range-picker__cancel-btn{background-color:var(--vchasno-ui-btn-secondary-bg);border:1px solid var(--vchasno-ui-btn-secondary-border-color);border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-btn-secondary-color);cursor:pointer;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;min-height:40px;padding:0 24px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-range-picker__cancel-btn:hover{background-color:var(--vchasno-ui-btn-secondary-hover-bg)}.vchasno-ui-date-range-picker__save-btn{background-color:var(
|
|
2
2
|
--vchasno-ui-color-surface-brand-default,var(--vchasno-ui-btn-primary-bg)
|
|
3
3
|
);border:1px solid transparent;border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-btn-primary-color);cursor:pointer;font-size:var(--vchasno-ui-btn-font-size);font-weight:500;min-height:40px;padding:0 24px;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-date-range-picker__save-btn:hover{background-color:var(
|
|
4
4
|
--vchasno-ui-color-surface-brand-default-hover,var(--vchasno-ui-btn-primary-hover-bg)
|
|
5
|
-
)}.vchasno-ui-date-range-picker-popper .react-datepicker__navigation{display:none}.vchasno-ui-date-range-picker-popper .vchasno-ui-date-range-picker__header{align-items:center;display:flex;justify-content:space-between;padding:8px 0 15px}.vchasno-ui-date-range-picker__month-title{color:var(--vchasno-ui-input-font-color);font-size:14px;font-weight:500;text-transform:capitalize}.vchasno-ui-date-range-picker__nav-btn{align-items:center;background:transparent;border:none;border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-calendar-default-icon-color);cursor:pointer;display:flex;height:30px;justify-content:center;width:30px}.vchasno-ui-date-range-picker__nav-btn:hover{background-color:var(--vchasno-ui-color-gray-100)}.vchasno-ui-date-range-picker__nav-btn:disabled{cursor:not-allowed;opacity:.3}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-range:not(.react-datepicker__day--range-start,.react-datepicker__day--range-end){background-color:var(--vchasno-ui-color-utility-blue-50);border-radius:0;color:var(--vchasno-ui-input-font-color);font-weight:400}.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-end,.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-start{background-color:var(--vchasno-ui-calendar-select-color);color:var(--vchasno-ui-color-gray-0);font-weight:700}.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-start.react-datepicker__day--range-end{border-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range){background-color:var(--vchasno-ui-calendar-select-color)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-range.react-datepicker__day--today{border-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--outside-month{pointer-events:none;visibility:hidden}.vchasno-ui-flex-box{align-content:flex-start;display:flex;flex-direction:row;gap:10px;max-width:100%}.vchasno-ui-text{color:var(--vchasno-ui-text-primary-color,#252d3d)}.vchasno-ui-text.--ellipsis{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-text.--secondary{color:var(--vchasno-ui-text-secondary-color,#5a6a81)}.vchasno-ui-text.--success{color:var(--vchasno-ui-text-success-color,#1cb800)}.vchasno-ui-text.--warning{color:var(--vchasno-ui-text-warning-color,#ff9c01)}.vchasno-ui-text.--danger{color:var(--vchasno-ui-text-error-color,#f54f4f)}.vchasno-ui-text.--code{background:hsla(0,0%,59%,.1);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-sm);font-size:85%;margin:0 .2em;padding:.2em .4em .1em}.vchasno-ui-text.--inherit{font-size:inherit}.vchasno-ui-text.--like-link,.vchasno-ui-text.--link{color:var(--vchasno-ui-text-link-color);cursor:pointer}.vchasno-ui-text.--link{text-decoration-line:underline}.vchasno-ui-text.--normal{font-size:1rem;line-height:1.1rem}.vchasno-ui-text.--small{font-size:.8rem;line-height:.9rem}.vchasno-ui-text.--large{font-size:1.2rem;line-height:1.3rem}.vchasno-ui-text.--required:after{color:var(--vchasno-ui-text-error-color,#f54f4f);content:"*";position:relative;right:-2px;top:-3px}strong.vchasno-ui-text{font-weight:700}.vchasno-ui-FollowUs{min-height:24px;min-width:24px}.vchasno-ui-FollowUs__label{font-size:14px}.vchasno-ui-FollowUs__link{display:block;flex-grow:0;flex-shrink:0;height:24px;transition:filter .3s;width:24px}.vchasno-ui-FollowUs__link img{display:block}.vchasno-ui-FollowUs__link:hover{filter:brightness(80%)}.vchasno-ui-input{display:inline-flex;flex-direction:column;gap:5px;max-width:100%}.vchasno-ui-input input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input .vchasno-ui-mask-input,.vchasno-ui-input .vchasno-ui-text-input{flex-grow:1}.vchasno-ui-input.--wide{width:100%}.vchasno-ui-input__wrapper{align-items:center;background-color:var(--vchasno-ui-input-bg-color);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;display:flex;min-height:50px;outline:3px solid transparent;padding-left:16px;padding-right:33px;position:relative;transition:border var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper>input{max-width:100%}.vchasno-ui-input__wrapper__start-element{align-items:center;display:flex;flex-grow:0;flex-shrink:0;font-size:var(--vchasno-ui-input-font-size,14px);line-height:var(--vchasno-ui-input-font-size,14px);margin-right:5px}.vchasno-ui-input__feedback{display:block;height:18px;position:absolute;right:10px;top:50%;transform:translateY(-50%);width:18px}.vchasno-ui-input__clear-btn{cursor:pointer;display:block;height:18px;transition:transform var(--vchasno-ui-transition-duration-sec,.3s);width:18px}.vchasno-ui-input__clear-btn svg{height:100%;transition:color var(--vchasno-ui-transition-duration-sec,.3s);width:100%}.vchasno-ui-input__clear-btn:hover svg{color:var(--vchasno-ui-input-color-error)}.vchasno-ui-input .vchasno-ui-spinner__svg__circle,.vchasno-ui-input .vchasno-ui-spinner__svg__path{stroke:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-input.--disabled .vchasno-ui-input__wrapper{background-color:var(--vchasno-ui-input-bg-color-disabled);color:var(--vchasno-ui-input-font-color-disabled)}.vchasno-ui-input:not(.--disabled) .vchasno-ui-input__wrapper:hover{cursor:text}.vchasno-ui-input:not(.--disabled):hover .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-input:not(.--disabled):focus-within .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-border-color-focused);outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-input:not(.--disabled).--error .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-color-error);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-input.--disabled,.vchasno-ui-input.--disabled *{cursor:not-allowed;opacity:.8}.vchasno-ui-input.--is-label input::placeholder,.vchasno-ui-input.--is-label textarea::placeholder{visibility:hidden}.vchasno-ui-input.--is-label:focus-within input::placeholder,.vchasno-ui-input.--is-label:focus-within textarea::placeholder{visibility:visible}.vchasno-ui-mask-input{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);position:relative}.vchasno-ui-mask-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.szh-menu-button{box-sizing:border-box}.vchasno-ui-menu-button{align-items:center;border:none;border-radius:var(--vchasno-ui-border-radius-sm);cursor:pointer;display:flex;justify-content:center;padding:5px;transition:background-color var(--vchasno-ui-transition-duration-sec)}.vchasno-ui-menu-button:hover{background-color:var(--vchasno-ui-menu-button-bg)}.szh-menu__item{align-items:center;border-radius:var(--vchasno-ui-border-radius-sm);cursor:pointer;display:flex;padding:10px 12px;position:relative;transition:background-color var(--vchasno-ui-transition-duration-sec)}.szh-menu__item+.szh-menu__item{margin-top:4px}.szh-menu__item:focus{outline:none}.szh-menu__item--hover{background-color:var(--vchasno-ui-menu-item-hover-bg)}.szh-menu__item--focusable{background-color:inherit;cursor:default}.szh-menu__item--disabled{color:#aaa;cursor:default}.vchasno-ui-menu-submenu.szh-menu__submenu>.szh-menu__item{padding:10px 12px}.vchasno-ui-menu-submenu .szh-menu__item--submenu:after{display:none}.vchasno-ui-menu-submenu-label-container{width:100%}.szh-menu{background-color:#fff;border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;color:#212529;list-style:none;margin:0;min-width:10rem;padding:8px;user-select:none;width:max-content;z-index:100}.szh-menu:focus{outline:none}.szh-menu__arrow{background-color:#fff;border-color:rgba(0,0,0,.1) transparent transparent rgba(0,0,0,.1);border-style:solid;border-width:1px;box-sizing:border-box;height:.75rem;width:.75rem;z-index:-1}.szh-menu__arrow--dir-left{right:-.375rem;transform:translateY(-50%) rotate(135deg)}.szh-menu__arrow--dir-right{left:-.375rem;transform:translateY(-50%) rotate(-45deg)}.szh-menu__arrow--dir-top{bottom:-.375rem;transform:translateX(-50%) rotate(-135deg)}.szh-menu__arrow--dir-bottom{top:-.375rem;transform:translateX(-50%) rotate(45deg)}.szh-menu__group{box-sizing:border-box}.szh-menu__radio-group{list-style:none;margin:0;padding:0}.szh-menu__divider{background-color:rgba(0,0,0,.12);height:1px;margin:.5rem 0}.szh-menu-container--itemTransition .szh-menu__item{transition-duration:.15s;transition-property:background-color,color;transition-timing-function:ease-in-out}.szh-menu__item--type-radio{padding-left:2.2rem}.szh-menu__item--type-radio:before{content:"○";font-size:.8rem;left:.8rem;position:absolute;top:.55rem}.szh-menu__item--type-radio.szh-menu__item--checked:before{content:"●"}.szh-menu__item--type-checkbox{padding-left:2.2rem}.szh-menu__item--type-checkbox:before{left:.8rem;position:absolute}.szh-menu__item--type-checkbox.szh-menu__item--checked:before{content:"✔"}.szh-menu__submenu>.szh-menu__item{padding-right:2.5rem}.szh-menu__submenu>.szh-menu__item:after{content:"❯";position:absolute;right:1rem}.szh-menu__header{color:#888;font-size:.8rem;padding:.2rem 1.5rem;text-transform:uppercase}.vchasno-ui-MobileAppLinks{min-width:100px}.vchasno-ui-MobileAppLinks__label{font-size:14px}.vchasno-ui-MobileAppLinks__link{aspect-ratio:300/89;display:block;max-width:150px;transition:filter .3s}.vchasno-ui-MobileAppLinks__link img{display:block}.vchasno-ui-MobileAppLinks__link:hover{filter:brightness(80%)}.vchasno-ui-pagination{align-items:center;display:inline-flex;flex-shrink:0;font-size:14px;gap:10px}.vchasno-ui-pagination__item{align-items:center;background-color:#fff;border:1px solid transparent;border-radius:var(--vchasno-ui-border-radius-md);cursor:pointer;display:flex;flex-grow:0;flex-shrink:0;height:var(--vchasno-ui-pagination-size);justify-content:center;min-width:var(--vchasno-ui-pagination-size);outline:0;text-align:center;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s),border var(--vchasno-ui-transition-duration-sec,.3s);user-select:none;vertical-align:middle}.vchasno-ui-pagination__item-arrow{align-items:center;display:inline-flex;justify-content:center}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-disabled):focus-visible{border-color:var(--vchasno-ui-pagination-border-color);box-shadow:0 0 0 2px var(--vchasno-ui-pagination-focus-shadow-color);z-index:1}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-disabled):hover{background-color:var(--vchasno-ui-pagination-hover-bg-color)}.vchasno-ui-pagination__item-active{border-color:var(--vchasno-ui-pagination-border-color)}.vchasno-ui-pagination__item-disabled{cursor:not-allowed;opacity:.8}.vchasno-ui-pagination__item-hidden{display:none}.--text-start{text-align:start}.--text-center{text-align:center}.--text-end{text-align:end}.--text-justify{text-align:justify}.vchasno-ui-paragraph{color:var(--vchasno-ui-text-primary-color)}.vchasno-ui-paragraph.--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-paragraph.--ellipsis-line{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;white-space:unset}.vchasno-ui-paragraph.--text-center{text-align:center}.vchasno-ui-paragraph.--text-left{text-align:left}.vchasno-ui-paragraph.--text-right{text-align:right}.vchasno-ui-paragraph.--text-justify{text-align:justify}.vchasno-ui-ProjectsPopover{background-color:#fff;border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;display:inline-block;max-width:calc(100vw - 32px);padding:24px 16px 0;width:440px}.vchasno-ui-ProjectsPopover__content{display:flex;flex-direction:column;gap:32px}.vchasno-ui-ProjectsPopover__products{box-sizing:border-box;display:flex;flex-wrap:wrap;gap:10px;width:calc(100% + 32px)}.vchasno-ui-ProjectsPopover a:hover{color:unset;text-decoration:none}.vchasno-ui-ProjectsPopover--border{border:1px solid #e2e9f3}.vchasno-ui-ProjectsPopover__title{font-size:16px;font-style:normal;font-weight:500;line-height:18px;width:100%}.vchasno-ui-ProjectsPopover__box{align-items:center;aspect-ratio:198/80;border:1px solid #e2e9f3;border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;color:var(--vchasno-ui-text-primary-color);display:inline-flex;gap:8px;padding:20px;text-decoration:none;transition:background-color .3s;width:198px}.vchasno-ui-ProjectsPopover__box>svg{max-width:90%}.vchasno-ui-ProjectsPopover__box__icon{border-radius:var(--vchasno-ui-border-radius-full);box-sizing:border-box;flex-shrink:0;height:40px;width:40px}.vchasno-ui-ProjectsPopover__box:hover{background-color:#f3f8fb;cursor:pointer}.vchasno-ui-ProjectsPopover__box__title{font-size:14px;font-style:normal;font-weight:400;line-height:26px}.vchasno-ui-ProjectsPopover .vchasno-ui-ProjectsPopover__footer{align-items:center;background:#e0eeff;border-bottom-left-radius:var(--vchasno-ui-border-radius-md);border-bottom-right-radius:var(--vchasno-ui-border-radius-md);color:#6e809a;display:flex;font-size:12px;font-weight:400;justify-content:center;margin:0 -16px;min-height:42px}.vchasno-ui-ProjectsPopover .vchasno-ui-ProjectsPopover__footer>a{color:#0890de;text-decoration:none}.vchasno-ui-ProjectsPopover__tooltip-hint{text-align:center}@media screen and (width <= 480px){.vchasno-ui-ProjectsPopover{width:330px}.vchasno-ui-ProjectsPopover__box{aspect-ratio:1/1;flex-direction:column;justify-content:center;padding:10px;width:calc(50% - 20px)}}.vchasno-ui-PulseDot{background-color:var(--vchasno-ui-pulse-dot-color);border-radius:var(--vchasno-ui-border-radius-full);height:var(--vchasno-ui-pulse-dot-size);position:relative;width:var(--vchasno-ui-pulse-dot-size)}.vchasno-ui-PulseDot:after,.vchasno-ui-PulseDot:before{background:inherit;border-radius:var(--vchasno-ui-border-radius-full);content:"";height:100%;pointer-events:none;position:absolute;width:100%}.vchasno-ui-PulseDot:before{animation:pulse 2s ease-out infinite}.vchasno-ui-PulseDot:after{animation:pulse 2s ease-out 1s infinite}@keyframes pulse{to{opacity:0;transform:scale(2)}}:root{--toastify-color-light:var(--vchasno-ui-snackbar-color-light);--toastify-color-dark:var(--vchasno-ui-snackbar-color-dark);--toastify-color-info:var(--vchasno-ui-snackbar-color-info);--toastify-color-success:var(--vchasno-ui-snackbar-color-success);--toastify-color-warning:var(--vchasno-ui-snackbar-color-warning);--toastify-color-error:var(--vchasno-ui-snackbar-color-error);--toastify-color-transparent:var(--vchasno-ui-snackbar-color-transparent);--toastify-icon-color-info:var(--vchasno-ui-snackbar-icon-color-info);--toastify-icon-color-success:var(--vchasno-ui-snackbar-icon-color-success);--toastify-icon-color-warning:var(--vchasno-ui-snackbar-icon-color-warning);--toastify-icon-color-error:var(--vchasno-ui-snackbar-icon-color-error);--toastify-toast-width:var(--vchasno-ui-snackbar-toast-width);--toastify-toast-offset:var(--vchasno-ui-snackbar-toast-offset);--toastify-toast-top:var(--vchasno-ui-snackbar-toast-top);--toastify-toast-right:var(--vchasno-ui-snackbar-toast-right);--toastify-toast-left:var(--vchasno-ui-snackbar-toast-left);--toastify-toast-bottom:var(--vchasno-ui-snackbar-toast-bottom);--toastify-toast-background:var(--vchasno-ui-snackbar-toast-background);--toastify-toast-min-height:var(--vchasno-ui-snackbar-toast-min-height);--toastify-toast-max-height:var(--vchasno-ui-snackbar-toast-max-height);--toastify-toast-bd-radius:var(--vchasno-ui-snackbar-toast-bd-radius);--toastify-font-family:var(--vchasno-ui-snackbar-font-family);--toastify-z-index:var(--vchasno-ui-snackbar-z-index);--toastify-text-color-light:var(--vchasno-ui-snackbar-text-color-light);--toastify-text-color-dark:var(--vchasno-ui-snackbar-text-color-dark);--toastify-text-color-info:var(--vchasno-ui-snackbar-text-color-info);--toastify-text-color-success:var(--vchasno-ui-snackbar-text-color-success);--toastify-text-color-warning:var(--vchasno-ui-snackbar-text-color-warning);--toastify-text-color-error:var(--vchasno-ui-snackbar-text-color-error);--toastify-spinner-color:var(--vchasno-ui-snackbar-spinner-color);--toastify-spinner-color-empty-area:var(--vchasno-ui-snackbar-spinner-color-empty-area);--toastify-color-progress-light:var(--vchasno-ui-snackbar-color-progress-light);--toastify-color-progress-dark:var(--vchasno-ui-snackbar-color-progress-dark);--toastify-color-progress-info:var(--vchasno-ui-snackbar-color-progress-info);--toastify-color-progress-success:var(--vchasno-ui-snackbar-color-progress-success);--toastify-color-progress-warning:var(--vchasno-ui-snackbar-color-progress-warning);--toastify-color-progress-error:var(--vchasno-ui-snackbar-color-progress-error);--toastify-color-progress-bgo:var(--vchasno-ui-snackbar-color-progress-bgo)}.Toastify__toast-container{box-sizing:border-box;color:#fff;padding:4px;position:fixed;transform:translateZ(var(--toastify-z-index));width:var(--toastify-toast-width);z-index:var(--toastify-z-index)}.Toastify__toast-container--top-left{left:1em;top:1em}.Toastify__toast-container--top-center{left:50%;top:1em;transform:translateX(-50%)}.Toastify__toast-container--top-right{right:1em;top:1em}.Toastify__toast-container--bottom-left{bottom:1em;left:1em}.Toastify__toast-container--bottom-center{bottom:1em;left:50%;transform:translateX(-50%)}.Toastify__toast-container--bottom-right{bottom:1em;right:1em}@media only screen and (width <= 480px){.Toastify__toast-container{left:0;margin:0;padding:0;width:100vw}.Toastify__toast-container--top-center,.Toastify__toast-container--top-left,.Toastify__toast-container--top-right{top:0;transform:translateX(0)}.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-right{bottom:0;transform:translateX(0)}.Toastify__toast-container--rtl{left:auto;right:0}}.Toastify__toast{-ms-flex-pack:justify;border-radius:var(--vchasno-ui-border-radius-sm);box-shadow:0 1px 10px 0 rgba(0,0,0,.1),0 2px 15px 0 rgb(0 0 0/5%);box-sizing:border-box;cursor:default;direction:ltr;display:flex;font-family:var(--toastify-font-family);justify-content:space-between;margin-bottom:1rem;max-height:var(--toastify-toast-max-height);min-height:var(--toastify-toast-min-height);overflow:hidden;padding:8px;position:relative;z-index:0}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-body{-ms-flex-align:center;align-items:center;display:flex;flex:1 1 auto;margin:auto 0;padding:6px}.Toastify__toast-body>div:last-child{flex:1;word-break:break-word}.Toastify__toast-icon{-ms-flex-negative:0;-webkit-margin-end:10px;display:flex;flex-shrink:0;margin-inline-end:10px;width:20px}.Toastify--animate{animation-duration:.7s;animation-fill-mode:both}.Toastify--animate-icon{animation-duration:.3s;animation-fill-mode:both}@media only screen and (width <= 480px){.Toastify__toast{border-radius:var(--vchasno-ui-border-radius-none);margin-bottom:0}}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--colored.Toastify__toast--default,.Toastify__toast-theme--light{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{background:var(--toastify-color-info);color:var(--toastify-text-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{background:var(--toastify-color-success);color:var(--toastify-text-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{background:var(--toastify-color-warning);color:var(--toastify-text-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{background:var(--toastify-color-error);color:var(--toastify-text-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning{background:var(--toastify-color-transparent)}.Toastify__close-button{-ms-flex-item-align:start;align-self:flex-start;background:transparent;border:none;color:#fff;cursor:pointer;opacity:.7;outline:none;padding:0;transition:.3s ease}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentcolor;height:16px;width:14px}.Toastify__close-button:focus,.Toastify__close-button:hover{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{bottom:0;height:5px;left:0;opacity:.7;position:absolute;transform-origin:left;width:100%;z-index:var(--toastify-z-index)}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{left:auto;right:0;transform-origin:right}.Toastify__spinner{animation:Toastify__spin .65s linear infinite;border:2px solid;border-color:var(--toastify-spinner-color-empty-area);border-radius:var(--vchasno-ui-border-radius-full);border-right-color:var(--toastify-spinner-color);box-sizing:border-box;height:20px;width:20px}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--bottom-left,.Toastify__bounce-enter--top-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--bottom-right,.Toastify__bounce-enter--top-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--bottom-left,.Toastify__bounce-exit--top-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--bottom-right,.Toastify__bounce-exit--top-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{animation-timing-function:ease-in;opacity:0;transform:perspective(400px) rotateX(90deg)}40%{animation-timing-function:ease-in;transform:perspective(400px) rotateX(-20deg)}60%{opacity:1;transform:perspective(400px) rotateX(10deg)}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{opacity:1;transform:perspective(400px) rotateX(-20deg)}to{opacity:0;transform:perspective(400px) rotateX(90deg)}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{transform:translate3d(110%,0,0);visibility:hidden}}@keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{transform:translate3d(-110%,0,0);visibility:hidden}}@keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{transform:translate3d(0,500px,0);visibility:hidden}}@keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{transform:translate3d(0,-500px,0);visibility:hidden}}.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--top-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--top-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--top-left{animation-name:Toastify__slideOutLeft}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--top-right{animation-name:Toastify__slideOutRight}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown}@keyframes Toastify__spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.vchasno-ui-snackbar .vchasno-ui-snackbar-toast{background:var(--vchasno-ui-snackbar-toast-background);border-radius:var(--toastify-toast-bd-radius);box-sizing:border-box;max-width:var(--vchasno-ui-snackbar-toast-max-width);min-width:var(--vchasno-ui-snackbar-toast-min-width);padding:5px 10px;width:auto}.vchasno-ui-snackbar .vchasno-ui-snackbar-body{padding:0 8px 0 0}.vchasno-ui-snackbar-with-action-container{align-items:center;display:flex;gap:26px;justify-content:space-between;padding-bottom:5px;padding-top:5px}.vchasno-ui-snackbar-action-button{border:none;color:var(--vchasno-ui-snackbar-action-button-color);cursor:pointer;flex-shrink:0;font-size:14px;font-weight:500;line-height:20px;margin-left:auto}.vchasno-ui-snackbar .Toastify__toast-icon{font-size:20px;margin-right:10px}.vchasno-ui-snackbar .Toastify__close-button{align-items:center;align-self:center;display:flex;justify-content:center}.vchasno-ui-SplashLogo__logo-box{--vchasno-ui-splash-screen-logo-box-width:300px;--vchasno-ui-splash-screen-logo-box-height:100px;--vchasno-ui-splash-screen-logo-color:#252d3d;--vchasno-ui-splash-screen-animation-duration:2s;animation:wave var(--vchasno-ui-splash-screen-animation-duration) infinite linear forwards;background-image:linear-gradient(to right,transparent,var(--vchasno-ui-splash-screen-logo-color),transparent);background-size:var(--vchasno-ui-splash-screen-logo-box-width) var(--vchasno-ui-splash-screen-logo-box-height);display:inline-block;height:var(--vchasno-ui-splash-screen-logo-box-height);width:var(--vchasno-ui-splash-screen-logo-box-width)}@keyframes wave{0%{background-position:calc(var(--vchasno-ui-splash-screen-logo-box-width)*-1) 0}to{background-position:0 0}}.vchasno-ui-SvgBorder{--vchasno-ui-svg-border-animation-duration-sec:1s;--vchasno-ui-svg-border-stroke-dashoffset:100%;position:relative}.vchasno-ui-SvgBorder__svg{left:0;overflow:visible;pointer-events:none;position:absolute;top:0;transform:translateZ(0);transition:var(--vchasno-ui-transition-duration-sec);z-index:-1}.vchasno-ui-SvgBorder__svg--animation-border-offset{animation:stroke-offset var(--vchasno-ui-svg-border-animation-duration-sec) linear infinite;animation-play-state:paused}.vchasno-ui-SvgBorder__svg--animation-play{animation-play-state:running}@keyframes stroke-offset{to{stroke-dashoffset:var(--vchasno-ui-svg-border-stroke-dashoffset)}}.vchasno-ui-switch{--vchasno-ui-switch-border-radius:100px;--vchasno-ui-switc-hcircle-size:calc(var(--vchasno-ui-switch-height) - 4px);align-content:center;cursor:pointer;display:inline-flex;line-height:var(--vchasno-ui-switch-height)}.vchasno-ui-switch.--sm{--vchasno-ui-switch-height:20px}.vchasno-ui-switch.--md{--vchasno-ui-switch-height:30px}.vchasno-ui-switch.--lg{--vchasno-ui-switch-height:40px}.vchasno-ui-switch--bg{aspect-ratio:36/20;background:var(--vchasno-ui-switch-color-bg);border-radius:var(--vchasno-ui-switch-border-radius);box-shadow:inset 0 2px 0 rgba(57,96,131,.2);box-sizing:border-box;display:inline-flex;flex-shrink:0;height:var(--vchasno-ui-switch-height,20px);position:relative;transition:background-color .3s;z-index:0}.vchasno-ui-switch__active .vchasno-ui-switch--bg{background:var(--vchasno-ui-switch-active-color-bg)}.vchasno-ui-switch__disabled{cursor:default;opacity:.7}.vchasno-ui-switch--circle{align-items:center;aspect-ratio:1/1;background-color:var(--vchasno-ui-switch-circle-color);border-radius:var(--vchasno-ui-border-radius-full);display:flex;height:var(--vchasno-ui-switc-hcircle-size);justify-content:center;left:0;position:absolute;top:0;transform:translate(2px,2px);transition:transform .3s}.vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(18px,2px)}.vchasno-ui-switch.--md .vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(26px,2px)}.vchasno-ui-switch.--lg .vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(34px,2px)}.vchasno-ui-spinner{color:var(--vchasno-ui-switch-spinner-color)}.vchasno-ui-switch--label{color:var(--vchasno-ui-input-font-color);font-size:var(--vchasno-ui-input-font-size);margin-left:12px;user-select:none}.vchasno-ui-tabs-wrapper{-ms-overflow-style:none;position:relative;scrollbar-width:none;width:100%}.vchasno-ui-tabs-wrapper::-webkit-scrollbar{display:none}.--h-scroll{overflow:auto}.vchasno-ui-tabs-wrapper-root{position:relative}.vchasno-ui-tabs-wrapper-root:after,.vchasno-ui-tabs-wrapper-root:before{bottom:0;content:"";display:block;pointer-events:none;position:absolute;top:0;width:30px}.--ping-right:after{box-shadow:inset -12px 0 8px -8px rgb(0 0 0/8%);right:0}.--ping-left:before{box-shadow:inset 12px 0 8px -8px rgb(0 0 0/8%);left:0}.vchasno-ui-tabs{--active-color:var(--vchasno-ui-tabs-active-color);display:flex;font-size:16px;font-weight:500;position:relative}.vchasno-ui-tabs__indicator{background-color:var(--active-color);border-radius:var(--vchasno-ui-border-radius-sm);bottom:-1px;display:block;height:3px;left:0;position:absolute;transform:translateX(0);transition:transform var(--vchasno-ui-transition-duration-sec,.3s),width var(--vchasno-ui-transition-duration-sec,.3s);width:10px;z-index:1}.--h-scroll .vchasno-ui-tabs__indicator{display:none}.vchasno-ui-tabs-wrapper-root.--skip-animation .vchasno-ui-tabs__indicator{transition:none}.vchasno-ui-tabs__label-item{align-items:center;color:#252d3d;cursor:pointer;display:inline-flex;flex-grow:0;flex-shrink:0;height:50px;padding:0 15px;position:relative;transition:color var(--vchasno-ui-transition-duration-sec),background-color var(--vchasno-ui-transition-duration-sec);user-select:none}.vchasno-ui-tabs__label-item:after{background-color:var(--active-color);border-radius:var(--vchasno-ui-border-radius-sm);bottom:0;content:"";display:block;height:0;left:0;position:absolute;right:0;transition:height var(--vchasno-ui-transition-duration-sec);z-index:1}.--h-scroll .vchasno-ui-tabs__label-item.--active:after{height:3px}.vchasno-ui-tabs-wrapper:not(.--h-scroll) .vchasno-ui-tabs{border-bottom:1px solid #e2e9f3}.vchasno-ui-tabs__label-item.--active,.vchasno-ui-tabs__label-item:not(.--disabled):hover{color:var(--active-color)}.vchasno-ui-tabs__label-item.--disabled{cursor:not-allowed;opacity:.5}.vchasno-ui-textarea-input-container .vchasno-ui-input__wrapper{height:auto;padding-bottom:10px;padding-top:10px}.vchasno-ui-textarea-input{border:0;color:var(--vchasno-ui-text-primary-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);resize:none;width:100%}.vchasno-ui-textarea-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper__label{transform:none}.vchasno-ui-textarea-input+*+.vchasno-ui-label-text,.vchasno-ui-textarea-input+.vchasno-ui-label-text{top:0;transform:translateY(15px);transition:transform var(--vchasno-ui-transition-duration-sec,.3s),font-size var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-textarea-input:focus:not(.--disabled,[aria-hidden])+*+.vchasno-ui-label-text,.vchasno-ui-textarea-input:focus:not(.--disabled,[aria-hidden])+.vchasno-ui-label-text,.vchasno-ui-textarea-input:not(:placeholder-shown,[aria-hidden])+*+.vchasno-ui-label-text,.vchasno-ui-textarea-input:not(:placeholder-shown,[aria-hidden])+.vchasno-ui-label-text{top:0;transform:translateY(-12px)}.vchasno-ui-text-input{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size)}.vchasno-ui-text-input::-webkit-inner-spin-button,.vchasno-ui-text-input::-webkit-outer-spin-button{appearance:none;margin:0}.vchasno-ui-text-input[type=number]{appearance:textfield}.vchasno-ui-text-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}@supports selector(:not(:placeholder-shown)){.vchasno-ui-input__clear-btn{transform:scale(0)}.vchasno-ui-text-input:not(:placeholder-shown)+.vchasno-ui-input__feedback .vchasno-ui-input__clear-btn{transform:scale(1)}.vchasno-ui-text-input:not(:placeholder-shown)+.vchasno-ui-label-text+.vchasno-ui-input__feedback .vchasno-ui-input__clear-btn{transform:scale(1)}}.vchasno-ui-title{color:var(--vchasno-ui-text-primary-color,#252d3d)}.vchasno-ui-title.--pretty{text-wrap:pretty}.vchasno-ui-title.--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-title h1,h1.vchasno-ui-title{font-size:32px;font-weight:700;line-height:40px}.vchasno-ui-title h2,h2.vchasno-ui-title{font-size:24px;font-weight:700;line-height:28px}.vchasno-ui-title h3,h3.vchasno-ui-title{font-size:20px;font-weight:500;line-height:24px}.vchasno-ui-title h4,h4.vchasno-ui-title{font-size:16px;font-weight:400;line-height:20px}.vchasno-ui-title h5,h5.vchasno-ui-title{font-size:12px;font-weight:400;line-height:14px}.vchasno-ui-PasswordInput{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);min-width:176px}.vchasno-ui-PasswordInput::-webkit-inner-spin-button,.vchasno-ui-PasswordInput::-webkit-outer-spin-button{appearance:none;margin:0}.vchasno-ui-PasswordInput::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-PasswordInput--type-password{caret-color:var(--vchasno-ui-input-placeholder-color);font-family:Verdana,sans-serif}.vchasno-ui-PasswordInput--type-password:not(:placeholder-shown){letter-spacing:.2em}.vchasno-ui-PasswordInput__eye{color:var(--vchasno-ui-input-font-color-disabled);cursor:pointer;display:flex;flex-shrink:0;place-items:center center;position:absolute;right:16px;top:50%;transform:translateY(-50%);width:20px}.vchasno-ui-PasswordInput__eye--active{color:var(--vchasno-ui-input-placeholder-color)}.vchasno-ui-PasswordInput__eye svg{transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper:has(.vchasno-ui-PasswordInput__eye){padding-right:40px}.vchasno-ui-input__wrapper:has(.vchasno-ui-PasswordInput__eye) .vchasno-ui-input__feedback{display:none}.vchasno-ui-slider.vchasno-ui-slider-root{height:2px}.vchasno-ui-slider .vchasno-ui-slider-mark{background-color:#e2e9f3;border-radius:var(--vchasno-ui-border-radius-full);height:8px;width:8px}.vchasno-ui-slider .vchasno-ui-slider-mark.MuiSlider-markActive{background-color:var(--vchasno-ui-slider-color)}.vchasno-ui-slider .vchasno-ui-slider-mark-label{color:var(--vchasno-ui-label-color-default)}.vchasno-ui-slider .vchasno-ui-slider-rail{background-color:#e2e9f3}.vchasno-ui-slider .vchasno-ui-slider-track{background-color:var(--vchasno-ui-slider-color);border-color:var(--vchasno-ui-slider-color)}.vchasno-ui-slider .vchasno-ui-slider-thumb{background-color:var(--vchasno-ui-slider-color);height:24px;width:24px}.vchasno-ui-slider .vchasno-ui-slider-thumb.Mui-focusVisible,.vchasno-ui-slider .vchasno-ui-slider-thumb:hover{box-shadow:0 0 0 8px var(--vchasno-ui-slider-thumb-box-shadow-color)}.vchasno-ui-slider .vchasno-ui-slider-thumb.Mui-active{box-shadow:0 0 0 14px var(--vchasno-ui-slider-thumb-box-shadow-color)}.vchasno-ui-breadcrumbs{font-size:14px;line-height:20px}.vchasno-ui-breadcrumbs-separator{margin:0 2px}.vchasno-ui-avatar{--avatar-size:40px;--avatar-font-size:16px;align-items:center;background-color:#e2e9f3;border-radius:var(--avatar-radius);color:#6e809a;display:inline-flex;font-size:var(--avatar-font-size);font-weight:var(--vchasno-ui-font-weight-medium);height:var(--avatar-size);justify-content:center;line-height:1;overflow:hidden;user-select:none;vertical-align:middle;width:var(--avatar-size)}.vchasno-ui-avatar,.vchasno-ui-avatar--shape-circular{--avatar-radius:var(--vchasno-ui-border-radius-full)}.vchasno-ui-avatar--shape-rounded{--avatar-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-avatar--size-xs{--avatar-size:24px;--avatar-font-size:var(--vchasno-ui-font-size-2xs)}.vchasno-ui-avatar--size-sm{--avatar-size:32px;--avatar-font-size:var(--vchasno-ui-font-size-xs)}.vchasno-ui-avatar--size-md{--avatar-size:40px;--avatar-font-size:var(--vchasno-ui-font-size-md)}.vchasno-ui-avatar--size-lg{--avatar-size:56px;--avatar-font-size:var(--vchasno-ui-font-size-xl)}.vchasno-ui-avatar--size-xl{--avatar-size:88px;--avatar-font-size:var(--vchasno-ui-font-size-2xl)}.vchasno-ui-avatar__image{height:100%;object-fit:cover;width:100%}.vchasno-ui-avatar__fallback{align-items:center;display:flex;height:100%;justify-content:center;width:100%}
|
|
5
|
+
)}.vchasno-ui-date-range-picker-popper .react-datepicker__navigation{display:none}.vchasno-ui-date-range-picker-popper .vchasno-ui-date-range-picker__header{align-items:center;display:flex;justify-content:space-between;padding:8px 0 15px}.vchasno-ui-date-range-picker__month-title{color:var(--vchasno-ui-input-font-color);font-size:14px;font-weight:500;text-transform:capitalize}.vchasno-ui-date-range-picker__nav-btn{align-items:center;background:transparent;border:none;border-radius:var(--vchasno-ui-border-radius-md);color:var(--vchasno-ui-calendar-default-icon-color);cursor:pointer;display:flex;height:30px;justify-content:center;width:30px}.vchasno-ui-date-range-picker__nav-btn:hover{background-color:var(--vchasno-ui-color-gray-100)}.vchasno-ui-date-range-picker__nav-btn:disabled{cursor:not-allowed;opacity:.3}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-range:not(.react-datepicker__day--range-start,.react-datepicker__day--range-end){background-color:var(--vchasno-ui-color-utility-blue-50);border-radius:0;color:var(--vchasno-ui-input-font-color);font-weight:400}.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-end,.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-start{background-color:var(--vchasno-ui-calendar-select-color);color:var(--vchasno-ui-color-gray-0);font-weight:700}.vchasno-ui-date-range-picker-popper .react-datepicker__day--range-start.react-datepicker__day--range-end{border-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range){background-color:var(--vchasno-ui-calendar-select-color)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--in-range.react-datepicker__day--today{border-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-date-range-picker-popper .react-datepicker__day--outside-month{pointer-events:none;visibility:hidden}.vchasno-ui-flex-box{align-content:flex-start;display:flex;flex-direction:row;gap:10px;max-width:100%}.vchasno-ui-text{color:var(--vchasno-ui-text-primary-color,#252d3d)}.vchasno-ui-text.--ellipsis{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-text.--secondary{color:var(--vchasno-ui-text-secondary-color,#5a6a81)}.vchasno-ui-text.--success{color:var(--vchasno-ui-text-success-color,#1cb800)}.vchasno-ui-text.--warning{color:var(--vchasno-ui-text-warning-color,#ff9c01)}.vchasno-ui-text.--danger{color:var(--vchasno-ui-text-error-color,#f54f4f)}.vchasno-ui-text.--code{background:hsla(0,0%,59%,.1);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-sm);font-size:85%;margin:0 .2em;padding:.2em .4em .1em}.vchasno-ui-text.--inherit{font-size:inherit}.vchasno-ui-text.--like-link,.vchasno-ui-text.--link{color:var(--vchasno-ui-text-link-color);cursor:pointer}.vchasno-ui-text.--link{text-decoration-line:underline}.vchasno-ui-text.--normal{font-size:1rem;line-height:1.1rem}.vchasno-ui-text.--small{font-size:.8rem;line-height:.9rem}.vchasno-ui-text.--large{font-size:1.2rem;line-height:1.3rem}.vchasno-ui-text.--required:after{color:var(--vchasno-ui-text-error-color,#f54f4f);content:"*";position:relative;right:-2px;top:-3px}strong.vchasno-ui-text{font-weight:700}.vchasno-ui-FollowUs{min-height:24px;min-width:24px}.vchasno-ui-FollowUs__label{font-size:14px}.vchasno-ui-FollowUs__link{display:block;flex-grow:0;flex-shrink:0;height:24px;transition:filter .3s;width:24px}.vchasno-ui-FollowUs__link img{display:block}.vchasno-ui-FollowUs__link:hover{filter:brightness(80%)}.vchasno-ui-input{display:inline-flex;flex-direction:column;gap:5px;max-width:100%}.vchasno-ui-input input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input .vchasno-ui-mask-input,.vchasno-ui-input .vchasno-ui-text-input{flex-grow:1}.vchasno-ui-input.--wide{width:100%}.vchasno-ui-input__wrapper{align-items:center;background-color:var(--vchasno-ui-input-bg-color);border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;display:flex;min-height:50px;outline:3px solid transparent;padding-left:16px;padding-right:33px;position:relative;transition:border var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper>input{max-width:100%}.vchasno-ui-input__wrapper__start-element{align-items:center;display:flex;flex-grow:0;flex-shrink:0;font-size:var(--vchasno-ui-input-font-size,14px);line-height:var(--vchasno-ui-input-font-size,14px);margin-right:5px}.vchasno-ui-input__feedback{display:block;height:18px;position:absolute;right:10px;top:50%;transform:translateY(-50%);width:18px}.vchasno-ui-input__clear-btn{cursor:pointer;display:block;height:18px;transition:transform var(--vchasno-ui-transition-duration-sec,.3s);width:18px}.vchasno-ui-input__clear-btn svg{height:100%;transition:color var(--vchasno-ui-transition-duration-sec,.3s);width:100%}.vchasno-ui-input__clear-btn:hover svg{color:var(--vchasno-ui-input-color-error)}.vchasno-ui-input .vchasno-ui-spinner__svg__circle,.vchasno-ui-input .vchasno-ui-spinner__svg__path{stroke:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-input.--disabled .vchasno-ui-input__wrapper{background-color:var(--vchasno-ui-input-bg-color-disabled);color:var(--vchasno-ui-input-font-color-disabled)}.vchasno-ui-input:not(.--disabled) .vchasno-ui-input__wrapper:hover{cursor:text}.vchasno-ui-input:not(.--disabled):hover .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-border-color-focused)}.vchasno-ui-input:not(.--disabled):focus-within .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-border-color-focused);outline-color:var(--vchasno-ui-input-outline-color-focused)}.vchasno-ui-input:not(.--disabled).--error .vchasno-ui-input__wrapper{border-color:var(--vchasno-ui-input-color-error);outline-color:var(--vchasno-ui-input-outline-color-error)}.vchasno-ui-input.--disabled,.vchasno-ui-input.--disabled *{cursor:not-allowed;opacity:.8}.vchasno-ui-input.--is-label input::placeholder,.vchasno-ui-input.--is-label textarea::placeholder{visibility:hidden}.vchasno-ui-input.--is-label:focus-within input::placeholder,.vchasno-ui-input.--is-label:focus-within textarea::placeholder{visibility:visible}.vchasno-ui-mask-input{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);position:relative}.vchasno-ui-mask-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.szh-menu-button{box-sizing:border-box}.vchasno-ui-menu-button{align-items:center;border:none;border-radius:var(--vchasno-ui-border-radius-sm);cursor:pointer;display:flex;justify-content:center;padding:5px;transition:background-color var(--vchasno-ui-transition-duration-sec)}.vchasno-ui-menu-button:hover{background-color:var(--vchasno-ui-menu-button-bg)}.szh-menu__item{align-items:center;border-radius:var(--vchasno-ui-border-radius-sm);cursor:pointer;display:flex;padding:10px 12px;position:relative;transition:background-color var(--vchasno-ui-transition-duration-sec)}.szh-menu__item+.szh-menu__item{margin-top:4px}.szh-menu__item:focus{outline:none}.szh-menu__item--hover{background-color:var(--vchasno-ui-menu-item-hover-bg)}.szh-menu__item--focusable{background-color:inherit;cursor:default}.szh-menu__item--disabled{color:#aaa;cursor:default}.vchasno-ui-menu-submenu.szh-menu__submenu>.szh-menu__item{padding:10px 12px}.vchasno-ui-menu-submenu .szh-menu__item--submenu:after{display:none}.vchasno-ui-menu-submenu-label-container{width:100%}.szh-menu{background-color:#fff;border:1px solid var(--vchasno-ui-input-border-color-default);border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;color:#212529;list-style:none;margin:0;min-width:10rem;padding:8px;user-select:none;width:max-content;z-index:100}.szh-menu:focus{outline:none}.szh-menu__arrow{background-color:#fff;border-color:rgba(0,0,0,.1) transparent transparent rgba(0,0,0,.1);border-style:solid;border-width:1px;box-sizing:border-box;height:.75rem;width:.75rem;z-index:-1}.szh-menu__arrow--dir-left{right:-.375rem;transform:translateY(-50%) rotate(135deg)}.szh-menu__arrow--dir-right{left:-.375rem;transform:translateY(-50%) rotate(-45deg)}.szh-menu__arrow--dir-top{bottom:-.375rem;transform:translateX(-50%) rotate(-135deg)}.szh-menu__arrow--dir-bottom{top:-.375rem;transform:translateX(-50%) rotate(45deg)}.szh-menu__group{box-sizing:border-box}.szh-menu__radio-group{list-style:none;margin:0;padding:0}.szh-menu__divider{background-color:rgba(0,0,0,.12);height:1px;margin:.5rem 0}.szh-menu-container--itemTransition .szh-menu__item{transition-duration:.15s;transition-property:background-color,color;transition-timing-function:ease-in-out}.szh-menu__item--type-radio{padding-left:2.2rem}.szh-menu__item--type-radio:before{content:"○";font-size:.8rem;left:.8rem;position:absolute;top:.55rem}.szh-menu__item--type-radio.szh-menu__item--checked:before{content:"●"}.szh-menu__item--type-checkbox{padding-left:2.2rem}.szh-menu__item--type-checkbox:before{left:.8rem;position:absolute}.szh-menu__item--type-checkbox.szh-menu__item--checked:before{content:"✔"}.szh-menu__submenu>.szh-menu__item{padding-right:2.5rem}.szh-menu__submenu>.szh-menu__item:after{content:"❯";position:absolute;right:1rem}.szh-menu__header{color:#888;font-size:.8rem;padding:.2rem 1.5rem;text-transform:uppercase}.vchasno-ui-MobileAppLinks{min-width:100px}.vchasno-ui-MobileAppLinks__label{font-size:14px}.vchasno-ui-MobileAppLinks__link{aspect-ratio:300/89;display:block;max-width:150px;transition:filter .3s}.vchasno-ui-MobileAppLinks__link img{display:block}.vchasno-ui-MobileAppLinks__link:hover{filter:brightness(80%)}.vchasno-ui-pagination{align-items:center;color:var(--vchasno-ui-color-gray-600,#252d3d);display:inline-flex;flex-shrink:0;font-size:var(--vchasno-ui-font-size-sm,14px);gap:var(--vchasno-ui-spacing-16,16px);line-height:20px}.vchasno-ui-pagination--simple{gap:var(--vchasno-ui-spacing-2,2px)}.vchasno-ui-pagination__item{align-items:center;background-color:var(--vchasno-ui-color-gray-0,#fff);border:1px solid transparent;border-radius:var(--vchasno-ui-border-radius-md);color:inherit;cursor:pointer;display:inline-flex;flex-grow:0;flex-shrink:0;font:inherit;font-weight:var(--vchasno-ui-font-weight-regular,400);height:40px;justify-content:center;min-width:40px;outline:0;overflow:hidden;text-align:center;transition:background-color var(--vchasno-ui-transition-duration-sec,.3s);user-select:none;vertical-align:middle}.vchasno-ui-pagination__pages{align-items:center;display:inline-flex;gap:var(--vchasno-ui-spacing-2,2px)}.vchasno-ui-pagination__item-disabled{color:var(--vchasno-ui-color-content-disabled-default,#9aaabf);cursor:not-allowed}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-arrow){padding:var(--vchasno-ui-spacing-10,10px) var(--vchasno-ui-spacing-16,16px);width:40px}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-disabled):focus-visible,.vchasno-ui-pagination__item[aria-expanded=true]{background-color:var(--vchasno-ui-color-utility-blue-50,#ecf4ff);border-color:var(--vchasno-ui-color-border-accent-default,#1a66c8);box-shadow:0 0 0 3px var(--vchasno-ui-color-utility-blue-100,#dbe9fa);z-index:1}.vchasno-ui-pagination__item:not(.vchasno-ui-pagination__item-disabled):hover{background-color:var(--vchasno-ui-color-utility-blue-50,#ecf4ff)}.vchasno-ui-pagination__item-active{border-color:var(--vchasno-ui-color-border-accent-default,#1a66c8);font-weight:var(--vchasno-ui-font-weight-medium,500)}.vchasno-ui-pagination__item-hidden{display:none}.vchasno-ui-pagination__gap-popup{box-shadow:0 4px 10px rgba(37,45,61,.15);color:var(--vchasno-ui-color-gray-600,#252d3d);display:block;font-size:var(--vchasno-ui-font-size-sm,14px);line-height:20px;padding:var(--vchasno-ui-spacing-8,8px);width:120px;z-index:1300}.vchasno-ui-pagination__gap-popup,.vchasno-ui-pagination__gap-search{background-color:var(--vchasno-ui-color-gray-0,#fff);border:1px solid var(--vchasno-ui-color-border-neutral-light,#e2e9f3);border-radius:var(--vchasno-ui-border-radius-md,8px);box-sizing:border-box}.vchasno-ui-pagination__gap-search{align-items:center;color:#6e809a;display:flex;gap:var(--vchasno-ui-spacing-8,8px);height:40px;margin-bottom:var(--vchasno-ui-spacing-8,8px);min-height:40px;padding:0 var(--vchasno-ui-spacing-16,16px)}.vchasno-ui-pagination__gap-search:focus-within{border-color:var(--vchasno-ui-color-border-accent-default,#1a66c8);box-shadow:0 0 0 3px var(--vchasno-ui-color-utility-blue-100,#dbe9fa)}.vchasno-ui-pagination__gap-search-icon{color:#6e809a;flex-shrink:0}.vchasno-ui-pagination__gap-search-input{border:0;color:var(--vchasno-ui-color-gray-600,#252d3d);font:inherit;height:100%;min-width:0;outline:0;padding:0;width:100%}.vchasno-ui-pagination__gap-search-input::placeholder{color:#6e809a}.vchasno-ui-pagination__gap-viewport{overflow-y:auto}.vchasno-ui-pagination__gap-popup--with-search .vchasno-ui-pagination__gap-viewport{max-height:250px}.vchasno-ui-pagination__gap-list{display:flex;flex-direction:column;gap:var(--vchasno-ui-spacing-2,2px)}.vchasno-ui-pagination__gap-option{align-items:center;border-radius:var(--vchasno-ui-border-radius-md,8px);box-sizing:border-box;cursor:pointer;display:flex;min-height:40px;outline:0;padding:var(--vchasno-ui-spacing-10,10px) var(--vchasno-ui-spacing-12,12px)}.vchasno-ui-pagination__gap-option:hover,.vchasno-ui-pagination__gap-option[data-highlighted]{background-color:var(--vchasno-ui-color-utility-blue-50,#ecf4ff)}.vchasno-ui-pagination__gap-option[data-selected]{color:var(--vchasno-ui-color-border-accent-default,#1a66c8);font-weight:var(--vchasno-ui-font-weight-medium,500)}.vchasno-ui-pagination__gap-empty{align-items:center;color:#63809a;display:flex;flex-direction:column;font-size:var(--vchasno-ui-font-size-xs,12px);gap:4px;line-height:14px;padding:var(--vchasno-ui-spacing-10,10px) 0;text-align:center}.vchasno-ui-pagination__gap-empty-icon{font-size:18px;line-height:18px}.--text-start{text-align:start}.--text-center{text-align:center}.--text-end{text-align:end}.--text-justify{text-align:justify}.vchasno-ui-paragraph{color:var(--vchasno-ui-text-primary-color)}.vchasno-ui-paragraph.--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-paragraph.--ellipsis-line{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;white-space:unset}.vchasno-ui-paragraph.--text-center{text-align:center}.vchasno-ui-paragraph.--text-left{text-align:left}.vchasno-ui-paragraph.--text-right{text-align:right}.vchasno-ui-paragraph.--text-justify{text-align:justify}.vchasno-ui-ProjectsPopover{background-color:#fff;border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;display:inline-block;max-width:calc(100vw - 32px);padding:24px 16px 0;width:440px}.vchasno-ui-ProjectsPopover__content{display:flex;flex-direction:column;gap:32px}.vchasno-ui-ProjectsPopover__products{box-sizing:border-box;display:flex;flex-wrap:wrap;gap:10px;width:calc(100% + 32px)}.vchasno-ui-ProjectsPopover a:hover{color:unset;text-decoration:none}.vchasno-ui-ProjectsPopover--border{border:1px solid #e2e9f3}.vchasno-ui-ProjectsPopover__title{font-size:16px;font-style:normal;font-weight:500;line-height:18px;width:100%}.vchasno-ui-ProjectsPopover__box{align-items:center;aspect-ratio:198/80;border:1px solid #e2e9f3;border-radius:var(--vchasno-ui-border-radius-md);box-sizing:border-box;color:var(--vchasno-ui-text-primary-color);display:inline-flex;gap:8px;padding:20px;text-decoration:none;transition:background-color .3s;width:198px}.vchasno-ui-ProjectsPopover__box>svg{max-width:90%}.vchasno-ui-ProjectsPopover__box__icon{border-radius:var(--vchasno-ui-border-radius-full);box-sizing:border-box;flex-shrink:0;height:40px;width:40px}.vchasno-ui-ProjectsPopover__box:hover{background-color:#f3f8fb;cursor:pointer}.vchasno-ui-ProjectsPopover__box__title{font-size:14px;font-style:normal;font-weight:400;line-height:26px}.vchasno-ui-ProjectsPopover .vchasno-ui-ProjectsPopover__footer{align-items:center;background:#e0eeff;border-bottom-left-radius:var(--vchasno-ui-border-radius-md);border-bottom-right-radius:var(--vchasno-ui-border-radius-md);color:#6e809a;display:flex;font-size:12px;font-weight:400;justify-content:center;margin:0 -16px;min-height:42px}.vchasno-ui-ProjectsPopover .vchasno-ui-ProjectsPopover__footer>a{color:#0890de;text-decoration:none}.vchasno-ui-ProjectsPopover__tooltip-hint{text-align:center}@media screen and (width <= 480px){.vchasno-ui-ProjectsPopover{width:330px}.vchasno-ui-ProjectsPopover__box{aspect-ratio:1/1;flex-direction:column;justify-content:center;padding:10px;width:calc(50% - 20px)}}.vchasno-ui-PulseDot{background-color:var(--vchasno-ui-pulse-dot-color);border-radius:var(--vchasno-ui-border-radius-full);height:var(--vchasno-ui-pulse-dot-size);position:relative;width:var(--vchasno-ui-pulse-dot-size)}.vchasno-ui-PulseDot:after,.vchasno-ui-PulseDot:before{background:inherit;border-radius:var(--vchasno-ui-border-radius-full);content:"";height:100%;pointer-events:none;position:absolute;width:100%}.vchasno-ui-PulseDot:before{animation:pulse 2s ease-out infinite}.vchasno-ui-PulseDot:after{animation:pulse 2s ease-out 1s infinite}@keyframes pulse{to{opacity:0;transform:scale(2)}}:root{--toastify-color-light:var(--vchasno-ui-snackbar-color-light);--toastify-color-dark:var(--vchasno-ui-snackbar-color-dark);--toastify-color-info:var(--vchasno-ui-snackbar-color-info);--toastify-color-success:var(--vchasno-ui-snackbar-color-success);--toastify-color-warning:var(--vchasno-ui-snackbar-color-warning);--toastify-color-error:var(--vchasno-ui-snackbar-color-error);--toastify-color-transparent:var(--vchasno-ui-snackbar-color-transparent);--toastify-icon-color-info:var(--vchasno-ui-snackbar-icon-color-info);--toastify-icon-color-success:var(--vchasno-ui-snackbar-icon-color-success);--toastify-icon-color-warning:var(--vchasno-ui-snackbar-icon-color-warning);--toastify-icon-color-error:var(--vchasno-ui-snackbar-icon-color-error);--toastify-toast-width:var(--vchasno-ui-snackbar-toast-width);--toastify-toast-offset:var(--vchasno-ui-snackbar-toast-offset);--toastify-toast-top:var(--vchasno-ui-snackbar-toast-top);--toastify-toast-right:var(--vchasno-ui-snackbar-toast-right);--toastify-toast-left:var(--vchasno-ui-snackbar-toast-left);--toastify-toast-bottom:var(--vchasno-ui-snackbar-toast-bottom);--toastify-toast-background:var(--vchasno-ui-snackbar-toast-background);--toastify-toast-min-height:var(--vchasno-ui-snackbar-toast-min-height);--toastify-toast-max-height:var(--vchasno-ui-snackbar-toast-max-height);--toastify-toast-bd-radius:var(--vchasno-ui-snackbar-toast-bd-radius);--toastify-font-family:var(--vchasno-ui-snackbar-font-family);--toastify-z-index:var(--vchasno-ui-snackbar-z-index);--toastify-text-color-light:var(--vchasno-ui-snackbar-text-color-light);--toastify-text-color-dark:var(--vchasno-ui-snackbar-text-color-dark);--toastify-text-color-info:var(--vchasno-ui-snackbar-text-color-info);--toastify-text-color-success:var(--vchasno-ui-snackbar-text-color-success);--toastify-text-color-warning:var(--vchasno-ui-snackbar-text-color-warning);--toastify-text-color-error:var(--vchasno-ui-snackbar-text-color-error);--toastify-spinner-color:var(--vchasno-ui-snackbar-spinner-color);--toastify-spinner-color-empty-area:var(--vchasno-ui-snackbar-spinner-color-empty-area);--toastify-color-progress-light:var(--vchasno-ui-snackbar-color-progress-light);--toastify-color-progress-dark:var(--vchasno-ui-snackbar-color-progress-dark);--toastify-color-progress-info:var(--vchasno-ui-snackbar-color-progress-info);--toastify-color-progress-success:var(--vchasno-ui-snackbar-color-progress-success);--toastify-color-progress-warning:var(--vchasno-ui-snackbar-color-progress-warning);--toastify-color-progress-error:var(--vchasno-ui-snackbar-color-progress-error);--toastify-color-progress-bgo:var(--vchasno-ui-snackbar-color-progress-bgo)}.Toastify__toast-container{box-sizing:border-box;color:#fff;padding:4px;position:fixed;transform:translateZ(var(--toastify-z-index));width:var(--toastify-toast-width);z-index:var(--toastify-z-index)}.Toastify__toast-container--top-left{left:1em;top:1em}.Toastify__toast-container--top-center{left:50%;top:1em;transform:translateX(-50%)}.Toastify__toast-container--top-right{right:1em;top:1em}.Toastify__toast-container--bottom-left{bottom:1em;left:1em}.Toastify__toast-container--bottom-center{bottom:1em;left:50%;transform:translateX(-50%)}.Toastify__toast-container--bottom-right{bottom:1em;right:1em}@media only screen and (width <= 480px){.Toastify__toast-container{left:0;margin:0;padding:0;width:100vw}.Toastify__toast-container--top-center,.Toastify__toast-container--top-left,.Toastify__toast-container--top-right{top:0;transform:translateX(0)}.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-right{bottom:0;transform:translateX(0)}.Toastify__toast-container--rtl{left:auto;right:0}}.Toastify__toast{-ms-flex-pack:justify;border-radius:var(--vchasno-ui-border-radius-sm);box-shadow:0 1px 10px 0 rgba(0,0,0,.1),0 2px 15px 0 rgb(0 0 0/5%);box-sizing:border-box;cursor:default;direction:ltr;display:flex;font-family:var(--toastify-font-family);justify-content:space-between;margin-bottom:1rem;max-height:var(--toastify-toast-max-height);min-height:var(--toastify-toast-min-height);overflow:hidden;padding:8px;position:relative;z-index:0}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-body{-ms-flex-align:center;align-items:center;display:flex;flex:1 1 auto;margin:auto 0;padding:6px}.Toastify__toast-body>div:last-child{flex:1;word-break:break-word}.Toastify__toast-icon{-ms-flex-negative:0;-webkit-margin-end:10px;display:flex;flex-shrink:0;margin-inline-end:10px;width:20px}.Toastify--animate{animation-duration:.7s;animation-fill-mode:both}.Toastify--animate-icon{animation-duration:.3s;animation-fill-mode:both}@media only screen and (width <= 480px){.Toastify__toast{border-radius:var(--vchasno-ui-border-radius-none);margin-bottom:0}}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--colored.Toastify__toast--default,.Toastify__toast-theme--light{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{background:var(--toastify-color-info);color:var(--toastify-text-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{background:var(--toastify-color-success);color:var(--toastify-text-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{background:var(--toastify-color-warning);color:var(--toastify-text-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{background:var(--toastify-color-error);color:var(--toastify-text-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning{background:var(--toastify-color-transparent)}.Toastify__close-button{-ms-flex-item-align:start;align-self:flex-start;background:transparent;border:none;color:#fff;cursor:pointer;opacity:.7;outline:none;padding:0;transition:.3s ease}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentcolor;height:16px;width:14px}.Toastify__close-button:focus,.Toastify__close-button:hover{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{bottom:0;height:5px;left:0;opacity:.7;position:absolute;transform-origin:left;width:100%;z-index:var(--toastify-z-index)}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{left:auto;right:0;transform-origin:right}.Toastify__spinner{animation:Toastify__spin .65s linear infinite;border:2px solid;border-color:var(--toastify-spinner-color-empty-area);border-radius:var(--vchasno-ui-border-radius-full);border-right-color:var(--toastify-spinner-color);box-sizing:border-box;height:20px;width:20px}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--bottom-left,.Toastify__bounce-enter--top-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--bottom-right,.Toastify__bounce-enter--top-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--bottom-left,.Toastify__bounce-exit--top-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--bottom-right,.Toastify__bounce-exit--top-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{animation-timing-function:ease-in;opacity:0;transform:perspective(400px) rotateX(90deg)}40%{animation-timing-function:ease-in;transform:perspective(400px) rotateX(-20deg)}60%{opacity:1;transform:perspective(400px) rotateX(10deg)}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{opacity:1;transform:perspective(400px) rotateX(-20deg)}to{opacity:0;transform:perspective(400px) rotateX(90deg)}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{transform:translate3d(110%,0,0);visibility:hidden}}@keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{transform:translate3d(-110%,0,0);visibility:hidden}}@keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{transform:translate3d(0,500px,0);visibility:hidden}}@keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{transform:translate3d(0,-500px,0);visibility:hidden}}.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--top-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--top-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--top-left{animation-name:Toastify__slideOutLeft}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--top-right{animation-name:Toastify__slideOutRight}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown}@keyframes Toastify__spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.vchasno-ui-snackbar .vchasno-ui-snackbar-toast{background:var(--vchasno-ui-snackbar-toast-background);border-radius:var(--toastify-toast-bd-radius);box-sizing:border-box;max-width:var(--vchasno-ui-snackbar-toast-max-width);min-width:var(--vchasno-ui-snackbar-toast-min-width);padding:5px 10px;width:auto}.vchasno-ui-snackbar .vchasno-ui-snackbar-body{padding:0 8px 0 0}.vchasno-ui-snackbar-with-action-container{align-items:center;display:flex;gap:26px;justify-content:space-between;padding-bottom:5px;padding-top:5px}.vchasno-ui-snackbar-action-button{border:none;color:var(--vchasno-ui-snackbar-action-button-color);cursor:pointer;flex-shrink:0;font-size:14px;font-weight:500;line-height:20px;margin-left:auto}.vchasno-ui-snackbar .Toastify__toast-icon{font-size:20px;margin-right:10px}.vchasno-ui-snackbar .Toastify__close-button{align-items:center;align-self:center;display:flex;justify-content:center}.vchasno-ui-SplashLogo__logo-box{--vchasno-ui-splash-screen-logo-box-width:300px;--vchasno-ui-splash-screen-logo-box-height:100px;--vchasno-ui-splash-screen-logo-color:#252d3d;--vchasno-ui-splash-screen-animation-duration:2s;animation:wave var(--vchasno-ui-splash-screen-animation-duration) infinite linear forwards;background-image:linear-gradient(to right,transparent,var(--vchasno-ui-splash-screen-logo-color),transparent);background-size:var(--vchasno-ui-splash-screen-logo-box-width) var(--vchasno-ui-splash-screen-logo-box-height);display:inline-block;height:var(--vchasno-ui-splash-screen-logo-box-height);width:var(--vchasno-ui-splash-screen-logo-box-width)}@keyframes wave{0%{background-position:calc(var(--vchasno-ui-splash-screen-logo-box-width)*-1) 0}to{background-position:0 0}}.vchasno-ui-SvgBorder{--vchasno-ui-svg-border-animation-duration-sec:1s;--vchasno-ui-svg-border-stroke-dashoffset:100%;position:relative}.vchasno-ui-SvgBorder__svg{left:0;overflow:visible;pointer-events:none;position:absolute;top:0;transform:translateZ(0);transition:var(--vchasno-ui-transition-duration-sec);z-index:-1}.vchasno-ui-SvgBorder__svg--animation-border-offset{animation:stroke-offset var(--vchasno-ui-svg-border-animation-duration-sec) linear infinite;animation-play-state:paused}.vchasno-ui-SvgBorder__svg--animation-play{animation-play-state:running}@keyframes stroke-offset{to{stroke-dashoffset:var(--vchasno-ui-svg-border-stroke-dashoffset)}}.vchasno-ui-switch{--vchasno-ui-switch-border-radius:100px;--vchasno-ui-switc-hcircle-size:calc(var(--vchasno-ui-switch-height) - 4px);align-content:center;cursor:pointer;display:inline-flex;line-height:var(--vchasno-ui-switch-height)}.vchasno-ui-switch.--sm{--vchasno-ui-switch-height:20px}.vchasno-ui-switch.--md{--vchasno-ui-switch-height:30px}.vchasno-ui-switch.--lg{--vchasno-ui-switch-height:40px}.vchasno-ui-switch--bg{aspect-ratio:36/20;background:var(--vchasno-ui-switch-color-bg);border-radius:var(--vchasno-ui-switch-border-radius);box-shadow:inset 0 2px 0 rgba(57,96,131,.2);box-sizing:border-box;display:inline-flex;flex-shrink:0;height:var(--vchasno-ui-switch-height,20px);position:relative;transition:background-color .3s;z-index:0}.vchasno-ui-switch__active .vchasno-ui-switch--bg{background:var(--vchasno-ui-switch-active-color-bg)}.vchasno-ui-switch__disabled{cursor:default;opacity:.7}.vchasno-ui-switch--circle{align-items:center;aspect-ratio:1/1;background-color:var(--vchasno-ui-switch-circle-color);border-radius:var(--vchasno-ui-border-radius-full);display:flex;height:var(--vchasno-ui-switc-hcircle-size);justify-content:center;left:0;position:absolute;top:0;transform:translate(2px,2px);transition:transform .3s}.vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(18px,2px)}.vchasno-ui-switch.--md .vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(26px,2px)}.vchasno-ui-switch.--lg .vchasno-ui-switch--bg>input:checked+.vchasno-ui-switch--circle{transform:translate(34px,2px)}.vchasno-ui-spinner{color:var(--vchasno-ui-switch-spinner-color)}.vchasno-ui-switch--label{color:var(--vchasno-ui-input-font-color);font-size:var(--vchasno-ui-input-font-size);margin-left:12px;user-select:none}.vchasno-ui-tabs-wrapper{-ms-overflow-style:none;position:relative;scrollbar-width:none;width:100%}.vchasno-ui-tabs-wrapper::-webkit-scrollbar{display:none}.--h-scroll{overflow:auto}.vchasno-ui-tabs-wrapper-root{position:relative}.vchasno-ui-tabs-wrapper-root:after,.vchasno-ui-tabs-wrapper-root:before{bottom:0;content:"";display:block;pointer-events:none;position:absolute;top:0;width:30px}.--ping-right:after{box-shadow:inset -12px 0 8px -8px rgb(0 0 0/8%);right:0}.--ping-left:before{box-shadow:inset 12px 0 8px -8px rgb(0 0 0/8%);left:0}.vchasno-ui-tabs{--active-color:var(--vchasno-ui-tabs-active-color);display:flex;font-size:16px;font-weight:500;position:relative}.vchasno-ui-tabs__indicator{background-color:var(--active-color);border-radius:var(--vchasno-ui-border-radius-sm);bottom:-1px;display:block;height:3px;left:0;position:absolute;transform:translateX(0);transition:transform var(--vchasno-ui-transition-duration-sec,.3s),width var(--vchasno-ui-transition-duration-sec,.3s);width:10px;z-index:1}.--h-scroll .vchasno-ui-tabs__indicator{display:none}.vchasno-ui-tabs-wrapper-root.--skip-animation .vchasno-ui-tabs__indicator{transition:none}.vchasno-ui-tabs__label-item{align-items:center;color:#252d3d;cursor:pointer;display:inline-flex;flex-grow:0;flex-shrink:0;height:50px;padding:0 15px;position:relative;transition:color var(--vchasno-ui-transition-duration-sec),background-color var(--vchasno-ui-transition-duration-sec);user-select:none}.vchasno-ui-tabs__label-item:after{background-color:var(--active-color);border-radius:var(--vchasno-ui-border-radius-sm);bottom:0;content:"";display:block;height:0;left:0;position:absolute;right:0;transition:height var(--vchasno-ui-transition-duration-sec);z-index:1}.--h-scroll .vchasno-ui-tabs__label-item.--active:after{height:3px}.vchasno-ui-tabs-wrapper:not(.--h-scroll) .vchasno-ui-tabs{border-bottom:1px solid #e2e9f3}.vchasno-ui-tabs__label-item.--active,.vchasno-ui-tabs__label-item:not(.--disabled):hover{color:var(--active-color)}.vchasno-ui-tabs__label-item.--disabled{cursor:not-allowed;opacity:.5}.vchasno-ui-textarea-input-container .vchasno-ui-input__wrapper{height:auto;padding-bottom:10px;padding-top:10px}.vchasno-ui-textarea-input{border:0;color:var(--vchasno-ui-text-primary-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);resize:none;width:100%}.vchasno-ui-textarea-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:calc(var(--vchasno-ui-input-font-size)*1.2);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper__label{transform:none}.vchasno-ui-textarea-input+*+.vchasno-ui-label-text,.vchasno-ui-textarea-input+.vchasno-ui-label-text{top:0;transform:translateY(15px);transition:transform var(--vchasno-ui-transition-duration-sec,.3s),font-size var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-textarea-input:focus:not(.--disabled,[aria-hidden])+*+.vchasno-ui-label-text,.vchasno-ui-textarea-input:focus:not(.--disabled,[aria-hidden])+.vchasno-ui-label-text,.vchasno-ui-textarea-input:not(:placeholder-shown,[aria-hidden])+*+.vchasno-ui-label-text,.vchasno-ui-textarea-input:not(:placeholder-shown,[aria-hidden])+.vchasno-ui-label-text{top:0;transform:translateY(-12px)}.vchasno-ui-text-input{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size)}.vchasno-ui-text-input::-webkit-inner-spin-button,.vchasno-ui-text-input::-webkit-outer-spin-button{appearance:none;margin:0}.vchasno-ui-text-input[type=number]{appearance:textfield}.vchasno-ui-text-input::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}@supports selector(:not(:placeholder-shown)){.vchasno-ui-input__clear-btn{transform:scale(0)}.vchasno-ui-text-input:not(:placeholder-shown)+.vchasno-ui-input__feedback .vchasno-ui-input__clear-btn{transform:scale(1)}.vchasno-ui-text-input:not(:placeholder-shown)+.vchasno-ui-label-text+.vchasno-ui-input__feedback .vchasno-ui-input__clear-btn{transform:scale(1)}}.vchasno-ui-title{color:var(--vchasno-ui-text-primary-color,#252d3d)}.vchasno-ui-title.--pretty{text-wrap:pretty}.vchasno-ui-title.--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vchasno-ui-title h1,h1.vchasno-ui-title{font-size:32px;font-weight:700;line-height:40px}.vchasno-ui-title h2,h2.vchasno-ui-title{font-size:24px;font-weight:700;line-height:28px}.vchasno-ui-title h3,h3.vchasno-ui-title{font-size:20px;font-weight:500;line-height:24px}.vchasno-ui-title h4,h4.vchasno-ui-title{font-size:16px;font-weight:400;line-height:20px}.vchasno-ui-title h5,h5.vchasno-ui-title{font-size:12px;font-weight:400;line-height:14px}.vchasno-ui-PasswordInput{font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);min-width:176px}.vchasno-ui-PasswordInput::-webkit-inner-spin-button,.vchasno-ui-PasswordInput::-webkit-outer-spin-button{appearance:none;margin:0}.vchasno-ui-PasswordInput::placeholder{color:var(--vchasno-ui-input-placeholder-color);font-size:var(--vchasno-ui-input-font-size);line-height:var(--vchasno-ui-input-font-size);transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-PasswordInput--type-password{caret-color:var(--vchasno-ui-input-placeholder-color);font-family:Verdana,sans-serif}.vchasno-ui-PasswordInput--type-password:not(:placeholder-shown){letter-spacing:.2em}.vchasno-ui-PasswordInput__eye{color:var(--vchasno-ui-input-font-color-disabled);cursor:pointer;display:flex;flex-shrink:0;place-items:center center;position:absolute;right:16px;top:50%;transform:translateY(-50%);width:20px}.vchasno-ui-PasswordInput__eye--active{color:var(--vchasno-ui-input-placeholder-color)}.vchasno-ui-PasswordInput__eye svg{transition:color var(--vchasno-ui-transition-duration-sec,.3s)}.vchasno-ui-input__wrapper:has(.vchasno-ui-PasswordInput__eye){padding-right:40px}.vchasno-ui-input__wrapper:has(.vchasno-ui-PasswordInput__eye) .vchasno-ui-input__feedback{display:none}.vchasno-ui-slider.vchasno-ui-slider-root{height:2px}.vchasno-ui-slider .vchasno-ui-slider-mark{background-color:#e2e9f3;border-radius:var(--vchasno-ui-border-radius-full);height:8px;width:8px}.vchasno-ui-slider .vchasno-ui-slider-mark.MuiSlider-markActive{background-color:var(--vchasno-ui-slider-color)}.vchasno-ui-slider .vchasno-ui-slider-mark-label{color:var(--vchasno-ui-label-color-default)}.vchasno-ui-slider .vchasno-ui-slider-rail{background-color:#e2e9f3}.vchasno-ui-slider .vchasno-ui-slider-track{background-color:var(--vchasno-ui-slider-color);border-color:var(--vchasno-ui-slider-color)}.vchasno-ui-slider .vchasno-ui-slider-thumb{background-color:var(--vchasno-ui-slider-color);height:24px;width:24px}.vchasno-ui-slider .vchasno-ui-slider-thumb.Mui-focusVisible,.vchasno-ui-slider .vchasno-ui-slider-thumb:hover{box-shadow:0 0 0 8px var(--vchasno-ui-slider-thumb-box-shadow-color)}.vchasno-ui-slider .vchasno-ui-slider-thumb.Mui-active{box-shadow:0 0 0 14px var(--vchasno-ui-slider-thumb-box-shadow-color)}.vchasno-ui-breadcrumbs{font-size:14px;line-height:20px}.vchasno-ui-breadcrumbs-separator{margin:0 2px}.vchasno-ui-avatar{--avatar-size:40px;--avatar-font-size:16px;align-items:center;background-color:#e2e9f3;border-radius:var(--avatar-radius);color:#6e809a;display:inline-flex;font-size:var(--avatar-font-size);font-weight:var(--vchasno-ui-font-weight-medium);height:var(--avatar-size);justify-content:center;line-height:1;overflow:hidden;user-select:none;vertical-align:middle;width:var(--avatar-size)}.vchasno-ui-avatar,.vchasno-ui-avatar--shape-circular{--avatar-radius:var(--vchasno-ui-border-radius-full)}.vchasno-ui-avatar--shape-rounded{--avatar-radius:var(--vchasno-ui-border-radius-md)}.vchasno-ui-avatar--size-xs{--avatar-size:24px;--avatar-font-size:var(--vchasno-ui-font-size-2xs)}.vchasno-ui-avatar--size-sm{--avatar-size:32px;--avatar-font-size:var(--vchasno-ui-font-size-xs)}.vchasno-ui-avatar--size-md{--avatar-size:40px;--avatar-font-size:var(--vchasno-ui-font-size-md)}.vchasno-ui-avatar--size-lg{--avatar-size:56px;--avatar-font-size:var(--vchasno-ui-font-size-xl)}.vchasno-ui-avatar--size-xl{--avatar-size:88px;--avatar-font-size:var(--vchasno-ui-font-size-2xl)}.vchasno-ui-avatar__image{height:100%;object-fit:cover;width:100%}.vchasno-ui-avatar__fallback{align-items:center;display:flex;height:100%;justify-content:center;width:100%}
|