/*
 * CN-07 Tabs (content) — app/components/ui/tabs_component.rb
 * Underline style, spec §3.4 CN-07.
 */

.ui-tabs__list {
  display: flex;
  align-items: stretch;
  gap: var(--space-6);
  border-bottom: var(--border-hairline);
}

.ui-tabs__tab {
  appearance: none;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  height: var(--control-h);
  padding: 0;
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  line-height: var(--text-sm--line-height);
  font-weight: 500;
  color: var(--color-ink-muted);
  transition: color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out);
}

.ui-tabs__tab:hover {
  color: var(--color-ink);
}

.ui-tabs__tab.is-active {
  color: var(--color-ink);
  border-bottom-color: var(--color-accent-strong);
}

.ui-tabs__panel {
  padding-top: var(--space-4);
}