/* v41.6 – KO-Turnierbaum mobil zuverlässig horizontal scrollbar */

.koTreeScroller,
.publicKoOfficialScroller{
  width:100%;
  max-width:100%;
  overflow-x:auto !important;
  overflow-y:visible !important;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x !important;
  overscroll-behavior-x:contain;
  scrollbar-width:thin;
}

.koTreeBoard{
  width:max-content !important;
  min-width:max-content !important;
  max-width:none !important;
  display:flex !important;
  flex-wrap:nowrap !important;
}

/* Der Baum selbst darf breiter als der Bildschirm sein,
   seine Eltern aber nicht die ganze Seite verbreitern. */
.publicKoFullTree,
.koPatchBody,
.publicCompetitionsPage .card,
.publicCompetitionsPage{
  min-width:0 !important;
  max-width:100% !important;
}

@media(max-width:700px){
  .koTreeScroller,
  .publicKoOfficialScroller{
    position:relative;
    display:block !important;
    width:calc(100% + 2px) !important;
    max-width:calc(100vw - 28px) !important;
    margin-left:-1px;
    margin-right:-1px;
    padding:3px 2px 15px !important;
    overflow-x:scroll !important;
    overflow-y:hidden !important;
    scroll-snap-type:x proximity;
    touch-action:pan-x !important;
    cursor:grab;
  }

  .koTreeScroller:active,
  .publicKoOfficialScroller:active{
    cursor:grabbing;
  }

  .koTreeBoard{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:stretch !important;
    width:max-content !important;
    min-width:max-content !important;
    padding-right:12px;
  }

  .koTreeRound{
    flex:0 0 235px !important;
    width:235px !important;
    min-width:235px !important;
    scroll-snap-align:start;
  }

  /* Kein Elterncontainer darf den Swipe abfangen oder beschneiden. */
  .publicKoFullTree{
    overflow:visible !important;
    width:100% !important;
    max-width:100% !important;
  }

  .publicKoFullTree .koTreeScroller{
    overflow-x:scroll !important;
  }

  .publicCompetitionsPage .card{
    overflow:visible !important;
  }

  /* Vertikales Scrollen der Seite bleibt außerhalb des Baums normal. */
  body{
    overflow-x:hidden !important;
  }
}