

/* Start:/bitrix/components/bitrix/map.google.system/templates/.default/style.css?177583828830*/
.bx-google-map {color: black;}
/* End */


/* Start:/local/templates/ruspring/components/bitrix/news.list/shops/style.css?178644987211410*/
.container.mapshop{background:#fff}
#gdekupit {
	--shops-accent: #0b6e4f;             /* акцентный цвет (кнопки, ссылки, активный пункт) */
	--shops-accent-contrast: #ffffff;
	--shops-text: #2b2b2b;
	--shops-muted: rgba(43, 43, 43, .55);
	--shops-border: rgba(43, 43, 43, .12);
	--shops-bg-soft: rgba(43, 43, 43, .05);
}

/* -------------------------------------------------------------------------
   Общий контейнер
------------------------------------------------------------------------- */
.row.maprow {position: relative;margin-bottom:0;display: flex;flex-wrap: wrap; padding-bottom:40px}
/* Шапка блока: счётчик организаций + выбор города */
.maprow-header {align-items: center;justify-content: space-between;padding-top:12px;padding-bottom:12px}
.organizacii {font-size: 15px;line-height: 18px;font-weight: 700;color: var(--shops-muted)}
.city-select-wrap {display: flex;align-items: center;justify-content:flex-end;gap: 10px}
.city-select-wrap label {font-size: 13px;color: var(--shops-muted);margin: 0;white-space: nowrap}
.city-select-wrap select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	min-width: 220px;
	padding: 10px 36px 10px 14px;
	font-size: 14px;
	line-height: 18px;
	color: var(--shops-text);
	background-color: #fff;
	border: 1px solid #eee;
	border-radius: 10px;
	cursor: pointer;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%232b2b2b' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
	background-repeat: no-repeat;
	background-position: right 14px center;
	transition: border-color .2s ease;
}

.city-select-wrap select:hover,
.city-select-wrap select:focus {
	border-color: var(--shops-accent);
	outline: none;
}

/* -------------------------------------------------------------------------
   Мобильный переключатель "Список / Карта"
   (на десктопе скрыт, см. media-query внизу файла)
------------------------------------------------------------------------- */
.btns {
	width: 100%;
	margin-bottom: 20px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}

.btns a.btn {
	display: block;
	width: 48%;
	padding: 12px 0;
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	color: var(--shops-text);
	background: var(--shops-bg-soft);
	border: 0 none;
	border-radius: 10px;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}

.btns a.btn.active,
.btns a.btn:hover {
	background: var(--shops-accent);
	color: var(--shops-accent-contrast);
}

/* -------------------------------------------------------------------------
   Колонка списка магазинов
------------------------------------------------------------------------- */
#spisok {
	position: relative;
}

#karta {
	position: relative;
}

.maprow .scroller {overflow: auto;height: 720px;width: 100%;margin-bottom: 20px}

.maprow .organizacia {
	margin: 0;
	padding: 16px 20px 16px 0;
	border-bottom: 1px solid #eee;
	max-width: 92%;
	cursor: pointer;
	border-left: 3px solid transparent;
	transition: border-color .2s ease;
}

/* подсветка выбранного магазина (ставится JS-ом при клике) */
.maprow .organizacia.active {
	border-left-color: var(--shops-accent);
	padding-left: 14px;
}

.maprow .organizacia .tname {
	margin: 0 0 8px;
	font-size: 15px;
	color: var(--shops-text);
	line-height: 18px;
	font-weight: 700;
	cursor: pointer;
}

.maprow .organizacia .tworkphone {
	display: block;
	margin: 0 0 8px;
	font-size: 14px;
	color: var(--shops-text);
	line-height: 20px;
	font-weight: 600;
	position: relative;
	padding-left: 24px;
}

/* иконка телефона — инлайн svg, без отдельного файла-картинки */
.maprow .organizacia .tworkphone:before {
	content: '';
	position: absolute;
	left: 0;
	top: 2px;
	width: 16px;
	height: 16px;
	background-repeat: no-repeat;
	background-size: contain;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b2b2b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z'/></svg>");
}

.maprow .organizacia .addresa {
	margin: 0;
}

.maprow .organizacia .addresa .addr {
	margin: 0;
	color: var(--shops-muted);
	font-size: 13px;
	line-height: 18px;
	font-weight: 400;
}

.maprow .organizacia .addresa .addr span {
	display: block;
	cursor: pointer;
}

/* -------------------------------------------------------------------------
   Карта
------------------------------------------------------------------------- */
.sity_map_item {
	display: block;
	width: 100%;
	height: 720px;
	border-radius: 12px;
	overflow: hidden;
}

/* Баллон Яндекс.Карт */
.ballon {
	padding: 12px;
	height: auto;
}

.ballon .tname {
	display: block;
	font-size: 14px;
	line-height: 18px;
	font-weight: 700;
	margin: 0 0 10px;
	color: var(--shops-text);
}

.ballon .tphone {
	display: block;
	font-size: 13px;
	line-height: 18px;
	color: var(--shops-text);
	margin: 0 0 10px;
}

.ballon b {
	font-weight: 600;
}

/*
	.ballon .close — стиль под кастомную кнопку закрытия баллона.
	Сейчас НЕ используется: мы отдаём в balloonContent только текст,
	и Яндекс.Карты сами рисуют стандартный крестик закрытия.
	Оставлено на будущее — если понадобится свой layout баллона со своей
	кнопкой закрытия <span class="close"></span>, раскомментируйте:

.ballon .close {
	position: absolute;
	width: 16px;
	height: 16px;
	top: 10px;
	right: 10px;
	cursor: pointer;
	opacity: .5;
}
.ballon .close:before,
.ballon .close:after {
	content: '';
	position: absolute;
	top: 50%; left: 0;
	width: 100%; height: 2px;
	background: #000;
}
.ballon .close:before { transform: rotate(45deg); }
.ballon .close:after { transform: rotate(-45deg); }
.ballon .close:hover { opacity: 1; }
*/

/* =========================================================================
   SimpleBar (кастомный скроллбар списка) — служебные стили библиотеки,
   не трогать без необходимости
   ========================================================================= */
[data-simplebar] { position: relative; flex-direction: column; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start; align-items: flex-start; }
.simplebar-wrapper { overflow: hidden; width: inherit; height: inherit; max-width: inherit; max-height: inherit; }
.simplebar-mask { direction: inherit; position: absolute; overflow: hidden; padding: 0; margin: 0; left: 0; top: 0; bottom: 0; right: 0; width: auto !important; height: auto !important; z-index: 0; }
.simplebar-offset { direction: inherit !important; box-sizing: inherit !important; resize: none !important; position: absolute; top: 0; left: 0; bottom: 0; right: 0; padding: 0; margin: 0; -webkit-overflow-scrolling: touch; }
.simplebar-content-wrapper { direction: inherit; box-sizing: border-box !important; position: relative; display: block; height: 100%; width: auto; max-width: 100%; max-height: 100%; overflow: auto; scrollbar-width: none; -ms-overflow-style: none; }
.simplebar-content-wrapper::-webkit-scrollbar,
.simplebar-hide-scrollbar::-webkit-scrollbar { display: none; width: 0; height: 0; }
.simplebar-content:before,
.simplebar-content:after { content: ' '; display: table; }
.simplebar-placeholder { max-height: 100%; max-width: 100%; width: 100%; pointer-events: none; }
.simplebar-height-auto-observer-wrapper { box-sizing: inherit !important; height: 100%; width: 100%; max-width: 1px; position: relative; float: left; max-height: 1px; overflow: hidden; z-index: -1; padding: 0; margin: 0; pointer-events: none; flex-grow: inherit; flex-shrink: 0; flex-basis: 0; }
.simplebar-height-auto-observer { box-sizing: inherit; display: block; opacity: 0; position: absolute; top: 0; left: 0; height: 1000%; width: 1000%; min-height: 1px; min-width: 1px; overflow: hidden; pointer-events: none; z-index: -1; }
.simplebar-track { z-index: 1; position: absolute; right: 0; bottom: 0; pointer-events: none; overflow: hidden; }
[data-simplebar].simplebar-dragging { pointer-events: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
[data-simplebar].simplebar-dragging .simplebar-content { pointer-events: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
[data-simplebar].simplebar-dragging .simplebar-track { pointer-events: all; }
.simplebar-scrollbar { position: absolute; left: 0; right: 0; min-height: 10px; }
.simplebar-scrollbar:before { position: absolute; content: ''; background: var(--shops-text, #000); border-radius: 7px; left: 2px; right: 2px; opacity: 0; transition: opacity 0.2s 0.5s linear; }
.simplebar-scrollbar.simplebar-visible:before { opacity: 0.4; transition-delay: 0s; transition-duration: 0s; }
.simplebar-track.simplebar-vertical { top: 0; width: 11px; }
.simplebar-scrollbar:before { top: 2px; bottom: 2px; left: 2px; right: 2px; }
.simplebar-track.simplebar-horizontal { left: 0; height: 11px; }
.simplebar-track.simplebar-horizontal .simplebar-scrollbar { right: auto; left: 0; top: 0; bottom: 0; min-height: 0; min-width: 10px; width: auto; }
[data-simplebar-direction='rtl'] .simplebar-track.simplebar-vertical { right: auto; left: 0; }
.simplebar-dummy-scrollbar-size { direction: rtl; position: fixed; opacity: 0; visibility: hidden; height: 500px; width: 500px; overflow-y: hidden; overflow-x: scroll; -ms-overflow-style: scrollbar !important; }
.simplebar-dummy-scrollbar-size > div { width: 200%; height: 200%; margin: 10px 0; }
.simplebar-hide-scrollbar { position: fixed; left: 0; visibility: hidden; overflow-y: scroll; scrollbar-width: none; -ms-overflow-style: none; }

/* =========================================================================
   Адаптив
   ========================================================================= */
@media (max-width: 991.98px) {
	.city-select-wrap {width: 100%}
	.city-select-wrap select {width: 100%}
	.btns {display: flex}
	#karta,#spisok{display: none}
	#gdekupit.karta #karta,
	#gdekupit.spisok #spisok {display: block}
	.maprow .scroller {height: 420px}
	.sity_map_item {height: 420px}
}
@media (min-width: 992px) {
	.btns {display: none}
}
/* End */
/* /bitrix/components/bitrix/map.google.system/templates/.default/style.css?177583828830 */
/* /local/templates/ruspring/components/bitrix/news.list/shops/style.css?178644987211410 */
