/* Diese CSS-Datei enthält alles Notwendige für die 
	Formatierung der linken Navigation und
	die daraus folgende Positionierung der Hauptinhaltsspalte.
	Die portalspezifischen Farben und evtl. weitere
	portalspezifische Dinge stehen jeweils in 
	standard-hilfsmittel.css, standard-forschung.css */

/* Navi links */
@media (min-width: 992px) {
	.mainmenu ul.navbar-nav .left-menu-heading {
		position: absolute;
		/* left: 30px; */
		left: 0;
		top: 100%;
		/* margin-top: 93px; */
		/* NEU: background-color + padding 09.06.2021 Lue */
		/* background-color: #fff; */ /* stört beim dark mode */
		margin-top: 78px;
		padding-top: 15px;
		padding-bottom: 15px;
		width: 280px;
		right: 680px;
		margin-left: auto;
		margin-right: auto;
		/* font-size: 25px; */
		font-size: 1.55rem;
		font-weight: 400;
	}
		
	.mainmenu .navbar-nav .left-menu,
	.mainmenu .navbar-nav .left-menu ul {
		box-shadow: none !important;
		margin-top: 160px;
		width: 280px;
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
		/* left: 30px; */
		left: 0;
		right: 680px;
		/* top: 100%; */
		top: calc(100% - 15px);
	}
	
	.mainmenu .collapse ul ul.left-menu ul {
		position: relative;
		top: 0;
		left: 0;
		margin-top: 0;
		padding-left: 0;
		box-shadow: none !important;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a {
		padding: 15px 30px 15px 11px;
		/* border-bottom: 1px solid #dee2e6; */
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li:last-child > a {
		border-bottom: 1px solid var(--hintergrunddrei);
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a::after {
		font-family: "Font Awesome 6 Pro";
		font-weight: 900;
		content: "\f054";
		border: none;
		color: #046aa2;
		font-size: 18px;
		position: absolute;
		top: 15px;
		right: 10px;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li:hover > a::after, 
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a:focus::after,
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a:active::after {
		color: #fff;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a.active {
		color: #fff;
		background-color: #02407f;
		background-image: linear-gradient(44deg, rgba(2,64,127,0.9), rgba(4,106,162,0.9));
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > a.active::after {
		content: "\f078";
		color: #fff;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a {
		/* width: 270px; */ /* vermutlich nicht notwendig, aber stört beim dark mode */
		font-weight: 400;
		padding-top: 10px;
		padding-bottom: 0;
		padding-left: 20px;
		border-bottom: none;
		border-top: none;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li:last-child > a {
		/* border-bottom: 1px solid #dee2e6; */
		padding-bottom: 15px;
	}
	
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a:is(:hover,:focus,:active),
	.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a.active {
		color: #046aa2;
		background: #fff;
		text-decoration: underline;
	}
	
	@media (prefers-color-scheme: dark), (inverted-colors: inverted) {
		.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a:is(:hover,:focus,:active),
		.mainmenu .collapse ul.navbar-nav > li > ul.left-menu > li > ul > li > a.active {
			color: #38b3fa;
			background: #171717;
		}
	}
	
	/* Bei Folgeseiten (=alles, was nicht Homepage ist) Platz für die linke Navigation lassen */
	main.followingpage {
		max-width: 960px;
		margin: 0 auto;
		padding: 0 5px 0 325px;
	}
	
	.single-col, 
	.single-col-short {
		width: 630px;
		padding: 0;
		margin: 0;
	}
}



@media (min-width: 1200px) {
	.mainmenu ul.navbar-nav .left-menu-heading {
		right: 860px;
	}
	
	.mainmenu .navbar-nav .left-menu, 
	.mainmenu .navbar-nav .left-menu ul {
		right: 860px;
	}
	
	main.followingpage {
		max-width: 1140px;
		/* padding: 0 15px 0 375px; */
		padding: 0 15px 0 365px;
	}
	
	.single-col, 
	.single-col-short {
		width: 760px;
		/* padding: 0 0 0 15px; */
		padding: 0 15px; 
		/* Durch Änderung des padding wird der Inhalt 730px breit wie bei der Variante 
		ohne linke Navigation auf rehadat.de. Das erleichtert die Formatierung
		der Druckausgabe in print.css. Lue 28.03.2024 */
	}
}