sakana-element 2.4.2 → 2.5.0

package/dist/theme/Select.css

@@ -1,584 +1 @@
-/* Select Variables */
-.px-select[data-v-1ab275ee] {
-  --px-select-item-hover-bg-color: var(--px-fill-color-light);
-  --px-select-item-font-size: var(--px-font-size-base);
-  --px-select-item-font-color: var(--px-text-color-primary);
-  --px-select-item-selected-font-color: var(--px-color-primary);
-  --px-select-item-selected-bg-color: var(--px-color-primary-light-9);
-  --px-select-item-disabled-font-color: var(--px-text-color-disabled);
-  --px-select-input-focus-border-color: var(--px-hover-border-color);
-  --px-select-border-color: var(--px-border-color);
-  --px-select-shadow-color: var(--px-shadow-color);
-  --px-select-dropdown-bg-color: var(--px-fill-color-blank);
-  --px-select-item-indicator-color: var(--px-color-primary);
-  --px-select-item-highlighted-border-color: var(--px-color-primary);
-}
-/* Base Select Styles - Pixel Dropdown */
-.px-select[data-v-1ab275ee] {
-  display: inline-block;
-  vertical-align: middle;
-  line-height: 32px;
-  font-family: var(--px-font-family);
-}
-/* Tooltip popper styling - pixel style inherited from Tooltip */
-.px-select[data-v-1ab275ee] .px-tooltip__popper {
-    padding: 0;
-}
-/* Override tooltip background to match select dropdown */
-.px-select[data-v-1ab275ee] .px-tooltip__popper::after {
-      background: var(--px-select-dropdown-bg-color);
-}
-/* Input with dropdown arrow */
-.px-select[data-v-1ab275ee] .px-input .header-angle {
-      transition: none;
-}
-.px-select[data-v-1ab275ee] .px-input .header-angle.is-active {
-        transform: rotate(180deg);
-}
-/* No data / Loading states */
-.px-select .px-select__nodata[data-v-1ab275ee],
-  .px-select .px-select__loading[data-v-1ab275ee] {
-    padding: 12px 16px;
-    margin: 0;
-    text-align: center;
-    color: var(--px-text-color-secondary);
-    font-size: var(--px-select-item-font-size);
-    font-family: var(--px-font-family);
-}
-/* Menu container */
-.px-select .px-select__menu[data-v-1ab275ee] {
-    list-style: none;
-    margin: 0;
-    padding: 4px 0;
-    box-sizing: border-box;
-}
-/* Menu items - Pixel list style */
-.px-select .px-select__menu-item[data-v-1ab275ee] {
-    margin: 0;
-    font-size: var(--px-select-item-font-size);
-    font-family: var(--px-font-family);
-    padding: 0 16px 0 24px;
-    position: relative;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    color: var(--px-select-item-font-color);
-    height: 36px;
-    line-height: 36px;
-    box-sizing: border-box;
-    cursor: pointer;
-    transition: none;
-}
-/* Pixel selector indicator - arrow shape on interaction */
-.px-select .px-select__menu-item[data-v-1ab275ee]::before {
-      content: '';
-      position: absolute;
-      left: 10px;
-      top: 50%;
-      transform: translateY(-50%);
-      width: 6px;
-      height: 6px;
-      background: transparent;
-      border: 2px solid transparent;
-      /* Pixel arrow — right-pointing triangle, visible when colored */
-      clip-path: polygon(0 0, 100% 50%, 0 100%);
-      z-index: 2;
-}
-/* Background layer for hover/selected states */
-.px-select .px-select__menu-item[data-v-1ab275ee]::after {
-      content: '';
-      position: absolute;
-      inset: 0;
-      left: 2px;
-      right: 2px;
-      background: transparent;
-      z-index: -1;
-}
-/* Hover effect */
-.px-select .px-select__menu-item[data-v-1ab275ee]:hover::after {
-        background-color: var(--px-select-item-hover-bg-color);
-        /* CRT scanline overlay - subtle retro stripe effect */
-        background-image: repeating-linear-gradient(
-          0deg,
-          transparent 0px,
-          transparent 2px,
-          rgba(0, 0, 0, 0.03) 2px,
-          rgba(0, 0, 0, 0.03) 4px
-        );
-}
-.px-select .px-select__menu-item[data-v-1ab275ee]:hover::before {
-        border-color: var(--px-hover-border-color);
-        background: var(--px-hover-border-color);
-}
-/* Selected state with pixel indicator */
-.px-select .px-select__menu-item.is-selected[data-v-1ab275ee] {
-      color: var(--px-select-item-selected-font-color);
-      font-weight: 500;
-}
-.px-select .px-select__menu-item.is-selected[data-v-1ab275ee]::after {
-        background-color: var(--px-select-item-selected-bg-color);
-}
-.px-select .px-select__menu-item.is-selected[data-v-1ab275ee]::before {
-        background: var(--px-select-item-indicator-color);
-        border-color: var(--px-select-item-indicator-color);
-}
-/* Highlighted (keyboard navigation) */
-.px-select .px-select__menu-item.is-highlighted[data-v-1ab275ee]::after {
-        background-color: var(--px-select-item-hover-bg-color);
-}
-.px-select .px-select__menu-item.is-highlighted[data-v-1ab275ee]::before {
-        border-color: var(--px-select-item-highlighted-border-color);
-        background: var(--px-select-item-highlighted-border-color);
-}
-/* Disabled state */
-.px-select .px-select__menu-item.is-disabled[data-v-1ab275ee] {
-      color: var(--px-select-item-disabled-font-color);
-      cursor: not-allowed;
-}
-.px-select .px-select__menu-item.is-disabled[data-v-1ab275ee]:hover::after {
-          background-color: transparent;
-}
-.px-select .px-select__menu-item.is-disabled[data-v-1ab275ee]:hover::before {
-          border-color: transparent;
-          background: transparent;
-}
-/* First item needs pixel corners on top */
-.px-select .px-select__menu-item[data-v-1ab275ee]:first-child::after {
-      top: 2px;
-      clip-path: polygon(
-        0 2px, 2px 2px, 2px 0, 4px 0,
-        calc(100% - 4px) 0, calc(100% - 4px) 2px, calc(100% - 2px) 2px, 100% 2px,
-        100% 100%,
-        0 100%
-      );
-}
-/* Last item needs pixel corners on bottom */
-.px-select .px-select__menu-item[data-v-1ab275ee]:last-child::after {
-      bottom: 2px;
-      clip-path: polygon(
-        0 0,
-        100% 0,
-        100% calc(100% - 2px), calc(100% - 2px) calc(100% - 2px), calc(100% - 2px) 100%, calc(100% - 4px) 100%,
-        4px 100%, 4px 100%, 2px calc(100% - 2px), 0 calc(100% - 2px)
-      );
-}
-/* If only one item, needs both top and bottom pixel corners */
-.px-select .px-select__menu-item[data-v-1ab275ee]:first-child:last-child::after {
-      top: 2px;
-      bottom: 2px;
-      clip-path: polygon(
-        0 2px, 2px 2px, 2px 0, 4px 0,
-        calc(100% - 4px) 0, calc(100% - 4px) 2px, calc(100% - 2px) 2px, 100% 2px,
-        100% calc(100% - 2px), calc(100% - 2px) calc(100% - 2px), calc(100% - 2px) 100%, calc(100% - 4px) 100%,
-        4px 100%, 4px 100%, 2px calc(100% - 2px), 0 calc(100% - 2px)
-      );
-}
-/* Input pointer cursor */
-.px-select[data-v-1ab275ee] .px-input__inner {
-    cursor: pointer;
-}
-/* Disabled state */
-.px-select.is-disabled[data-v-1ab275ee] {
-    opacity: 0.6;
-    cursor: not-allowed;
-}
-/* Ghost style - transparent at rest, Input handles border/shadow via prop */
-.px-select.is-ghost[data-v-1ab275ee] .px-tooltip__popper::after {
-        background: var(--px-select-dropdown-bg-color);
-}
-/* Size: Large */
-.px-select.px-select--large[data-v-1ab275ee] {
-    line-height: 44px;
-}
-.px-select.px-select--large .px-select__menu-item[data-v-1ab275ee] {
-      height: 44px;
-      line-height: 44px;
-      font-size: var(--px-font-size-large);
-      padding: 0 20px 0 28px;
-}
-.px-select.px-select--large .px-select__menu-item[data-v-1ab275ee]::before {
-        left: 12px;
-        width: 8px;
-        height: 8px;
-}
-/* Size: Small */
-.px-select.px-select--small[data-v-1ab275ee] {
-    line-height: 28px;
-}
-.px-select.px-select--small .px-select__menu-item[data-v-1ab275ee] {
-      height: 28px;
-      line-height: 28px;
-      font-size: var(--px-font-size-small);
-      padding: 0 12px 0 20px;
-}
-.px-select.px-select--small .px-select__menu-item[data-v-1ab275ee]::before {
-        left: 8px;
-        width: 4px;
-        height: 4px;
-}
-/* Color variants */
-.px-select.px-select--primary[data-v-1ab275ee] {
-      --px-select-item-selected-font-color: var(--px-color-primary);
-      --px-select-item-selected-bg-color: var(--px-color-primary-light-9);
-      --px-select-item-indicator-color: var(--px-color-primary);
-      --px-select-item-highlighted-border-color: var(--px-color-primary);
-}
-.px-select.px-select--success[data-v-1ab275ee] {
-      --px-select-item-selected-font-color: var(--px-color-success);
-      --px-select-item-selected-bg-color: var(--px-color-success-light-9);
-      --px-select-item-indicator-color: var(--px-color-success);
-      --px-select-item-highlighted-border-color: var(--px-color-success);
-}
-.px-select.px-select--warning[data-v-1ab275ee] {
-      --px-select-item-selected-font-color: var(--px-color-warning);
-      --px-select-item-selected-bg-color: var(--px-color-warning-light-9);
-      --px-select-item-indicator-color: var(--px-color-warning);
-      --px-select-item-highlighted-border-color: var(--px-color-warning);
-}
-.px-select.px-select--info[data-v-1ab275ee] {
-      --px-select-item-selected-font-color: var(--px-color-info);
-      --px-select-item-selected-bg-color: var(--px-color-info-light-9);
-      --px-select-item-indicator-color: var(--px-color-info);
-      --px-select-item-highlighted-border-color: var(--px-color-info);
-}
-.px-select.px-select--danger[data-v-1ab275ee] {
-      --px-select-item-selected-font-color: var(--px-color-danger);
-      --px-select-item-selected-bg-color: var(--px-color-danger-light-9);
-      --px-select-item-indicator-color: var(--px-color-danger);
-      --px-select-item-highlighted-border-color: var(--px-color-danger);
-}
-/* Pixel scrollbar - RPG-style scrollbar for long option lists */
-.px-select .px-select__menu[data-v-1ab275ee] {
-    scrollbar-width: thin;
-    scrollbar-color: var(--px-border-color) var(--px-fill-color-light);
-}
-.px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar {
-      width: 8px;
-}
-.px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-track {
-      background: var(--px-fill-color-light);
-      border-left: 2px solid var(--px-border-color);
-}
-.px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-thumb {
-      background: var(--px-border-color);
-      border: 2px solid var(--px-fill-color-light);
-}
-.px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-thumb:hover {
-        background: var(--px-text-color-secondary);
-}
-/* Dark mode overrides for Select enhancements */
-.px-dark .px-select .px-select__menu-item[data-v-1ab275ee]:hover::after {
-        background-image: repeating-linear-gradient(
-          0deg,
-          transparent 0px,
-          transparent 2px,
-          rgba(255, 255, 255, 0.03) 2px,
-          rgba(255, 255, 255, 0.03) 4px
-        );
-}
-.px-dark .px-select .px-select__menu[data-v-1ab275ee] {
-    scrollbar-color: var(--px-border-color) var(--px-fill-color-darker);
-}
-.px-dark .px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-track {
-      background: var(--px-fill-color-darker);
-      border-left-color: var(--px-border-color);
-}
-.px-dark .px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-thumb {
-      background: var(--px-border-color);
-      border-color: var(--px-fill-color-darker);
-}
-.px-dark .px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-thumb:hover {
-        background: var(--px-text-color-secondary);
-}
-/* Select Variables */
-.px-select[data-v-e33550e6] {
-  --px-select-item-hover-bg-color: var(--px-fill-color-light);
-  --px-select-item-font-size: var(--px-font-size-base);
-  --px-select-item-font-color: var(--px-text-color-primary);
-  --px-select-item-selected-font-color: var(--px-color-primary);
-  --px-select-item-selected-bg-color: var(--px-color-primary-light-9);
-  --px-select-item-disabled-font-color: var(--px-text-color-disabled);
-  --px-select-input-focus-border-color: var(--px-hover-border-color);
-  --px-select-border-color: var(--px-border-color);
-  --px-select-shadow-color: var(--px-shadow-color);
-  --px-select-dropdown-bg-color: var(--px-fill-color-blank);
-  --px-select-item-indicator-color: var(--px-color-primary);
-  --px-select-item-highlighted-border-color: var(--px-color-primary);
-}
-/* Base Select Styles - Pixel Dropdown */
-.px-select[data-v-e33550e6] {
-  display: inline-block;
-  vertical-align: middle;
-  line-height: 32px;
-  font-family: var(--px-font-family);
-}
-/* Tooltip popper styling - pixel style inherited from Tooltip */
-.px-select[data-v-e33550e6] .px-tooltip__popper {
-    padding: 0;
-}
-/* Override tooltip background to match select dropdown */
-.px-select[data-v-e33550e6] .px-tooltip__popper::after {
-      background: var(--px-select-dropdown-bg-color);
-}
-/* Input with dropdown arrow */
-.px-select[data-v-e33550e6] .px-input .header-angle {
-      transition: none;
-}
-.px-select[data-v-e33550e6] .px-input .header-angle.is-active {
-        transform: rotate(180deg);
-}
-/* No data / Loading states */
-.px-select .px-select__nodata[data-v-e33550e6],
-  .px-select .px-select__loading[data-v-e33550e6] {
-    padding: 12px 16px;
-    margin: 0;
-    text-align: center;
-    color: var(--px-text-color-secondary);
-    font-size: var(--px-select-item-font-size);
-    font-family: var(--px-font-family);
-}
-/* Menu container */
-.px-select .px-select__menu[data-v-e33550e6] {
-    list-style: none;
-    margin: 0;
-    padding: 4px 0;
-    box-sizing: border-box;
-}
-/* Menu items - Pixel list style */
-.px-select .px-select__menu-item[data-v-e33550e6] {
-    margin: 0;
-    font-size: var(--px-select-item-font-size);
-    font-family: var(--px-font-family);
-    padding: 0 16px 0 24px;
-    position: relative;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    color: var(--px-select-item-font-color);
-    height: 36px;
-    line-height: 36px;
-    box-sizing: border-box;
-    cursor: pointer;
-    transition: none;
-}
-/* Pixel selector indicator - arrow shape on interaction */
-.px-select .px-select__menu-item[data-v-e33550e6]::before {
-      content: '';
-      position: absolute;
-      left: 10px;
-      top: 50%;
-      transform: translateY(-50%);
-      width: 6px;
-      height: 6px;
-      background: transparent;
-      border: 2px solid transparent;
-      /* Pixel arrow — right-pointing triangle, visible when colored */
-      clip-path: polygon(0 0, 100% 50%, 0 100%);
-      z-index: 2;
-}
-/* Background layer for hover/selected states */
-.px-select .px-select__menu-item[data-v-e33550e6]::after {
-      content: '';
-      position: absolute;
-      inset: 0;
-      left: 2px;
-      right: 2px;
-      background: transparent;
-      z-index: -1;
-}
-/* Hover effect */
-.px-select .px-select__menu-item[data-v-e33550e6]:hover::after {
-        background-color: var(--px-select-item-hover-bg-color);
-        /* CRT scanline overlay - subtle retro stripe effect */
-        background-image: repeating-linear-gradient(
-          0deg,
-          transparent 0px,
-          transparent 2px,
-          rgba(0, 0, 0, 0.03) 2px,
-          rgba(0, 0, 0, 0.03) 4px
-        );
-}
-.px-select .px-select__menu-item[data-v-e33550e6]:hover::before {
-        border-color: var(--px-hover-border-color);
-        background: var(--px-hover-border-color);
-}
-/* Selected state with pixel indicator */
-.px-select .px-select__menu-item.is-selected[data-v-e33550e6] {
-      color: var(--px-select-item-selected-font-color);
-      font-weight: 500;
-}
-.px-select .px-select__menu-item.is-selected[data-v-e33550e6]::after {
-        background-color: var(--px-select-item-selected-bg-color);
-}
-.px-select .px-select__menu-item.is-selected[data-v-e33550e6]::before {
-        background: var(--px-select-item-indicator-color);
-        border-color: var(--px-select-item-indicator-color);
-}
-/* Highlighted (keyboard navigation) */
-.px-select .px-select__menu-item.is-highlighted[data-v-e33550e6]::after {
-        background-color: var(--px-select-item-hover-bg-color);
-}
-.px-select .px-select__menu-item.is-highlighted[data-v-e33550e6]::before {
-        border-color: var(--px-select-item-highlighted-border-color);
-        background: var(--px-select-item-highlighted-border-color);
-}
-/* Disabled state */
-.px-select .px-select__menu-item.is-disabled[data-v-e33550e6] {
-      color: var(--px-select-item-disabled-font-color);
-      cursor: not-allowed;
-}
-.px-select .px-select__menu-item.is-disabled[data-v-e33550e6]:hover::after {
-          background-color: transparent;
-}
-.px-select .px-select__menu-item.is-disabled[data-v-e33550e6]:hover::before {
-          border-color: transparent;
-          background: transparent;
-}
-/* First item needs pixel corners on top */
-.px-select .px-select__menu-item[data-v-e33550e6]:first-child::after {
-      top: 2px;
-      clip-path: polygon(
-        0 2px, 2px 2px, 2px 0, 4px 0,
-        calc(100% - 4px) 0, calc(100% - 4px) 2px, calc(100% - 2px) 2px, 100% 2px,
-        100% 100%,
-        0 100%
-      );
-}
-/* Last item needs pixel corners on bottom */
-.px-select .px-select__menu-item[data-v-e33550e6]:last-child::after {
-      bottom: 2px;
-      clip-path: polygon(
-        0 0,
-        100% 0,
-        100% calc(100% - 2px), calc(100% - 2px) calc(100% - 2px), calc(100% - 2px) 100%, calc(100% - 4px) 100%,
-        4px 100%, 4px 100%, 2px calc(100% - 2px), 0 calc(100% - 2px)
-      );
-}
-/* If only one item, needs both top and bottom pixel corners */
-.px-select .px-select__menu-item[data-v-e33550e6]:first-child:last-child::after {
-      top: 2px;
-      bottom: 2px;
-      clip-path: polygon(
-        0 2px, 2px 2px, 2px 0, 4px 0,
-        calc(100% - 4px) 0, calc(100% - 4px) 2px, calc(100% - 2px) 2px, 100% 2px,
-        100% calc(100% - 2px), calc(100% - 2px) calc(100% - 2px), calc(100% - 2px) 100%, calc(100% - 4px) 100%,
-        4px 100%, 4px 100%, 2px calc(100% - 2px), 0 calc(100% - 2px)
-      );
-}
-/* Input pointer cursor */
-.px-select[data-v-e33550e6] .px-input__inner {
-    cursor: pointer;
-}
-/* Disabled state */
-.px-select.is-disabled[data-v-e33550e6] {
-    opacity: 0.6;
-    cursor: not-allowed;
-}
-/* Ghost style - transparent at rest, Input handles border/shadow via prop */
-.px-select.is-ghost[data-v-e33550e6] .px-tooltip__popper::after {
-        background: var(--px-select-dropdown-bg-color);
-}
-/* Size: Large */
-.px-select.px-select--large[data-v-e33550e6] {
-    line-height: 44px;
-}
-.px-select.px-select--large .px-select__menu-item[data-v-e33550e6] {
-      height: 44px;
-      line-height: 44px;
-      font-size: var(--px-font-size-large);
-      padding: 0 20px 0 28px;
-}
-.px-select.px-select--large .px-select__menu-item[data-v-e33550e6]::before {
-        left: 12px;
-        width: 8px;
-        height: 8px;
-}
-/* Size: Small */
-.px-select.px-select--small[data-v-e33550e6] {
-    line-height: 28px;
-}
-.px-select.px-select--small .px-select__menu-item[data-v-e33550e6] {
-      height: 28px;
-      line-height: 28px;
-      font-size: var(--px-font-size-small);
-      padding: 0 12px 0 20px;
-}
-.px-select.px-select--small .px-select__menu-item[data-v-e33550e6]::before {
-        left: 8px;
-        width: 4px;
-        height: 4px;
-}
-/* Color variants */
-.px-select.px-select--primary[data-v-e33550e6] {
-      --px-select-item-selected-font-color: var(--px-color-primary);
-      --px-select-item-selected-bg-color: var(--px-color-primary-light-9);
-      --px-select-item-indicator-color: var(--px-color-primary);
-      --px-select-item-highlighted-border-color: var(--px-color-primary);
-}
-.px-select.px-select--success[data-v-e33550e6] {
-      --px-select-item-selected-font-color: var(--px-color-success);
-      --px-select-item-selected-bg-color: var(--px-color-success-light-9);
-      --px-select-item-indicator-color: var(--px-color-success);
-      --px-select-item-highlighted-border-color: var(--px-color-success);
-}
-.px-select.px-select--warning[data-v-e33550e6] {
-      --px-select-item-selected-font-color: var(--px-color-warning);
-      --px-select-item-selected-bg-color: var(--px-color-warning-light-9);
-      --px-select-item-indicator-color: var(--px-color-warning);
-      --px-select-item-highlighted-border-color: var(--px-color-warning);
-}
-.px-select.px-select--info[data-v-e33550e6] {
-      --px-select-item-selected-font-color: var(--px-color-info);
-      --px-select-item-selected-bg-color: var(--px-color-info-light-9);
-      --px-select-item-indicator-color: var(--px-color-info);
-      --px-select-item-highlighted-border-color: var(--px-color-info);
-}
-.px-select.px-select--danger[data-v-e33550e6] {
-      --px-select-item-selected-font-color: var(--px-color-danger);
-      --px-select-item-selected-bg-color: var(--px-color-danger-light-9);
-      --px-select-item-indicator-color: var(--px-color-danger);
-      --px-select-item-highlighted-border-color: var(--px-color-danger);
-}
-/* Pixel scrollbar - RPG-style scrollbar for long option lists */
-.px-select .px-select__menu[data-v-e33550e6] {
-    scrollbar-width: thin;
-    scrollbar-color: var(--px-border-color) var(--px-fill-color-light);
-}
-.px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar {
-      width: 8px;
-}
-.px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-track {
-      background: var(--px-fill-color-light);
-      border-left: 2px solid var(--px-border-color);
-}
-.px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-thumb {
-      background: var(--px-border-color);
-      border: 2px solid var(--px-fill-color-light);
-}
-.px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-thumb:hover {
-        background: var(--px-text-color-secondary);
-}
-/* Dark mode overrides for Select enhancements */
-.px-dark .px-select .px-select__menu-item[data-v-e33550e6]:hover::after {
-        background-image: repeating-linear-gradient(
-          0deg,
-          transparent 0px,
-          transparent 2px,
-          rgba(255, 255, 255, 0.03) 2px,
-          rgba(255, 255, 255, 0.03) 4px
-        );
-}
-.px-dark .px-select .px-select__menu[data-v-e33550e6] {
-    scrollbar-color: var(--px-border-color) var(--px-fill-color-darker);
-}
-.px-dark .px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-track {
-      background: var(--px-fill-color-darker);
-      border-left-color: var(--px-border-color);
-}
-.px-dark .px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-thumb {
-      background: var(--px-border-color);
-      border-color: var(--px-fill-color-darker);
-}
-.px-dark .px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-thumb:hover {
-        background: var(--px-text-color-secondary);
-}
+.px-select[data-v-1ab275ee]{--px-select-item-hover-bg-color:var(--px-fill-color-light);--px-select-item-font-size:var(--px-font-size-base);--px-select-item-font-color:var(--px-text-color-primary);--px-select-item-selected-font-color:var(--px-color-primary);--px-select-item-selected-bg-color:var(--px-color-primary-light-9);--px-select-item-disabled-font-color:var(--px-text-color-disabled);--px-select-input-focus-border-color:var(--px-hover-border-color);--px-select-border-color:var(--px-border-color);--px-select-shadow-color:var(--px-shadow-color);--px-select-dropdown-bg-color:var(--px-fill-color-blank);--px-select-item-indicator-color:var(--px-color-primary);--px-select-item-highlighted-border-color:var(--px-color-primary);vertical-align:middle;line-height:32px;font-family:var(--px-font-family);display:inline-block}.px-select .px-tooltip__popper[data-v-1ab275ee]{padding:0}.px-select .px-tooltip__popper[data-v-1ab275ee]:after{background:var(--px-select-dropdown-bg-color)}.px-select .px-input .header-angle[data-v-1ab275ee]{transition:none}.px-select .px-input .header-angle.is-active[data-v-1ab275ee]{transform:rotate(180deg)}.px-select .px-select__nodata[data-v-1ab275ee],.px-select .px-select__loading[data-v-1ab275ee]{text-align:center;color:var(--px-text-color-secondary);font-size:var(--px-select-item-font-size);font-family:var(--px-font-family);margin:0;padding:12px 16px}.px-select .px-select__menu[data-v-1ab275ee]{box-sizing:border-box;margin:0;padding:4px 0;list-style:none}.px-select .px-select__menu-item[data-v-1ab275ee]{font-size:var(--px-select-item-font-size);font-family:var(--px-font-family);white-space:nowrap;text-overflow:ellipsis;color:var(--px-select-item-font-color);box-sizing:border-box;cursor:pointer;height:36px;margin:0;padding:0 16px 0 24px;line-height:36px;transition:none;position:relative;overflow:hidden}.px-select .px-select__menu-item[data-v-1ab275ee]:before{content:"";clip-path:polygon(0 0,100% 50%,0 100%);z-index:2;background:0 0;border:2px solid #0000;width:6px;height:6px;position:absolute;top:50%;left:10px;transform:translateY(-50%)}.px-select .px-select__menu-item[data-v-1ab275ee]:after{content:"";z-index:-1;background:0 0;position:absolute;inset:0 2px}.px-select .px-select__menu-item[data-v-1ab275ee]:hover:after{background-color:var(--px-select-item-hover-bg-color);background-image:repeating-linear-gradient(0deg,#0000 0 2px,#00000008 2px 4px)}.px-select .px-select__menu-item[data-v-1ab275ee]:hover:before{border-color:var(--px-hover-border-color);background:var(--px-hover-border-color)}.px-select .px-select__menu-item.is-selected[data-v-1ab275ee]{color:var(--px-select-item-selected-font-color);font-weight:500}.px-select .px-select__menu-item.is-selected[data-v-1ab275ee]:after{background-color:var(--px-select-item-selected-bg-color)}.px-select .px-select__menu-item.is-selected[data-v-1ab275ee]:before{background:var(--px-select-item-indicator-color);border-color:var(--px-select-item-indicator-color)}.px-select .px-select__menu-item.is-highlighted[data-v-1ab275ee]:after{background-color:var(--px-select-item-hover-bg-color)}.px-select .px-select__menu-item.is-highlighted[data-v-1ab275ee]:before{border-color:var(--px-select-item-highlighted-border-color);background:var(--px-select-item-highlighted-border-color)}.px-select .px-select__menu-item.is-disabled[data-v-1ab275ee]{color:var(--px-select-item-disabled-font-color);cursor:not-allowed}.px-select .px-select__menu-item.is-disabled[data-v-1ab275ee]:hover:after{background-color:#0000}.px-select .px-select__menu-item.is-disabled[data-v-1ab275ee]:hover:before{background:0 0;border-color:#0000}.px-select .px-select__menu-item[data-v-1ab275ee]:first-child:after{clip-path:polygon(0 2px,2px 2px,2px 0,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,100% 2px,100% 100%,0 100%);top:2px}.px-select .px-select__menu-item[data-v-1ab275ee]:last-child:after{clip-path:polygon(0 0,100% 0,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,calc(100% - 4px) 100%,4px 100%,4px 100%,2px calc(100% - 2px),0 calc(100% - 2px));bottom:2px}.px-select .px-select__menu-item[data-v-1ab275ee]:first-child:last-child:after{clip-path:polygon(0 2px,2px 2px,2px 0,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,100% 2px,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,calc(100% - 4px) 100%,4px 100%,4px 100%,2px calc(100% - 2px),0 calc(100% - 2px));top:2px;bottom:2px}.px-select .px-input__inner[data-v-1ab275ee]{cursor:pointer}.px-select.is-disabled[data-v-1ab275ee]{opacity:.6;cursor:not-allowed}.px-select.is-ghost .px-tooltip__popper[data-v-1ab275ee]:after{background:var(--px-select-dropdown-bg-color)}.px-select.px-select--large[data-v-1ab275ee]{line-height:44px}.px-select.px-select--large .px-select__menu-item[data-v-1ab275ee]{height:44px;line-height:44px;font-size:var(--px-font-size-large);padding:0 20px 0 28px}.px-select.px-select--large .px-select__menu-item[data-v-1ab275ee]:before{width:8px;height:8px;left:12px}.px-select.px-select--small[data-v-1ab275ee]{line-height:28px}.px-select.px-select--small .px-select__menu-item[data-v-1ab275ee]{height:28px;line-height:28px;font-size:var(--px-font-size-small);padding:0 12px 0 20px}.px-select.px-select--small .px-select__menu-item[data-v-1ab275ee]:before{width:4px;height:4px;left:8px}.px-select.px-select--primary[data-v-1ab275ee]{--px-select-item-selected-font-color:var(--px-color-primary);--px-select-item-selected-bg-color:var(--px-color-primary-light-9);--px-select-item-indicator-color:var(--px-color-primary);--px-select-item-highlighted-border-color:var(--px-color-primary)}.px-select.px-select--success[data-v-1ab275ee]{--px-select-item-selected-font-color:var(--px-color-success);--px-select-item-selected-bg-color:var(--px-color-success-light-9);--px-select-item-indicator-color:var(--px-color-success);--px-select-item-highlighted-border-color:var(--px-color-success)}.px-select.px-select--warning[data-v-1ab275ee]{--px-select-item-selected-font-color:var(--px-color-warning);--px-select-item-selected-bg-color:var(--px-color-warning-light-9);--px-select-item-indicator-color:var(--px-color-warning);--px-select-item-highlighted-border-color:var(--px-color-warning)}.px-select.px-select--info[data-v-1ab275ee]{--px-select-item-selected-font-color:var(--px-color-info);--px-select-item-selected-bg-color:var(--px-color-info-light-9);--px-select-item-indicator-color:var(--px-color-info);--px-select-item-highlighted-border-color:var(--px-color-info)}.px-select.px-select--danger[data-v-1ab275ee]{--px-select-item-selected-font-color:var(--px-color-danger);--px-select-item-selected-bg-color:var(--px-color-danger-light-9);--px-select-item-indicator-color:var(--px-color-danger);--px-select-item-highlighted-border-color:var(--px-color-danger)}.px-select .px-select__menu[data-v-1ab275ee]{scrollbar-width:thin;scrollbar-color:var(--px-border-color) var(--px-fill-color-light)}.px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar{width:8px}.px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-track{background:var(--px-fill-color-light);border-left:2px solid var(--px-border-color)}.px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-thumb{background:var(--px-border-color);border:2px solid var(--px-fill-color-light)}.px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-thumb:hover{background:var(--px-text-color-secondary)}.px-dark .px-select .px-select__menu-item[data-v-1ab275ee]:hover:after{background-image:repeating-linear-gradient(0deg,#0000 0 2px,#ffffff08 2px 4px)}.px-dark .px-select .px-select__menu[data-v-1ab275ee]{scrollbar-color:var(--px-border-color) var(--px-fill-color-darker)}.px-dark .px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-track{background:var(--px-fill-color-darker);border-left-color:var(--px-border-color)}.px-dark .px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-thumb{background:var(--px-border-color);border-color:var(--px-fill-color-darker)}.px-dark .px-select .px-select__menu[data-v-1ab275ee]::-webkit-scrollbar-thumb:hover{background:var(--px-text-color-secondary)}.px-select[data-v-e33550e6]{--px-select-item-hover-bg-color:var(--px-fill-color-light);--px-select-item-font-size:var(--px-font-size-base);--px-select-item-font-color:var(--px-text-color-primary);--px-select-item-selected-font-color:var(--px-color-primary);--px-select-item-selected-bg-color:var(--px-color-primary-light-9);--px-select-item-disabled-font-color:var(--px-text-color-disabled);--px-select-input-focus-border-color:var(--px-hover-border-color);--px-select-border-color:var(--px-border-color);--px-select-shadow-color:var(--px-shadow-color);--px-select-dropdown-bg-color:var(--px-fill-color-blank);--px-select-item-indicator-color:var(--px-color-primary);--px-select-item-highlighted-border-color:var(--px-color-primary);vertical-align:middle;line-height:32px;font-family:var(--px-font-family);display:inline-block}.px-select .px-tooltip__popper[data-v-e33550e6]{padding:0}.px-select .px-tooltip__popper[data-v-e33550e6]:after{background:var(--px-select-dropdown-bg-color)}.px-select .px-input .header-angle[data-v-e33550e6]{transition:none}.px-select .px-input .header-angle.is-active[data-v-e33550e6]{transform:rotate(180deg)}.px-select .px-select__nodata[data-v-e33550e6],.px-select .px-select__loading[data-v-e33550e6]{text-align:center;color:var(--px-text-color-secondary);font-size:var(--px-select-item-font-size);font-family:var(--px-font-family);margin:0;padding:12px 16px}.px-select .px-select__menu[data-v-e33550e6]{box-sizing:border-box;margin:0;padding:4px 0;list-style:none}.px-select .px-select__menu-item[data-v-e33550e6]{font-size:var(--px-select-item-font-size);font-family:var(--px-font-family);white-space:nowrap;text-overflow:ellipsis;color:var(--px-select-item-font-color);box-sizing:border-box;cursor:pointer;height:36px;margin:0;padding:0 16px 0 24px;line-height:36px;transition:none;position:relative;overflow:hidden}.px-select .px-select__menu-item[data-v-e33550e6]:before{content:"";clip-path:polygon(0 0,100% 50%,0 100%);z-index:2;background:0 0;border:2px solid #0000;width:6px;height:6px;position:absolute;top:50%;left:10px;transform:translateY(-50%)}.px-select .px-select__menu-item[data-v-e33550e6]:after{content:"";z-index:-1;background:0 0;position:absolute;inset:0 2px}.px-select .px-select__menu-item[data-v-e33550e6]:hover:after{background-color:var(--px-select-item-hover-bg-color);background-image:repeating-linear-gradient(0deg,#0000 0 2px,#00000008 2px 4px)}.px-select .px-select__menu-item[data-v-e33550e6]:hover:before{border-color:var(--px-hover-border-color);background:var(--px-hover-border-color)}.px-select .px-select__menu-item.is-selected[data-v-e33550e6]{color:var(--px-select-item-selected-font-color);font-weight:500}.px-select .px-select__menu-item.is-selected[data-v-e33550e6]:after{background-color:var(--px-select-item-selected-bg-color)}.px-select .px-select__menu-item.is-selected[data-v-e33550e6]:before{background:var(--px-select-item-indicator-color);border-color:var(--px-select-item-indicator-color)}.px-select .px-select__menu-item.is-highlighted[data-v-e33550e6]:after{background-color:var(--px-select-item-hover-bg-color)}.px-select .px-select__menu-item.is-highlighted[data-v-e33550e6]:before{border-color:var(--px-select-item-highlighted-border-color);background:var(--px-select-item-highlighted-border-color)}.px-select .px-select__menu-item.is-disabled[data-v-e33550e6]{color:var(--px-select-item-disabled-font-color);cursor:not-allowed}.px-select .px-select__menu-item.is-disabled[data-v-e33550e6]:hover:after{background-color:#0000}.px-select .px-select__menu-item.is-disabled[data-v-e33550e6]:hover:before{background:0 0;border-color:#0000}.px-select .px-select__menu-item[data-v-e33550e6]:first-child:after{clip-path:polygon(0 2px,2px 2px,2px 0,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,100% 2px,100% 100%,0 100%);top:2px}.px-select .px-select__menu-item[data-v-e33550e6]:last-child:after{clip-path:polygon(0 0,100% 0,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,calc(100% - 4px) 100%,4px 100%,4px 100%,2px calc(100% - 2px),0 calc(100% - 2px));bottom:2px}.px-select .px-select__menu-item[data-v-e33550e6]:first-child:last-child:after{clip-path:polygon(0 2px,2px 2px,2px 0,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,100% 2px,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,calc(100% - 4px) 100%,4px 100%,4px 100%,2px calc(100% - 2px),0 calc(100% - 2px));top:2px;bottom:2px}.px-select .px-input__inner[data-v-e33550e6]{cursor:pointer}.px-select.is-disabled[data-v-e33550e6]{opacity:.6;cursor:not-allowed}.px-select.is-ghost .px-tooltip__popper[data-v-e33550e6]:after{background:var(--px-select-dropdown-bg-color)}.px-select.px-select--large[data-v-e33550e6]{line-height:44px}.px-select.px-select--large .px-select__menu-item[data-v-e33550e6]{height:44px;line-height:44px;font-size:var(--px-font-size-large);padding:0 20px 0 28px}.px-select.px-select--large .px-select__menu-item[data-v-e33550e6]:before{width:8px;height:8px;left:12px}.px-select.px-select--small[data-v-e33550e6]{line-height:28px}.px-select.px-select--small .px-select__menu-item[data-v-e33550e6]{height:28px;line-height:28px;font-size:var(--px-font-size-small);padding:0 12px 0 20px}.px-select.px-select--small .px-select__menu-item[data-v-e33550e6]:before{width:4px;height:4px;left:8px}.px-select.px-select--primary[data-v-e33550e6]{--px-select-item-selected-font-color:var(--px-color-primary);--px-select-item-selected-bg-color:var(--px-color-primary-light-9);--px-select-item-indicator-color:var(--px-color-primary);--px-select-item-highlighted-border-color:var(--px-color-primary)}.px-select.px-select--success[data-v-e33550e6]{--px-select-item-selected-font-color:var(--px-color-success);--px-select-item-selected-bg-color:var(--px-color-success-light-9);--px-select-item-indicator-color:var(--px-color-success);--px-select-item-highlighted-border-color:var(--px-color-success)}.px-select.px-select--warning[data-v-e33550e6]{--px-select-item-selected-font-color:var(--px-color-warning);--px-select-item-selected-bg-color:var(--px-color-warning-light-9);--px-select-item-indicator-color:var(--px-color-warning);--px-select-item-highlighted-border-color:var(--px-color-warning)}.px-select.px-select--info[data-v-e33550e6]{--px-select-item-selected-font-color:var(--px-color-info);--px-select-item-selected-bg-color:var(--px-color-info-light-9);--px-select-item-indicator-color:var(--px-color-info);--px-select-item-highlighted-border-color:var(--px-color-info)}.px-select.px-select--danger[data-v-e33550e6]{--px-select-item-selected-font-color:var(--px-color-danger);--px-select-item-selected-bg-color:var(--px-color-danger-light-9);--px-select-item-indicator-color:var(--px-color-danger);--px-select-item-highlighted-border-color:var(--px-color-danger)}.px-select .px-select__menu[data-v-e33550e6]{scrollbar-width:thin;scrollbar-color:var(--px-border-color) var(--px-fill-color-light)}.px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar{width:8px}.px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-track{background:var(--px-fill-color-light);border-left:2px solid var(--px-border-color)}.px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-thumb{background:var(--px-border-color);border:2px solid var(--px-fill-color-light)}.px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-thumb:hover{background:var(--px-text-color-secondary)}.px-dark .px-select .px-select__menu-item[data-v-e33550e6]:hover:after{background-image:repeating-linear-gradient(0deg,#0000 0 2px,#ffffff08 2px 4px)}.px-dark .px-select .px-select__menu[data-v-e33550e6]{scrollbar-color:var(--px-border-color) var(--px-fill-color-darker)}.px-dark .px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-track{background:var(--px-fill-color-darker);border-left-color:var(--px-border-color)}.px-dark .px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-thumb{background:var(--px-border-color);border-color:var(--px-fill-color-darker)}.px-dark .px-select .px-select__menu[data-v-e33550e6]::-webkit-scrollbar-thumb:hover{background:var(--px-text-color-secondary)}