/* TlbxPaneTabs strip (pane-tabs.js): one row of document tabs at the top of a pane. Tokens come from the app's theme, with
 * plain fallbacks for an app without one. */
.spt-tabs { display: flex; align-items: stretch; gap: 2px; flex: none; min-width: 0; overflow-x: auto; padding: 4px 6px;
  border-bottom: 1px solid var(--line, #d9d9de); background: var(--surface-2, var(--sl-surface, #f4f4f6)); scrollbar-width: thin; }
.spt-tabs[hidden] { display: none; }
.spt-tab { display: inline-flex; align-items: center; min-width: 0; max-width: 220px; border-radius: 6px; }
.spt-tab.on { background: var(--surface, var(--sl-surface, #fff)); box-shadow: inset 0 -2px 0 var(--accent, #2563eb); }
.spt-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 4px 6px 4px 9px; border: 0; background: none;
  color: inherit; font: inherit; font-size: 12px; cursor: pointer; }
.spt-tab.on .spt-name { font-weight: 600; }
.spt-x { flex: none; padding: 0 7px 0 3px; border: 0; background: none; color: inherit; font: inherit; font-size: 13px; line-height: 1; opacity: .55; cursor: pointer; }
.spt-tab:hover .spt-x, .spt-x:focus-visible { opacity: 1; }
.spt-name:focus-visible, .spt-x:focus-visible { outline: 2px solid var(--accent, #2563eb); outline-offset: -2px; }
.spt-add { flex: none; align-self: center; width: 26px; height: 26px; margin-left: 2px; border: 0; border-radius: 6px; background: none; color: inherit; font: inherit; font-size: 16px; line-height: 1; cursor: pointer; opacity: .7; }
.spt-add:hover, .spt-add:focus-visible { opacity: 1; background: color-mix(in srgb, currentColor 12%, transparent); outline: none; }
