/* mmx-cms-mega-menu v1.0.1 */

/*
 * Flyout style modifier classes - applied via instance.mvt based on the
 * flyout_style Page Builder field value.
 *
 * dlc-mega-menu__flyout--default          matches existing site appearance
 * dlc-mega-menu__flyout--rounded          8px border-radius on bottom corners
 * dlc-mega-menu__flyout--bordered         1px solid border (no top border)
 * dlc-mega-menu__flyout--rounded-bordered both rounded corners and border
 */

/* Rounded corners */
ul.mega-menu-parent-categories li div.mega-menu-flyout.dlc-mega-menu__flyout--rounded,
ul.mega-menu-parent-categories li div.mega-menu-flyout.dlc-mega-menu__flyout--rounded-bordered {
	border-radius: 0 0 8px 8px;
	overflow: hidden;
}

/* Border */
ul.mega-menu-parent-categories li div.mega-menu-flyout.dlc-mega-menu__flyout--bordered,
ul.mega-menu-parent-categories li div.mega-menu-flyout.dlc-mega-menu__flyout--rounded-bordered {
	border: 1px solid #999 !important;
	border-top: none !important;
}

/*
 * Subcat column layout fix.
 *
 * Root cause: .mega-menu-container has text-align:center from corsetmaking.css
 * which disrupts float layout on component flyouts. The hardcoded menu avoids
 * this via department-specific classes (corset-flyout, bra-flyout etc.) that
 * have their own layout rules. The component flyout does not have those classes.
 *
 * Flyout measured at 373px wide with 15px padding each side (343px usable).
 * Each column is 151px wide. Two columns = 302px, leaving 41px of space.
 * Column 2 positioned at 50% of flyout width (186px from left edge).
 * margin-left on col2 = 186 - 15 (padding) - 151 (col1 width) = 20px gap.
 * This gives equal visual breathing room on left and right of both columns.
 */
div.mega-menu-flyout.dlc-mega-menu__flyout ul.mega-menu-subcategories {
	width: 151px;
	float: left;
	margin: 0;
}

div.mega-menu-flyout.dlc-mega-menu__flyout ul.mega-menu-subcategories:nth-of-type(2) {
	margin-left: 20px;
}