@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

/* =========================================================
   BASIS (kleine Verbesserungen für alle)
   ========================================================= */
:root { --tfl-focus:#0aa5ff; }
*:focus { outline:3px solid var(--tfl-focus); outline-offset:2px; }
a { text-decoration-thickness:.12em; text-underline-offset:.18em; }
@media (prefers-reduced-motion: reduce) {
  * { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

/* =========================================================
   GLOBALER ZELDA-RETRO-STIL (Standardmodus)
   ========================================================= */
body {
  background-color: #000 !important;
  color: #00ffcc !important;
  font-family: 'Press Start 2P', monospace !important;
  font-size: 12px;
}

/* Menüfarbe in Gelb */
.uk-navbar-nav > li > a,
.sp-megamenu-parent > li > a {
  color: #ffcc00 !important;
  font-family: 'Press Start 2P', monospace !important;
  font-size: 10px;
}

/* Logo */
.uk-logo { font-size: 18px; color: #00ffcc; }
.uk-logo span.id-color { font-size: 26px; color: #ffff00 !important; }

/* Links */
a { color: #00ff66 !important; }
a:hover { color: #33ff99 !important; text-decoration: underline; }

/* Container-Hintergründe weg */
#sp-main-body, #sp-component, .container, .container-inner, #sp-footer {
  background: transparent !important; box-shadow: none !important; border: none !important;
}

/* Footer */
footer#sp-footer {
  background-color: #111 !important;
  color: #00ffcc !important;
  font-family: 'Press Start 2P', monospace;
  font-size: 9px;
}

/* Überschriften */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Press Start 2P', monospace !important;
  color: #33ff99 !important;
  text-shadow: 0 0 4px #33ff99;
}

/* Tabellenbasis */
table.table.table-hover {
  font-family: 'Press Start 2P', monospace;
  background-color: #111;
  color: #fff;
  font-size: 12px;
  border: 2px solid #fff100;
}
table.table.table-hover td {
  padding: 6px 8px;
  border: 1px solid #444;
  background-color: transparent !important;
}
table.table.table-hover thead {
  background-color: #222;
  color: #fff;
  font-size: 11px;
  text-transform: uppercase;
}

/* =========================================================
   LIGA-FARBEN – NUR für Tabellen mit >= 6 Spalten
   ========================================================= */

/* ---------- Division 1
   1 = grün, 6 = gelb, 7–8 = rot
   --------------------------------------------------------- */
:is(body.itemid-104, .tfl-division-1) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(1) { background-color:#00cc66; }

:is(body.itemid-104, .tfl-division-1) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(6) { background-color:#ffcc00; }

:is(body.itemid-104, .tfl-division-1) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(7),
:is(body.itemid-104, .tfl-division-1) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(8) { background-color:#cc3333; }

/* ---------- Division 2
   1–2 = grün, 3 & 6 = gelb, 7–8 = rot
   --------------------------------------------------------- */
:is(body.itemid-105, .tfl-division-2) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(-n+2) { background-color:#00cc66; }

:is(body.itemid-105, .tfl-division-2) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(3),
:is(body.itemid-105, .tfl-division-2) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(6) { background-color:#ffcc00; }

:is(body.itemid-105, .tfl-division-2) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(7),
:is(body.itemid-105, .tfl-division-2) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(8) { background-color:#cc3333; }

/* ---------- Division 3
   1–2 = grün, 3 & 6 = gelb, 7–8 = rot
   --------------------------------------------------------- */
:is(body.itemid-106, .tfl-division-3) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(-n+2) { background-color:#00cc66; }

:is(body.itemid-106, .tfl-division-3) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(3),
:is(body.itemid-106, .tfl-division-3) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(6) { background-color:#ffcc00; }

:is(body.itemid-106, .tfl-division-3) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(7),
:is(body.itemid-106, .tfl-division-3) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(8) { background-color:#cc3333; }

/* ---------- Division 4
   1–2 = grün, 3 & 6 = gelb, 7–8 = rot
   --------------------------------------------------------- */
:is(body.itemid-135, .tfl-division-4) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(-n+2) { background-color:#00cc66; }

:is(body.itemid-135, .tfl-division-4) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(3),
:is(body.itemid-135, .tfl-division-4) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(6) { background-color:#ffcc00; }

:is(body.itemid-135, .tfl-division-4) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(7),
:is(body.itemid-135, .tfl-division-4) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(8) { background-color:#cc3333; }

/* ---------- Division 5
   1–2 = grün, 3 & 6 = gelb, 7–8 = rot
   --------------------------------------------------------- */
:is(body.itemid-166, .tfl-division-5) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(-n+2) { background-color:#00cc66; }

:is(body.itemid-166, .tfl-division-5) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(3),
:is(body.itemid-166, .tfl-division-5) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(6) { background-color:#ffcc00; }

:is(body.itemid-166, .tfl-division-5) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(7),
:is(body.itemid-166, .tfl-division-5) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(8) { background-color:#cc3333; }

/* ---------- Division 6
   1–2 = grün, 3 = gelb
   --------------------------------------------------------- */
:is(body.itemid-175, .tfl-division-6) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(-n+2) { background-color:#00cc66; }

:is(body.itemid-175, .tfl-division-6) :is(
  table.table-hover:has(thead tr :is(th,td):nth-child(6)),
  table.table-hover:has(tbody > tr:first-child :is(th,td):nth-child(6))
) tbody tr:nth-child(3) { background-color:#ffcc00; }

/* =========================================================
   ERGEBNIS-TABELLEN: neutral – jede Tabelle mit <6 Spalten
   ========================================================= */
table.table-hover:not(:is(
  :has(thead tr :is(th,td):nth-child(6)),
  :has(tbody > tr:first-child :is(th,td):nth-child(6))
)) tbody tr,
table.table-hover:not(:is(
  :has(thead tr :is(th,td):nth-child(6)),
  :has(tbody > tr:first-child :is(th,td):nth-child(6))
)) tbody td { background-color: transparent !important; }

table.table-hover:not(:is(
  :has(thead tr :is(th,td):nth-child(6)),
  :has(tbody > tr:first-child :is(th,td):nth-child(6))
)) tbody tr:nth-child(even) td,
table.table-hover:not(:is(
  :has(thead tr :is(th,td):nth-child(6)),
  :has(tbody > tr:first-child :is(th,td):nth-child(6))
)) tbody tr:hover td { background-color: transparent !important; }

/* === TFL: Kommentarbereich + Related Articles entfernen === */
#akengage-comments-section,
.related-article-list-container { display: none !important; }

/* =========================================================
   NAVIGATION FIX: Doppeltes Menü Desktop/Mobile
   ========================================================= */
.tm-header { display:block; }
.tm-header-mobile { display:none; }
@media (max-width: 991px) {
  .tm-header { display:none; }
  .tm-header-mobile { display:block; }
}

/* =========================================================
   DIVISION STATUS BLOCK (Header über den Tabellen)
   ========================================================= */
.tfl-division-status {
  font-family:'Press Start 2P', monospace;
  background:#000; color:#8dfc8d;
  border:2px solid #8dfc8d; border-radius:4px;
  padding:1rem; margin:1rem 0 2rem 0; line-height:1.6;
  text-shadow:0 0 4px #8dfc8d;
  box-shadow:0 0 12px rgba(141,252,141,.4);
}
.tfl-division-status-headline {
  font-size:.9rem; color:#fff;
  text-shadow:0 0 6px #fff, 0 0 10px #8dfc8d;
  margin-bottom:.75rem; display:block;
}
.tfl-division-status-meta { font-size:.6rem; color:#8dfc8d; }
@media (max-width: 768px) {
  .tfl-division-status { font-size:.8rem; padding:.75rem; }
  .tfl-division-status-headline { font-size:.8rem; }
  .tfl-division-status-meta { font-size:.55rem; }
}

/* =========================================================
   MATCH CENTER auf Mobile ausblenden
   ========================================================= */
@media (max-width: 768px) {
  .tfl-discord-widget {
    display: none !important;
  }
}
/* =========================================================
   MATCH CENTER auf Mobile/Tablet ausblenden
   ========================================================= */
@media (max-width: 991px) {
  /* direkt das Widget killen */
  .tfl-discord-widget {
    display: none !important;
  }

  /* falls das Template mit Modulumhüllung arbeitet */
  .sp-module:has(.tfl-discord-widget) {
    display: none !important;
  }
}
