/* ======================================
   VidooHub Sidebar
====================================== */

.vidoohub-layout{
	display:flex;

	width:100%;
	min-height:calc(100vh - 72px);

	margin-top:72px;

	background:#0f0f0f;
}


/* ======================================
   Sidebar
====================================== */

.vidoohub-sidebar{
	width:260px;

	background:#161616;
	border-right:1px solid #2a2a2a;

	position:sticky;
	top:72px;

	height:calc(100vh - 72px);

	overflow-y:auto;
	flex-shrink:0;
}


/* ======================================
   Sidebar Navigation
====================================== */

.vidoohub-sidebar-nav{
	padding:20px 0;
}

.vidoohub-sidebar-nav ul{
	margin:0;
	padding:0;
	list-style:none;
}

.vidoohub-sidebar-nav li{
	margin:4px 12px;
}

.vidoohub-sidebar-nav a{
	display:flex;
	align-items:center;
	gap:14px;

	padding:14px 18px;

	border-radius:14px;

	text-decoration:none;

	color:#d9d9d9;

	font-size:15px;
	font-weight:500;

	transition:.25s ease;
}

.vidoohub-sidebar-nav a:hover{
	background:#242424;
	color:#fff;
}


/* ======================================
   Active
====================================== */

.vidoohub-sidebar-nav li.active a{
	background:#ff2d75;
	color:#fff;
}


/* ======================================
   Sidebar Icons
====================================== */

.vh-icon{
	width:22px;
	height:22px;

	min-width:22px;
	min-height:22px;

	fill:none;

	stroke:currentColor;
	stroke-width:2;
	stroke-linecap:round;
	stroke-linejoin:round;

	flex-shrink:0;
}

.vidoohub-sidebar-nav a span{
	flex:1;
	line-height:1;
}


/* ======================================
   Main Content
====================================== */

.vh-main{
	flex:1;

	width:auto;
	min-width:0;

	padding:30px;

	margin-top:0;

	background:#111111;
}


/* ======================================
   Desktop Video Content Width
====================================== */

@media (min-width:1025px){

	.vh-main{
		min-width:0;
	}

}


/* ======================================
   Responsive
====================================== */

@media (max-width:1024px){

	.vidoohub-layout{
		display:block;

		width:100%;
		min-height:calc(100vh - 64px);

		margin-top:64px;
	}

	.vidoohub-sidebar{
		display:none;
	}

	.vh-main{
		width:100%;
		min-width:0;

		padding:20px;

		margin-top:0;
	}

}


/* ======================================
   Small Mobile
====================================== */

@media (max-width:480px){

	.vh-main{
		padding:16px;
	}

}