ensis-ui 0.0.0-stage → 3.0.0

package/dist/components/tabs/src/RsTabs.css

@@ -0,0 +1,740 @@
+
+.rs-tabs {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  --rs-tabs-content-gap: 0px;
+}
+.rs-tabs__panel[data-state='inactive'],
+.rs-tabs__panel[hidden] {
+  display: none !important;
+}
+.rs-tabs__panel {
+  outline: none;
+}
+.rs-tabs__shell,
+.rs-tabs__body {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  position: relative;
+}
+.rs-tabs__nav {
+  display: flex;
+  align-items: stretch;
+  min-width: 0;
+  width: 100%;
+}
+.rs-tabs__nav-viewport {
+  flex: 1;
+  min-width: 0;
+}
+.rs-tabs--dropdown-overflow .rs-tabs__nav-viewport {
+  overflow: hidden;
+}
+.rs-tabs__measure {
+  position: absolute;
+  visibility: hidden;
+  pointer-events: none;
+  height: 0;
+  overflow: hidden;
+  white-space: nowrap;
+}
+.rs-tabs__measure-trigger {
+  pointer-events: none;
+}
+.rs-tabs--scrollable .rs-tabs__nav-viewport {
+  overflow-x: auto;
+  scrollbar-width: none;
+}
+.rs-tabs--scrollable .rs-tabs__nav-viewport::-webkit-scrollbar {
+  display: none;
+}
+.rs-tabs__list {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: stretch;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+.rs-tabs--scrollable .rs-tabs__list,
+.rs-tabs--dropdown-overflow .rs-tabs__list {
+  flex-wrap: nowrap;
+}
+.rs-tabs__trigger {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--rs-tabs-trigger-gap);
+  border: none;
+  background: transparent;
+  color: var(--rs-tabs-text);
+  font-size: var(--rs-font-size-sm);
+  line-height: var(--rs-line-height-tight);
+  white-space: nowrap;
+  cursor: pointer;
+  transition:
+    color var(--rs-transition-fast),
+    background var(--rs-transition-fast),
+    box-shadow var(--rs-transition-fast);
+}
+.rs-tabs__trigger:focus-visible {
+  outline: none;
+  box-shadow: inset 0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+  border-radius: var(--rs-radius-xs);
+}
+.rs-tabs__trigger:disabled {
+  opacity: var(--rs-tabs-disabled-opacity);
+  cursor: not-allowed;
+}
+.rs-tabs__trigger--dragging {
+  opacity: 0.45;
+}
+.rs-tabs__trigger--drag-over {
+  box-shadow: inset 0 -2px 0 0 var(--rs-tabs-ink);
+}
+.rs-tabs__trigger--fixed {
+  font-weight: var(--rs-font-weight-medium);
+}
+.rs-tabs--draggable .rs-tabs__trigger--movable,
+.rs-tabs--draggable .rs-tabs__trigger--movable:active,
+.rs-tabs--draggable .rs-tabs__trigger--dragging {
+  cursor: move;
+}
+.rs-tabs__drag {
+  display: inline-flex;
+  width: 0.5rem;
+  height: 0.75rem;
+  flex: 0 0 auto;
+  color: var(--rs-tabs-text);
+  opacity: 0.45;
+  background-image: radial-gradient(circle, currentColor 1px, transparent 1.15px);
+  background-size: 3px 3.333px;
+  background-repeat: repeat;
+}
+.rs-tabs__pin {
+  flex: 0 0 auto;
+  color: var(--rs-placeholder);
+  opacity: 0.85;
+}
+.rs-tabs__icon {
+  flex: 0 0 auto;
+  color: currentColor;
+}
+.rs-tabs__label {
+  min-width: 0;
+  max-width: var(--rs-tabs-label-max);
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.rs-tabs__rename-input {
+  width: 6.5rem;
+  max-width: var(--rs-tabs-label-max);
+  min-height: 1.5rem;
+  padding: 0 0.375rem;
+  border: 1px solid var(--rs-border);
+  border-radius: var(--rs-radius-xs);
+  background: var(--rs-bg);
+  color: var(--rs-text);
+  font: inherit;
+}
+.rs-tabs__rename-input:focus {
+  outline: none;
+  border-color: var(--rs-focus-border, var(--rs-primary));
+  box-shadow: 0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+}
+.rs-tabs__badge {
+  padding: 0 0.375rem;
+  border-radius: var(--rs-radius-full);
+  background: var(--rs-tabs-badge-bg);
+  color: var(--rs-tabs-text);
+  font-size: var(--rs-font-size-xs);
+  font-weight: var(--rs-font-weight-medium);
+  font-variant-numeric: tabular-nums;
+  line-height: 1.4;
+}
+.rs-tabs__trigger[data-state='active'] .rs-tabs__badge {
+  background: var(--rs-tabs-badge-active-bg);
+  color: var(--rs-tabs-text-active);
+}
+.rs-tabs__close {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--rs-tabs-close-size);
+  height: var(--rs-tabs-close-size);
+  flex: 0 0 auto;
+  margin-inline-start: 0.125rem;
+  padding: 0;
+  border: none;
+  border-radius: var(--rs-radius-xs);
+  background: transparent;
+  color: var(--rs-tabs-text);
+  cursor: pointer;
+  opacity: 0;
+  pointer-events: none;
+  transition:
+    opacity var(--rs-transition-fast),
+    background var(--rs-transition-fast),
+    color var(--rs-transition-fast);
+}
+.rs-tabs__trigger:hover .rs-tabs__close,
+.rs-tabs__trigger:focus-within .rs-tabs__close,
+.rs-tabs__trigger[data-state='active'] .rs-tabs__close {
+  opacity: 1;
+  pointer-events: auto;
+}
+.rs-tabs__close:hover:not(:disabled) {
+  background: var(--rs-surface-hover);
+  color: var(--rs-text);
+}
+.rs-tabs__close:focus-visible {
+  outline: none;
+  opacity: 1;
+  pointer-events: auto;
+  box-shadow: 0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+}
+.rs-tabs__close:disabled {
+  cursor: not-allowed;
+}
+.rs-tabs__trigger:hover .rs-tabs__close:disabled,
+.rs-tabs__trigger:focus-within .rs-tabs__close:disabled,
+.rs-tabs__trigger[data-state='active'] .rs-tabs__close:disabled {
+  opacity: var(--rs-tabs-disabled-opacity);
+  pointer-events: none;
+}
+@media (hover: none) {
+.rs-tabs__close {
+    opacity: 0.85;
+    pointer-events: auto;
+}
+.rs-tabs__trigger[data-state='active'] .rs-tabs__close {
+    opacity: 1;
+}
+.rs-tabs__close:disabled,
+  .rs-tabs__trigger[data-state='active'] .rs-tabs__close:disabled {
+    opacity: var(--rs-tabs-disabled-opacity);
+    pointer-events: none;
+}
+}
+.rs-tabs__add,
+.rs-tabs__scroll-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  margin: 0;
+  padding: 0 var(--rs-space-sm);
+  border: none;
+  border-radius: var(--rs-radius-xs);
+  background: transparent;
+  color: var(--rs-tabs-text);
+  cursor: pointer;
+  transition:
+    color var(--rs-transition-fast),
+    background var(--rs-transition-fast);
+}
+.rs-tabs__add:focus-visible,
+.rs-tabs__scroll-btn:focus-visible {
+  outline: none;
+  box-shadow: 0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+}
+.rs-tabs__add:hover,
+.rs-tabs__scroll-btn:hover {
+  color: var(--rs-tabs-text-active);
+  background: var(--rs-surface-hover);
+}
+.rs-tabs__extra {
+  display: inline-flex;
+  flex: 0 0 auto;
+  align-items: center;
+  align-self: stretch;
+  gap: var(--rs-space-xs);
+  margin-inline-start: auto;
+  padding-inline: var(--rs-space-sm);
+  border-inline-start: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs__overflow-wrap {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: stretch;
+  align-self: stretch;
+  margin-inline-start: var(--rs-space-xs);
+  padding-inline-start: var(--rs-space-sm);
+  border-inline-start: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs__more {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  min-height: var(--rs-control-height-md);
+  padding: 0 var(--rs-space-md);
+  border: none;
+  border-radius: 0;
+  background: transparent;
+  color: var(--rs-tabs-text);
+  font-size: var(--rs-font-size-sm);
+  line-height: var(--rs-line-height-tight);
+  white-space: nowrap;
+  cursor: pointer;
+  position: relative;
+  transition:
+    color var(--rs-transition-fast),
+    background var(--rs-transition-fast);
+}
+.rs-tabs__more:hover {
+  color: var(--rs-tabs-text-hover);
+}
+.rs-tabs__more:focus-visible {
+  outline: none;
+  box-shadow: inset 0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+  border-radius: var(--rs-radius-xs);
+}
+.rs-tabs__more-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: var(--rs-tabs-more-label-max);
+}
+.rs-tabs__more-icon {
+  flex-shrink: 0;
+  color: currentColor;
+  opacity: 0.72;
+}
+.rs-tabs__more--active {
+  color: var(--rs-tabs-text-active);
+  font-weight: var(--rs-font-weight-medium);
+}
+
+/* —— line —— */
+.rs-tabs--line .rs-tabs__body {
+  border: 1px solid var(--rs-tabs-border);
+  border-radius: var(--rs-radius);
+  background: var(--rs-tabs-surface);
+  overflow: hidden;
+}
+.rs-tabs--line .rs-tabs__list {
+  gap: 0;
+  padding: 0 var(--rs-space-sm);
+  border-bottom: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--dropdown-overflow.rs-tabs--line .rs-tabs__nav {
+  align-items: stretch;
+  padding-inline: 0;
+  border-bottom: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--dropdown-overflow.rs-tabs--line .rs-tabs__list {
+  flex: 1;
+  min-width: 0;
+  padding-inline: var(--rs-space-sm);
+  border-bottom: none;
+}
+.rs-tabs--dropdown-overflow.rs-tabs--line .rs-tabs__body {
+  padding-top: 0;
+}
+.rs-tabs--dropdown-overflow.rs-tabs--line .rs-tabs__more {
+  margin-bottom: -1px;
+}
+.rs-tabs--dropdown-overflow.rs-tabs--line .rs-tabs__more--active::after {
+  content: '';
+  position: absolute;
+  inset-inline: var(--rs-space-sm);
+  bottom: 0;
+  height: var(--rs-tabs-ink-size);
+  border-radius: 2px 2px 0 0;
+  background: var(--rs-tabs-ink);
+}
+.rs-tabs--line.rs-tabs--sm .rs-tabs__more {
+  min-height: var(--rs-control-height-sm);
+  padding: 0 var(--rs-space-sm);
+  font-size: var(--rs-font-size-xs);
+}
+.rs-tabs--line.rs-tabs--lg .rs-tabs__more {
+  min-height: var(--rs-control-height-lg);
+  padding: 0 var(--rs-space-lg);
+}
+.rs-tabs--line .rs-tabs__trigger {
+  position: relative;
+  margin-bottom: -1px;
+  border-radius: 0;
+}
+.rs-tabs--line.rs-tabs--sm .rs-tabs__trigger {
+  min-height: var(--rs-control-height-sm);
+  padding: 0 var(--rs-space-sm);
+  font-size: var(--rs-font-size-xs);
+}
+.rs-tabs--line.rs-tabs--md .rs-tabs__trigger {
+  min-height: var(--rs-control-height-md);
+  padding: 0 var(--rs-space-md);
+}
+.rs-tabs--line.rs-tabs--lg .rs-tabs__trigger {
+  min-height: var(--rs-control-height-lg);
+  padding: 0 var(--rs-space-lg);
+  font-size: var(--rs-font-size-base);
+}
+.rs-tabs--line .rs-tabs__add,
+.rs-tabs--line .rs-tabs__scroll-btn,
+.rs-tabs--line .rs-tabs__extra {
+  min-height: var(--rs-control-height-md);
+}
+.rs-tabs--line.rs-tabs--sm .rs-tabs__add,
+.rs-tabs--line.rs-tabs--sm .rs-tabs__scroll-btn,
+.rs-tabs--line.rs-tabs--sm .rs-tabs__extra {
+  min-height: var(--rs-control-height-sm);
+}
+.rs-tabs--line.rs-tabs--lg .rs-tabs__add,
+.rs-tabs--line.rs-tabs--lg .rs-tabs__scroll-btn,
+.rs-tabs--line.rs-tabs--lg .rs-tabs__extra {
+  min-height: var(--rs-control-height-lg);
+}
+.rs-tabs--line .rs-tabs__trigger:hover:not(:disabled):not([data-state='active']) {
+  color: var(--rs-tabs-text-hover);
+}
+.rs-tabs--line .rs-tabs__trigger[data-state='active'] {
+  color: var(--rs-tabs-text-active);
+  font-weight: var(--rs-font-weight-medium);
+}
+.rs-tabs--line .rs-tabs__trigger[data-state='active']::after {
+  content: '';
+  position: absolute;
+  inset-inline: var(--rs-space-sm);
+  bottom: 0;
+  height: var(--rs-tabs-ink-size);
+  border-radius: 2px 2px 0 0;
+  background: var(--rs-tabs-ink);
+}
+.rs-tabs--line .rs-tabs__panel-inner {
+  padding: var(--rs-space-md) var(--rs-space-lg);
+  color: var(--rs-text);
+  font-size: var(--rs-font-size-sm);
+  line-height: var(--rs-line-height-normal);
+}
+.rs-tabs--line.rs-tabs--sm .rs-tabs__panel-inner {
+  padding: var(--rs-space-sm) var(--rs-space-md);
+  font-size: var(--rs-font-size-xs);
+}
+.rs-tabs--line.rs-tabs--lg .rs-tabs__panel-inner {
+  padding: var(--rs-space-lg) var(--rs-space-xl);
+  font-size: var(--rs-font-size-base);
+}
+.rs-tabs--line.rs-tabs--panelless .rs-tabs__nav {
+  border-bottom: 1px solid var(--rs-tabs-border);
+  background: var(--rs-tabs-surface);
+}
+.rs-tabs--line.rs-tabs--panelless .rs-tabs__list {
+  border-bottom: none;
+}
+.rs-tabs--line.rs-tabs--panelless.rs-tabs--has-extra .rs-tabs__extra {
+  background: transparent;
+}
+
+/* —— segmented —— */
+.rs-tabs--segmented .rs-tabs__body {
+  border: 1px solid var(--rs-tabs-border);
+  border-radius: var(--rs-radius);
+  background: var(--rs-tabs-surface);
+  overflow: hidden;
+}
+.rs-tabs--segmented .rs-tabs__list {
+  gap: 0.25rem;
+  width: fit-content;
+  max-width: 100%;
+  margin: var(--rs-space-sm);
+  padding: 0.25rem;
+  border-radius: var(--rs-radius-sm);
+  background: var(--rs-tabs-segmented-track);
+}
+.rs-tabs--segmented .rs-tabs__trigger {
+  border-radius: var(--rs-radius-xs);
+}
+.rs-tabs--segmented.rs-tabs--sm .rs-tabs__trigger {
+  min-height: var(--rs-control-height-sm);
+  padding: 0 0.5rem;
+  font-size: var(--rs-font-size-xs);
+}
+.rs-tabs--segmented.rs-tabs--md .rs-tabs__trigger {
+  min-height: var(--rs-control-height-md);
+  padding: 0 0.75rem;
+}
+.rs-tabs--segmented.rs-tabs--lg .rs-tabs__trigger {
+  min-height: var(--rs-control-height-lg);
+  padding: 0 var(--rs-space-lg);
+  font-size: var(--rs-font-size-base);
+}
+.rs-tabs--segmented .rs-tabs__trigger:hover:not(:disabled):not([data-state='active']) {
+  color: var(--rs-tabs-text-hover);
+  background: var(--rs-tabs-surface);
+}
+.rs-tabs--segmented .rs-tabs__trigger[data-state='active'] {
+  color: var(--rs-tabs-text-active);
+  background: var(--rs-tabs-surface);
+  font-weight: var(--rs-font-weight-medium);
+  box-shadow: 0 1px 2px color-mix(in srgb, var(--rs-text) 8%, transparent);
+}
+.rs-tabs--segmented .rs-tabs__panel-inner {
+  padding: var(--rs-space-md) var(--rs-space-lg);
+  color: var(--rs-text);
+  font-size: var(--rs-font-size-sm);
+  line-height: var(--rs-line-height-normal);
+}
+.rs-tabs--segmented.rs-tabs--panelless .rs-tabs__list {
+  margin: 0;
+  background: var(--rs-tabs-segmented-track);
+}
+
+/* —— card —— */
+.rs-tabs--card .rs-tabs__body {
+  border: 1px solid var(--rs-tabs-border);
+  border-radius: var(--rs-radius);
+  background: var(--rs-tabs-surface);
+  overflow: hidden;
+}
+.rs-tabs--card .rs-tabs__list {
+  gap: 0.25rem;
+  padding: var(--rs-space-sm) var(--rs-space-sm) 0;
+}
+.rs-tabs--card .rs-tabs__trigger {
+  position: relative;
+  border: 1px solid transparent;
+  border-bottom: none;
+  border-radius: var(--rs-radius-sm) var(--rs-radius-sm) 0 0;
+  background: var(--rs-surface-hover);
+}
+.rs-tabs--card.rs-tabs--sm .rs-tabs__trigger {
+  min-height: var(--rs-control-height-sm);
+  padding: 0 var(--rs-space-sm);
+  font-size: var(--rs-font-size-xs);
+}
+.rs-tabs--card.rs-tabs--md .rs-tabs__trigger {
+  min-height: var(--rs-control-height-md);
+  padding: 0 var(--rs-space-md);
+}
+.rs-tabs--card.rs-tabs--lg .rs-tabs__trigger {
+  min-height: var(--rs-control-height-lg);
+  padding: 0 var(--rs-space-lg);
+  font-size: var(--rs-font-size-base);
+}
+.rs-tabs--card .rs-tabs__trigger:hover:not(:disabled):not([data-state='active']) {
+  color: var(--rs-tabs-text-hover);
+  background: var(--rs-tabs-surface);
+  border-color: var(--rs-tabs-border-subtle);
+}
+.rs-tabs--card .rs-tabs__trigger[data-state='active'] {
+  color: var(--rs-tabs-text-active);
+  font-weight: var(--rs-font-weight-medium);
+  background: var(--rs-tabs-surface);
+  border-color: var(--rs-tabs-border);
+  margin-bottom: -1px;
+  z-index: 1;
+}
+.rs-tabs--card .rs-tabs__panel-inner {
+  padding: var(--rs-space-md) var(--rs-space-lg);
+  border-top: 1px solid var(--rs-tabs-border-subtle);
+  color: var(--rs-text);
+  font-size: var(--rs-font-size-sm);
+  line-height: var(--rs-line-height-normal);
+}
+.rs-tabs--card.rs-tabs--panelless .rs-tabs__list {
+  padding-bottom: var(--rs-space-sm);
+}
+.rs-tabs--card .rs-tabs__extra {
+  align-self: center;
+  margin-bottom: 0;
+  border-inline-start: none;
+}
+.rs-tabs--content-gap-sm {
+  --rs-tabs-content-gap: var(--rs-space-sm);
+}
+.rs-tabs--content-gap-md {
+  --rs-tabs-content-gap: var(--rs-space-md);
+}
+.rs-tabs--content-gap-lg {
+  --rs-tabs-content-gap: var(--rs-space-lg);
+}
+.rs-tabs--content-gap-xl {
+  --rs-tabs-content-gap: var(--rs-space-xl);
+}
+.rs-tabs--borderless.rs-tabs--line .rs-tabs__body,
+.rs-tabs--borderless.rs-tabs--segmented .rs-tabs__body,
+.rs-tabs--borderless.rs-tabs--card .rs-tabs__body {
+  border: none;
+  border-radius: 0;
+  background: transparent;
+  box-shadow: none;
+  overflow: visible;
+}
+.rs-tabs--borderless .rs-tabs__shell,
+.rs-tabs--borderless .rs-tabs__nav,
+.rs-tabs--borderless .rs-tabs__list,
+.rs-tabs--borderless .rs-tabs__nav-viewport {
+  border: none;
+  border-bottom: none;
+  background: transparent;
+  box-shadow: none;
+}
+.rs-tabs--borderless.rs-tabs--line .rs-tabs__list,
+.rs-tabs--borderless.rs-tabs--line.rs-tabs--panelless .rs-tabs__nav,
+.rs-tabs--borderless.rs-tabs--dropdown-overflow.rs-tabs--line .rs-tabs__nav {
+  border-bottom: none;
+  background: transparent;
+  padding-inline: 0;
+}
+.rs-tabs--borderless .rs-tabs__panel,
+.rs-tabs--borderless .rs-tabs__panel-inner {
+  padding: 0;
+  border: none;
+  background: transparent;
+  box-shadow: none;
+}
+.rs-tabs--borderless .rs-tabs__panel-inner {
+  padding-block-start: var(--rs-tabs-content-gap);
+}
+.rs-tabs--borderless.rs-tabs--card .rs-tabs__panel-inner {
+  border-top: none;
+}
+.rs-tabs--justify-center .rs-tabs__list {
+  justify-content: center;
+}
+.rs-tabs--justify-evenly .rs-tabs__list {
+  width: 100%;
+  justify-content: space-evenly;
+}
+.rs-tabs--justify-stretch .rs-tabs__list {
+  display: flex;
+  width: 100%;
+  justify-content: stretch;
+}
+.rs-tabs--justify-stretch .rs-tabs__trigger {
+  flex: 1 1 0;
+  justify-content: center;
+}
+.rs-tabs--justify-stretch.rs-tabs--line .rs-tabs__trigger[data-state='active']::after {
+  inset-inline: 18%;
+}
+
+/* —— position：底 / 左 / 右 —— */
+.rs-tabs--position-bottom .rs-tabs__body,
+.rs-tabs--position-bottom .rs-tabs__shell {
+  flex-direction: column-reverse;
+}
+.rs-tabs--position-left .rs-tabs__body,
+.rs-tabs--position-left .rs-tabs__shell,
+.rs-tabs--position-right .rs-tabs__body,
+.rs-tabs--position-right .rs-tabs__shell {
+  flex-direction: row;
+  align-items: stretch;
+}
+.rs-tabs--position-right .rs-tabs__body,
+.rs-tabs--position-right .rs-tabs__shell {
+  flex-direction: row-reverse;
+}
+.rs-tabs--vertical .rs-tabs__nav {
+  flex-direction: column;
+  width: auto;
+  min-width: var(--rs-tabs-rail-min);
+  max-width: var(--rs-tabs-rail-max);
+}
+.rs-tabs--vertical .rs-tabs__nav-viewport {
+  min-height: 0;
+}
+.rs-tabs--vertical.rs-tabs--scrollable .rs-tabs__nav-viewport {
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+.rs-tabs--vertical .rs-tabs__list {
+  flex-direction: column;
+  flex-wrap: nowrap;
+  width: 100%;
+}
+.rs-tabs--vertical .rs-tabs__extra {
+  margin-inline-start: 0;
+  margin-block-start: auto;
+  border-inline-start: none;
+  border-block-start: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--vertical .rs-tabs__overflow-wrap {
+  margin-inline-start: 0;
+  padding-inline-start: 0;
+  border-inline-start: none;
+  border-block-start: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--position-left.rs-tabs--line .rs-tabs__list,
+.rs-tabs--position-left.rs-tabs--line.rs-tabs--panelless .rs-tabs__nav,
+.rs-tabs--position-left.rs-tabs--dropdown-overflow.rs-tabs--line .rs-tabs__nav {
+  border-bottom: none;
+  border-inline-end: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--position-right.rs-tabs--line .rs-tabs__list,
+.rs-tabs--position-right.rs-tabs--line.rs-tabs--panelless .rs-tabs__nav,
+.rs-tabs--position-right.rs-tabs--dropdown-overflow.rs-tabs--line .rs-tabs__nav {
+  border-bottom: none;
+  border-inline-start: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--position-bottom.rs-tabs--line .rs-tabs__list,
+.rs-tabs--position-bottom.rs-tabs--line.rs-tabs--panelless .rs-tabs__nav {
+  border-bottom: none;
+  border-top: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--vertical.rs-tabs--line .rs-tabs__trigger {
+  margin-bottom: 0;
+  width: 100%;
+}
+.rs-tabs--position-left.rs-tabs--line .rs-tabs__trigger[data-state='active']::after {
+  inset-inline: auto;
+  inset-inline-end: 0;
+  top: 18%;
+  bottom: 18%;
+  width: var(--rs-tabs-ink-size);
+  height: auto;
+  border-radius: 2px 0 0 2px;
+}
+.rs-tabs--position-right.rs-tabs--line .rs-tabs__trigger[data-state='active']::after {
+  inset-inline: auto;
+  inset-inline-start: 0;
+  top: 18%;
+  bottom: 18%;
+  width: var(--rs-tabs-ink-size);
+  height: auto;
+  border-radius: 0 2px 2px 0;
+}
+.rs-tabs--position-bottom.rs-tabs--line .rs-tabs__trigger[data-state='active']::after {
+  bottom: auto;
+  top: 0;
+  border-radius: 0 0 2px 2px;
+}
+.rs-tabs--vertical.rs-tabs--card .rs-tabs__list {
+  padding: var(--rs-space-sm) 0 var(--rs-space-sm) var(--rs-space-sm);
+}
+.rs-tabs--position-right.rs-tabs--card .rs-tabs__list {
+  padding: var(--rs-space-sm) var(--rs-space-sm) var(--rs-space-sm) 0;
+}
+.rs-tabs--vertical.rs-tabs--card .rs-tabs__trigger {
+  border-bottom: 1px solid transparent;
+  border-radius: var(--rs-radius-sm) 0 0 var(--rs-radius-sm);
+  margin-inline-end: -1px;
+}
+.rs-tabs--position-right.rs-tabs--card .rs-tabs__trigger {
+  border-radius: 0 var(--rs-radius-sm) var(--rs-radius-sm) 0;
+  margin-inline-end: 0;
+  margin-inline-start: -1px;
+}
+.rs-tabs--vertical.rs-tabs--card .rs-tabs__panel-inner {
+  border-top: none;
+  border-inline-start: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--position-right.rs-tabs--card .rs-tabs__panel-inner {
+  border-inline-start: none;
+  border-inline-end: 1px solid var(--rs-tabs-border-subtle);
+}
+.rs-tabs--vertical .rs-tabs__scroll-btn .rs-icon {
+  transform: rotate(90deg);
+}
+@media (prefers-reduced-motion: reduce) {
+.rs-tabs__trigger,
+  .rs-tabs__close,
+  .rs-tabs__add,
+  .rs-tabs__scroll-btn,
+  .rs-tabs__more {
+    transition: none;
+}
+}