@layer clickui {/* stylelint-disable custom-property-pattern -- design tokens use camelCase (e.g. fileTabs) */
.tabs__jY99b {
  display: flex;
  position: relative;
  max-width: var(--file-tabs-count-width);
  overflow: auto;
  /* stylelint-disable plugin/no-unsupported-browser-features, declaration-property-value-no-unknown -- preserves the styled-components original verbatim; the invalid scrollbar-width value is ignored by browsers and the scrollbar is hidden via the ::-webkit-scrollbar rule below */
  overscroll-behavior: none;
  scrollbar-width: 0;
  /* stylelint-enable plugin/no-unsupported-browser-features, declaration-property-value-no-unknown */
}

.tabs__jY99b::-webkit-scrollbar {
  height: 0;
}

.tabs-sortable__7e-D1 {
  display: flex;
}

.tabs-sortable__7e-D1 > div {
  width: clamp(100px, 100%, 200px);
  min-width: 100px;
  height: 100%;
  outline: none;
}

.tabs-sortable__7e-D1 > div.sortable-ghost__1JlRB {
  opacity: 0;
}

.tab__Fud6d {
  display: grid;
  box-sizing: border-box;
  max-width: 100%;
  /* stylelint-disable plugin/no-unsupported-browser-features, declaration-property-value-no-unknown -- the original rule used this same width fallback chain (100% → -webkit-fill-available → fill-available → stretch) so the tab fills the available inline space */
  max-width: -webkit-fill-available;
  max-width: fill-available;
  max-width: stretch;
  /* stylelint-enable plugin/no-unsupported-browser-features, declaration-property-value-no-unknown */
  height: 100%;
  max-height: 100%;
  padding: var(--click-tabs-fileTabs-space-y) var(--click-tabs-fileTabs-space-x);
  justify-content: flex-start;
  align-items: center;
  gap: var(--click-tabs-fileTabs-space-gap);
  grid-template-columns: 1fr;
  border: none;
  border-right: 1px solid var(--click-tabs-fileTabs-color-stroke-default);
  border-radius: var(--click-tabs-fileTabs-radii-all);
  background: var(--click-tabs-fileTabs-color-background-default);
  color: var(--click-tabs-fileTabs-color-text-default);
  font: var(--click-tabs-fileTabs-typography-label-default);
  outline: none;
  cursor: pointer;
}

.tab__Fud6d svg,
.tab__Fud6d [data-indicator] {
  width: var(--click-tabs-fileTabs-icon-size-width);
  height: var(--click-tabs-fileTabs-icon-size-height);
}

.tab__Fud6d [data-type='close'] {
  display: none;
}

.tab__Fud6d [data-indicator] {
  display: block;
}

.tab__Fud6d:hover [data-type='close'] {
  display: block;
}

.tab__Fud6d:hover [data-indicator] {
  display: none;
}

.tab_active__nqwS6 {
  border-right: 1px solid var(--click-tabs-fileTabs-color-stroke-active);
  background: var(--click-tabs-fileTabs-color-background-active);
  color: var(--click-tabs-fileTabs-color-text-active);
  font: var(--click-tabs-fileTabs-typography-label-active);
}

.tab_inactive__tflkU:hover {
  border-right: 1px solid var(--click-tabs-fileTabs-color-stroke-hover);
  background: var(--click-tabs-fileTabs-color-background-hover);
  color: var(--click-tabs-fileTabs-color-text-hover);
  font: var(--click-tabs-fileTabs-typography-label-hover);
}

.tab_full-width__sU4rf {
  width: 100%;
}

.tab_fixed__S0Bwz {
  width: auto;
}

.tab_preview__FR-Q6 {
  font-style: italic;
}

.tab_dismissable__ud86m {
  grid-template-columns: 1fr var(--click-tabs-fileTabs-icon-size-width);
}

.indicator__ZD0YM {
  position: relative;
}

.indicator__ZD0YM::after {
  content: '';
  position: absolute;
  top: 0.25rem;
  left: 0.25rem;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: transparent;
}

.indicator__ZD0YM[data-indicator='success']::after {
  background: var(--click-alert-color-text-success);
}

.indicator__ZD0YM[data-indicator='neutral']::after {
  background: var(--click-alert-color-text-neutral);
}

.indicator__ZD0YM[data-indicator='danger']::after {
  background: var(--click-alert-color-text-danger);
}

.indicator__ZD0YM[data-indicator='warning']::after {
  background: var(--click-alert-color-text-warning);
}

.indicator__ZD0YM[data-indicator='info']::after {
  background: var(--click-alert-color-text-info);
}

.tab-content__JX6iV {
  display: flex;
  overflow: hidden;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  gap: var(--click-tabs-fileTabs-space-gap);
}

.tab-content-text__zXnlM {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.empty-button__czm-t {
  padding: 0;
}

.empty-button__czm-t:hover {
  background: var(--click-tabs-fileTabs-color-closeButton-background-hover);
}
}
