.support-navigator-widget {
	--support-navigator-text: #182230;
	--support-navigator-muted: #657182;
	--support-navigator-surface: #ffffff;
	position: fixed;
	right: max(20px, env(safe-area-inset-right));
	bottom: max(20px, env(safe-area-inset-bottom));
	z-index: 10000;
	/*font-family: OpenSans, sans-serif; */
	color: var(--support-navigator-text);
}


.support-navigator-widget__launcher,
.support-navigator-widget__launcher:hover,
.support-navigator-widget__launcher:active { width: 160px; height: 60px; border: 0; border-radius: 40px; cursor: pointer; font-weight: 700; font-size: 19px; line-height: 30px; color: #fff; background: #8C57FC; padding: 10px 15px; display: flex; gap: 15px; }
.support-navigator-widget__launcher:before { content: ''; width: 28px; height: 28px; background: url("data:image/svg+xml;utf8,<svg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M12.2025 21.6726V18.9398H14.8718V21.6726H12.2025ZM13.5371 0.000468254C21.0366 0.000468254 27.0743 6.03816 27.0743 13.5376C27.0743 21.0371 21.0366 27.0748 13.5371 27.0748C6.03766 27.0748 -3.95775e-05 21.0371 -3.95775e-05 13.5376C-3.95775e-05 6.03816 6.03766 0.000468254 13.5371 0.000468254ZM13.5371 24.4055C19.5112 24.4055 24.405 19.5118 24.405 13.5376C24.405 7.56348 19.5112 2.66976 13.5371 2.66976C7.56297 2.66976 2.66926 7.56348 2.66926 13.5376C2.66926 19.5118 7.56297 24.4055 13.5371 24.4055ZM13.5371 5.40262C16.5242 5.40262 18.9393 7.8177 18.9393 10.8048C18.9393 14.2367 14.8718 14.5545 14.8718 17.6051H12.2025C12.2025 13.2198 16.27 13.5376 16.27 10.8048C16.27 9.34301 14.9989 8.13547 13.5371 8.13547C12.0754 8.13547 10.8043 9.34301 10.8043 10.8048H8.13496C8.13496 7.8177 10.55 5.40262 13.5371 5.40262Z' fill='white'/></svg>") no-repeat 50% 50%; }
.support-navigator-widget__launcher:focus-visible,
.support-navigator-widget__launcher:active { background: #7047C9; }
@media (hover: hover) {
	.support-navigator-widget__launcher:hover { background: #7047C9; }
}

.support-navigator-widget__panel { position: absolute; right: 0; bottom: 0; display: flex; flex-direction: column; width: 375px; height: min(640px, calc(100vh - 32px)); overflow: hidden; border-radius: 10px; background: var(--support-navigator-surface); box-shadow: 0px 10px 30px 0px rgba(140, 87, 252, 0.2); }
.support-navigator-widget__panel[hidden] { display: none; }

.support-navigator-widget__header { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; height: 60px; padding: 15px 20px; background: #333; color: #fff; box-sizing: border-box; }
.support-navigator-widget__presence { display: block; color: #fff; font-size: 19px; line-height: 30px; font-weight: 700; }
.support-navigator-widget__header-actions { display: flex; gap: 4px; }

.support-navigator-widget__close,
.support-navigator-widget__close:hover,
.support-navigator-widget__close:active { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; background: transparent url("data:image/svg+xml;utf8,<svg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'><g clip-path='url(%23clip0_7792_29882)'><path d='M22.1008 9.12891L16.4297 14.8L22.1008 20.4711L20.6711 21.9008L15 16.2297L9.32891 21.9008L7.89922 20.4711L13.5703 14.8L7.89922 9.12891L9.32891 7.69922L15 13.3703L20.6711 7.69922L22.1008 9.12891Z' fill='white'/></g><defs><clipPath id='clip0_7792_29882'><rect width='30' height='30' rx='15' fill='white'/></clipPath></defs></svg>") no-repeat 50% 50%; cursor: pointer; font-size: 0; }
.support-navigator-widget__close:focus-visible,
.support-navigator-widget__close:active { background-color: #474747; }
@media (hover: hover) {
	.support-navigator-widget__close:hover { background-color: #474747; }
}

.support-navigator-widget__status { flex-shrink: 0; padding: 9px 14px; border-bottom: 1px solid #f1d9a7; background: #fff7e7; color: #744c00; font-size: 12px; line-height: 1.4; }
.support-navigator-widget__body { flex: 1 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 23px 20px 20px 20px; background: #fff; overscroll-behavior: contain; display: flex; flex-direction: column; }

@media (min-width: 769px) {
	.support-navigator-widget__body { padding-right: 6px; scrollbar-gutter: stable; }
	.support-navigator-widget__body::-webkit-scrollbar { width: 14px; }
	.support-navigator-widget__body::-webkit-scrollbar-track { margin: 5px 0; background: transparent; }
	.support-navigator-widget__body::-webkit-scrollbar-thumb { border: 5px solid transparent; border-radius: 7px; background: #999 padding-box; }
}
/* Firefox не знает ::-webkit-scrollbar. Chrome при заданном scrollbar-width игнорирует ::-webkit-scrollbar, поэтому только здесь */
@supports not selector(::-webkit-scrollbar) {
	.support-navigator-widget__body { scrollbar-width: thin; scrollbar-color: #999 transparent; }
}
.support-navigator-widget__messages { overflow: visible; margin-bottom: 23px; margin-top: -8px; }
.support-navigator-widget__messages:empty { margin-bottom: 0; margin-top: 0; }

.support-navigator-widget__message { color: #333; font-size: 16px; line-height: 25px; }
.support-navigator-widget__message a { color: #8C57FC; text-decoration: none; }

.support-navigator-widget__message b,
.support-navigator-widget__message strong { font-weight: 700; }


@media (hover: hover) {
	.support-navigator-widget__message a:hover { color: #7047C9; }
}

.support-navigator-widget__message img,
.support-navigator-widget__message video { display: block; max-width: 100%; height: auto; margin-top: 8px; border-radius: 8px; }
.support-navigator-widget__message p:first-child { margin-top: 0 !important; }
.support-navigator-widget__message p:last-child { margin-bottom: 0 !important; }

.support-navigator-widget__suggestions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px; overflow-x: visible; }
.support-navigator-widget__suggestions[hidden] { display: none; }

.support-navigator-widget__suggestion,
.support-navigator-widget__suggestion:hover,
.support-navigator-widget__suggestion:active { display: flex; justify-content: space-between; align-items: center; gap: 5px; padding: 10px 20px; border: 0; border-radius: 20px; background: #f2f2f2; color: #333; cursor: pointer; font-size: 14px; line-height: 20px; text-align: left; box-sizing: border-box; width: 100%; }
.support-navigator-widget__suggestion:after { content: ''; flex-shrink: 0; width: 20px; height: 20px; background: url("data:image/svg+xml;utf8,<svg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><use xlink:href='%23stroke0_8016_45523' fill='white'/><use xlink:href='%23stroke0_8016_45523' fill='black' fill-opacity='0.8'/><defs><path id='stroke0_8016_45523' d='M10.5 4.43107L15.9339 9.865L10.5 15.2989L9.54668 14.3456L13.3282 10.5323L5.06607 10.5323V9.19768L13.3282 9.19768L9.54668 5.38439L10.5 4.43107Z'/></defs></svg>") no-repeat 50% 50%; }
.support-navigator-widget__suggestion:focus-visible,
.support-navigator-widget__suggestion:active { background: #e6e6e6; }
@media (hover: hover) {
	.support-navigator-widget__suggestion:hover { background: #e6e6e6; }
}

.support-navigator-widget__suggestion:disabled { cursor: default; }

.support-navigator-widget__message ul li,
.support-navigator-widget__message ol ul li,
.support-navigator-widget__message ol li,
.support-navigator-widget__message ul ol li { list-style-position: outside; list-style-type: none; }
.support-navigator-widget__message ol { counter-reset: ol-li; }
.support-navigator-widget__message ol + li { margin-top: 15px; }

.support-navigator-widget__message ol li,
.article .support-navigator-widget__message ol li { margin-left: 24px; list-style-position: outside; list-style-type: none; position: relative; }

.article .support-navigator-widget__message ol li:before,
.support-navigator-widget__message ol li:before { content: counter(ol-li)'.'; left: -18px; width: 20px; position: absolute; counter-increment: ol-li; font-size: 16px; line-height: 25px; text-align: left; }

.support-navigator-widget__message ol ol li:before { content: counter(ol-li) '.' counter(ol-ol-li); counter-increment: ol-ol-li; left: -20px; width: 20px; }

.support-navigator-widget__message ul { list-style-type: none; }
.support-navigator-widget__message ul li { position: relative; margin-left: 30px; }
.support-navigator-widget__message ul li:before { content: '\2014\a0'; position:absolute; top: 0; left: -21px; }
.support-navigator-widget__message p + p,
.support-navigator-widget__message p + ol,
.support-navigator-widget__message p + ul,
.support-navigator-widget__message ol + p,
.support-navigator-widget__message ul + p { margin-top: 25px; }
.support-navigator-widget__message li + li { margin-top: 15px; }

.support-navigator-widget__navigation { margin: 6px 0 10px 0; font-size: 11px; line-height: 15px; display: flex; gap: 5px; flex-wrap: wrap; }
.support-navigator-widget__navigation[hidden] { display: none; }

.support-navigator-widget__current-title,
.article .support-navigator-widget__current-title { margin: 0 0 21px; color: #333; font-size: 19px; line-height: 30px; font-weight: 700; }
.support-navigator-widget__current-title[hidden] { display: none; }

.support-navigator-widget__navigation-separator { color: #E6E6E6; }
.support-navigator-widget__navigation-item[aria-current="page"] { font-weight: 500; }
.support-navigator-widget__navigation-item--link { color: #8C57FC; cursor: pointer; text-decoration: none; }
.support-navigator-widget__navigation-item--link:focus-visible { color: #7047C9; }
@media (hover: hover) {
	.support-navigator-widget__navigation-item--link:hover { color: #7047C9; }
}


.support-navigator-widget__footer { display: flex; gap: 10px; align-items: center; padding: 19px 20px 20px 20px; border-top: 1px solid #d1d1d1; }
.support-navigator-widget__back,
.support-navigator-widget__back:hover,
.support-navigator-widget__back:active,
.support-navigator-widget__home,
.support-navigator-widget__home:hover,
.support-navigator-widget__home:active { display: flex; align-items: center; justify-content: center; gap: 5px; flex: 0 0 calc(50% - 5px); width: auto; padding: 0 10px; border: 0; border-radius: 20px; cursor: pointer; font-size: 14px; line-height: 20px; height: 40px; background: #f2f2f2; color: #333; }
.support-navigator-widget__back:focus-visible,
.support-navigator-widget__back:active,
.support-navigator-widget__home:focus-visible,
.support-navigator-widget__home:active { background: #e6e6e6; }
@media (hover: hover) {
	.support-navigator-widget__back:hover,
	.support-navigator-widget__home:hover { background: #e6e6e6; }
}
.support-navigator-widget__back:disabled,
.support-navigator-widget__home:disabled { cursor: default; }

.support-navigator-widget__back:before { content: ''; flex-shrink: 0; width: 20px; height: 20px; background: url("data:image/svg+xml;utf8,<svg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><use xlink:href='%23stroke0_8016_3852' fill='white'/><use xlink:href='%23stroke0_8016_3852' fill='black' fill-opacity='0.8'/><defs><path id='stroke0_8016_3852' d='M15.9339 9.19768V10.5323L7.67182 10.5323L11.4533 14.3456L10.5 15.2989L5.06607 9.865L10.5 4.43107L11.4533 5.38439L7.67182 9.19768L15.9339 9.19768Z'/></defs></svg>") no-repeat 50% 50%; }

.support-navigator-widget__header-actions button[hidden],
.support-navigator-widget__footer[hidden],
.support-navigator-widget__footer button[hidden],
.support-navigator-widget__busy-overlay[hidden] { display: none; }
.support-navigator-widget__busy-overlay { position: absolute; z-index: 10; top: 60px; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; background: rgba(51, 51, 51, 0.25); cursor: wait; animation: support-navigator-fade .2s ease backwards; }
.support-navigator-widget__spinner { display: block; width: 30px; height: 30px; animation: support-navigator-spinner 1s linear infinite; }

@keyframes support-navigator-spinner {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

@media (max-width: 768px) {
	.support-navigator-widget { right: 0; bottom: 0; }
	.support-navigator-widget__panel { width: 100vw; height: 100dvh; border-radius: 0; box-shadow: none; }
	.support-navigator-widget__launcher { margin-right: 20px; margin-bottom: 20px; }

	html.support-navigator-lock,
	html.support-navigator-lock body { overflow: hidden !important; overscroll-behavior: none; height: 100%; }
	html.support-navigator-lock body { position: fixed !important; left: 0; right: 0; width: 100%; }
}

/* ---------- Анимации ---------- */

@media (hover: hover) {
	.support-navigator-widget__launcher,
	.support-navigator-widget__suggestion,
	.support-navigator-widget__back,
	.support-navigator-widget__home,
	.support-navigator-widget__close { transition: background-color .3s ease; }
	.support-navigator-widget__message a,
	.support-navigator-widget__navigation-item--link { transition: color .3s ease; }
}


@media (min-width: 769px) {
	.support-navigator-widget__panel:not([hidden]) { animation: support-navigator-open .3s ease backwards; }
}
@keyframes support-navigator-open {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: none; }
}


.support-navigator-widget__body > .is-entering { animation: support-navigator-fade .2s ease; }
@keyframes support-navigator-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}


@media (prefers-reduced-motion: reduce) {
	.support-navigator-widget *,
	.support-navigator-widget *:before,
	.support-navigator-widget *:after { transition: none !important; }
	.support-navigator-widget__panel:not([hidden]),
	.support-navigator-widget__body > .is-entering,
	.support-navigator-widget__busy-overlay { animation: none !important; }
}
