/* =====================================================================
   SOLID MENU — Vertical design
   Auto-extracted. Loaded only when the matching dropdown_design is selected.
   ===================================================================== */



.solidae-solid-menu.orientation-vertical .solidae-solid-menu__list{
	flex-direction: column;
	align-items: stretch;
	flex-wrap: nowrap;
}



.solidae-solid-menu.orientation-vertical .solidae-solid-menu__item{ width: 100%; }



.solidae-solid-menu.design-vertical .solidae-solid-menu__list > .solidae-solid-menu__item > .solidae-solid-menu__submenu{
	width: 260px;
	min-width: 260px;
	padding: 8px;
	overflow: visible;
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__link{
	padding: 11px 12px;
	border-radius: var(--r-sm);
	font-size: 14px;
	font-weight: 500;
	color: var(--ink-2);
	transition: background 140ms ease, color 140ms ease;
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__link:hover,
.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__item.is-active > .solidae-solid-menu__link,
.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__item.is-current > .solidae-solid-menu__link{
	background: var(--paper-2);
	color: var(--ink);
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__item.is-open > .solidae-solid-menu__link{
	background: var(--paper-2);
	background: color-mix(in oklch, var(--accent) 10%, var(--paper-2));
	color: var(--ink);
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__submenu{
	top: -1px;
	left: 100%;
	margin-top: 0;
	margin-left: -1px;
	width: 280px;
	min-width: 280px;
	padding: 14px 10px;
	background: var(--paper-2);
	border: 1px solid var(--line);
	border-radius: 0 var(--r-lg) var(--r-lg) 0;
	box-shadow: var(--shadow-md);
	transform: translateX(-8px);
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__item.is-open > .solidae-solid-menu__submenu,
.solidae-solid-menu.design-vertical.trigger-hover .solidae-solid-menu__submenu .solidae-solid-menu__item:hover > .solidae-solid-menu__submenu{
	transform: translateX(0);
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__submenu .solidae-solid-menu__link{
	padding: 9px 12px;
	color: var(--ink);
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__submenu .solidae-solid-menu__link:hover{
	background: var(--paper);
}


.solidae-solid-menu.orientation-vertical .solidae-solid-menu__list > .solidae-solid-menu__item.is-divider .solidae-solid-menu__divider,
.solidae-solid-menu__submenu .solidae-solid-menu__item.is-divider .solidae-solid-menu__divider{
	width: 100%; height: 1px; margin: 4px 0;
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__list > .solidae-solid-menu__item > .solidae-solid-menu__submenu{
	width: 260px !important;
	min-width: 260px !important;
	padding: 8px !important;
	display: block !important;
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__link{
	padding: 11px 12px !important;
	border-radius: var(--r-sm) !important;
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__item.is-open > .solidae-solid-menu__link{
	background: var(--paper-2) !important;
	background: color-mix(in oklch, var(--accent) 10%, var(--paper-2)) !important;
	color: var(--ink) !important;
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__submenu .solidae-solid-menu__submenu{
	position: absolute !important;
	top: -1px !important;
	left: 100% !important;
	margin-left: -1px !important;
	width: 280px !important;
	min-width: 280px !important;
	padding: 14px 10px !important;
	background: var(--paper-2) !important;
	border: 1px solid var(--line) !important;
	border-radius: 0 var(--r-lg) var(--r-lg) 0 !important;
	box-shadow: var(--shadow-md) !important;
}


.solidae-solid-menu .vertical{
	position: absolute;
	top: calc(100% - 4px);
	left: 50%;
	margin-top: 8px;
	overflow: hidden;
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, -8px);
	pointer-events: none;
	z-index: 1000;
	transition:
		opacity 200ms ease,
		transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1),
		visibility 0s linear 220ms,
		width 280ms cubic-bezier(0.2, 0.8, 0.2, 1);
}


.solidae-solid-menu .solidae-solid-menu__item.is-open > .vertical{
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate(-50%, 0);
	transition:
		opacity 200ms ease,
		transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1),
		width 280ms cubic-bezier(0.2, 0.8, 0.2, 1);
}


.solidae-solid-menu .vertical-inner{
	display: grid;
	grid-template-columns: 260px 1fr;
}


.solidae-solid-menu .vertical-list{
	list-style: none;
	margin: 0;
	padding: 8px;
	display: flex;
	flex-direction: column;
	gap: 1px;
}


.solidae-solid-menu .vertical-row{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	cursor: pointer;
	text-decoration: none;
	transition: background 140ms ease, color 140ms ease;
}


.solidae-solid-menu .vertical-chev{
	font-size: 16px;
	line-height: 1;
	transition: transform 200ms ease, color 140ms ease;
}


.solidae-solid-menu .vertical-row.active .vertical-chev{
	transform: translateX(2px);
}


.solidae-solid-menu .vertical-arrow{
	font-size: 12px;
	opacity: 0;
	transition: opacity 140ms ease, transform 160ms ease;
	color: inherit;
}


.solidae-solid-menu .vertical-row:hover .vertical-arrow{
	opacity: 0.7;
	transform: translate(2px, -2px);
}


.solidae-solid-menu .vertical-sub{
	padding: 14px 10px 10px;
	opacity: 0;
	transition: opacity 200ms ease;
	min-width: 0;
}


.solidae-solid-menu .vertical.has-sub .vertical-sub{
	opacity: 1;
}


/* Until a sub with children is opened, drop the 2nd column entirely so the
   panel is just the list height (was reserving full grid-row height while
   invisible → very tall dropdown for short menus). */
.solidae-solid-menu .vertical:not(.has-sub) .vertical-inner{
	grid-template-columns: 260px;
}
.solidae-solid-menu .vertical:not(.has-sub) .vertical-sub{
	display: none;
}


.solidae-solid-menu .vertical-sub-group{
	display: none;
}


.solidae-solid-menu .vertical-sub-group.active{
	display: block;
}


.solidae-solid-menu .vertical-sub-label{
	font-family: "Instrument Serif", serif;
	font-style: italic;
	font-size: 12px;
	padding: 4px 12px 10px;
	color: inherit;
}


.solidae-solid-menu .vertical-sub ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1px;
}


.solidae-solid-menu .vertical-sub-row{
	display: block;
	padding: 9px 12px;
	border-radius: 6px;
	text-decoration: none;
	transition: background 140ms ease;
}


.solidae-solid-menu .vertical-sub-row:hover{
	background: rgba(0,0,0,0.03);
}


.solidae-solid-menu .vertical-sub-name{
	display: block;
	font-size: 14px;
	font-weight: 500;
}


.solidae-solid-menu .vertical-sub-desc{
	display: block;
	font-size: 12.5px;
	margin-top: 1px;
}


.solidae-solid-menu.design-vertical .solidae-solid-menu__list > .solidae-solid-menu__item > .solidae-solid-menu__submenu{
	display: none !important;
}

@media (max-width: 1080px) {
.solidae-solid-menu .vertical.has-sub{ width: 480px; min-width: 480px; }
}

@media (max-width: 1024px) {
/* Vertical: stack list + sub vertically */
	.solidae-solid-menu.mbreak-tablet.design-vertical .vertical-inner{
		display: block;
		grid-template-columns: 1fr;
	}
.solidae-solid-menu.mbreak-tablet.design-vertical .vertical-list{ border-right: 0; }
.solidae-solid-menu.mbreak-tablet.design-vertical .vertical-sub{ opacity: 1; padding-left: 12px; }
.solidae-solid-menu.mbreak-tablet.design-vertical .vertical-sub-group{ display: block !important; }
}

@media (max-width: 767px) {
.solidae-solid-menu.mbreak-mobile.design-vertical .vertical-inner{ display: block; grid-template-columns: 1fr; }
.solidae-solid-menu.mbreak-mobile.design-vertical .vertical-list{ border-right: 0; }
.solidae-solid-menu.mbreak-mobile.design-vertical .vertical-sub{ opacity: 1; padding-left: 12px; }
.solidae-solid-menu.mbreak-mobile.design-vertical .vertical-sub-group{ display: block !important; }
}


.solidae-solid-menu .vertical-sub-section + .vertical-sub-section{
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid var(--line, #E8E5DD);
}


.solidae-solid-menu .vertical-sub-section-label{
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 10.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ink-3, #8C8478);
	padding: 4px 12px 6px;
}


.solidae-solid-menu .vertical-sub-row.has-children{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}


.solidae-solid-menu .vertical-sub-row.has-children .vertical-sub-name{ flex: 1; }


.solidae-solid-menu .vertical-sub-chev{
	font-size: 14px;
	opacity: 0.55;
	transition: color 140ms ease, transform 200ms ease;
	flex-shrink: 0;
}


.solidae-solid-menu .vertical-sub-row.active .vertical-sub-chev{
	transform: translateX(2px);
	color: var(--accent, #C25A3D);
	opacity: 1;
}


.solidae-solid-menu .vertical .vertical-sub-2{
	background: var(--paper, #FBFAF7);
	padding: 14px 10px 10px;
	opacity: 0;
	transition: opacity 200ms ease;
	border-left: 1px solid var(--line, #E8E5DD);
	min-width: 0;
	display: none;
}


.solidae-solid-menu .vertical.has-sub-2 .vertical-sub-2{
	display: block;
	opacity: 1;
}


.solidae-solid-menu .vertical-sub-2-group{ display: none; }


.solidae-solid-menu .vertical-sub-2-group.active{ display: block; }


.solidae-solid-menu .vertical-sub-2 ul{
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1px;
}


.solidae-solid-menu .vertical.has-sub-2 .vertical-inner{
	grid-template-columns: 260px 1fr 1fr;
}


.solidae-solid-menu .vertical.has-sub-2{
	width: 820px !important;
}

@media (max-width: 1080px){
.solidae-solid-menu .vertical.has-sub-2{ width: 720px !important; }
}
