/*
  VTA Stage 9 chart x-axis spacing fix
  Scope: #analytics only

  Revision 1.0.3:
  - retain extra chart height;
  - retain visible overflow;
  - remove all SVG text repositioning;
  - reserve clear space beneath the untouched Google Charts axis title.
*/

#analytics .chart-placeholder {
  box-sizing: border-box !important;
  position: relative !important;
  min-height: 500px !important;
  height: 500px !important;
  overflow: visible !important;
  margin-bottom: 26px !important;
}

#analytics .chart-card--wide .chart-placeholder {
  min-height: 540px !important;
  height: 540px !important;
}

/*
  Google Charts creates nested positioned wrappers. A hidden overflow rule on
  any wrapper can crop the horizontal-axis title even when the outer card is tall.
*/
#analytics .chart-placeholder > div,
#analytics .chart-placeholder > div > div,
#analytics .chart-placeholder div[dir="ltr"] {
  overflow: visible !important;
}

#analytics .chart-placeholder svg {
  overflow: visible !important;
}

/*
  The source footer must begin after the chart's natural, unmodified axis title.
  No SVG text node is translated or otherwise repositioned.
*/
#analytics .chart-card__footer {
  position: relative;
  z-index: 2;
  margin-top: 26px !important;
}

@media (max-width: 1100px) {
  #analytics .chart-placeholder,
  #analytics .chart-card--wide .chart-placeholder {
    min-height: 480px !important;
    height: 480px !important;
    margin-bottom: 24px !important;
  }
}

@media (max-width: 700px) {
  #analytics .chart-placeholder,
  #analytics .chart-card--wide .chart-placeholder {
    min-height: 440px !important;
    height: 440px !important;
    margin-bottom: 22px !important;
  }
}
