How to stop a flexbox child from expanding the parent container in the secondary flex direction?

Question

How to stop a specific flexbox child from expanding the parent container in the secondary flex direction?

.my-component {
  display: flex;
}

.parent-wrapper {
  align-items: start;
  min-width: 200px;
  display: flex;
  flex-direction: column;
}

.parent-big {
  min-width: 200px;
  display: flex;
  flex-direction: column;
}

.parent {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.child { background-color: #FFCC99; }
.child-big { background-color: #99FFCC; }

<div class="my-component">
  <div class="parent-wrapper">
    Some other parent wrapper
  </div>
  <div class="parent-wrapper">
    <div class="parent-big">
      <div class="child-big">
        Some Random Big Child 1
      </div>
      <div class="child-big">
        Some Random Big Child 2
      </div>
    </div>
    <div class="parent">
      <div class="child">
        Child 3
      </div>
      <div class="child">
        Child 4
      </div>
      <div class="child">
        Child 5
      </div>
      <div class="child">
        Child 6
      </div>
      <div class="child">
        Child 7
      </div>
      <div class="child">
        Child 8
      </div>
    </div>
  </div>
</div>

In this example, I want .parent-wrapper to not take into account of .parent, while also allowing it to grow based on other children. How to stop .parent from expanding .parent-wrapper?

Got

I need