/*
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

$actions-height: 38px;

#sidenav-root {
	max-height: calc(100% - var(--toolbar-height) - (2 * var(--toolbar-padding)) - 2px);
	height: calc(100% - var(--toolbar-height) - (2 * var(--toolbar-padding)) - 2px);

	#sidenav {
		min-width: var(--sidebar-min-width);
		max-width: var(--sidebar-max-width);
		height: 100%;

		#sidenav-container {
			margin-bottom: $actions-height;
			padding-bottom: 10px;

			#sidebar-nav-tree {
			}

			#actions-container {
				z-index: 10;
				position: absolute;
				bottom: 0;
				left: 0;
				width: 100%;
				height: $actions-height;

				#actions {
					display: grid;
					grid-template-columns: 1fr 1fr;
				}
			}
		}

		.node-icon {
			margin-right: 0;
			display: inline-block;
			transition: 0.3s;
			&.expanded {
				transform: rotate(90deg);
			}
		}

		.expand-node {
			overflow: hidden;
		}

		.mat-mdc-menu-item {
			padding-left: 0.5em;
			padding-right: 0.5em;
			font-weight: normal;

			&.boldNode {
				font-weight: bold;
			}
		}

		div[role=group] > .mat-tree-node > a {
			padding-left: calc(.5em + 29px);
		}
	}

	#sidenav-content {
		height: 100%;
	}
}

div.expander {
	position: absolute;
	z-index: 10;
	bottom: 6px;
	left: calc(var(--sidebar-min-width) / 2 + 1em);
	transition: 0.3s;
	width: calc(var(--sidebar-min-width) / 2);

	button {

		.animate {
			display: inline-block;
			transition-duration: 400ms;
			transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
		}
	}

	&.closed {
		left: 0;
		.animate {
			transform: rotate(180deg);
		}
	}
}
