/**
 * Proportional scale-to-fit for knockout brackets and pool standings on narrow screens.
 */

.bracket-container,
.standings-scale-container {
  position: relative;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  margin: 0 auto 1rem;
}

.bracket-container__scale,
.standings-scale-container__scale {
  transform-origin: top left;
  will-change: transform;
}

.bracket-container__content,
.standings-scale-container__content {
  display: inline-block;
  width: max-content;
  max-width: none;
  vertical-align: top;
}

.bracket-container__content .td-bracket-columns {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}

.bracket-container__content .td-bracket-iframe-wrap {
  width: max-content;
  min-width: 720px;
  min-height: 400px;
}

.bracket-container__content .td-bracket-iframe {
  width: 100%;
  min-width: 720px;
  min-height: 400px;
  border: 0;
  display: block;
}

@media (max-width: 768px) {
  body.pt-scale-fit-active .td-bracket-root,
  body.pt-scale-fit-active .td-main,
  body.pt-scale-fit-active .dash-main {
    overflow-x: hidden;
  }

  .bracket-container.pt-scale-fit--ready {
    overflow: hidden;
  }

  .td-rr-table-wrap.td-rr-standings-only,
  .tdb-rr-standings-block {
    overflow-x: hidden;
  }

  .standings-scale-container.pt-scale-fit--ready {
    overflow: hidden;
  }
}

body.pt-native-app .bracket-container,
body.pt-native-app .standings-scale-container {
  max-width: 100%;
}

@media (min-width: 769px) {
  .bracket-container {
    overflow: visible;
    height: auto !important;
  }

  .bracket-container__scale {
    transform: none !important;
    width: auto !important;
    height: auto !important;
  }

  .bracket-container__content {
    display: block;
    width: 100%;
    max-width: 100%;
  }
}