@charset "UTF-8";
/*
GLOBAL SECTION
*/

.section-stores a.arrow-icon:after{width: 186px; top:0 !important; bottom: 0; margin-top: auto; margin-bottom: auto; left: calc(100% + 40px);}

.expand-button{text-transform: uppercase;  font-size: 1.125rem; margin-top: 1.5rem; width:100%; font-weight: 400; padding:10px 0; border: 1px solid var(--black); border-radius: 2.25rem; display: none; gap: 14px; align-items: center; cursor: pointer; justify-content: center;}
.expand-button.active>p{position: relative;}
.button-control-element.active .expand-button>p::after{transform: rotate(-90deg);}
.expand-button>p::after {
    position: absolute;
    left: 100%;
    top: 0;
    bottom: 0;
    margin: auto 0;
    content: '';
    display: block;
    background-image: url(/img/redesign/arrow-right.svg);
    transform: rotate(90deg);
    transition: transform .2s ease-in-out;
    margin-left: 14px;
}
.button-control-element:not(.active) .controllable-element.active{display: none;}
.button-control-element.active .controllable-element.unactive{display: none;}
.button-control-element.active .controllable-element.active{display: inline-block;}

/*
MAP SECTION
*/
.ymaps-layers-pane{
    filter: grayscale(100%);
}
.ymaps-copyrights-pane,
.ymaps-copyrights-pane+*,
.ymaps-b-zoom,
.ymaps-b-select,
.ymaps-b-form-button__content,
.ymaps-controls-righttop,
.ymaps-controls-rightbottom{
    display: none !important;
}
.bx-yandex-view-map{
    border-radius: 32px;
    overflow: hidden;
    border: 1px solid var(--black);
}
.city-select-wrapper{display: flex; justify-content: space-between; gap: 1.5rem;}
.city-select-wrapper, .section-description{margin-bottom: 3rem;}
.section-description p{line-height: 1.15;}
.button-href{font-size: 1.375rem; font-weight: 100; padding: 9px 13px; text-align: center; width: 100%; line-height: 1; border-radius: 38px; text-transform: uppercase;}
.button-href:not(.active){border: 1px solid var(--black); }
.button-href.active{background-color: var(--light-yellow); border: 1px solid var(--light-yellow);}
.custom-placemark-class{filter: brightness(0) saturate(100%) invert(14%) sepia(4%) saturate(0%) hue-rotate(0deg) brightness(98%) contrast(92%);}
.yandexmapa{height: 502px; min-height: 502px;}

/*
.ymaps-b-zoom_hints-pos_right{
	top: 0 !important;
	bottom: 0;
	margin: auto;
	height: fit-content;
}
*/


/* 
STORES SECTION 
*/
.main-page .section-stores{padding-bottom: 3px;}
.section-stores * {line-height: 1;}
.section-stores button{color: var(--black) !important;}
.section-description{font-size: 1.5rem; line-height: 1;}
.store-list-ul{display: flex; flex-direction: column; gap: 1.5rem; transition: all .3s ease;}
.store-li{font-size: 1.125rem; cursor: pointer; display: none; background-color: var(--white); border-radius: 1rem; padding: 20px;}
.store-name{display: flex; justify-content: space-between; text-transform: uppercase;}
.store-name, .features{margin-bottom: 24px;}
.store-name>div:first-child{font-weight: 500; font-size: 1.25rem; align-self: center;}
.bubble{font-weight: 400; font-size:.875rem; background-color: var(--light-yellow-selected); padding: 6px 40px; width: min(13.75vw, 264px); border-radius: 15px; text-align: center; user-select: none; min-width: fit-content;}
.features{display: flex; gap: 8px 20px; flex-wrap: wrap;}
.store-li hr{margin: 12px 0;}
.store-li a{text-decoration: none;}
.icon-info{margin: auto 0; position: relative; width: 16px; height: 16px; background-image: url(/img/redesign/info.svg); background-size: 16px;}
.icon-info>div{pointer-events: none; display: none; transition: opacity .3s ease; position: absolute; width: fit-content; z-index:1; border-radius: 10px; background: white; padding: 13px; max-width: 309px; width: max-content; font-size: .875rem; top: calc(100% + 8px); left: 0; box-shadow: 0px 0px 50px 0px rgba(34, 60, 80, 0.3); color: var(--black);}

.store-li .bubble{background-color: var(--light-yellow-selected);}
.selected.store-li .bubble{background-color: var(--light-yellow);}
.feature-item{color: var(--black-selected); display: flex; gap: 8px;}
.feature-item:nth-child(2n){flex: 0 0 50%;}
.opening-hours{color: var(--black-selected); margin-top: 4px;}

.store_list{
	list-style:none;
	display: flex;
	gap: 62px;
}

.store_list > *:first-child {width: 567px;}
.store_list > *:nth-child(2) {width: min(46.93vw, 901px); flex: 1;}
.store-li.current{display: list-item;}
.store-li.current{display: list-item;}
.store-li.current:not(*[data-city="Москва"]){display: list-item !important;}

.store_list ul{height: 548px; }
.mobile{display: none;}
@media(min-width: 1261px){
	.yandexmapa{min-width: 600px;}
}
@media(max-width: 1260px){
	.button-href,
	.store-li,
	.section-description p{font-size: 1rem; }
	.button-href{padding: 10px 20px;}
	.city-select-wrapper{gap: 12px;}
	.section-stores h2{margin-bottom: 1.125rem;}
	.city-select-wrapper, .section-description {
		margin-bottom: 1.5rem;
	}
	.section-stores a.arrow-icon:after{width: 130px; background-size: 100px;}
	.section-stores a.arrow-icon:after{left: calc(100% + 24px);}
	.bubble{font-size:.75rem;}
	.features{gap: 8px 16px;}
	.feature-item{font-size: .875rem;}
	.icon-info{width: 14px; height: 14px; background-size: 14px;}
	.feature-item:nth-child(2n){flex: unset;}
	.store_list{gap: 1.5rem;}
	.store-list-ul{gap: 1rem; padding-right: 24px;}
}
@media (min-width: 960px) and (max-width: 1096px){
	/*.section-description p{line-height: .95;}*/
}
@media(min-width: 769px) and (max-width: 1260px){
	.left-column .section-description p{font-size: 1.125rem;}
}
@media (min-width: 960px) and (max-width: 1260px){
	.city-select-wrapper:not(.services-city){padding-bottom: unset; flex-wrap: wrap;}
	.bx-yandex-map{height: 502px !important;}
	.store_list > *:first-child{width: calc(100% - 24px - 46.93vw);}
	.store_list ul{padding-right: 24px;}
}
@media (max-width: 959px) {
	.store_list{flex-wrap: wrap;}
	.section-description{display: none;}
	.mobile{display: block;}
	.section-stores .mobile>p{font-size: 1rem;}
	.store_list ul{height: unset; padding-right: unset;}
	.left-column{order: 2; justify-content: center; margin: auto;}
	.yandexmapa{min-height: unset; height: unset;}
	.bx-yandex-view-layout{margin-left: -30px; margin-right: -30px;}
	.bx-yandex-view-map{border-radius: unset; border: unset;}
	.bx-yandex-map{height: 280px !important;}
	.store_list:not(.active) li.unactive{display: none;}
	.expand-button{display: flex;}
}

.city-select-wrapper button{color :var(--black) !important;}


/* SCROLLBAR */
.horizontal-select-wrapper {
    position: relative;
}

.custom-scrollbar {
    display: none; /* показываем только на тач-устройствах */
    position: relative;
    height: 10px;
    background-color: #fff;
    border: 1px solid var(--black);
    border-radius: 22px;
    overflow: hidden;
	margin-bottom: 1.5rem;
}

.custom-scrollbar-thumb {
    position: absolute;
    top: 0;
	bottom: 0;
	margin: auto 0;
    left: 0;
    height: 6px;
    width: 40px; /* задаётся через JS */
    background: var(--black);
    border-radius: 22px;
    will-change: transform;
}

@media(max-width: 767px){
    .bx-yandex-view-layout{margin-left: -15px; margin-right: -15px;}

}

@media (hover: none) and (pointer: coarse) and (max-width: 536px) {
    .is-overflowing>.custom-scrollbar {
        display: block;
    }
	.city-select-wrapper{margin-bottom: unset !important; padding-bottom: 1rem !important;}
	.horizontal-scrollbar::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    .horizontal-scrollbar {
        scrollbar-width: none;      /* Firefox */
        -ms-overflow-style: none;   /* IE/Edge */
    }
}

.is-apple-touch .horizontal-select-wrapper.is-overflowing .custom-scrollbar {
    display: block;
}

@media (hover: hover) and (pointer: fine) {
    .horizontal-select-wrapper .custom-scrollbar {
        display: none !important;
    }
}

@media (max-width: 430px) {
	.bubble{padding: 6px 15px;}
	.store-name{flex-wrap: wrap;}
}
/*
.store-li{padding: 20px;}

.navigator-wrapper { display: flex; gap: 0 20px; flex-wrap: wrap;}
.clipboard-wrapper{
	background-color: #f6bd04;
	padding: 5px;
	cursor: pointer;
}
.clipboard-copy::after,
.clipboard-copy{
	width: 15px;
	height: 15px;
	background-size: 15px;
	background-repeat: no-repeat;
}
.clipboard-copy{
	position: relative;
	background-image: url('/images/ic_copy.svg');
}
.clipboard-copy::after{
	content: "";
	position: absolute;
	top: -5px;
	left: -5px;
	width: 30px;
	height: 30px;
	background-position: 5px 5px;
	display: block;
	opacity: 0;
	background-color: white;
	background-image: url('/images/ic_success.svg');
	transition: all .3s ease;
}
.clipboard-copy.active::after{
	opacity: 1;
}
.profilx {width: 90px; position: absolute; bottom: -25px;}
.hockey-service{position: relative; display: flex; gap: 10px;}
*/