@import 'apps/client/src/styles/ghostfolio-style';

:host {
  display: block;

  .chart-container {
    aspect-ratio: 16 / 9;
    height: auto;
    max-width: 50rem;

    // Fallback for aspect-ratio (using padding hack)
    @supports not (aspect-ratio: 16 / 9) {
      &::before {
        float: left;
        padding-top: 56.25%;
        content: '';
      }

      &::after {
        display: block;
        content: '';
        clear: both;
      }
    }

    gf-line-chart {
      bottom: 0;
      left: 0;
      right: 0;
      top: 0;
    }
  }
}