ropav 0.0.10 → 0.0.12

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.
Files changed (276) hide show
  1. package/README.md +9 -0
  2. package/dist/accordion.css +115 -111
  3. package/dist/accordion.js +60 -16
  4. package/dist/alert.css +110 -108
  5. package/dist/alert.js +48 -26
  6. package/dist/aspect-ratio.css +17 -15
  7. package/dist/aspect-ratio.js +20 -6
  8. package/dist/avatar.css +98 -96
  9. package/dist/avatar.js +27 -16
  10. package/dist/badge.css +95 -93
  11. package/dist/badge.js +29 -16
  12. package/dist/base.css +672 -671
  13. package/dist/button-group.css +39 -37
  14. package/dist/button-group.js +23 -12
  15. package/dist/button-link.css +160 -158
  16. package/dist/button-link.js +43 -24
  17. package/dist/button.css +160 -158
  18. package/dist/button.js +37 -19
  19. package/dist/card.css +109 -107
  20. package/dist/card.js +42 -17
  21. package/dist/checkbox.css +139 -137
  22. package/dist/checkbox.js +103 -33
  23. package/dist/collapse.css +29 -27
  24. package/dist/collapse.js +44 -10
  25. package/dist/color-input.css +137 -107
  26. package/dist/color-input.js +117 -30
  27. package/dist/color-picker.css +309 -303
  28. package/dist/color-picker.js +147 -54
  29. package/dist/color-picker2.js +9 -1
  30. package/dist/color-swatch.css +48 -46
  31. package/dist/color-swatch.js +15 -11
  32. package/dist/color-swatch2.js +4 -0
  33. package/dist/components/accordion/accordion-item.d.ts +13 -1
  34. package/dist/components/accordion/index.d.ts +2 -1
  35. package/dist/components/accordion/index.js +2 -2
  36. package/dist/components/accordion/types.d.ts +9 -4
  37. package/dist/components/alert/alert.d.ts +2 -2
  38. package/dist/components/alert/index.d.ts +2 -2
  39. package/dist/components/alert/index.js +2 -2
  40. package/dist/components/alert/types.d.ts +4 -1
  41. package/dist/components/aspect-ratio/index.d.ts +2 -1
  42. package/dist/components/aspect-ratio/index.js +2 -2
  43. package/dist/components/aspect-ratio/types.d.ts +4 -1
  44. package/dist/components/avatar/index.d.ts +2 -2
  45. package/dist/components/avatar/index.js +2 -2
  46. package/dist/components/avatar/types.d.ts +4 -1
  47. package/dist/components/badge/index.d.ts +2 -2
  48. package/dist/components/badge/index.js +2 -2
  49. package/dist/components/badge/types.d.ts +4 -1
  50. package/dist/components/button/index.d.ts +2 -1
  51. package/dist/components/button/index.js +2 -2
  52. package/dist/components/button/types.d.ts +4 -1
  53. package/dist/components/button-group/index.d.ts +2 -1
  54. package/dist/components/button-group/index.js +2 -2
  55. package/dist/components/button-group/types.d.ts +4 -1
  56. package/dist/components/button-link/index.d.ts +2 -1
  57. package/dist/components/button-link/index.js +2 -2
  58. package/dist/components/button-link/types.d.ts +4 -1
  59. package/dist/components/card/index.d.ts +2 -1
  60. package/dist/components/card/index.js +2 -2
  61. package/dist/components/card/types.d.ts +5 -1
  62. package/dist/components/checkbox/checkbox.d.ts +4 -1
  63. package/dist/components/checkbox/index.d.ts +2 -1
  64. package/dist/components/checkbox/index.js +2 -2
  65. package/dist/components/checkbox/types.d.ts +11 -2
  66. package/dist/components/checkbox/useCheckbox.d.ts +3 -1
  67. package/dist/components/collapse/collapse.d.ts +2 -2
  68. package/dist/components/collapse/index.d.ts +2 -1
  69. package/dist/components/collapse/index.js +2 -2
  70. package/dist/components/collapse/types.d.ts +9 -2
  71. package/dist/components/color-input/index.d.ts +2 -1
  72. package/dist/components/color-input/index.js +2 -2
  73. package/dist/components/color-input/types.d.ts +8 -2
  74. package/dist/components/color-input/useColorInput.d.ts +1 -1
  75. package/dist/components/color-input/useColorInputValue.d.ts +1 -1
  76. package/dist/components/color-picker/index.d.ts +2 -2
  77. package/dist/components/color-picker/index.js +2 -2
  78. package/dist/components/color-picker/types.d.ts +13 -1
  79. package/dist/components/color-swatch/index.d.ts +2 -1
  80. package/dist/components/color-swatch/index.js +2 -1
  81. package/dist/components/color-swatch/types.d.ts +4 -1
  82. package/dist/components/dialog/dialog-close.d.ts +21 -0
  83. package/dist/components/dialog/dialog-content.d.ts +32 -0
  84. package/dist/components/dialog/dialog-core.d.ts +27 -0
  85. package/dist/components/dialog/dialog-description.d.ts +21 -0
  86. package/dist/components/dialog/dialog-overlay.d.ts +21 -0
  87. package/dist/components/dialog/dialog-portal.d.ts +21 -0
  88. package/dist/components/dialog/dialog-root.d.ts +28 -0
  89. package/dist/components/dialog/dialog-title.d.ts +21 -0
  90. package/dist/components/dialog/dialog-trigger.d.ts +23 -0
  91. package/dist/components/dialog/index.d.ts +9 -0
  92. package/dist/components/dialog/index.js +2 -0
  93. package/dist/components/dialog/types.d.ts +61 -0
  94. package/dist/components/dropdown-menu/dropdown-menu-checkbox-item.d.ts +24 -0
  95. package/dist/components/dropdown-menu/dropdown-menu-content.d.ts +34 -0
  96. package/dist/components/dropdown-menu/dropdown-menu-context-trigger.d.ts +23 -0
  97. package/dist/components/dropdown-menu/dropdown-menu-item-indicator.d.ts +24 -0
  98. package/dist/components/dropdown-menu/dropdown-menu-item-row.d.ts +28 -0
  99. package/dist/components/dropdown-menu/dropdown-menu-item.d.ts +23 -0
  100. package/dist/components/dropdown-menu/dropdown-menu-items.d.ts +24 -22
  101. package/dist/components/dropdown-menu/dropdown-menu-label.d.ts +21 -0
  102. package/dist/components/dropdown-menu/dropdown-menu-outside.d.ts +3 -0
  103. package/dist/components/dropdown-menu/dropdown-menu-portal.d.ts +21 -0
  104. package/dist/components/dropdown-menu/dropdown-menu-primitive-core.d.ts +110 -0
  105. package/dist/components/dropdown-menu/dropdown-menu-primitives.d.ts +15 -0
  106. package/dist/components/dropdown-menu/dropdown-menu-radio-group.d.ts +25 -0
  107. package/dist/components/dropdown-menu/dropdown-menu-radio-item.d.ts +23 -0
  108. package/dist/components/dropdown-menu/dropdown-menu-root.d.ts +30 -0
  109. package/dist/components/dropdown-menu/dropdown-menu-separator.d.ts +19 -0
  110. package/dist/components/dropdown-menu/dropdown-menu-sub-content.d.ts +34 -0
  111. package/dist/components/dropdown-menu/dropdown-menu-sub-trigger.d.ts +28 -0
  112. package/dist/components/dropdown-menu/dropdown-menu-sub.d.ts +28 -0
  113. package/dist/components/dropdown-menu/dropdown-menu-trigger.d.ts +23 -0
  114. package/dist/components/dropdown-menu/dropdown-menu.d.ts +6 -3
  115. package/dist/components/dropdown-menu/index.d.ts +32 -1
  116. package/dist/components/dropdown-menu/index.js +2 -2
  117. package/dist/components/dropdown-menu/types.d.ts +145 -6
  118. package/dist/components/dropdown-menu/useDropdownMenu.d.ts +15 -3
  119. package/dist/components/dropdown-menu/useDropdownMenuDisclosure.d.ts +10 -3
  120. package/dist/components/dropdown-menu/useDropdownMenuDom.d.ts +2 -1
  121. package/dist/components/dropdown-menu/useDropdownMenuInteractions.d.ts +4 -4
  122. package/dist/components/dropdown-menu/useDropdownMenuPortalPosition.d.ts +19 -0
  123. package/dist/components/dropdown-menu/useDropdownMenuPrimitiveContent.d.ts +27 -0
  124. package/dist/components/dropdown-menu/useDropdownMenuRenderItems.d.ts +14 -2
  125. package/dist/components/field/index.d.ts +2 -1
  126. package/dist/components/field/index.js +2 -2
  127. package/dist/components/field/types.d.ts +4 -1
  128. package/dist/components/floating/index.d.ts +3 -0
  129. package/dist/components/floating/index.js +3 -0
  130. package/dist/components/floating/types.d.ts +105 -0
  131. package/dist/components/floating/useFloatingPosition.d.ts +15 -0
  132. package/dist/components/floating/useHoverDisclosure.d.ts +2 -0
  133. package/dist/components/focus-trap/focus-trap.d.ts +31 -0
  134. package/dist/components/focus-trap/index.d.ts +4 -0
  135. package/dist/components/focus-trap/index.js +3 -0
  136. package/dist/components/focus-trap/types.d.ts +41 -0
  137. package/dist/components/focus-trap/useFocusTrap.d.ts +2 -0
  138. package/dist/components/icon-button/index.d.ts +2 -1
  139. package/dist/components/icon-button/index.js +2 -1
  140. package/dist/components/icon-button/types.d.ts +4 -1
  141. package/dist/components/input/index.d.ts +2 -1
  142. package/dist/components/input/index.js +2 -1
  143. package/dist/components/input/input.d.ts +4 -1
  144. package/dist/components/input/types.d.ts +7 -2
  145. package/dist/components/modal/index.d.ts +2 -1
  146. package/dist/components/modal/index.js +2 -2
  147. package/dist/components/modal/modal.d.ts +3 -1
  148. package/dist/components/modal/types.d.ts +11 -1
  149. package/dist/components/modal/useModal.d.ts +7 -4
  150. package/dist/components/number-input/index.d.ts +2 -1
  151. package/dist/components/number-input/index.js +2 -2
  152. package/dist/components/number-input/types.d.ts +7 -2
  153. package/dist/components/number-input/useNumberInput.d.ts +2 -1
  154. package/dist/components/overlay/index.d.ts +2 -1
  155. package/dist/components/overlay/index.js +2 -1
  156. package/dist/components/overlay/types.d.ts +4 -1
  157. package/dist/components/popover/index.d.ts +2 -2
  158. package/dist/components/popover/index.js +2 -2
  159. package/dist/components/popover/popover.d.ts +2 -2
  160. package/dist/components/popover/types.d.ts +20 -11
  161. package/dist/components/popover/usePopover.d.ts +9 -1
  162. package/dist/components/progress/index.d.ts +2 -2
  163. package/dist/components/progress/index.js +2 -2
  164. package/dist/components/progress/types.d.ts +4 -1
  165. package/dist/components/radio/index.d.ts +2 -1
  166. package/dist/components/radio/index.js +2 -2
  167. package/dist/components/radio/radio.d.ts +8 -3
  168. package/dist/components/radio/types.d.ts +37 -4
  169. package/dist/components/radio/useRadio.d.ts +12 -4
  170. package/dist/components/select/index.d.ts +2 -1
  171. package/dist/components/select/index.js +2 -2
  172. package/dist/components/select/select.d.ts +4 -1
  173. package/dist/components/select/types.d.ts +10 -2
  174. package/dist/components/select/useSelect.d.ts +3 -1
  175. package/dist/components/slider/index.d.ts +2 -2
  176. package/dist/components/slider/index.js +2 -2
  177. package/dist/components/slider/range-slider-tooltip.d.ts +3 -0
  178. package/dist/components/slider/range-slider.d.ts +7 -4
  179. package/dist/components/slider/slider.d.ts +4 -1
  180. package/dist/components/slider/sliderCore.d.ts +4 -4
  181. package/dist/components/slider/types.d.ts +22 -4
  182. package/dist/components/slider/useRangeSlider.d.ts +2 -2
  183. package/dist/components/slider/useSlider.d.ts +2 -2
  184. package/dist/components/switch/index.d.ts +2 -1
  185. package/dist/components/switch/index.js +2 -2
  186. package/dist/components/switch/switch.d.ts +4 -1
  187. package/dist/components/switch/types.d.ts +11 -2
  188. package/dist/components/switch/useSwitch.d.ts +3 -1
  189. package/dist/components/tabs/index.d.ts +2 -1
  190. package/dist/components/tabs/index.js +2 -2
  191. package/dist/components/tabs/types.d.ts +13 -4
  192. package/dist/components/teleport-provider/index.d.ts +3 -0
  193. package/dist/components/teleport-provider/index.js +3 -0
  194. package/dist/components/teleport-provider/teleport-provider.d.ts +21 -0
  195. package/dist/components/teleport-provider/types.d.ts +4 -0
  196. package/dist/components/teleport-provider/useTeleportTarget.d.ts +6 -0
  197. package/dist/components/textarea/index.d.ts +2 -1
  198. package/dist/components/textarea/index.js +2 -2
  199. package/dist/components/textarea/textarea.d.ts +4 -1
  200. package/dist/components/textarea/types.d.ts +10 -2
  201. package/dist/components/textarea/useTextarea.d.ts +2 -1
  202. package/dist/components/toast/index.d.ts +3 -2
  203. package/dist/components/toast/index.js +2 -2
  204. package/dist/components/toast/toast-store.d.ts +2 -0
  205. package/dist/components/toast/toast.d.ts +2 -2
  206. package/dist/components/toast/types.d.ts +20 -10
  207. package/dist/components/toast/useToast.d.ts +2 -2
  208. package/dist/components/tooltip/index.d.ts +2 -1
  209. package/dist/components/tooltip/index.js +2 -1
  210. package/dist/components/tooltip/tooltip.d.ts +2 -2
  211. package/dist/components/tooltip/types.d.ts +13 -12
  212. package/dist/components/tooltip/useTooltip.d.ts +12 -2
  213. package/dist/composables/useOverlayLayer.d.ts +32 -0
  214. package/dist/dialog.js +510 -0
  215. package/dist/dropdown-menu.css +191 -108
  216. package/dist/dropdown-menu.js +1954 -198
  217. package/dist/field.css +41 -39
  218. package/dist/field.js +40 -16
  219. package/dist/floating.js +403 -0
  220. package/dist/focus-trap.js +80 -0
  221. package/dist/icon-button.css +193 -189
  222. package/dist/icon-button.js +23 -18
  223. package/dist/icon-button2.js +8 -0
  224. package/dist/index.d.ts +5 -0
  225. package/dist/index.js +39 -32
  226. package/dist/input.css +122 -120
  227. package/dist/input.js +63 -40
  228. package/dist/input2.js +9 -0
  229. package/dist/legacy-unlayered.css +5382 -0
  230. package/dist/modal.css +129 -127
  231. package/dist/modal.js +182 -281
  232. package/dist/number-input.css +87 -85
  233. package/dist/number-input.js +98 -26
  234. package/dist/overlay.css +26 -24
  235. package/dist/overlay.js +17 -9
  236. package/dist/overlay2.js +4 -0
  237. package/dist/popover.css +140 -107
  238. package/dist/popover.js +276 -196
  239. package/dist/popover2.js +6 -1
  240. package/dist/progress.css +101 -99
  241. package/dist/progress.js +50 -28
  242. package/dist/radio.css +114 -105
  243. package/dist/radio.js +237 -61
  244. package/dist/select.css +255 -242
  245. package/dist/select.js +257 -94
  246. package/dist/slider.css +1090 -1031
  247. package/dist/slider.js +443 -175
  248. package/dist/styles-api.d.ts +22 -0
  249. package/dist/styles-api.js +49 -0
  250. package/dist/switch.css +120 -108
  251. package/dist/switch.js +112 -38
  252. package/dist/tabs.css +286 -278
  253. package/dist/tabs.js +60 -21
  254. package/dist/teleport-provider.js +15 -0
  255. package/dist/textarea.css +132 -130
  256. package/dist/textarea.js +83 -31
  257. package/dist/toast.css +229 -225
  258. package/dist/toast.js +189 -118
  259. package/dist/tooltip.css +61 -106
  260. package/dist/tooltip.js +184 -228
  261. package/dist/tooltip2.js +8 -0
  262. package/dist/useControlState.js +4 -0
  263. package/dist/useFloatingPosition.js +1317 -0
  264. package/dist/useFocusTrap.js +130 -0
  265. package/dist/useFormControl.js +107 -0
  266. package/dist/useOverlayLayer.js +262 -0
  267. package/dist/useTeleportTarget.js +40 -0
  268. package/docs/public-floating-api.md +148 -0
  269. package/docs/public-styles-api.md +134 -0
  270. package/docs/public-tokens.md +545 -0
  271. package/package.json +37 -9
  272. package/src/styles/_tokens.scss +33 -28
  273. package/src/styles/_utilities.scss +11 -9
  274. package/src/styles/styles-manifest.json +4125 -0
  275. package/dist/rafScheduler.js +0 -34
  276. package/dist/useClickOutside.js +0 -24
package/dist/slider.css CHANGED
@@ -1,1032 +1,1091 @@
1
- .rp-slider[data-v-b852f835] {
2
- --_rp-slider-color: var(--rp-color-control-selected-bg);
3
- --_rp-slider-track-bg: var(--rp-color-control-track-bg);
4
- --_rp-slider-thumb-bg: var(--rp-color-control-thumb-bg);
5
- --_rp-slider-thumb-border: var(--_rp-slider-color);
6
- --_rp-slider-thumb-border-style: var(--_rp-slider-thumb-border-width) solid
7
- var(--_rp-slider-thumb-border);
8
- --_rp-slider-thumb-padding: 0;
9
- --_rp-slider-track-length: 160px;
10
- --_rp-slider-track-height: 8px;
11
- --_rp-slider-thumb-size: 16px;
12
- --_rp-slider-thumb-border-width: 4px;
13
- --_rp-slider-font-size: var(--rp-font-size-md);
14
- --_rp-slider-mark-size: 4px;
15
- --_rp-slider-mark-color: var(--rp-color-control-thumb-bg);
16
- --_rp-slider-mark-label-color: var(--rp-color-dimmed);
17
- --_rp-slider-mark-filled-label-color: var(--rp-color-text);
18
- --_rp-slider-mark-ring-color: var(--_rp-slider-color);
19
- --_rp-slider-ratio: 0;
20
- --_rp-slider-fill-position: calc(
21
- var(--_rp-slider-thumb-size) / 2 + (100% - var(--_rp-slider-thumb-size)) *
22
- var(--_rp-slider-ratio)
23
- );
24
- display: inline-grid;
25
- width: 100%;
26
- min-width: var(--_rp-slider-track-length);
27
- max-width: 100%;
28
- gap: var(--rp-spacing-2);
29
- cursor: pointer;
30
- font-family: var(--rp-font-family);
31
- font-size: var(--_rp-slider-font-size);
32
- line-height: var(--rp-line-height-md);
33
- }
34
- html.dark .rp-slider[data-v-b852f835], [data-rp-color-scheme=dark] .rp-slider[data-v-b852f835] {
35
- --_rp-slider-thumb-bg: var(--_rp-slider-color);
36
- --_rp-slider-thumb-border: var(--rp-color-control-thumb-bg);
37
- }
38
- .rp-slider--custom-thumb[data-v-b852f835] {
39
- --_rp-slider-thumb-bg: var(--_rp-slider-color);
40
- --_rp-slider-thumb-border: var(--rp-color-control-thumb-bg);
41
- }
42
- .rp-slider--disabled[data-v-b852f835] {
43
- opacity: var(--rp-opacity-disabled);
44
- cursor: not-allowed;
45
- }
46
- .rp-slider__header[data-v-b852f835] {
47
- display: flex;
48
- align-items: center;
49
- justify-content: space-between;
50
- min-width: 0;
51
- gap: var(--rp-spacing-3);
52
- }
53
- .rp-slider__label[data-v-b852f835] {
54
- min-width: 0;
55
- color: var(--rp-color-text);
56
- }
57
- .rp-slider__value[data-v-b852f835] {
58
- flex-shrink: 0;
59
- color: var(--rp-color-dimmed);
60
- font-variant-numeric: tabular-nums;
61
- }
62
- .rp-slider__track[data-v-b852f835] {
63
- position: relative;
64
- display: block;
65
- min-width: 0;
66
- }
67
- .rp-slider__bar[data-v-b852f835] {
68
- position: absolute;
69
- z-index: 1;
70
- top: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-track-height)) / 2);
71
- left: 0;
72
- display: block;
73
- width: 100%;
74
- height: var(--_rp-slider-track-height);
75
- pointer-events: none;
76
- background: linear-gradient(to right, var(--_rp-slider-color) 0 var(--_rp-slider-fill-position), var(--_rp-slider-track-bg) var(--_rp-slider-fill-position) 100%);
77
- border-radius: var(--rp-radius-full);
78
- }
79
- .rp-slider--marks-with-labels .rp-slider__track[data-v-b852f835] {
80
- padding-bottom: calc(var(--_rp-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
81
- }
82
- .rp-slider__native[data-v-b852f835] {
83
- position: relative;
84
- z-index: 3;
85
- display: block;
86
- width: 100%;
87
- min-width: 0;
88
- height: var(--_rp-slider-thumb-size);
89
- padding: 0;
90
- margin: 0;
91
- appearance: none;
92
- background: transparent;
93
- cursor: pointer;
94
- outline: none;
95
- }
96
- .rp-slider__marks[data-v-b852f835] {
97
- position: absolute;
98
- z-index: 2;
99
- top: 0;
100
- right: calc(var(--_rp-slider-thumb-size) / 2);
101
- left: calc(var(--_rp-slider-thumb-size) / 2);
102
- height: var(--_rp-slider-thumb-size);
103
- pointer-events: none;
104
- }
105
- .rp-slider__mark[data-v-b852f835] {
106
- position: absolute;
107
- top: 0;
108
- left: var(--_rp-slider-mark-position);
109
- display: inline-flex;
110
- flex-direction: column;
111
- align-items: center;
112
- width: max-content;
113
- max-width: 8rem;
114
- color: var(--_rp-slider-mark-label-color);
115
- line-height: var(--rp-line-height-md);
116
- transform: translateX(-50%);
117
- }
118
- .rp-slider__mark-dot[data-v-b852f835] {
119
- width: var(--_rp-slider-mark-size);
120
- height: var(--_rp-slider-mark-size);
121
- margin-top: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-mark-size)) / 2);
122
- background: var(--_rp-slider-mark-color);
123
- border-radius: var(--rp-radius-full);
124
- box-shadow: 0 0 0 var(--rp-border-width-thin) transparent;
125
- transition: box-shadow var(--rp-transition-fast);
126
- }
127
- .rp-slider__mark-label[data-v-b852f835] {
128
- max-width: 100%;
129
- margin-top: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-mark-size)) / 2 + var(--rp-spacing-1));
130
- overflow-wrap: anywhere;
131
- color: inherit;
132
- font-size: var(--_rp-slider-font-size);
133
- text-align: center;
134
- font-variant-numeric: tabular-nums;
135
- }
136
- .rp-slider__mark--filled .rp-slider__mark-dot[data-v-b852f835] {
137
- box-shadow: 0 0 0 var(--rp-border-width-thin) var(--_rp-slider-mark-ring-color);
138
- }
139
- .rp-slider__mark--filled .rp-slider__mark-label[data-v-b852f835] {
140
- color: var(--_rp-slider-mark-filled-label-color);
141
- }
142
- .rp-slider__thumb[data-v-b852f835] {
143
- position: absolute;
144
- z-index: 4;
145
- top: 0;
146
- right: calc(var(--_rp-slider-thumb-size) / 2);
147
- left: calc(var(--_rp-slider-thumb-size) / 2);
148
- height: var(--_rp-slider-thumb-size);
149
- pointer-events: none;
150
- }
151
- .rp-slider__thumb-content[data-v-b852f835] {
152
- position: absolute;
153
- top: 50%;
154
- left: var(--_rp-slider-percent);
155
- display: inline-flex;
156
- align-items: center;
157
- justify-content: center;
158
- width: var(--_rp-slider-thumb-size);
159
- height: var(--_rp-slider-thumb-size);
160
- box-sizing: border-box;
161
- overflow: hidden;
162
- padding: var(--_rp-slider-thumb-padding);
163
- color: var(--_rp-slider-thumb-border);
164
- background: var(--_rp-slider-thumb-bg);
165
- border: var(--_rp-slider-thumb-border-style);
166
- border-radius: var(--rp-radius-full);
167
- box-shadow: var(--rp-shadow-sm);
168
- transform: translate(-50%, -50%);
169
- transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
170
- }
171
- .rp-slider__thumb-content[data-v-b852f835] svg {
172
- width: 60%;
173
- height: 60%;
174
- }
175
- .rp-slider__tooltip[data-v-b852f835] {
176
- position: absolute;
177
- z-index: 5;
178
- top: 0;
179
- left: var(--_rp-slider-fill-position);
180
- width: var(--_rp-slider-thumb-size);
181
- height: var(--_rp-slider-thumb-size);
182
- pointer-events: none;
183
- translate: -50% 0;
184
- }
185
- .rp-slider__tooltip-anchor[data-v-b852f835] {
186
- display: block;
187
- width: 100%;
188
- height: 100%;
189
- }
190
- .rp-slider__tooltip[data-v-b852f835] .rp-tooltip__content {
191
- min-width: 2rem;
192
- max-width: min(12rem, 100vw - var(--rp-spacing-6));
193
- padding: var(--rp-spacing-1) var(--rp-spacing-2);
194
- white-space: nowrap;
195
- font-variant-numeric: tabular-nums;
196
- }
197
- .rp-slider__native[data-v-b852f835]:disabled {
198
- cursor: not-allowed;
199
- }
200
- .rp-slider__native[data-v-b852f835]::-webkit-slider-runnable-track {
201
- height: var(--_rp-slider-track-height);
202
- border-radius: var(--rp-radius-full);
203
- background: transparent;
204
- }
205
- .rp-slider__native[data-v-b852f835]::-moz-range-track {
206
- height: var(--_rp-slider-track-height);
207
- border-radius: var(--rp-radius-full);
208
- background: transparent;
209
- }
210
- .rp-slider__native[data-v-b852f835]::-moz-range-progress {
211
- height: var(--_rp-slider-track-height);
212
- border-radius: var(--rp-radius-full);
213
- background: transparent;
214
- }
215
- .rp-slider__native[data-v-b852f835]::-webkit-slider-thumb {
216
- width: var(--_rp-slider-thumb-size);
217
- height: var(--_rp-slider-thumb-size);
218
- margin-top: calc((var(--_rp-slider-track-height) - var(--_rp-slider-thumb-size)) / 2);
219
- box-sizing: border-box;
220
- appearance: none;
221
- background: var(--_rp-slider-thumb-bg);
222
- border: var(--_rp-slider-thumb-border-style);
223
- border-radius: var(--rp-radius-full);
224
- box-shadow: var(--rp-shadow-sm);
225
- transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
226
- }
227
- .rp-slider__native[data-v-b852f835]::-moz-range-thumb {
228
- width: var(--_rp-slider-thumb-size);
229
- height: var(--_rp-slider-thumb-size);
230
- box-sizing: border-box;
231
- background: var(--_rp-slider-thumb-bg);
232
- border: var(--_rp-slider-thumb-border-style);
233
- border-radius: var(--rp-radius-full);
234
- box-shadow: var(--rp-shadow-sm);
235
- transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
236
- }
237
- .rp-slider--vertical[data-v-b852f835] {
238
- width: max-content;
239
- min-width: 0;
240
- max-width: none;
241
- justify-items: center;
242
- }
243
- .rp-slider--vertical .rp-slider__header[data-v-b852f835] {
244
- width: max-content;
245
- max-width: 12rem;
246
- justify-content: space-between;
247
- gap: var(--rp-spacing-3);
248
- text-align: center;
249
- }
250
- .rp-slider--vertical .rp-slider__value[data-v-b852f835] {
251
- min-width: 3ch;
252
- text-align: right;
253
- }
254
- .rp-slider--vertical .rp-slider__track[data-v-b852f835] {
255
- width: var(--_rp-slider-thumb-size);
256
- height: var(--_rp-slider-track-length);
257
- min-width: 0;
258
- min-height: var(--_rp-slider-track-length);
259
- justify-self: center;
260
- }
261
- .rp-slider--vertical .rp-slider__bar[data-v-b852f835] {
262
- top: 0;
263
- left: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-track-height)) / 2);
264
- width: var(--_rp-slider-track-height);
265
- height: 100%;
266
- background: linear-gradient(to top, var(--_rp-slider-color) 0 var(--_rp-slider-fill-position), var(--_rp-slider-track-bg) var(--_rp-slider-fill-position) 100%);
267
- }
268
- .rp-slider--vertical.rp-slider--marks-with-labels .rp-slider__track[data-v-b852f835] {
269
- padding-right: calc(var(--_rp-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
270
- padding-bottom: 0;
271
- }
272
- .rp-slider--vertical .rp-slider__native[data-v-b852f835] {
273
- width: var(--_rp-slider-thumb-size);
274
- min-width: 0;
275
- height: 100%;
276
- min-height: var(--_rp-slider-track-length);
277
- direction: rtl;
278
- writing-mode: vertical-lr;
279
- }
280
- .rp-slider--vertical .rp-slider__marks[data-v-b852f835] {
281
- top: calc(var(--_rp-slider-thumb-size) / 2);
282
- right: auto;
283
- bottom: calc(var(--_rp-slider-thumb-size) / 2);
284
- left: 0;
285
- width: var(--_rp-slider-thumb-size);
286
- height: auto;
287
- }
288
- .rp-slider--vertical .rp-slider__mark[data-v-b852f835] {
289
- top: calc(100% - var(--_rp-slider-mark-position));
290
- left: 0;
291
- flex-direction: row;
292
- align-items: center;
293
- transform: translateY(-50%);
294
- }
295
- .rp-slider--vertical .rp-slider__mark-dot[data-v-b852f835] {
296
- flex: 0 0 auto;
297
- margin-top: 0;
298
- margin-left: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-mark-size)) / 2);
299
- }
300
- .rp-slider--vertical .rp-slider__mark-label[data-v-b852f835] {
301
- margin-top: 0;
302
- margin-left: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-mark-size)) / 2 + var(--rp-spacing-1));
303
- text-align: left;
304
- }
305
- .rp-slider--vertical .rp-slider__thumb[data-v-b852f835] {
306
- top: calc(var(--_rp-slider-thumb-size) / 2);
307
- right: auto;
308
- bottom: calc(var(--_rp-slider-thumb-size) / 2);
309
- left: 0;
310
- width: var(--_rp-slider-thumb-size);
311
- height: auto;
312
- }
313
- .rp-slider--vertical .rp-slider__thumb-content[data-v-b852f835] {
314
- top: calc(100% - var(--_rp-slider-percent));
315
- left: 50%;
316
- }
317
- .rp-slider--vertical .rp-slider__tooltip[data-v-b852f835] {
318
- top: calc(100% - var(--_rp-slider-fill-position));
319
- left: 0;
320
- translate: 0 -50%;
321
- }
322
- .rp-slider--vertical .rp-slider__native[data-v-b852f835]::-webkit-slider-runnable-track {
323
- width: var(--_rp-slider-track-height);
324
- height: 100%;
325
- background: transparent;
326
- }
327
- .rp-slider--vertical .rp-slider__native[data-v-b852f835]::-moz-range-track {
328
- width: var(--_rp-slider-track-height);
329
- height: 100%;
330
- }
331
- .rp-slider--vertical .rp-slider__native[data-v-b852f835]::-moz-range-progress {
332
- width: var(--_rp-slider-track-height);
333
- }
334
- .rp-slider--vertical .rp-slider__native[data-v-b852f835]::-webkit-slider-thumb {
335
- margin-top: 0;
336
- margin-left: calc((var(--_rp-slider-track-height) - var(--_rp-slider-thumb-size)) / 2);
337
- }
338
- .rp-slider--custom-thumb .rp-slider__native[data-v-b852f835]::-webkit-slider-thumb {
339
- opacity: 0;
340
- }
341
- .rp-slider--custom-thumb .rp-slider__native[data-v-b852f835]::-moz-range-thumb {
342
- opacity: 0;
343
- }
344
- .rp-slider__native[data-v-b852f835]:focus-visible::-webkit-slider-thumb {
345
- box-shadow: var(--rp-shadow-sm), 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
346
- }
347
- .rp-slider__native[data-v-b852f835]:focus-visible::-moz-range-thumb {
348
- box-shadow: var(--rp-shadow-sm), 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
349
- }
350
- .rp-slider--custom-thumb .rp-slider__native:focus-visible ~ .rp-slider__thumb .rp-slider__thumb-content[data-v-b852f835] {
351
- box-shadow: var(--rp-shadow-sm), 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
352
- }
353
- .rp-slider--size-xs[data-v-b852f835] {
354
- --_rp-slider-track-height: 4px;
355
- --_rp-slider-thumb-size: 8px;
356
- --_rp-slider-thumb-border-width: 4px;
357
- --_rp-slider-font-size: var(--rp-font-size-xs);
358
- --_rp-slider-mark-size: 4px;
359
- }
360
- .rp-slider--size-sm[data-v-b852f835] {
361
- --_rp-slider-track-height: 6px;
362
- --_rp-slider-thumb-size: 12px;
363
- --_rp-slider-thumb-border-width: 3px;
364
- --_rp-slider-font-size: var(--rp-font-size-sm);
365
- --_rp-slider-mark-size: 4px;
366
- }
367
- .rp-slider--size-md[data-v-b852f835] {
368
- --_rp-slider-track-height: 8px;
369
- --_rp-slider-thumb-size: 16px;
370
- --_rp-slider-thumb-border-width: 4px;
371
- --_rp-slider-font-size: var(--rp-font-size-md);
372
- --_rp-slider-mark-size: 4px;
373
- }
374
- .rp-slider--size-lg[data-v-b852f835] {
375
- --_rp-slider-track-height: 10px;
376
- --_rp-slider-thumb-size: 20px;
377
- --_rp-slider-thumb-border-width: 5px;
378
- --_rp-slider-font-size: var(--rp-font-size-lg);
379
- --_rp-slider-mark-size: 5px;
380
- }
381
- .rp-slider--size-xl[data-v-b852f835] {
382
- --_rp-slider-track-height: 12px;
383
- --_rp-slider-thumb-size: 24px;
384
- --_rp-slider-thumb-border-width: 6px;
385
- --_rp-slider-font-size: var(--rp-font-size-xl);
386
- --_rp-slider-mark-size: 6px;
387
- }.rp-tooltip[data-v-d17966e5] {
388
- --_rp-tooltip-main-axis-offset: var(--rp-spacing-2);
389
- --_rp-tooltip-cross-axis-offset: 0px;
390
- --_rp-tooltip-arrow-size: 0.4375rem;
391
- --_rp-tooltip-bg: var(--rp-color-bright);
392
- --_rp-tooltip-fg: var(--rp-color-default);
393
- position: relative;
394
- display: inline-flex;
395
- font-family: var(--rp-font-family);
396
- vertical-align: middle;
397
- }
398
- .rp-tooltip__content[data-v-d17966e5] {
399
- position: absolute;
400
- z-index: 1000;
401
- box-sizing: border-box;
402
- width: max-content;
403
- max-width: min(18rem, 100vw - var(--rp-spacing-6));
404
- padding: 0.375rem 0.625rem;
405
- color: var(--_rp-tooltip-fg);
406
- font-size: 0.8125rem;
407
- font-weight: var(--rp-font-weight-medium);
408
- line-height: var(--rp-line-height-md);
409
- text-align: center;
410
- white-space: normal;
411
- overflow-wrap: anywhere;
412
- pointer-events: none;
413
- background-color: var(--_rp-tooltip-bg);
414
- border-radius: var(--rp-radius-sm);
415
- box-shadow: var(--rp-shadow-md);
416
- }
417
- .rp-tooltip--arrow .rp-tooltip__content[data-v-d17966e5]::before {
418
- position: absolute;
419
- width: var(--_rp-tooltip-arrow-size);
420
- height: var(--_rp-tooltip-arrow-size);
421
- content: "";
422
- background-color: inherit;
423
- rotate: 45deg;
424
- }
425
- .rp-tooltip--placement-top .rp-tooltip__content[data-v-d17966e5] {
426
- bottom: calc(100% + var(--_rp-tooltip-main-axis-offset));
427
- left: calc(50% + var(--_rp-tooltip-cross-axis-offset));
428
- translate: -50% 0;
429
- }
430
- .rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-d17966e5]::before {
431
- top: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
432
- left: 50%;
433
- translate: -50% 0;
434
- }
435
- .rp-tooltip--placement-right .rp-tooltip__content[data-v-d17966e5] {
436
- top: calc(50% + var(--_rp-tooltip-cross-axis-offset));
437
- left: calc(100% + var(--_rp-tooltip-main-axis-offset));
438
- translate: 0 -50%;
439
- }
440
- .rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-d17966e5]::before {
441
- top: 50%;
442
- right: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
443
- translate: 0 -50%;
444
- }
445
- .rp-tooltip--placement-bottom .rp-tooltip__content[data-v-d17966e5] {
446
- top: calc(100% + var(--_rp-tooltip-main-axis-offset));
447
- left: calc(50% + var(--_rp-tooltip-cross-axis-offset));
448
- translate: -50% 0;
449
- }
450
- .rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-d17966e5]::before {
451
- bottom: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
452
- left: 50%;
453
- translate: -50% 0;
454
- }
455
- .rp-tooltip--placement-left .rp-tooltip__content[data-v-d17966e5] {
456
- top: calc(50% + var(--_rp-tooltip-cross-axis-offset));
457
- right: calc(100% + var(--_rp-tooltip-main-axis-offset));
458
- translate: 0 -50%;
459
- }
460
- .rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-d17966e5]::before {
461
- top: 50%;
462
- left: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
463
- translate: 0 -50%;
464
- }
465
- .rp-tooltip--target[data-v-d17966e5] {
466
- display: contents;
467
- }
468
- .rp-tooltip--target .rp-tooltip__content[data-v-d17966e5] {
469
- position: fixed;
470
- top: var(--_rp-tooltip-target-y, 0);
471
- right: auto;
472
- bottom: auto;
473
- left: var(--_rp-tooltip-target-x, 0);
474
- }
475
- .rp-tooltip--target.rp-tooltip--placement-top .rp-tooltip__content[data-v-d17966e5] {
476
- translate: calc(-50% + var(--_rp-tooltip-cross-axis-offset)) calc(-100% - var(--_rp-tooltip-main-axis-offset));
477
- }
478
- .rp-tooltip--target.rp-tooltip--placement-right .rp-tooltip__content[data-v-d17966e5] {
479
- translate: var(--_rp-tooltip-main-axis-offset) calc(-50% + var(--_rp-tooltip-cross-axis-offset));
480
- }
481
- .rp-tooltip--target.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-d17966e5] {
482
- translate: calc(-50% + var(--_rp-tooltip-cross-axis-offset)) var(--_rp-tooltip-main-axis-offset);
483
- }
484
- .rp-tooltip--target.rp-tooltip--placement-left .rp-tooltip__content[data-v-d17966e5] {
485
- translate: calc(-100% - var(--_rp-tooltip-main-axis-offset)) calc(-50% + var(--_rp-tooltip-cross-axis-offset));
486
- }
487
- .rp-tooltip-content-enter-active[data-v-d17966e5],
488
- .rp-tooltip-content-leave-active[data-v-d17966e5] {
489
- transition: opacity var(--rp-transition-fast);
490
- }
491
- .rp-tooltip-content-enter-from[data-v-d17966e5],
492
- .rp-tooltip-content-leave-to[data-v-d17966e5] {
493
- opacity: 0;
494
- }.rp-range-slider__tooltips[data-v-d17966e5] {
495
- position: absolute;
496
- z-index: 5;
497
- inset: 0;
498
- pointer-events: none;
499
- }
500
- .rp-range-slider__tooltip[data-v-d17966e5] {
501
- --_rp-range-slider-tooltip-translate-x: -50%;
502
- --_rp-range-slider-tooltip-translate-y: 0%;
503
- position: absolute;
504
- z-index: 5;
505
- top: 0;
506
- width: var(--_rp-range-slider-thumb-size);
507
- height: var(--_rp-range-slider-thumb-size);
508
- opacity: 1;
509
- pointer-events: none;
510
- translate: var(--_rp-range-slider-tooltip-translate-x) var(--_rp-range-slider-tooltip-translate-y);
511
- }
512
- .rp-range-slider__tooltip--lower[data-v-d17966e5] {
513
- left: var(--_rp-range-slider-lower-percent);
514
- }
515
- .rp-range-slider__tooltip--upper[data-v-d17966e5] {
516
- left: var(--_rp-range-slider-upper-percent);
517
- }
518
- .rp-range-slider__tooltip--merged[data-v-d17966e5] {
519
- left: var(--_rp-range-slider-tooltip-merged-percent);
520
- opacity: 0;
521
- }
522
- .rp-range-slider__tooltip .rp-tooltip__content[data-v-d17966e5] {
523
- max-width: min(12rem, 100vw - var(--rp-spacing-6));
524
- padding: var(--rp-spacing-1) var(--rp-spacing-2);
525
- white-space: nowrap;
526
- font-variant-numeric: tabular-nums;
527
- }
528
- .rp-range-slider__tooltip-anchor[data-v-d17966e5] {
529
- display: block;
530
- width: 100%;
531
- height: 100%;
532
- }
533
- .rp-range-slider__tooltip-merged-separator[data-v-d17966e5] {
534
- margin-inline: var(--rp-spacing-1);
535
- opacity: 0.64;
536
- }
537
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow .rp-tooltip__content[data-v-d17966e5]::before,
538
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow .rp-tooltip__content[data-v-d17966e5]::after {
539
- position: absolute;
540
- width: var(--_rp-tooltip-arrow-size);
541
- height: var(--_rp-tooltip-arrow-size);
542
- content: "";
543
- background-color: inherit;
544
- rotate: 45deg;
545
- }
546
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-d17966e5], .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-d17966e5] {
547
- min-width: var(--_rp-range-slider-tooltip-merged-min-size, 0px);
548
- }
549
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-d17966e5]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-d17966e5]::before {
550
- left: calc(50% - var(--_rp-range-slider-tooltip-merged-arrow-offset, 0px));
551
- translate: -50% 0;
552
- }
553
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-d17966e5]::after, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-d17966e5]::after {
554
- left: calc(50% + var(--_rp-range-slider-tooltip-merged-arrow-offset, 0px));
555
- translate: -50% 0;
556
- }
557
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-d17966e5]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-d17966e5]::after {
558
- top: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
559
- }
560
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-d17966e5]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-d17966e5]::after {
561
- bottom: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
562
- }
563
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-d17966e5], .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-d17966e5] {
564
- min-height: var(--_rp-range-slider-tooltip-merged-min-size, 0px);
565
- }
566
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-d17966e5]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-d17966e5]::before {
567
- top: calc(50% + var(--_rp-range-slider-tooltip-merged-arrow-offset, 0px));
568
- translate: 0 -50%;
569
- }
570
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-d17966e5]::after, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-d17966e5]::after {
571
- top: calc(50% - var(--_rp-range-slider-tooltip-merged-arrow-offset, 0px));
572
- translate: 0 -50%;
573
- }
574
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-d17966e5]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-d17966e5]::after {
575
- left: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
576
- }
577
- .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-d17966e5]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-d17966e5]::after {
578
- right: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
579
- }
580
- .rp-range-slider__tooltips--overlapping .rp-range-slider__tooltip--lower[data-v-d17966e5],
581
- .rp-range-slider__tooltips--overlapping .rp-range-slider__tooltip--upper[data-v-d17966e5] {
582
- opacity: 0;
583
- }
584
- .rp-range-slider__tooltips--overlapping .rp-range-slider__tooltip--merged[data-v-d17966e5] {
585
- opacity: 1;
586
- }
587
- .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip[data-v-d17966e5] {
588
- --_rp-range-slider-tooltip-translate-x: 0%;
589
- --_rp-range-slider-tooltip-translate-y: -50%;
590
- top: auto;
591
- left: 0;
592
- }
593
- .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip--lower[data-v-d17966e5] {
594
- top: calc(100% - var(--_rp-range-slider-lower-percent));
595
- }
596
- .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip--upper[data-v-d17966e5] {
597
- top: calc(100% - var(--_rp-range-slider-upper-percent));
598
- }
599
- .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip--merged[data-v-d17966e5] {
600
- top: calc(100% - var(--_rp-range-slider-tooltip-merged-percent));
601
- }
602
- .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip--merged .rp-tooltip__content[data-v-d17966e5] {
603
- display: flex;
604
- flex-direction: column;
605
- align-items: center;
606
- justify-content: center;
607
- }.rp-range-slider[data-v-8dd81f55] {
608
- --_rp-range-slider-color: var(--rp-color-control-selected-bg);
609
- --_rp-range-slider-track-bg: var(--rp-color-control-track-bg);
610
- --_rp-range-slider-thumb-bg: var(--rp-color-control-thumb-bg);
611
- --_rp-range-slider-thumb-border: var(--_rp-range-slider-color);
612
- --_rp-range-slider-thumb-border-style: var(--_rp-range-slider-thumb-border-width) solid
613
- var(--_rp-range-slider-thumb-border);
614
- --_rp-range-slider-thumb-padding: 0;
615
- --_rp-range-slider-track-length: 160px;
616
- --_rp-range-slider-track-height: 8px;
617
- --_rp-range-slider-thumb-size: 16px;
618
- --_rp-range-slider-thumb-border-width: 4px;
619
- --_rp-range-slider-font-size: var(--rp-font-size-md);
620
- --_rp-range-slider-mark-size: 4px;
621
- --_rp-range-slider-mark-color: var(--rp-color-control-thumb-bg);
622
- --_rp-range-slider-mark-label-color: var(--rp-color-dimmed);
623
- --_rp-range-slider-mark-filled-label-color: var(--rp-color-text);
624
- --_rp-range-slider-mark-ring-color: var(--_rp-range-slider-color);
625
- --_rp-range-slider-lower-percent: 0%;
626
- --_rp-range-slider-upper-percent: 100%;
627
- --_rp-range-slider-lower-ratio: 0;
628
- --_rp-range-slider-upper-ratio: 1;
629
- --_rp-range-slider-tooltip-merged-percent: 50%;
630
- --_rp-range-slider-lower-fill-position: calc(
631
- var(--_rp-range-slider-thumb-size) / 2 + (100% - var(--_rp-range-slider-thumb-size)) *
632
- var(--_rp-range-slider-lower-ratio)
633
- );
634
- --_rp-range-slider-upper-fill-position: calc(
635
- var(--_rp-range-slider-thumb-size) / 2 + (100% - var(--_rp-range-slider-thumb-size)) *
636
- var(--_rp-range-slider-upper-ratio)
637
- );
638
- --_rp-range-slider-tooltip-reserved-space: calc(
639
- var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-4)
640
- );
641
- box-sizing: border-box;
642
- display: inline-grid;
643
- width: 100%;
644
- min-width: var(--_rp-range-slider-track-length);
645
- max-width: 100%;
646
- gap: var(--rp-spacing-2);
647
- cursor: pointer;
648
- font-family: var(--rp-font-family);
649
- font-size: var(--_rp-range-slider-font-size);
650
- line-height: var(--rp-line-height-md);
651
- }
652
- html.dark .rp-range-slider[data-v-8dd81f55], [data-rp-color-scheme=dark] .rp-range-slider[data-v-8dd81f55] {
653
- --_rp-range-slider-thumb-bg: var(--_rp-range-slider-color);
654
- --_rp-range-slider-thumb-border: var(--rp-color-control-thumb-bg);
655
- }
656
- .rp-range-slider--custom-thumb[data-v-8dd81f55] {
657
- --_rp-range-slider-thumb-bg: var(--_rp-range-slider-color);
658
- --_rp-range-slider-thumb-border: var(--rp-color-control-thumb-bg);
659
- }
660
- .rp-range-slider--disabled[data-v-8dd81f55] {
661
- opacity: var(--rp-opacity-disabled);
662
- cursor: not-allowed;
663
- }
664
- .rp-range-slider__header[data-v-8dd81f55] {
665
- display: flex;
666
- align-items: center;
667
- justify-content: space-between;
668
- min-width: 0;
669
- gap: var(--rp-spacing-3);
670
- }
671
- .rp-range-slider__label[data-v-8dd81f55] {
672
- min-width: 0;
673
- color: var(--rp-color-text);
674
- }
675
- .rp-range-slider__value[data-v-8dd81f55] {
676
- flex-shrink: 0;
677
- color: var(--rp-color-dimmed);
678
- font-variant-numeric: tabular-nums;
679
- }
680
- .rp-range-slider__track[data-v-8dd81f55] {
681
- position: relative;
682
- display: block;
683
- min-width: 0;
684
- }
685
- .rp-range-slider__track[data-v-8dd81f55] {
686
- height: var(--_rp-range-slider-thumb-size);
687
- touch-action: none;
688
- }
689
- .rp-range-slider__bar[data-v-8dd81f55] {
690
- position: absolute;
691
- z-index: 1;
692
- top: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-track-height)) / 2);
693
- left: 0;
694
- display: block;
695
- width: 100%;
696
- height: var(--_rp-range-slider-track-height);
697
- pointer-events: none;
698
- background: linear-gradient(to right, var(--_rp-range-slider-track-bg) 0 var(--_rp-range-slider-lower-fill-position), var(--_rp-range-slider-color) var(--_rp-range-slider-lower-fill-position) var(--_rp-range-slider-upper-fill-position), var(--_rp-range-slider-track-bg) var(--_rp-range-slider-upper-fill-position) 100%);
699
- border-radius: var(--rp-radius-full);
700
- }
701
- .rp-range-slider--marks-with-labels .rp-range-slider__track[data-v-8dd81f55] {
702
- padding-bottom: calc(var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
703
- }
704
- .rp-range-slider__native[data-v-8dd81f55] {
705
- position: absolute;
706
- z-index: 3;
707
- top: 0;
708
- left: 0;
709
- display: block;
710
- width: 100%;
711
- min-width: 0;
712
- height: var(--_rp-range-slider-thumb-size);
713
- padding: 0;
714
- margin: 0;
715
- appearance: none;
716
- pointer-events: none;
717
- background: transparent;
718
- cursor: pointer;
719
- outline: none;
720
- }
721
- .rp-range-slider__native[data-v-8dd81f55]:focus, .rp-range-slider__native--active[data-v-8dd81f55], .rp-range-slider__native[data-active=true][data-v-8dd81f55] {
722
- z-index: 4;
723
- }
724
- .rp-range-slider__native[data-v-8dd81f55]:disabled {
725
- cursor: not-allowed;
726
- }
727
- .rp-range-slider__native[data-v-8dd81f55]::-webkit-slider-runnable-track {
728
- height: var(--_rp-range-slider-track-height);
729
- background: transparent;
730
- border: 0;
731
- border-radius: var(--rp-radius-full);
732
- }
733
- .rp-range-slider__native[data-v-8dd81f55]::-moz-range-track, .rp-range-slider__native[data-v-8dd81f55]::-moz-range-progress {
734
- height: var(--_rp-range-slider-track-height);
735
- background: transparent;
736
- border: 0;
737
- border-radius: var(--rp-radius-full);
738
- }
739
- .rp-range-slider__native[data-v-8dd81f55]::-webkit-slider-thumb {
740
- width: var(--_rp-range-slider-thumb-size);
741
- height: var(--_rp-range-slider-thumb-size);
742
- margin-top: calc((var(--_rp-range-slider-track-height) - var(--_rp-range-slider-thumb-size)) / 2);
743
- box-sizing: border-box;
744
- appearance: none;
745
- opacity: 0;
746
- pointer-events: none;
747
- background: transparent;
748
- border: 0;
749
- cursor: pointer;
750
- }
751
- .rp-range-slider__native[data-v-8dd81f55]::-moz-range-thumb {
752
- width: var(--_rp-range-slider-thumb-size);
753
- height: var(--_rp-range-slider-thumb-size);
754
- box-sizing: border-box;
755
- opacity: 0;
756
- pointer-events: none;
757
- background: transparent;
758
- border: 0;
759
- cursor: pointer;
760
- }
761
- .rp-range-slider__marks[data-v-8dd81f55] {
762
- position: absolute;
763
- z-index: 2;
764
- top: 0;
765
- right: calc(var(--_rp-range-slider-thumb-size) / 2);
766
- left: calc(var(--_rp-range-slider-thumb-size) / 2);
767
- height: var(--_rp-range-slider-thumb-size);
768
- pointer-events: none;
769
- }
770
- .rp-range-slider__mark[data-v-8dd81f55] {
771
- position: absolute;
772
- top: 0;
773
- left: var(--_rp-range-slider-mark-position);
774
- display: inline-flex;
775
- flex-direction: column;
776
- align-items: center;
777
- width: max-content;
778
- max-width: 8rem;
779
- color: var(--_rp-range-slider-mark-label-color);
780
- line-height: var(--rp-line-height-md);
781
- transform: translateX(-50%);
782
- }
783
- .rp-range-slider__mark-dot[data-v-8dd81f55] {
784
- width: var(--_rp-range-slider-mark-size);
785
- height: var(--_rp-range-slider-mark-size);
786
- margin-top: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2);
787
- background: var(--_rp-range-slider-mark-color);
788
- border-radius: var(--rp-radius-full);
789
- box-shadow: 0 0 0 var(--rp-border-width-thin) transparent;
790
- transition: box-shadow var(--rp-transition-fast);
791
- }
792
- .rp-range-slider__mark-label[data-v-8dd81f55] {
793
- max-width: 100%;
794
- margin-top: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2 + var(--rp-spacing-1));
795
- overflow-wrap: anywhere;
796
- color: inherit;
797
- font-size: var(--_rp-range-slider-font-size);
798
- text-align: center;
799
- font-variant-numeric: tabular-nums;
800
- }
801
- .rp-range-slider__mark--filled .rp-range-slider__mark-dot[data-v-8dd81f55] {
802
- box-shadow: 0 0 0 var(--rp-border-width-thin) var(--_rp-range-slider-mark-ring-color);
803
- }
804
- .rp-range-slider__mark--filled .rp-range-slider__mark-label[data-v-8dd81f55] {
805
- color: var(--_rp-range-slider-mark-filled-label-color);
806
- }
807
- .rp-range-slider__thumbs[data-v-8dd81f55] {
808
- position: absolute;
809
- z-index: 4;
810
- top: 0;
811
- right: calc(var(--_rp-range-slider-thumb-size) / 2);
812
- left: calc(var(--_rp-range-slider-thumb-size) / 2);
813
- height: var(--_rp-range-slider-thumb-size);
814
- pointer-events: none;
815
- }
816
- .rp-range-slider__thumb[data-v-8dd81f55] {
817
- --_rp-range-slider-thumb-percent: var(--_rp-range-slider-lower-percent);
818
- position: absolute;
819
- top: 0;
820
- left: var(--_rp-range-slider-thumb-percent);
821
- width: 0;
822
- height: var(--_rp-range-slider-thumb-size);
823
- pointer-events: auto;
824
- }
825
- .rp-range-slider__thumb--lower[data-v-8dd81f55] {
826
- --_rp-range-slider-thumb-percent: var(--_rp-range-slider-lower-percent);
827
- }
828
- .rp-range-slider__thumb--upper[data-v-8dd81f55] {
829
- --_rp-range-slider-thumb-percent: var(--_rp-range-slider-upper-percent);
830
- z-index: 1;
831
- }
832
- .rp-range-slider[data-active-thumb=lower] .rp-range-slider__thumb--lower[data-v-8dd81f55], .rp-range-slider[data-active-thumb=upper] .rp-range-slider__thumb--upper[data-v-8dd81f55], .rp-range-slider__thumb[data-v-8dd81f55]:hover {
833
- z-index: 2;
834
- }
835
- .rp-range-slider__thumb-content[data-v-8dd81f55] {
836
- position: absolute;
837
- top: 50%;
838
- left: 0;
839
- display: inline-flex;
840
- align-items: center;
841
- justify-content: center;
842
- width: var(--_rp-range-slider-thumb-size);
843
- height: var(--_rp-range-slider-thumb-size);
844
- box-sizing: border-box;
845
- overflow: hidden;
846
- padding: var(--_rp-range-slider-thumb-padding);
847
- color: var(--_rp-range-slider-thumb-border);
848
- background: var(--_rp-range-slider-thumb-bg);
849
- border: var(--_rp-range-slider-thumb-border-style);
850
- border-radius: var(--rp-radius-full);
851
- box-shadow: var(--rp-shadow-sm);
852
- transform: translate(-50%, -50%);
853
- transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
854
- }
855
- .rp-range-slider__thumb-content[data-v-8dd81f55] svg {
856
- width: 60%;
857
- height: 60%;
858
- }
859
- .rp-range-slider__native--lower:focus-visible ~ .rp-range-slider__thumbs .rp-range-slider__thumb--lower[data-v-8dd81f55], .rp-range-slider__native--upper:focus-visible ~ .rp-range-slider__thumbs .rp-range-slider__thumb--upper[data-v-8dd81f55] {
860
- z-index: 2;
861
- }
862
- .rp-range-slider__native--lower:focus-visible ~ .rp-range-slider__thumbs .rp-range-slider__thumb--lower .rp-range-slider__thumb-content[data-v-8dd81f55], .rp-range-slider__native--upper:focus-visible ~ .rp-range-slider__thumbs .rp-range-slider__thumb--upper .rp-range-slider__thumb-content[data-v-8dd81f55] {
863
- box-shadow: var(--rp-shadow-sm), 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
864
- }
865
- .rp-range-slider--vertical[data-v-8dd81f55] {
866
- width: max-content;
867
- min-width: 0;
868
- max-width: none;
869
- justify-items: center;
870
- }
871
- .rp-range-slider--vertical .rp-range-slider__header[data-v-8dd81f55] {
872
- width: max-content;
873
- max-width: 12rem;
874
- justify-content: space-between;
875
- gap: var(--rp-spacing-3);
876
- text-align: center;
877
- }
878
- .rp-range-slider--vertical .rp-range-slider__value[data-v-8dd81f55] {
879
- min-width: 3ch;
880
- text-align: right;
881
- }
882
- .rp-range-slider--vertical .rp-range-slider__track[data-v-8dd81f55] {
883
- width: var(--_rp-range-slider-thumb-size);
884
- height: var(--_rp-range-slider-track-length);
885
- min-width: 0;
886
- min-height: var(--_rp-range-slider-track-length);
887
- justify-self: center;
888
- }
889
- .rp-range-slider--vertical .rp-range-slider__bar[data-v-8dd81f55] {
890
- top: 0;
891
- left: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-track-height)) / 2);
892
- width: var(--_rp-range-slider-track-height);
893
- height: 100%;
894
- background: linear-gradient(to top, var(--_rp-range-slider-track-bg) 0 var(--_rp-range-slider-lower-fill-position), var(--_rp-range-slider-color) var(--_rp-range-slider-lower-fill-position) var(--_rp-range-slider-upper-fill-position), var(--_rp-range-slider-track-bg) var(--_rp-range-slider-upper-fill-position) 100%);
895
- }
896
- .rp-range-slider--vertical.rp-range-slider--marks-with-labels .rp-range-slider__track[data-v-8dd81f55] {
897
- padding-right: calc(var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
898
- padding-bottom: 0;
899
- }
900
- .rp-range-slider--vertical .rp-range-slider__native[data-v-8dd81f55] {
901
- width: var(--_rp-range-slider-thumb-size);
902
- min-width: 0;
903
- height: 100%;
904
- min-height: var(--_rp-range-slider-track-length);
905
- direction: rtl;
906
- writing-mode: vertical-lr;
907
- }
908
- .rp-range-slider--vertical .rp-range-slider__native[data-v-8dd81f55]::-webkit-slider-runnable-track {
909
- width: var(--_rp-range-slider-track-height);
910
- height: 100%;
911
- }
912
- .rp-range-slider--vertical .rp-range-slider__native[data-v-8dd81f55]::-moz-range-track, .rp-range-slider--vertical .rp-range-slider__native[data-v-8dd81f55]::-moz-range-progress {
913
- width: var(--_rp-range-slider-track-height);
914
- height: 100%;
915
- }
916
- .rp-range-slider--vertical .rp-range-slider__native[data-v-8dd81f55]::-webkit-slider-thumb {
917
- margin-top: 0;
918
- margin-left: calc((var(--_rp-range-slider-track-height) - var(--_rp-range-slider-thumb-size)) / 2);
919
- }
920
- .rp-range-slider--vertical .rp-range-slider__marks[data-v-8dd81f55] {
921
- top: calc(var(--_rp-range-slider-thumb-size) / 2);
922
- right: auto;
923
- bottom: calc(var(--_rp-range-slider-thumb-size) / 2);
924
- left: 0;
925
- width: var(--_rp-range-slider-thumb-size);
926
- height: auto;
927
- }
928
- .rp-range-slider--vertical .rp-range-slider__mark[data-v-8dd81f55] {
929
- top: calc(100% - var(--_rp-range-slider-mark-position));
930
- left: 0;
931
- flex-direction: row;
932
- align-items: center;
933
- transform: translateY(-50%);
934
- }
935
- .rp-range-slider--vertical .rp-range-slider__mark-dot[data-v-8dd81f55] {
936
- flex: 0 0 auto;
937
- margin-top: 0;
938
- margin-left: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2);
939
- }
940
- .rp-range-slider--vertical .rp-range-slider__mark-label[data-v-8dd81f55] {
941
- margin-top: 0;
942
- margin-left: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2 + var(--rp-spacing-1));
943
- text-align: left;
944
- }
945
- .rp-range-slider--vertical .rp-range-slider__thumbs[data-v-8dd81f55] {
946
- top: calc(var(--_rp-range-slider-thumb-size) / 2);
947
- right: auto;
948
- bottom: calc(var(--_rp-range-slider-thumb-size) / 2);
949
- left: 0;
950
- width: var(--_rp-range-slider-thumb-size);
951
- height: auto;
952
- }
953
- .rp-range-slider--vertical .rp-range-slider__thumb[data-v-8dd81f55] {
954
- top: calc(100% - var(--_rp-range-slider-thumb-percent));
955
- left: 0;
956
- width: var(--_rp-range-slider-thumb-size);
957
- height: 0;
958
- }
959
- .rp-range-slider--vertical .rp-range-slider__thumb-content[data-v-8dd81f55] {
960
- top: 0;
961
- left: 50%;
962
- }
963
- .rp-range-slider--tooltip-always-visible:has(.rp-range-slider__tooltips--placement-top) .rp-range-slider__track[data-v-8dd81f55] {
964
- margin-top: var(--_rp-range-slider-tooltip-reserved-space);
965
- }
966
- .rp-range-slider--tooltip-always-visible:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__track[data-v-8dd81f55] {
967
- margin-right: var(--_rp-range-slider-tooltip-reserved-space);
968
- }
969
- .rp-range-slider--tooltip-always-visible:has(.rp-range-slider__tooltips--placement-bottom) .rp-range-slider__track[data-v-8dd81f55] {
970
- margin-bottom: var(--_rp-range-slider-tooltip-reserved-space);
971
- }
972
- .rp-range-slider--tooltip-always-visible:has(.rp-range-slider__tooltips--placement-left) .rp-range-slider__track[data-v-8dd81f55] {
973
- margin-left: var(--_rp-range-slider-tooltip-reserved-space);
974
- }
975
- .rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:not(.rp-range-slider--vertical):has(.rp-range-slider__tooltips--placement-bottom) .rp-range-slider__track[data-v-8dd81f55] {
976
- padding-bottom: calc(var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2) + var(--_rp-range-slider-tooltip-reserved-space));
977
- margin-bottom: 0;
978
- }
979
- .rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:not(.rp-range-slider--vertical):has(.rp-range-slider__tooltips--placement-bottom) .rp-range-slider__mark-label[data-v-8dd81f55] {
980
- margin-top: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2 + var(--rp-spacing-1) + var(--_rp-range-slider-tooltip-reserved-space));
981
- }
982
- .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__track[data-v-8dd81f55] {
983
- padding-right: 0;
984
- margin-left: calc(var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
985
- }
986
- .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__mark[data-v-8dd81f55] {
987
- left: calc((var(--_rp-range-slider-thumb-size) + var(--_rp-range-slider-mark-size)) / 2);
988
- flex-direction: row-reverse;
989
- gap: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2 + var(--rp-spacing-1));
990
- transform: translate(-100%, -50%);
991
- }
992
- .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__mark-dot[data-v-8dd81f55], .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__mark-label[data-v-8dd81f55] {
993
- margin-left: 0;
994
- }
995
- .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__mark-label[data-v-8dd81f55] {
996
- text-align: right;
997
- }
998
- .rp-range-slider--size-xs[data-v-8dd81f55] {
999
- --_rp-range-slider-track-height: 4px;
1000
- --_rp-range-slider-thumb-size: 8px;
1001
- --_rp-range-slider-thumb-border-width: 4px;
1002
- --_rp-range-slider-font-size: var(--rp-font-size-xs);
1003
- --_rp-range-slider-mark-size: 4px;
1004
- }
1005
- .rp-range-slider--size-sm[data-v-8dd81f55] {
1006
- --_rp-range-slider-track-height: 6px;
1007
- --_rp-range-slider-thumb-size: 12px;
1008
- --_rp-range-slider-thumb-border-width: 3px;
1009
- --_rp-range-slider-font-size: var(--rp-font-size-sm);
1010
- --_rp-range-slider-mark-size: 4px;
1011
- }
1012
- .rp-range-slider--size-md[data-v-8dd81f55] {
1013
- --_rp-range-slider-track-height: 8px;
1014
- --_rp-range-slider-thumb-size: 16px;
1015
- --_rp-range-slider-thumb-border-width: 4px;
1016
- --_rp-range-slider-font-size: var(--rp-font-size-md);
1017
- --_rp-range-slider-mark-size: 4px;
1018
- }
1019
- .rp-range-slider--size-lg[data-v-8dd81f55] {
1020
- --_rp-range-slider-track-height: 10px;
1021
- --_rp-range-slider-thumb-size: 20px;
1022
- --_rp-range-slider-thumb-border-width: 5px;
1023
- --_rp-range-slider-font-size: var(--rp-font-size-lg);
1024
- --_rp-range-slider-mark-size: 5px;
1025
- }
1026
- .rp-range-slider--size-xl[data-v-8dd81f55] {
1027
- --_rp-range-slider-track-height: 12px;
1028
- --_rp-range-slider-thumb-size: 24px;
1029
- --_rp-range-slider-thumb-border-width: 6px;
1030
- --_rp-range-slider-font-size: var(--rp-font-size-xl);
1031
- --_rp-range-slider-mark-size: 6px;
1
+ @layer ropav.components {
2
+ .rp-slider[data-v-a837ba72] {
3
+ --_rp-slider-color: var(--rp-color-control-selected-bg);
4
+ --_rp-slider-track-bg: var(--rp-color-control-track-bg);
5
+ --_rp-slider-thumb-bg: var(--rp-color-control-thumb-bg);
6
+ --_rp-slider-thumb-border: var(--_rp-slider-color);
7
+ --_rp-slider-thumb-border-style: var(--_rp-slider-thumb-border-width) solid
8
+ var(--_rp-slider-thumb-border);
9
+ --_rp-slider-default-thumb-padding: 0;
10
+ --_rp-slider-default-track-length: 160px;
11
+ --_rp-slider-default-track-height: 8px;
12
+ --_rp-slider-default-thumb-size: 16px;
13
+ --_rp-slider-default-thumb-border-width: 4px;
14
+ --_rp-slider-font-size: var(--rp-font-size-md);
15
+ --_rp-slider-default-mark-size: 4px;
16
+ --_rp-slider-thumb-padding: var(
17
+ --rp-slider-thumb-padding,
18
+ var(--_rp-slider-default-thumb-padding)
19
+ );
20
+ --_rp-slider-track-length: var(
21
+ --rp-slider-track-length,
22
+ var(--_rp-slider-default-track-length)
23
+ );
24
+ --_rp-slider-track-height: var(
25
+ --rp-slider-track-thickness,
26
+ var(--_rp-slider-default-track-height)
27
+ );
28
+ --_rp-slider-thumb-size: var(
29
+ --rp-slider-thumb-size,
30
+ var(--_rp-slider-default-thumb-size)
31
+ );
32
+ --_rp-slider-thumb-border-width: var(
33
+ --rp-slider-thumb-border-width,
34
+ var(--_rp-slider-default-thumb-border-width)
35
+ );
36
+ --_rp-slider-mark-size: var(--rp-slider-mark-size, var(--_rp-slider-default-mark-size));
37
+ --_rp-slider-mark-color: var(--rp-color-control-thumb-bg);
38
+ --_rp-slider-mark-label-color: var(--rp-color-dimmed);
39
+ --_rp-slider-mark-filled-label-color: var(--rp-color-text);
40
+ --_rp-slider-mark-ring-color: var(--_rp-slider-color);
41
+ --_rp-slider-invalid-ring: color-mix(in srgb, var(--rp-color-red-filled) 48%, transparent);
42
+ --_rp-slider-ratio: 0;
43
+ --_rp-slider-fill-position: calc(
44
+ var(--_rp-slider-thumb-size) / 2 + (100% - var(--_rp-slider-thumb-size)) *
45
+ var(--_rp-slider-ratio)
46
+ );
47
+ display: inline-grid;
48
+ width: 100%;
49
+ min-width: var(--_rp-slider-track-length);
50
+ max-width: 100%;
51
+ gap: var(--rp-spacing-2);
52
+ cursor: pointer;
53
+ font-family: var(--rp-font-family);
54
+ font-size: var(--_rp-slider-font-size);
55
+ line-height: var(--rp-line-height-md);
56
+ }
57
+ html.dark .rp-slider[data-v-a837ba72], [data-rp-color-scheme=dark] .rp-slider[data-v-a837ba72] {
58
+ --_rp-slider-thumb-bg: var(--_rp-slider-color);
59
+ --_rp-slider-thumb-border: var(--rp-color-control-thumb-bg);
60
+ }
61
+ .rp-slider--custom-thumb[data-v-a837ba72] {
62
+ --_rp-slider-thumb-bg: var(--_rp-slider-color);
63
+ --_rp-slider-thumb-border: var(--rp-color-control-thumb-bg);
64
+ }
65
+ .rp-slider--disabled[data-v-a837ba72] {
66
+ opacity: var(--rp-opacity-disabled);
67
+ cursor: not-allowed;
68
+ }
69
+ .rp-slider--invalid .rp-slider__bar[data-v-a837ba72] {
70
+ box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-slider-invalid-ring);
71
+ }
72
+ .rp-slider__header[data-v-a837ba72] {
73
+ display: flex;
74
+ align-items: center;
75
+ justify-content: space-between;
76
+ min-width: 0;
77
+ gap: var(--rp-spacing-3);
78
+ }
79
+ .rp-slider__label[data-v-a837ba72] {
80
+ min-width: 0;
81
+ color: var(--rp-color-text);
82
+ }
83
+ .rp-slider__value[data-v-a837ba72] {
84
+ flex-shrink: 0;
85
+ color: var(--rp-color-dimmed);
86
+ font-variant-numeric: tabular-nums;
87
+ }
88
+ .rp-slider__track[data-v-a837ba72] {
89
+ position: relative;
90
+ display: block;
91
+ min-width: 0;
92
+ }
93
+ .rp-slider__bar[data-v-a837ba72] {
94
+ position: absolute;
95
+ z-index: 1;
96
+ top: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-track-height)) / 2);
97
+ left: 0;
98
+ display: block;
99
+ width: 100%;
100
+ height: var(--_rp-slider-track-height);
101
+ pointer-events: none;
102
+ background: linear-gradient(to right, var(--_rp-slider-color) 0 var(--_rp-slider-fill-position), var(--_rp-slider-track-bg) var(--_rp-slider-fill-position) 100%);
103
+ border-radius: var(--rp-radius-full);
104
+ }
105
+ .rp-slider--marks-with-labels .rp-slider__track[data-v-a837ba72] {
106
+ padding-bottom: calc(var(--_rp-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
107
+ }
108
+ .rp-slider__native[data-v-a837ba72] {
109
+ position: relative;
110
+ z-index: 3;
111
+ display: block;
112
+ width: 100%;
113
+ min-width: 0;
114
+ height: var(--_rp-slider-thumb-size);
115
+ padding: 0;
116
+ margin: 0;
117
+ appearance: none;
118
+ background: transparent;
119
+ cursor: pointer;
120
+ outline: none;
121
+ }
122
+ .rp-slider__marks[data-v-a837ba72] {
123
+ position: absolute;
124
+ z-index: 2;
125
+ top: 0;
126
+ right: calc(var(--_rp-slider-thumb-size) / 2);
127
+ left: calc(var(--_rp-slider-thumb-size) / 2);
128
+ height: var(--_rp-slider-thumb-size);
129
+ pointer-events: none;
130
+ }
131
+ .rp-slider__mark[data-v-a837ba72] {
132
+ position: absolute;
133
+ top: 0;
134
+ left: var(--_rp-slider-mark-position);
135
+ display: inline-flex;
136
+ flex-direction: column;
137
+ align-items: center;
138
+ width: max-content;
139
+ max-width: 8rem;
140
+ color: var(--_rp-slider-mark-label-color);
141
+ line-height: var(--rp-line-height-md);
142
+ transform: translateX(-50%);
143
+ }
144
+ .rp-slider__mark-dot[data-v-a837ba72] {
145
+ width: var(--_rp-slider-mark-size);
146
+ height: var(--_rp-slider-mark-size);
147
+ margin-top: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-mark-size)) / 2);
148
+ background: var(--_rp-slider-mark-color);
149
+ border-radius: var(--rp-radius-full);
150
+ box-shadow: 0 0 0 var(--rp-border-width-thin) transparent;
151
+ transition: box-shadow var(--rp-transition-fast);
152
+ }
153
+ .rp-slider__mark-label[data-v-a837ba72] {
154
+ max-width: 100%;
155
+ margin-top: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-mark-size)) / 2 + var(--rp-spacing-1));
156
+ overflow-wrap: anywhere;
157
+ color: inherit;
158
+ font-size: var(--_rp-slider-font-size);
159
+ text-align: center;
160
+ font-variant-numeric: tabular-nums;
161
+ }
162
+ .rp-slider__mark--filled .rp-slider__mark-dot[data-v-a837ba72] {
163
+ box-shadow: 0 0 0 var(--rp-border-width-thin) var(--_rp-slider-mark-ring-color);
164
+ }
165
+ .rp-slider__mark--filled .rp-slider__mark-label[data-v-a837ba72] {
166
+ color: var(--_rp-slider-mark-filled-label-color);
167
+ }
168
+ .rp-slider__thumb[data-v-a837ba72] {
169
+ position: absolute;
170
+ z-index: 4;
171
+ top: 0;
172
+ right: calc(var(--_rp-slider-thumb-size) / 2);
173
+ left: calc(var(--_rp-slider-thumb-size) / 2);
174
+ height: var(--_rp-slider-thumb-size);
175
+ pointer-events: none;
176
+ }
177
+ .rp-slider__thumb-content[data-v-a837ba72] {
178
+ position: absolute;
179
+ top: 50%;
180
+ left: var(--_rp-slider-percent);
181
+ display: inline-flex;
182
+ align-items: center;
183
+ justify-content: center;
184
+ width: var(--_rp-slider-thumb-size);
185
+ height: var(--_rp-slider-thumb-size);
186
+ box-sizing: border-box;
187
+ overflow: hidden;
188
+ padding: var(--_rp-slider-thumb-padding);
189
+ color: var(--_rp-slider-thumb-border);
190
+ background: var(--_rp-slider-thumb-bg);
191
+ border: var(--_rp-slider-thumb-border-style);
192
+ border-radius: var(--rp-radius-full);
193
+ box-shadow: var(--rp-shadow-sm);
194
+ transform: translate(-50%, -50%);
195
+ transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
196
+ }
197
+ .rp-slider__thumb-content[data-v-a837ba72] svg {
198
+ width: 60%;
199
+ height: 60%;
200
+ }
201
+ .rp-slider__tooltip[data-v-a837ba72] {
202
+ position: absolute;
203
+ z-index: 5;
204
+ top: 0;
205
+ left: var(--_rp-slider-fill-position);
206
+ width: var(--_rp-slider-thumb-size);
207
+ height: var(--_rp-slider-thumb-size);
208
+ pointer-events: none;
209
+ translate: -50% 0;
210
+ }
211
+ .rp-slider__tooltip-anchor[data-v-a837ba72] {
212
+ display: block;
213
+ width: 100%;
214
+ height: 100%;
215
+ }
216
+ .rp-tooltip__content.rp-slider__tooltip-content {
217
+ min-width: 2rem;
218
+ max-width: min(12rem, 100vw - var(--rp-spacing-6));
219
+ padding: var(--rp-spacing-1) var(--rp-spacing-2);
220
+ white-space: nowrap;
221
+ font-variant-numeric: tabular-nums;
222
+ }
223
+ .rp-slider__native[data-v-a837ba72]:disabled {
224
+ cursor: not-allowed;
225
+ }
226
+ .rp-slider__native[data-v-a837ba72]::-webkit-slider-runnable-track {
227
+ height: var(--_rp-slider-track-height);
228
+ border-radius: var(--rp-radius-full);
229
+ background: transparent;
230
+ }
231
+ .rp-slider__native[data-v-a837ba72]::-moz-range-track {
232
+ height: var(--_rp-slider-track-height);
233
+ border-radius: var(--rp-radius-full);
234
+ background: transparent;
235
+ }
236
+ .rp-slider__native[data-v-a837ba72]::-moz-range-progress {
237
+ height: var(--_rp-slider-track-height);
238
+ border-radius: var(--rp-radius-full);
239
+ background: transparent;
240
+ }
241
+ .rp-slider__native[data-v-a837ba72]::-webkit-slider-thumb {
242
+ width: var(--_rp-slider-thumb-size);
243
+ height: var(--_rp-slider-thumb-size);
244
+ margin-top: calc((var(--_rp-slider-track-height) - var(--_rp-slider-thumb-size)) / 2);
245
+ box-sizing: border-box;
246
+ appearance: none;
247
+ background: var(--_rp-slider-thumb-bg);
248
+ border: var(--_rp-slider-thumb-border-style);
249
+ border-radius: var(--rp-radius-full);
250
+ box-shadow: var(--rp-shadow-sm);
251
+ transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
252
+ }
253
+ .rp-slider__native[data-v-a837ba72]::-moz-range-thumb {
254
+ width: var(--_rp-slider-thumb-size);
255
+ height: var(--_rp-slider-thumb-size);
256
+ box-sizing: border-box;
257
+ background: var(--_rp-slider-thumb-bg);
258
+ border: var(--_rp-slider-thumb-border-style);
259
+ border-radius: var(--rp-radius-full);
260
+ box-shadow: var(--rp-shadow-sm);
261
+ transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
262
+ }
263
+ .rp-slider--vertical[data-v-a837ba72] {
264
+ width: max-content;
265
+ min-width: 0;
266
+ max-width: none;
267
+ justify-items: center;
268
+ }
269
+ .rp-slider--vertical .rp-slider__header[data-v-a837ba72] {
270
+ width: max-content;
271
+ max-width: 12rem;
272
+ justify-content: space-between;
273
+ gap: var(--rp-spacing-3);
274
+ text-align: center;
275
+ }
276
+ .rp-slider--vertical .rp-slider__value[data-v-a837ba72] {
277
+ min-width: 3ch;
278
+ text-align: right;
279
+ }
280
+ .rp-slider--vertical .rp-slider__track[data-v-a837ba72] {
281
+ width: var(--_rp-slider-thumb-size);
282
+ height: var(--_rp-slider-track-length);
283
+ min-width: 0;
284
+ min-height: var(--_rp-slider-track-length);
285
+ justify-self: center;
286
+ }
287
+ .rp-slider--vertical .rp-slider__bar[data-v-a837ba72] {
288
+ top: 0;
289
+ left: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-track-height)) / 2);
290
+ width: var(--_rp-slider-track-height);
291
+ height: 100%;
292
+ background: linear-gradient(to top, var(--_rp-slider-color) 0 var(--_rp-slider-fill-position), var(--_rp-slider-track-bg) var(--_rp-slider-fill-position) 100%);
293
+ }
294
+ .rp-slider--vertical.rp-slider--marks-with-labels .rp-slider__track[data-v-a837ba72] {
295
+ padding-right: calc(var(--_rp-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
296
+ padding-bottom: 0;
297
+ }
298
+ .rp-slider--vertical .rp-slider__native[data-v-a837ba72] {
299
+ width: var(--_rp-slider-thumb-size);
300
+ min-width: 0;
301
+ height: 100%;
302
+ min-height: var(--_rp-slider-track-length);
303
+ direction: rtl;
304
+ writing-mode: vertical-lr;
305
+ }
306
+ .rp-slider--vertical .rp-slider__marks[data-v-a837ba72] {
307
+ top: calc(var(--_rp-slider-thumb-size) / 2);
308
+ right: auto;
309
+ bottom: calc(var(--_rp-slider-thumb-size) / 2);
310
+ left: 0;
311
+ width: var(--_rp-slider-thumb-size);
312
+ height: auto;
313
+ }
314
+ .rp-slider--vertical .rp-slider__mark[data-v-a837ba72] {
315
+ top: calc(100% - var(--_rp-slider-mark-position));
316
+ left: 0;
317
+ flex-direction: row;
318
+ align-items: center;
319
+ transform: translateY(-50%);
320
+ }
321
+ .rp-slider--vertical .rp-slider__mark-dot[data-v-a837ba72] {
322
+ flex: 0 0 auto;
323
+ margin-top: 0;
324
+ margin-left: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-mark-size)) / 2);
325
+ }
326
+ .rp-slider--vertical .rp-slider__mark-label[data-v-a837ba72] {
327
+ margin-top: 0;
328
+ margin-left: calc((var(--_rp-slider-thumb-size) - var(--_rp-slider-mark-size)) / 2 + var(--rp-spacing-1));
329
+ text-align: left;
330
+ }
331
+ .rp-slider--vertical .rp-slider__thumb[data-v-a837ba72] {
332
+ top: calc(var(--_rp-slider-thumb-size) / 2);
333
+ right: auto;
334
+ bottom: calc(var(--_rp-slider-thumb-size) / 2);
335
+ left: 0;
336
+ width: var(--_rp-slider-thumb-size);
337
+ height: auto;
338
+ }
339
+ .rp-slider--vertical .rp-slider__thumb-content[data-v-a837ba72] {
340
+ top: calc(100% - var(--_rp-slider-percent));
341
+ left: 50%;
342
+ }
343
+ .rp-slider--vertical .rp-slider__tooltip[data-v-a837ba72] {
344
+ top: calc(100% - var(--_rp-slider-fill-position));
345
+ left: 0;
346
+ translate: 0 -50%;
347
+ }
348
+ .rp-slider--vertical .rp-slider__native[data-v-a837ba72]::-webkit-slider-runnable-track {
349
+ width: var(--_rp-slider-track-height);
350
+ height: 100%;
351
+ background: transparent;
352
+ }
353
+ .rp-slider--vertical .rp-slider__native[data-v-a837ba72]::-moz-range-track {
354
+ width: var(--_rp-slider-track-height);
355
+ height: 100%;
356
+ }
357
+ .rp-slider--vertical .rp-slider__native[data-v-a837ba72]::-moz-range-progress {
358
+ width: var(--_rp-slider-track-height);
359
+ }
360
+ .rp-slider--vertical .rp-slider__native[data-v-a837ba72]::-webkit-slider-thumb {
361
+ margin-top: 0;
362
+ margin-left: calc((var(--_rp-slider-track-height) - var(--_rp-slider-thumb-size)) / 2);
363
+ }
364
+ .rp-slider--custom-thumb .rp-slider__native[data-v-a837ba72]::-webkit-slider-thumb {
365
+ opacity: 0;
366
+ }
367
+ .rp-slider--custom-thumb .rp-slider__native[data-v-a837ba72]::-moz-range-thumb {
368
+ opacity: 0;
369
+ }
370
+ .rp-slider__native[data-v-a837ba72]:focus-visible::-webkit-slider-thumb {
371
+ box-shadow: var(--rp-shadow-sm), 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
372
+ }
373
+ .rp-slider__native[data-v-a837ba72]:focus-visible::-moz-range-thumb {
374
+ box-shadow: var(--rp-shadow-sm), 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
375
+ }
376
+ .rp-slider--custom-thumb .rp-slider__native:focus-visible ~ .rp-slider__thumb .rp-slider__thumb-content[data-v-a837ba72] {
377
+ box-shadow: var(--rp-shadow-sm), 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
378
+ }
379
+ .rp-slider--size-xs[data-v-a837ba72] {
380
+ --_rp-slider-default-track-height: 4px;
381
+ --_rp-slider-default-thumb-size: 8px;
382
+ --_rp-slider-default-thumb-border-width: 4px;
383
+ --_rp-slider-font-size: var(--rp-font-size-xs);
384
+ --_rp-slider-default-mark-size: 4px;
385
+ }
386
+ .rp-slider--size-sm[data-v-a837ba72] {
387
+ --_rp-slider-default-track-height: 6px;
388
+ --_rp-slider-default-thumb-size: 12px;
389
+ --_rp-slider-default-thumb-border-width: 3px;
390
+ --_rp-slider-font-size: var(--rp-font-size-sm);
391
+ --_rp-slider-default-mark-size: 4px;
392
+ }
393
+ .rp-slider--size-md[data-v-a837ba72] {
394
+ --_rp-slider-default-track-height: 8px;
395
+ --_rp-slider-default-thumb-size: 16px;
396
+ --_rp-slider-default-thumb-border-width: 4px;
397
+ --_rp-slider-font-size: var(--rp-font-size-md);
398
+ --_rp-slider-default-mark-size: 4px;
399
+ }
400
+ .rp-slider--size-lg[data-v-a837ba72] {
401
+ --_rp-slider-default-track-height: 10px;
402
+ --_rp-slider-default-thumb-size: 20px;
403
+ --_rp-slider-default-thumb-border-width: 5px;
404
+ --_rp-slider-font-size: var(--rp-font-size-lg);
405
+ --_rp-slider-default-mark-size: 5px;
406
+ }
407
+ .rp-slider--size-xl[data-v-a837ba72] {
408
+ --_rp-slider-default-track-height: 12px;
409
+ --_rp-slider-default-thumb-size: 24px;
410
+ --_rp-slider-default-thumb-border-width: 6px;
411
+ --_rp-slider-font-size: var(--rp-font-size-xl);
412
+ --_rp-slider-default-mark-size: 6px;
413
+ }
414
+ }@layer ropav.components {
415
+ .rp-tooltip[data-v-ce70c540] {
416
+ position: relative;
417
+ display: inline-flex;
418
+ font-family: var(--rp-font-family);
419
+ vertical-align: middle;
420
+ }
421
+ .rp-tooltip__content[data-v-ce70c540] {
422
+ --_rp-tooltip-main-axis-offset: var(--rp-spacing-2);
423
+ --_rp-tooltip-cross-axis-offset: 0px;
424
+ --_rp-tooltip-arrow-size: 0.4375rem;
425
+ --_rp-tooltip-bg: var(--rp-color-bright);
426
+ --_rp-tooltip-fg: var(--rp-color-default);
427
+ position: absolute;
428
+ z-index: 1000;
429
+ box-sizing: border-box;
430
+ width: max-content;
431
+ max-width: min(18rem, 100vw - var(--rp-spacing-6));
432
+ padding: 0.375rem 0.625rem;
433
+ color: var(--_rp-tooltip-fg);
434
+ font-size: 0.8125rem;
435
+ font-weight: var(--rp-font-weight-medium);
436
+ line-height: var(--rp-line-height-md);
437
+ text-align: center;
438
+ white-space: normal;
439
+ overflow-wrap: anywhere;
440
+ pointer-events: none;
441
+ background-color: var(--_rp-tooltip-bg);
442
+ border-radius: var(--rp-radius-sm);
443
+ box-shadow: var(--rp-shadow-md);
444
+ }
445
+ .rp-tooltip--target[data-v-ce70c540] {
446
+ display: contents;
447
+ }
448
+ .rp-tooltip__arrow[data-v-ce70c540] {
449
+ position: absolute;
450
+ width: var(--_rp-tooltip-arrow-size);
451
+ height: var(--_rp-tooltip-arrow-size);
452
+ pointer-events: none;
453
+ background-color: inherit;
454
+ rotate: 45deg;
455
+ }
456
+ .rp-tooltip__arrow[data-side=top][data-v-ce70c540] {
457
+ bottom: calc(-1 * var(--_rp-tooltip-arrow-size) / 2);
458
+ }
459
+ .rp-tooltip__arrow[data-side=right][data-v-ce70c540] {
460
+ left: calc(-1 * var(--_rp-tooltip-arrow-size) / 2);
461
+ }
462
+ .rp-tooltip__arrow[data-side=bottom][data-v-ce70c540] {
463
+ top: calc(-1 * var(--_rp-tooltip-arrow-size) / 2);
464
+ }
465
+ .rp-tooltip__arrow[data-side=left][data-v-ce70c540] {
466
+ right: calc(-1 * var(--_rp-tooltip-arrow-size) / 2);
467
+ }
468
+ .rp-tooltip-content-enter-active[data-v-ce70c540],
469
+ .rp-tooltip-content-leave-active[data-v-ce70c540] {
470
+ transition: opacity var(--rp-transition-fast);
471
+ }
472
+ .rp-tooltip-content-enter-from[data-v-ce70c540],
473
+ .rp-tooltip-content-leave-to[data-v-ce70c540] {
474
+ opacity: 0;
475
+ }
476
+ }@layer ropav.components {
477
+ .rp-range-slider__tooltips[data-v-ce70c540] {
478
+ position: absolute;
479
+ z-index: 5;
480
+ inset: 0;
481
+ pointer-events: none;
482
+ }
483
+ .rp-range-slider__tooltip[data-v-ce70c540] {
484
+ --_rp-range-slider-tooltip-translate-x: -50%;
485
+ --_rp-range-slider-tooltip-translate-y: 0%;
486
+ position: absolute;
487
+ z-index: 5;
488
+ top: 0;
489
+ width: var(--_rp-range-slider-thumb-size);
490
+ height: var(--_rp-range-slider-thumb-size);
491
+ opacity: 1;
492
+ pointer-events: none;
493
+ translate: var(--_rp-range-slider-tooltip-translate-x) var(--_rp-range-slider-tooltip-translate-y);
494
+ }
495
+ .rp-range-slider__tooltip--lower[data-v-ce70c540] {
496
+ left: var(--_rp-range-slider-lower-percent);
497
+ }
498
+ .rp-range-slider__tooltip--upper[data-v-ce70c540] {
499
+ left: var(--_rp-range-slider-upper-percent);
500
+ }
501
+ .rp-range-slider__tooltip--merged[data-v-ce70c540] {
502
+ left: var(--_rp-range-slider-tooltip-merged-percent);
503
+ opacity: 0;
504
+ }
505
+ .rp-range-slider__tooltip .rp-tooltip__content[data-v-ce70c540] {
506
+ max-width: min(12rem, 100vw - var(--rp-spacing-6));
507
+ padding: var(--rp-spacing-1) var(--rp-spacing-2);
508
+ white-space: nowrap;
509
+ font-variant-numeric: tabular-nums;
510
+ }
511
+ .rp-range-slider__tooltip.rp-tooltip--placement-top .rp-tooltip__content[data-v-ce70c540] {
512
+ bottom: calc(100% + var(--_rp-tooltip-main-axis-offset));
513
+ left: calc(50% + var(--_rp-tooltip-cross-axis-offset));
514
+ translate: -50% 0;
515
+ }
516
+ .rp-range-slider__tooltip.rp-tooltip--placement-right .rp-tooltip__content[data-v-ce70c540] {
517
+ top: calc(50% + var(--_rp-tooltip-cross-axis-offset));
518
+ left: calc(100% + var(--_rp-tooltip-main-axis-offset));
519
+ translate: 0 -50%;
520
+ }
521
+ .rp-range-slider__tooltip.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-ce70c540] {
522
+ top: calc(100% + var(--_rp-tooltip-main-axis-offset));
523
+ left: calc(50% + var(--_rp-tooltip-cross-axis-offset));
524
+ translate: -50% 0;
525
+ }
526
+ .rp-range-slider__tooltip.rp-tooltip--placement-left .rp-tooltip__content[data-v-ce70c540] {
527
+ top: calc(50% + var(--_rp-tooltip-cross-axis-offset));
528
+ right: calc(100% + var(--_rp-tooltip-main-axis-offset));
529
+ translate: 0 -50%;
530
+ }
531
+ .rp-range-slider__tooltip.rp-tooltip--arrow .rp-tooltip__content[data-v-ce70c540]::before {
532
+ position: absolute;
533
+ width: var(--_rp-tooltip-arrow-size);
534
+ height: var(--_rp-tooltip-arrow-size);
535
+ content: "";
536
+ background-color: inherit;
537
+ rotate: 45deg;
538
+ }
539
+ .rp-range-slider__tooltip.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-ce70c540]::before {
540
+ top: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
541
+ left: 50%;
542
+ translate: -50% 0;
543
+ }
544
+ .rp-range-slider__tooltip.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-ce70c540]::before {
545
+ top: 50%;
546
+ right: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
547
+ translate: 0 -50%;
548
+ }
549
+ .rp-range-slider__tooltip.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-ce70c540]::before {
550
+ bottom: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
551
+ left: 50%;
552
+ translate: -50% 0;
553
+ }
554
+ .rp-range-slider__tooltip.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-ce70c540]::before {
555
+ top: 50%;
556
+ left: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
557
+ translate: 0 -50%;
558
+ }
559
+ .rp-range-slider__tooltip-anchor[data-v-ce70c540] {
560
+ display: block;
561
+ width: 100%;
562
+ height: 100%;
563
+ }
564
+ .rp-range-slider__tooltip-merged-separator[data-v-ce70c540] {
565
+ margin-inline: var(--rp-spacing-1);
566
+ opacity: 0.64;
567
+ }
568
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow .rp-tooltip__content[data-v-ce70c540]::before,
569
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow .rp-tooltip__content[data-v-ce70c540]::after {
570
+ position: absolute;
571
+ width: var(--_rp-tooltip-arrow-size);
572
+ height: var(--_rp-tooltip-arrow-size);
573
+ content: "";
574
+ background-color: inherit;
575
+ rotate: 45deg;
576
+ }
577
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-ce70c540], .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-ce70c540] {
578
+ min-width: var(--_rp-range-slider-tooltip-merged-min-size, 0px);
579
+ }
580
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-ce70c540]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-ce70c540]::before {
581
+ left: calc(50% - var(--_rp-range-slider-tooltip-merged-arrow-offset, 0px));
582
+ translate: -50% 0;
583
+ }
584
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-ce70c540]::after, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-ce70c540]::after {
585
+ left: calc(50% + var(--_rp-range-slider-tooltip-merged-arrow-offset, 0px));
586
+ translate: -50% 0;
587
+ }
588
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-ce70c540]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-top .rp-tooltip__content[data-v-ce70c540]::after {
589
+ top: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
590
+ }
591
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-ce70c540]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-bottom .rp-tooltip__content[data-v-ce70c540]::after {
592
+ bottom: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
593
+ }
594
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-ce70c540], .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-ce70c540] {
595
+ min-height: var(--_rp-range-slider-tooltip-merged-min-size, 0px);
596
+ }
597
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-ce70c540]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-ce70c540]::before {
598
+ top: calc(50% + var(--_rp-range-slider-tooltip-merged-arrow-offset, 0px));
599
+ translate: 0 -50%;
600
+ }
601
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-ce70c540]::after, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-ce70c540]::after {
602
+ top: calc(50% - var(--_rp-range-slider-tooltip-merged-arrow-offset, 0px));
603
+ translate: 0 -50%;
604
+ }
605
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-ce70c540]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-left .rp-tooltip__content[data-v-ce70c540]::after {
606
+ left: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
607
+ }
608
+ .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-ce70c540]::before, .rp-range-slider__tooltip--merged.rp-tooltip--arrow.rp-tooltip--placement-right .rp-tooltip__content[data-v-ce70c540]::after {
609
+ right: calc(100% - var(--_rp-tooltip-arrow-size) / 2);
610
+ }
611
+ .rp-range-slider__tooltips--overlapping .rp-range-slider__tooltip--lower[data-v-ce70c540],
612
+ .rp-range-slider__tooltips--overlapping .rp-range-slider__tooltip--upper[data-v-ce70c540] {
613
+ opacity: 0;
614
+ }
615
+ .rp-range-slider__tooltips--overlapping .rp-range-slider__tooltip--merged[data-v-ce70c540] {
616
+ opacity: 1;
617
+ }
618
+ .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip[data-v-ce70c540] {
619
+ --_rp-range-slider-tooltip-translate-x: 0%;
620
+ --_rp-range-slider-tooltip-translate-y: -50%;
621
+ top: auto;
622
+ left: 0;
623
+ }
624
+ .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip--lower[data-v-ce70c540] {
625
+ top: calc(100% - var(--_rp-range-slider-lower-percent));
626
+ }
627
+ .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip--upper[data-v-ce70c540] {
628
+ top: calc(100% - var(--_rp-range-slider-upper-percent));
629
+ }
630
+ .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip--merged[data-v-ce70c540] {
631
+ top: calc(100% - var(--_rp-range-slider-tooltip-merged-percent));
632
+ }
633
+ .rp-range-slider__tooltips--vertical .rp-range-slider__tooltip--merged .rp-tooltip__content[data-v-ce70c540] {
634
+ display: flex;
635
+ flex-direction: column;
636
+ align-items: center;
637
+ justify-content: center;
638
+ }
639
+ }@layer ropav.components {
640
+ .rp-range-slider[data-v-b0e2c3da] {
641
+ --_rp-range-slider-color: var(--rp-color-control-selected-bg);
642
+ --_rp-range-slider-track-bg: var(--rp-color-control-track-bg);
643
+ --_rp-range-slider-thumb-bg: var(--rp-color-control-thumb-bg);
644
+ --_rp-range-slider-thumb-border: var(--_rp-range-slider-color);
645
+ --_rp-range-slider-thumb-border-style: var(--_rp-range-slider-thumb-border-width) solid
646
+ var(--_rp-range-slider-thumb-border);
647
+ --_rp-range-slider-default-thumb-padding: 0;
648
+ --_rp-range-slider-default-track-length: 160px;
649
+ --_rp-range-slider-default-track-height: 8px;
650
+ --_rp-range-slider-default-thumb-size: 16px;
651
+ --_rp-range-slider-default-thumb-border-width: 4px;
652
+ --_rp-range-slider-font-size: var(--rp-font-size-md);
653
+ --_rp-range-slider-default-mark-size: 4px;
654
+ --_rp-range-slider-thumb-padding: var(
655
+ --rp-slider-thumb-padding,
656
+ var(--_rp-range-slider-default-thumb-padding)
657
+ );
658
+ --_rp-range-slider-track-length: var(
659
+ --rp-slider-track-length,
660
+ var(--_rp-range-slider-default-track-length)
661
+ );
662
+ --_rp-range-slider-track-height: var(
663
+ --rp-slider-track-thickness,
664
+ var(--_rp-range-slider-default-track-height)
665
+ );
666
+ --_rp-range-slider-thumb-size: var(
667
+ --rp-slider-thumb-size,
668
+ var(--_rp-range-slider-default-thumb-size)
669
+ );
670
+ --_rp-range-slider-thumb-border-width: var(
671
+ --rp-slider-thumb-border-width,
672
+ var(--_rp-range-slider-default-thumb-border-width)
673
+ );
674
+ --_rp-range-slider-mark-size: var(--rp-slider-mark-size, var(--_rp-range-slider-default-mark-size));
675
+ --_rp-range-slider-mark-color: var(--rp-color-control-thumb-bg);
676
+ --_rp-range-slider-mark-label-color: var(--rp-color-dimmed);
677
+ --_rp-range-slider-mark-filled-label-color: var(--rp-color-text);
678
+ --_rp-range-slider-mark-ring-color: var(--_rp-range-slider-color);
679
+ --_rp-range-slider-invalid-ring: color-mix(in srgb, var(--rp-color-red-filled) 48%, transparent);
680
+ --_rp-range-slider-lower-percent: 0%;
681
+ --_rp-range-slider-upper-percent: 100%;
682
+ --_rp-range-slider-lower-ratio: 0;
683
+ --_rp-range-slider-upper-ratio: 1;
684
+ --_rp-range-slider-tooltip-merged-percent: 50%;
685
+ --_rp-range-slider-lower-fill-position: calc(
686
+ var(--_rp-range-slider-thumb-size) / 2 + (100% - var(--_rp-range-slider-thumb-size)) *
687
+ var(--_rp-range-slider-lower-ratio)
688
+ );
689
+ --_rp-range-slider-upper-fill-position: calc(
690
+ var(--_rp-range-slider-thumb-size) / 2 + (100% - var(--_rp-range-slider-thumb-size)) *
691
+ var(--_rp-range-slider-upper-ratio)
692
+ );
693
+ --_rp-range-slider-tooltip-reserved-space: calc(
694
+ var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-4)
695
+ );
696
+ box-sizing: border-box;
697
+ display: inline-grid;
698
+ width: 100%;
699
+ min-width: var(--_rp-range-slider-track-length);
700
+ max-width: 100%;
701
+ gap: var(--rp-spacing-2);
702
+ cursor: pointer;
703
+ font-family: var(--rp-font-family);
704
+ font-size: var(--_rp-range-slider-font-size);
705
+ line-height: var(--rp-line-height-md);
706
+ }
707
+ html.dark .rp-range-slider[data-v-b0e2c3da], [data-rp-color-scheme=dark] .rp-range-slider[data-v-b0e2c3da] {
708
+ --_rp-range-slider-thumb-bg: var(--_rp-range-slider-color);
709
+ --_rp-range-slider-thumb-border: var(--rp-color-control-thumb-bg);
710
+ }
711
+ .rp-range-slider--custom-thumb[data-v-b0e2c3da] {
712
+ --_rp-range-slider-thumb-bg: var(--_rp-range-slider-color);
713
+ --_rp-range-slider-thumb-border: var(--rp-color-control-thumb-bg);
714
+ }
715
+ .rp-range-slider--disabled[data-v-b0e2c3da] {
716
+ opacity: var(--rp-opacity-disabled);
717
+ cursor: not-allowed;
718
+ }
719
+ .rp-range-slider--invalid .rp-range-slider__bar[data-v-b0e2c3da] {
720
+ box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-range-slider-invalid-ring);
721
+ }
722
+ .rp-range-slider__header[data-v-b0e2c3da] {
723
+ display: flex;
724
+ align-items: center;
725
+ justify-content: space-between;
726
+ min-width: 0;
727
+ gap: var(--rp-spacing-3);
728
+ }
729
+ .rp-range-slider__label[data-v-b0e2c3da] {
730
+ min-width: 0;
731
+ color: var(--rp-color-text);
732
+ }
733
+ .rp-range-slider__value[data-v-b0e2c3da] {
734
+ flex-shrink: 0;
735
+ color: var(--rp-color-dimmed);
736
+ font-variant-numeric: tabular-nums;
737
+ }
738
+ .rp-range-slider__track[data-v-b0e2c3da] {
739
+ position: relative;
740
+ display: block;
741
+ min-width: 0;
742
+ }
743
+ .rp-range-slider__track[data-v-b0e2c3da] {
744
+ height: var(--_rp-range-slider-thumb-size);
745
+ touch-action: none;
746
+ }
747
+ .rp-range-slider__bar[data-v-b0e2c3da] {
748
+ position: absolute;
749
+ z-index: 1;
750
+ top: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-track-height)) / 2);
751
+ left: 0;
752
+ display: block;
753
+ width: 100%;
754
+ height: var(--_rp-range-slider-track-height);
755
+ pointer-events: none;
756
+ background: linear-gradient(to right, var(--_rp-range-slider-track-bg) 0 var(--_rp-range-slider-lower-fill-position), var(--_rp-range-slider-color) var(--_rp-range-slider-lower-fill-position) var(--_rp-range-slider-upper-fill-position), var(--_rp-range-slider-track-bg) var(--_rp-range-slider-upper-fill-position) 100%);
757
+ border-radius: var(--rp-radius-full);
758
+ }
759
+ .rp-range-slider--marks-with-labels .rp-range-slider__track[data-v-b0e2c3da] {
760
+ padding-bottom: calc(var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
761
+ }
762
+ .rp-range-slider__native[data-v-b0e2c3da] {
763
+ position: absolute;
764
+ z-index: 3;
765
+ top: 0;
766
+ left: 0;
767
+ display: block;
768
+ width: 100%;
769
+ min-width: 0;
770
+ height: var(--_rp-range-slider-thumb-size);
771
+ padding: 0;
772
+ margin: 0;
773
+ appearance: none;
774
+ pointer-events: none;
775
+ background: transparent;
776
+ cursor: pointer;
777
+ outline: none;
778
+ }
779
+ .rp-range-slider__native[data-v-b0e2c3da]:focus, .rp-range-slider__native--active[data-v-b0e2c3da], .rp-range-slider__native[data-active=true][data-v-b0e2c3da] {
780
+ z-index: 4;
781
+ }
782
+ .rp-range-slider__native[data-v-b0e2c3da]:disabled {
783
+ cursor: not-allowed;
784
+ }
785
+ .rp-range-slider__native[data-v-b0e2c3da]::-webkit-slider-runnable-track {
786
+ height: var(--_rp-range-slider-track-height);
787
+ background: transparent;
788
+ border: 0;
789
+ border-radius: var(--rp-radius-full);
790
+ }
791
+ .rp-range-slider__native[data-v-b0e2c3da]::-moz-range-track, .rp-range-slider__native[data-v-b0e2c3da]::-moz-range-progress {
792
+ height: var(--_rp-range-slider-track-height);
793
+ background: transparent;
794
+ border: 0;
795
+ border-radius: var(--rp-radius-full);
796
+ }
797
+ .rp-range-slider__native[data-v-b0e2c3da]::-webkit-slider-thumb {
798
+ width: var(--_rp-range-slider-thumb-size);
799
+ height: var(--_rp-range-slider-thumb-size);
800
+ margin-top: calc((var(--_rp-range-slider-track-height) - var(--_rp-range-slider-thumb-size)) / 2);
801
+ box-sizing: border-box;
802
+ appearance: none;
803
+ opacity: 0;
804
+ pointer-events: none;
805
+ background: transparent;
806
+ border: 0;
807
+ cursor: pointer;
808
+ }
809
+ .rp-range-slider__native[data-v-b0e2c3da]::-moz-range-thumb {
810
+ width: var(--_rp-range-slider-thumb-size);
811
+ height: var(--_rp-range-slider-thumb-size);
812
+ box-sizing: border-box;
813
+ opacity: 0;
814
+ pointer-events: none;
815
+ background: transparent;
816
+ border: 0;
817
+ cursor: pointer;
818
+ }
819
+ .rp-range-slider__marks[data-v-b0e2c3da] {
820
+ position: absolute;
821
+ z-index: 2;
822
+ top: 0;
823
+ right: calc(var(--_rp-range-slider-thumb-size) / 2);
824
+ left: calc(var(--_rp-range-slider-thumb-size) / 2);
825
+ height: var(--_rp-range-slider-thumb-size);
826
+ pointer-events: none;
827
+ }
828
+ .rp-range-slider__mark[data-v-b0e2c3da] {
829
+ position: absolute;
830
+ top: 0;
831
+ left: var(--_rp-range-slider-mark-position);
832
+ display: inline-flex;
833
+ flex-direction: column;
834
+ align-items: center;
835
+ width: max-content;
836
+ max-width: 8rem;
837
+ color: var(--_rp-range-slider-mark-label-color);
838
+ line-height: var(--rp-line-height-md);
839
+ transform: translateX(-50%);
840
+ }
841
+ .rp-range-slider__mark-dot[data-v-b0e2c3da] {
842
+ width: var(--_rp-range-slider-mark-size);
843
+ height: var(--_rp-range-slider-mark-size);
844
+ margin-top: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2);
845
+ background: var(--_rp-range-slider-mark-color);
846
+ border-radius: var(--rp-radius-full);
847
+ box-shadow: 0 0 0 var(--rp-border-width-thin) transparent;
848
+ transition: box-shadow var(--rp-transition-fast);
849
+ }
850
+ .rp-range-slider__mark-label[data-v-b0e2c3da] {
851
+ max-width: 100%;
852
+ margin-top: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2 + var(--rp-spacing-1));
853
+ overflow-wrap: anywhere;
854
+ color: inherit;
855
+ font-size: var(--_rp-range-slider-font-size);
856
+ text-align: center;
857
+ font-variant-numeric: tabular-nums;
858
+ }
859
+ .rp-range-slider__mark--filled .rp-range-slider__mark-dot[data-v-b0e2c3da] {
860
+ box-shadow: 0 0 0 var(--rp-border-width-thin) var(--_rp-range-slider-mark-ring-color);
861
+ }
862
+ .rp-range-slider__mark--filled .rp-range-slider__mark-label[data-v-b0e2c3da] {
863
+ color: var(--_rp-range-slider-mark-filled-label-color);
864
+ }
865
+ .rp-range-slider__thumbs[data-v-b0e2c3da] {
866
+ position: absolute;
867
+ z-index: 4;
868
+ top: 0;
869
+ right: calc(var(--_rp-range-slider-thumb-size) / 2);
870
+ left: calc(var(--_rp-range-slider-thumb-size) / 2);
871
+ height: var(--_rp-range-slider-thumb-size);
872
+ pointer-events: none;
873
+ }
874
+ .rp-range-slider__thumb[data-v-b0e2c3da] {
875
+ --_rp-range-slider-thumb-percent: var(--_rp-range-slider-lower-percent);
876
+ position: absolute;
877
+ top: 0;
878
+ left: var(--_rp-range-slider-thumb-percent);
879
+ width: 0;
880
+ height: var(--_rp-range-slider-thumb-size);
881
+ pointer-events: auto;
882
+ }
883
+ .rp-range-slider__thumb--lower[data-v-b0e2c3da] {
884
+ --_rp-range-slider-thumb-percent: var(--_rp-range-slider-lower-percent);
885
+ }
886
+ .rp-range-slider__thumb--upper[data-v-b0e2c3da] {
887
+ --_rp-range-slider-thumb-percent: var(--_rp-range-slider-upper-percent);
888
+ z-index: 1;
889
+ }
890
+ .rp-range-slider[data-active-thumb=lower] .rp-range-slider__thumb--lower[data-v-b0e2c3da], .rp-range-slider[data-active-thumb=upper] .rp-range-slider__thumb--upper[data-v-b0e2c3da], .rp-range-slider__thumb[data-v-b0e2c3da]:hover {
891
+ z-index: 2;
892
+ }
893
+ .rp-range-slider__thumb-content[data-v-b0e2c3da] {
894
+ position: absolute;
895
+ top: 50%;
896
+ left: 0;
897
+ display: inline-flex;
898
+ align-items: center;
899
+ justify-content: center;
900
+ width: var(--_rp-range-slider-thumb-size);
901
+ height: var(--_rp-range-slider-thumb-size);
902
+ box-sizing: border-box;
903
+ overflow: hidden;
904
+ padding: var(--_rp-range-slider-thumb-padding);
905
+ color: var(--_rp-range-slider-thumb-border);
906
+ background: var(--_rp-range-slider-thumb-bg);
907
+ border: var(--_rp-range-slider-thumb-border-style);
908
+ border-radius: var(--rp-radius-full);
909
+ box-shadow: var(--rp-shadow-sm);
910
+ transform: translate(-50%, -50%);
911
+ transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
912
+ }
913
+ .rp-range-slider__thumb-content[data-v-b0e2c3da] svg {
914
+ width: 60%;
915
+ height: 60%;
916
+ }
917
+ .rp-range-slider__native--lower:focus-visible ~ .rp-range-slider__thumbs .rp-range-slider__thumb--lower[data-v-b0e2c3da], .rp-range-slider__native--upper:focus-visible ~ .rp-range-slider__thumbs .rp-range-slider__thumb--upper[data-v-b0e2c3da] {
918
+ z-index: 2;
919
+ }
920
+ .rp-range-slider__native--lower:focus-visible ~ .rp-range-slider__thumbs .rp-range-slider__thumb--lower .rp-range-slider__thumb-content[data-v-b0e2c3da], .rp-range-slider__native--upper:focus-visible ~ .rp-range-slider__thumbs .rp-range-slider__thumb--upper .rp-range-slider__thumb-content[data-v-b0e2c3da] {
921
+ box-shadow: var(--rp-shadow-sm), 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
922
+ }
923
+ .rp-range-slider--vertical[data-v-b0e2c3da] {
924
+ width: max-content;
925
+ min-width: 0;
926
+ max-width: none;
927
+ justify-items: center;
928
+ }
929
+ .rp-range-slider--vertical .rp-range-slider__header[data-v-b0e2c3da] {
930
+ width: max-content;
931
+ max-width: 12rem;
932
+ justify-content: space-between;
933
+ gap: var(--rp-spacing-3);
934
+ text-align: center;
935
+ }
936
+ .rp-range-slider--vertical .rp-range-slider__value[data-v-b0e2c3da] {
937
+ min-width: 3ch;
938
+ text-align: right;
939
+ }
940
+ .rp-range-slider--vertical .rp-range-slider__track[data-v-b0e2c3da] {
941
+ width: var(--_rp-range-slider-thumb-size);
942
+ height: var(--_rp-range-slider-track-length);
943
+ min-width: 0;
944
+ min-height: var(--_rp-range-slider-track-length);
945
+ justify-self: center;
946
+ }
947
+ .rp-range-slider--vertical .rp-range-slider__bar[data-v-b0e2c3da] {
948
+ top: 0;
949
+ left: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-track-height)) / 2);
950
+ width: var(--_rp-range-slider-track-height);
951
+ height: 100%;
952
+ background: linear-gradient(to top, var(--_rp-range-slider-track-bg) 0 var(--_rp-range-slider-lower-fill-position), var(--_rp-range-slider-color) var(--_rp-range-slider-lower-fill-position) var(--_rp-range-slider-upper-fill-position), var(--_rp-range-slider-track-bg) var(--_rp-range-slider-upper-fill-position) 100%);
953
+ }
954
+ .rp-range-slider--vertical.rp-range-slider--marks-with-labels .rp-range-slider__track[data-v-b0e2c3da] {
955
+ padding-right: calc(var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
956
+ padding-bottom: 0;
957
+ }
958
+ .rp-range-slider--vertical .rp-range-slider__native[data-v-b0e2c3da] {
959
+ width: var(--_rp-range-slider-thumb-size);
960
+ min-width: 0;
961
+ height: 100%;
962
+ min-height: var(--_rp-range-slider-track-length);
963
+ direction: rtl;
964
+ writing-mode: vertical-lr;
965
+ }
966
+ .rp-range-slider--vertical .rp-range-slider__native[data-v-b0e2c3da]::-webkit-slider-runnable-track {
967
+ width: var(--_rp-range-slider-track-height);
968
+ height: 100%;
969
+ }
970
+ .rp-range-slider--vertical .rp-range-slider__native[data-v-b0e2c3da]::-moz-range-track, .rp-range-slider--vertical .rp-range-slider__native[data-v-b0e2c3da]::-moz-range-progress {
971
+ width: var(--_rp-range-slider-track-height);
972
+ height: 100%;
973
+ }
974
+ .rp-range-slider--vertical .rp-range-slider__native[data-v-b0e2c3da]::-webkit-slider-thumb {
975
+ margin-top: 0;
976
+ margin-left: calc((var(--_rp-range-slider-track-height) - var(--_rp-range-slider-thumb-size)) / 2);
977
+ }
978
+ .rp-range-slider--vertical .rp-range-slider__marks[data-v-b0e2c3da] {
979
+ top: calc(var(--_rp-range-slider-thumb-size) / 2);
980
+ right: auto;
981
+ bottom: calc(var(--_rp-range-slider-thumb-size) / 2);
982
+ left: 0;
983
+ width: var(--_rp-range-slider-thumb-size);
984
+ height: auto;
985
+ }
986
+ .rp-range-slider--vertical .rp-range-slider__mark[data-v-b0e2c3da] {
987
+ top: calc(100% - var(--_rp-range-slider-mark-position));
988
+ left: 0;
989
+ flex-direction: row;
990
+ align-items: center;
991
+ transform: translateY(-50%);
992
+ }
993
+ .rp-range-slider--vertical .rp-range-slider__mark-dot[data-v-b0e2c3da] {
994
+ flex: 0 0 auto;
995
+ margin-top: 0;
996
+ margin-left: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2);
997
+ }
998
+ .rp-range-slider--vertical .rp-range-slider__mark-label[data-v-b0e2c3da] {
999
+ margin-top: 0;
1000
+ margin-left: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2 + var(--rp-spacing-1));
1001
+ text-align: left;
1002
+ }
1003
+ .rp-range-slider--vertical .rp-range-slider__thumbs[data-v-b0e2c3da] {
1004
+ top: calc(var(--_rp-range-slider-thumb-size) / 2);
1005
+ right: auto;
1006
+ bottom: calc(var(--_rp-range-slider-thumb-size) / 2);
1007
+ left: 0;
1008
+ width: var(--_rp-range-slider-thumb-size);
1009
+ height: auto;
1010
+ }
1011
+ .rp-range-slider--vertical .rp-range-slider__thumb[data-v-b0e2c3da] {
1012
+ top: calc(100% - var(--_rp-range-slider-thumb-percent));
1013
+ left: 0;
1014
+ width: var(--_rp-range-slider-thumb-size);
1015
+ height: 0;
1016
+ }
1017
+ .rp-range-slider--vertical .rp-range-slider__thumb-content[data-v-b0e2c3da] {
1018
+ top: 0;
1019
+ left: 50%;
1020
+ }
1021
+ .rp-range-slider--tooltip-always-visible:has(.rp-range-slider__tooltips--placement-top) .rp-range-slider__track[data-v-b0e2c3da] {
1022
+ margin-top: var(--_rp-range-slider-tooltip-reserved-space);
1023
+ }
1024
+ .rp-range-slider--tooltip-always-visible:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__track[data-v-b0e2c3da] {
1025
+ margin-right: var(--_rp-range-slider-tooltip-reserved-space);
1026
+ }
1027
+ .rp-range-slider--tooltip-always-visible:has(.rp-range-slider__tooltips--placement-bottom) .rp-range-slider__track[data-v-b0e2c3da] {
1028
+ margin-bottom: var(--_rp-range-slider-tooltip-reserved-space);
1029
+ }
1030
+ .rp-range-slider--tooltip-always-visible:has(.rp-range-slider__tooltips--placement-left) .rp-range-slider__track[data-v-b0e2c3da] {
1031
+ margin-left: var(--_rp-range-slider-tooltip-reserved-space);
1032
+ }
1033
+ .rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:not(.rp-range-slider--vertical):has(.rp-range-slider__tooltips--placement-bottom) .rp-range-slider__track[data-v-b0e2c3da] {
1034
+ padding-bottom: calc(var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2) + var(--_rp-range-slider-tooltip-reserved-space));
1035
+ margin-bottom: 0;
1036
+ }
1037
+ .rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:not(.rp-range-slider--vertical):has(.rp-range-slider__tooltips--placement-bottom) .rp-range-slider__mark-label[data-v-b0e2c3da] {
1038
+ margin-top: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2 + var(--rp-spacing-1) + var(--_rp-range-slider-tooltip-reserved-space));
1039
+ }
1040
+ .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__track[data-v-b0e2c3da] {
1041
+ padding-right: 0;
1042
+ margin-left: calc(var(--_rp-range-slider-font-size) * var(--rp-line-height-md) + var(--rp-spacing-2));
1043
+ }
1044
+ .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__mark[data-v-b0e2c3da] {
1045
+ left: calc((var(--_rp-range-slider-thumb-size) + var(--_rp-range-slider-mark-size)) / 2);
1046
+ flex-direction: row-reverse;
1047
+ gap: calc((var(--_rp-range-slider-thumb-size) - var(--_rp-range-slider-mark-size)) / 2 + var(--rp-spacing-1));
1048
+ transform: translate(-100%, -50%);
1049
+ }
1050
+ .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__mark-dot[data-v-b0e2c3da], .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__mark-label[data-v-b0e2c3da] {
1051
+ margin-left: 0;
1052
+ }
1053
+ .rp-range-slider--vertical.rp-range-slider--tooltip-always-visible.rp-range-slider--marks-with-labels:has(.rp-range-slider__tooltips--placement-right) .rp-range-slider__mark-label[data-v-b0e2c3da] {
1054
+ text-align: right;
1055
+ }
1056
+ .rp-range-slider--size-xs[data-v-b0e2c3da] {
1057
+ --_rp-range-slider-default-track-height: 4px;
1058
+ --_rp-range-slider-default-thumb-size: 8px;
1059
+ --_rp-range-slider-default-thumb-border-width: 4px;
1060
+ --_rp-range-slider-font-size: var(--rp-font-size-xs);
1061
+ --_rp-range-slider-default-mark-size: 4px;
1062
+ }
1063
+ .rp-range-slider--size-sm[data-v-b0e2c3da] {
1064
+ --_rp-range-slider-default-track-height: 6px;
1065
+ --_rp-range-slider-default-thumb-size: 12px;
1066
+ --_rp-range-slider-default-thumb-border-width: 3px;
1067
+ --_rp-range-slider-font-size: var(--rp-font-size-sm);
1068
+ --_rp-range-slider-default-mark-size: 4px;
1069
+ }
1070
+ .rp-range-slider--size-md[data-v-b0e2c3da] {
1071
+ --_rp-range-slider-default-track-height: 8px;
1072
+ --_rp-range-slider-default-thumb-size: 16px;
1073
+ --_rp-range-slider-default-thumb-border-width: 4px;
1074
+ --_rp-range-slider-font-size: var(--rp-font-size-md);
1075
+ --_rp-range-slider-default-mark-size: 4px;
1076
+ }
1077
+ .rp-range-slider--size-lg[data-v-b0e2c3da] {
1078
+ --_rp-range-slider-default-track-height: 10px;
1079
+ --_rp-range-slider-default-thumb-size: 20px;
1080
+ --_rp-range-slider-default-thumb-border-width: 5px;
1081
+ --_rp-range-slider-font-size: var(--rp-font-size-lg);
1082
+ --_rp-range-slider-default-mark-size: 5px;
1083
+ }
1084
+ .rp-range-slider--size-xl[data-v-b0e2c3da] {
1085
+ --_rp-range-slider-default-track-height: 12px;
1086
+ --_rp-range-slider-default-thumb-size: 24px;
1087
+ --_rp-range-slider-default-thumb-border-width: 6px;
1088
+ --_rp-range-slider-font-size: var(--rp-font-size-xl);
1089
+ --_rp-range-slider-default-mark-size: 6px;
1090
+ }
1032
1091
  }