/**
 * Category Menu Styles
 *
 * @package Gerrards_Utilities
 */

/* Reset ALL list styles */
.gerrards-category-menu ul,
.gerrards-category-menu ul li {
	list-style: none !important;
	list-style-type: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Remove bullets completely */
.gerrards-category-menu ul li::before,
.gerrards-category-menu ul li::marker {
	display: none !important;
	content: none !important;
}

/* Menu items */
.category-menu-item {
	position: relative;
	border-bottom: 1px solid #e5e5e5;
}

/* Category links */
.category-link {
	display: block;
	padding: 5px 20px;
	color: #333;
	text-decoration: none;
	font-size: 16px;
	font-weight: 600;
	font-family: inherit;
	background: #d3d3d3;
	transition: background-color 0.2s;
}

.category-link:hover {
	background-color: #e8e8e8;
	color: #000;
}

/* Add chevron to level 0 items with children (top parents) */
.has-children-level-0 > .category-link::after {
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-left: 10px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s;
	float: right;
	margin-top: 6px;
}

/* Chevron stays pointing down for level 0 (always expanded) */
.has-children-level-0 > .category-link::after {
	transform: rotate(45deg);
}

/* Add chevron to level 1+ items with children (collapsible items) */
.has-children-level-1 > .category-link::after,
.has-children-level-2 > .category-link::after,
.has-children-level-3 > .category-link::after {
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-left: 10px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s;
	float: right;
	margin-top: 6px;
}

/* Rotate chevron on hover for level 1+ */
.has-children-level-1:hover > .category-link::after,
.has-children-level-2:hover > .category-link::after,
.has-children-level-3:hover > .category-link::after {
	transform: rotate(-135deg);
}

/* Level 1 submenus - Always visible (no collapse) */
.category-submenu-level-1 {
	max-height: none;
	overflow: visible;
	background: #fff;
	opacity: 1;
}

/* Level 2+ submenus - Collapsible with animations */
.category-submenu-level-2,
.category-submenu-level-3,
.category-submenu-level-4 {
	max-height: 0;
	overflow: hidden;
	background: #fff;
	opacity: 0;
	transition: max-height 0.3s ease-out, opacity 0.25s ease-out;
	transition-delay: 0s, 0s; /* No delay on close by default */
}

/* Show level 2+ submenu on hover with smooth animation */
.has-children-level-1:hover > .category-submenu-level-2,
.has-children-level-2:hover > .category-submenu-level-3,
.has-children-level-3:hover > .category-submenu-level-4 {
	max-height: 2000px; /* Large enough for any submenu */
	opacity: 1;
	transition: max-height 0.3s ease-in, opacity 0.25s ease-in;
	transition-delay: 0s, 0s; /* Instant open */
}

/* Add delay before closing level 2+ to prevent accidental collapse */
.has-children-level-1:not(:hover) > .category-submenu-level-2,
.has-children-level-2:not(:hover) > .category-submenu-level-3,
.has-children-level-3:not(:hover) > .category-submenu-level-4 {
	transition-delay: 0.2s, 0.15s; /* 200ms delay before closing */
}

/* Child category styling */
.category-submenu .category-link {
	padding-left: 40px;
	font-weight: 400;
	font-size: 15px;
	font-family: inherit;
	background: #fff;
}

.category-submenu .category-link:hover {
	background-color: #f5f5f5;
}

/* Remove border from last child in submenus to prevent double borders */
.category-submenu > .category-menu-item:last-child {
	border-bottom: none;
}

/* Product count */
.category-count {
	margin-left: 5px;
	font-size: 0.9em;
	color: #666;
	font-weight: 400;
}