/*
Theme Name: Blockskit Marketplace
Theme URI: https://blockskit.com/blockskit-marketplace/
Author: BlockskitDev
Author URI: https://blockskit.com
Description: Blockskit Marketplace is a modern, versatile FSE WordPress theme designed for store, shop, marketplace, online shop, ecommerce, retail, shopping, fashion, wardrobe, beauty shop, online store, and other ecommerce websites—no coding required. With full-site editing, you can easily customize every aspect of your site, including headers and footers. Featuring multiple templates, patterns, and style variations, it adapts seamlessly to various aesthetics and business needs.
Template: blockskit-base
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 5.6
License: GPLv3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: blockskit-marketplace
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, threaded-comments, translation-ready, wide-blocks, block-styles, blog, portfolio, education

Blockskit Marketplace WordPress Theme, Copyright 2025 BlockskitDev
Blockskit Marketplace is distributed under the terms of the GNU General Public License v3
*/

/* Mobile submenu toggle */
@media (max-width: 900px) {
	/* Always show submenu toggle button on mobile */
	.wp-block-navigation .wp-block-navigation-submenu {
		display: grid !important;
		grid-template-columns: 1fr auto !important;
		grid-template-rows: auto auto !important;
		column-gap: 0.5rem !important;
		align-items: center !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu > .wp-block-navigation-item__content {
		grid-row: 1 / 2 !important;
		grid-column: 1 / 2 !important;
		padding-right: 0 !important;
		padding-left: 0 !important;
		flex: 1 1 auto !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu__toggle {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 0.125rem !important;
		border: 1px solid rgba(0, 0, 0, 0.1) !important;
		background: linear-gradient(135deg, #ffffff 0%, #f0f0f0 100%) !important;
		color: #333 !important;
		cursor: pointer !important;
		font-size: 0.7rem !important;
		transition: all 0.3s ease !important;
		width: 1rem !important;
		height: 1rem !important;
		min-width: 1rem !important;
		min-height: 1rem !important;
		border-radius: 4px !important;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.5) !important;
		grid-row: 1 / 2 !important;
		grid-column: 2 / 3 !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu__toggle:hover {
		outline: none !important;
		background: linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%) !important;
		box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(255, 255, 255, 0.5) !important;
		transform: translateY(-2px) !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu__toggle:focus {
		outline: 2px solid #4A90E2 !important;
		outline-offset: 2px !important;
		opacity: 1 !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu__toggle:active {
		transform: translateY(0) !important;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.5) !important;
	}

	/* SVG icon styling */
	.wp-block-navigation .wp-block-navigation-submenu__toggle svg {
		stroke: currentColor !important;
		stroke-width: 2px !important;
		transition: transform 0.3s ease !important;
	}

	/* Rotate icon when menu is open */
	.wp-block-navigation .wp-block-navigation-submenu__toggle[aria-expanded="true"] {
		transform: rotate(180deg) !important;
		background: linear-gradient(135deg, #e0e0e0 0%, #d0d0d0 100%) !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu__toggle[aria-expanded="true"]:hover {
		background: linear-gradient(135deg, #d0d0d0 0%, #c0c0c0 100%) !important;
	}

	/* Hide submenu by default */
	.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation__submenu-container {
		display: none !important;
		max-height: 0 !important;
		overflow: hidden !important;
		opacity: 0 !important;
		transition: all 0.3s ease !important;
		grid-row: 2 / 3 !important;
		grid-column: 1 / -1 !important;
	}

	/* Show submenu when toggle has aria-expanded=true */
	.wp-block-navigation .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
		display: block !important;
		max-height: 1000px !important;
		overflow: visible !important;
		opacity: 1 !important;
		animation: slideDown 0.3s ease forwards !important;
	}

	/* Smooth animation for submenu */
	@keyframes slideDown {
		from {
			opacity: 0;
			transform: translateY(-10px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	/* Submenu styling */
	.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation__submenu-container {
		background: #f9f9f9 !important;
		border-radius: 4px !important;
		margin-top: 0.5rem !important;
		padding: 0.5rem 0 !important;
		box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05) !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation__submenu-container li {
		padding: 0 !important;
		margin: 0 !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation__submenu-container li a {
		padding: 0.75rem 1.5rem !important;
		display: block !important;
		border-bottom: 1px solid #eee !important;
		transition: background 0.2s ease !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation__submenu-container li:last-child a {
		border-bottom: none !important;
	}

	.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation__submenu-container li a:hover {
		background: #f0f0f0 !important;
	}

	/* RTL margin adjustment for submenu items */
	[dir="rtl"] .wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation__submenu-container li a {
		padding: 0.75rem 1.5rem !important;
	}
}