*, ul, ol {
  margin: 0;
  padding: 0;
}


.overlay-50 {
  position: relative;
}
.btn-sml {min-width: 8rem;}
.btn-mini{min-width: 8rem;}
.rankingTitle{height: 165px;}
.bannertopleft{  top:10px; }
.bannertopright{ top: 10px; }
.bannerHochLinks{margin-top:3.75rem;text-align: left;}
.bannerHochRechts{margin-top:3.75rem;text-align: right;}

.leaderBoardBanner{ width:100%; }

.spieler-img {
  position: relative;
  display: block;
}

.checkinIcon {
  color: #00cc00;
  position: absolute;
  top: 5px;
  right: 5px;
}

.overlay-50:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgb(0 0 0 / 50%);
}

.col-fluid-left {
  margin-left: 0;
  width: auto;
}

.col-fixed-right {
  max-width: 570;
  /* You can adjust this width */
  width: 100%;
}

.carousel-control-prev,
.carousel-control-next {
  width: 5%;
}

.nav-tabs .nav-link i {
  padding-right: 5px;
}

.nav-tabs .nav-link {
  font-size: 20px;
  font-weight: bold;
}

.nav-tabs .nav-link.active {
  color: var(--color-accent);
}

.match-tab .table-bordered th,
.match-tab .table-bordered td {
  padding: 15px;
}

.match-tab table {
  width: 100%;
}

.match-tab .table-bordered th {
  background-color: var(--color-button-bg-hover);
  color: var(--color-button);
}



@media (max-width:767px) {

  .carousel-control-prev,
  .carousel-control-next {
    width: 30px;
  }
  ul.nav.nav-tabs.tab-icon-nav {
    display: flex;
    flex-direction: column;
  }
  .nav-tabs .nav-link.active, 
  .nav-tabs .nav-item.show .nav-link{
    border-width: 0;
    transition: .3s all linear;
  }
  .nav-tabs .nav-link.active, 
  .nav-tabs .nav-item:hover{
    background-color: #ddd;
  }
}

.marquee {
  float: left;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  animation: marquee 10s linear infinite;
}

.marquee-ticker {
  float: left;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  animation: marquee 30s linear infinite;
}


.marquee-content {
  display: inline-block;
}

.nav-ticker {
  box-sizing: border-box;
  padding: 10px 20px;
  font-weight: bold;
  white-space: nowrap;
  color: #FFF;
  box-sizing: border-box;
  display: inline-block;
  background-color: rgb(var(--light-n-0));
}

@keyframes marquee {
  0% {
    transform: translate3d(0, 0, 0);
  }

  100% {
    transform: translate3d(-50%, 0, 0);
  }
}

/*Team*/
.team-wrapper {
  height: 260px;
}

.profile-card {
  position: relative;
  font-family: sans-serif;
  width: 220px;
  height: 220px;
  background: #fff;
  padding: 30px;
  border-radius: 50%;
  box-shadow: 0 0 22px #3336;
  transition: .6s;
  margin: 30px auto;
}

.profile-card:hover {
  border-radius: 10px;
  height: 260px;
}

.profile-card .img {
  position: relative;
  width: 100%;
  height: 100%;
  transition: .6s;
  z-index: 99;
}

.profile-card:hover .img {
  transform: translateY(-60px);
}

.profile-card .img img {
  width: 100%;
  border-radius: 50%;
  box-shadow: 0 0 22px #3336;
  transition: .6s;
}

.profile-card:hover img {
  border-radius: 10px;
}

.profile-card .caption {
  text-align: center;
  transform: translateY(-80px);
  opacity: 0;
  transition: .6s;
}

.profile-card:hover .caption {
  opacity: 1;
}

.profile-card .caption h3 {
  font-size: 18px;
  font-family: sans-serif;
  margin-bottom: 10px;
}

.profile-card .caption p {
  font-size: 15px;
  color: #0c52a1;
  font-family: sans-serif;
  margin: 2px 0 9px 0;
}

.profile-card .caption .social-links a {
  color: #333;
  margin-right: 15px;
  font-size: 21px;
  transition: .6s;
}

.profile-card .caption .social-links a:last-child {
  margin-right: 0;
}

.profile-card .social-links a:hover {
  color: #0c52a1;
}

/*Video Sec*/

section.video-sec {
  padding: 100px 0;
}

section.video-sec .plyr__video-wrapper,
section.video-sec .plyr__poster {
  background-color: transparent;
}

section.video-sec .plyr--video {
  background-color: transparent;
  box-shadow: 0px 10px 10px #959595;
  margin: 30px;
}

section.video-sec .owl-carousel .owl-nav .owl-prev {
  left: 0;
  text-transform: capitalize;
  text-transform: capitalize;
}

.video-section .item {
  opacity: 0.4;
  transition: .4s ease all;
  margin: 0 20px;
  transform: scale(.8);
}

.video-section .owl-item.active .item {
  opacity: 1;
}

/**/
.video-tab {
  position: relative;
  padding-top: 4.1%;
  padding-bottom: 51.95%;
  height: 0;
}

.video-tab iframe {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  min-height: 0;
}

.video-gallery {
  position: relative;
  width: 100%;
}

.video-gallery .video-tab {
  animation: 1200ms video-fadeOut ease;
  animation-fill-mode: both;
  grid-column-start: 1;
  grid-row-start: 1;
  grid-row-end: 7;
  max-height: 19.5em;
  opacity: 0;
  transition: all 300ms ease;
}

.video-gallery input[type=radio] {
  font-size: 0;
  height: 0;
  opacity: 0;
  padding: 0;
  position: fixed;
  width: 0;
}

.video-gallery input {
  grid-column-start: 1;
  grid-row-start: 1;
}

.video-gallery label {
  grid-column-start: 2;
  margin: 0 !important;
  padding: 13px 30px;
  position: relative;
  border-bottom: 1px solid #CCCCCC;
}

.video-gallery label:last-of-type {
  border: 0 none;
}

.video-gallery input[type=radio]:checked+label {
  color: #E41F35 !important;
}

.video-gallery input[type=radio]:checked+label:before {
  content: "▶";
  left: 10px;
  top: 12px;
  position: absolute;
}

.grid-row {
  display: block;
  height: 56vw;
  max-height: 19.5em;
  position: relative;
}

.grid-row label {
  left: calc(50% + 16px);
  position: relative;
  width: calc(50% - 16px);
}

.grid-row .video-tab {
  padding: 0;
  position: absolute;
  top: 0;
  width: 0;
}

.grid-row:after {
  content: "";
  clear: both;
  display: table;
}

#video-1:checked~.video-1,
#video-2:checked~.video-2,
#video-3:checked~.video-3,
#video-4:checked~.video-4,
#video-5:checked~.video-5,
#video-6:checked~.video-6 {
  animation: 1200ms video-fadeIn ease;
  animation-fill-mode: both;
  opacity: 1;
  width: 50%;
}

@keyframes video-fadeOut {
  0% {
    display: block;
    height: 56vw;
    opacity: 1;
    width: 50%;
  }

  25% {
    display: block;
    height: 56vw;
    opacity: 1;
    width: 50%;
  }

  49% {
    display: block;
    height: 56vw;
    opacity: 0;
    width: 50%;
  }

  50% {
    display: none;
    height: 0;
    opacity: 0;
    width: 0;
  }
}

@keyframes video-fadeIn {
  0% {
    opacity: 0;
    width: 0;
  }

  49% {
    display: none;
    height: 0;
    opacity: 0;
    width: 0;
  }

  50% {
    display: block;
    height: 56vw;
    opacity: 0;
    width: 50%;
  }

  100% {
    display: block;
    height: 56vw;
    opacity: 1;
    width: 50%;
  }
}

@supports (display: grid) {
  .grid-row {
    align-items: start;
    display: grid;
    grid-column-gap: 30px;
    grid-row-gap: 0;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }

  .grid-row label {
    left: auto;
    width: 100%;
  }

  .grid-row .video-tab {
    position: relative;
    width: 100%;
  }

  @keyframes video-fadeOut {
    0% {
      display: block;
      height: 56vw;
      opacity: 1;
      width: 100%;
    }

    25% {
      display: block;
      height: 56vw;
      opacity: 1;
      width: 100%;
    }

    49% {
      display: block;
      height: 56vw;
      opacity: 0;
      width: 100%;
    }

    50% {
      display: none;
      height: 0;
      opacity: 0;
      width: 0;
    }
  }

  @keyframes video-fadeIn {
    0% {
      opacity: 0;
      width: 0;
    }

    49% {
      display: none;
      height: 0;
      opacity: 0;
      width: 0;
    }

    50% {
      display: block;
      height: 56vw;
      opacity: 0;
      width: 100%;
    }

    100% {
      display: block;
      height: 56vw;
      opacity: 1;
      width: 100%;
    }
  }
}

@media (max-width: 767px) {
  section.video-sec .plyr--video,
  .video-section .owl-item.active .item {
    transform: scale(1);
    margin:0px;
  }
  .video-gallery {
    /* display: flex;
    flex-direction: column;
    height: auto;
    max-height: none; */
  }
  .video-gallery { display: block; max-height: inherit; height: auto; }
  .video-gallery label {
    left: auto;
    order: 2;
    width: 100%;
  }

  .video-gallery .video-tab {
    /* order: 1;
    padding-top: 4.1%;
    padding-bottom: 51.95%;
    position: relative;
    top: auto;
    width: 100%; */
  }

  #video-1:checked~.video-1,
  #video-2:checked~.video-2,
  #video-3:checked~.video-3,
  #video-4:checked~.video-4,
  #video-5:checked~.video-5,
  #video-6:checked~.video-6 {
    width: 100%;
  }

  @keyframes video-fadeOut {
    0% {
      display: block;
      height: 56vw;
      opacity: 1;
    }

    25% {
      display: block;
      height: 56vw;
      opacity: 1;
    }

    49% {
      display: block;
      height: 56vw;
      opacity: 0;
    }

    50% {
      display: none;
      height: 0;
      opacity: 0;
    }
  }

  @keyframes video-fadeIn {
    0% {
      opacity: 0;
    }

    49% {
      display: none;
      height: 0;
      opacity: 0;
    }

    50% {
      display: block;
      height: 56vw;
      opacity: 0;
    }

    100% {
      display: block;
      height: 56vw;
      opacity: 1;
    }
  }
}

/*New Slider*/
.new-slider {
  margin-top: 44px;
  position: relative;
  width: 100%;
  height: 50vh;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
}

.new-slider .slider {
  display: inherit;
  vertical-align: inherit;
  position: static;
}

/* Crossfade-Slider: alle Slides vollflaechig gestapelt, nur der aktive (nth-child(2))
   ist sichtbar. Ein-/Ausblenden ueber opacity -> funktioniert in BEIDE Richtungen
   identisch. Frueher waren die nicht-aktiven Slides display:none -> beim Prev
   (prepend) konnte der ausgehende Slide nicht ueberblenden, sondern verschwand
   schlagartig ("komische Effekte"). Next funktionierte nur zufaellig, weil der
   ausgehende Slide dort auf nth-child(1) landete und sichtbar blieb. */
.new-slider .item {
  list-style-type: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: none;
  z-index: 1;
  background-position: center;
  background-size: cover;
  border-radius: 0;
  box-shadow: none;
  opacity: 0;
  transition: opacity 0.75s ease-in-out;

  &.active {
    opacity: 1;
    z-index: 2;
  }
}

.new-slider .content {
  width: min(40vw, 500px);
  position: absolute;
  top: 50%;
  left: 10rem;
  transform: translateY(-50%);
  font: 400 0.85rem helvetica, sans-serif;
  color: white;
  text-shadow: 0 3px 8px rgba(0, 0, 0, 0.5);
  opacity: 0;
  display: none;
  background-color: rgb(0 0 0 / 60%);
  padding: 30px;

  & .title {
    color: currentColor;
  }

  & .description {
    line-height: 1.7;
    margin: 1rem 0 1.5rem;
  }

  & .button {
    display: inline-block;
    width: fit-content;
    background-color: rgba(0, 0, 0, 0.1);
    color: white;
    border: 2px solid white;
    border-radius: 0.25rem;
    padding: 0.75rem;
    cursor: pointer;
  }

  & .button:hover {
    color: var(--color-button-hover);
    background-color: var(--color-button-bg-hover);
    border-color: var(--color-button-bg-hover);
  }
}

.new-slider .item.active .content {
  display: block;
  animation: show 0.75s ease-in-out 0.3s forwards;
}

@keyframes show {
  0% {
    filter: blur(5px);
    transform: translateY(calc(-50% + 75px));
  }

  100% {
    opacity: 1;
    filter: blur(0);
  }
}

.new-slider .nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;

  & .prev::before {
    content: "\f060";
    font-weight: 900;
    font-family: "Font Awesome 6 free";
  }

  & .next::before {
    content: "\f061";
    font-weight: 900;
    font-family: "Font Awesome 6 free";
  }

  & .btn {
    background-color: rgba(255, 255, 255, 0.5);
    color: rgba(0, 0, 0, 0.7);
    margin: 0 15px;
    border-radius: 50%;
    cursor: pointer;
    width: 40px;
    height: 40px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;

    &:hover {
      background-color: rgba(255, 255, 255, 0.3);
    }
  }
}

@media (width < 1199px) {
  .new-slider .content {    
    left: 60px;
  }
}



@media (width > 650px) and (width < 900px) {
  .doBanner {
    display: none;
  }

  .new-slider .content {    
    width: 80%;
    left: 10%;

    & .title {
      font-size: 1rem;
    }

    & .description {
      font-size: 0.7rem;
    }

    & button {
      font-size: 0.7rem;
    }
  }

  /* Thumbnail-Sizing des alten Designs entfernt — Crossfade bleibt vollflaechig */
}




@media (width < 650px) {

  .doBanner {
    display: none;
  }


  .new-slider {
    height: 252px;
  }
  .new-slider .content {
    top: 58%;
    padding-top: 10px;

    & .title {
      font-size: 0.9rem;
    }

    & .description {
      font-size: 0.65rem;
    }

    & button {
      font-size: 0.7rem;
    }
  }

  /* Thumbnail-Sizing des alten Designs entfernt — Crossfade bleibt vollflaechig */
  .new-slider .item .content {
    width: 80%;
    left: 10%;
  }
}

.tab-content ul {
  margin-left: 20px;
  margin-bottom: 20px;
}

/*FAQ*/
.collapsible-link {
  width: 100%;
  position: relative;
  text-align: left;
  color: var(--color-body);
  font-size: 24px;
  font-family: var(--typo-heading);
}

.collapsible-link::before {
  content: "\f107";
  position: absolute;
  top: 50%;
  right: 0.8rem;
  transform: translateY(-50%);
  display: block;
  font-family: "FontAwesome";
  font-size: 1.1rem;
}

.collapsible-link[aria-expanded="true"]::before {
  content: "\f106";
}

.shadow-sm {
  box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}

#faq-accordion .card {
  color: var(--color-body);
  margin-bottom: -1px;
  border-radius: 0 !important;
}

.btn-link:focus,
.btn-link:hover {
  color: var(--color-accent);
  text-decoration: none !important;
}

.content-block.faq:before {
  content: '';
  position: absolute;
  background-color: #000;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  opacity: .5;
}

/*Team*/
.team-area .single-item {
  margin-bottom: 30px;
}

.team-area .item .thumb {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.team-area .item .thumb::after {
  background: #232323 none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transition: all 0.35s ease-in-out;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  -ms-transition: all 0.35s ease-in-out;
  -o-transition: all 0.35s ease-in-out;
  width: 100%;
}

.team-area .team-items .item:hover .thumb::after {
  opacity: 0.7;
}

.team-area .item .thumb .team-overlay {
  top: 0%;
  opacity: 0;
  visibility: hidden;
  left: 0;
  padding: 20px;
  position: absolute;
  text-align: center;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  -ms-transition: all 0.35s ease-in-out;
  -o-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
  width: 100%;
  z-index: 1;
}

.team-area .item:hover .thumb .team-overlay {
  top: 50%;
  transform: translate(-50%, -50%);
  left: 50%;
  opacity: 1;
  visibility: visible;
}

.team-area .item .thumb .team-overlay p {
  color: #ffffff;
}

.team-area .item .thumb .team-overlay h4 {
  color: #ffffff;
  display: inline-block;
  position: relative;
  text-transform: uppercase;
}

.team-area .item .thumb img {
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  -ms-transition: all 0.35s ease-in-out;
  -o-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}

.team-area .item:hover .thumb img {
  opacity: .6;
}

.team-area .item .thumb .social li {
  display: inline-block;
}

.team-area .item .thumb .social li a {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  color: #ffffff;
  display: inline-block;
  height: 40px;
  line-height: 40px;
  margin: 0 2px;
  text-align: center;
  width: 40px;

}

.team-area .item .thumb .social li a:hover {
  transform: scale(1.1);
}

.team-area .info {
  background: #ffffff none repeat scroll 0 0;
  -moz-box-shadow: 0 0 10px #cccccc;
  -webkit-box-shadow: 0 0 10px #cccccc;
  -o-box-shadow: 0 0 10px #cccccc;
  box-shadow: 0 0 10px #cccccc;
  padding: 40px 20px 20px;
  position: relative;
  text-align: center;
  z-index: 9;
}

.team-area .info .message {
  height: 50px;
  line-height: 40px;
  margin-left: -25px;
  margin-top: -25px;
  position: absolute;
  text-align: center;
  top: 0;
  width: 50px;
}

.team-area .info .message a {
  background: #fff none repeat scroll 0 0;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-box-shadow: 0 0 10px #cccccc;
  -webkit-box-shadow: 0 0 10px #cccccc;
  -o-box-shadow: 0 0 10px #cccccc;
  box-shadow: 0 0 10px #cccccc;
  box-sizing: border-box;
  color: var(--color-accent);
  display: inline-block;
  font-size: 20px;
  height: 50px;
  line-height: 50px;
  width: 50px;
}

.team-area .info .message a i {
  font-weight: 500;
}

.team-area .info h4 {
  font-weight: 600;
  margin-bottom: 5px;
  text-transform: capitalize;
}

.team-area .info span {
  color: var(--color-accent);
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  text-transform: uppercase;
}

.team-area .social li.twitter a {
  background-color: #00b6f1;
}

.team-area .social li.pinterest a {
  background-color: #bd081c;
}

.team-area .social li.facebook a {
  background-color: #3b5998;
}

.team-area .social li.google-plus a {
  background-color: #df4a32;
}

.team-area .social li.vimeo a {
  background-color: #1ab7ea;
}

.team-area .social li.instagram a {
  background-color: #cd486b;
}

.gridButtonSmall {
  height: 20px;
}


.greyButton{
  background-color: #aaaaaa;  
}

.orangeButton{
  background-color: #ffaa00;  
}

.redButton{
  background-color: #ff0000;  
}

.yellowButton{
  background-color: #ffff00;  
  color: #000000;
}


input.form-control:not([size]):not([multiple]) {
  height: calc(2.25rem + 2px);
}




.promo-block1 {
  background-image: url('../img/promo1-bg.jpg');
}

.promo-block2 {
  background-image: url('../img/promo2-bg.jpg');
}

.btn-group-xs > .btn, .btn-xs {
  padding: 1px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.progressBuyin {
  color: #ffffff;

}


.progressBarBuyin {
  background-color: #002800;
  position: relative; /* Anker für das zentrierte Label-Overlay */
}

/* Slots-Zahl (z.B. 1/9) zentriert ÜBER dem ganzen Balken statt im schmalen
   Füllbereich -> immer lesbar, unabhängig von der Füllbreite. pointer-events:none,
   damit der Tooltip (title) des Containers über die volle Breite hoverbar bleibt. */
.progressBarBuyin .progress-label {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 11px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  pointer-events: none;
  z-index: 2;
  /* Kontrast auf hellem (gelb/rot) wie dunklem Untergrund */
  text-shadow: 0 0 2px rgba(0,0,0,.85), 0 0 3px rgba(0,0,0,.7);
}

/* Basis: Bullets weg + Platz schaffen */
ul.ranglistenliste {
  list-style: none !important;
  margin: 0;
  padding: 0;
}

ul.ranglistenliste > li {
  list-style: none !important;
  position: relative;
  padding-left: 1.6rem;
  margin-bottom: .35rem;
  line-height: 1.2;
  text-align: left;
}

ul.ranglistenliste > li:nth-child(4n + 1)::before {
  content: "♠";
  color: #000; /* dein Grün, oder #000 für schwarz */
}

ul.ranglistenliste > li:nth-child(4n + 2)::before {
  content: "♥";
  color: #c00;
}

ul.ranglistenliste > li:nth-child(4n + 3)::before {
  content: "♣";
  color: #000;
}

ul.ranglistenliste > li:nth-child(4n + 4)::before {
  content: "♦";
  color: #c00;
}

/* gemeinsame Positionierung */
ul.ranglistenliste > li::before {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.1em;
}


/* Basis: Bullets weg + Platz schaffen */
ul.cards {
  list-style: none !important;
  margin: 0;
  padding: 0;
}

ul.cards > li {
  list-style: none !important;
  position: relative;
  padding-left: 1.6rem;
  margin-bottom: .35rem;
  line-height: 1.2;
  text-align: left;
}

ul.cards > li:nth-child(4n + 1)::before {
  content: "♠";
  color: #000; /* dein Grün, oder #000 für schwarz */
}

ul.cards > li:nth-child(4n + 2)::before {
  content: "♥";
  color: #c00;
}

ul.cards > li:nth-child(4n + 3)::before {
  content: "♣";
  color: #000;
}

ul.cards > li:nth-child(4n + 4)::before {
  content: "♦";
  color: #c00;
}

/* gemeinsame Positionierung */
ul.cards > li::before {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.1em;
}

@media (max-width: 768px) {
  ul.cards {
    padding-left: 0.5rem;
  }

  ul.cards > li {
    padding: 0.4rem 0.55rem 0.4rem 1.95rem;
    margin-bottom: 0;
    border-radius: 8px;
  }

  ul.cards > li:nth-child(odd) {
    background: rgba(0, 48, 12, 0.04);
  }

  ul.cards > li:nth-child(even) {
    background: rgba(0, 0, 0, 0.015);
  }

  ul.cards > li::before {
    left: 0.55rem;
    top: 0.55rem;
    transform: none;
  }
}




/* =========================
   1) Poker-Bullets in News-Listen
   ========================= */
ul.ranglistenliste {
  list-style: none !important;
  margin: 0;
  padding: 0;
}
ul.ranglistenliste > li {
  list-style: none !important;
  position: relative;
  padding-left: 1.6rem;
  margin-bottom: .35rem;
  line-height: 1.2;
  text-align: left;
}
/* 4 Symbole im Wechsel */
ul.ranglistenliste > li:nth-child(4n + 1)::before { content: "♠"; color: #000; }
ul.ranglistenliste > li:nth-child(4n + 2)::before { content: "♥"; color: #c00; }
ul.ranglistenliste > li:nth-child(4n + 3)::before { content: "♣"; color: #000; }
ul.ranglistenliste > li:nth-child(4n + 4)::before { content: "♦"; color: #c00; }
ul.ranglistenliste > li::before {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.1em;
}


/* =========================
   2) Desktop-Sidebanner ausblenden, Mitte auf 100%
   ========================= */
@media (max-width: 1200px) {
  /* explizite Banner-Klassen */
  .bannerHochLinks,
  .bannerHochRechts {
    display: none !important;
  }

  /* alle 200x600-Bilder in 2er-Spalten links/rechts */
  .col-md-2.text-left img[src*="200x600"],
  .col-md-2.text-right img[src*="200x600"] {
    display: none !important;
  }

  /* leergewordene 2er-Spalten ausblenden */
  .col-md-2.text-left:empty,
  .col-md-2.text-right:empty {
    display: none !important;
  }

  /* mittlere Spalte darf voll breit sein */
  .multiple-row > [class*="col-md-8"],
  .multiple-row > [class*="col-lg-8"],
  .content-block .row > .col-md-8 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* Breakpoints für die News-Karten */
@media (max-width: 992px) {
  .multiple-row .col-md-6,
  .multiple-row .col-lg-4 {
    max-width: 50%;
    flex: 0 0 50%;
  }

  /* fix gegen alte Inline-Höhen */
  .post-text-block[style] {
    height: auto !important;
  }
}
@media (max-width: 600px) {
  .multiple-row .col-md-6,
  .multiple-row .col-lg-4 {
    max-width: 100%;
    flex: 0 0 100%;
  }
}


/* =========================
   3) News-Karten gleich hoch + Button unten
   (angepasst auf deine Struktur: col -> col-wrap -> post-grid -> post-text-block)
   ========================= */

/* Spalten selbst als Flex, damit alle gleich hoch ziehen */
.multiple-row .col-md-6,
.multiple-row .col-lg-4 {
  display: flex;
}

/* col-wrap muss auch flexen */
.multiple-row .col-md-6 > .col-wrap,
.multiple-row .col-lg-4 > .col-wrap {
  display: flex;
  width: 100%;
}

/* eigentliche Karte */
.multiple-row .col-md-6 > .col-wrap > .post-grid,
.multiple-row .col-lg-4 > .col-wrap > .post-grid {
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* Text-Teil soll den Platz nehmen … */
.multiple-row .post-grid .post-text-block {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  height: auto !important;   /* killt alte Inline-Höhen */
}

.multiple-row .post-grid .post-text-block p {
  text-align: left;
}

/* … und der Button wirklich nach unten */
.multiple-row .post-grid .post-text-block .btn,
.multiple-row .post-grid .post-text-block .news-readmore {
  margin-top: auto;
  align-self: center;
}




/* Spieler-Kacheln enger machen auf kleiner Breite */
@media (max-width: 768px) {
  .demo-wrapper .row .col-md-4.col-lg-4 {
    flex: 0 0 50%;
    max-width: 50%;
    text-align: center;
  }
}

/* noch kleiner: 3 pro Zeile */
@media (max-width: 520px) {
  .demo-wrapper .row .col-md-4.col-lg-4 {
    flex: 0 0 33.3333%;
    max-width: 33.3333%;
  }
}

/* ganz klein: 4 pro Zeile, wenn’s dir gefällt */
@media (max-width: 420px) {
  .demo-wrapper .row .col-md-4.col-lg-4 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .demo-wrapper .row .col-md-4.col-lg-4 img {
    max-width: 100%;
    height: auto;
  }
}



/************ HOME › Turnierresultate (rechte Spalte) ************/
#resultateRow .result-card {           /* die einzelne Karte */
  position: relative;
  padding: 12px 14px;
}

/* Club-Logo oben rechts */
#resultateRow .clubLogo {
  position: absolute;
  top: 8px;
  right: 10px;
  width: 50px;           /* wir haben 50×50 bzw. 100×100 */
  height: 50px;
  object-fit: contain;
  border-radius: 6px;
}

/* Buy-In + Spieleranzahl in eine Zeile */
#resultateRow .result-meta {
  display: flex;
  gap: .75rem;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

/* Gewinner: 3 Spalten Grid – auch auf Mobile */
#resultateRow .winners-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .5rem .75rem;
  align-items: start;
  margin-top: .35rem;
}

/* Avatar-Link als Block zentrieren */
#resultateRow .winner a,
#resultateRow .playerAvatarLink {
  display: block;
  width: 64px;
  margin-inline: auto;
}

/* Avatare: runde Thumbs, sauber beschnitten */
#resultateRow .winner img,
#resultateRow .playerAvatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
}

/* Namen unter den Bildern zentrieren */
#resultateRow .winner .name {
  display: block;
  margin-top: .25rem;
  text-align: center;
  font-size: .86rem;
  line-height: 1.15;
}

/* Theme-Effekte auf Bilder in diesem Block neutralisieren */
#resultateRow .winner img,
#resultateRow .clubLogo {
  min-height: 0 !important;
  transform: none !important;
  filter: none !important;
  box-shadow: none !important;
}

/* Sicherheitsnetz: Falls irgendwo noch feste Breiten/Höhen drinhängen */
#resultateRow img {
  max-width: 100%;
  height: auto;
}

/* Kleine Screens: weiterhin 3 Gewinner pro Reihe */
@media (max-width: 575.98px) {
  #resultateRow .winners-grid { grid-template-columns: repeat(3, 1fr); }
}

/* === Turnierresultate – eigener Bereich ========================= */
#resultateRow .post-grid .post-text-block {
  position: relative;
}

/* 1) Club-Logo oben rechts */
#resultateRow .post-grid .post-text-block > .row:first-of-type .col-md-4 img {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 50px;
  height: 50px;
  object-fit: contain;
  margin: 0;
}

/* 2) Buy-In + Spieleranzahl: linke Spalte ausblenden, rechte soll den Text haben */
#resultateRow .post-grid .post-text-block > .row:first-of-type .col-md-4 {
  /* das war früher einfach ein Bildcontainer – brauchen wir nicht mehr sichtbar */
  min-height: 0;
}
#resultateRow .post-grid .post-text-block > .row:first-of-type .col-md-8 {
  /* damit der Text nicht unter das Logo rutscht */
  padding-right: 4.5rem;
}

/* 3) Gewinner-Zeile auf 3 Spalten bringen UND Bilder groß machen */
#resultateRow .post-grid .post-text-block > .row:nth-of-type(2) {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .6rem .75rem;
  align-items: start;
}

/* die drei Bootstrap-Spalten innerhalb dieser Zeile neutralisieren */
#resultateRow .post-grid .post-text-block > .row:nth-of-type(2) > [class*="col-"] {
  width: auto;
  max-width: none;
  padding: 0;
  text-align: center;
}

/* Avatar-Bilder: groß und sauber beschnitten */
#resultateRow .post-grid .post-text-block > .row:nth-of-type(2) .img-block.post-img img {
  width: 96px;          /* hier kannst du 100 oder 110 machen, wenn du magst */
  height: 96px;
  object-fit: cover;
  display: block;
  margin: 0 auto;
  border-radius: 6px;
  box-shadow: none;
  transform: none;
}

/* Abstand zwischen Bild und "1. Platz" etc. */
#resultateRow .post-grid .post-text-block > .row:nth-of-type(2) .img-block.post-img {
  margin-bottom: .25rem;
}

/* 4) Auch auf ganz kleinen Screens 3 nebeneinander lassen */
@media (max-width: 575.98px) {
  #resultateRow .post-grid .post-text-block > .row:nth-of-type(2) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ==== Turnierresultate: Gewinner-Avatare ================================== */
/* 1) Grund-Container für die 3 Gewinner */
#resultateRow .post-text-block .row .col-md-4,
#resultateRow .post-text-block .row .col-lg-4 {
    text-align: center;
}

/* 2) der Wrapper um das Bild */
#resultateRow .img-block.post-img {
    width: 92px;
    height: 92px;
    margin: 0 auto 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    min-height: 0;                 /* überschreibt evtl. min-height aus main.css */
}

/* 3) wirklich das Bild selbst – jetzt mit !important */
#resultateRow .img-block.post-img img,
#resultateRow .col-md-4.col-lg-4 > a > img,
#resultateRow .col-md-4.col-lg-4 img.playerAvatar {
    width: 92px !important;
    height: 92px !important;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    margin: 0 auto;
}

/* 4) etwas Abstand unter "1. Platz" usw. */
#resultateRow .post-text-block .row .col-md-4 strong {
    display: block;
    margin-top: 4px;
}

/* 5) Mobile: 3 nebeneinander soll bleiben */
@media (max-width: 575.98px) {
    #resultateRow .post-text-block .row {
        display: flex;
        flex-wrap: wrap;
    }
    #resultateRow .post-text-block .row .col-md-4,
    #resultateRow .post-text-block .row .col-lg-4 {
        flex: 0 0 33.333%;
        max-width: 33.333%;
    }
}

/* ===== Turnierresultate: Gewinner fixen ===== */

/* 3 Gewinner wirklich nebeneinander halten */
#resultateRow .innerrow {
  display: flex !important;
  gap: .5rem;
  justify-content: space-between;
}

/* jede Gewinner-Box: genau 1/3 */
#resultateRow .innerrow > .col-md-4.col-lg-4 {
  flex: 0 0 33.333% !important;
  max-width: 33.333% !important;
  text-align: center;
  padding: 0;
}

/* Link um den Avatar: auf Avatar-Breite bringen */
#resultateRow a.playerAvatarLink {
  display: block !important;
  width: 92px !important;
  margin: 0 auto 4px !important;
}

/* das eigentliche Avatar-Bild */
#resultateRow img.playerAvatar {
  display: block !important;
  width: 92px !important;
  height: 92px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  margin: 0 auto !important;
  min-height: 0 !important;       /* falls main.css irgendwas setzt */
  max-width: none !important;     /* überschreibt img-fluid / width:100% */
}

/* Text darunter etwas kleiner */
#resultateRow .innerrow > .col-md-4.col-lg-4 strong {
  display: block;
  margin-top: 2px;
  font-size: .75rem;
  line-height: 1.1;
}
#resultateRow .innerrow > .col-md-4.col-lg-4 {
  font-size: .7rem;
  line-height: 1.1;
}

/* Mobile: trotzdem 3 pro Reihe */
@media (max-width: 575.98px) {
  #resultateRow .innerrow {
    gap: .35rem;
  }
  #resultateRow a.playerAvatarLink,
  #resultateRow img.playerAvatar {
    width: 80px !important;
    height: 80px !important;
  }
}

/* ===== 1. Gewinner-Zeile richtig ausrichten ===== */
#resultateRow .innerrow {
  display: flex !important;
  gap: .5rem;
  justify-content: space-between;
  align-items: flex-start;         /* <-- nicht mittig! oben anfangen */
}

/* jede Gewinner-Spalte */
#resultateRow .innerrow > .col-md-4.col-lg-4 {
  flex: 0 0 33.333% !important;
  max-width: 33.333% !important;
  text-align: center;
}

/* Avatar-Link + Bild – das hast du schon, nur hier nochmal zur Vollständigkeit */
#resultateRow a.playerAvatarLink {
  display: block !important;
  width: 92px !important;
  margin: 0 auto 6px !important;   /* etwas mehr Abstand zum Text */
}
#resultateRow img.playerAvatar {
  display: block !important;
  width: 92px !important;
  height: 92px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  margin: 0 auto !important;
}

/* Gewinner-Texte immer untereinander */
#resultateRow .innerrow > .col-md-4.col-lg-4 strong,
#resultateRow .innerrow > .col-md-4.col-lg-4 span,
#resultateRow .innerrow > .col-md-4.col-lg-4 br {
  display: block;
  line-height: 1.1;
}
#resultateRow .innerrow > .col-md-4.col-lg-4 strong {
  margin-bottom: 2px;
  font-size: .73rem;
}
#resultateRow .innerrow > .col-md-4.col-lg-4 span {
  font-size: .7rem;
}

/* ===== 2. Karte vorbereiten, damit Logo absolut werden kann ===== */
#resultateRow .post-grid .post-text-block {
  position: relative;
}

/* ===== 3. Club-Logo oben rechts platzieren =====
   (Logo ist in der ersten row, linke col; und es ist NICHT .playerAvatar)
*/
#resultateRow .post-grid .post-text-block > .row:first-of-type .col-md-4 img:not(.playerAvatar) {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 52px;
  height: 52px;
  object-fit: contain;
  margin: 0;
}
#resultateRow .post-grid .post-text-block > .row:first-of-type .col-md-4 {
  /* die Zelle selbst braucht dann keinen Platz mehr fürs Logo */
  min-height: 0;
}

/* Mobile leicht kleiner */
@media (max-width: 575.98px) {
  #resultateRow a.playerAvatarLink,
  #resultateRow img.playerAvatar {
    width: 80px !important;
    height: 80px !important;
  }
  #resultateRow .innerrow { gap: .35rem; }
}


/* === Turnierresultate – neue Struktur mit innerwinnerRow ================= */

/* die Zeile mit den 3 Gewinnern */
#resultateRow .innerwinnerRow {
  display: flex !important;
  gap: .6rem;
  justify-content: space-between;
  align-items: flex-start;
}

/* jede Gewinner-Karte exakt 1/3 */
#resultateRow .innerwinnerRow .winnerCard {
  flex: 0 0 33.333% !important;
  max-width: 33.333% !important;
  padding: 0;
  text-align: center;
}

/* Bild-Zeile */
#resultateRow .innerwinnerRow .winnerImg {
  display: flex;
  justify-content: center;
  margin-bottom: .35rem;
}

/* Avatar-Link + Avatar */
#resultateRow .innerwinnerRow .playerAvatarLink {
  display: block;
  width: 92px;
}

#resultateRow .innerwinnerRow .playerAvatar {
  display: block;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto;
}

/* Name/Rang sauber untereinander */
#resultateRow .innerwinnerRow .winnerName {
  text-align: center;
  line-height: 1.1;
}

#resultateRow .innerwinnerRow .winnerName strong {
  display: block;
  font-size: .75rem;
  margin-bottom: 2px;
}

#resultateRow .innerwinnerRow .winnerName div {
  font-size: .7rem;
  word-break: break-word;
}

/* Club-Logo oben rechts (erste row im card-body) */
#resultateRow .post-text-block {
  position: relative;
}

#resultateRow .post-text-block > .row:first-of-type .col-md-4 img:not(.playerAvatar) {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 50px;
  height: 50px;
  object-fit: contain;
  margin: 0;
}

/* Mobile – trotzdem 3 nebeneinander, nur etwas kleiner */
@media (max-width: 575.98px) {
  #resultateRow .innerwinnerRow {
    gap: .4rem;
  }
  #resultateRow .innerwinnerRow .playerAvatarLink,
  #resultateRow .innerwinnerRow .playerAvatar {
    width: 80px;
    height: 80px;
  }
}


/* ===== Turnierresultate – Gewinnerkarten ================================= */

/* NUR die äußere Zeile mit den 3 Gewinnern */
#resultateRow .post-text-block > .row.winnerRow {
  display: flex !important;
  justify-content: space-between;
  gap: .6rem;
  align-items: flex-start;
}

/* jede Gewinner-Karte */
#resultateRow .winnerCard {
  flex: 0 0 33.333% !important;
  max-width: 33.333% !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0;
}

/* die INNEREN winnerRow (Name / Bild) sollen NICHT flex sein */
#resultateRow .winnerCard .winnerRow {
  display: block;
  width: 100%;
}

/* Name oben */
#resultateRow .winnerCard .winnerName {
  margin-bottom: .35rem;
  line-height: 1.1;
}
#resultateRow .winnerCard .winnerName strong {
  display: block;
  font-size: .75rem;
  margin-bottom: 2px;
}
#resultateRow .winnerCard .winnerName br {
  display: none; /* wir machen es schon blockig */
}

/* Bild darunter, zentriert */
#resultateRow .winnerCard .winnerImg {
  display: flex;
  justify-content: center;
}
#resultateRow .winnerCard .winnerImgBlock {
  display: flex;
  justify-content: center;
}

/* Avatar selber */
#resultateRow .winnerCard .playerAvatarLink {
  display: block;
  width: 92px;
}
#resultateRow .winnerCard .playerAvatar {
  display: block;
  width: 92px;
  height: 92px;
  object-fit: cover;
  border-radius: 50%;
  margin: 0 auto;
}

/* Club-Logo oben rechts in der Karte */
#resultateRow .post-text-block {
  position: relative;
}
#resultateRow .post-text-block > .row:first-of-type .col-md-4 img:not(.playerAvatar) {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 50px;
  height: 50px;
  object-fit: contain;
}

/* Mobile – Avatare etwas kleiner, aber weiterhin 3 pro Zeile */
@media (max-width: 575.98px) {
  #resultateRow .post-text-block > .row.winnerRow {
    gap: .4rem;
  }
  #resultateRow .winnerCard .playerAvatarLink,
  #resultateRow .winnerCard .playerAvatar {
    width: 80px;
    height: 80px;
  }
}

/* Gewinnerreihe enger machen, damit 3 reinpassen */
#resultateRow .post-text-block > .row.winnerRow {
  display: flex !important;
  justify-content: space-between;
  column-gap: .35rem;   /* kleineres gap */
  row-gap: 0;
  align-items: flex-start;
}

/* jede Karte minimal schmaler als 33% */
#resultateRow .winnerCard {
  flex: 0 0 calc(33.333% - .25rem) !important;
  max-width: calc(33.333% - .25rem) !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0;
}

/* äußere Gewinner-Zeile */
#resultateRow .post-text-block > .row.winnerRow {
  display: flex !important;
  justify-content: space-between;
  gap: .4rem; /* kleiner Abstand */
  align-items: flex-start;
}

/* jede Gewinner-Karte: 3 Stück in die Breite pressen */
#resultateRow .winnerCard {
  flex: 0 0 calc((100% - 0.8rem) / 3) !important;  /* 2*0.4rem Abstand abziehen, Rest /3 */
  max-width: calc((100% - 0.8rem) / 3) !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0;
}

/* innere Rows normal lassen */
#resultateRow .winnerCard .winnerRow {
  display: block;
  width: 100%;
}

/* Name */
#resultateRow .winnerCard .winnerName {
  margin-bottom: .3rem;
  line-height: 1.1;
  padding: 0px;
}
#resultateRow .winnerCard .winnerName strong {
  display: block;
  font-size: .9rem;
  margin-bottom: 2px;
}

#resultateRow .winnerCard .winnerName .nameBox {
  display: block;
  margin-bottom: 5px;
  padding: 2px;
}


/* Avatar schmaler */
#resultateRow .winnerCard .playerAvatarLink {
  display: block;
  width: 70px;
}
#resultateRow .winnerCard .playerAvatar {
  display: block;
  width: 70px;
  height: 70px;
  object-fit: cover;
  border-radius: 50%;
  margin: 0 auto;
}

/* Club-Logo oben rechts bleibt */
#resultateRow .post-text-block {
  position: relative;
}
#resultateRow .post-text-block > .row:first-of-type .col-md-4 img:not(.playerAvatar) {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 50px;
  height: 50px;
  object-fit: contain;
}

/************ HOME › Turnierresultate (rechte Spalte) – Final Fix ************/
/* 0) Sicherheitsnetz: Alle Regeln nur im Resultate-Block */
#resultateRow { position: relative; }

/* 1) Club-Logo oben rechts, rechteckig */
#resultateRow .post-text-block { position: relative; }
#resultateRow .post-text-block > .row:first-of-type .col-md-4 img:not(.playerAvatar){
  position:absolute; top:10px; right:12px;
  width:50px; height:50px; object-fit:contain; border-radius:6px;
}

/* 2) Buy-In + Spieleranzahl in eine Zeile (die rechte Spalte der ersten Row) */
#resultateRow .post-text-block > .row:first-of-type .col-md-8{
  display:flex; gap:.75rem; flex-wrap:wrap; justify-content:center; 
  padding-right:4.5rem;       /* Platz fürs Logo rechts */
}

/* 3) Gewinner: IMMER 3 nebeneinander (auch Mobile) */
#resultateRow .post-text-block > .row.winnerRow{
  display:flex !important; justify-content:space-between; align-items:flex-start;
  gap:.5rem;                 /* kleiner Zwischenraum */
}
/* jede Karte exakt 1/3 – klein wenig Platz fürs Gap abziehen */
#resultateRow .winnerCard{
  flex:0 0 calc((100% - 1rem)/3) !important;
  max-width:calc((100% - 1rem)/3) !important;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:0;
}

/* 4) Name und Bild trennen – keine Flex-Zwänge aus main.css erben */
#resultateRow .winnerCard .winnerCardRow{ display:block !important; width:100%; }

/* 5) Name oben, kompakt */
#resultateRow .winnerName{ line-height:1.1; margin-bottom:.3rem; text-align:center; }
#resultateRow .winnerName strong{ display:block; font-size:.75rem; margin-bottom:2px; }
#resultateRow .winnerName br{ display:none; }   /* wir setzen eh untereinander */

/* 6) Bild darunter, groß und sauber beschnitten */
#resultateRow .winnerImg{ display:flex; justify-content:center; margin:0; }
#resultateRow .winnerImgBlock{ display:flex; justify-content:center; }
#resultateRow a.playerAvatarLink{ display:block; width:92px; margin:0 auto; }
#resultateRow img.playerAvatar{
  display:block; width:92px !important; height:92px !important;
  object-fit:cover; border-radius:50%; margin:0 auto;
  min-height:0 !important; max-width:none !important; /* img-fluid / min-height killen */
}

/* 7) Mobile: weiter 3 pro Reihe, Avatare minimal kleiner */
@media (max-width:575.98px){
  #resultateRow .post-text-block > .row.winnerRow{ gap:.4rem; }
  #resultateRow a.playerAvatarLink, #resultateRow img.playerAvatar{
    width:80px !important; height:80px !important;
  }
}

/* 8) Falls irgendwo alte Bild-Effekte reinfunken (Transform/Filter/Shadow) */
#resultateRow .winnerImg img, #resultateRow .post-text-block > .row:first-of-type img{
  transform:none !important; filter:none !important; box-shadow:none !important;
}

/* Turnierresultate: Zeilenumbruch im Namen wieder aktivieren */
#resultateRow .winnerCard .winnerName br {
  display: inline;
}


/* Namenblock über dem Avatar: 3 Zeilen Platz */
#resultateRow .winnerName{
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.15;
  margin-bottom: .35rem;
}
#resultateRow .winnerName strong{
  display: block;
  font-size: .8rem;
  margin-bottom: 2px;
}

/* Inhaltlicher Name-Wrapper (bitte so im Markup verwenden) */
#resultateRow .winnerName .nameBox{
  /* 3 Zeilen * 1.15 line-height ≈ 3.45em → leicht aufrunden */
  min-height: 3.5em;
  display: block;
  text-align: center;
  word-break: break-word;   /* falls sehr lange Nicknames */
}

/* optional: auf sehr schmalen Screens etwas kompakter */
@media (max-width: 420px){
  #resultateRow .winnerName{
    line-height: 1.1;
  }
  #resultateRow .winnerName .nameBox{
    min-height: 3.3em;
  }
}

/* Resultate: niemals umdrehen */
#resultateRow .winnerRow,
#resultateRow .winnerCardRow {
  display: flex;
  flex-direction: row !important;   /* überschreibt row-reverse von oben */
}

/* Textfluss immer links->rechts und normal bidi */
#resultateRow .winnerName,
#resultateRow .winnerName .nameBox {
  direction: ltr !important;
  unicode-bidi: isolate;            /* verhindert bidi-Übernahme vom Elternelement */
}

/* --- Results: fixe TD-Widths neutralisieren --- */
.dv-content-block.match-tab table td[width],
.dv-content-block.match-tab table th[width] {
  width: auto !important;
}

/* Falls irgendwo table-layout:fixed gesetzt wurde */
.dv-content-block.match-tab table {
  table-layout: auto !important;
}

/* --- Mobile Layout (Stack-Grid) --- */
@media (max-width: 768px) {
  /* Kopf ausblenden – die Reihen enthalten alles Wichtige */
  .dv-content-block.match-tab table thead {
    display: none;
  }

  /* Jede Tabellenzeile als Grid mit 4 Spalten */
  .dv-content-block.match-tab .table.table-striped > tbody > tr {
    display: grid;
    grid-template-columns: 28px 40px 1fr auto; /* Rang | Avatar | Name | Betrag */
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(0,0,0,.08);
  }

  /* Zellen resetten (alte Tabellen-Spacing/Borders entfernen) */
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td {
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    float: none !important;
    display: block; /* notwendig, damit Grid sauber greift */
  }

  /* Rang (1. Spalte) */
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td:nth-child(1) {
    text-align: center;
    font-weight: 600;
  }

  /* Avatar (2. Spalte) */
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td:nth-child(2) img {
    width: 36px; height: 36px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
  }

  /* Name (3. Spalte) */
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td:nth-child(3) {
    font-weight: 600;
    line-height: 1.2;
  }

  /* Betrag (4. Spalte) – rechtsbündig, tabellarische Ziffern */
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td:nth-child(4) {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }

  /* Falls es noch weitere „Deko“-Spalten gibt: ausblenden */
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td:nth-child(n+5) {
    display: none !important;
  }
}

/* ===== Results-Tabelle nur via Klassen steuern ===== */
.data-table .table {
  width: 100%;
  table-layout: fixed;        /* stabile Spaltenbreiten */
  border-collapse: collapse;
}

/* Spaltenbreiten (Desktop) */
.data-table td.turnierRang        { width: 56px;  white-space: nowrap; }
.data-table td.turnierAvatar      { width: 56px; }
.data-table td.tunrierName,
.data-table td.turnierName        { width: auto; }   /* Tippfehler + korrekte Variante */
.data-table td.turnierPreisgeld   { width: 96px;  text-align: right; white-space: nowrap; }

/* Zellen-Optik */
.data-table .table td { padding: 12px 16px; vertical-align: middle; }

/* Avatar-Größe (überschreibt width/height im HTML) */
.data-table img.avatarlist {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50%;
  object-fit: cover;
  display: inline-block;
}

/* Name-Zelle: Avatar + Name sauber nebeneinander, falls Avatar versehentlich dort landet */
.data-table td.turnierName {
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ----- Mobile ----- */
@media (max-width: 576px) {
  .data-table .table td { padding: 10px 12px; }

  .data-table td.turnierRang      { width: 44px; }
  .data-table td.turnierAvatar    { width: 44px; }
  .data-table td.turnierPreisgeld { width: 84px; }

  .data-table img.avatarlist {
    width: 32px !important;
    height: 32px !important;
  }
}

.preisPool{padding: 5px;}

/* Club-Logo oben rechts bleibt */
#turnierResultateContainer .clubLogo {
  position: relative;
}

/* === RESULTS-TABELLE – DESKTOP ============================ */
.data-table .table{
  width:100%;
  table-layout:auto !important;     /* keine festen Zellenbreiten */
  border-collapse:collapse;
}
.data-table .table td{
  width:auto !important;            /* killt alte width-Attribute */
  padding:12px 16px;
  border:0;
  vertical-align:middle;
}

/* Spaltenbreiten + Ausrichtung */
.data-table td.turnierRang      { width:48px !important; white-space:nowrap; text-align:center; }
.data-table td.turnierAvatar    { width:75px !important; }
.data-table td.tunrierName,
.data-table td.turnierName      { width:auto !important; }             /* nimmt den Rest */
.data-table td.turnierPreisgeld { width:96px !important; text-align:right; white-space:nowrap; }

/* Avatare einheitlich */
.data-table img.avatarlist{
  width:40px !important; height:40px !important;
  border-radius:50%; object-fit:cover; display:block;
}

/* Zeilenoptik */
.data-table .table.table-striped > tbody > tr{
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.08);
}

/* === RESULTS-TABELLE – MOBILE (<= 768px) ================== */
@media (max-width:768px){
  /* jede Tabellenzeile als 4-Spalten-Grid:
     Rang | Avatar | Name (flex) | Betrag (rechts) */
  .data-table .table.table-striped > tbody > tr{
    display:grid;
    grid-template-columns: 28px 40px 1fr auto;
    align-items:center;
    gap:10px;
    padding:10px 12px;
    border-bottom:1px solid rgba(0,0,0,.08);
  }

  .data-table .table.table-striped > tbody > tr > td{
    display:block;           /* sichert das Grid in allen Browsern */
    padding:0 !important;
    width:auto !important;
    border:0 !important;
    float:none !important;   /* alte Bootstrap-Styles neutralisieren */
  }

  /* Rang */
  .data-table .table tbody tr td:nth-child(1){ text-align:center; font-weight:600; }

  /* Avatar */
  .data-table .table tbody tr td:nth-child(2) img{ width:36px; height:36px; }

  /* Name */
  .data-table .table tbody tr td:nth-child(3){ font-weight:600; line-height:1.2; }

  /* Betrag */
  .data-table .table tbody tr td:nth-child(4){ text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
}

/* === CLUB-LOGO rechts oben im Headerblock ================= */
.dvTurnierResultateContainer .clubLogoBox{
  text-align:right;
}
.dvTurnierResultateContainer .clubLogoBox img{
  max-width:80px; height:auto; object-fit:contain; display:inline-block;
}

/* Sicherheit: fixe TD-Width-Attribute im gesamten Block neutralisieren */
.dv-content-block.match-tab table td[width],
.dv-content-block.match-tab table th[width]{ width:auto !important; }


/* ===== Turnier-Resultate table (desktop + mobile) ===== */
#turnierResultateContainer .data-table table {
  width: 100%;
  table-layout: fixed;               /* cells fill total width, no "gaps" */
  border-collapse: separate;
  border-spacing: 0;
}

/* default cell look */
#turnierResultateContainer .data-table td {
  padding: 12px 14px;
  vertical-align: middle;
  border-bottom: 1px solid #e9ecef;
  background: #fff;                  /* base for stripe reset */
}

/* zebra striping (was lost) */
#turnierResultateContainer .data-table tbody tr:nth-child(odd) td {
  background: #f8f9fa;
}

/* column sizing — only these three are fixed; name expands */
#turnierResultateContainer .data-table td.turnierRang    { width: 48px;  text-align: right;  padding-right: 10px; }
#turnierResultateContainer .data-table td.turnierAvatar  { width: 56px;  }
#turnierResultateContainer .data-table td.turnierPreisgeld { width: 80px; text-align: right; padding-right: 16px; }
#turnierResultateContainer .data-table td.turnierName    { width: auto;  }

/* avatar images */
#turnierResultateContainer .data-table .avatarlist {
  width: 40px; height: 40px; display: block; border-radius: 50%;
}

/* tighten row look (optional) */
#turnierResultateContainer .data-table tr:last-child td { border-bottom: 0; }

/* --- Mobile tweaks --- */
@media (max-width: 576px) {
  #turnierResultateContainer .data-table td       { padding: 10px 10px; }
  #turnierResultateContainer .data-table td.turnierRang    { width: 32px; }
  #turnierResultateContainer .data-table td.turnierAvatar  { width: 40px; }
  #turnierResultateContainer .data-table td.turnierPreisgeld { width: 68px; }
  #turnierResultateContainer .data-table td.turnierName    { font-size: 14px; }
}

/* ===== Resultate (Desktop & Mobile) ==================================== */
#dvTurnierResultateContainer .table {
  width: 100% !important;
  table-layout: fixed;              /* verhindert Schrumpfen der Zellen */
  border-collapse: collapse;
}

/* eventuelle HTML width-Attribute neutralisieren */
#dvTurnierResultateContainer .table td[width],
#dvTurnierResultateContainer .table th[width] { width: auto !important; }

/* Zell-Grundlayout */
#dvTurnierResultateContainer .table td,
#dvTurnierResultateContainer .table th {
  width: auto;
  white-space: nowrap;
}

/* Alternierende Zeilen – bleibt erhalten, aber ohne „Schlitz“ am Rand */
#dvTurnierResultateContainer .table-striped>tbody>tr:nth-of-type(odd) {
  background-color: rgba(0,0,0,.03);
}

/* ===== Mobile: Reihen werden zu einer 4-Spalten-Grid-Zeile ============= */
@media (max-width: 768px) {
  /* Tabellen-Row als Grid, damit sie wirklich die volle Breite füllen */
  #dvTurnierResultateContainer .table tbody tr {
    display: grid;
    grid-template-columns: 32px 42px 1fr auto; /* Rang | Avatar | Name | Preis */
    align-items: center;
    gap: 8px;
    padding: 8px 12px;               /* Innenabstand links/rechts */
    width: 100%;
    box-sizing: border-box;          /* kein „Luft“-Rand rechts mehr */
  }

  /* Zellen verhalten sich wie Grid-Items */
  #dvTurnierResultateContainer .table tbody td {
    display: block;
    padding: 0;                      /* Padding liegt jetzt auf der tr */
    border: 0;
    background: none;
  }

  /* Rang schmal halten */
  #dvTurnierResultateContainer .table .turnierRang { text-align: right; }

  /* Avatar grösse/fix, rund optional */
  #dvTurnierResultateContainer .table .turnierAvatar img {
    width: 38px;
    height: 38px;
    border-radius: 50%;              /* falls rechteckig gewünscht: Zeile entfernen */
    display: block;
  }

  /* Name: kein Umbrechen erzwingen, aber Platz ausnutzen */
  #dvTurnierResultateContainer .table .turnierName,
  #dvTurnierResultateContainer .table .tunrierName { /* Tippfehler-Fallback */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;                    /* wichtig, damit 1fr wirklich schrumpfen darf */
  }

  /* Preis ganz nach rechts */
  #dvTurnierResultateContainer .table .turnierPreisgeld {
    justify-self: end;
    text-align: right;
  }

  /* Streifen auf die ganze Breite der Grid-Row anwenden */
  #dvTurnierResultateContainer .table-striped>tbody>tr:nth-of-type(odd) {
    background-color: rgba(0,0,0,.03);
  }
}


/* Turnierdetail: Sidebar (rechts) soll auf Mobile nach oben */
@media (max-width: 767.98px) {
  /* Row zu Flex machen (Bootstrap 3: Floats neutralisieren) */
  #tournamentDetailRow {
    display: flex !important;
    flex-direction: column;
    flex-wrap: nowrap;
  }

  /* Floats der Spalten abschalten + volle Breite geben */
  #tournamentDetailRow > [class*="col-"] {
    float: none !important;
    width: 100% !important;
  }

  /* Reihenfolge drehen: Sidebar zuerst, Content danach */
  #tournamentDetailRow > .col-md-4 { order: 1; }
  #tournamentDetailRow > .col-md-8 { order: 2; }

  /* Optional: etwas Abstand unter der Sidebar auf Mobile */
  #tournamentDetailRow > .col-md-4 { margin-bottom: 16px; }
}

/* === Turnier: Blindstruktur – Basis === */
#turnamanetBlindstruktur {
  /* nur kosmetisch; kannst du anpassen/entfernen */
  margin-top: 12px;
}

#turnamanetBlindstruktur .data-table {
  overflow: visible !important;   /* keine abgeschnittenen Kanten */
}

#blindstrukturTable {
  width: 100% !important;
  table-layout: fixed;            /* gleichmäßige Spaltenverteilung, keine Überläufe */
  border-collapse: separate;
  border-spacing: 0;
}

#blindstrukturTable th,
#blindstrukturTable td {
  padding: 8px 10px;              /* kompakt, aber lesbar */
  vertical-align: middle;
  line-height: 1.25;
  white-space: nowrap;            /* Standard: keine Zeilenbrüche */
}

/* Spalten-Ausrichtung (Desktop + Mobile, Basis) */
#blindstrukturTable th:nth-child(1),
#blindstrukturTable td:nth-child(1) {   /* Level */
  text-align: center;
}
#blindstrukturTable th:nth-child(2),
#blindstrukturTable td:nth-child(2) {   /* Time */
  text-align: center;
}
#blindstrukturTable th:nth-child(3),
#blindstrukturTable td:nth-child(3) {   /* Blinds */
  text-align: right;
}
#blindstrukturTable th:nth-child(4),
#blindstrukturTable td:nth-child(4) {   /* Pause */
  text-align: right;
  white-space: nowrap;                  /* „10 Min.“ bleibt in einer Zeile */
}

/* Streifen beibehalten / ggf. leicht hervorheben */
#blindstrukturTable.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: rgba(0,0,0,.025);
}

/* === Mobile-Optimierung === */
@media (max-width: 575.98px) {
  #blindstrukturTable {
    font-size: 13px;                    /* etwas kleiner auf 320–428px Geräten */
  }

  #blindstrukturTable th,
  #blindstrukturTable td {
    padding: 6px 8px;                   /* noch kompakter */
  }

  /* Feste, praxistaugliche Spaltenbreiten auf Phone */
  #blindstrukturTable th:nth-child(1),
  #blindstrukturTable td:nth-child(1) { width: 16%; }  /* Level */
  #blindstrukturTable th:nth-child(2),
  #blindstrukturTable td:nth-child(2) { width: 18%; }  /* Time */
  #blindstrukturTable th:nth-child(3),
  #blindstrukturTable td:nth-child(3) { width: 46%; }  /* Blinds */
  #blindstrukturTable th:nth-child(4),
  #blindstrukturTable td:nth-child(4) { width: 20%; }  /* Pause */

  /* Falls einzelne Werte sehr lang wären: nur die Pausen dürfen umbrechen */
  #blindstrukturTable th:nth-child(4),
  #blindstrukturTable td:nth-child(4) {
    white-space: normal;                /* hier darf’s umbrechen (z. B. „15 Min. Pause“) */
  }
}

/* === Tablet (optional, feiner) === */
@media (min-width: 576px) and (max-width: 991.98px) {
  #blindstrukturTable { font-size: 14px; }
  #blindstrukturTable th,
  #blindstrukturTable td { padding: 7px 10px; }

  #blindstrukturTable th:nth-child(1),
  #blindstrukturTable td:nth-child(1) { width: 14%; }
  #blindstrukturTable th:nth-child(2),
  #blindstrukturTable td:nth-child(2) { width: 18%; }
  #blindstrukturTable th:nth-child(3),
  #blindstrukturTable td:nth-child(3) { width: 48%; }
  #blindstrukturTable th:nth-child(4),
  #blindstrukturTable td:nth-child(4) { width: 20%; }
}

/* === Blindstruktur: volle Breite & sauberes Verhalten === */

/* Karte / Container */
#turnamanetBlindstruktur {
  overflow: visible !important;
}

/* Tabelle auf 100% und automatische Spaltenbreite */
#turnamanetBlindstruktur #blindstrukturTable {
  width: 100% !important;
  table-layout: auto !important;
  border-collapse: separate;
  border-spacing: 0;
}

/* Bootstrap-Defaults übersteuern: keine festen Breiten, normale Abstände */
#turnamanetBlindstruktur #blindstrukturTable th,
#turnamanetBlindstruktur #blindstrukturTable td {
  width: auto !important;
  max-width: none !important;
  padding: 8px 12px !important;
  white-space: nowrap;              /* alles passt bei dir in eine Zeile */
  vertical-align: middle !important;
}

/* Streifenlook (sofern .table-striped aktiv ist) leicht betonen */
#turnamanetBlindstruktur #blindstrukturTable tbody tr:nth-child(odd) td {
  background: rgba(0,0,0,0.025);
}

/* Spalten-Proportionen – Desktop */
#turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(1),
#turnamanetBlindstruktur #blindstrukturTable tbody td:nth-child(1) { /* Level */
  width: 12% !important;
  text-align: right;
}

#turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(2),
#turnamanetBlindstruktur #blindstrukturTable tbody td:nth-child(2) { /* Time */
  width: 14% !important;
  text-align: right;
}

#turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(3),
#turnamanetBlindstruktur #blindstrukturTable tbody td:nth-child(3) { /* Blinds */
  width: auto !important;           /* bekommt den Rest */
  text-align: right;
}

#turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(4),
#turnamanetBlindstruktur #blindstrukturTable tbody td:nth-child(4) { /* Pause */
  width: 18% !important;
  text-align: right;
}

/* ---- Handy / schmale Screens ---- */
@media (max-width: 575.98px) {
  /* etwas kompakter */
  #turnamanetBlindstruktur #blindstrukturTable th,
  #turnamanetBlindstruktur #blindstrukturTable td {
    padding: 6px 10px !important;
    font-size: 13px !important;
  }

  /* Proportionen für Handy */
  #turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(1),
  #turnamanetBlindstruktur #blindstrukturTable tbody td:nth-child(1) { width: 14% !important; }
  
  #turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(2),
  #turnamanetBlindstruktur #blindstrukturTable tbody td:nth-child(2) { width: 16% !important; }
  
  #turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(4),
  #turnamanetBlindstruktur #blindstrukturTable tbody td:nth-child(4) { width: 20% !important; }

  #turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(3),
  #turnamanetBlindstruktur #blindstrukturTable tbody td:nth-child(3) { width: auto !important; }
  
  /* falls irgendwo overflow/scroll via Theme kommt → aus */
  #turnamanetBlindstruktur .data-table,
  #turnamanetBlindstruktur .table-responsive {
    overflow: visible !important;
  }
}


/* -------- Blindstruktur: hart auf klassische Tabelle zurücksetzen -------- */

/* Box + Tabelle (beide möglichen, leicht unterschiedlich geschriebenen IDs) */
#turnamanetBlindstruktur,
#turnamanentBlindstruktur { /* falls Tippfehler-Variante im Markup */
  overflow-x: auto;               /* falls sehr lange Texte kommen */
}

#turnamanetBlindstruktur #blindstrukturTable,
#turnamanentBlindstruktur #blindstrukturTable {
  width: 100% !important;
  border-collapse: collapse !important;
  table-layout: auto !important;
}

/* Nichts mit display:grid/block, float o.ä. auf Zeilen/Zellen */
#turnamanetBlindstruktur #blindstrukturTable,
#turnamanetBlindstruktur #blindstrukturTable thead,
#turnamanetBlindstruktur #blindstrukturTable tbody,
#turnamanetBlindstruktur #blindstrukturTable tr,
#turnamanetBlindstruktur #blindstrukturTable th,
#turnamanetBlindstruktur #blindstrukturTable td,
#turnamanentBlindstruktur #blindstrukturTable,
#turnamanentBlindstruktur #blindstrukturTable thead,
#turnamanentBlindstruktur #blindstrukturTable tbody,
#turnamanentBlindstruktur #blindstrukturTable tr,
#turnamanentBlindstruktur #blindstrukturTable th,
#turnamanentBlindstruktur #blindstrukturTable td {
  display: table !important;
  float: none !important;
  position: static !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  line-height: 1.25 !important;
}

/* Zellen-Optik (Padding, Linie, Zebra) */
#turnamanetBlindstruktur #blindstrukturTable th,
#turnamanetBlindstruktur #blindstrukturTable td,
#turnamanentBlindstruktur #blindstrukturTable th,
#turnamanentBlindstruktur #blindstrukturTable td {
  padding: 8px 12px !important;
  border-bottom: 1px solid rgba(0,0,0,.08) !important;
  vertical-align: middle !important;
  white-space: nowrap;              /* Zahlen schön in einer Zeile */
}

#turnamanetBlindstruktur #blindstrukturTable tbody tr:nth-child(odd) td,
#turnamanentBlindstruktur #blindstrukturTable tbody tr:nth-child(odd) td {
  background: #f8f9fa !important;   /* dezente graue Zeile */
}

/* Spaltenbreiten – klein beginnen, wachsen lassen */
#turnamanetBlindstruktur #blindstrukturTable th:nth-child(1),
#turnamanetBlindstruktur #blindstrukturTable td:nth-child(1),
#turnamanentBlindstruktur #blindstrukturTable th:nth-child(1),
#turnamanentBlindstruktur #blindstrukturTable td:nth-child(1) { width: 48px !important; }

#turnamanetBlindstruktur #blindstrukturTable th:nth-child(2),
#turnamanetBlindstruktur #blindstrukturTable td:nth-child(2),
#turnamanentBlindstruktur #blindstrukturTable th:nth-child(2),
#turnamanentBlindstruktur #blindstrukturTable td:nth-child(2) { width: 60px !important; }

#turnamanetBlindstruktur #blindstrukturTable th:nth-child(3),
#turnamanetBlindstruktur #blindstrukturTable td:nth-child(3),
#turnamanentBlindstruktur #blindstrukturTable th:nth-child(3),
#turnamanentBlindstruktur #blindstrukturTable td:nth-child(3) { min-width: 110px !important; }

/* Auf sehr schmalen Screens: Zahlen nicht gequetscht */
@media (max-width: 420px) {
  #turnamanetBlindstruktur #blindstrukturTable th,
  #turnamanetBlindstruktur #blindstrukturTable td,
  #turnamanentBlindstruktur #blindstrukturTable th,
  #turnamanentBlindstruktur #blindstrukturTable td {
    white-space: nowrap !important;
  }
}

/* === Blindstruktur: Grid-Override + feste Spaltenbreiten === */
/* Container-ID kann leicht variieren – wir fassen alle Varianten ab */
[id^="turnamanetBlindstruktur"] table#blindstrukturTable,
[id^="turnamanetBlindstruktur"] table.blindstrukturTable,
#turnamanetBlindstruktur #blindstrukturTable,
#turnamanetBlindstruktur .blindstrukturTable {
  width: 100% !important;
  table-layout: fixed !important;         /* gleichmäßiges Brechen */
  border-collapse: separate;
  border-spacing: 0;
}

/* TBody darf KEIN Grid sein */
[id^="turnamanetBlindstruktur"] table#blindstrukturTable tbody,
[id^="turnamanetBlindstruktur"] table.blindstrukturTable tbody,
#turnamanetBlindstruktur #blindstrukturTable tbody,
#turnamanetBlindstruktur .blindstrukturTable tbody {
  display: table-row-group !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  padding: 0 !important;
}

/* Rows/Members wieder echte Tabellen-Elemente */
[id^="turnamanetBlindstruktur"] table#blindstrukturTable tr,
[id^="turnamanetBlindstruktur"] table.blindstrukturTable tr {
  display: table-row !important;
}

[id^="turnamanetBlindstruktur"] table#blindstrukturTable th,
[id^="turnamanetBlindstruktur"] table#blindstrukturTable td,
[id^="turnamanetBlindstruktur"] table.blindstrukturTable th,
[id^="turnamanetBlindstruktur"] table.blindstrukturTable td {
  display: table-cell !important;
  padding: 8px 12px !important;
  vertical-align: middle !important;
  border-bottom: 1px solid rgba(0,0,0,.08) !important;
  white-space: nowrap;                     /* Werte wie 2000/4000 nicht umbrechen */
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Zebra wiederherstellen (optional – wenn Bootstrap-Striping überschrieben wurde) */
[id^="turnamanetBlindstruktur"] table#blindstrukturTable tbody tr:nth-child(odd),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable tbody tr:nth-child(odd) {
  background: #fafafa;
}

/* Spaltenbreiten (4 Spalten: Level | Time | Blinds | Pause) */
[id^="turnamanetBlindstruktur"] table#blindstrukturTable th:nth-child(1),
[id^="turnamanetBlindstruktur"] table#blindstrukturTable td:nth-child(1),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable th:nth-child(1),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable td:nth-child(1) { width: 14% !important; }

[id^="turnamanetBlindstruktur"] table#blindstrukturTable th:nth-child(2),
[id^="turnamanetBlindstruktur"] table#blindstrukturTable td:nth-child(2),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable th:nth-child(2),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable td:nth-child(2) { width: 14% !important; }

[id^="turnamanetBlindstruktur"] table#blindstrukturTable th:nth-child(3),
[id^="turnamanetBlindstruktur"] table#blindstrukturTable td:nth-child(3),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable th:nth-child(3),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable td:nth-child(3) { width: 48% !important; }

[id^="turnamanetBlindstruktur"] table#blindstrukturTable th:nth-child(4),
[id^="turnamanetBlindstruktur"] table#blindstrukturTable td:nth-child(4),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable th:nth-child(4),
[id^="turnamanetBlindstruktur"] table.blindstrukturTable td:nth-child(4) { width: 24% !important; }

/* Mobile Feinschliff – etwas mehr Luft & eventuell schmalere 1. Spalte */
@media (max-width: 576px) {
  [id^="turnamanetBlindstruktur"] table#blindstrukturTable th,
  [id^="turnamanetBlindstruktur"] table#blindstrukturTable td,
  [id^="turnamanetBlindstruktur"] table.blindstrukturTable th,
  [id^="turnamanetBlindstruktur"] table.blindstrukturTable td {
    padding: 6px 10px !important;
  }
  [id^="turnamanetBlindstruktur"] table#blindstrukturTable th:nth-child(1),
  [id^="turnamanetBlindstruktur"] table#blindstrukturTable td:nth-child(1),
  [id^="turnamanetBlindstruktur"] table.blindstrukturTable th:nth-child(1),
  [id^="turnamanetBlindstruktur"] table.blindstrukturTable td:nth-child(1) { width: 12% !important; }
  [id^="turnamanetBlindstruktur"] table#blindstrukturTable th:nth-child(3),
  [id^="turnamanetBlindstruktur"] table#blindstrukturTable td:nth-child(3),
  [id^="turnamanetBlindstruktur"] table.blindstrukturTable th:nth-child(3),
  [id^="turnamanetBlindstruktur"] table.blindstrukturTable td:nth-child(3) { width: 52% !important; }
}

/* Blindstruktur: Blinds-Spalte rechtsbündig */
#blindstrukturTable th:nth-child(3),
#blindstrukturTable td:nth-child(3){
  text-align: right !important;
  white-space: nowrap;               /* 2000/4000 nicht umbrechen */
  font-variant-numeric: tabular-nums;/* schön ausgerichtete Ziffern */
  direction: ltr;                    /* falls mal RTL greift */
}

/* (Optional) Kopfzellen zentrieren, außer Blinds rechts */
#blindstrukturTable th { 
  text-align: center; 
}
#blindstrukturTable th:nth-child(3){ 
  text-align: right !important; 
}

/* Blindstruktur: Blinds-Spalte rechtsbündig */
#turnamanetBlindstruktur #blindstrukturTable th:nth-child(3),
#turnamanetBlindstruktur #blindstrukturTable td:nth-child(3),
#turnierBlindstruktur #blindstrukturTable th:nth-child(3),
#turnierBlindstruktur #blindstrukturTable td:nth-child(3) {
  text-align: right !important;
  padding-right: 10px !important;       /* etwas Luft rechts */
  white-space: nowrap;       /* 2000/4000 nicht umbrechen */
  font-variant-numeric: tabular-nums; /* gleichbreite Ziffern, wenn verfügbar */
}

/* Optional: Header „Blinds“ nicht zentrieren */
#turnamanetBlindstruktur #blindstrukturTable thead th:nth-child(3),
#turnierBlindstruktur   #blindstrukturTable thead th:nth-child(3) {
  text-align: right !important;
}

/* ===== Resultate: Tabelle & Avatare ===== */
#turnierResultateContainer .avatarlist{
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;   /* macht wirklich rund, kein Oval */
  display: block;
}

/* Desktop-Defaults auf 100% halten */
#turnierResultateContainer .data-table .table{
  width: 100%;
  table-layout: auto;
}
#turnierResultateContainer .data-table .table td{
  vertical-align: middle;
}

/* Preisgeld rechtsbündig + etwas Luft rechts */
#turnierResultateContainer .data-table .table td.turnierPreisgeld{
  text-align: right;
  padding-right: 10px;
  white-space: nowrap;
}

/* ---------- Mobile Layout (≤ 767px) ---------- */
@media (max-width: 767px){
  #turnierResultateContainer .data-table .table{
    width: 100% !important;
    table-layout: fixed;
  }

  #turnierResultateContainer .data-table .table tbody{
    display: block;
    width: 100%;
  }

  /* Jede Zeile als kompaktes Grid �ber die volle Kartenbreite */
  #turnierResultateContainer .data-table .table tbody tr{
    display: grid !important;
    grid-template-columns: 20px 36px minmax(0, 1fr) 56px; /* Rang | Avatar | Name | Preis */
    column-gap: 8px;
    align-items: center;
    width: 100%;
    padding: 10px 10px;
    border-bottom: 1px solid rgba(0,0,0,.06);
    box-sizing: border-box;
  }

  #turnierResultateContainer .data-table .table tbody tr > td{
    display: block;
    padding: 0;
    border: 0 !important;
    min-width: 0;
  }

  #turnierResultateContainer .data-table .table td.turnierRang{
    text-align: right;
    font-size: 14px;
  }

  #turnierResultateContainer .data-table .table td.turnierAvatar{
    justify-self: center;
  }

  #turnierResultateContainer .data-table .table td.turnierAvatar .avatarlist{
    width: 36px;
    height: 36px;
  }

  #turnierResultateContainer .data-table .table td.turnierName{
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    word-break: break-word;
    line-height: 1.2;
    font-size: 15px;
  }

  #turnierResultateContainer .data-table .table td.turnierPreisgeld{
    text-align: right;
    white-space: nowrap;
    justify-self: end;
    font-size: 14px;
  }

  #turnierResultateContainer .data-table .table tbody tr:nth-child(odd){
    background: rgba(0,0,0,.02);
  }
}

/* === RESULTATE: fixes nur innerhalb dieses Containers === */
#dvTurnierResultateContainer .data-table.table {
  width: 100% !important;
  table-layout: fixed;             /* saubere Spaltenbreite */
  border-collapse: separate;
}

/* Alte Grid-Overrides sicher aushebeln */
#dvTurnierResultateContainer .data-table.table tbody,
#dvTurnierResultateContainer .data-table.table tr,
#dvTurnierResultateContainer .data-table.table td,
#dvTurnierResultateContainer .data-table.table th {
  display: table-row-group !important; /* tbody */
}
#dvTurnierResultateContainer .data-table.table tr {
  display: table-row !important;       /* falls irgendwo grid gesetzt wurde */
}
#dvTurnierResultateContainer .data-table.table td,
#dvTurnierResultateContainer .data-table.table th {
  display: table-cell !important;
  vertical-align: middle;
  border: none;
}

/* Spaltenbreiten (Rang | Avatar | Name | Preis) */
#dvTurnierResultateContainer td.turnierRang      { width: 36px;   text-align: right;  padding-right: 8px; }
#dvTurnierResultateContainer td.turnierAvatar    { width: 56px; }
#dvTurnierResultateContainer td.tunrierName,
#dvTurnierResultateContainer td.turnierName      { width: auto;   }
#dvTurnierResultateContainer td.turnierPreisgeld { width: 96px;   text-align: right; padding-right: 12px; }

/* Avatare garantiert rund (verhindert ovale Darstellung) */
#dvTurnierResultateContainer .avatarlist,
#dvTurnierResultateContainer td.turnierAvatar img {
  width: 50px !important;
  height: 50px !important;
  border-radius: 50% !important;
  object-fit: cover;              /* füllt Kreis ohne Verzerrung */
  display: block;
}

/* Zebra-Streifen (nur optisch) */
#dvTurnierResultateContainer .data-table.table tbody tr:nth-child(odd)  { background: #fafafa; }
#dvTurnierResultateContainer .data-table.table tbody tr:nth-child(even) { background: #ffffff; }

/* Mobile Tweaks: rechte Spalte nicht am Rand kleben lassen */
@media (max-width: 767px) {
  #dvTurnierResultateContainer td.turnierPreisgeld { padding-right: 16px; }
}


/* ===== Mobile: Banner oben wirklich randlos & vollbreit ===== */
@media (max-width: 767.98px) {

  /* 1) Alle Paddings/Margins am Banner-Container killen */
  #topBanners,
  #topBanners .container,
  #topBanners .row {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 2) Spalten ohne Innenabstand + immer 100% Breite (stacken) */
  #topBanners [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* 3) Bilder/A-Tags block-level, echte Vollbreite, keine Ränder */
  #topBanners a,
  #topBanners img {
    display: block !important;
    width: 100% !important;      /* 100vw wuerde die Scrollbar-Breite einschliessen -> H-Overflow */
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    border: 0 !important;
  }

  /* 4) Vertikale Abstände zwischen Bannern weg */
  #topBanners > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* Optional: Falls die Banner-Spalten eigene Klassen haben, z. B. .bannerleft/.bannerright */
@media (max-width: 767.98px) {
  .bannerleft, .bannerright { padding: 0 !important; }
}

/* === Mobile: Top-Banner randlos & volle Breite === */
@media (max-width: 767.98px) {

  /* Sektion wirklich randlos machen */
  .content-block .container-fluid.no-padding,
  #topBanners, #topBanners2 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    /* #topBanners2 IST die .row -> negative BS4-Row-Margins (-15px) neutralisieren,
       sonst ragt der rechte Half-Banner ueber den Viewport (Beschnitt rechts). */
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Spalten in den Banner-Rows randlos */
  #topBanners .col-md-12,
  #topBanners2 .col-md-6 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
  }

  /* Zwei Banner untereinander statt nebeneinander */
  #topBanners2 .bannertopleft,
  #topBanners2 .bannertopright {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
    top:0;
  }

  /* Bilder: volle Seitenbreite, ohne zusätzliche Ränder */
  #topBanners img,
  #topBanners2 img {
    display: block;
    width: 100%;             /* 100% statt 100vw: keine Scrollbar-Breite, kein H-Overflow */
    max-width: 100%;         /* Sicherheitsnetz gegen Overscroll */
    height: auto;
    margin: 0 auto;          /* zentriert */
  }

  /* Nachfolgende Überschrift direkt unter die Banner rücken */
  #topBanners2 + .match-tab,
  #topBanners2 + * {
    margin-top: 0 !important;
  }

  .content-block {
    position: relative;
    padding-top: 0px;
    padding-bottom: 10px;
  }

  .heading-main {
    text-align: center;
    margin-bottom: 10px;
  }
}



/* ===== Resultate – Avatare wirklich rund & nicht oval ===== */
@media (max-width: 768px) {
  .dv-content-block.match-tab .table.table-striped > tbody > tr {
    display: grid !important;
    grid-template-columns: 28px 40px 1fr auto;    /* Rang | Avatar | Name | Betrag */
    gap: 8px 10px;
    align-items: center;
  }
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td {
    padding: 0 !important;
    border: 0 !important;
    width: auto !important;
    float: none !important;
    display: block !important;
  }
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td:nth-child(2) img {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    object-fit: cover !important;       /* verhindert „Ei-Form“ */
    display: block;
  }
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td:nth-child(4) {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  /* Dekospalten nach der 4. ausblenden */
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td:nth-child(n+5) {
    display: none !important;
  }
}

/* MOBILE LAYOUT für Turnierliste: Start, Ort, Titel -> ganze Breite;
   danach eine EIN-ZEILE mit Entry | Slots | Actions */
@media only screen and (max-width: 800px) {

  /* Jede Tabellenzeile als 3-Spalten-Grid für die letzte Zeile */
  #no-more-tables .table-bordered.table-striped > tbody > tr {
    display: grid;
    grid-template-columns: 1fr 1fr auto; /* Entry | Slots | Actions */
    gap: .25rem .75rem;
    align-items: center;
  }

  /* TDs neutralisieren */
  #no-more-tables td {
    display: block;
    padding: .35rem 1rem;
    border: none;
  }

  /* die alten Label-Texte (data-title) NICHT zeigen */
  #no-more-tables td::before { display: none !important; }

  /* 1: Startzeit -> über gesamte Breite */
  #no-more-tables td:nth-child(1) {
    grid-column: 1 / -1;
    font-weight: 600;
  }

  /* 2: Ort -> über gesamte Breite */
  #no-more-tables td:nth-child(2) {
    grid-column: 1 / -1;
  }

  /* 3: Titel -> über gesamte Breite */
  #no-more-tables td:nth-child(3) {
    grid-column: 1 / -1;
    font-weight: 600;
  }

  /* 4: Entry -> linke Spalte der letzten Zeile */
  #no-more-tables td:nth-child(4) {
    grid-column: 1 / 2;
    align-self: center;
    text-align: left;
  }

  /* 5: Slots (Progressbar) -> Mitte der letzten Zeile */
  #no-more-tables td:nth-child(5) {
    grid-column: 2 / 3;
    align-self: center;
  }
  /* Progressbar innerhalb von Slots darf die Spalte füllen */
  #no-more-tables td:nth-child(5) .progress,
  #no-more-tables td:nth-child(5) .progress * {
    max-width: 100%;
  }

  /* 6: Actions (Button) -> rechte Spalte der letzten Zeile */
  #no-more-tables td:nth-child(6) {
    grid-column: 3 / 4;
    align-self: center;
    text-align: right;
    padding-right: 1rem;
  }

  /* Optional: etwas Abstand zwischen Karten/Zeilen */
  #no-more-tables tr + tr { margin-top: .75rem; }
}

/* === Mobile Fixes für Buy-In-Tabelle (innerhalb #no-more-tables) === */
@media (max-width: 768px) {

  /* 1) Tabellenkopf ausblenden, nur die Zeilen zeigen */
  #no-more-tables table thead {
    display: none !important;
  }

  /* 2) Karte/Container sollen wirklich volle Breite nutzen */
  #no-more-tables,
  #no-more-tables .table,
  #no-more-tables .table.table-bordered {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  /* 3) Jede Tabellenzeile als Grid aufziehen (Titel links, drei Icons rechts) */
  #no-more-tables .table > tbody > tr {
    display: grid !important;
    grid-template-columns: 1fr auto;       /* links Inhalt, rechts die Icon-Leiste */
    align-items: center;
    gap: 8px 12px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(0,0,0,.08);
  }

  /* 4) Zellen resetten (alte table-Styles neutralisieren) */
  #no-more-tables .table > tbody > tr > td {
    display: block !important;
    float: none !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    white-space: normal;
    position: static !important;  /* killt alte absolute left:-… Versuche */
    left: auto !important;
  }

  /* 5) Titel/Infos (Start/Ort/Titel) sollen links stehen */
  #no-more-tables td[data-title="Start"] ,
  #no-more-tables td[data-title="Ort"]   ,
  #no-more-tables td[data-title="Titel"] {
    grid-column: 1 / 2;
  }

  /* 6) Rechte Icon-Leiste: Entry + Slots + Actions nebeneinander */
  #no-more-tables td[data-title="Entry"],
  #no-more-tables td[data-title="Slots"],
  #no-more-tables td[data-title="Actions"] {
    grid-column: 2 / 3;               /* rechte Spalte */
  }

  /* 7) …und innerhalb dieser drei Zellen alles in EINE Reihe packen */
  #no-more-tables td[data-title="Entry"],
  #no-more-tables td[data-title="Slots"],
  #no-more-tables td[data-title="Actions"] {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    justify-content: flex-end;
    min-width: 0;
  }
}

/* --- Turnierliste: Mobile Grid-Layout für eine Zeile Entry/Slots/Actions --- */
@media (max-width: 768px) {
  /* Header ausblenden, Zeilen als Grid */
  #no-more-tables thead { display: none; }

  #no-more-tables tbody tr {
    display: grid;
    grid-template-columns: 1fr auto auto auto;     /* Text | Entry | Slots | Actions */
    grid-template-areas:
      "start  start  start  start"
      "ort    ort    ort    ort"
      "title  title  title  title"
      "entry  slots  actions actions";
    gap: 6px 8px;
    align-items: center;
    padding: 10px 12px;
  }

  /* Zellen neutralisieren (alte Floats/Widths/Positionen killen) */
  #no-more-tables td {
    display: block;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    float: none !important;
    position: static !important;
    left: auto !important;
    margin-left: 0 !important;
    white-space: normal;
  }

  /* Bereiche zuordnen */
  #no-more-tables td[data-title="Start"]  { grid-area: start; }
  #no-more-tables td[data-title="Ort"]    { grid-area: ort; }
  #no-more-tables td[data-title="Title"]  { grid-area: title; }

  #no-more-tables td[data-title="Entry"]  { grid-area: entry;  justify-self: end; }
  #no-more-tables td[data-title="Slots"]  { grid-area: slots;  justify-self: end; }
  #no-more-tables td[data-title="Actions"]{
    grid-area: actions;
    justify-self: end;
    display: inline-flex;                /* Icons/Badges in einer Reihe */
    gap: 6px;
    align-items: center;
  }

  /* Progressbar in der Slots-Zelle kompakt */
  #no-more-tables td[data-title="Slots"] .progress { width: 56px; height: 12px; margin: 0; }
}

/* === Mobile Layout für die Turnierliste ================================== */
@media (max-width: 768px){

  /* Jede Tabellenzeile als 2-zeiliges Grid:
     Zeile 1:  [Titel ...............][Preis]
     Zeile 2:  [Entry | Slots | Actions]  (rechts ausgerichtet)
  */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr{
    display: grid !important;
    grid-template-columns: 1fr auto;    /* Titel dehnt sich, Preis rechts schmal */
    grid-template-areas:
      "title price"
      "meta  meta";
    align-items: center;
    column-gap: 12px;
    row-gap: 6px;
    padding: 10px 12px;
  }

  /* Zellen-Reset (alte Table-Styles neutralisieren) */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td{
    display: block !important;
    border: 0 !important;
    padding: 0 !important;
    width: auto !important;
    float: none !important;
    background: transparent !important;
  }

  /* Titel – volle Breite, ohne Umbruch (bei Bedarf ellipsis) */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td:first-child{
    grid-area: title;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.2;
  }

  /* Preis (CHF …) rechts */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Entry"]{
    grid-area: price;
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }

  /* Die drei Meta-Infos (Entry/Slots/Actions) zusammen in eine Zeile, rechtsbündig */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Slots"],
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Actions"]{
    display: none !important; /* wir sammeln alles in einem Wrapper, siehe unten */
  }

  /* Wrapper-Zeile für Meta (wir nutzen die vorhandene Entry-Zelle als Container) */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Entry"] + td[data-title="Slots"],
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Slots"] + td[data-title="Actions"]{
    display: none !important; /* Sicherheit */
  }

  /* Meta-Reihe: wir bauen sie aus den echten Zellen nach — einfacher:
     Nutze die drei Zellen direkt nebeneinander in einer Flexzeile: */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr{
    /* kleine Helfer-Variablen per CSS geht nicht – daher Ziel über Selektoren: */
  }
  /* Setze die zweite Zeile (Meta) als Flex: wir verwenden :scope um die drei
     Zellen gemeinsam zu packen: */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr{
    /* Nichts weiter nötig – stattdessen die drei Zellen adressieren: */
  }
  /* Praktischer Weg: gruppiere per Attribut-Selektor alle drei und mache Flex */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Entry"],
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Slots"],
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Actions"]{
    grid-area: meta;
  }
  /* Und jetzt eine gemeinsame Flex-Zeile: */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr{
    /* wir brauchen einen Hook: */
  }
  /* Workaround: mache die Meta-Zellen inline-flex, dann stehen sie nebeneinander rechts */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Entry"],
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Slots"],
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Actions"]{
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    margin-left: 8px;               /* kleiner Abstand zwischen den Blöcken */
    justify-content: flex-end;
  }
  /* Ganze Meta-Zeile rechts ausrichten */
  #home-more-tables .table.table-bordered.table-striped > tbody > tr > td[data-title="Entry"]{
    width: 100%;
    text-align: right;
  }

  /* Progressbar im Flow belassen (nicht 100% strecken) */
  #home-more-tables .progress.progressBuyin{
    display: inline-block;
    min-width: 70px;
    margin: 0 4px;
    vertical-align: middle;
  }
}

/* --- MOBILE Turnierliste: 3-Spalten Grid + rechter Meta-Block --- */
@media (max-width: 768px) {

  /* Jede Zeile als Grid:  [Zeit/Ort] | [TITEL (flex)] | [Meta rechts] */
  .dvhome-more-tables .table.table-bordered.table-striped.table-condensed > tbody > tr {
    display: grid !important;
    grid-template-columns: 64px 1fr auto;     /* links schmal | Mitte flexibel | rechts so breit wie nötig */
    align-items: center;
    gap: 8px 10px;
    padding: 10px 12px;
  }

  /* Mapping der Zellen auf die Grid-Spalten */
  .dvhome-more-tables td[data-title="Start"] { grid-column: 1; text-align: left; }
  .dvhome-more-tables td[data-title="Ort"]   { grid-column: 1; text-align: left; }

  /* TITEL in die gesamte mittlere Spalte, komplett flexibel */
  .dvhome-more-tables td[data-title="Title"] {
    grid-column: 2;
    min-width: 0;                 /* wichtig, damit 1fr wirklich flexibel ist */
    white-space: normal;          /* normaler Umbruch (kein erzwungenes nowrap) */
  }
  .dvhome-more-tables td[data-title="Title"] a {
    display: block;               /* klickbare Fläche über die ganze Spalte */
  }

  /* RECHTS: Entry + Slots + Actions zu EINER Zeile zusammenfassen */
  .dvhome-more-tables td[data-title="Entry"],
  .dvhome-more-tables td[data-title="Slots"],
  .dvhome-more-tables td[data-title="Actions"] {
    grid-column: 3 !important;    /* alle drei in die rechte Spalte legen */
    justify-self: end;            /* an den rechten Rand */
  }

  /* innerhalb der rechten Spalte nebeneinander anzeigen */
  .dvhome-more-tables td[data-title="Entry"],
  .dvhome-more-tables td[data-title="Slots"] {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    margin-right: 6px;            /* kleiner Abstand zwischen Entry und Slots */
  }
  .dvhome-more-tables td[data-title="Actions"] {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
  }

  /* Sicherheitsnetz gegen alte Breiten/Float/Display-Angaben */
  .dvhome-more-tables .table.table-striped > tbody > tr > td {
    width: auto !important;
    float: none !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
  }
}

/* --- Mobile Turnierliste: volle Titelbreite + sauberes Grid --- */
@media (max-width: 768px) {

  /* Headerzeile in Cards ausblenden */
  .dvhome-more-tables thead { display: none !important; }

  /* Eine Turnierzeile = 3 Spalten:
     [Zeit/Ort] | [TITEL (flexibel)] | [Meta rechts so breit wie nötig] */
  .dvhome-more-tables .table.table-bordered.table-striped.table-condensed > tbody > tr {
    display: grid !important;
    grid-template-columns: 70px minmax(0, 1fr) max-content;  /* <— hier liegt die Magie */
    align-items: center;
    gap: 8px 10px;
    width: 100%;
  }

  /* Mapping */
  .dvhome-more-tables td[data-title="Start"],
  .dvhome-more-tables td[data-title="Ort"]   { grid-column: 1; }

  /* Titel bekommt die ganze mittlere Spalte, ohne Umbruch */
  .dvhome-more-tables td[data-title="Title"] {
    grid-column: 2;
    min-width: 0;                 /* verhindert „künstliches“ Schrumpfen */
  }
  .dvhome-more-tables td[data-title="Title"] a {
    display: block;
    white-space: nowrap;          /* EINZEILIG */
    overflow: hidden;
    text-overflow: ellipsis;      /* … falls zu lang */
    max-width: 100%;
  }

  /* Rechte Seite (Entry/Slots/Actions) in Spalte 3, rechtsbündig */
  .dvhome-more-tables td[data-title="Entry"],
  .dvhome-more-tables td[data-title="Slots"],
  .dvhome-more-tables td[data-title="Actions"] {
    grid-column: 3 !important;
    justify-self: end;
    white-space: nowrap;
    margin-left: 8px;             /* kleiner Abstand zwischen den drei Zellen */
  }

  /* harte Resets gegen ältere Regeln */
  .dvhome-more-tables .table.table-striped > tbody > tr > td {
    width: auto !important;
    float: none !important;
    max-width: none !important;
  }
}

/* --- MOBILE CARD LAYOUT (<=768px) --- */
@media (max-width: 768px) {

  /* hide the desktop header row */
  #no-more-tables thead { display: none !important; }

  /* turn each table row into a grid: 1 big column + 3 compact columns */
  #no-more-tables table.table-bordered tbody > tr {
    display: grid !important;
    grid-template-columns: 1fr 86px 72px 30px; /* text | CHF | bar | icon */
    grid-auto-rows: min-content;
    align-items: center;
    column-gap: 8px;
  }

  /* general cell tidy-up */
  #no-more-tables table.table-bordered tbody > tr > td {
    padding: 0px 4px !important;
    border: none !important;
    background: transparent !important;
  }

  /* top rows take full width */
  #no-more-tables td[data-title="Start"]         { grid-column: 1 / -1 !important; }
  #no-more-tables td[data-title="Veranstalter"]  { grid-column: 1 / -1 !important; }

  /* TITLE: full width, single line with ellipsis */
  #no-more-tables td[data-title="Titel"] {
    grid-column: 1 / -1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* bottom row: three items on one line, right-aligned */
  #no-more-tables td[data-title="Entry"]   { grid-column: 2 !important; justify-self: end; text-align: right; }
  #no-more-tables td[data-title="Slots"]   { grid-column: 3 !important; justify-self: end; }
  #no-more-tables td[data-title="Actions"] { grid-column: 4 !important; justify-self: end; }

  /* make the progress bar fit the compact column neatly */
  #no-more-tables td[data-title="Slots"] .progress { width: 72px !important; margin: 0 !important; }
}

/* Mobile: Entry | Slots | Actions in eine Zeile rechts */
@media (max-width: 768px) {

  /* Sauber aufräumen pro Zeile */
  #no-more-tables tbody tr::after {
    content: "";
    display: block;
    clear: both;
  }

  /* Die drei Felder nebeneinander rechts */
  #no-more-tables td[data-title="Entry"],
  #no-more-tables td[data-title="Slots"],
  #no-more-tables td[data-title="Actions"] {
    float: right;                       /* schiebt sie nach rechts, gleiche Linie */
    display: inline-block !important;
    white-space: nowrap;
    margin-left: 8px;                   /* kleiner Abstand zwischen ihnen */
    padding: 0 !important;
    vertical-align: middle;
  }

  /* Breiten/Optik feinjustieren */
  #no-more-tables td[data-title="Entry"] {
    min-width: 113px;                    /* Platz für "CHF 50+20" etc. */
    text-align: left;
    width: 113px !important;
    left: -20px !important;
    position: relative !important;
  }

  #no-more-tables td[data-title="Slots"] {
    min-width: 72px;
    text-align: right;
    left: -24px !important;
    position: relative !important;
  }
  #no-more-tables td[data-title="Slots"] .progress {
    width: 72px !important;
    height: 12px !important;
    margin: 0 !important;
    display: inline-block;
    vertical-align: middle;
  }
  #no-more-tables td[data-title="Slots"] .progress-bar {
    line-height: 12px !important;
  }
  /* In der schmalen Mobile-Slots-Spalte Label kompakter, damit z.B. "9/9" passt */
  #no-more-tables td[data-title="Slots"] .progress-label {
    font-size: 10px;
  }

  #no-more-tables td[data-title="Actions"] {
    width: 30px;                        /* Schloss/Icon */
    text-align: right;
  }

  /* Sicherheit: alle anderen Zellen nicht floaten */
  #no-more-tables td:not([data-title="Entry"]):not([data-title="Slots"]):not([data-title="Actions"]) {
    float: none;
  }

  /* Dein Titel bleibt einzeilig + Ellipsis (falls noch nicht drin) */
  #no-more-tables td[data-title="Titel"] {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

/* ===== Turnierliste: Mobile-Zeile strukturieren (Titel oben, Meta unten) ===== */
@media (max-width: 768px) {
  /* Jede Tabellenzeile wird ein 2-Zeilen/4-Spalten-Grid:
     [Zeit] [Titel .. ..]
     [Zeit] [CHF ] [Balken] [Icon] */
  .dv-content-block.match-tab .table.table-striped > tbody > tr {
    display: grid;
    grid-template-columns: 80px 1fr auto auto; /* Zeit | Titel/CHF | Balken | Icon */
    grid-template-rows: auto auto;             /* Titel darüber, Meta darunter */
    align-items: center;
    gap: 8px 10px;
    padding: 10px 12px;                        /* Innenabstand auf der tr */
    border-bottom: 1px solid rgba(0,0,0,.08);
    /* alte Tabellen-Layouts neutralisieren */
    table-layout: auto !important;
  }

  /* Alle Zellen im Grid „enttabellarisieren“ */
  .dv-content-block.match-tab .table.table-striped > tbody > tr > td {
    display: block;
    padding: 0 !important;
    border: 0 !important;
    width: auto !important;
    float: none !important;
  }

  /* Spaltenzuordnungen */
  td[data-title="Start"]  { grid-column: 1; grid-row: 1 / span 2; text-align: left; }
  td[data-title="Title"]  { grid-column: 2 / 5; grid-row: 1; }

  /* Meta-Reihe unten: drei Elemente nebeneinander ausgerichtet */
  td[data-title="Entry"]  { grid-column: 2; grid-row: 2; justify-self: start;  align-self: center; }
  td[data-title="Slots"]  { grid-column: 3; grid-row: 2; justify-self: center; align-self: center; }
  td[data-title="Actions"]{ grid-column: 4; grid-row: 2; justify-self: end;    align-self: center; }

  /* Titel optisch: eine Zeile, bei Bedarf mit Ellipsis */
  td[data-title="Title"] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0; /* wichtig, damit 1fr schrumpfen darf */
  }

  /* Der Fortschrittsbalken soll in seiner Spalte natürlich zentrieren */
  td[data-title="Slots"] .progress,
  td[data-title="Slots"] .progressbarBuyin,
  td[data-title="Slots"] .progressBuyin {
    display: inline-block;
    vertical-align: middle;
  }

  /* Preis rechts nicht umbrechen (schöne Zahlenbreite) */
  td[data-title="Entry"] {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }
}
/* Ranking-Boxen nutzen .ico-box nur als Container, ohne den
   News-/Icon-Box-Hover-Effekt (reinslidendes ::before-Overlay). */
.ico-box.ico-box--static:before { display: none; }
.ico-box.ico-box--static:hover { box-shadow: none; }

/* ============================================================
   Cashgames Sub-Includes (Club-Seite: Schedule / Today)
   bs2-Card statt UIkit-Panel
   ============================================================ */
.cg-card {
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 14px;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
	padding: 1.25rem 1.5rem 0.75rem;
	margin-bottom: 1.5rem;
}
.cg-card__head {
	margin-bottom: 1rem;
}
.cg-card__title {
	margin: 0;
	font-family: var(--typo-heading);
	font-size: 1.6rem;
	line-height: 1.2;
	color: var(--color-secondary);
}
.cg-table {
	margin-bottom: 0;
}
.cg-table th {
	font-weight: 700;
	white-space: nowrap;
}
.cg-table .cg-dayrow td {
	background: var(--color-primary);
	color: #fff;
	border-top: 0;
}
.cg-table .cg-headrow th {
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: #6b7280;
}

/* Mobile: Tabelle zu gestapelten Karten (data-title-Stack) */
@media (max-width: 767.98px) {
	.cg-card {
		padding: 1rem 1rem 0.5rem;
	}
	.cg-table .cg-headrow {
		display: none;
	}
	.cg-table .cg-daygroup tr:not(.cg-dayrow):not(.cg-headrow) {
		display: block;
		border: 1px solid rgba(0, 0, 0, 0.08);
		border-radius: 10px;
		margin-bottom: 0.6rem;
		padding: 0.35rem 0;
		background: #fff;
	}
	.cg-table .cg-daygroup tr:not(.cg-dayrow):not(.cg-headrow) td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border: 0;
		padding: 0.3rem 0.9rem;
	}
	.cg-table .cg-daygroup tr:not(.cg-dayrow):not(.cg-headrow) td:before {
		content: attr(data-title);
		font-weight: 700;
		color: #6b7280;
		margin-right: 1rem;
	}
	.cg-table .cg-dayrow td {
		border-radius: 8px;
	}
}

/* ============================================================
   Pokernews (action=pokernews): News-Grid + Pokerfeeds
   bs2-Cards statt UIkit-Panels
   ============================================================ */
.pokernews-head {
	margin-bottom: 0.5rem;
}
.pokernews-search {
	margin-bottom: 0;
}
.pokernews-search .form-control {
	border-right: 0;
}

/* News-Karten (Schweiz-Grid) */
.pokernews-card {
	height: 100%;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
	margin-bottom: 1.5rem;
	transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.pokernews-card:hover {
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
	transform: translateY(-1px);
}
.pokernews-card__img {
	display: block;
}
.pokernews-card__img img {
	width: 100%;
	display: block;
}
.pokernews-card__body {
	padding: 0.9rem 1.1rem 1.1rem;
}
.pokernews-card__date {
	margin: 0 0 0.35rem;
	color: #6b7280;
	font-size: 0.85rem;
}
.pokernews-card__title {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.4;
}
.pokernews-card__title a {
	color: var(--color-secondary);
}
.pokernews-card__title a:hover {
	color: var(--color-primary);
}

/* Pokerfeeds International (Textliste mit Partner-Logo rechts) */
.pokerfeed-item {
	margin-bottom: 0.5rem;
	line-height: 1.6;
}
.pokerfeed-item__logo {
	float: right;
	margin: 0 0 0.5rem 1rem;
}
.pokerfeed-item__title {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--color-secondary);
}
.pokerfeed-item__title:hover {
	color: var(--color-primary);
}

@media (max-width: 767.98px) {
	.pokernews-head {
		margin-bottom: 1rem;
	}
	.pokernews-search {
		margin-top: 0.75rem;
	}
	.pokerfeed-item__logo {
		float: none;
		display: block;
		margin: 0 0 0.75rem;
	}
}

/* ==== Spielerverzeichnis (players directory) ==== */
.players-head {
	margin-bottom: 0.5rem;
}
.players-panel .card-body {
	padding: 0.75rem 1rem;
}
.players-table {
	margin-bottom: 0;
}
.players-table td {
	vertical-align: middle;
}
.players-table__avatar {
	width: 48px;
}
.players-table img.avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	object-fit: cover;
}
.players-table tr:hover {
	background: rgba(0, 100, 0, 0.06);
}
@media (max-width: 767.98px) {
	.players-head .col-md-4 {
		margin-top: 0.75rem;
	}
}

/* Google-Map Sub-Include (dsp_googlemap.cfm) */
.clubs-panel {
	border: 1px solid #999999;
	border-bottom-left-radius: 25px;
	border-bottom-right-radius: 25px;
	background-color: #dddddd;
	box-shadow: 4px 4px #cccccc;
	padding: 25px;
	margin-bottom: 30px;
}
.clubs-panel .panel-title {
	margin-bottom: 15px;
}
.map-panel iframe {
	width: 100%;
	height: 350px;
	border: 0;
	display: block;
}
@media (max-width: 767.98px) {
	.clubs-panel {
		padding: 18px;
	}
	.map-panel iframe {
		height: 260px;
	}
}

/* Haupt-Navigation einzeilig halten. Eingeloggt kommen "Clubs" (Superadmin)
   und "Member" (statt des kurzen "Login") dazu = 8 Top-Level-Items; mit dem
   grosszuegigen Vendor-Padding (main.css: 32px/20px) brach die Leiste dann
   zweizeilig um. Horizontales Padding reduzieren; im engen Desktop-Bereich
   (992-1229px, wo die volle Nav gerade erst gilt) zusaetzlich Font/Padding
   verkleinern. Greift erst ab lg (>=992px) - darunter ist es das Burger-Menue. */
@media (min-width: 992px) {
	.main-header .navbar .navbar-nav li a,
	.main-header.header-white.transparent .navbar .navbar-nav > li > a {
		padding-left: 12px;
		padding-right: 12px;
	}
}
@media (min-width: 992px) and (max-width: 1229.98px) {
	.main-header.header-white.transparent .navbar .navbar-nav > li > a {
		font-size: 16px;
		padding-left: 9px;
		padding-right: 9px;
	}
}

/* Kalender-Filter: Icon-Boxen im Theme-Gruen (wie vor dem BS4-Upgrade).
   Nach dem Wechsel input-group-addon -> input-group-text greift der graue
   Bootstrap-Default; hier auf die Projekt-Buttonfarbe zuruecksetzen. */
#calendarFilterTable .input-group-text {
	background-color: var(--color-button-bg);
	border-color: var(--color-button-bg);
	color: var(--color-button);
}
