/*
	Gestaltung des Seitennavigation
	- Definititon der allg. gueltigen Variablen und Einstellungen fuer Massangeben und Farben
- */


.tp-navigation {
	padding-top:20px
}

/* Erste Hauptebene gestalten */
.tp-navi-item > div {
	border-left: 3px solid var(--color-white);
	cursor: pointer;
}

.nav-item > div {
	cursor: pointer;
}

.tp-navi-item > div:hover {
	border-left: 3px solid var(--color-red-1);
	background-color: var(--bs-gray-200);
}

.tp-navi-item-active {
	border-left: 3px solid var(--color-red-1);
	background-color: var(--color-red-1);
}

.tp-navi-item-active:hover {
	background-color: var(--color-red-2);
}

.tp-navi-icon {
	display: flex;
	width: 32px;
	height: 32px;
	align-items: center;
	justify-content: center;
	margin-top: 3px;
	margin-left: 5px;
	color: var(--bs-gray-700);
}

.tp-navi-icon-active {
	display: flex;
	width: 32px;
	height: 32px;
	align-items: center;
	justify-content: center;
	margin-top: 3px;
	margin-left: 5px;
	color: var(--color-white);
}

.tp-navi-link {
	padding: 0.5rem 0.3rem;
	color: var(--bs-gray-700);
	font-size: 0.9rem;
}

.tp-navi-link:hover {
	color: var(--bs-gray-700);
}

.tp-navi-link-active {
	padding: 0.5rem 0.3rem;
	color: var(--color-white);
	font-size: 0.875rem;
	align-self: center;
}

.tp-navi-link-active:hover {
	color: var(--color-white);
}

.tp-navi-arrow {
	color: var(--bs-gray-700);
}

.tp-navi-arrow-active {
	color: var(--color-white);
}

.tp-navi-arrow-active:hover {
	color: var(--color-white);
}

.tp-navi-btn-wrapper {
	overflow-x: auto;
}


/* Submenues gestalten */
.tp-navi-sub {
	padding: 5px 0px;
	margin-left: -3px;
	background-color: var(--bs-gray-100);
}

.tp-navi-sub-item > div {
	border-left: 3px solid var(--bs-gray-100);
	background-color: var(--bs-gray-100);
}

.tp-navi-sub-item > div:hover {
	border-left: 3px solid var(--bs-gray-400);
	background-color: var(--bs-gray-200);
}

.tp-navi-sub-item-active {
	border-left: 3px solid var(--bs-gray-400);
	background-color: var(--bs-gray-200);
}

.tp-navi-sub-icon {
	display: flex;
	width: 32px;
	min-width: 32px;
	height: 32px;
	align-items: center;
	justify-content: center;
	margin-top: 3px;
	margin-left: 5px;
	color: var(--bs-gray-700);
}

.tp-navi-sub-link {
	padding: 0.5rem 0.3rem;
	color: var(--bs-gray-700);
	font-size: 0.875rem;
}

.tp-navi-sub-link:hover {
	color: var(--bs-gray-700);
}

.tp-navi-sub-arrow {
	color: var(--bs-gray-700);
}

.tp-navi-sub-arrow:hover {
	color: var(--bs-gray-700);
}


/* Indiv. Einstellung nach Einrueckungstiefe */
.tp-indent-1 {
	margin-left:56px;
}

.tp-border-bottom {
	border-bottom: 1px dotted var(--bs-gray-400);
}


.nav-item .open-menu .dropdown-toggle {
	rotate: 180deg;
}

.nav-item .indented-lvl-1 {
	margin-left: 30px;
}

.nav-item .indented-lvl-2 {
	margin-left: 70px;
}

.nav-item .indented-lvl-3 {
	margin-left: 100px;
}