.chart__canvas-container {
  position: relative;
  height: 707px;
  width: 100%;
}
/* Mobile scroll wrapper */
.chart__scroll-wrapper {
  display: none;
  position: relative;
  height: 442px;
  overflow: hidden;
}
.chart__y-axis-fixed {
  position: absolute;
  left: 0;
  top: 0;
  width: 55px;
  height: calc(100% - 60px);
  z-index: 10;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0;
}
.chart__y-axis-label {
  color: white;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}
.chart__scrollable-chart {
  position: absolute;
  left: 36px;
  top: 0;
  right: 0;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}
.chart__chart-content {
  min-width: 800px;
  height: calc(100% - 60px);
  width: 100%;
}
.chart__custom-labels {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  display: flex;
  min-width: 800px;
  gap: 5px;
}
.chart__custom-label {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.9);
  font-size: 18px;
  font-weight: 600;
  text-align: center;
}
.chart__legend {
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  gap: 30px;
  margin-bottom: 40px;
}
@media (min-width: 1025px) {
  .chart__legend {
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: center;
  }
}
.chart__legend-item {
  display: flex;
  align-items: center;
  gap: 10px;
}
.chart__legend-color {
  width: 32px;
  height: 32px;
  border-radius: 4px;
  border: 1px solid #fff;
}
.chart__legend-color--traditional {
  background-color: #CE9FFC;
}
.chart__legend-color--ai {
  background-color: #683EC3;
}
.chart__legend-text {
  color: white;
  font-weight: 500;
  font-size: 18px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
/* Mobile responsive */
@media (max-width: 768px) {
  .chart__canvas-container {
    display: none;
  }
  .chart__scroll-wrapper {
    display: block;
  }
  .chart__legend {
    gap: 20px;
    margin-bottom: 32px;
  }
  .chart__legend-text {
    font-size: 18px;
  }
}
@media (max-width: 480px) {
  .chart__chart-content {
    min-width: 600px;
  }
  .chart__custom-labels {
    min-width: 600px;
  }
  .chart__legend {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22sourceRoot%22%3A%22%2F%22%2C%22sources%22%3A%5B%22wp-content%2Fcustom_codes%2F187-scss-default.scss%22%2C%22(stdin)%22%5D%2C%22names%22%3A%5B%5D%2C%22mappings%22%3A%22AAIA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BACJA%3BADWA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAOA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAaA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAOA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAUA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAWA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAWA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAQA%3BAACC%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAOD%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAMA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAOA%3BAAAA%3BAAAA%3BAAIA%3BAAAA%3BAAAA%3BAAIA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BACjHA%3BADyHA%3BAACC%3BAAAA%3BAAAA%3BAAGA%3BAAAA%3BAAAA%3BAAGA%3BAAAA%3BAAAA%3BAAAA%3BAAIA%3BAAAA%3BAAAA%3BAAAA%3BAAKD%3BAACC%3BAAAA%3BAAAA%3BAAGA%3BAAAA%3BAAAA%3BAAGA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%22%7D */