/* Задайте своё человеческое название файла между '' */
/* --human-name-css: 'Прокручиваемые хлебные крошки на мобильных'; */

/* Укажите имя автора между '' */
/* --human-author-css: 'Игорь Лохман'; */

/* Задайте путь до аватара автора между "" */
/* --human-author-image-css: "../wp-content/plugins/super-style/assets/image/igor-main-author-ava.png"; */

/* Задайте своё человеческое описание файла между '' */
/* --human-description-css: 'Хлебные крошки на мобильных расположатся в одну прокручиваемую строку. Важно: установите ещё бесплатное дополнение «Хлебные крошки и Прогресс», чтобы они стали похожи на меню.'; */

/* ----------------- */
/* НАСТРОЙКИ ДИЗАЙНА */
/* ----------------- */

:root {

/* Высота всей полосы прокрутки - в Хлебных крошках */
/* Подсказка: "0px" - скрыть полосу */
--height-scroll-bread-progress: 2px;

/* Высота всей полосы прокрутки - в Хлебных крошках - в браузере FIREFOX */
/* Подсказка: "thin" - тонкая, "auto" - толстая, "none" - скрыть полосу */
--width-scroll-bread-progress-firefox: thin;

/* Закругление бегунка (перетаскиваемый элемент) - на всех страницах */
--radius-scroll-bread-progress: 10px;

/* Цвет бегунка (перетаскиваемый элемент) - в Хлебных крошках - в браузере FIREFOX */
--color-thumb-scroll-bread-progress: #C3CCD5;

/* Фон дорожки (пространство под бегунком) - в Хлебных крошках - в браузере FIREFOX */
--color-track-scroll-bread-progress: #ffffff;

}

/* ------------------------- */
/* НЕ ТРОГАЙТЕ ВСЁ, ЧТО НИЖЕ */
/* ------------------------- */

/* Только на смартфонах */
/* Начало ограничения экранов */
@media (max-width: 767px) {

/* Выравнивание Хлебных крошек и Прогресса */

section.breadcrumbs-row:not(.mkk_nav) .breadcrumbs-wrap {
	align-items: start !important;
	/* прокручиваемые хлебные крошки */
	overflow-x: scroll !important;
}

/* Выравнивание крошек */

section.breadcrumbs-row:not(.mkk_nav) .breadcrumbs-wrap .breadcrumbs {
	justify-content: start !important;
	flex-wrap: nowrap !important;
}

}
/* Конец ограничения экранов */

/* ===================================================================== */
/* ПОЛОСА ПРОКРУТКИ В ХЛЕБНЫХ КРОШКАХ - ВО ВСЕХ БРАУЗЕРАХ, КРОМЕ FIREFOX */
/* ===================================================================== */

/* Только на смартфонах */
/* Начало ограничения экранов */
@media (max-width: 767px) {	

/* Высота всей полосы прокрутки - в Хлебных крошках */

section.breadcrumbs-row:not(.mkk_nav) .breadcrumbs-wrap::-webkit-scrollbar {
	/* высота */
	height: var(--height-scroll-bread-progress) !important;
}

/* Дорожка полосы прокрутки (пространство под бегунком) - в Хлебных крошках */

section.breadcrumbs-row:not(.mkk_nav) .breadcrumbs-wrap::-webkit-scrollbar-track {
	/* фон */
    background: var(--color-track-scroll-bread-progress) !important;
}

/* Бегунок полосы прокрутки (перетаскиваемый элемент) - в Хлебных крошках */

section.breadcrumbs-row:not(.mkk_nav) .breadcrumbs-wrap::-webkit-scrollbar-thumb {
	/* цвет */
    background-color: var(--color-thumb-scroll-bread-progress) !important;
    /* закругление */
    border-radius: var(--radius-scroll-bread-progress) !important;
	border: none !important;
}

}
/* Конец ограничения экранов */

/* ======================================================= */
/* ПОЛОСА ПРОКРУТКИ В ХЛЕБНЫХ КРОШКАХ - В БРАУЗЕРЕ FIREFOX */
/* ======================================================= */

/* Только на смартфонах */
/* Начало ограничения экранов */
@media (max-width: 767px) {

/* Начало стилей для FIREFOX */
/* ------------------------- */

@-moz-document url-prefix() {

/* Полоса прокрутки - в Хлебных крошках - в FIREFOX */

section.breadcrumbs-row:not(.mkk_nav) .breadcrumbs-wrap {
	/* цвет бегунка и фон дорожки */
	scrollbar-color: var(--color-thumb-scroll-bread-progress) var(--color-track-scroll-bread-progress) !important;
	/* ширина всей полосы прокрутки */
	scrollbar-width: var(--width-scroll-bread-progress-firefox) !important;
	/* scrollbar-width: none !important; */
}

}
/* Конец стилей для FIREFOX */
/* ------------------------ */

}
/* Конец ограничения экранов */