/* =========================================
   HOME CATEGORIES
========================================= */

.tubuy-home-categories-box{
	position:relative;
	width:100%;
	box-sizing:border-box;
	overflow:visible;
}


/* =========================================
   TITLE
========================================= */

.tubuy-home-categories-title{
	margin:0;
	padding:0;
	line-height:1.2;
}


/* =========================================
   DIVIDER
========================================= */

.tubuy-home-categories-divider{
	width:100%;
	height:1px;
	margin:0;
}


/* =========================================
   CONTENT
========================================= */

.tubuy-home-categories-content{
	position:relative;
	display:block;
	width:100%;
}


/* =========================================
   MAIN CATEGORIES
========================================= */

.tubuy-home-categories-main{
	width:100%;
	min-width:0;
}


/* =========================================
   CATEGORIES LIST
========================================= */

.tubuy-home-categories-list{
	display:flex;
	flex-direction:column;
	width:100%;
	margin:0;
	padding:8px 0;
}


/* =========================================
   CATEGORY ITEM
========================================= */

.tubuy-home-category-item{
	position:relative;
	display:flex;
	align-items:center;

	width:100%;
	box-sizing:border-box;

	gap:14px;
	padding:9px 14px;

	text-decoration:none;
	color:#171717;

	border-radius:8px;

	transition:
		background-color .2s ease,
		color .2s ease;
}


/* =========================================
   ACTIVE / HOVER
========================================= */

.tubuy-home-category-item:hover,
.tubuy-home-category-item.is-active{
	background:#f6f6f6;
	color:#000;
}


/* =========================================
   ICON
========================================= */

.tubuy-home-category-icon{
	width:28px;
	height:28px;

	display:flex;
	align-items:center;
	justify-content:center;

	flex-shrink:0;

	border-radius:7px;

	color:#222;

	transition:
		background-color .2s ease,
		color .2s ease;
}

.tubuy-home-category-icon svg{
	width:18px;
	height:18px;

	display:block;

	stroke:currentColor;

	transition:transform .2s ease;
}


/* =========================================
   ICON ACTIVE
========================================= */

.tubuy-home-category-item:hover .tubuy-home-category-icon,
.tubuy-home-category-item.is-active .tubuy-home-category-icon{
	background:#f0f0f0;
	color:#000;
}

.tubuy-home-category-item:hover .tubuy-home-category-icon svg,
.tubuy-home-category-item.is-active .tubuy-home-category-icon svg{
	transform:scale(1.08);
}


/* =========================================
   CATEGORY NAME
========================================= */

.tubuy-home-category-name{
	flex:1;
	min-width:0;

	color:currentColor;

	font-size:15px;
	font-weight:500;
	line-height:1.3;
}


/* =========================================
   ARROW
========================================= */

.tubuy-home-category-item::after{
	content:"›";

	display:block;
	flex-shrink:0;

	font-size:20px;
	line-height:1;

	color:#aaa;

	opacity:0;
	transform:translateX(-5px);

	transition:
		opacity .2s ease,
		transform .2s ease,
		color .2s ease;
}

.tubuy-home-category-item:hover::after,
.tubuy-home-category-item.is-active::after{
	opacity:1;
	transform:translateX(0);
	color:#111;
}


/* =========================================
   MEGA PANEL
========================================= */

.tubuy-home-categories-panel{
	position:absolute;

	top:0;
	left:100%;

	width:200%;

	min-width:0;

	z-index:9999;

	box-sizing:border-box;

	pointer-events:none;
}


/* =========================================
   MEGA PANEL CONTAINER
========================================= */

.tubuy-home-categories-mega-panel{
	width:100%;

	box-sizing:border-box;

	pointer-events:none;
}


/* =========================================
   INDIVIDUAL PANEL
========================================= */

.tubuy-home-category-panel{
	display:none;

	width:100%;
	min-width:0;

	box-sizing:border-box;

	padding:24px 30px;

	background:#fff;

	border:1px solid #e5e5e5;

	border-radius:0 10px 10px 10px;

	box-shadow:0 10px 30px rgba(0,0,0,.12);
}


/* =========================================
   OPEN PANEL
========================================= */

.tubuy-home-categories-content.is-panel-open
.tubuy-home-category-panel.is-active{
	display:block;
}

.tubuy-home-categories-content.is-panel-open
.tubuy-home-categories-panel{
	pointer-events:auto;
}


/* =========================================
   PANEL HEADER
========================================= */

.tubuy-home-category-panel-header{
	display:block;

	width:100%;

	margin:0 0 22px;

	color:#111;

	font-size:22px;

	font-weight:700;

	line-height:1.3;
}


/* =========================================
   PANEL GRID
========================================= */

.tubuy-home-category-panel-grid{
	display:grid;

	width:100%;

	grid-template-columns:
		repeat(3,minmax(0,1fr));

	gap:28px 36px;
}


/* =========================================
   CATEGORY GROUP
========================================= */

.tubuy-home-category-group{
	min-width:0;
}


/* =========================================
   GROUP TITLE
========================================= */

.tubuy-home-category-group-title{
	display:block;

	width:100%;

	margin:0 0 10px;

	padding:0 0 8px;

	color:#111;

	font-size:15px;

	font-weight:700;

	line-height:1.3;

	text-decoration:none;

	border-bottom:1px solid #eeeeee;

	transition:color .2s ease;
}

.tubuy-home-category-group-title:hover{
	color:#000;
}


/* =========================================
   SUB ITEMS
========================================= */

.tubuy-home-category-subitems{
	display:flex;
	flex-direction:column;

	gap:6px;
}

.tubuy-home-category-subitem{
	display:block;

	color:#666;

	font-size:14px;

	font-weight:400;

	line-height:1.5;

	text-decoration:none;

	transition:
		color .2s ease,
		transform .2s ease;
}

.tubuy-home-category-subitem:hover{
	color:#111;
	transform:translateX(3px);
}


/* =========================================
   MOBILE
========================================= */

@media (max-width:767px){

	.tubuy-home-categories-panel{
		position:static;

		width:100%;

		margin-top:10px;

		pointer-events:auto;
	}

	.tubuy-home-categories-mega-panel{
		width:100%;
	}

	.tubuy-home-category-panel{
		padding:18px 16px;

		border-radius:8px;
	}

	.tubuy-home-category-panel-grid{
		grid-template-columns:1fr;

		gap:20px;
	}

	.tubuy-home-categories-list{
		padding:6px 0;
	}

	.tubuy-home-category-item{
		gap:11px;
		padding:8px 12px;
	}

	.tubuy-home-category-icon{
		width:26px;
		height:26px;
	}

	.tubuy-home-category-icon svg{
		width:17px;
		height:17px;
	}

	.tubuy-home-category-name{
		font-size:14px;
	}

	.tubuy-home-category-item::after{
		font-size:18px;
	}

}