/*
Theme Name: IT Daily
Theme URI: https://www.it-daily.net
Description: Bricks-Childtheme für it-daily.net (ersetzt Blocksy-Child). Enthält u.a. die Desktop-Ad-Seitenspalten links/rechts neben dem Content.
Author: Solution-Work
Author URI: https://www.solution-work.de
Template: bricks
Version: 1.0.0
Text Domain: it-daily
*/

/* =========================================================
   AD-SEITENSPALTEN (Desktop / Wide Desktop, >= 1224px)
   Ersetzt das alte #itd-wrapper-Flex-Layout aus blocksy-child.
   Zwei position:fixed-Spalten am Viewport-Rand; der Content
   bekommt ab dem Breakpoint via body-Padding den nötigen Gutter.
   ========================================================= */

body {
	/* Wird nur ab >= 1224px aktiv (siehe Media Query unten). */
	--itd-ad-gutter-left: 310px;
	--itd-ad-gutter-right: 310px;
}

/* Fixed Ad-Spalten: Standardmäßig ausgeblendet (Mobile/Tablet) */
.itd-ad-sidebar {
	position: fixed;
	top: 0;
	height: 100vh;
	z-index: 10;
	display: none;
	flex-direction: column;
	align-items: center;
	padding-top: 60px; /* Header-Höhe */
	box-sizing: border-box;
}

.itd-ad-sidebar-left {
	left: 0;
	width: var(--itd-ad-gutter-left);
}

.itd-ad-sidebar-right {
	right: 0;
	width: var(--itd-ad-gutter-right);
}

.itd-ad-sidebar .itd-ad-slot {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 30px;
}

.itd-ad-sidebar .ad-container {
	display: block;
}

/* Sticky-Wirkung innerhalb der fixed-Spalte nachbilden: innerer Container klebt */
.itd-ad-sidebar-inner {
	position: sticky;
	top: 60px;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/* Nur ab Desktop (>= 1224px) einblenden + Content-Gutter reservieren */
@media (min-width: 1224px) {
	body.itd-has-ad-sidebars {
		padding-left: var(--itd-ad-gutter-left);
		padding-right: var(--itd-ad-gutter-right);
	}

	.itd-ad-sidebar {
		display: flex;
	}
}

/* =========================================================
   Ad-Slots: Leerzustand unsichtbar.
   Gestreifte Entwicklungs-Optik inkl. Anzeige- und
   Format-Label entfernt; reservierte Maße bleiben,
   damit die Anzeige beim Laden (Live) keinen Layout-Sprung
   erzeugt.
   ========================================================= */
.itd-ad-sidebar .itd-ad-slot {
	position: relative;
	justify-content: center;
}

.itd-ad-sidebar .itd-ad-slot::before,
.itd-ad-sidebar .itd-ad-slot::after {
	content: none;
}

.itd-ad-sidebar .itd-ad-slot[data-itd-ad-slot="desktop_halfpage_left"],
.itd-ad-sidebar .itd-ad-slot[data-itd-ad-slot="desktop_halfpage"] {
	width: 300px;
	height: 600px;
}


/* =========================================================
   Höhe: Rectangle nur zeigen, wenn es vollständig in die
   fixierte linke Spalte passt. Benötigt:
   Header 60 + Halfpage 600 + Abstand 30 + Rectangle 250 = 940px.
   Ist der Viewport niedriger, würde es unten abgeschnitten
   werden -> ausblenden.
   ========================================================= */
@media (max-height: 939px) {
	.itd-ad-sidebar .itd-ad-slot[data-itd-ad-slot="desktop_rectangle_left"] {
		display: none;
	}
}

/* =========================================================
   TEST: Linke Ad-Spalte auf kleineren Desktops ausblenden
   Ab 1224px bis unter 1600px: linke Spalte aus, der linke
   Gutter wird dem Inhalt zugeschlagen (Bricks nutzt den Platz).
   Reversibel: Block entfernen = Ausgangszustand wiederhergestellt.
   ========================================================= */
@media (min-width: 1224px) and (max-width: 1599px) {
	body.itd-has-ad-sidebars {
		padding-left: 0;
	}

	.itd-ad-sidebar-left {
		display: none;
	}
}

