@unifiedsoftware/styles 1.0.46 → 1.0.48

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 (26) hide show
  1. package/css/fci.css +188 -43
  2. package/css/fci.min.css +1 -1
  3. package/css/styles.css +77 -35
  4. package/css/styles.min.css +1 -1
  5. package/package.json +1 -1
  6. package/scss/components/_accordion.scss +51 -9
  7. package/scss/components/_backdrop.scss +1 -1
  8. package/scss/components/_badge.scss +23 -12
  9. package/scss/components/_card.scss +6 -5
  10. package/scss/components/_collapse.scss +0 -5
  11. package/scss/components/_drawer.scss +2 -0
  12. package/scss/components/_input.scss +0 -1
  13. package/scss/components/_list.scss +3 -2
  14. package/scss/components/_popover.scss +1 -1
  15. package/scss/components/_tabs.scss +0 -1
  16. package/scss/components/_toolbar.scss +1 -0
  17. package/scss/themes/fci/components/_accordion.scss +91 -0
  18. package/scss/themes/fci/components/_badge.scss +30 -12
  19. package/scss/themes/fci/components/_button.scss +52 -22
  20. package/scss/themes/fci/components/_card.scss +1 -17
  21. package/scss/themes/fci/components/_chip.scss +32 -12
  22. package/scss/themes/fci/components/_icon.scss +1 -1
  23. package/scss/themes/fci/components/_index.scss +2 -0
  24. package/scss/themes/fci/components/_input.scss +1 -1
  25. package/scss/themes/fci/components/_menu.scss +2 -2
  26. package/scss/themes/fci/components/_result.scss +3 -0
package/css/styles.css CHANGED
@@ -51,6 +51,7 @@
51
51
  flex-grow: 1;
52
52
  overflow: hidden;
53
53
  display: flex;
54
+ flex-direction: column;
54
55
  }
55
56
  .us-toolbar__title {
56
57
  font-size: var(--us-toolbar-title-font-size);
@@ -63,15 +64,21 @@
63
64
  }
64
65
 
65
66
  .us-badge {
66
- position: absolute;
67
- padding: var(--us-badge-padding-y) var(--us-badge-padding-x);
67
+ min-width: var(--us-badge-min-width);
68
+ min-height: var(--us-badge-min-height);
69
+ padding-block: var(--us-badge-padding-y);
70
+ padding-block: var(--us-badge-padding-y);
71
+ padding-inline: var(--us-badge-padding-x);
68
72
  font-size: var(--us-badge-font-size);
69
73
  font-weight: var(--us-badge-font-weight);
74
+ line-height: var(--us-badge-line-height);
70
75
  border: var(--us-badge-border-width) solid var(--us-badge-border-color);
71
76
  border-radius: var(--us-badge-border-radius);
72
77
  color: var(--us-badge-color);
73
78
  background-color: var(--us-badge-background);
74
79
  display: inline-flex;
80
+ justify-content: center;
81
+ align-items: center;
75
82
  }
76
83
  .us-badge > .us-overlay {
77
84
  position: absolute;
@@ -93,37 +100,36 @@
93
100
  color: var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));
94
101
  opacity: var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)));
95
102
  }
96
- .us-badge--top-left {
103
+ .us-badge-wrapper {
104
+ flex-shrink: 0;
105
+ position: relative;
106
+ display: inline-flex;
107
+ }
108
+ .us-badge-wrapper .us-badge {
109
+ position: absolute;
110
+ }
111
+ .us-badge-wrapper .us-badge--top-left {
97
112
  top: 10%;
98
113
  left: 10%;
99
114
  }
100
- .us-badge--top-right {
115
+ .us-badge-wrapper .us-badge--top-right {
101
116
  right: 0;
102
117
  top: 0;
103
118
  transform: translate(50%, -50%);
104
119
  }
105
- .us-badge--bottom-left {
120
+ .us-badge-wrapper .us-badge--bottom-left {
106
121
  bottom: 10%;
107
122
  left: 10%;
108
123
  }
109
- .us-badge--bottom-right {
124
+ .us-badge-wrapper .us-badge--bottom-right {
110
125
  bottom: 0;
111
126
  right: 0;
112
127
  }
113
- .us-badge-wrapper {
114
- flex-shrink: 0;
115
- position: relative;
116
- display: inline-flex;
117
- }
118
128
 
119
129
  .us-collapse {
120
130
  overflow: hidden;
121
131
  transition: all 0.15s ease-in-out;
122
132
  }
123
- .us-collapse-trigger {
124
- cursor: pointer;
125
- -webkit-tap-highlight-color: transparent;
126
- }
127
133
 
128
134
  .us-icon {
129
135
  width: 1em;
@@ -331,7 +337,7 @@
331
337
  left: 0;
332
338
  width: 100%;
333
339
  height: 100vh;
334
- z-index: 10;
340
+ z-index: 20;
335
341
  display: flex;
336
342
  justify-content: center;
337
343
  align-items: center;
@@ -366,7 +372,7 @@
366
372
  box-shadow: rgba(0, 0, 59, 0.05) 0px 0px 0px 1px, rgba(1, 1, 46, 0.133) 0px 12px 60px 0px, rgba(0, 0, 0, 0.133) 0px 12px 32px -16px;
367
373
  background-color: #fff;
368
374
  overflow: hidden;
369
- z-index: 40;
375
+ z-index: 1060;
370
376
  display: flex;
371
377
  flex-direction: column;
372
378
  }
@@ -407,6 +413,8 @@
407
413
  width: 100%;
408
414
  height: 100%;
409
415
  background-color: var(--us-drawer-background);
416
+ display: flex;
417
+ flex-direction: column;
410
418
  }
411
419
  .us-drawer-appear, .us-drawer-enter {
412
420
  opacity: 0;
@@ -555,7 +563,6 @@
555
563
  pointer-events: none;
556
564
  }
557
565
  .us-input--clearable .us-input__clearable {
558
- opacity: 0.75;
559
566
  transform: scale(0);
560
567
  transition: all 0.2s ease-in-out;
561
568
  }
@@ -661,25 +668,61 @@
661
668
  border-bottom: none;
662
669
  }
663
670
  .us-accordion-header {
664
- padding: 0.75rem 1rem;
665
- cursor: pointer;
671
+ height: var(--us-accordion-header-height);
672
+ min-height: var(--us-accordion-header-min-height);
673
+ padding-block: var(--us-accordion-header-padding-y);
674
+ padding-inline: var(--us-accordion-header-padding-x);
666
675
  display: flex;
667
676
  align-items: center;
668
- gap: 1rem;
677
+ gap: var(--us-accordion-header-gap);
669
678
  }
670
- .us-accordion-header__content {
671
- flex-grow: 1;
679
+ .us-accordion-header--collapsible {
680
+ cursor: pointer;
681
+ user-select: none;
682
+ -webkit-tap-highlight-color: transparent;
672
683
  }
673
684
  .us-accordion-header__start-content, .us-accordion-header__end-content {
674
685
  flex-shrink: 0;
675
686
  }
687
+ .us-accordion-header__content {
688
+ flex-grow: 1;
689
+ display: flex;
690
+ flex-direction: column;
691
+ gap: var(--us-accordion-header-content-gap);
692
+ }
676
693
  .us-accordion-header__title {
677
- font-size: 0.875rem;
678
- font-weight: 500;
694
+ font-size: var(--us-accordion-header-title-font-size);
695
+ font-weight: var(--us-accordion-header-title-font-weight);
696
+ line-height: var(--us-accordion-header-title-line-height);
697
+ overflow: hidden;
698
+ color: var(--us-accordion-header-title-color);
699
+ display: -webkit-box;
700
+ -webkit-box-orient: vertical;
701
+ -webkit-line-clamp: 1;
679
702
  }
680
703
  .us-accordion-header__subtitle {
681
- font-size: 0.75rem;
682
- opacity: 0.75;
704
+ font-size: var(--us-accordion-header-subtitle-font-size);
705
+ font-weight: var(--us-accordion-header-subtitle-font-weight);
706
+ line-height: var(--us-accordion-header-subtitle-line-height);
707
+ overflow: hidden;
708
+ color: var(--us-accordion-header-subtitle-color);
709
+ display: -webkit-box;
710
+ -webkit-box-orient: vertical;
711
+ -webkit-line-clamp: 1;
712
+ }
713
+ .us-accordion-header:not(.us-accordion-header--bordered) ~ .us-accordion-body:not([data-hidden=true]), .us-accordion-header:not(.us-accordion-header--bordered) ~ :not([hidden]) .us-accordion-body:not([data-hidden=true]) {
714
+ padding-top: 0;
715
+ }
716
+ .us-accordion-header--bordered ~ .us-accordion-body:not([data-hidden=true]), .us-accordion-header--bordered ~ :not([hidden]) .us-accordion-body:not([data-hidden=true]) {
717
+ border-top-width: 1px;
718
+ }
719
+ .us-accordion-body {
720
+ border-top: 0px solid #ddd;
721
+ padding-block: var(--us-accordion-body-padding-y);
722
+ padding-inline: var(--us-accordion-body-padding-x);
723
+ font-size: var(--us-accordion-body-font-size);
724
+ line-height: var(--us-accordion-body-line-height);
725
+ color: var(--us-accordion-body-color);
683
726
  }
684
727
  .us-accordion-panel {
685
728
  padding: 1rem;
@@ -732,13 +775,13 @@
732
775
  color: var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));
733
776
  opacity: var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)));
734
777
  }
735
- .us-list-item--hoverable {
778
+ .us-list-item--hoverable, .us-list-item--selected {
736
779
  cursor: pointer;
737
780
  user-select: none;
738
781
  }
739
782
  .us-list-item--disabled {
740
783
  opacity: 0.6;
741
- pointer-events: none;
784
+ cursor: not-allowed;
742
785
  user-select: none;
743
786
  }
744
787
  .us-list-item__start-content, .us-list-item__end-content {
@@ -1004,7 +1047,6 @@
1004
1047
  .us-tabs {
1005
1048
  width: 100%;
1006
1049
  white-space: nowrap;
1007
- overflow: hidden;
1008
1050
  display: flex;
1009
1051
  align-items: center;
1010
1052
  }
@@ -1123,13 +1165,13 @@
1123
1165
  color: var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));
1124
1166
  opacity: var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)));
1125
1167
  }
1126
- .us-card--hoverable {
1168
+ .us-card--hoverable, .us-card--selected {
1127
1169
  cursor: pointer;
1128
1170
  user-select: none;
1129
1171
  }
1130
1172
  .us-card--disabled {
1131
1173
  opacity: 0.6;
1132
- pointer-events: none;
1174
+ cursor: not-allowed;
1133
1175
  user-select: none;
1134
1176
  }
1135
1177
  .us-card-header {
@@ -1170,14 +1212,14 @@
1170
1212
  -webkit-box-orient: vertical;
1171
1213
  -webkit-line-clamp: 1;
1172
1214
  }
1173
- .us-card-header:not(.us-card-header--bordered) ~ :not([data-hidden=true]) {
1215
+ .us-card-header:not(.us-card-header--bordered) ~ .us-card-body:not([data-hidden=true]) {
1174
1216
  padding-top: 0;
1175
1217
  }
1176
- .us-card-header--bordered ~ :not([data-hidden=true]) {
1218
+ .us-card-header--bordered ~ .us-card-body:not([data-hidden=true]) {
1177
1219
  border-top-width: 1px;
1178
1220
  }
1179
1221
  .us-card-body {
1180
- border-top: 1px solid #ddd;
1222
+ border-top: 0px solid #ddd;
1181
1223
  padding: var(--us-card-body-padding-y) var(--us-card-body-padding-x);
1182
1224
  font-size: var(--us-card-body-font-size);
1183
1225
  line-height: var(--us-card-body-line-height);
package/css/styles.min.css CHANGED
@@ -1 +1 @@
1
- .us-toolbar{position:relative;width:100%;padding:var(--us-toolbar-padding-y) var(--us-toolbar-padding-x);border-bottom:var(--us-toolbar-border);background:var(--us-toolbar-background);display:flex;align-items:center}.us-toolbar>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-toolbar:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-toolbar:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-toolbar>.us-outline-b{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;border-bottom:var(--us-outline-border-width) solid var(--us-outline-border-color)}.us-toolbar__container{width:100%;min-height:var(--us-toolbar-min-height);margin:0 auto;display:flex;align-items:center;gap:.5rem;z-index:1}.us-toolbar__start-action,.us-toolbar__end-action{flex-shrink:0}.us-toolbar__content{flex-grow:1;overflow:hidden;display:flex}.us-toolbar__title{font-size:var(--us-toolbar-title-font-size);font-weight:var(--us-toolbar-title-font-weight);text-decoration:none;color:inherit;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.us-badge{position:absolute;padding:var(--us-badge-padding-y) var(--us-badge-padding-x);font-size:var(--us-badge-font-size);font-weight:var(--us-badge-font-weight);border:var(--us-badge-border-width) solid var(--us-badge-border-color);border-radius:var(--us-badge-border-radius);color:var(--us-badge-color);background-color:var(--us-badge-background);display:inline-flex}.us-badge>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-badge:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-badge:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-badge--top-left{top:10%;left:10%}.us-badge--top-right{right:0;top:0;transform:translate(50%, -50%)}.us-badge--bottom-left{bottom:10%;left:10%}.us-badge--bottom-right{bottom:0;right:0}.us-badge-wrapper{flex-shrink:0;position:relative;display:inline-flex}.us-collapse{overflow:hidden;transition:all .15s ease-in-out}.us-collapse-trigger{cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-icon{width:1em;height:1em;font-size:var(--us-icon-font-size);color:var(--us-icon-color);display:flex;justify-content:center;align-items:center}.us-chip{position:relative;height:var(--us-chip-height);padding:var(--us-chip-padding-y) var(--us-chip-padding-x);font-size:var(--us-chip-font-size);font-weight:var(--us-chip-font-weight);font-family:var(--us-chip-font-family);border-radius:var(--us-chip-border-radius);color:var(--us-chip-color);background-color:var(--us-chip-background);display:inline-flex;align-items:center;gap:var(--us-chip-gap)}.us-chip>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-chip:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-chip:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-chip>.us-outline{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;border-width:var(--us-outline-border-width);border-style:solid;border-color:var(--us-outline-border-color);opacity:var(--us-outline-opacity);pointer-events:none}.us-chip:hover>.us-outline{border-width:var(--us-outline-hover-border-width, var(--us-outline-border-width));border-color:var(--us-outline-hover-border-color, var(--us-outline-border-color));opacity:var(--us-outline-hover-opacity, var(--us-outline-opacity))}.us-chip:active>.us-outline{border-width:var(--us-outline-active-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-active-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-active-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-chip--focus>.us-outline,.us-chip--focus:hover>.us-outline,.us-chip:focus>.us-outline{border-width:var(--us-outline-focus-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-focus-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-focus-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-button{position:relative;height:var(--us-button-height);padding:var(--us-button-padding-y) var(--us-button-padding-x);font-size:var(--us-button-font-size);font-weight:var(--us-button-font-weight);font-family:var(--us-button-font-family);white-space:nowrap;border:none;outline:none;border-radius:var(--us-button-border-radius);cursor:pointer;color:var(--us-button-color);background-color:var(--us-button-background);z-index:0;display:inline-flex;justify-content:center;align-items:center;gap:var(--us-button-gap);user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-button:hover{text-decoration:none}.us-button>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-button:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-button:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-button>.us-outline{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;border-width:var(--us-outline-border-width);border-style:solid;border-color:var(--us-outline-border-color);opacity:var(--us-outline-opacity);pointer-events:none}.us-button:hover>.us-outline{border-width:var(--us-outline-hover-border-width, var(--us-outline-border-width));border-color:var(--us-outline-hover-border-color, var(--us-outline-border-color));opacity:var(--us-outline-hover-opacity, var(--us-outline-opacity))}.us-button:active>.us-outline{border-width:var(--us-outline-active-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-active-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-active-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-button--focus>.us-outline,.us-button--focus:hover>.us-outline,.us-button:focus>.us-outline{border-width:var(--us-outline-focus-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-focus-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-focus-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-button--block{width:100%}.us-button--disabled{opacity:.6;pointer-events:none}.us-button--icon-only{width:var(--us-button-height);padding:0;border-radius:9999px;justify-content:center}.us-button__outline{position:absolute;inset:0px;z-index:0;border:var(--us-button-outline-border-width) solid var(--us-button-outline-border-color);border-radius:inherit;pointer-events:none}.us-button__start-icon,.us-button__end-icon,.us-button__content{position:relative;display:flex;align-items:center}.us-scroll-area__track{position:absolute;border-radius:3px;right:2px;bottom:2px}.us-scroll-area__track--horizontal{height:6px;left:2px}.us-scroll-area__track--vertical{width:6px;top:2px}.us-scroll-area__thumb{position:relative;display:block;cursor:pointer;border-radius:inherit;background-color:rgba(0,0,0,.2);transform:translateX(0px)}.us-scroll-area__thumb--horizontal{height:100%;width:105px}.us-scroll-area__thumb--vertical{width:100%;height:463px}.us-backdrop{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:10;display:flex;justify-content:center;align-items:center}.us-backdrop-enter{opacity:0}.us-backdrop-enter-active{opacity:1;transition:opacity 100ms}.us-backdrop-exit{opacity:1}.us-backdrop-exit-active{opacity:0;transition:opacity 200ms;transition-delay:300ms}.us-backdrop__overlay{position:absolute;width:100%;height:100%;z-index:-10;background-color:rgba(0,0,0,.6)}.us-popover{min-width:240px;position:absolute;border-radius:6px;box-shadow:rgba(0,0,59,.05) 0px 0px 0px 1px,rgba(1,1,46,.133) 0px 12px 60px 0px,rgba(0,0,0,.133) 0px 12px 32px -16px;background-color:#fff;overflow:hidden;z-index:40;display:flex;flex-direction:column}.us-popover__overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;border-radius:inherit;background-color:#fff;opacity:1;z-index:0}.us-popover-enter{opacity:0;transform:scale(0.9)}.us-popover-enter-active{opacity:1;transform:scale(1);transition:opacity 100ms,transform 200ms}.us-popover-exit{opacity:1;transform:scale(1)}.us-popover-exit-active{opacity:0;transform:scale(0.9);transition:opacity 150ms,transform 150ms}.us-drawer{position:absolute;max-width:var(--us-drawer-width);width:100%;height:100%;background-color:var(--us-drawer-background)}.us-drawer-appear,.us-drawer-enter{opacity:0;transform:translateX(-100%)}.us-drawer-appear-active,.us-drawer-enter-active{opacity:1;transform:translateX(0%);transition:opacity 100ms,transform 200ms;transition-delay:300ms}.us-drawer-exit{opacity:1;transform:translateX(0%)}.us-drawer-exit-active{opacity:0;transform:translateX(-100%);transition:opacity 300ms,transform 300ms}.us-drawer--left,.us-drawer--right{max-width:calc(100% - 2rem);max-height:100%}.us-drawer--left{left:0}.us-drawer--left.us-drawer-appear,.us-drawer--left.us-drawer-enter{transform:translateX(-100%)}.us-drawer--left.us-drawer-appear-active,.us-drawer--left.us-drawer-enter-active{transform:translateX(0%)}.us-drawer--left.us-drawer-exit{transform:translateX(0%)}.us-drawer--left.us-drawer-exit-active{transform:translateX(-100%)}.us-drawer--right.us-drawer-appear,.us-drawer--right.us-drawer-enter{transform:translateX(100%)}.us-drawer--right{right:0}.us-drawer--right.us-drawer-appear-active,.us-drawer--right.us-drawer-enter-active{transform:translateX(0%)}.us-drawer--right.us-drawer-exit{transform:translateX(0%)}.us-drawer--right.us-drawer-exit-active{transform:translateX(100%)}.us-drawer--top,.us-drawer--bottom{max-width:100%;max-height:calc(100% - 2rem)}.us-drawer--top{top:0}.us-drawer--top.us-drawer-appear,.us-drawer--top.us-drawer-enter{transform:translateY(-100%)}.us-drawer--top.us-drawer-appear-active,.us-drawer--top.us-drawer-enter-active{transform:translateY(0%)}.us-drawer--top.us-drawer-exit{transform:translateY(0%)}.us-drawer--top.us-drawer-exit-active{transform:translateY(-100%)}.us-drawer--bottom{bottom:0}.us-drawer--bottom.us-drawer-appear,.us-drawer--bottom.us-drawer-enter{transform:translateY(100%)}.us-drawer--bottom.us-drawer-appear-active,.us-drawer--bottom.us-drawer-enter-active{transform:translateY(0%)}.us-drawer--bottom.us-drawer-exit{transform:translateY(0%)}.us-drawer--bottom.us-drawer-exit-active{transform:translateY(100%)}@media screen and (min-width: 768px){.us-drawer--left,.us-drawer--right{max-width:var(--us-drawer-width);max-height:100%}.us-drawer--top,.us-drawer--bottom{max-width:100%;max-height:var(--us-drawer-width)}}.us-input{position:relative;width:100%;padding:0;height:var(--us-input-height);display:flex;align-items:center;border:none;border-radius:var(--us-input-border-radius);color:var(--us-input-color);background-color:var(--us-input-background)}.us-input:focus-visible{outline:none}.us-input:not(.us-input--filterable){cursor:pointer}.us-input>.us-outline{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;border-width:var(--us-outline-border-width);border-style:solid;border-color:var(--us-outline-border-color);opacity:var(--us-outline-opacity);pointer-events:none}.us-input:hover>.us-outline{border-width:var(--us-outline-hover-border-width, var(--us-outline-border-width));border-color:var(--us-outline-hover-border-color, var(--us-outline-border-color));opacity:var(--us-outline-hover-opacity, var(--us-outline-opacity))}.us-input:active>.us-outline{border-width:var(--us-outline-active-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-active-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-active-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-input--focus>.us-outline,.us-input--focus:hover>.us-outline,.us-input:focus>.us-outline{border-width:var(--us-outline-focus-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-focus-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-focus-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-input--disabled{opacity:.75;pointer-events:none}.us-input--clearable .us-input__clearable{opacity:.75;transform:scale(0);transition:all .2s ease-in-out}.us-input--clearable:hover .us-input__clearable{transform:scale(0.75)}.us-input__clearable{display:flex;justify-content:center;align-items:center}.us-input__content{flex:1;height:100%;display:flex;align-items:center;z-index:1}.us-input__field{flex:1;width:100%;height:100%;padding:var(--us-input-padding-y) var(--us-input-padding-x);font-size:var(--us-input-font-size);font-family:var(--us-input-font-family);line-height:var(--us-input-line-height);border:none;outline:none;color:var(--us-input-color);background-color:rgba(0,0,0,0);display:flex;align-items:center}.us-input__field:focus{outline:none !important}.us-input__search{flex:1;width:100%;padding:var(--us-input-padding-y) var(--us-input-padding-x);font-size:var(--us-input-font-size);font-family:var(--us-input-font-family);line-height:var(--us-input-line-height);color:var(--us-input-color);overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-input__start-content,.us-input__end-content{flex-shrink:0;display:flex;align-items:center}.us-input__start-content .us-icon,.us-input__end-content .us-icon{font-size:var(--us-input-icon-size)}.us-input__start-content{margin-right:calc(-1*var(--us-input-icon-size));padding:var(--us-input-padding-y) calc(.75*var(--us-input-padding-x))}.us-input__end-content{margin-left:calc(-1*var(--us-input-icon-size));padding:var(--us-input-padding-y) calc(.75*var(--us-input-padding-x))}.us-switch{position:relative;display:inline-block;width:var(--us-switch-width);padding-block:var(--us-switch-padding-y);border-radius:var(--us-switch-border-radius);cursor:pointer;background-color:var(--us-switch-color);display:inline-flex;align-items:center;transition:all .2s ease-in-out;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-switch input{position:absolute;opacity:0;width:0;height:0}.us-switch--checked .us-switch__thumb{transform:translateX(calc(var(--us-switch-width) - var(--us-switch-thumb-width) - (var(--us-switch-padding-x))))}.us-switch__thumb{width:var(--us-switch-thumb-width);height:var(--us-switch-thumb-height);transform:translateX(var(--us-switch-padding-x));border-radius:var(--us-switch-thumb-border-radius);background-color:var(--us-switch-thumb-color);transition:all .2s ease-in-out}.us-accordion-item{border-bottom:1px solid #e6e6e6}.us-accordion-item:last-child{border-bottom:none}.us-accordion-header{padding:.75rem 1rem;cursor:pointer;display:flex;align-items:center;gap:1rem}.us-accordion-header__content{flex-grow:1}.us-accordion-header__start-content,.us-accordion-header__end-content{flex-shrink:0}.us-accordion-header__title{font-size:.875rem;font-weight:500}.us-accordion-header__subtitle{font-size:.75rem;opacity:.75}.us-accordion-panel{padding:1rem}.us-list{margin:0;padding:var(--us-list-padding-y) var(--us-list-padding-x);color:var(--us-list-color);background-color:var(--us-list-background)}.us-list-item{position:relative;height:var(--us-list-item-height);min-height:var(--us-list-item-min-height);padding-block:var(--us-list-item-padding-y);padding-inline:var(--us-list-item-padding-x);font-size:var(--us-list-item-font-size);font-weight:var(--us-list-item-font-weight);border-radius:var(--us-list-item-border-radius);text-decoration:none;z-index:0;display:flex;align-items:center;color:var(--us-list-item-color);background-color:var(--us-list-item-background);-webkit-tap-highlight-color:rgba(0,0,0,0);gap:var(--us-list-item-gap)}.us-list-item:hover{text-decoration:none}.us-list-item>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-list-item:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-list-item:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-list-item--hoverable{cursor:pointer;user-select:none}.us-list-item--disabled{opacity:.6;pointer-events:none;user-select:none}.us-list-item__start-content,.us-list-item__end-content{flex-shrink:0;z-index:1;display:flex;justify-content:center;align-items:center;gap:calc(var(--us-list-item-gap)*.5)}.us-list-item__content{flex-grow:1;z-index:1;display:grid;overflow:hidden}.us-list-item__title{font-size:var(--us-list-item-title-font-size);font-weight:var(--us-list-item-title-font-weight);line-height:var(--us-list-item-title-line-height);opacity:var(--us-list-item-title-opacity);overflow:hidden;color:var(--us-list-item-title-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-list-item__subtitle{font-size:var(--us-list-item-subtitle-font-size);font-weight:var(--us-list-item-subtitle-font-weight);line-height:var(--us-list-item-subtitle-line-height);opacity:var(--us-list-item-subtitle-opacity);overflow:hidden;color:var(--us-list-item-subtitle-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-list-subheader--bordered{border-bottom:var(--us-list-subheader-border-width) solid var(--us-list-subheader-border-color)}.us-list-group .us-list{--us-list-background: var(--us-list-group-background)}.us-menu{margin:0;padding:var(--us-menu-padding-y) var(--us-menu-padding-x);color:var(--us-menu-color);background-color:var(--us-menu-background)}.us-menu-item{position:relative;height:var(--us-menu-item-height);padding:var(--us-menu-item-padding-y) var(--us-menu-item-padding-x);font-size:var(--us-menu-item-font-size);font-weight:var(--us-menu-item-font-weight);border-radius:var(--us-menu-item-border-radius);text-decoration:none;cursor:pointer;z-index:0;display:flex;align-items:center;color:var(--us-menu-item-color);background-color:var(--us-menu-item-background);user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);gap:var(--us-menu-item-gap)}.us-menu-item:hover{text-decoration:none}.us-menu-item>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-menu-item:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-menu-item:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-menu-item--hoverable{cursor:pointer;user-select:none}.us-menu-item--disabled{opacity:.6;pointer-events:none}.us-menu-item__start-content{flex-shrink:0;z-index:1;display:flex;justify-content:center;align-items:center}.us-menu-item__start-content,.us-menu-item__end-content{flex-shrink:0;z-index:1;display:flex;justify-content:center;align-items:center;gap:calc(var(--us-list-item-gap)*.5)}.us-menu-item__content{flex-grow:1;z-index:1;display:grid;overflow:hidden}.us-menu-item__title{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-menu-group{position:relative;height:var(--us-menu-group-height);padding:var(--us-menu-group-padding-y) var(--us-menu-group-padding-x);font-size:var(--us-menu-group-font-size);font-weight:var(--us-menu-group-font-weight);text-decoration:none;border-bottom:var(--us-menu-group-border-width) solid var(--us-menu-group-border-color);border-radius:var(--us-menu-group-border-radius);display:flex;align-items:center;color:var(--us-menu-group-color);background-color:var(--us-menu-group-background);gap:var(--us-menu-group-gap)}.us-menu-group:hover{text-decoration:none}.us-menu-group>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-menu-group:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-menu-group:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-menu-group__icon{flex-shrink:0;z-index:1;display:flex;justify-content:center;align-items:center}.us-menu-group__content{flex-grow:1;z-index:1;display:grid;overflow:hidden}.us-menu-group__title{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-menu-submenu .us-menu{--us-menu-background: var(--us-submenu-background)}.us-divider{width:100%;height:1px;background:#cac4d0}.us-breadcrumb{padding:.5rem 0;font-size:.875rem;display:flex;align-items:center;gap:0}.us-breadcrumb-item{padding:.25rem .5rem;white-space:nowrap;display:flex;align-items:center}.us-breadcrumb-item:not(.us-breadcrumb-item--is-menu){line-height:32px}.us-swipe{position:relative;overflow-x:hidden;display:flex;align-items:center;gap:var(--us-swipe-gap)}@media(max-width: 767px)and (hover: none){.us-swipe{overflow:auto}}.us-swipe-wrapper{position:relative}.us-swipe-wrapper__left,.us-swipe-wrapper__right{position:absolute;top:50%;transform:translateY(-50%);z-index:1}.us-swipe-wrapper__left{left:-1.25rem}.us-swipe-wrapper__right{right:-1.25rem}.us-swipe-wrapper--auto-hide .us-swipe-wrapper__left,.us-swipe-wrapper--auto-hide .us-swipe-wrapper__right{transform:translateY(-50%) scale(0);transition:all .2s ease-in-out}.us-swipe-wrapper--auto-hide:hover .us-swipe-wrapper__left,.us-swipe-wrapper--auto-hide:hover .us-swipe-wrapper__right{transform:translateY(-50%) scale(1)}.us-swipe--start .us-swipe-item:last-child{margin-right:auto}.us-swipe--center .us-swipe-item:first-child{margin-left:auto}.us-swipe--center .us-swipe-item:last-child{margin-right:auto}.us-swipe--end .us-swipe-item:first-child{margin-left:auto}.us-swipe-item{flex-shrink:0;position:relative}.us-tabs{width:100%;white-space:nowrap;overflow:hidden;display:flex;align-items:center}.us-tabs--start{justify-content:flex-start}.us-tabs--center{justify-content:center}.us-tabs--end{justify-content:flex-end}.us-tabs--stretch .us-tab{flex-grow:1}@media(max-width: 767px)and (hover: none){.us-tabs{overflow:auto}}.us-tab{position:relative;padding:0px 16px;font-size:var(--us-tab-font-size);font-weight:var(--us-tab-font-weight);text-decoration:none;vertical-align:middle;border-radius:var(--us-tab-border-radius);z-index:1;color:var(--us-tab-color);display:inline-flex;justify-content:center;align-items:center;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-tab:hover{text-decoration:none}.us-tab>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-tab:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-tab:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-tab--disabled{opacity:.6;pointer-events:none}.us-tab__content{position:relative;height:40px;display:inline-flex;flex-direction:row;justify-content:center;align-items:center;gap:8px}.us-tab__indicator{position:absolute;height:var(--us-tab-indicator-height);border-radius:var(--us-tab-indicator-border-radius);inset:auto 0px 0px;opacity:0;z-index:-1;background:var(--us-tab-indicator-color);transform-origin:left bottom}.us-tab--selected .us-tab__indicator{opacity:1}.us-card{position:relative;border:var(--us-card-border-width) var(--us-card-border-style) var(--us-card-border-color);border-radius:var(--us-card-border-radius);z-index:0;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-card:hover{text-decoration:none}.us-card>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-card:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-card:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-card--hoverable{cursor:pointer;user-select:none}.us-card--disabled{opacity:.6;pointer-events:none;user-select:none}.us-card-header{height:var(--us-card-header-height);min-height:var(--us-card-header-min-height);padding-block:var(--us-card-header-padding-y);padding-inline:var(--us-card-header-padding-x);display:flex;align-items:center;gap:var(--us-card-header-gap)}.us-card-header__start-content,.us-card-header__end-content{flex-shrink:0}.us-card-header__content{flex-grow:1;display:flex;flex-direction:column;gap:var(--us-card-header-content-gap)}.us-card-header__title{font-size:var(--us-card-header-title-font-size);font-weight:var(--us-card-header-title-font-weight);line-height:var(--us-card-header-title-line-height);overflow:hidden;color:var(--us-card-header-title-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-card-header__subtitle{font-size:var(--us-card-header-subtitle-font-size);font-weight:var(--us-card-header-subtitle-font-weight);line-height:var(--us-card-header-subtitle-line-height);overflow:hidden;color:var(--us-card-header-subtitle-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-card-header:not(.us-card-header--bordered)~:not([data-hidden=true]){padding-top:0}.us-card-header--bordered~:not([data-hidden=true]){border-top-width:1px}.us-card-body{border-top:1px solid #ddd;padding:var(--us-card-body-padding-y) var(--us-card-body-padding-x);font-size:var(--us-card-body-font-size);line-height:var(--us-card-body-line-height);color:var(--us-card-body-color)}.us-result{flex-grow:1;width:100%;padding-block:var(--us-result-padding-y);padding-inline:var(--us-result-padding-x);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--us-result-gap)}.us-result__content{text-align:center;display:flex;flex-direction:column;gap:var(--us-result-content-gap)}.us-result__title{font-size:var(--us-result-title-font-size);font-weight:var(--us-result-title-font-weight)}.us-result__subtitle{font-size:var(--us-result-subtitle-font-size);font-weight:var(--us-result-subtitle-font-weight)}.us-result__icon>.us-icon{--us-icon-font-size: 4.5rem}.us-result--warning .us-result__icon>.us-icon{--us-icon-color: var(--us-warning-color)}.us-animation-spin{animation:us-animation-spin 1s linear infinite;transform-origin:center center}@keyframes us-animation-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.us-animation-pulse{animation:us-animation-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}@keyframes us-animation-pulse{0%,100%{opacity:1}50%{opacity:.5}}.us-animation-bounce{animation:us-animation-bounce 1s infinite}@keyframes us-animation-bounce{0%,100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0.8, 0, 1, 1)}50%{transform:translateY(0);animation-timing-function:cubic-bezier(0, 0, 0.2, 1)}}.us-w-full{width:100%}.us-w-screen{width:100vh}.us-h-full{height:100%}.us-h-screen{height:100dvh}.us-overflow-auto{overflow:auto}.us-overflow-hidden{overflow:hidden}.us-d-block{display:block}.us-d-inline{display:inline}.us-d-flex{display:flex}.us-d-grid{display:grid}.us-d-contents{display:contents}.us-d-none{display:none}.us-flex-row{flex-direction:row}.us-flex-row-reverse{flex-direction:row-reverse}.us-flex-col{flex-direction:column}.us-flex-col-reverse{flex-direction:column-reverse}.us-flex-nowrap{flex-wrap:nowrap}.us-flex-wrap{flex-wrap:wrap}.us-flex-wrap-reverse{flex-wrap:wrap-reverse}.us-grow-0{flex-grow:0}.us-grow-1{flex-grow:1}.us-shrink-0{flex-shrink:0}.us-shrink-1{flex-shrink:1}.us-justify-start{justify-content:flex-start}.us-justify-end{justify-content:flex-end}.us-justify-center{justify-content:center}.us-justify-between{justify-content:space-between}.us-justify-around{justify-content:space-around}.us-justify-evenly{justify-content:space-evenly}.us-items-start{align-items:flex-start}.us-items-end{align-items:flex-end}.us-items-center{align-items:center}.us-items-stretch{align-items:stretch}.us-items-baseline{align-items:baseline}.us-gap-0{gap:0}.us-gap-1{gap:.25rem}.us-gap-2{gap:.5rem}.us-gap-3{gap:.75rem}.us-gap-4{gap:1rem}.us-gap-5{gap:1.25rem}.us-gap-6{gap:1.5rem}.us-gap-7{gap:1.75rem}.us-gap-8{gap:2rem}.us-gap-x-0{column-gap:0}.us-gap-x-1{column-gap:.25rem}.us-gap-x-2{column-gap:.5rem}.us-gap-x-3{column-gap:.75rem}.us-gap-x-4{column-gap:1rem}.us-gap-x-5{column-gap:1.25rem}.us-gap-x-6{column-gap:1.5rem}.us-gap-x-7{column-gap:1.75rem}.us-gap-x-8{column-gap:2rem}.us-gap-y-0{row-gap:0}.us-gap-y-1{row-gap:.25rem}.us-gap-y-2{row-gap:.5rem}.us-gap-y-3{row-gap:.75rem}.us-gap-y-4{row-gap:1rem}.us-gap-y-5{row-gap:1.25rem}.us-gap-y-6{row-gap:1.5rem}.us-gap-y-7{row-gap:1.75rem}.us-gap-y-8{row-gap:2rem}@media screen and (min-width: 0px){.xs\:us-h-full{height:100%}.xs\:us-h-screen{height:100dvh}.xs\:us-overflow-auto{overflow:auto}.xs\:us-overflow-hidden{overflow:hidden}.xs\:us-d-block{display:block}.xs\:us-d-inline{display:inline}.xs\:us-d-flex{display:flex}.xs\:us-d-grid{display:grid}.xs\:us-d-contents{display:contents}.xs\:us-d-none{display:none}.xs\:us-flex-row{flex-direction:row}.xs\:us-flex-row-reverse{flex-direction:row-reverse}.xs\:us-flex-col{flex-direction:column}.xs\:us-flex-col-reverse{flex-direction:column-reverse}.xs\:us-flex-nowrap{flex-wrap:nowrap}.xs\:us-flex-wrap{flex-wrap:wrap}.xs\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.xs\:us-grow-0{flex-grow:0}.xs\:us-grow-1{flex-grow:1}.xs\:us-shrink-0{flex-shrink:0}.xs\:us-shrink-1{flex-shrink:1}.xs\:us-justify-start{justify-content:flex-start}.xs\:us-justify-end{justify-content:flex-end}.xs\:us-justify-center{justify-content:center}.xs\:us-justify-between{justify-content:space-between}.xs\:us-justify-around{justify-content:space-around}.xs\:us-justify-evenly{justify-content:space-evenly}.xs\:us-items-start{align-items:flex-start}.xs\:us-items-end{align-items:flex-end}.xs\:us-items-center{align-items:center}.xs\:us-items-stretch{align-items:stretch}.xs\:us-items-baseline{align-items:baseline}.xs\:us-gap-0{gap:0}.xs\:us-gap-1{gap:.25rem}.xs\:us-gap-2{gap:.5rem}.xs\:us-gap-3{gap:.75rem}.xs\:us-gap-4{gap:1rem}.xs\:us-gap-5{gap:1.25rem}.xs\:us-gap-6{gap:1.5rem}.xs\:us-gap-7{gap:1.75rem}.xs\:us-gap-8{gap:2rem}.xs\:us-gap-x-0{column-gap:0}.xs\:us-gap-x-1{column-gap:.25rem}.xs\:us-gap-x-2{column-gap:.5rem}.xs\:us-gap-x-3{column-gap:.75rem}.xs\:us-gap-x-4{column-gap:1rem}.xs\:us-gap-x-5{column-gap:1.25rem}.xs\:us-gap-x-6{column-gap:1.5rem}.xs\:us-gap-x-7{column-gap:1.75rem}.xs\:us-gap-x-8{column-gap:2rem}.xs\:us-gap-y-0{row-gap:0}.xs\:us-gap-y-1{row-gap:.25rem}.xs\:us-gap-y-2{row-gap:.5rem}.xs\:us-gap-y-3{row-gap:.75rem}.xs\:us-gap-y-4{row-gap:1rem}.xs\:us-gap-y-5{row-gap:1.25rem}.xs\:us-gap-y-6{row-gap:1.5rem}.xs\:us-gap-y-7{row-gap:1.75rem}.xs\:us-gap-y-8{row-gap:2rem}}@media screen and (min-width: 600px){.sm\:us-h-full{height:100%}.sm\:us-h-screen{height:100dvh}.sm\:us-overflow-auto{overflow:auto}.sm\:us-overflow-hidden{overflow:hidden}.sm\:us-d-block{display:block}.sm\:us-d-inline{display:inline}.sm\:us-d-flex{display:flex}.sm\:us-d-grid{display:grid}.sm\:us-d-contents{display:contents}.sm\:us-d-none{display:none}.sm\:us-flex-row{flex-direction:row}.sm\:us-flex-row-reverse{flex-direction:row-reverse}.sm\:us-flex-col{flex-direction:column}.sm\:us-flex-col-reverse{flex-direction:column-reverse}.sm\:us-flex-nowrap{flex-wrap:nowrap}.sm\:us-flex-wrap{flex-wrap:wrap}.sm\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.sm\:us-grow-0{flex-grow:0}.sm\:us-grow-1{flex-grow:1}.sm\:us-shrink-0{flex-shrink:0}.sm\:us-shrink-1{flex-shrink:1}.sm\:us-justify-start{justify-content:flex-start}.sm\:us-justify-end{justify-content:flex-end}.sm\:us-justify-center{justify-content:center}.sm\:us-justify-between{justify-content:space-between}.sm\:us-justify-around{justify-content:space-around}.sm\:us-justify-evenly{justify-content:space-evenly}.sm\:us-items-start{align-items:flex-start}.sm\:us-items-end{align-items:flex-end}.sm\:us-items-center{align-items:center}.sm\:us-items-stretch{align-items:stretch}.sm\:us-items-baseline{align-items:baseline}.sm\:us-gap-0{gap:0}.sm\:us-gap-1{gap:.25rem}.sm\:us-gap-2{gap:.5rem}.sm\:us-gap-3{gap:.75rem}.sm\:us-gap-4{gap:1rem}.sm\:us-gap-5{gap:1.25rem}.sm\:us-gap-6{gap:1.5rem}.sm\:us-gap-7{gap:1.75rem}.sm\:us-gap-8{gap:2rem}.sm\:us-gap-x-0{column-gap:0}.sm\:us-gap-x-1{column-gap:.25rem}.sm\:us-gap-x-2{column-gap:.5rem}.sm\:us-gap-x-3{column-gap:.75rem}.sm\:us-gap-x-4{column-gap:1rem}.sm\:us-gap-x-5{column-gap:1.25rem}.sm\:us-gap-x-6{column-gap:1.5rem}.sm\:us-gap-x-7{column-gap:1.75rem}.sm\:us-gap-x-8{column-gap:2rem}.sm\:us-gap-y-0{row-gap:0}.sm\:us-gap-y-1{row-gap:.25rem}.sm\:us-gap-y-2{row-gap:.5rem}.sm\:us-gap-y-3{row-gap:.75rem}.sm\:us-gap-y-4{row-gap:1rem}.sm\:us-gap-y-5{row-gap:1.25rem}.sm\:us-gap-y-6{row-gap:1.5rem}.sm\:us-gap-y-7{row-gap:1.75rem}.sm\:us-gap-y-8{row-gap:2rem}}@media screen and (min-width: 960px){.md\:us-h-full{height:100%}.md\:us-h-screen{height:100dvh}.md\:us-overflow-auto{overflow:auto}.md\:us-overflow-hidden{overflow:hidden}.md\:us-d-block{display:block}.md\:us-d-inline{display:inline}.md\:us-d-flex{display:flex}.md\:us-d-grid{display:grid}.md\:us-d-contents{display:contents}.md\:us-d-none{display:none}.md\:us-flex-row{flex-direction:row}.md\:us-flex-row-reverse{flex-direction:row-reverse}.md\:us-flex-col{flex-direction:column}.md\:us-flex-col-reverse{flex-direction:column-reverse}.md\:us-flex-nowrap{flex-wrap:nowrap}.md\:us-flex-wrap{flex-wrap:wrap}.md\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.md\:us-grow-0{flex-grow:0}.md\:us-grow-1{flex-grow:1}.md\:us-shrink-0{flex-shrink:0}.md\:us-shrink-1{flex-shrink:1}.md\:us-justify-start{justify-content:flex-start}.md\:us-justify-end{justify-content:flex-end}.md\:us-justify-center{justify-content:center}.md\:us-justify-between{justify-content:space-between}.md\:us-justify-around{justify-content:space-around}.md\:us-justify-evenly{justify-content:space-evenly}.md\:us-items-start{align-items:flex-start}.md\:us-items-end{align-items:flex-end}.md\:us-items-center{align-items:center}.md\:us-items-stretch{align-items:stretch}.md\:us-items-baseline{align-items:baseline}.md\:us-gap-0{gap:0}.md\:us-gap-1{gap:.25rem}.md\:us-gap-2{gap:.5rem}.md\:us-gap-3{gap:.75rem}.md\:us-gap-4{gap:1rem}.md\:us-gap-5{gap:1.25rem}.md\:us-gap-6{gap:1.5rem}.md\:us-gap-7{gap:1.75rem}.md\:us-gap-8{gap:2rem}.md\:us-gap-x-0{column-gap:0}.md\:us-gap-x-1{column-gap:.25rem}.md\:us-gap-x-2{column-gap:.5rem}.md\:us-gap-x-3{column-gap:.75rem}.md\:us-gap-x-4{column-gap:1rem}.md\:us-gap-x-5{column-gap:1.25rem}.md\:us-gap-x-6{column-gap:1.5rem}.md\:us-gap-x-7{column-gap:1.75rem}.md\:us-gap-x-8{column-gap:2rem}.md\:us-gap-y-0{row-gap:0}.md\:us-gap-y-1{row-gap:.25rem}.md\:us-gap-y-2{row-gap:.5rem}.md\:us-gap-y-3{row-gap:.75rem}.md\:us-gap-y-4{row-gap:1rem}.md\:us-gap-y-5{row-gap:1.25rem}.md\:us-gap-y-6{row-gap:1.5rem}.md\:us-gap-y-7{row-gap:1.75rem}.md\:us-gap-y-8{row-gap:2rem}}@media screen and (min-width: 1264px){.lg\:us-h-full{height:100%}.lg\:us-h-screen{height:100dvh}.lg\:us-overflow-auto{overflow:auto}.lg\:us-overflow-hidden{overflow:hidden}.lg\:us-d-block{display:block}.lg\:us-d-inline{display:inline}.lg\:us-d-flex{display:flex}.lg\:us-d-grid{display:grid}.lg\:us-d-contents{display:contents}.lg\:us-d-none{display:none}.lg\:us-flex-row{flex-direction:row}.lg\:us-flex-row-reverse{flex-direction:row-reverse}.lg\:us-flex-col{flex-direction:column}.lg\:us-flex-col-reverse{flex-direction:column-reverse}.lg\:us-flex-nowrap{flex-wrap:nowrap}.lg\:us-flex-wrap{flex-wrap:wrap}.lg\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.lg\:us-grow-0{flex-grow:0}.lg\:us-grow-1{flex-grow:1}.lg\:us-shrink-0{flex-shrink:0}.lg\:us-shrink-1{flex-shrink:1}.lg\:us-justify-start{justify-content:flex-start}.lg\:us-justify-end{justify-content:flex-end}.lg\:us-justify-center{justify-content:center}.lg\:us-justify-between{justify-content:space-between}.lg\:us-justify-around{justify-content:space-around}.lg\:us-justify-evenly{justify-content:space-evenly}.lg\:us-items-start{align-items:flex-start}.lg\:us-items-end{align-items:flex-end}.lg\:us-items-center{align-items:center}.lg\:us-items-stretch{align-items:stretch}.lg\:us-items-baseline{align-items:baseline}.lg\:us-gap-0{gap:0}.lg\:us-gap-1{gap:.25rem}.lg\:us-gap-2{gap:.5rem}.lg\:us-gap-3{gap:.75rem}.lg\:us-gap-4{gap:1rem}.lg\:us-gap-5{gap:1.25rem}.lg\:us-gap-6{gap:1.5rem}.lg\:us-gap-7{gap:1.75rem}.lg\:us-gap-8{gap:2rem}.lg\:us-gap-x-0{column-gap:0}.lg\:us-gap-x-1{column-gap:.25rem}.lg\:us-gap-x-2{column-gap:.5rem}.lg\:us-gap-x-3{column-gap:.75rem}.lg\:us-gap-x-4{column-gap:1rem}.lg\:us-gap-x-5{column-gap:1.25rem}.lg\:us-gap-x-6{column-gap:1.5rem}.lg\:us-gap-x-7{column-gap:1.75rem}.lg\:us-gap-x-8{column-gap:2rem}.lg\:us-gap-y-0{row-gap:0}.lg\:us-gap-y-1{row-gap:.25rem}.lg\:us-gap-y-2{row-gap:.5rem}.lg\:us-gap-y-3{row-gap:.75rem}.lg\:us-gap-y-4{row-gap:1rem}.lg\:us-gap-y-5{row-gap:1.25rem}.lg\:us-gap-y-6{row-gap:1.5rem}.lg\:us-gap-y-7{row-gap:1.75rem}.lg\:us-gap-y-8{row-gap:2rem}}@media screen and (min-width: 1904px){.xl\:us-h-full{height:100%}.xl\:us-h-screen{height:100dvh}.xl\:us-overflow-auto{overflow:auto}.xl\:us-overflow-hidden{overflow:hidden}.xl\:us-d-block{display:block}.xl\:us-d-inline{display:inline}.xl\:us-d-flex{display:flex}.xl\:us-d-grid{display:grid}.xl\:us-d-contents{display:contents}.xl\:us-d-none{display:none}.xl\:us-flex-row{flex-direction:row}.xl\:us-flex-row-reverse{flex-direction:row-reverse}.xl\:us-flex-col{flex-direction:column}.xl\:us-flex-col-reverse{flex-direction:column-reverse}.xl\:us-flex-nowrap{flex-wrap:nowrap}.xl\:us-flex-wrap{flex-wrap:wrap}.xl\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.xl\:us-grow-0{flex-grow:0}.xl\:us-grow-1{flex-grow:1}.xl\:us-shrink-0{flex-shrink:0}.xl\:us-shrink-1{flex-shrink:1}.xl\:us-justify-start{justify-content:flex-start}.xl\:us-justify-end{justify-content:flex-end}.xl\:us-justify-center{justify-content:center}.xl\:us-justify-between{justify-content:space-between}.xl\:us-justify-around{justify-content:space-around}.xl\:us-justify-evenly{justify-content:space-evenly}.xl\:us-items-start{align-items:flex-start}.xl\:us-items-end{align-items:flex-end}.xl\:us-items-center{align-items:center}.xl\:us-items-stretch{align-items:stretch}.xl\:us-items-baseline{align-items:baseline}.xl\:us-gap-0{gap:0}.xl\:us-gap-1{gap:.25rem}.xl\:us-gap-2{gap:.5rem}.xl\:us-gap-3{gap:.75rem}.xl\:us-gap-4{gap:1rem}.xl\:us-gap-5{gap:1.25rem}.xl\:us-gap-6{gap:1.5rem}.xl\:us-gap-7{gap:1.75rem}.xl\:us-gap-8{gap:2rem}.xl\:us-gap-x-0{column-gap:0}.xl\:us-gap-x-1{column-gap:.25rem}.xl\:us-gap-x-2{column-gap:.5rem}.xl\:us-gap-x-3{column-gap:.75rem}.xl\:us-gap-x-4{column-gap:1rem}.xl\:us-gap-x-5{column-gap:1.25rem}.xl\:us-gap-x-6{column-gap:1.5rem}.xl\:us-gap-x-7{column-gap:1.75rem}.xl\:us-gap-x-8{column-gap:2rem}.xl\:us-gap-y-0{row-gap:0}.xl\:us-gap-y-1{row-gap:.25rem}.xl\:us-gap-y-2{row-gap:.5rem}.xl\:us-gap-y-3{row-gap:.75rem}.xl\:us-gap-y-4{row-gap:1rem}.xl\:us-gap-y-5{row-gap:1.25rem}.xl\:us-gap-y-6{row-gap:1.5rem}.xl\:us-gap-y-7{row-gap:1.75rem}.xl\:us-gap-y-8{row-gap:2rem}}.us-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.us-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.slider-container{width:300px;height:20px;background-color:#ccc;position:relative;margin-top:20px}.slider-point{width:20px;height:20px;background-color:#007bff;border-radius:50%;position:absolute;cursor:pointer}
1
+ .us-toolbar{position:relative;width:100%;padding:var(--us-toolbar-padding-y) var(--us-toolbar-padding-x);border-bottom:var(--us-toolbar-border);background:var(--us-toolbar-background);display:flex;align-items:center}.us-toolbar>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-toolbar:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-toolbar:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-toolbar>.us-outline-b{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;border-bottom:var(--us-outline-border-width) solid var(--us-outline-border-color)}.us-toolbar__container{width:100%;min-height:var(--us-toolbar-min-height);margin:0 auto;display:flex;align-items:center;gap:.5rem;z-index:1}.us-toolbar__start-action,.us-toolbar__end-action{flex-shrink:0}.us-toolbar__content{flex-grow:1;overflow:hidden;display:flex;flex-direction:column}.us-toolbar__title{font-size:var(--us-toolbar-title-font-size);font-weight:var(--us-toolbar-title-font-weight);text-decoration:none;color:inherit;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.us-badge{min-width:var(--us-badge-min-width);min-height:var(--us-badge-min-height);padding-block:var(--us-badge-padding-y);padding-block:var(--us-badge-padding-y);padding-inline:var(--us-badge-padding-x);font-size:var(--us-badge-font-size);font-weight:var(--us-badge-font-weight);line-height:var(--us-badge-line-height);border:var(--us-badge-border-width) solid var(--us-badge-border-color);border-radius:var(--us-badge-border-radius);color:var(--us-badge-color);background-color:var(--us-badge-background);display:inline-flex;justify-content:center;align-items:center}.us-badge>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-badge:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-badge:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-badge-wrapper{flex-shrink:0;position:relative;display:inline-flex}.us-badge-wrapper .us-badge{position:absolute}.us-badge-wrapper .us-badge--top-left{top:10%;left:10%}.us-badge-wrapper .us-badge--top-right{right:0;top:0;transform:translate(50%, -50%)}.us-badge-wrapper .us-badge--bottom-left{bottom:10%;left:10%}.us-badge-wrapper .us-badge--bottom-right{bottom:0;right:0}.us-collapse{overflow:hidden;transition:all .15s ease-in-out}.us-icon{width:1em;height:1em;font-size:var(--us-icon-font-size);color:var(--us-icon-color);display:flex;justify-content:center;align-items:center}.us-chip{position:relative;height:var(--us-chip-height);padding:var(--us-chip-padding-y) var(--us-chip-padding-x);font-size:var(--us-chip-font-size);font-weight:var(--us-chip-font-weight);font-family:var(--us-chip-font-family);border-radius:var(--us-chip-border-radius);color:var(--us-chip-color);background-color:var(--us-chip-background);display:inline-flex;align-items:center;gap:var(--us-chip-gap)}.us-chip>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-chip:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-chip:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-chip>.us-outline{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;border-width:var(--us-outline-border-width);border-style:solid;border-color:var(--us-outline-border-color);opacity:var(--us-outline-opacity);pointer-events:none}.us-chip:hover>.us-outline{border-width:var(--us-outline-hover-border-width, var(--us-outline-border-width));border-color:var(--us-outline-hover-border-color, var(--us-outline-border-color));opacity:var(--us-outline-hover-opacity, var(--us-outline-opacity))}.us-chip:active>.us-outline{border-width:var(--us-outline-active-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-active-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-active-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-chip--focus>.us-outline,.us-chip--focus:hover>.us-outline,.us-chip:focus>.us-outline{border-width:var(--us-outline-focus-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-focus-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-focus-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-button{position:relative;height:var(--us-button-height);padding:var(--us-button-padding-y) var(--us-button-padding-x);font-size:var(--us-button-font-size);font-weight:var(--us-button-font-weight);font-family:var(--us-button-font-family);white-space:nowrap;border:none;outline:none;border-radius:var(--us-button-border-radius);cursor:pointer;color:var(--us-button-color);background-color:var(--us-button-background);z-index:0;display:inline-flex;justify-content:center;align-items:center;gap:var(--us-button-gap);user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-button:hover{text-decoration:none}.us-button>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-button:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-button:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-button>.us-outline{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;border-width:var(--us-outline-border-width);border-style:solid;border-color:var(--us-outline-border-color);opacity:var(--us-outline-opacity);pointer-events:none}.us-button:hover>.us-outline{border-width:var(--us-outline-hover-border-width, var(--us-outline-border-width));border-color:var(--us-outline-hover-border-color, var(--us-outline-border-color));opacity:var(--us-outline-hover-opacity, var(--us-outline-opacity))}.us-button:active>.us-outline{border-width:var(--us-outline-active-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-active-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-active-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-button--focus>.us-outline,.us-button--focus:hover>.us-outline,.us-button:focus>.us-outline{border-width:var(--us-outline-focus-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-focus-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-focus-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-button--block{width:100%}.us-button--disabled{opacity:.6;pointer-events:none}.us-button--icon-only{width:var(--us-button-height);padding:0;border-radius:9999px;justify-content:center}.us-button__outline{position:absolute;inset:0px;z-index:0;border:var(--us-button-outline-border-width) solid var(--us-button-outline-border-color);border-radius:inherit;pointer-events:none}.us-button__start-icon,.us-button__end-icon,.us-button__content{position:relative;display:flex;align-items:center}.us-scroll-area__track{position:absolute;border-radius:3px;right:2px;bottom:2px}.us-scroll-area__track--horizontal{height:6px;left:2px}.us-scroll-area__track--vertical{width:6px;top:2px}.us-scroll-area__thumb{position:relative;display:block;cursor:pointer;border-radius:inherit;background-color:rgba(0,0,0,.2);transform:translateX(0px)}.us-scroll-area__thumb--horizontal{height:100%;width:105px}.us-scroll-area__thumb--vertical{width:100%;height:463px}.us-backdrop{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:20;display:flex;justify-content:center;align-items:center}.us-backdrop-enter{opacity:0}.us-backdrop-enter-active{opacity:1;transition:opacity 100ms}.us-backdrop-exit{opacity:1}.us-backdrop-exit-active{opacity:0;transition:opacity 200ms;transition-delay:300ms}.us-backdrop__overlay{position:absolute;width:100%;height:100%;z-index:-10;background-color:rgba(0,0,0,.6)}.us-popover{min-width:240px;position:absolute;border-radius:6px;box-shadow:rgba(0,0,59,.05) 0px 0px 0px 1px,rgba(1,1,46,.133) 0px 12px 60px 0px,rgba(0,0,0,.133) 0px 12px 32px -16px;background-color:#fff;overflow:hidden;z-index:1060;display:flex;flex-direction:column}.us-popover__overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;border-radius:inherit;background-color:#fff;opacity:1;z-index:0}.us-popover-enter{opacity:0;transform:scale(0.9)}.us-popover-enter-active{opacity:1;transform:scale(1);transition:opacity 100ms,transform 200ms}.us-popover-exit{opacity:1;transform:scale(1)}.us-popover-exit-active{opacity:0;transform:scale(0.9);transition:opacity 150ms,transform 150ms}.us-drawer{position:absolute;max-width:var(--us-drawer-width);width:100%;height:100%;background-color:var(--us-drawer-background);display:flex;flex-direction:column}.us-drawer-appear,.us-drawer-enter{opacity:0;transform:translateX(-100%)}.us-drawer-appear-active,.us-drawer-enter-active{opacity:1;transform:translateX(0%);transition:opacity 100ms,transform 200ms;transition-delay:300ms}.us-drawer-exit{opacity:1;transform:translateX(0%)}.us-drawer-exit-active{opacity:0;transform:translateX(-100%);transition:opacity 300ms,transform 300ms}.us-drawer--left,.us-drawer--right{max-width:calc(100% - 2rem);max-height:100%}.us-drawer--left{left:0}.us-drawer--left.us-drawer-appear,.us-drawer--left.us-drawer-enter{transform:translateX(-100%)}.us-drawer--left.us-drawer-appear-active,.us-drawer--left.us-drawer-enter-active{transform:translateX(0%)}.us-drawer--left.us-drawer-exit{transform:translateX(0%)}.us-drawer--left.us-drawer-exit-active{transform:translateX(-100%)}.us-drawer--right.us-drawer-appear,.us-drawer--right.us-drawer-enter{transform:translateX(100%)}.us-drawer--right{right:0}.us-drawer--right.us-drawer-appear-active,.us-drawer--right.us-drawer-enter-active{transform:translateX(0%)}.us-drawer--right.us-drawer-exit{transform:translateX(0%)}.us-drawer--right.us-drawer-exit-active{transform:translateX(100%)}.us-drawer--top,.us-drawer--bottom{max-width:100%;max-height:calc(100% - 2rem)}.us-drawer--top{top:0}.us-drawer--top.us-drawer-appear,.us-drawer--top.us-drawer-enter{transform:translateY(-100%)}.us-drawer--top.us-drawer-appear-active,.us-drawer--top.us-drawer-enter-active{transform:translateY(0%)}.us-drawer--top.us-drawer-exit{transform:translateY(0%)}.us-drawer--top.us-drawer-exit-active{transform:translateY(-100%)}.us-drawer--bottom{bottom:0}.us-drawer--bottom.us-drawer-appear,.us-drawer--bottom.us-drawer-enter{transform:translateY(100%)}.us-drawer--bottom.us-drawer-appear-active,.us-drawer--bottom.us-drawer-enter-active{transform:translateY(0%)}.us-drawer--bottom.us-drawer-exit{transform:translateY(0%)}.us-drawer--bottom.us-drawer-exit-active{transform:translateY(100%)}@media screen and (min-width: 768px){.us-drawer--left,.us-drawer--right{max-width:var(--us-drawer-width);max-height:100%}.us-drawer--top,.us-drawer--bottom{max-width:100%;max-height:var(--us-drawer-width)}}.us-input{position:relative;width:100%;padding:0;height:var(--us-input-height);display:flex;align-items:center;border:none;border-radius:var(--us-input-border-radius);color:var(--us-input-color);background-color:var(--us-input-background)}.us-input:focus-visible{outline:none}.us-input:not(.us-input--filterable){cursor:pointer}.us-input>.us-outline{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;border-width:var(--us-outline-border-width);border-style:solid;border-color:var(--us-outline-border-color);opacity:var(--us-outline-opacity);pointer-events:none}.us-input:hover>.us-outline{border-width:var(--us-outline-hover-border-width, var(--us-outline-border-width));border-color:var(--us-outline-hover-border-color, var(--us-outline-border-color));opacity:var(--us-outline-hover-opacity, var(--us-outline-opacity))}.us-input:active>.us-outline{border-width:var(--us-outline-active-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-active-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-active-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-input--focus>.us-outline,.us-input--focus:hover>.us-outline,.us-input:focus>.us-outline{border-width:var(--us-outline-focus-border-width, var(--us-outline-hover-border-width, var(--us-outline-border-width)));border-color:var(--us-outline-focus-border-color, var(--us-outline-hover-border-color, var(--us-outline-border-color)));opacity:var(--us-outline-focus-opacity, var(--us-outline-hover-opacity, var(--us-outline-opacity)))}.us-input--disabled{opacity:.75;pointer-events:none}.us-input--clearable .us-input__clearable{transform:scale(0);transition:all .2s ease-in-out}.us-input--clearable:hover .us-input__clearable{transform:scale(0.75)}.us-input__clearable{display:flex;justify-content:center;align-items:center}.us-input__content{flex:1;height:100%;display:flex;align-items:center;z-index:1}.us-input__field{flex:1;width:100%;height:100%;padding:var(--us-input-padding-y) var(--us-input-padding-x);font-size:var(--us-input-font-size);font-family:var(--us-input-font-family);line-height:var(--us-input-line-height);border:none;outline:none;color:var(--us-input-color);background-color:rgba(0,0,0,0);display:flex;align-items:center}.us-input__field:focus{outline:none !important}.us-input__search{flex:1;width:100%;padding:var(--us-input-padding-y) var(--us-input-padding-x);font-size:var(--us-input-font-size);font-family:var(--us-input-font-family);line-height:var(--us-input-line-height);color:var(--us-input-color);overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-input__start-content,.us-input__end-content{flex-shrink:0;display:flex;align-items:center}.us-input__start-content .us-icon,.us-input__end-content .us-icon{font-size:var(--us-input-icon-size)}.us-input__start-content{margin-right:calc(-1*var(--us-input-icon-size));padding:var(--us-input-padding-y) calc(.75*var(--us-input-padding-x))}.us-input__end-content{margin-left:calc(-1*var(--us-input-icon-size));padding:var(--us-input-padding-y) calc(.75*var(--us-input-padding-x))}.us-switch{position:relative;display:inline-block;width:var(--us-switch-width);padding-block:var(--us-switch-padding-y);border-radius:var(--us-switch-border-radius);cursor:pointer;background-color:var(--us-switch-color);display:inline-flex;align-items:center;transition:all .2s ease-in-out;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-switch input{position:absolute;opacity:0;width:0;height:0}.us-switch--checked .us-switch__thumb{transform:translateX(calc(var(--us-switch-width) - var(--us-switch-thumb-width) - (var(--us-switch-padding-x))))}.us-switch__thumb{width:var(--us-switch-thumb-width);height:var(--us-switch-thumb-height);transform:translateX(var(--us-switch-padding-x));border-radius:var(--us-switch-thumb-border-radius);background-color:var(--us-switch-thumb-color);transition:all .2s ease-in-out}.us-accordion-item{border-bottom:1px solid #e6e6e6}.us-accordion-item:last-child{border-bottom:none}.us-accordion-header{height:var(--us-accordion-header-height);min-height:var(--us-accordion-header-min-height);padding-block:var(--us-accordion-header-padding-y);padding-inline:var(--us-accordion-header-padding-x);display:flex;align-items:center;gap:var(--us-accordion-header-gap)}.us-accordion-header--collapsible{cursor:pointer;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-accordion-header__start-content,.us-accordion-header__end-content{flex-shrink:0}.us-accordion-header__content{flex-grow:1;display:flex;flex-direction:column;gap:var(--us-accordion-header-content-gap)}.us-accordion-header__title{font-size:var(--us-accordion-header-title-font-size);font-weight:var(--us-accordion-header-title-font-weight);line-height:var(--us-accordion-header-title-line-height);overflow:hidden;color:var(--us-accordion-header-title-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-accordion-header__subtitle{font-size:var(--us-accordion-header-subtitle-font-size);font-weight:var(--us-accordion-header-subtitle-font-weight);line-height:var(--us-accordion-header-subtitle-line-height);overflow:hidden;color:var(--us-accordion-header-subtitle-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-accordion-header:not(.us-accordion-header--bordered)~.us-accordion-body:not([data-hidden=true]),.us-accordion-header:not(.us-accordion-header--bordered)~:not([hidden]) .us-accordion-body:not([data-hidden=true]){padding-top:0}.us-accordion-header--bordered~.us-accordion-body:not([data-hidden=true]),.us-accordion-header--bordered~:not([hidden]) .us-accordion-body:not([data-hidden=true]){border-top-width:1px}.us-accordion-body{border-top:0px solid #ddd;padding-block:var(--us-accordion-body-padding-y);padding-inline:var(--us-accordion-body-padding-x);font-size:var(--us-accordion-body-font-size);line-height:var(--us-accordion-body-line-height);color:var(--us-accordion-body-color)}.us-accordion-panel{padding:1rem}.us-list{margin:0;padding:var(--us-list-padding-y) var(--us-list-padding-x);color:var(--us-list-color);background-color:var(--us-list-background)}.us-list-item{position:relative;height:var(--us-list-item-height);min-height:var(--us-list-item-min-height);padding-block:var(--us-list-item-padding-y);padding-inline:var(--us-list-item-padding-x);font-size:var(--us-list-item-font-size);font-weight:var(--us-list-item-font-weight);border-radius:var(--us-list-item-border-radius);text-decoration:none;z-index:0;display:flex;align-items:center;color:var(--us-list-item-color);background-color:var(--us-list-item-background);-webkit-tap-highlight-color:rgba(0,0,0,0);gap:var(--us-list-item-gap)}.us-list-item:hover{text-decoration:none}.us-list-item>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-list-item:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-list-item:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-list-item--hoverable,.us-list-item--selected{cursor:pointer;user-select:none}.us-list-item--disabled{opacity:.6;cursor:not-allowed;user-select:none}.us-list-item__start-content,.us-list-item__end-content{flex-shrink:0;z-index:1;display:flex;justify-content:center;align-items:center;gap:calc(var(--us-list-item-gap)*.5)}.us-list-item__content{flex-grow:1;z-index:1;display:grid;overflow:hidden}.us-list-item__title{font-size:var(--us-list-item-title-font-size);font-weight:var(--us-list-item-title-font-weight);line-height:var(--us-list-item-title-line-height);opacity:var(--us-list-item-title-opacity);overflow:hidden;color:var(--us-list-item-title-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-list-item__subtitle{font-size:var(--us-list-item-subtitle-font-size);font-weight:var(--us-list-item-subtitle-font-weight);line-height:var(--us-list-item-subtitle-line-height);opacity:var(--us-list-item-subtitle-opacity);overflow:hidden;color:var(--us-list-item-subtitle-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-list-subheader--bordered{border-bottom:var(--us-list-subheader-border-width) solid var(--us-list-subheader-border-color)}.us-list-group .us-list{--us-list-background: var(--us-list-group-background)}.us-menu{margin:0;padding:var(--us-menu-padding-y) var(--us-menu-padding-x);color:var(--us-menu-color);background-color:var(--us-menu-background)}.us-menu-item{position:relative;height:var(--us-menu-item-height);padding:var(--us-menu-item-padding-y) var(--us-menu-item-padding-x);font-size:var(--us-menu-item-font-size);font-weight:var(--us-menu-item-font-weight);border-radius:var(--us-menu-item-border-radius);text-decoration:none;cursor:pointer;z-index:0;display:flex;align-items:center;color:var(--us-menu-item-color);background-color:var(--us-menu-item-background);user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);gap:var(--us-menu-item-gap)}.us-menu-item:hover{text-decoration:none}.us-menu-item>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-menu-item:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-menu-item:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-menu-item--hoverable{cursor:pointer;user-select:none}.us-menu-item--disabled{opacity:.6;pointer-events:none}.us-menu-item__start-content{flex-shrink:0;z-index:1;display:flex;justify-content:center;align-items:center}.us-menu-item__start-content,.us-menu-item__end-content{flex-shrink:0;z-index:1;display:flex;justify-content:center;align-items:center;gap:calc(var(--us-list-item-gap)*.5)}.us-menu-item__content{flex-grow:1;z-index:1;display:grid;overflow:hidden}.us-menu-item__title{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-menu-group{position:relative;height:var(--us-menu-group-height);padding:var(--us-menu-group-padding-y) var(--us-menu-group-padding-x);font-size:var(--us-menu-group-font-size);font-weight:var(--us-menu-group-font-weight);text-decoration:none;border-bottom:var(--us-menu-group-border-width) solid var(--us-menu-group-border-color);border-radius:var(--us-menu-group-border-radius);display:flex;align-items:center;color:var(--us-menu-group-color);background-color:var(--us-menu-group-background);gap:var(--us-menu-group-gap)}.us-menu-group:hover{text-decoration:none}.us-menu-group>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-menu-group:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-menu-group:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-menu-group__icon{flex-shrink:0;z-index:1;display:flex;justify-content:center;align-items:center}.us-menu-group__content{flex-grow:1;z-index:1;display:grid;overflow:hidden}.us-menu-group__title{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-menu-submenu .us-menu{--us-menu-background: var(--us-submenu-background)}.us-divider{width:100%;height:1px;background:#cac4d0}.us-breadcrumb{padding:.5rem 0;font-size:.875rem;display:flex;align-items:center;gap:0}.us-breadcrumb-item{padding:.25rem .5rem;white-space:nowrap;display:flex;align-items:center}.us-breadcrumb-item:not(.us-breadcrumb-item--is-menu){line-height:32px}.us-swipe{position:relative;overflow-x:hidden;display:flex;align-items:center;gap:var(--us-swipe-gap)}@media(max-width: 767px)and (hover: none){.us-swipe{overflow:auto}}.us-swipe-wrapper{position:relative}.us-swipe-wrapper__left,.us-swipe-wrapper__right{position:absolute;top:50%;transform:translateY(-50%);z-index:1}.us-swipe-wrapper__left{left:-1.25rem}.us-swipe-wrapper__right{right:-1.25rem}.us-swipe-wrapper--auto-hide .us-swipe-wrapper__left,.us-swipe-wrapper--auto-hide .us-swipe-wrapper__right{transform:translateY(-50%) scale(0);transition:all .2s ease-in-out}.us-swipe-wrapper--auto-hide:hover .us-swipe-wrapper__left,.us-swipe-wrapper--auto-hide:hover .us-swipe-wrapper__right{transform:translateY(-50%) scale(1)}.us-swipe--start .us-swipe-item:last-child{margin-right:auto}.us-swipe--center .us-swipe-item:first-child{margin-left:auto}.us-swipe--center .us-swipe-item:last-child{margin-right:auto}.us-swipe--end .us-swipe-item:first-child{margin-left:auto}.us-swipe-item{flex-shrink:0;position:relative}.us-tabs{width:100%;white-space:nowrap;display:flex;align-items:center}.us-tabs--start{justify-content:flex-start}.us-tabs--center{justify-content:center}.us-tabs--end{justify-content:flex-end}.us-tabs--stretch .us-tab{flex-grow:1}@media(max-width: 767px)and (hover: none){.us-tabs{overflow:auto}}.us-tab{position:relative;padding:0px 16px;font-size:var(--us-tab-font-size);font-weight:var(--us-tab-font-weight);text-decoration:none;vertical-align:middle;border-radius:var(--us-tab-border-radius);z-index:1;color:var(--us-tab-color);display:inline-flex;justify-content:center;align-items:center;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-tab:hover{text-decoration:none}.us-tab>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-tab:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-tab:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-tab--disabled{opacity:.6;pointer-events:none}.us-tab__content{position:relative;height:40px;display:inline-flex;flex-direction:row;justify-content:center;align-items:center;gap:8px}.us-tab__indicator{position:absolute;height:var(--us-tab-indicator-height);border-radius:var(--us-tab-indicator-border-radius);inset:auto 0px 0px;opacity:0;z-index:-1;background:var(--us-tab-indicator-color);transform-origin:left bottom}.us-tab--selected .us-tab__indicator{opacity:1}.us-card{position:relative;border:var(--us-card-border-width) var(--us-card-border-style) var(--us-card-border-color);border-radius:var(--us-card-border-radius);z-index:0;overflow:hidden;-webkit-tap-highlight-color:rgba(0,0,0,0)}.us-card:hover{text-decoration:none}.us-card>.us-overlay{position:absolute;inset:0px;border-radius:inherit;overflow:hidden;color:var(--us-overlay-color);opacity:var(--us-overlay-opacity);z-index:-1;pointer-events:none;background-color:currentColor;transition:background-color,opacity,.1s cubic-bezier(0.215, 0.61, 0.355, 1)}.us-card:hover>.us-overlay{color:var(--us-_hover-overlay-color, var(--us-overlay-color));opacity:var(--us-_hover-overlay-opacity, var(--us-overlay-opacity))}.us-card:active>.us-overlay{color:var(--us-_active-overlay-color, var(--us-_hover-overlay-color, var(--us-overlay-color)));opacity:var(--us-_active-overlay-opacity, var(--us-_hover-overlay-opacity, var(--us-overlay-opacity)))}.us-card--hoverable,.us-card--selected{cursor:pointer;user-select:none}.us-card--disabled{opacity:.6;cursor:not-allowed;user-select:none}.us-card-header{height:var(--us-card-header-height);min-height:var(--us-card-header-min-height);padding-block:var(--us-card-header-padding-y);padding-inline:var(--us-card-header-padding-x);display:flex;align-items:center;gap:var(--us-card-header-gap)}.us-card-header__start-content,.us-card-header__end-content{flex-shrink:0}.us-card-header__content{flex-grow:1;display:flex;flex-direction:column;gap:var(--us-card-header-content-gap)}.us-card-header__title{font-size:var(--us-card-header-title-font-size);font-weight:var(--us-card-header-title-font-weight);line-height:var(--us-card-header-title-line-height);overflow:hidden;color:var(--us-card-header-title-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-card-header__subtitle{font-size:var(--us-card-header-subtitle-font-size);font-weight:var(--us-card-header-subtitle-font-weight);line-height:var(--us-card-header-subtitle-line-height);overflow:hidden;color:var(--us-card-header-subtitle-color);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-card-header:not(.us-card-header--bordered)~.us-card-body:not([data-hidden=true]){padding-top:0}.us-card-header--bordered~.us-card-body:not([data-hidden=true]){border-top-width:1px}.us-card-body{border-top:0px solid #ddd;padding:var(--us-card-body-padding-y) var(--us-card-body-padding-x);font-size:var(--us-card-body-font-size);line-height:var(--us-card-body-line-height);color:var(--us-card-body-color)}.us-result{flex-grow:1;width:100%;padding-block:var(--us-result-padding-y);padding-inline:var(--us-result-padding-x);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--us-result-gap)}.us-result__content{text-align:center;display:flex;flex-direction:column;gap:var(--us-result-content-gap)}.us-result__title{font-size:var(--us-result-title-font-size);font-weight:var(--us-result-title-font-weight)}.us-result__subtitle{font-size:var(--us-result-subtitle-font-size);font-weight:var(--us-result-subtitle-font-weight)}.us-result__icon>.us-icon{--us-icon-font-size: 4.5rem}.us-result--warning .us-result__icon>.us-icon{--us-icon-color: var(--us-warning-color)}.us-animation-spin{animation:us-animation-spin 1s linear infinite;transform-origin:center center}@keyframes us-animation-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.us-animation-pulse{animation:us-animation-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}@keyframes us-animation-pulse{0%,100%{opacity:1}50%{opacity:.5}}.us-animation-bounce{animation:us-animation-bounce 1s infinite}@keyframes us-animation-bounce{0%,100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0.8, 0, 1, 1)}50%{transform:translateY(0);animation-timing-function:cubic-bezier(0, 0, 0.2, 1)}}.us-w-full{width:100%}.us-w-screen{width:100vh}.us-h-full{height:100%}.us-h-screen{height:100dvh}.us-overflow-auto{overflow:auto}.us-overflow-hidden{overflow:hidden}.us-d-block{display:block}.us-d-inline{display:inline}.us-d-flex{display:flex}.us-d-grid{display:grid}.us-d-contents{display:contents}.us-d-none{display:none}.us-flex-row{flex-direction:row}.us-flex-row-reverse{flex-direction:row-reverse}.us-flex-col{flex-direction:column}.us-flex-col-reverse{flex-direction:column-reverse}.us-flex-nowrap{flex-wrap:nowrap}.us-flex-wrap{flex-wrap:wrap}.us-flex-wrap-reverse{flex-wrap:wrap-reverse}.us-grow-0{flex-grow:0}.us-grow-1{flex-grow:1}.us-shrink-0{flex-shrink:0}.us-shrink-1{flex-shrink:1}.us-justify-start{justify-content:flex-start}.us-justify-end{justify-content:flex-end}.us-justify-center{justify-content:center}.us-justify-between{justify-content:space-between}.us-justify-around{justify-content:space-around}.us-justify-evenly{justify-content:space-evenly}.us-items-start{align-items:flex-start}.us-items-end{align-items:flex-end}.us-items-center{align-items:center}.us-items-stretch{align-items:stretch}.us-items-baseline{align-items:baseline}.us-gap-0{gap:0}.us-gap-1{gap:.25rem}.us-gap-2{gap:.5rem}.us-gap-3{gap:.75rem}.us-gap-4{gap:1rem}.us-gap-5{gap:1.25rem}.us-gap-6{gap:1.5rem}.us-gap-7{gap:1.75rem}.us-gap-8{gap:2rem}.us-gap-x-0{column-gap:0}.us-gap-x-1{column-gap:.25rem}.us-gap-x-2{column-gap:.5rem}.us-gap-x-3{column-gap:.75rem}.us-gap-x-4{column-gap:1rem}.us-gap-x-5{column-gap:1.25rem}.us-gap-x-6{column-gap:1.5rem}.us-gap-x-7{column-gap:1.75rem}.us-gap-x-8{column-gap:2rem}.us-gap-y-0{row-gap:0}.us-gap-y-1{row-gap:.25rem}.us-gap-y-2{row-gap:.5rem}.us-gap-y-3{row-gap:.75rem}.us-gap-y-4{row-gap:1rem}.us-gap-y-5{row-gap:1.25rem}.us-gap-y-6{row-gap:1.5rem}.us-gap-y-7{row-gap:1.75rem}.us-gap-y-8{row-gap:2rem}@media screen and (min-width: 0px){.xs\:us-h-full{height:100%}.xs\:us-h-screen{height:100dvh}.xs\:us-overflow-auto{overflow:auto}.xs\:us-overflow-hidden{overflow:hidden}.xs\:us-d-block{display:block}.xs\:us-d-inline{display:inline}.xs\:us-d-flex{display:flex}.xs\:us-d-grid{display:grid}.xs\:us-d-contents{display:contents}.xs\:us-d-none{display:none}.xs\:us-flex-row{flex-direction:row}.xs\:us-flex-row-reverse{flex-direction:row-reverse}.xs\:us-flex-col{flex-direction:column}.xs\:us-flex-col-reverse{flex-direction:column-reverse}.xs\:us-flex-nowrap{flex-wrap:nowrap}.xs\:us-flex-wrap{flex-wrap:wrap}.xs\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.xs\:us-grow-0{flex-grow:0}.xs\:us-grow-1{flex-grow:1}.xs\:us-shrink-0{flex-shrink:0}.xs\:us-shrink-1{flex-shrink:1}.xs\:us-justify-start{justify-content:flex-start}.xs\:us-justify-end{justify-content:flex-end}.xs\:us-justify-center{justify-content:center}.xs\:us-justify-between{justify-content:space-between}.xs\:us-justify-around{justify-content:space-around}.xs\:us-justify-evenly{justify-content:space-evenly}.xs\:us-items-start{align-items:flex-start}.xs\:us-items-end{align-items:flex-end}.xs\:us-items-center{align-items:center}.xs\:us-items-stretch{align-items:stretch}.xs\:us-items-baseline{align-items:baseline}.xs\:us-gap-0{gap:0}.xs\:us-gap-1{gap:.25rem}.xs\:us-gap-2{gap:.5rem}.xs\:us-gap-3{gap:.75rem}.xs\:us-gap-4{gap:1rem}.xs\:us-gap-5{gap:1.25rem}.xs\:us-gap-6{gap:1.5rem}.xs\:us-gap-7{gap:1.75rem}.xs\:us-gap-8{gap:2rem}.xs\:us-gap-x-0{column-gap:0}.xs\:us-gap-x-1{column-gap:.25rem}.xs\:us-gap-x-2{column-gap:.5rem}.xs\:us-gap-x-3{column-gap:.75rem}.xs\:us-gap-x-4{column-gap:1rem}.xs\:us-gap-x-5{column-gap:1.25rem}.xs\:us-gap-x-6{column-gap:1.5rem}.xs\:us-gap-x-7{column-gap:1.75rem}.xs\:us-gap-x-8{column-gap:2rem}.xs\:us-gap-y-0{row-gap:0}.xs\:us-gap-y-1{row-gap:.25rem}.xs\:us-gap-y-2{row-gap:.5rem}.xs\:us-gap-y-3{row-gap:.75rem}.xs\:us-gap-y-4{row-gap:1rem}.xs\:us-gap-y-5{row-gap:1.25rem}.xs\:us-gap-y-6{row-gap:1.5rem}.xs\:us-gap-y-7{row-gap:1.75rem}.xs\:us-gap-y-8{row-gap:2rem}}@media screen and (min-width: 600px){.sm\:us-h-full{height:100%}.sm\:us-h-screen{height:100dvh}.sm\:us-overflow-auto{overflow:auto}.sm\:us-overflow-hidden{overflow:hidden}.sm\:us-d-block{display:block}.sm\:us-d-inline{display:inline}.sm\:us-d-flex{display:flex}.sm\:us-d-grid{display:grid}.sm\:us-d-contents{display:contents}.sm\:us-d-none{display:none}.sm\:us-flex-row{flex-direction:row}.sm\:us-flex-row-reverse{flex-direction:row-reverse}.sm\:us-flex-col{flex-direction:column}.sm\:us-flex-col-reverse{flex-direction:column-reverse}.sm\:us-flex-nowrap{flex-wrap:nowrap}.sm\:us-flex-wrap{flex-wrap:wrap}.sm\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.sm\:us-grow-0{flex-grow:0}.sm\:us-grow-1{flex-grow:1}.sm\:us-shrink-0{flex-shrink:0}.sm\:us-shrink-1{flex-shrink:1}.sm\:us-justify-start{justify-content:flex-start}.sm\:us-justify-end{justify-content:flex-end}.sm\:us-justify-center{justify-content:center}.sm\:us-justify-between{justify-content:space-between}.sm\:us-justify-around{justify-content:space-around}.sm\:us-justify-evenly{justify-content:space-evenly}.sm\:us-items-start{align-items:flex-start}.sm\:us-items-end{align-items:flex-end}.sm\:us-items-center{align-items:center}.sm\:us-items-stretch{align-items:stretch}.sm\:us-items-baseline{align-items:baseline}.sm\:us-gap-0{gap:0}.sm\:us-gap-1{gap:.25rem}.sm\:us-gap-2{gap:.5rem}.sm\:us-gap-3{gap:.75rem}.sm\:us-gap-4{gap:1rem}.sm\:us-gap-5{gap:1.25rem}.sm\:us-gap-6{gap:1.5rem}.sm\:us-gap-7{gap:1.75rem}.sm\:us-gap-8{gap:2rem}.sm\:us-gap-x-0{column-gap:0}.sm\:us-gap-x-1{column-gap:.25rem}.sm\:us-gap-x-2{column-gap:.5rem}.sm\:us-gap-x-3{column-gap:.75rem}.sm\:us-gap-x-4{column-gap:1rem}.sm\:us-gap-x-5{column-gap:1.25rem}.sm\:us-gap-x-6{column-gap:1.5rem}.sm\:us-gap-x-7{column-gap:1.75rem}.sm\:us-gap-x-8{column-gap:2rem}.sm\:us-gap-y-0{row-gap:0}.sm\:us-gap-y-1{row-gap:.25rem}.sm\:us-gap-y-2{row-gap:.5rem}.sm\:us-gap-y-3{row-gap:.75rem}.sm\:us-gap-y-4{row-gap:1rem}.sm\:us-gap-y-5{row-gap:1.25rem}.sm\:us-gap-y-6{row-gap:1.5rem}.sm\:us-gap-y-7{row-gap:1.75rem}.sm\:us-gap-y-8{row-gap:2rem}}@media screen and (min-width: 960px){.md\:us-h-full{height:100%}.md\:us-h-screen{height:100dvh}.md\:us-overflow-auto{overflow:auto}.md\:us-overflow-hidden{overflow:hidden}.md\:us-d-block{display:block}.md\:us-d-inline{display:inline}.md\:us-d-flex{display:flex}.md\:us-d-grid{display:grid}.md\:us-d-contents{display:contents}.md\:us-d-none{display:none}.md\:us-flex-row{flex-direction:row}.md\:us-flex-row-reverse{flex-direction:row-reverse}.md\:us-flex-col{flex-direction:column}.md\:us-flex-col-reverse{flex-direction:column-reverse}.md\:us-flex-nowrap{flex-wrap:nowrap}.md\:us-flex-wrap{flex-wrap:wrap}.md\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.md\:us-grow-0{flex-grow:0}.md\:us-grow-1{flex-grow:1}.md\:us-shrink-0{flex-shrink:0}.md\:us-shrink-1{flex-shrink:1}.md\:us-justify-start{justify-content:flex-start}.md\:us-justify-end{justify-content:flex-end}.md\:us-justify-center{justify-content:center}.md\:us-justify-between{justify-content:space-between}.md\:us-justify-around{justify-content:space-around}.md\:us-justify-evenly{justify-content:space-evenly}.md\:us-items-start{align-items:flex-start}.md\:us-items-end{align-items:flex-end}.md\:us-items-center{align-items:center}.md\:us-items-stretch{align-items:stretch}.md\:us-items-baseline{align-items:baseline}.md\:us-gap-0{gap:0}.md\:us-gap-1{gap:.25rem}.md\:us-gap-2{gap:.5rem}.md\:us-gap-3{gap:.75rem}.md\:us-gap-4{gap:1rem}.md\:us-gap-5{gap:1.25rem}.md\:us-gap-6{gap:1.5rem}.md\:us-gap-7{gap:1.75rem}.md\:us-gap-8{gap:2rem}.md\:us-gap-x-0{column-gap:0}.md\:us-gap-x-1{column-gap:.25rem}.md\:us-gap-x-2{column-gap:.5rem}.md\:us-gap-x-3{column-gap:.75rem}.md\:us-gap-x-4{column-gap:1rem}.md\:us-gap-x-5{column-gap:1.25rem}.md\:us-gap-x-6{column-gap:1.5rem}.md\:us-gap-x-7{column-gap:1.75rem}.md\:us-gap-x-8{column-gap:2rem}.md\:us-gap-y-0{row-gap:0}.md\:us-gap-y-1{row-gap:.25rem}.md\:us-gap-y-2{row-gap:.5rem}.md\:us-gap-y-3{row-gap:.75rem}.md\:us-gap-y-4{row-gap:1rem}.md\:us-gap-y-5{row-gap:1.25rem}.md\:us-gap-y-6{row-gap:1.5rem}.md\:us-gap-y-7{row-gap:1.75rem}.md\:us-gap-y-8{row-gap:2rem}}@media screen and (min-width: 1264px){.lg\:us-h-full{height:100%}.lg\:us-h-screen{height:100dvh}.lg\:us-overflow-auto{overflow:auto}.lg\:us-overflow-hidden{overflow:hidden}.lg\:us-d-block{display:block}.lg\:us-d-inline{display:inline}.lg\:us-d-flex{display:flex}.lg\:us-d-grid{display:grid}.lg\:us-d-contents{display:contents}.lg\:us-d-none{display:none}.lg\:us-flex-row{flex-direction:row}.lg\:us-flex-row-reverse{flex-direction:row-reverse}.lg\:us-flex-col{flex-direction:column}.lg\:us-flex-col-reverse{flex-direction:column-reverse}.lg\:us-flex-nowrap{flex-wrap:nowrap}.lg\:us-flex-wrap{flex-wrap:wrap}.lg\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.lg\:us-grow-0{flex-grow:0}.lg\:us-grow-1{flex-grow:1}.lg\:us-shrink-0{flex-shrink:0}.lg\:us-shrink-1{flex-shrink:1}.lg\:us-justify-start{justify-content:flex-start}.lg\:us-justify-end{justify-content:flex-end}.lg\:us-justify-center{justify-content:center}.lg\:us-justify-between{justify-content:space-between}.lg\:us-justify-around{justify-content:space-around}.lg\:us-justify-evenly{justify-content:space-evenly}.lg\:us-items-start{align-items:flex-start}.lg\:us-items-end{align-items:flex-end}.lg\:us-items-center{align-items:center}.lg\:us-items-stretch{align-items:stretch}.lg\:us-items-baseline{align-items:baseline}.lg\:us-gap-0{gap:0}.lg\:us-gap-1{gap:.25rem}.lg\:us-gap-2{gap:.5rem}.lg\:us-gap-3{gap:.75rem}.lg\:us-gap-4{gap:1rem}.lg\:us-gap-5{gap:1.25rem}.lg\:us-gap-6{gap:1.5rem}.lg\:us-gap-7{gap:1.75rem}.lg\:us-gap-8{gap:2rem}.lg\:us-gap-x-0{column-gap:0}.lg\:us-gap-x-1{column-gap:.25rem}.lg\:us-gap-x-2{column-gap:.5rem}.lg\:us-gap-x-3{column-gap:.75rem}.lg\:us-gap-x-4{column-gap:1rem}.lg\:us-gap-x-5{column-gap:1.25rem}.lg\:us-gap-x-6{column-gap:1.5rem}.lg\:us-gap-x-7{column-gap:1.75rem}.lg\:us-gap-x-8{column-gap:2rem}.lg\:us-gap-y-0{row-gap:0}.lg\:us-gap-y-1{row-gap:.25rem}.lg\:us-gap-y-2{row-gap:.5rem}.lg\:us-gap-y-3{row-gap:.75rem}.lg\:us-gap-y-4{row-gap:1rem}.lg\:us-gap-y-5{row-gap:1.25rem}.lg\:us-gap-y-6{row-gap:1.5rem}.lg\:us-gap-y-7{row-gap:1.75rem}.lg\:us-gap-y-8{row-gap:2rem}}@media screen and (min-width: 1904px){.xl\:us-h-full{height:100%}.xl\:us-h-screen{height:100dvh}.xl\:us-overflow-auto{overflow:auto}.xl\:us-overflow-hidden{overflow:hidden}.xl\:us-d-block{display:block}.xl\:us-d-inline{display:inline}.xl\:us-d-flex{display:flex}.xl\:us-d-grid{display:grid}.xl\:us-d-contents{display:contents}.xl\:us-d-none{display:none}.xl\:us-flex-row{flex-direction:row}.xl\:us-flex-row-reverse{flex-direction:row-reverse}.xl\:us-flex-col{flex-direction:column}.xl\:us-flex-col-reverse{flex-direction:column-reverse}.xl\:us-flex-nowrap{flex-wrap:nowrap}.xl\:us-flex-wrap{flex-wrap:wrap}.xl\:us-flex-wrap-reverse{flex-wrap:wrap-reverse}.xl\:us-grow-0{flex-grow:0}.xl\:us-grow-1{flex-grow:1}.xl\:us-shrink-0{flex-shrink:0}.xl\:us-shrink-1{flex-shrink:1}.xl\:us-justify-start{justify-content:flex-start}.xl\:us-justify-end{justify-content:flex-end}.xl\:us-justify-center{justify-content:center}.xl\:us-justify-between{justify-content:space-between}.xl\:us-justify-around{justify-content:space-around}.xl\:us-justify-evenly{justify-content:space-evenly}.xl\:us-items-start{align-items:flex-start}.xl\:us-items-end{align-items:flex-end}.xl\:us-items-center{align-items:center}.xl\:us-items-stretch{align-items:stretch}.xl\:us-items-baseline{align-items:baseline}.xl\:us-gap-0{gap:0}.xl\:us-gap-1{gap:.25rem}.xl\:us-gap-2{gap:.5rem}.xl\:us-gap-3{gap:.75rem}.xl\:us-gap-4{gap:1rem}.xl\:us-gap-5{gap:1.25rem}.xl\:us-gap-6{gap:1.5rem}.xl\:us-gap-7{gap:1.75rem}.xl\:us-gap-8{gap:2rem}.xl\:us-gap-x-0{column-gap:0}.xl\:us-gap-x-1{column-gap:.25rem}.xl\:us-gap-x-2{column-gap:.5rem}.xl\:us-gap-x-3{column-gap:.75rem}.xl\:us-gap-x-4{column-gap:1rem}.xl\:us-gap-x-5{column-gap:1.25rem}.xl\:us-gap-x-6{column-gap:1.5rem}.xl\:us-gap-x-7{column-gap:1.75rem}.xl\:us-gap-x-8{column-gap:2rem}.xl\:us-gap-y-0{row-gap:0}.xl\:us-gap-y-1{row-gap:.25rem}.xl\:us-gap-y-2{row-gap:.5rem}.xl\:us-gap-y-3{row-gap:.75rem}.xl\:us-gap-y-4{row-gap:1rem}.xl\:us-gap-y-5{row-gap:1.25rem}.xl\:us-gap-y-6{row-gap:1.5rem}.xl\:us-gap-y-7{row-gap:1.75rem}.xl\:us-gap-y-8{row-gap:2rem}}.us-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.us-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.us-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.slider-container{width:300px;height:20px;background-color:#ccc;position:relative;margin-top:20px}.slider-point{width:20px;height:20px;background-color:#007bff;border-radius:50%;position:absolute;cursor:pointer}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@unifiedsoftware/styles",
3
- "version": "1.0.46",
3
+ "version": "1.0.48",
4
4
  "license": "MIT",
5
5
  "files": [
6
6
  "index.scss",
package/scss/components/_accordion.scss CHANGED
@@ -10,14 +10,18 @@
10
10
  }
11
11
 
12
12
  &-header {
13
- padding: 0.75rem 1rem;
14
- cursor: pointer;
13
+ height: var(--#{$prefix}accordion-header-height);
14
+ min-height: var(--#{$prefix}accordion-header-min-height);
15
+ padding-block: var(--#{$prefix}accordion-header-padding-y);
16
+ padding-inline: var(--#{$prefix}accordion-header-padding-x);
15
17
  display: flex;
16
18
  align-items: center;
17
- gap: 1rem;
19
+ gap: var(--#{$prefix}accordion-header-gap);
18
20
 
19
- &__content {
20
- flex-grow: 1;
21
+ &--collapsible {
22
+ cursor: pointer;
23
+ user-select: none;
24
+ -webkit-tap-highlight-color: transparent;
21
25
  }
22
26
 
23
27
  &__start-content,
@@ -25,17 +29,55 @@
25
29
  flex-shrink: 0;
26
30
  }
27
31
 
32
+ &__content {
33
+ flex-grow: 1;
34
+ display: flex;
35
+ flex-direction: column;
36
+ gap: var(--#{$prefix}accordion-header-content-gap);
37
+ }
38
+
28
39
  &__title {
29
- font-size: 0.875rem;
30
- font-weight: 500;
40
+ font-size: var(--#{$prefix}accordion-header-title-font-size);
41
+ font-weight: var(--#{$prefix}accordion-header-title-font-weight);
42
+ line-height: var(--#{$prefix}accordion-header-title-line-height);
43
+ overflow: hidden;
44
+ color: var(--#{$prefix}accordion-header-title-color);
45
+ display: -webkit-box;
46
+ -webkit-box-orient: vertical;
47
+ -webkit-line-clamp: 1;
31
48
  }
32
49
 
33
50
  &__subtitle {
34
- font-size: 0.75rem;
35
- opacity: 0.75;
51
+ font-size: var(--#{$prefix}accordion-header-subtitle-font-size);
52
+ font-weight: var(--#{$prefix}accordion-header-subtitle-font-weight);
53
+ line-height: var(--#{$prefix}accordion-header-subtitle-line-height);
54
+ overflow: hidden;
55
+ color: var(--#{$prefix}accordion-header-subtitle-color);
56
+ display: -webkit-box;
57
+ -webkit-box-orient: vertical;
58
+ -webkit-line-clamp: 1;
36
59
  }
37
60
  }
38
61
 
62
+ &-header:not(&-header--bordered) ~ &-body:not([data-hidden='true']),
63
+ &-header:not(&-header--bordered) ~ :not([hidden]) &-body:not([data-hidden='true']) {
64
+ padding-top: 0;
65
+ }
66
+
67
+ &-header--bordered ~ &-body:not([data-hidden='true']),
68
+ &-header--bordered ~ :not([hidden]) &-body:not([data-hidden='true']) {
69
+ border-top-width: 1px;
70
+ }
71
+
72
+ &-body {
73
+ border-top: 0px solid #ddd;
74
+ padding-block: var(--#{$prefix}accordion-body-padding-y);
75
+ padding-inline: var(--#{$prefix}accordion-body-padding-x);
76
+ font-size: var(--#{$prefix}accordion-body-font-size);
77
+ line-height: var(--#{$prefix}accordion-body-line-height);
78
+ color: var(--#{$prefix}accordion-body-color);
79
+ }
80
+
39
81
  &-panel {
40
82
  padding: 1rem;
41
83
  }
package/scss/components/_backdrop.scss CHANGED
@@ -6,7 +6,7 @@
6
6
  left: 0;
7
7
  width: 100%;
8
8
  height: 100vh;
9
- z-index: 10;
9
+ z-index: 20;
10
10
  display: flex;
11
11
  justify-content: center;
12
12
  align-items: center;
package/scss/components/_badge.scss CHANGED
@@ -1,25 +1,42 @@
1
1
  @use '../variables' as *;
2
2
  @use '../mixins/overlay' as *;
3
+ @use '../mixins/outline' as *;
3
4
 
4
5
  .#{$prefix}badge {
5
- position: absolute;
6
- padding: var(--#{$prefix}badge-padding-y) var(--#{$prefix}badge-padding-x);
6
+ min-width: var(--#{$prefix}badge-min-width);
7
+ min-height: var(--#{$prefix}badge-min-height);
8
+ padding-block: var(--#{$prefix}badge-padding-y);
9
+ padding-block: var(--#{$prefix}badge-padding-y);
10
+ padding-inline: var(--#{$prefix}badge-padding-x);
7
11
  font-size: var(--#{$prefix}badge-font-size);
8
12
  font-weight: var(--#{$prefix}badge-font-weight);
13
+ line-height: var(--#{$prefix}badge-line-height);
9
14
  border: var(--#{$prefix}badge-border-width) solid var(--#{$prefix}badge-border-color);
10
15
  border-radius: var(--#{$prefix}badge-border-radius);
11
16
  color: var(--#{$prefix}badge-color);
12
17
  background-color: var(--#{$prefix}badge-background);
13
18
  display: inline-flex;
19
+ justify-content: center;
20
+ align-items: center;
14
21
 
15
22
  @include overlay();
16
23
 
17
- &--top-left {
24
+ &-wrapper {
25
+ flex-shrink: 0;
26
+ position: relative;
27
+ display: inline-flex;
28
+ }
29
+
30
+ &-wrapper & {
31
+ position: absolute;
32
+ }
33
+
34
+ &-wrapper &--top-left {
18
35
  top: 10%;
19
36
  left: 10%;
20
37
  }
21
38
 
22
- &--top-right {
39
+ &-wrapper &--top-right {
23
40
  right: 0;
24
41
  top: 0;
25
42
  transform: translate(50%, -50%);
@@ -27,19 +44,13 @@
27
44
  // right: 10%;
28
45
  }
29
46
 
30
- &--bottom-left {
47
+ &-wrapper &--bottom-left {
31
48
  bottom: 10%;
32
49
  left: 10%;
33
50
  }
34
51
 
35
- &--bottom-right {
52
+ &-wrapper &--bottom-right {
36
53
  bottom: 0;
37
54
  right: 0;
38
55
  }
39
-
40
- &-wrapper {
41
- flex-shrink: 0;
42
- position: relative;
43
- display: inline-flex;
44
- }
45
56
  }
package/scss/components/_card.scss CHANGED
@@ -15,14 +15,15 @@
15
15
 
16
16
  @include overlay();
17
17
 
18
- &--hoverable {
18
+ &--hoverable,
19
+ &--selected {
19
20
  cursor: pointer;
20
21
  user-select: none;
21
22
  }
22
23
 
23
24
  &--disabled {
24
25
  opacity: 0.6;
25
- pointer-events: none;
26
+ cursor: not-allowed;
26
27
  user-select: none;
27
28
  }
28
29
 
@@ -70,16 +71,16 @@
70
71
  }
71
72
  }
72
73
 
73
- &-header:not(&-header--bordered) ~ :not([data-hidden='true']) {
74
+ &-header:not(&-header--bordered) ~ &-body:not([data-hidden='true']) {
74
75
  padding-top: 0;
75
76
  }
76
77
 
77
- &-header--bordered ~ :not([data-hidden='true']) {
78
+ &-header--bordered ~ &-body:not([data-hidden='true']) {
78
79
  border-top-width: 1px;
79
80
  }
80
81
 
81
82
  &-body {
82
- border-top: 1px solid #ddd;
83
+ border-top: 0px solid #ddd;
83
84
  padding: var(--#{$prefix}card-body-padding-y) var(--#{$prefix}card-body-padding-x);
84
85
  font-size: var(--#{$prefix}card-body-font-size);
85
86
  line-height: var(--#{$prefix}card-body-line-height);