/*
Theme Name: News Child
Description: Child Theme von TwentyTwentyFive für F1 Insider
Template: twentytwentyfive
Text Domain: news-child
Version: 1.0.1
*/

/* ═══════════════════════════════════════════════════════
   TYPOGRAFIE – Mobile first (< 600px ≈ 34/20/17.6px)
   ═══════════════════════════════════════════════════════ */

/* Fließtext */
body {
	font-size: 1.1rem;		/* ≈ 17.6px */
	line-height: 1.45;
	letter-spacing: 0;
}

/* H1 – Mobile */
h1 {
	font-size: 2.1875rem;	/* ≈ 35px */
	font-weight: 800;
	font-style: italic;
	line-height: 1.15;
	letter-spacing: -0.005em;	/* ≈ -0.15px */
	margin: 0 0 1rem 0 !important;	/* bottom: 12px */
}

/* H2 – Mobile */
h2 {
	font-size: 1.25rem;		/* = 20px */
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: 0;
}

/* Desktop ≥ 1024px */
@media (min-width: 1024px) {
	body {
		font-size: 1.125rem;	/* = 18px */
		line-height: 1.5;
	}
	h1 {
		font-size: 4.0625rem;	/* = 65px */
		line-height: 1.12;
		letter-spacing: -0.005em;	/* ≈ -0.2px */
		margin-bottom: 1.1875rem !important;	/* 19px */
	}
	h2 {
		font-size: 1.4375rem;	/* ≈ 23px */
		line-height: 1.3;
		margin-block-start: 1.75rem !important;		/* 28px */
		margin-block-end: 0.9375rem !important;		/* 15px */
	}
	h3 {
		margin-block-start: 1.75rem !important;
		margin-block-end: 0.625rem !important;
	}
	p {
		margin-block-end: 0.875rem !important;		/* 14px */
	}
}

/* ═══════════════════════════════════════════════════════
   GENERAL BODY CSS
   ═══════════════════════════════════════════════════════ */

@media (max-width: 1039px) {
	body.home{
		padding-left:0px;
		padding-right:0px;
	}
}

body.single p{
	color: var(--wp--preset--color--f1-dark, #1a1a1a);
}

p,div{
	box-sizing: border-box;
}

[type="search"] {
  outline-offset: 0px;
  -webkit-appearance: textfield;
  outline-color: transparent;
}

a,a:hover,a:active{
	text-decoration:none;
}

.heading h1, .heading h2, .heading h3,h1.heading , h2.heading , h3.heading  {
  display: block;
  width: 100%;
  text-transform: uppercase;
  font-weight: 700;
  padding-bottom: 10px;
  margin-bottom: 1rem;
  margin-top: 0;
  padding-top: 20px;
  border-bottom:1px solid var(--wp--preset--color--f1-red, #E3101E);
  box-sizing:border-box;
}

/* ═══════════════════════════════════════════════════════
   TABELLEN – Light Mode
   Gilt für ALLE .wp-block-table (nicht nur is-style-stripes)
   ═══════════════════════════════════════════════════════ */

/* Kein Border auf Zellen, nur thead roter Strich */
.wp-block-table table {
	border: none;
}
.wp-block-table td,
.wp-block-table th {
	border: none !important;
	color: var(--wp--preset--color--f1-black, #000000);
}
.wp-block-table thead {
	border-bottom: 3px solid var(--wp--preset--color--f1-red, #E3101E);
}
.wp-block-table thead th {
	color: var(--wp--preset--color--f1-black, #000000);
}

/* Alle Tabellen: grauer Basis-Hintergrund */
.wp-block-table,
.wp-block-table.is-style-stripes {
	background-color: var(--wp--preset--color--f1-light-gray, #f4f4f4);
	border: none;
}

/* Ungerade tbody-Zeilen (1., 3., …): weiß */
.wp-block-table tbody tr:nth-child(2n+1),
.wp-block-table.is-style-stripes tbody tr:nth-child(2n+1) {
	background-color: #ffffff;
	color: var(--wp--preset--color--f1-black, #000000);
}

/* Gerade tbody-Zeilen (2., 4., …): grau (Basis-Bg) */
.wp-block-table tbody tr:nth-child(2n),
.wp-block-table.is-style-stripes tbody tr:nth-child(2n) {
	background-color: transparent;
	color: var(--wp--preset--color--f1-black, #000000);
}

/* Einzelne Zellen/Zeilen mit dunklem Hintergrund (NUR td/th, NICHT der Wrapper) */
.wp-block-table td.has-f-1-dark-background-color,
.wp-block-table th.has-f-1-dark-background-color,
.wp-block-table tr.has-f-1-dark-background-color td,
.wp-block-table tr.has-f-1-dark-background-color th {
	background-color: var(--wp--preset--color--f1-dark, #1a1a1a) !important;
	color: var(--wp--preset--color--f1-white, #ffffff) !important;
}

h2 {
	margin-block-start: 1.375rem !important;	/* mobile: 22px */
	margin-block-end: 0.8125rem !important;		/* mobile: 13px */
}

h3 {
	margin-block-start: 1.375rem !important;
	margin-block-end: 0.5rem !important;
}
h2 a,h2 a:hover, h2 a:active,h3 a,h3 a:hover, h3 a:active{
	color: var(--wp--preset--color--f1-black, #000000);
}

strong{
  font-style: italic;
  font-weight: 800;
}
figcaption{
	text-align: left !important;
}

/* Entfernt den Rahmen beim Klicken, behält ihn aber für Tastatur-Nutzer (Wichtig für SEO/Barrierefreiheit) */
:focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
}

/* Spezifisch für das Logo und den Burger-Button */
.custom-logo-link:focus,
.wp-block-navigation__responsive-container-open:focus,
.wp-block-navigation__responsive-container-close:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* ═══════════════════════════════════════════════════════
   NAVIGATION – Fixed, Full-Width, Logo links / Nav rechts
   ═══════════════════════════════════════════════════════ */

.nav-search-toggle{
	background-color:transparent;
	border:none;
}

:where(.wp-block-navigation.has-background .wp-block-navigation-item a:not(.wp-element-button)), :where(.wp-block-navigation.has-background .wp-block-navigation-submenu a:not(.wp-element-button)) {
  padding: .5em 0em !important;
}

button.nav-search-toggle {
    color: inherit !important; /* Übernimmt das Weiß vom Elternelement */
    fill: #ffffff !important;   /* Direkte Zuweisung für das SVG */
    border: none;
    background: transparent;
}

button.nav-search-toggle svg {
    color: #ffffff !important;
    fill: currentColor !important;
}

.header-mobile-tools-wrapper{padding-right:10px;}
.header-mobile-tools-wrapper li, .header-mobile-tools-wrapper button{margin-right:15px;margin-top:4px;}

.wp-block-navigation__submenu-container {
  padding: 15px !important;
}

@media (min-width: 1401px) {
    /* Verstecke den Burger, wenn der Bildschirm groß genug ist */
    .wp-block-navigation__responsive-container-open {
        display: none !important;
    }
    /* Zeige stattdessen die normale Liste */
    .wp-block-navigation__responsive-container {
        display: block !important;
        position: static !important;
        z-index: auto !important;
        background: transparent !important;
    }
	.header-mobile-tools-wrapper{display:none;}
}

@media (max-width: 1400px) {
	
	.wp-block-navigation__responsive-container.is-menu-open {
		/* Wichtigster Fix: Padding wird in die 100% eingerechnet */
		box-sizing: border-box !important;

		/* Breite explizit auf den Viewport begrenzen */
		width: 100vw !important; 
		max-width: 100% !important;

		/* Horizontalen Scroll erzwingen verhindern */
		overflow-x: hidden !important;

		/* Positionierung sicherstellen */
		left: 0 !important;
		right: 0 !important;
	}

	/* Falls das Padding immer noch zu extrem ist (TT5 Standard-Werte) */
	.wp-block-navigation__responsive-container-content {
		width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
	
	.page-content{
		padding-top:0px !important;
	}
	
	/* 1. Den gesamten Overlay-Container auf volle Höhe und Zentrierung zwingen */
	.wp-block-navigation__responsive-container-content {
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		justify-content: center !important;
		text-align: center !important;
		min-height: 100vh !important;
		padding: 0 !important; /* Verhindert Verschiebung durch Standard-Padding */
		padding-top:60px !important;
		padding-bottom:60px !important;
		padding-left:15px !important;
		padding-right:15px !important;
		box-sizing: border-box;
	}
	.wp-block-navigation__responsive-container{
		box-sizing: border-box;
	}

	/* 2. Die Listen-Struktur bereinigen */
	.wp-block-navigation__container.is-responsive,
	.wp-block-navigation__submenu-container {
		padding: 0 !important;
		margin: 0 !important;
		list-style: none !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		width: 100% !important;
	}

	/* 3. Abstände (Gaps) - Hier ziehen wir die Unterpunkte näher ran */
	.wp-block-navigation__container.is-responsive {
		gap: 2rem !important; /* Abstand zwischen den HAUPT-Blöcken */
	}

	.wp-block-navigation__submenu-container {
		gap: 0.3rem !important; /* SEHR enger Abstand zwischen Unterpunkten */
		margin-top: 0.5rem !important; /* Kleiner Abstand zum Elternelement */
	}

	/* 4. Schrift-Hierarchie (F1-Insider Style) */

	/* Ebene 1: Eltern */
	.wp-block-navigation__container.is-responsive > .wp-block-navigation-item > a,
	.wp-block-navigation__container.is-responsive > .wp-block-navigation-item > .wp-block-navigation-item__content {
		font-size: 2.2rem !important;
		font-weight: 800;
		text-transform: uppercase;
		font-style: italic;
		line-height: 1;
		display: block;
		padding-bottom:10px;
		border-bottom:1px solid var(--wp--preset--color--f1-red, #E3101E);
	}

	/* Ebene 2: Kinder */
	.wp-block-navigation__submenu-container .wp-block-navigation-item a {
		font-size: 1.3rem !important;
		font-weight: 600;
		text-transform: none; /* Submenüs meist besser in Normalschrift */
		opacity: 0.8;
	}
	
	.wp-block-navigation .has-child .wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content {
		padding: .5em 0em !important;
	}

	/* 5. Den hässlichen Standard-Pfeil (Toggle) zentrieren oder verstecken */
	/*.wp-block-navigation-submenu__toggle,.lang-switcher-desktop {
		display: none !important;
	}*/
	
	/* 6. Flaggen nebeneinander statt untereinander */

	/* 3. Die Flaggen-Bilder skalieren */
	.lang-item img {
		width: 45px !important;          /* Schön groß für Touch */
		height: auto !important;
		max-width: none !important;
		border: 1px solid rgba(255,255,255,0.2);
		border-radius: 4px;
		display: inline-block !important;
	}



	/* 7. Suche-Item ebenfalls zentrieren */
	.nav-search-item {
		display: flex;
		justify-content: center;
		width: 100%;
		margin-top: 1rem;
	}

	.wp-block-navigation-submenu__toggle {
		width: 100%; /* Macht den Pfeil-Bereich breiter zum Tippen */
		margin-top: -10px;
	}

	/* Standardmäßig verstecken (Desktop) */
	.header-mobile-tools-wrapper {
		display: none;
	}
	
    /* 1. Icons im Header anzeigen */
    .header-mobile-tools-wrapper {
        display: flex !important;
        align-items: center;
        gap: 12px;
        margin-right: 10px; /* Abstand zum Burger-Icon */
        order: -1; /* Zwingt die Tools nach links, falls Flex genutzt wird */
    }

    /* 2. Sprachen nebeneinander */
    .mobile-tool-item.lang-switcher ul {
        display: flex;
        gap: 8px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    /* 3. Icons im Burger-Menü (Modal) verstecken */
    /* Hier nutzen wir deine Klasse aus dem vorherigen Schritt */
    .wp-block-navigation__responsive-container .hide-in-modal {
        display: none !important;
    }
	
	/* 1. Erzwinge die Zentrierung gegen die WordPress-Standardvariablen */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-page-list {
    align-items: start !important; /* Überschreibt die Justification-Setting */
    text-align: left !important;
    width: 100% !important;
}

	/* 2. Sicherstellen, dass auch die Links innerhalb der Items zentriert sind */
	.wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
		justify-content: left !important;
		display: flex !important;
		width: 100% !important;
	}

	/* 3. Entferne eventuelle Polsterungen (Paddings), die das Ganze nach links drücken könnten */
	.wp-block-navigation__responsive-container-content ul {
		margin-left: 0 !important;
		padding-left: 0 !important;
	}

	.wp-block-navigation__responsive-container-close {
		display: none;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		display: block;
		position: absolute;
		right: 10px;
		top: 10px;
		z-index: 2;
	}
	
}

/* Close-Button immer versteckt, außer wenn Menü offen ist */
.wp-block-navigation__responsive-container-close {
	display: none !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	display: block !important;
}

/* Close-Button immer versteckt, außer wenn Menü offen ist */
.wp-block-navigation__responsive-container-close {
	display: none !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	display: block !important;
}

/* 4. Falls die Icons im Burger-Menü (Modal) trotzdem auftauchen (Sicherheit) */
.wp-block-navigation__responsive-container .header-mobile-tools-wrapper {
    display: none !important;
}


div.search-nav {
  width: 100%;
  position: fixed;
  top: 130px;
  background-color: rgba(0,0,0,0.9);
  left: 0;
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
}

div.search-nav input {
  width: 50%;
  background-color: rgba(0,0,0,0);
  box-shadow: none;
  border: 2px solid rgba(0,0,0,0);
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: rgba(0, 0, 0, 0);
  border-bottom: 1px solid #ccc;
  color: #fff;
}

/* ── Seiten-Inhalt: Abstand für fixed Header ─────────── */

body {
	padding-top: 90px;
}

@media (max-width: 1039px) {
	
	body.single {
		padding-top: 90px;
	}
}

/* ═══════════════════════════════════════════════════════
   FOOTER – Volle Breite (kein max-width Constraint)
   ═══════════════════════════════════════════════════════ */

.site-footer {
	width: 100% !important;
	max-width: 100% !important;
}

/* Interne Layout-Constrained Beschränkungen aufheben */
.site-footer.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 100% !important;
}

.site-footer{
	border-top:1px solid var(--wp--preset--color--f1-red, #E3101E);
	background-color: var(--wp--preset--color--f1-black, #000000) !important;
	color: var(--wp--preset--color--f1-white, #ffffff);
}

/* ═══════════════════════════════════════════════════════
   SINGLE POST – Layout mit Sidebar
   ═══════════════════════════════════════════════════════ */

main.single-post{
	width:840px;
	max-width:100%;
	margin-left: auto !important;
  	margin-right: auto !important;
}

main.single-post .post-excerpt{
	font-size: var(--wp--preset--font-size--xl);
	font-weight:400;
}

@media (min-width: 900px) {
	.single-post__main .entry-content{
		width:580px;
		max-width:100%;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	main.single-post h2,main.single-post h3{
		padding-right:36px;
	}
}

@media (min-width: 1020px) {
	main.single-post .post-excerpt{
		font-size: var(--wp--preset--font-size--lg);
	}
}

h1.post-header__title{
	font-size: var(--wp--preset--font-size--xxxxl);
	line-height: 1.15;
	letter-spacing: -0.005em;
	margin: 0 0 1rem 0 !important;
}
@media (max-width: 990px) {
	h1.post-header__title{
		font-size: var(--wp--preset--font-size--xxxxxl);
	}
}

/* ═══════════════════════════════════════════════════════
   SEITEN-INHALT – unter 990px geringerer Rand
   ═══════════════════════════════════════════════════════ */

@media (max-width: 1050px) {

	/* Direkter Padding-Override für Gruppen (nicht Single Post – hat eigene Regel) */
	.site-main:not(.single-post) .wp-block-group.is-layout-constrained,
	main.page-content,
	.site-footer {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
}

@media (max-width: 1040px) {
	/* Single Post: 12px Rand – Header-Wrap + __main-Container */
	.single-post__main,
	.single-post__header-wrap {
		padding-left: 12px !important;
		padding-right: 12px !important;
		box-sizing: border-box;
	}
	/* Alle Kind-Elemente innerhalb __main: kein eigenes seitliches Padding */
	.single-post__main .wp-block-group,
	.single-post__main .entry-content,
	.single-post__main .wp-block-post-content,
	.single-post__main .single-post__related {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
}

/* ═══════════════════════════════════════════════════════
   AD UNITS – Abstände und Begrenzung
   ═══════════════════════════════════════════════════════ */

.adunit-container {
	margin-top: 12px;
	margin-bottom: 12px;
	max-width: 100%;
	overflow: hidden;
}

/*@media (max-width: 600px) {
	.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
		padding-left: 0px !important;
		padding-right: 0px !important;
	}
}*/

/* ═══════════════════════════════════════════════════════
   LANDING PAGE – Kein Rand
   ═══════════════════════════════════════════════════════ */

.page-landing {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.page-landing > .wp-block-post-content {
	padding: 0;
	max-width: 100%;
}

/* ═══════════════════════════════════════════════════════
   PAGE SMALL PADDING
   ═══════════════════════════════════════════════════════ */

.page-small-padding.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: 860px;
}

@media (max-width: 990px) {
	.page-small-padding {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
}

/* ═══════════════════════════════════════════════════════
   NEWS HERO – Mobile ohne Overlay (Fallback, wenn CSS
   nicht aus dem Block geladen wird)
   ═══════════════════════════════════════════════════════ */

/*@media (max-width: 990px) {
	.news-hero {
		color: #fff;
	}
	.news-hero .news-hero__content {
		position: relative !important;
		background: #1a1a1a;
		padding: 14px 0px !important;
	}
	.news-hero .news-hero__overlay {
		display: none !important;
	}
	.news-hero .news-hero__image {
		height: auto !important;
		min-height: 0 !important;
	}
}*/

@media (max-width: 600px) {
	.news-hero .news-hero__content {
		padding: 10px 12px !important;
	}
}

/* ═══════════════════════════════════════════════════════
   NEWS QUERY – Kein Padding links/rechts im Content
   ═══════════════════════════════════════════════════════ */

.news-query__content {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* ═══════════════════════════════════════════════════════
   SINGLE POST HEADER WRAP – Constrained
   ═══════════════════════════════════════════════════════ */

.single-post__header-wrap {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* ═══════════════════════════════════════════════════════
   SINGLE SITE – Post Content Bild-Breite
   ═══════════════════════════════════════════════════════ */

.single-post .wp-block-post-content figure,
.single-post .wp-block-post-content .wp-block-image {
	max-width: 100%;
}

/* ═══════════════════════════════════════════════════════
   SINGLE POST FOLLOW-SEKTION
   ═══════════════════════════════════════════════════════ */

.single-post__follow .wp-block-social-links {
	gap: 8px;
}

.single-post__follow .wp-block-social-link {
	background-color: var(--wp--preset--color--f1-red, #E3101E) !important;
	border-radius: 0;
}

/* ═══════════════════════════════════════════════════════
   ALLGEMEIN – Responsive Anpassungen unter 990px
   ═══════════════════════════════════════════════════════ */

@media (max-width: 990px) {
	/* Columns: aufeinander stapeln */
	.wp-block-columns.is-not-stacked-on-mobile {
		flex-wrap: wrap;
	}

	/* Sidebar unter 990px: wird durch isStackedOnMobile unterhalb gestapelt */
}

/* ═══════════════════════════════════════════════════════
   ARCHIVE / INDEX – Kacheln und Cards unter 990px
   ═══════════════════════════════════════════════════════ */

@media (max-width: 990px) {
	/* Archive/Index Seite: kein seitlicher Abstand */
	.site-main:not(.single-post) .is-layout-constrained {
		padding-left: 0;
		padding-right: 0;
	}

	/* Archive Items: Inhalt-Padding L/R anpassen */
	.archive-item__content,
	.archive-item .wp-block-group:last-child {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
}

/* ═══════════════════════════════════════════════════════
   GLOBAL CONTENT – Bilder nicht größer als Content
   ═══════════════════════════════════════════════════════ */

.wp-block-post-content img,
.wp-block-post-content .wp-block-image img {
	max-width: 100%;
	height: auto;
}

/* Kein überlaufendes Figure-Element */
.wp-block-post-content figure.wp-block-image {
	overflow: hidden;
}

/* ═══════════════════════════════════════════════════════
   TEMPLATE-DEKLARATIONEN (für WordPress Template-Auswahl)
   ═══════════════════════════════════════════════════════ */

/* Landingpage-Template: komplett ohne äußere Abstände */
.template-landingpage .site-main {
	padding: 0 !important;
}

/* Site-Small-Padding Template */
.template-page-site-small-padding .site-main {
	padding-left: 12px;
	padding-right: 12px;
}

/* ═══════════════════════════════════════════════════════
   NAVIGATION HEADER
   ═══════════════════════════════════════════════════════ */

/* Fixiert den Header beim Scrollen */
header.wp-block-template-part {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 9999;
	background-color: var(--wp--preset--color--f1-black, #000000); /* Setze die Hintergrundfarbe, um Überlappungen zu vermeiden */
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Optional: fügt einen Schatten hinzu */
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	z-index: 999;
	padding:10px 15px;
	box-sizing: border-box;
	border-bottom:1px solid var(--wp--preset--color--f1-red, #E3101E);
}

.header-scrolled {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Optional: fügt einen stärkeren Schatten beim Scrollen hinzu */
}

/* Füge einen Platzhalter hinzu, um Layout-Verschiebungen zu vermeiden */
	.header-placeholder {
	  height: 60px; /* Höhe des Headers anpassen */
	}
.home .header-placeholder {
	  height: 0px; /* Höhe des Headers anpassen */
	margin-top:0;
	}



/* Initialer Zustand des Logos */
.logo img {
    width: 300px; /* Ursprüngliche Breite, falls anders, anpassen */
    transition: width 0.3s ease; /* Smooth Transition */
}

/* Zustand des Logos nach Scroll */
.logo.shrink img {
    width: 150px; /* Zielbreite */
}

/* ═══════════════════════════════════════════════════════
   SEARCH SITE
   ═══════════════════════════════════════════════════════ */

.wp-block-search__button-inside .wp-block-search__inside-wrapper,.wp-block-search__input {
    background-color: transparent;
    border: none;
    padding: 0;
	color: var(--wp--preset--color--f1-white, #ffffff);
	border-bottom: 1px solid var(--wp--preset--color--f1-white, #ffffff);
}
.wp-block-search__input {
	border-bottom:none;
}

.search .wp-block-post-terms a{
	color:var(--wp--preset--color--f1-red, #E3101E);
}

.is-open{
	display:block !important;
}

@media (max-width: 990px) {
	.search .columns-3 {
	  grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	h3,h2 {
	  font-size: var(--wp--preset--font-size--xxl);
	  line-height:1.1;
	}
}
/*@media (max-width: 600px) {
	.news-query__content{
		padding:0 15px !important;
	}
}*/

/* ═══════════════════════════════════════════════════════
   BORDER RADIUS
   ═══════════════════════════════════════════════════════ */

.news-tile__image,.news-tile__overlay,.yt-channel__thumb,.news-query__image-wrap,.single-post .entry-content img,.news-hero-overlay,.news-hero__mediad,.news-hero,.news-hero img,.news-hero picture{
	border-radius:12px;
}
.news-tile__category-badge,.contact-social a, button,.wp-block-button__link,.news-tile__image,.news-tile,.news-tile:hover{
	border-radius:6px;
	overflow:hidden;
}
.news-hero__category-badge,.news-tile__category-badge,.news-query__category-badge{
	border-radius:6px 0 6px 0;
}

/*@media (max-width: 900px) {
	.news-tile__category-badge {
	  border-radius:6px 0 6px 0;
	}
}*/

@media (max-width: 600px) {
	.news-tile__category-badge,.news-hero__category-badge,.post-header__category-badge {
		font-size:0.7rem !important;
	}
}



/* ═══════════════════════════════════════════════════════
   SKYSCRAPER – fixed links + rechts (ab 1200px, alle Seiten)
   Wrapper-Div wird via PHP injiziert, symplr füllt innere Div
   ═══════════════════════════════════════════════════════ */

.f1-ad-sky {
	display: none;
}

@media (min-width: 1440px) {
	.f1-ad-sky--right {
		display: block;
		position: fixed;
		top: 50%;
		left: calc(50% + 540px);
		transform: translateY(-50%);
		z-index: 100;
	}

	.f1-ad-sky--left {
		display: block;
		position: fixed;
		top: 50%;
		right: calc(50% + 540px);
		transform: translateY(-50%);
		z-index: 100;
	}
}

/* ═══════════════════════════════════════════════════════
   SITEBAR – flex + sticky neben entry-content (ab 900px)
   ═══════════════════════════════════════════════════════ */

.f1-ad-sitebar {
	display: none;
}

@media (min-width: 900px) {
	.single-post__article-wrap {
		display: flex;
		align-items: flex-start;
	}
	.single-post__article-wrap .wp-block-post-content {
		flex-shrink: 0;
	}
	.f1-ad-sitebar {
		display: block;
		flex: 1;
		position: sticky;
		top: 120px;
		margin-left: 20px;
	}
}

/* ═══════════════════════════════════════════════════════
   DARK MODE – automatisch via OS-Einstellung
   ═══════════════════════════════════════════════════════ */

@media (prefers-color-scheme: dark) {

	/* ── Globale Farben ────────────────────────────────── */
	body {
		background-color: #121212 !important;
		color: #ffffff !important;
	}

	/* ── Fließtext Single Post ─────────────────────────── */
	body.single p {
		color: #ededed;
	}

	/* ── Überschriften-Links ───────────────────────────── */
	h2 a, h2 a:hover, h2 a:active,
	h3 a, h3 a:hover, h3 a:active {
		color: var(--wp--preset--color--f1-white, #ffffff);
	}

	/* ── Überschriften global ──────────────────────────── */
	h1, h2, h3, h4, h5, h6 {
		color: var(--wp--preset--color--f1-white, #ffffff);
	}

	/* ── Block-Abschnitts-Überschriften ────────────────── */
	.news-tiles__heading,
	.news-query__heading {
		color: var(--wp--preset--color--f1-white, #ffffff);
	}

	/* ── News-Tile Titel auf Desktop (>900px) ──────────── */
	@media (min-width: 900px) {
		.news-tile__title {
			color: var(--wp--preset--color--f1-white, #ffffff);
			text-shadow: 0 1px 4px rgba(0,0,0,0.8);
		}
	}

	/* ── Tabellen – Dark Mode ──────────────────────────── */
	.wp-block-table,
	.wp-block-table.is-style-stripes {
		background-color: transparent;
	}
	.wp-block-table td,
	.wp-block-table th {
		border: none !important;
		color: var(--wp--preset--color--f1-white, #ffffff);
	}
	.wp-block-table thead {
		background-color: var(--wp--preset--color--f1-dark, #1a1a1a) !important;
		border-bottom: 3px solid var(--wp--preset--color--f1-red, #E3101E);
	}
	.wp-block-table thead th {
		color: var(--wp--preset--color--f1-white, #ffffff);
	}
	/* Ungerade Zeilen: #2a2a2a */
	.wp-block-table tbody tr:nth-child(2n+1),
	.wp-block-table.is-style-stripes tbody tr:nth-child(2n+1) {
		background-color: #2a2a2a;
		color: var(--wp--preset--color--f1-white, #ffffff);
	}
	/* Gerade Zeilen: transparent (Body-Bg) */
	.wp-block-table tbody tr:nth-child(2n),
	.wp-block-table.is-style-stripes tbody tr:nth-child(2n) {
		background-color: transparent;
		color: var(--wp--preset--color--f1-white, #ffffff);
	}

	/* ── Footer bleibt schwarz (explizit bestätigen) ───── */
	.site-footer {
		background-color: var(--wp--preset--color--f1-black, #000000) !important;
		color: var(--wp--preset--color--f1-white, #ffffff);
	}
}