﻿/*
* Copyright 2014 Seven Spikes Ltd. All rights reserved. (http://www.nop-templates.com)
* http://www.nop-templates.com/t/licensinginfo
*/

.mega-menu,
.menu-title {
	display: none;
}

	.mega-menu .topic-wrapper {
		display: none;
	}

.mega-menu-responsive a,
.mega-menu-responsive a + .plus-button {
	border: none !important;
}


@media all and (min-width: 1001px) {

	.menu-title,
	.close-menu {
		display: none;
	}

	.mega-menu {
		display: block;
		position: relative;
	}

	.mega-menu-responsive {
		display: none !important;
	}

	.header-menu.categories-in-side-panel .category-menu-item,
	.header-menu.categories-in-side-panel .root-category-items {
		display: none;
	}

	.category-navigation-list .inner-wrap,
	.root-category-items .inner-wrap {
		float: left;
		width: 75%;
	}

	.category-navigation-list .slider-wrapper,
	.root-category-items .slider-wrapper {
		float: right;
		width: 25%;
		padding: 10px;
	}

	.category-navigation-list .inner-wrap:only-of-type,
	.root-category-items .inner-wrap:only-of-type {
		float: none;
		width: 100%;
	}

	.category-navigation-list > li > .sublist-wrap > .sublist .row,
	.header-menu > ul > li > .sublist-wrap > .sublist .row {
		overflow: hidden;
	}

	.category-navigation-list > li > .sublist-wrap > .sublist .box,
	.header-menu > ul > li > .sublist-wrap > .sublist .box { /*this is a subcategory item (contains a list)*/
		float: left;
		width: 33.33333%;
		padding: 10px;
		font-size: 13px;
	}

	.category-navigation-list > li > .sublist-wrap > .sublist .inner-wrap:only-of-type .box,
	.header-menu > ul > li > .sublist-wrap > .sublist .inner-wrap:only-of-type .box {
		width: 25%;
	}

	.category-navigation-list > li > .sublist-wrap > .sublist .box .title,
	.header-menu > ul > li > .sublist-wrap > .sublist .box .title { /*this is a subcategory item title (list title)*/
		display: block;
		margin: 0 0 10px;
		border-bottom: 3px solid #f74258;
		padding: 0 0 5px;
		font-weight: bold;
		text-transform: uppercase;
	}

	.category-navigation-list > li > .sublist-wrap > .sublist .box .picture,
	.header-menu > ul > li > .sublist-wrap > .sublist .box .picture {
		height: 100px;
		margin: 0 0 15px;
		overflow: hidden;
		font-size: 0;
	}

	.header-menu > ul > li > .sublist-wrap > .sublist .box .picture {
		height: auto;
		max-height: 140px;
	}

	.header-menu > ul > li > .sublist-wrap.manufacturers > .sublist .box .picture,
	.header-menu > ul > li > .sublist-wrap.vendors > .sublist .box .picture {
		/*max-height: none;*/ /*uncomment to release picture's height*/
	}

	.category-navigation-list > li > .sublist-wrap > .sublist .box .picture a,
	.header-menu > ul > li > .sublist-wrap > .sublist .box .picture a {
		display: block;
	}

	.category-navigation-list > li > .sublist-wrap > .sublist .box .picture img,
	.header-menu > ul > li > .sublist-wrap > .sublist .box .picture img {
		width: 100%;
	}

	.category-navigation-list > li > .sublist-wrap > .sublist .box li,
	.header-menu > ul > li > .sublist-wrap > .sublist .box li { /*this is a sub-subcategory item*/
		padding: 6px 0;
	}

		.category-navigation-list > li > .sublist-wrap > .sublist .box li a:hover,
		.header-menu > ul > li > .sublist-wrap > .sublist .box li a:hover {
			color: #f74258;
		}
}

/* ============================================
   SUBCATEGORIES COLLAPSIBLE
   ============================================ */

/* Hide boxes marked as hidden */
.category-navigation-list .box.hidden-item,
.mega-menu .box.hidden-item {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	height: 0 !important;
	width: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
	float: none !important;
}

/* Toggle button row for subcategories */
.category-navigation-list .expand-collapse-row,
.mega-menu .expand-collapse-row {
	width: 100%;
	clear: both;
	margin-top: 15px;
	padding-top: 15px;
	border-top: 2px solid #e0e0e0;
	text-align: center;
	float: none !important;
	display: block;
}

/* Toggle button container */
.category-navigation-list .expand-collapse-toggle-box,
.mega-menu .expand-collapse-toggle-box {
	width: 100% !important;
	float: none !important;
	text-align: center;
	padding: 10px;
}

	/* Toggle button link */
	.category-navigation-list .expand-collapse-toggle-box .toggle-link,
	.mega-menu .expand-collapse-toggle-box .toggle-link {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 12px 24px;
		color: #2196F3;
		font-weight: 600;
		font-size: 14px;
		text-decoration: none;
		background-color: #f5f5f5;
		border-radius: 5px;
		transition: all 0.3s ease;
		cursor: pointer;
	}

		/* Toggle button hover */
		.category-navigation-list .expand-collapse-toggle-box .toggle-link:hover,
		.mega-menu .expand-collapse-toggle-box .toggle-link:hover {
			background-color: #2196F3;
			color: white;
			transform: translateY(-2px);
			box-shadow: 0 4px 8px rgba(33, 150, 243, 0.3);
		}

		/* Toggle button icon */
		.category-navigation-list .expand-collapse-toggle-box .toggle-link i,
		.mega-menu .expand-collapse-toggle-box .toggle-link i {
			margin-right: 8px;
			font-size: 16px;
			transition: transform 0.3s ease;
		}

/* Rotate icon when expanded */
.category-navigation-list .sublist-wrap.expanded .toggle-link i,
.mega-menu .sublist-wrap.expanded .toggle-link i {
	transform: rotate(45deg);
}

/* Visual indicator on expandable menu items */
.category-navigation-list .expandable-menu-item > a::after,
.mega-menu .expandable-menu-item > a::after {
	content: " ⋯";
	color: #999;
	font-size: 16px;
	margin-left: 4px;
	opacity: 0.6;
}

.category-navigation-list .expandable-menu-item > a:hover::after,
.mega-menu .expandable-menu-item > a:hover::after {
	opacity: 0.8;
}

/* ============================================
   END SUBCATEGORIES COLLAPSIBLE
   ============================================ */

/* ============================================
   MAIN CATEGORIES COLLAPSIBLE
   ============================================ */

/* Hide main categories marked as hidden */
.category-navigation-list > li.hidden-main-category {
	display: none !important;
}

/* Main category toggle button */
.category-navigation-list > li.main-category-toggle {
	list-style: none;
	margin-top: 10px;
	padding-top: 10px;
	border-top: 2px solid #e0e0e0;
	text-align: center;
}

	.category-navigation-list > li.main-category-toggle .main-toggle-link {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 12px 24px;
		color: #2196F3;
		font-weight: 600;
		font-size: 14px;
		text-decoration: none;
		background-color: #f5f5f5;
		border-radius: 5px;
		transition: all 0.3s ease;
		cursor: pointer;
	}

		.category-navigation-list > li.main-category-toggle .main-toggle-link:hover {
			background-color: #2196F3;
			color: white;
			transform: translateY(-2px);
			box-shadow: 0 4px 8px rgba(33, 150, 243, 0.3);
		}

		.category-navigation-list > li.main-category-toggle .main-toggle-link i {
			margin-right: 8px;
			font-size: 16px;
			transition: transform 0.3s ease;
		}

/* Rotate icon when expanded */
.category-navigation-list.main-expanded .main-toggle-link i {
	transform: rotate(45deg);
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.category-navigation-list > li.main-category-toggle .main-toggle-link {
		font-size: 12px;
		padding: 8px 12px;
	}
}

/* ============================================
   END MAIN CATEGORIES COLLAPSIBLE
   ============================================ */

@media all and (min-width: 1281px) {

	.category-navigation-list > li > .sublist-wrap > .sublist .box .picture {
		height: 120px;
	}

	.header-menu > ul > li > .sublist-wrap > .sublist .box .picture {
		max-height: 180px;
	}
}
