@media (max-width: 989px) {

		#top nav.dynamic-breadcrumbs {

			/* sub-menu hide < 990px */
			ul.breadcrumb-sub-menu {display: none;}
			.breadcrumb-arrow-wrap {display: none;}
		}
	}


/* ======================================================================================================================================================
# Dynamic Breacrumbs
====================================================================================================================================================== */


	#top nav.dynamic-breadcrumbs {
		
		display: flex; flex-wrap: wrap; line-height: 1.4; font-size: 13px; align-items: center;

		/* pozioma lista okruszków */
		ul.breadcrumb-menu {
			display: flex; margin: 0; padding: 0; align-items: center; flex-wrap: wrap; list-style: none;
		}

		/* pojedynczy okruszek – kotwica dla sub-menu (position: relative) */
		li.breadcrumb-item {
			display: flex; float: none; position: relative; margin: 0; padding: 0; align-items: center; background: none; border: 0; list-style: none;
		}

		/* link okruszka */
		.breadcrumb-link {
			display: inline-flex; padding: 6px 2px; font-size: 12px; color: #555; align-items: center; text-decoration: none; white-space: nowrap; transition: color .15s ease;
		}

		a.breadcrumb-link:hover {
			color: #1a1a1a;
			.breadcrumb-text {text-decoration: underline;}
		}

		/* Current page breacrumb */
		.breadcrumb-current {color: #1a1a1a; font-weight: 600; cursor: default;}

		/* strzałka przy elementach z sub-menu */
		.breadcrumb-arrow-wrap {display: inline-flex; margin-left: 4px; align-items: center;}

		.breadcrumb-arrow {
			display: inline-block; width: 0; height: 0; border-left: 3.5px solid transparent; border-right: 3.5px solid transparent; border-top: 4px solid currentColor; opacity: .6;
		}

		/* separator */
		.breadcrumb-sep {
			display: inline-flex; margin: 0 6px; align-items: center; color: #c2c2c2;
			svg {display: block;}
		}

		/* kursor + strzałka tam gdzie sub-menu */
		.breadcrumb-item-has-children > .breadcrumb-link {cursor: pointer;}


		/* Sub-menu + scrollbar */
		ul.breadcrumb-sub-menu {
			display: block; position: absolute; top: 100%; left: 0; margin: 0; padding: 0; min-width: 230px; max-width: 320px; max-height: 235px; 
			background: #fff;  border: 1px solid #e6e6e6; border-radius: 8px; box-shadow: 0 10px 30px rgba(0, 0, 0, .14); opacity: 0; visibility: hidden; z-index: 999999;
			overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; pointer-events: none; transition: opacity .12s ease, visibility .12s ease;

			/* cienki scrollbar dopasowany do menu */
			scrollbar-width: thin; scrollbar-color: #cfcfcf transparent;
		}

		/* Scrollbar */
		ul.breadcrumb-sub-menu::-webkit-scrollbar {width: 8px;}
		ul.breadcrumb-sub-menu::-webkit-scrollbar-track {background: transparent;}
		ul.breadcrumb-sub-menu::-webkit-scrollbar-thumb {background: #cfcfcf; border-radius: 8px; border: 2px solid #fff;}
		ul.breadcrumb-sub-menu::-webkit-scrollbar-thumb:hover {background: #b3b3b3;}

		/* pozycja w sub-menu */
		li.breadcrumb-sub-item {display: block; float: none; margin: 0; padding: 0; width: 100%; background: none;}



		.breadcrumb-sub-link {
			display: block; padding: 8px 12px; width: 100%; line-height: 1.35; font-size: 12px; color: #444; 
			text-decoration: none; transition: background .1s ease, color .1s ease;
		}

		.breadcrumb-sub-link:hover {background: #f5f6f8; color: #1a1a1a;}

		/* zaokrąglamy hover przy krawędziach menu (bo mamy overflow: auto) */
		li.breadcrumb-sub-item:first-child .breadcrumb-sub-link {border-top-left-radius: 8px; border-top-right-radius: 8px;}
		li.breadcrumb-sub-item:last-child .breadcrumb-sub-link {border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;}

		/* pokazanie menu: hover myszką albo focus z klawiatury */
		.breadcrumb-item-has-children:hover > ul.breadcrumb-sub-menu,
		.breadcrumb-item-has-children:focus-within > ul.breadcrumb-sub-menu {opacity: 1; visibility: visible; pointer-events: auto;}

		/* element z otwartym menu musi być nad treścią Enfolda */
		.breadcrumb-item-has-children {z-index: 1;}
		.breadcrumb-item-has-children:hover {z-index: 100000;}

		
		.breadcrumb-item-has-children::after {display: none; content: ''; position: absolute; top: 100%; left: 0; width: 320px; max-width: 90vw; height: 9px;}

		.breadcrumb-item-has-children:hover::after {display: block;}

		.breadcrumb-item.breadcrumb-align-right > ul.breadcrumb-sub-menu {left: auto; right: 0;}
	}