/* ============================================================================
   PSR Scrollbar — своя красная полоса прокрутки (как на checkout0).
   Стрелки вверх/вниз + ползунок. Системный scrollbar прячется у хоста.

   Разметка рисует js/psr-scrollbar.js:
     .psr-sb > .psr-sb-btn.psr-sb-up | .psr-sb-thumb | .psr-sb-btn.psr-sb-down
   ========================================================================== */

.psr-sb-host{
	position: relative !important;
}

/* Прячем системную полосу у элементов, к которым прикрепили свою */
.psr-sb-scroll{
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
}
.psr-sb-scroll::-webkit-scrollbar{
	width: 0 !important;
	height: 0 !important;
	display: none !important;
}

.psr-sb{
	position: absolute;
	top: 8px;
	bottom: 8px;
	right: 4px;
	width: 14px;
	box-sizing: border-box;
	background: transparent;
	z-index: 20;
	display: none;
	pointer-events: auto;
}

/* тонкая дорожка */
.psr-sb::before{
	content: '';
	position: absolute;
	left: 4px;
	top: 18px;
	bottom: 18px;
	width: 6px;
	border-radius: 4px;
	background: rgba(240,26,38,.09);
}

.psr-sb-btn{
	position: absolute;
	left: 0;
	width: 14px;
	height: 16px;
	padding: 0;
	border: 0;
	background: transparent;
	color: #F01A26;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	z-index: 1;
}
.psr-sb-btn svg{
	width: 10px;
	height: 10px;
	display: block;
}
.psr-sb-btn:hover{ color: #c11018; }
.psr-sb-btn:active{ color: #9a0c12; }
.psr-sb-up{ top: 0; }
.psr-sb-down{ bottom: 0; }

.psr-sb-thumb{
	position: absolute;
	top: 0;
	left: 0;
	width: 14px;
	box-sizing: border-box;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	background: linear-gradient(180deg, #F01A26, #c11018);
	background-clip: padding-box;
	border-radius: 7px;
	will-change: transform;
	cursor: grab;
	transition: border-width .12s ease;
}
.psr-sb:hover .psr-sb-thumb{
	background: linear-gradient(180deg, #ff2f3a, #d4121c);
	background-clip: padding-box;
}
.psr-sb-thumb:active{ cursor: grabbing; }

/* Мобильное меню — чуть толще зона захвата у края */
#presco-mobile-menu.psr-sb-host > .psr-sb{
	right: 2px;
	top: 96px; /* под шапкой меню (padding-top ~88px) */
	bottom: calc(env(safe-area-inset-bottom, 0px) + 24px);
}

/* Как на checkout form-card: дети не сжимаются — лишнее уезжает в прокрутку */
#presco-mobile-menu.psr-sb-host > *:not(.psr-sb){
	flex-shrink: 0 !important;
}

/* iOS Safari: Logout уезжал под нижнюю панель — нельзя было доскроллить.
   100dvh + большой padding-bottom (safe-area + запас под chrome/FAB). */
#presco-mobile-menu{
	height: 100vh !important;
	height: 100dvh !important;
	max-height: 100vh !important;
	max-height: 100dvh !important;
	bottom: 0;
	padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 120px) !important;
	box-sizing: border-box !important;
}
#presco-mobile-menu .btn-logout-styled{
	margin-bottom: 8px;
	position: relative;
	z-index: 1;
}
/* доп. «воздух» после последнего пункта — гарантирует scrollExtent */
#presco-mobile-menu::after{
	content: '';
	display: block;
	flex-shrink: 0;
	height: 24px;
	pointer-events: none;
}

/* Списки стран / address book — тоже не сжимать содержимое */
.fabm-list.psr-sb-scroll > *,
.fabm-body.psr-sb-scroll > *,
.country-list.psr-sb-scroll > *,
.select-list.psr-sb-scroll > *,
.custom-options.psr-sb-scroll > *{
	flex-shrink: 0;
}

/* 2026-08-12 — полоса для прокрутки самой страницы (личный кабинет).
   Держится поверх контента, но ниже модалок (у них z-index заметно выше). */
.psr-sb.psr-sb-fixed{
	position: fixed;
	/* ниже шапки: у самого верха полоса накрывала кнопку меню */
	top: 76px;
	bottom: 12px;
	right: 4px;
	/* поверх шапки и плавающих кнопок — иначе клики по стрелкам перехватывает
	   то, что лежит выше по z-index */
	z-index: 2147483000;
}
/* нативную полосу документа прячем только когда своя реально навешена */
html.psr-sb-scroll, body.psr-sb-scroll{
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
}
html.psr-sb-scroll::-webkit-scrollbar, body.psr-sb-scroll::-webkit-scrollbar{
	width: 0 !important; height: 0 !important; display: none !important;
}
