/* --- 1. CORE LAYOUT (FIXED 1920x1080) --- */
html, body {
    margin: 0;
    padding: 0;
    background-color: #e0e0e0 !important;
    color: #ffffff !important;
    font-family: 'Helvetica Neue', Arial, sans-serif;
    overflow: hidden; /* Blockiert Scrollbalken am Clubhaus-TV */
    width: 1920px;
    height: 1080px;
    box-sizing: border-box;
}

.monitor-layout-grid {
    display: flex;
    flex-direction: column;
    height: 100vh;
    max-height: 100vh;
    padding: 15px;
    gap: 15px;
    box-sizing: border-box;
    width: 100%;
}

.monitor-header{display:grid;grid-template-columns:420px 1fr 300px;background:#fff!important;border-bottom:5px solid #38761d;border-radius:8px;align-items:center;padding:10px 20px;height:130px;box-sizing:border-box;box-shadow:0 4px 10px rgba(0,0,0,0.3);}
.header-logos{display:flex;align-items:center;gap:15px;height:90px;}
.header-weather{display:flex;justify-content:center;align-items:center;gap:30px;width:100%;}
.header-weather div{max-height:90px;overflow:hidden;}
.header-clock{display:flex;justify-content:flex-end;background:#fff;}
.welcome-bar{background:#1e1e1e;border-left:8px solid #FFDD00;padding:0 20px;border-radius:6px;height:50px;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;}
.welcome-title{margin:0;font-size:24px;color:#FFDD00;text-transform:uppercase;font-weight:bold;letter-spacing:0.5px;}

/* --- 2. FLEXIBLE DASHBOARD LAYOUTS --- */
.content-area-standard,.content-area-full-matchday{display:grid;gap:25px;min-height:0;flex:1;}
.content-area-standard{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;}
.content-area-full-matchday{grid-template-rows:auto 1fr;}
.main-column,.matchday-sub-row{display:flex;flex-direction:column;gap:20px;height:100%;min-height:0;}
.matchday-sub-row{display:grid!important;grid-template-columns:1fr 1fr;flex:1;}

/* HÖHEN-LOGIK: Obere Boxen schrumpfen/wachsen nach Inhalt, untere Kacheln füllen den Rest */
.content-area-standard .col-left .monitor-box:first-child,
.content-area-standard .col-right .monitor-box:first-child,
.full-width-box{flex:0 0 auto!important;height:auto!important;max-height:60vh!important;}
.content-area-standard .col-left .monitor-box:last-child,
.content-area-standard .col-right .monitor-box:last-child,
.matchday-sub-row .monitor-box{flex:1!important;min-height:0;}

.monitor-box{background:#1e1e1e;border:1px solid #2d2d2d;border-radius:8px;padding:15px;display:flex;flex-direction:column;box-sizing:border-box;}
.box-title{background-color:#38761d;color:#fff;font-size:20px;font-weight:bold;padding:10px 15px;margin:-15px -15px 15px -15px;border-top-left-radius:7px;border-top-right-radius:7px;text-transform:uppercase;letter-spacing:0.5px;}
.box-content,.box-content-scrollable{flex:1;min-height:0;overflow-y:auto;}
.dynamic-games-box{border:1px solid #38761d!important;}
.iframe-wrapper{flex:1;min-height:0;}
.iframe-wrapper iframe{width:100%;height:100%;border:none;background:transparent!important;color-scheme:dark;}
/* --- FIX FÜR DIE UNTERE UMRANDUNG --- */
.monitor-box {
    box-sizing: border-box !important;
    margin-bottom: 4px !important; /* Schafft 4 Pixel Luft nach unten, damit die Umrandung nie geschluckt wird */
    
    /* Optionaler UI-Tipp: Ein minimaler Schatten macht die Umrandung auf dunklem Grund noch plastischer */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); 
}

/* Verhindert, dass der iFrame-Wrapper den Rahmen von innen her überlappt */
.iframe-wrapper {
    padding-bottom: 2px !important;
    box-sizing: border-box !important;
}


/* --- 3. FORMATS FOR INCLUDES & TABLES --- */
.monitor-box table{max-width:100%!important;border-collapse:collapse!important;margin-top:5px;font-size:19px!important;}
.monitor-box table th{background-color:#2d2d2d!important;color:#aaa!important;font-size:15px!important;text-transform:uppercase;padding:8px 12px!important;text-align:left;border-bottom:2px solid #38761d!important;}
.monitor-box table td{padding:10px 12px!important;border-bottom:1px solid #2d2d2d!important;color:#fff!important;vertical-align:middle;}
.monitor-box table tr:nth-child(even) td{background-color:#222222!important;}

/* Trainingsgarderoben (2-Spalten Flex-Wrap) */
.compact-column-wrapper{display:flex;flex-wrap:wrap;flex-direction:row;gap:8px 4%;width:100%;}
.compact-team-row{display:flex;justify-content:space-between;align-items:center;background:#222222;padding:8px 12px;border-radius:4px;border-left:4px solid #38761d;width:48%;box-sizing:border-box;font-size:18px!important;}
.compact-team-row:nth-child(4n+1),.compact-team-row:nth-child(4n+2){background:#252525;}
.compact-team-row:nth-child(4n+3),.compact-team-row:nth-child(4n+4){background:#1c1c1c;}
.compact-team-name{color:#fff;font-weight:bold;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mini-kabine-badge,.kabine-badge{background-color:#FFDD00!important;color:#121212!important;font-weight:bold;padding:3px 8px;border-radius:4px;font-size:18px!important;min-width:32px;text-align:center;display:inline-block;}

/* Turnier-Matrix (Vertikale Zeilen) */
.turnier-matrix-table{width:100%!important;border-collapse:collapse!important;}
.turnier-main-title{font-weight:bold;font-size:19px;color:#fff;}
.turnier-sub-title{font-size:14px;color:#FFDD00;text-transform:uppercase;}
.turnier-team-grid{display:flex;flex-direction:column;gap:5px;width:100%;}
.turnier-team-row{display:flex;justify-content:space-between;align-items:center;background:#252525;padding:5px 10px;border-radius:4px;width:100%!important;box-sizing:border-box;border-left:3px solid #38761d;}
.turnier-team-row:nth-child(even){background:#1c1c1c;}
.turnier-team-name{font-size:15px;color:#eee;font-weight:bold;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* --- 4. ENDLESS SPONSORS BANNER (STATISCHER TEST-BLOCK) --- */
.monitor-footer {
    position: fixed !important;
    bottom: 0px !important; 
    left: 15px !important; 
    width: 1890px !important; 
    height: 100px !important; 
    background: #ffffff !important; 
    border-top: 5px solid #FFDD00 !important; 
    border-radius: 8px 8px 0 0 !important; 
    display: flex !important; /* Aktiviert das 3-Spalten-System */
    align-items: center !important;
    justify-content: space-between !important; /* Verteilt Links, Mitte und Rechts perfekt */
    z-index: 999999 !important;
    box-shadow: 0 -4px 15px rgba(0,0,0,0.5) !important;
    box-sizing: border-box !important;
}


.marquee-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
}

/* Wir deaktivieren die Animation (.animation: none), damit nichts wegspringt */
.marquee-track {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 40px !important;
    animation: none !important; 
    transform: none !important;
}

.marquee-track img {
    height: 65px !important;
    width: auto !important;
    display: block !important;
    object-fit: contain !important;
}



/* --- FIX FÜR SPIELE & TURNIERE NEBENEINANDER --- */
.matchday-main-row {
    display: grid !important;
    gap: 20px;
    min-height: 0;
}
/* Wenn beide aktiv sind: Erzwinge 2 Spalten nebeneinander (50/50) */
.matchday-main-row.split-games-turniere {
    grid-template-columns: 1fr 1fr !important;
}
/* Wenn nur eine Box aktiv ist: Volle Breite nutzen */
.matchday-main-row.single-game-stream {
    grid-template-columns: 1fr !important;
}

/* --- FIX FÜR DEN UNTEREN RAHMEN-ABSCHNITT --- */
.content-area-standard, 
.content-area-full-matchday {
    padding-bottom: 6px !important; /* Schafft Platz für den Rahmen, bevor der Footer beginnt */
    box-sizing: border-box !important;
}

/* Verhindert, dass scrollbarer Inhalt den Rahmen von innen her überlagert */
.box-content, 
.box-content-scrollable, 
.iframe-wrapper {
    margin-bottom: 5px !important; 
}

/* --- FOOTER POSITIONIERUNGS-FIX --- */
.monitor-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    height: 100px !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

/* Stil für den Text-Fallback, falls Grafiken fehlen */
.marquee-text-fallback {
    color: #121212 !important;
    font-size: 24px !important;
    font-weight: bold;
    text-transform: uppercase;
    white-space: nowrap;
    padding: 0 20px;
}

.marquee-track img {
    height: 60px !important;
    width: auto !important;
    display: block;
}

/* --- 4. FINALE SPONSOREN-SLIDESHOW (DEIN SYSTEM OPTIMIERT) --- */
.monitor-footer {
    position: fixed !important;
    bottom: 0px !important; 
    left: 15px !important; 
    width: 1890px !important; /* Monitorbreite minus Seitenabstand */
    height: 100px !important; /* Feste, erzwungene Höhe auf dem TV */
    background: #ffffff !important; /* Reines Weiss lässt die Logos strahlen */
    border-top: 5px solid #FFDD00 !important; /* FCN Gelb als obere Kante */
    border-radius: 8px 8px 0 0 !important; /* Schöne abgerundete Ecken nach oben */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important; /* Zentriert die Logos perfekt */
    z-index: 999999 !important;
    box-shadow: 0 -4px 15px rgba(0,0,0,0.5) !important;
    box-sizing: border-box !important;
}

.fcn-sponsoren-slideshow {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    width: 100% !important;
}

/* Formatierung für deine Logos im Wechseltakt */
.mySlides {
    /* Nutzt maximal 70px Höhe, damit bei 100px Boxenhöhe oben und unten 
       immer 15px sicherer Weissraum als Abstand frei bleiben */
    height: auto !important;
    max-height: 70px !important; 
    
    /* Zwingt den Browser, das Logo proportional einzupassen, ohne es zu verzerren */
    object-fit: contain !important; 
    
    /* Begrenzt sehr breite Panorama-Logos, damit sie nicht links/rechts ausbrechen */
    max-width: 450px !important; 
    width: auto !important;
    
    /* Zentriert das Bild unmissverständlich in der Mitte der Box */
    margin: 0 auto !important; 
}


/* --- KRISENSICHERE HÖHEN-BEGRENZUNG FÜR DEN REST --- */
html, body {
    height: 1080px !important;
    max-height: 1080px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.monitor-layout-grid {
    /* Wir begrenzen die nutzbare Höhe des Grids auf 960px, 
       damit für den Footer unten garantiert Luft bleibt */
    height: 960px !important; 
    max-height: 960px !important;
    box-sizing: border-box !important;
    padding-bottom: 0 !important;
}

/* --- HIGH-END RULES DASHBOARD --- */
.fcn-rules-dashboard {
    margin-top: 20px;
    background: #1a1a1a;
    border-radius: 8px;
    border: 1px solid #2d2d2d;
    box-sizing: border-box;
    padding: 12px;
}

/* Edler, dezenter Titel statt dicker Balken */
.fcn-rules-section-title {
    color: #aaaaaa;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
    border-bottom: 1px solid #2d2d2d;
    padding-bottom: 6px;
}

/* 3er Raster nebeneinander */
.fcn-rules-grid {
    display: flex !important;
    justify-content: space-between;
    gap: 15px;
    width: 100%;
}

/* Die modernen Info-Kacheln */
.fcn-rule-card {
    display: flex !important;
    align-items: center;
    background: #222222;
    border-left: 4px solid #38761d;
    border-radius: 6px;
    padding: 10px 14px;
    
    /* VON 32% AUF 24% GEÄNDERT FÜR DAS 4ER-RASTER: */
    width: 24% !important; 
    
    box-sizing: border-box;
    gap: 15px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.15);
}

/* Kreisrunde Box für das gelbe SVG-Icon */
.fcn-rule-icon-box {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #1a1a1a;
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 50%;
    border: 1px solid #333;
}

.fcn-rule-icon-box svg {
    width: 22px;
    height: 22px;
}

/* Textbereich ohne Aufzählungspunkte */
.fcn-rule-content {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    width: 100% !important; /* Nutzt den vollen verbleibenden Platz der Kachel */
}

.fcn-rule-line {
    font-size: 13.5px !important; /* Minimal kompakter für den perfekten Zweizeiler */
    color: #ffffff !important;
    font-weight: bold !important;
    line-height: 1.25 !important;
    
    /* DIESE BEIDEN ZEILEN ERMÖGLICHEN DEN ZWEIZEILER: */
    white-space: normal !important; /* Erlaubt das Umbrechen des Textes */
    word-wrap: break-word !important; /* Verhindert, dass lange Wörter ausbrechen */
}

/* Zentriert den Text vertikal, wenn es nur eine einzige Zeile ist */
.fcn-rule-line.main-single {
    font-size: 14.5px !important;
    color: #ffffff !important;
    white-space: normal !important; /* Auch für die Einzeiler den Schutz aufheben */
}


/* --- DB INFO FORMATIERUNG --- */
.db-info-wrapper {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.db-info-row {
    font-size: 18px !important;
    color: #ffffff;
    line-height: 1.4;
    padding-bottom: 12px;
    border-bottom: 1px solid #2d2d2d; /* Ersetzt das hr-Tag durch eine edle, dunkle Trennlinie */
}

/* Entfernt die Trennlinie beim allerletzten Eintrag, damit es sauber aussieht */
.db-info-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

/* --- EDLES SCHIEDSRICHTER KABINEN BADGE --- */
.mini-sr-badge {
    background-color: #121212 !important;
    color: #FFDD00 !important;
    border: 2px solid #FFDD00 !important;
    font-weight: bold;
    border-radius: 4px;
    font-size: 16px !important;
    text-align: center;
    display: inline-block;
    box-sizing: border-box;
}


/* --- VERTICAL ALIGNMENT FÜR DIE TURNIERTABELLE (TD-FIX) --- */
.box-content-scrollable table,
.turnier-games-box table {
    width: 100% !important;
    border-collapse: collapse !important;
}

.box-content-scrollable table td,
.turnier-games-box table td {
    /* Zwingt Zeit und Turnierbezeichnung knallhart an die Oberkante */
    vertical-align: top !important; 
    
    /* Sorgt für einen sauberen Abstand nach oben/unten */
    padding: 10px 8px !important; 
    background: transparent !important;
}

/* Falls du einzeilige Zeitfelder hast, richten wir sie optisch perfekt aus */
.box-content-scrollable table td:first-child,
.turnier-games-box table td:first-child {
    font-weight: bold !important;
    color: #FFDD00 !important; /* FCN Gelb */
    padding-top: 11px !important; /* Minimaler Schubs für perfekte Augenhöhe */
}

/* ==========================================================================
   FCN SPORT NEWS TICKER RUNTIME ANIMATION
   ========================================================================== */
@keyframes ticker {
    0% { 
        transform: translate3d(0, 0, 0); 
    }
    /* Der Ticker läuft bis zu 80% der Gesamtzeit flüssig nach links durch */
    80% { 
        transform: translate3d(-50%, 0, 0); /* Verschiebung um exakt 50%, da der Text verdoppelt ist */
    }
    /* Von 80% bis 100% der Zeit bleibt der Wert absolut starr stehen = 5 Sekunden Pause! */
    100% { 
        transform: translate3d(-50%, 0, 0); 
    }
}

/* Das leuchtende, edle FCN-Vereins-Badge zwischen den SRF-Schlagzeilen */
.ticker-fcn-badge {
    background: #222222 !important;
    color: #FFDD00 !important; /* Strahlendes FCN-Gelb */
    font-weight: 900 !important;
    font-family: Arial, sans-serif !important;
    font-size: 12.5px !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    border: 1px solid rgba(255, 221, 0, 0.25) !important;
    letter-spacing: 0.5px !important;
    margin: 0 15px 0 5px !important;
    display: inline-block !important;
    vertical-align: middle !important;
    box-shadow: 0 0 6px rgba(255, 221, 0, 0.15);
}

.ticker-marquee-content {
    display: inline-block !important;
    white-space: nowrap !important;
    animation: fcnTickerScroll 90s linear infinite !important;
}

/* Trennpunkte farblich hervorheben */
.ticker-marquee-content span, 
.ticker-marquee-content {
    font-family: Arial, sans-serif;
}

@keyframes fcnTickerScroll {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
}


/* ==========================================================================
   FCN CHECKLISTE KOMPAKT-OPTIMIERUNG (ANTI-SCROLL FIX)
   ========================================================================== */

/* 1. Das Grid flexibel machen, damit sich die Kacheln der Breite anpassen */
.fcn-rules-grid {
    display: flex !important;
    justify-content: space-between !important;
    gap: 8px !important; /* Abstand leicht verringert */
    width: 100% !important;
}

/* 2. Die Kacheln selbst kompakter gestalten */
.fcn-rule-card {
    flex: 1 !important; /* Nutzt den verfügbaren Platz mathematisch exakt aus */
    min-width: 0 !important; /* Verhindert, dass die Kachel starr blockiert */
    padding: 8px 10px !important; /* Kompakterer Innenabstand */
    gap: 8px !important; /* Abstand zwischen Icon und Text verkleinert */
}

/* 3. Die Icons minimal verkleinern, um Textplatz zu gewinnen */
.fcn-rule-icon-box {
    min-width: 32px !important;
    width: 32px !important;
    height: 32px !important;
}
.fcn-rule-icon-box svg {
    width: 100% !important;
    height: 100% !important;
}

/* 4. Den Text vor dem Abschneiden/Scrollen schützen */
.fcn-rule-content {
    min-width: 0 !important; /* Zwingt den Text, innerhalb der Kachel zu bleiben */
    overflow: hidden !important;
}

.fcn-rule-line {
    font-size: 13px !important; /* Leicht verkleinert für optimale Lesbarkeit auf engen Säulen */
    line-height: 1.2 !important;
    white-space: normal !important; /* Erlaubt sauberen Zeilenumbruch statt horizontalem Scrollen */
    word-wrap: break-word !important;
}

/* Spezial-Fix für einzeilige Haupttexte */
.fcn-rule-line.main-single {
    font-size: 13.5px !important;
    font-weight: bold !important;
}
/* ==========================================================================
   FCN TRAININGSBOX-KOMPAKT-FIX (ANTI-SCROLL)
   ========================================================================== */

/* Wir nehmen gezielt nur den Trainingsinhalt unter der Woche ins Visier */
.dynamic-games-box + .monitor-box .box-content-scrollable,
.content-area-standard .monitor-box .box-content-scrollable {
    max-height: 380px !important; /* Gibt der Box den maximal verfügbaren Platz */
    overflow-y: hidden !important; /* Verbannt den Scrollbalken bedingungslos */
}

/* Macht die einzelnen Trainingszeilen deutlich flacher und kompakter, 
   sobald parallel Meisterschaftsspiele laufen */
.dynamic-games-box + .monitor-box .fcn-single-match-row,
.dynamic-games-box + .monitor-box .compact-team-row {
    padding: 6px 10px !important; /* Weniger Innenabstand spart massiv vertikalen Platz */
    margin-bottom: 5px !important;
}

.dynamic-games-box + .monitor-box .fcn-single-match-row span {
    font-size: 16px !important; /* Schrift minimal verkleinert für den Matchabend */
}

/* ==========================================================================
   FCN WORDPRESS-CALENDAR IFRAME-FIX (ANTI-SCROLL)
   ========================================================================== */

/* Wenn die Infobox aktiv ist, verkleinern wir den vertikalen Abstand im Kasten */
.monitor-box .box-content {
    gap: 10px !important; /* Halbiert den Abstand von 20px auf 10px, um Höhe zu gewinnen! */
}

/* Wir zwingen die Box für die nächsten Spiele, sich flexibel zu dehnen */
.next-games-box {
    flex: 1 1 auto !important;
    height: 100% !important;
    min-height: 0 !important;
}

/* Wir verbieten dem umschliessenden Kasten jegliches Scrollen */
.next-games-box .iframe-wrapper {
    height: 100% !important;
    width: 100% !important;
    overflow: hidden !important; /* Killt den Scrollbalken auf der Monitor-Ebene */
}

/* Wir zwingen das iFrame, sich exakt an die Kastenhöhe anzupassen */
.next-games-box iframe {
    height: 100% !important;
    width: 100% !important;
    border: none !important;
    overflow: hidden !important; /* Verhindert, dass das iFrame selbst einen Balken zeichnet */
}

/* ==========================================================================
   FCN MONITOR: CONDITIONAL COMPRESSION (ANTI-CALENDAR-SCROLL)
   ========================================================================== */

/* 1. Wenn Zusatzinfos aktiv sind, reduzieren wir den Abstand zwischen den Blöcken */
.fcn-platz-info-container.has-db-infos .box-content {
    gap: 6px !important; /* Gewinnt sofort Höhe */
}

/* 2. Die Infoboxen selbst werden kompakter gestylt */
.fcn-platz-info-container.has-db-infos .fcn-rules-dashboard {
    margin-bottom: 0px !important;
}
.fcn-platz-info-container.has-db-infos .fcn-rules-section-title {
    padding: 2px 8px !important;
    font-size: 13.5px !important; /* Titelbalken minimal schlanker */
}
.fcn-platz-info-container.has-db-infos .db-info-wrapper {
    padding: 3px 8px !important;
}
.fcn-platz-info-container.has-db-infos .db-info-row {
    font-size: 14px !important;
    margin-bottom: 2px !important;
}

/* 3. Die 3 Trainer-Kacheln der Checkliste werden flacher gestaucht */
.fcn-platz-info-container.has-db-infos .fcn-rules-grid {
    gap: 6px !important;
}
.fcn-platz-info-container.has-db-infos .fcn-rule-card {
    padding: 5px 8px !important; /* Drückt die Kacheln in der Höhe zusammen */
    gap: 6px !important;
}
.fcn-platz-info-container.has-db-infos .fcn-rule-icon-box {
    min-width: 26px !important;
    width: 26px !important;
    height: 26px !important; /* Icons werden leicht verkleinert */
}
.fcn-platz-info-container.has-db-infos .fcn-rule-line {
    font-size: 12.5px !important; /* Text schrumpft leicht für perfekten Zeilenumbruch */
    line-height: 1.15 !important;
}
.fcn-platz-info-container.has-db-infos .fcn-rule-line.main-single {
    font-size: 13px !important;
}

/* 4. Auch die gelbe Besenrein-Leiste schliesst kompakter ab */
.fcn-platz-info-container.has-db-infos .fcn-rules-grid + div {
    margin-top: 6px !important;
    padding: 6px 12px !important;
}



/* ==========================================================================
   FCN MONITOR: IFRAME CORNER PERFECTION (TV-EXCLUSIVE)
   ========================================================================== */

/* Wir geben dem Wrapper die exakt identischen Ecken wie deinen anderen Kacheln */
.next-games-box .iframe-wrapper {
    border-radius: 6px !important; /* Passt sich perfekt an deine Box-Ecken an */
    border: 1px solid #2d2d2d !important; /* Optional: Ein feiner, edler Rahmen um den Kalender */
    
    /* DIESER BEFEHL IST DAS UX-WUNDERMITTEL: 
       Er stanzt die harten Ecken des iFrames bedingungslos ab! */
    overflow: hidden !important; 
    
    background: transparent !important;
    box-sizing: border-box !important;
}

/* Garantiert, dass das iFrame sich weich in die Rundung schmiegt */
.next-games-box iframe {
    border-radius: 6px !important;
    overflow: hidden !important;
}


/* ==========================================================================
   FCN MONITOR: DYNAMISCHER SMOOTH-SCROLL FÜR DEN KALENDER (OHNE SCROLLBALKEN)
   ========================================================================== */

/* 1. Wir erlauben dem Wrapper, bei Platzmangel nach unten hin auszuweichen */
.next-games-box .iframe-wrapper {
    height: calc(100% - 40px) !important;
    width: 100% !important;
    overflow-y: auto !important; /* Aktiviert das Scrollen NUR wenn der Platz fehlt! */
    overflow-x: hidden !important;
    
    /* Aktiviert butterweiches Scrollen auf Touch-Geräten und modernen Browsern */
    scroll-behavior: smooth !important;
    -webkit-overflow-scrolling: touch !important; 
}

/* 2. DIE SENSATIONELLE ABSCHNEID-SPERRE: Wir verbergen den hässlichen Scrollbalken! */
/* Für Google Chrome, Safari, Opera und neuere Edge-Browser: */
.next-games-box .iframe-wrapper::-webkit-scrollbar {
    display: none !important; /* Macht den grauen Balken komplett unsichtbar */
    width: 0 !important;
    height: 0 !important;
}

/* Für Firefox: */
.next-games-box .iframe-wrapper {
    scrollbar-width: none !important; /* Verbannt den Balken in Firefox */
}

/* Für ältere Internet Explorer und Edge Versionen: */
.next-games-box .iframe-wrapper {
    -ms-overflow-style: none !important;
}

/* 3. Wir zwingen das iFrame im Inneren, sich voll auszudehnen */
.next-games-box iframe {
    height: 100% !important;
    width: 100% !important;
    /* Wir erlauben dem iFrame selbst kein Scrollen mehr, da der Wrapper das übernimmt! */
    overflow: hidden !important; 
}


/* ==========================================================================
   FCN MONITOR: ULTIMATIVE MOBILE-MEISTER-WEICHE (TEIL 1 - FINE TUNED)
   ========================================================================== */
/* ==========================================================================
   FCN MONITOR: ULTIMATIVE MOBILE-MEISTER-WEICHE (TEIL 1 - ZEBRA & BADGE-FIX)
   ========================================================================== */

@media (max-width: 1024px), (max-device-width: 1024px) {
    
    /* 1. SEITEN-ZÄHMUNG MIT HÖCHSTER PRIORITÄT */
    html body {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* Sprengt das TV-Layout-Grid bedingungslos in die Vertikale */
    /* ==========================================================================
       3. DER UNFEHLBARE ABSOLUTE SPALTEN-BRECHER (NUN ALS GRID-STAPLER)
       ========================================================================== */
    html body .monitor-layout-grid,
    html body .content-area-standard,
    html body .matchday-sub-row, 
    html body .matchday-main-row, 
    html body .split-games-turniere { 
        display: grid !important; /* Reaktiviert das unblockierbare Raster mobil */
        grid-template-columns: 1fr !important; /* Zwingt alles starr in genau EINE Spalte */
        grid-template-rows: auto !important;
        grid-template-areas: none !important;
        width: 100% !important; 
        max-width: 100% !important;
        height: auto !important;
        box-sizing: border-box !important;
        gap: 15px !important;
    }



    
    /* Zwingt jede der Kacheln (Säulen) unnachgiebig auf 100% Displaybreite */
    html body .col-left, 
    html body .col-right, 
    html body .main-column, 
    html body .monitor-box,
    html body div[class*="column"], 
    html body div[class*="box"] { 
        display: block !important;
        width: 100% !important; 
        max-width: 100% !important;
        min-width: 0 !important; /* Vernichtet feste TV-Mindestbreiten */
        grid-column: span 3 / span 3 !important;
        height: auto !important; 
        max-height: none !important;
        flex: none !important; 
        float: none !important;
        margin: 0 0 20px 0 !important; /* Schöner, luftiger Abstand nach unten */
        box-sizing: border-box !important;
    }

    /* 2. DIE MEISTERSCHAFTS-TAGESSPIELE (REAKTION AUF DEINE FLEXBOX-KLASSEN) */
    html body .fcn-single-column-wrapper > div[style*="justify-content: flex-end"] {
        display: none !important;
    }

    /* Jede Spielzeile wird mobil flexibel und schichtet die Badges nach unten */
    html body .fcn-single-match-row {
        display: flex !important;
        flex-direction: column !important; /* Schichtet Paarung oben und Badges unten */
        align-items: flex-start !important;
        gap: 12px !important;
        height: auto !important;
        padding: 14px 14px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-bottom: 20px !important; 
    }

    
        /* HEBELT JEDE DOPPELTE TV-ZEBRA-VERERBUNG MOBIL AM MATCHTAG AUS */
    html body .fcn-single-match-row { background: #1c1c1c !important; }
    html body div:nth-child(even) > .fcn-single-match-row,
    html body .fcn-single-match-row:nth-of-type(even) { background: #262626 !important; }


    /* Der linke Block (Zeit & Teams) bekommt die volle Breite */
    html body .fcn-single-match-row > div:first-child {
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 0 !important;
        gap: 15px !important; 
        display: flex !important;
        align-items: center !important;
    }

    html body .fcn-single-match-row > div:first-child > span:first-child {
        font-size: 18px !important;
        min-width: 50px !important;
        color: #FFDD00 !important;
    }

    /* ANTI-ABSCHNEID-GARANTIE FÜR VEREINSNAME */
    html body .fcn-single-match-row div div span:first-child {
        white-space: normal !important; /* Bricht extrem lange Namen sauber um */
        word-wrap: break-word !important;
        overflow: visible !important;
        text-overflow: clip !important;
        font-size: 16px !important; 
        line-height: 1.3 !important;
        display: block !important;
        width: 100% !important;
        color: #ffffff !important;
        font-weight: bold !important;
    }
    html body .fcn-match-subtype { font-size: 11px !important; white-space: normal !important; color: #FFDD00 !important; }

    /* Hält Heim, Gast und SR perfekt nebeneinander unter dem Match */
    html body .fcn-single-match-row > div:last-child {
        width: 100% !important;
        justify-content: space-between !important; 
        gap: 10px !important;
        white-space: nowrap !important;
        border-top: 1px solid rgba(255,255,255,0.06) !important; 
        padding-top: 10px !important;
        margin-top: 2px !important;
        display: flex !important;
        flex-direction: row !important;
    }

    html body .fcn-single-match-row > div:last-child > div {
        flex: 1 !important;
        max-width: 30% !important;
        min-width: 0 !important;
        width: auto !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    /* 3. DIE TURNIERTABELLE: STRUKTUR-SCHUTZ & VERTIKALE BADGE-NEUZEILE */
    .turnier-matrix-table {
        width: 100% !important;
        border-collapse: collapse !important;
        margin-top: 15px;
    }
    .turnier-matrix-table tr {
        border-bottom: 1px solid #2d2d2d;
    }
    .turnier-matrix-table td {
        vertical-align: top !important; /* TV oben bündig verankern */
        padding: 15px 8px !important;
        white-space: normal !important;
    }
    /* Lasergerade TV-Startlinie für die Uhrzeit */
    .turnier-matrix-table td.turnier-time,
    .turnier-time {
        padding-top: 17px !important; /* Gleicht die Zeilenhöhe am TV perfekt aus */
        color: #FFDD00 !important;
        font-weight: bold;
        font-size: 19px;
    }

    /* Zwingt den Badge starr unter den Mannschaftsnamen im Turnier */
    html body .turnier-team-row {
        display: flex !important;
        flex-direction: column !important; /* Bringt die erwünschte neue Zeile! */
        align-items: flex-start !important; 
        gap: 4px !important;
        margin-bottom: 8px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    html body .turnier-team-name {
        font-size: 14.5px !important;
        font-weight: bold !important;
        color: #ffffff !important;
        display: block !important;
        width: 100% !important;
        white-space: normal !important;
    }

    /* 4. GEMEINSAMER UNBLOCKBARER BADGE-KONTRAST (ANTI-QUETSCH FÜR "AUSSENGARDEROBE") */
    /* OPTIMIERUNG 2: max-width gelöscht und width: auto erlaubt unblockierbare Dehnung */
    html body .mini-kabine-badge {
        display: inline-block !important;
        width: auto !important; /* Atmet dynamisch mit langen Texten mit */
        min-width: 45px !important;
        max-width: none !important; /* Zerschlägt die starre 65px-Fessel des Fernsehers */
        box-sizing: border-box !important;
        text-align: center !important;
        font-size: 12.5px !important;
        font-weight: 900 !important;
        padding: 4px 12px !important; /* Seitlicher Schutzpuffer für die Schrift */
        height: auto !important;
        line-height: normal !important;
        border-radius: 4px !important;
        white-space: nowrap !important;
        color: #121212 !important; /* Fettes Tiefschwarz auf Gelb/Weissem Grund */
    }

    /* OPTIMIERUNG 2 FOR SR-BADGES: max-width gelöscht und width auf auto gesetzt */
    html body .mini-sr-badge {
        display: inline-block !important;
        width: auto !important; 
        min-width: 45px !important;
        max-width: none !important; 
        box-sizing: border-box !important;
        text-align: center !important;
        font-size: 12.5px !important;
        font-weight: 900 !important;
        padding: 4px 12px !important;
        height: auto !important;
        line-height: normal !important;
        border-radius: 4px !important;
        white-space: nowrap !important;
        background: #e0e0e0 !important; /* Heller, edler Hintergrund gegen Dunkel-auf-Dunkel */
        color: #121212 !important; /* Gestochen scharfes Tiefschwarz für die Schiri-Zahl */
    }
    /* 5. MOBILER FEINSCHLIFF FÜR HEADER, TICKER & WELCOME-BAR */
    html body .monitor-header { display: flex !important; flex-direction: column !important; height: auto !important; padding: 15px !important; gap: 15px !important; }
    html body .header-logos { display: flex !important; justify-content: center !important; width: 100% !important; gap: 10px !important; }
    html body .header-logos img { height: 45px !important; width: auto !important; }
    html body .header-weather { display: flex !important; flex-direction: column !important; gap: 10px !important; width: 100% !important; align-items: center !important; }
    html body .header-clock, html body .header-right-container { display: flex !important; justify-content: center !important; width: 100% !important; }
    html body .header-clock iframe { width: 100% !important; max-width: 260px !important; }
    html body .fcn-news-ticker-bar { display: flex !important; width: 100% !important; margin: 0 0 12px 0 !important; border-radius: 0 !important; }
    html body .welcome-bar { width: 100% !important; height: auto !important; padding: 8px 12px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; box-sizing: border-box !important; }
    html body .welcome-title { font-size: 22px !important; font-weight: 800 !important; margin: 0 !important; color: #ffffff !important; }
    html body .welcome-fairplay-box img { height: 34px !important; width: auto !important; }

    /* 6. PLATZ-INFO-KACHEL & FOOTER-FLEX */
    html body .fcn-platz-info-container { min-height: auto !important; }
    html body .fcn-platz-info-container .box-content { position: relative !important; height: auto !important; }
    html body #fcnSlideInfos { position: relative !important; left: 0 !important; top: 0 !important; width: 100% !important; display: block !important; opacity: 1 !important; }
    html body #fcnSlideCheckliste { display: none !important; opacity: 0 !important; }
    html body .fcn-rules-grid { display: flex !important; flex-direction: column !important; gap: 10px !important; width: 100% !important; }
    html body .monitor-footer { position: relative !important; bottom: auto !important; width: 100% !important; height: auto !important; flex-direction: column !important; padding: 15px !important; gap: 15px !important; margin-top: 25px !important; }
    html body .footer-left-branding, html body .fcn-sponsoren-slideshow, html body .footer-right-qr { width: 100% !important; justify-content: center !important; text-align: center !important; }

    /* DER ULTIMATIVE MOBILE TICKER-KILLER: Blendet die Leiste auf dem Handy komplett aus */
    html body .fcn-news-ticker-bar { display: none !important; }

    /* ==========================================================================
       FCN MOBILE WELCOME-BAR PERFEKTIONIERUNG (GRID-SPALTEN-RETTUNG)
       ========================================================================== */
    html body .welcome-bar {
        display: grid !important; /* Aktiviert das krisensichere Raster */
        grid-template-columns: 1fr auto !important; /* Spalte 1 nimmt den Platz, Spalte 2 schrumpft fürs Logo */
        position: relative !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 10px 15px !important;
        height: 54px !important; /* Garantiert eine perfekt symmetrische, feste Höhe */
        align-items: center !important;
        margin: 20px 0 15px 0 !important; 
    }
    html body .welcome-title {
        grid-column: 1 !important; /* Sitzt felsenfest in Spalte 1 */
        display: block !important;
        width: auto !important;
        white-space: nowrap !important; /* Verhindert den hässlichen zweizeiligen Umbruch */
        font-size: 20px !important; /* Edle, knackige Smartphone-Grösse */
        font-weight: 800 !important;
        color: #ffffff !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: left !important;
    }
    html body .welcome-fairplay-box,
    html body .welcome-fairplay-box div,
    html body .welcome-bar > div:last-child {
        grid-column: 2 !important; /* Sitzt felsenfest in Spalte 2 ganz rechts */
        position: static !important; /* Deaktiviert das fehlerhafte Absolute-Styling restlos */
        transform: none !important;
        display: flex !important;
        justify-content: flex-end !important; /* Magnet-Effekt nach rechts */
        align-items: center !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: right !important;
        box-sizing: border-box !important;
    }
    html body .welcome-fairplay-box img,
    html body .welcome-bar img[alt*="Fairplay"] {
        height: 32px !important;
        width: auto !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* ==========================================================================
       8. TURNIERTABELLE: STRUKTUR-SCHUTZ & MOBILER MILLIMETER-ALIGNER
       ========================================================================== */
    html body .turnier-matrix-table { 
        width: 100% !important; 
        display: table !important; 
        border-collapse: collapse !important; 
    }
    html body .turnier-matrix-table tr { 
        display: table-row !important; 
    }
    html body .turnier-matrix-table td { 
        display: table-cell !important; 
        vertical-align: top !important; /* Mobil oben bündig verankern */
        padding: 12px 6px !important; 
        white-space: normal !important; 
    }
    html body .turnier-time,
    html body .turnier-matrix-table td.turnier-time {
        padding-top: 15px !important; /* Drückt die Uhrzeit mobil sanft um 3px nach unten */
        line-height: 1.1 !important;
        font-size: 15px !important;
        font-weight: bold !important;
        color: #FFDD00 !important;
    }
    html body .turnier-matrix-table thead { display: none !important; }
    html body .turnier-team-name { content: none !important; color: #ffffff !important; font-weight: bold !important; font-size: 15px !important; }
    html body .turnier-time { padding-top: 14px !important; line-height: 1 !important; }
    html body .turnier-main-title { margin-top: 0 !important; padding-top: 0 !important; line-height: 1.3 !important; }
    /* ==========================================================================
       9. PLATZ-INFO-KACHEL: SAUBERES UNTEREINANDER-APP-STACKING (PUNKTLANDUNG)
       ========================================================================== */
    html body .fcn-platz-info-container,
    html body .monitor-box:has(#fcnMobileInfos) { 
        min-height: auto !important; 
        height: auto !important;
        max-height: none !important;
        margin-bottom: 20px !important;
    }
    html body .fcn-platz-info-container .box-content,
    html body .monitor-box:has(#fcnMobileInfos) .box-content { 
        position: relative !important; 
        height: auto !important; 
        max-height: none !important;
        display: flex !important;
        flex-direction: column !important; /* Stapelt die Infos mobil starr untereinander */
        gap: 15px !important; /* Eleganter, sauberer Abstand zwischen den beiden Kacheln */
        padding: 15px !important;
    }
    
    /* UNTER DER WOCHE (Montag - Freitag): Beide Kacheln formschön anzeigen */
    html body.is-wochentag #fcnMobileInfos,
    html body.is-wochentag #fcnMobileCheckliste {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important; /* Vernichtet das unschöne Gestrecke nach oben */
        max-height: none !important;
        
        /* Das edle, einheitliche FCN-Karten-Design */
        background: #1c1c1c !important; 
        border-left: 4px solid #FFDD00 !important; /* Gelber FCN-Akzentstreifen links */
        border-radius: 5px !important;
        padding: 14px 14px !important;
        box-sizing: border-box !important;
        margin-bottom: 5px !important;
    }

    /* AM WOCHENENDE (Samstag & Sonntag): Checkliste komplett ausblenden */
    html body.is-wochenende #fcnMobileInfos { 
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        background: #1c1c1c !important; 
        border-left: 4px solid #FFDD00 !important;
        border-radius: 5px !important;
        padding: 14px 14px !important;
        box-sizing: border-box !important;
    }
    html body.is-wochenende #fcnMobileCheckliste { 
        display: none !important; 
        opacity: 0 !important; 
        visibility: hidden !important;
        height: 0 !important;
    }

    /* Bereinigt alle Texte, SVG-Icons und SVGs innerhalb des mobilen Grid-Inhalts */
    html body .fcn-rules-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
    }
    html body .fcn-rule-card {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* ==========================================================================
       FCN MOBILE TRAINER-CHECKLISTE: ABSOLUTE DIKTATOR-KLASSE GEGEN RIESEN-ICONS
       ========================================================================== */
    
    /* 1. Wir zwingen die gesamte Checklisten-Box mobil in die Vertikale */
    html body #fcnMobileCheckliste,
    html body #fcnMobileCheckliste .fcn-rules-dashboard,
    html body #fcnMobileCheckliste .fcn-rules-grid {
        display: flex !important;
        flex-direction: column !important; /* Schichtet Tore, Schloss, Feld starr untereinander */
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        max-height: none !important;
        box-sizing: border-box !important;
        float: none !important;
        position: relative !important;
        left: auto !important;
        top: auto !important;
    }

    /* 2. Jede einzelne Aufgabe (Tore, Schloss, Feld) wird zu einer flachen Kachel */
    html body #fcnMobileCheckliste .fcn-rule-card {
        display: flex !important;
        flex-direction: row !important; /* Icon LINKS, Text RECHTS daneben */
        align-items: center !important;
        justify-content: flex-start !important;
        background: #222222 !important; /* Edler, dunkler Karten-Hintergrund */
        padding: 12px 14px !important;
        margin-bottom: 10px !important; /* Luftiger Abstand nach unten zur nächsten Aufgabe */
        border-radius: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        box-sizing: border-box !important;
        border-left: 2px solid rgba(255, 221, 0, 0.4) !important; /* Dezenter FCN-Akzent */
    }

    /* 3. DER ICON-DOMPTEUR: Zwingt die Box und das SVG-Tor knallhart in die Knie! */
    html body #fcnMobileCheckliste .fcn-rule-icon-box {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 34px !important;  /* Felsenfeste, kompakte Breite der Box */
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        margin-right: 15px !important; /* Sauberer Abstand zum Text */
        float: none !important;
    }

    /* Das rohe SVG-Bild des Tors schnurrt hier bedingungslos auf 24 Pixel zusammen! */
    html body #fcnMobileCheckliste .fcn-rule-icon-box svg {
        width: 24px !important;  
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        max-width: 24px !important;
        max-height: 24px !important;
        display: block !important;
    }

    /* 4. Der Textbereich rechts neben dem Icon */
    html body #fcnMobileCheckliste .fcn-rule-content {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        text-align: left !important;
        width: auto !important;
        height: auto !important;
    }

    html body #fcnMobileCheckliste .fcn-rule-line {
        font-size: 14.5px !important;
        font-weight: bold !important;
        color: #ffffff !important;
        line-height: 1.35 !important;
        white-space: normal !important; /* Erlaubt weichen Zeilenumbruch */
    }








        /* ==========================================================================
       GARDEROBEN-FLOW-FIX: ANTI-ABSCHNEIDEN & SCROLLBAR-VERNICHTUNG
       ========================================================================== */
    html body .compact-team-row {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        
        /* DIE RETTUNG GEGEN DEN HORIZONTALEN SCROLLBALKEN:
           width: auto zwingt das Padding nach innen, die Box bleibt exakt bündig! */
        width: auto !important; 
        
        box-sizing: border-box !important;
        padding: 10px 15px !important; /* Schützt das Wort "Aussengarderobe" */
    }

    /* Sichert den Textfluss der Mannschaftsnamen links */
    html body .compact-team-name {
        font-size: 15.5px !important;
        font-weight: bold !important;
        color: #ffffff !important;
        white-space: normal !important;
        word-wrap: break-word !important;
    }

    /* Zwingt den gelben Badge, Platz einzufordern und schützt vor dem Überlaufen */
    html body .compact-team-row .mini-kabine-badge {
        display: inline-block !important;
        width: auto !important;
        max-width: none !important;
        white-space: nowrap !important; /* Verhindert das Umbrechen im gelben Kasten */
        padding: 4px 12px !important;
    }
  

}
/* ==========================================================================
   ENDE DES GESAMTEN REPARIERTEN CODES - JETZT ZU 100% LÜCKENLOS GESCHLOSSEN!
   ========================================================================== */