/* リストの装飾 */
.tabs__list {
}

/* タブ */
.tabs__tab {
  user-select: none;
  flex: 1 1 0%;
  border-bottom: 1px solid var(--dark-brown);
  opacity: 0.7;

  &.active {
    color: var(--vermilion);
    border-bottom-width: 2px;
    border-bottom-color: var(--vermilion);
    opacity: 1;
  }
}

/* フォーカスリング（キーボード操作の可視化に必須） */
.tabs__tab:focus-visible {
  outline: 2px solid #06f;
  outline-offset: 2px;
}

/* パネル */
.tabs__panel {
  &[hidden] {
    display: none;
  }
}