/*
 * VeniDesign Toolkit — mobile-menu.css
 * Drill-down w offcanvas: poziomy przesuwane w bok + „Wstecz".
 * Kolory z motywu (CSS vars) — dziala na jasnym i ciemnym tle offcanvas.
 */

.vdt-dd {
	overflow: hidden;
	transition: height .3s ease;
}
.vdt-dd__track {
	display: flex;
	align-items: flex-start;
	transition: transform .3s ease;
	will-change: transform;
}
.vdt-dd__panel {
	flex: 0 0 100%;
	min-width: 100%;
}

/* wiersz pozycji — twarde nadpisanie typografii motywu: linki <a> w nav
   dziedziczą font-size mobilnego menu Blocksy (~24px z Customizera),
   a przyciski nie — bez !important wiersze mają różne wielkości */
.vdt-dd a.vdt-dd__row,
.vdt-dd button.vdt-dd__row {
	display: flex;
	align-items: center;
	gap: 11px;
	width: 100%;
	padding: 15px 2px;
	margin: 0;
	background: none;
	border: none;
	border-bottom: 1px solid rgba(125, 120, 100, .16);
	font-family: inherit;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	color: var(--theme-text-color, #243018) !important;
	text-decoration: none !important;
	text-align: left;
	cursor: pointer;
}
.vdt-dd__row span { flex: 1; }
.vdt-dd__row:hover span { color: var(--theme-palette-color-2, #3FA744); }
.vdt-dd__chev { flex: none; color: var(--theme-palette-color-2, #3FA744); }

.vdt-dd .vdt-dd__row--all {
	color: var(--theme-palette-color-2, #3FA744) !important;
	font-size: 14px !important;
}
.vdt-dd .vdt-dd__row--promo {
	font-size: 14px !important;
	font-weight: 600 !important;
}
.vdt-dd__row--promo span::before {
	content: "★ ";
	color: var(--theme-palette-color-1, #f98d00);
}

/* swatch koloru (poziom 2) */
.vdt-dd__sw {
	width: 22px;
	height: 22px;
	border-radius: 5px;
	border: 1px solid rgba(0, 0, 0, .08);
	flex: none;
}

/* naglowek podpoziomu = Wstecz + tytul */
.vdt-dd__back {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 13px 2px;
	background: none;
	border: none;
	border-bottom: 1px solid rgba(125, 120, 100, .16);
	font-family: inherit;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--theme-palette-color-2, #3FA744);
	text-align: left;
	cursor: pointer;
}

/* widoczny fokus (WCAG 2.2) */
.vdt-dd__row:focus-visible,
.vdt-dd__back:focus-visible {
	outline: 2px solid var(--theme-palette-color-1, #f98d00);
	outline-offset: -2px;
}

@media (prefers-reduced-motion: reduce) {
	.vdt-dd,
	.vdt-dd__track { transition: none; }
}
