// CSS custom properties for Priority Plus Navigation
// Set on :root so WordPress theme.json (which uses body selector) can override them
// Dropdown menu styles (can be overridden via theme.json)
// WordPress generates: body { --wp--custom--priority-plus-navigation--dropdown--* }
// Since body has higher specificity than :root, theme.json values will override these defaults

:root {
	--wp--custom--priority-plus-navigation--dropdown--background-color: #fff;
	--wp--custom--priority-plus-navigation--dropdown--border-color: #ddd;
	--wp--custom--priority-plus-navigation--dropdown--border-width: 1px;
	--wp--custom--priority-plus-navigation--dropdown--border-radius: 4px;
	--wp--custom--priority-plus-navigation--dropdown--box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	--wp--custom--priority-plus-navigation--dropdown--item-spacing: 0.75rem 1rem;
	--wp--custom--priority-plus-navigation--dropdown--item-hover-background-color: rgba(0, 0, 0, 0.05);
	--wp--custom--priority-plus-navigation--dropdown--item-hover-text-color: #191919;
	--wp--custom--priority-plus-navigation--dropdown--multi-level-indent: 1.25rem;

	// Submenu colors (for accordion content / nested items)
	--wp--custom--priority-plus-navigation--dropdown--submenu-background-color: #fff;
	--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-background-color: rgba(0, 0, 0, 0.05);
	--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-text-color: #191919;
}

// Short aliases for the long --wp--custom-- dropdown properties.
// Include this mixin on any .priority-plus-navigation-dropdown selector
// so the rest of the styles can use the short --ppn-dropdown-* names.
@mixin dropdown-aliases {
	// Container
	--ppn-dropdown-bg: var(--wp--custom--priority-plus-navigation--dropdown--background-color);
	--ppn-dropdown-radius: var(--wp--custom--priority-plus-navigation--dropdown--border-radius);
	--ppn-dropdown-shadow: var(--wp--custom--priority-plus-navigation--dropdown--box-shadow);

	// Border
	--ppn-dropdown-border-color: var(--wp--custom--priority-plus-navigation--dropdown--border-color, #ddd);
	--ppn-dropdown-border-width: var(--wp--custom--priority-plus-navigation--dropdown--border-width, 1px);
	--ppn-dropdown-border-style: var(--wp--custom--priority-plus-navigation--dropdown--border-style, solid);

	// Items
	--ppn-dropdown-item-spacing: var(--wp--custom--priority-plus-navigation--dropdown--item-spacing);
	--ppn-dropdown-item-color: var(--wp--custom--priority-plus-navigation--dropdown--item-text-color, #191919);
	--ppn-dropdown-item-hover-bg: var(--wp--custom--priority-plus-navigation--dropdown--item-hover-background-color);
	--ppn-dropdown-item-hover-color: var(--wp--custom--priority-plus-navigation--dropdown--item-hover-text-color);

	// Item separator
	--ppn-dropdown-sep-color: var(--wp--custom--priority-plus-navigation--dropdown--item-separator-color, transparent);
	--ppn-dropdown-sep-width: var(--wp--custom--priority-plus-navigation--dropdown--item-separator-width, 0);
	--ppn-dropdown-sep-style: var(--wp--custom--priority-plus-navigation--dropdown--item-separator-style, solid);

	// Submenu (accordion content)
	--ppn-dropdown-sub-bg: var(--wp--custom--priority-plus-navigation--dropdown--submenu-background-color);
	--ppn-dropdown-sub-color: var(--wp--custom--priority-plus-navigation--dropdown--submenu-item-text-color, #191919);
	--ppn-dropdown-sub-hover-bg: var(--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-background-color);
	--ppn-dropdown-sub-hover-color: var(--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-text-color);

	// Indentation
	--ppn-dropdown-indent: var(--wp--custom--priority-plus-navigation--dropdown--multi-level-indent);
}

// More button styles (controlled via block attributes, not theme.json)
.is-style-priority-plus-navigation {
	--priority-plus-navigation--background: transparent;
	--priority-plus-navigation--background-hover: transparent;
	--priority-plus-navigation--color: inherit;
	--priority-plus-navigation--color-hover: inherit;
	--priority-plus-navigation--border-color: transparent;
	--priority-plus-navigation--border-style: solid;
	--priority-plus-navigation--border-width: 0;
	--priority-plus-navigation--border-radius: 0;
	--priority-plus-navigation--font-family: inherit;
	--priority-plus-navigation--font-size: inherit;
	--priority-plus-navigation--font-weight: inherit;
	--priority-plus-navigation--font-style: inherit;
	--priority-plus-navigation--padding: 0;
}