.area-chart__text {
  position: absolute;
  z-index: 3;
  margin-left: 1em;
  margin-right: 1em;
}

.area-chart__title {
  margin-bottom: .6rem;
  color: var(--color-text);
  font-size: var(--font-size--sm);
}
.area-chart__wrap {
  position: relative;
  &:before {
    position: absolute;
    bottom: 0;
    display: block;
    content: '';
    width: 100%;
    background-image: linear-gradient(180deg, rgba(24,43,71,0.00) 0%, #182B47 100%);
    height: 100%;
    z-index: 2;
  }
}
.area-chart__value {

  table {
    border-spacing: inherit;
    width: 100%;
    color: #fff;
    tr {
      grid-template-columns: 1fr 1fr;
      display: grid;
      padding: var(--spacer-xs) 0;
      border-bottom: 1px solid var(--color-divider);
    }
    thead {
      font-size: var(--font-size--sm);
      color: var(--color-text);
      text-align: left;
    }
    tbody {

      tr:last-child{
        border-bottom: none;
      }
    }
    td:nth-child(even), th:nth-child(even) {
      text-align: right !important;
    }
  }
}