#charts {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  min-height: 0;
  padding: var(--main-padding);

  header {
    flex-shrink: 0;
    display: flex;

    white-space: nowrap;
    overflow-x: auto;
    padding-bottom: 1rem;
    margin-bottom: -2rem;
    padding-left: var(--main-padding);
    margin-left: var(--negative-main-padding);
    padding-right: var(--main-padding);
    margin-right: var(--negative-main-padding);

    & > * {
      flex: 1;
    }
  }

  .chart {
    flex: 1;
  }

  > .chart > legend,
  > fieldset {
    z-index: 20;
  }

  .lightweight-chart {
    z-index: 40;
  }
}
