@rt-tools/ui-kit-v2 0.29.1 → 0.31.0

package/fesm2022/rt-tools-ui-kit-v2-page-header.mjs

@@ -609,7 +609,7 @@ var RtPageHeaderComponent = class RtPageHeaderComponent {
 			ngImport: i0,
 			template: "<ng-container rtBlock=\"rt-page-header\">\n    <nav rtElem=\"nav\" #nav [attr.aria-label]=\"navAriaLabel()\">\n        <ul rtElem=\"list\" role=\"list\" #list>\n            @for (section of sections(); track section.id) {\n                <li\n                    rtElem=\"item\"\n                    qa-dataid=\"header-nav-item\"\n                    [rtMod]=\"{ isOverflow: overflowIds().has(section.id) }\"\n                    [attr.data-id]=\"section.id\"\n                    [attr.aria-hidden]=\"overflowIds().has(section.id) || null\"\n                    [attr.inert]=\"overflowIds().has(section.id) || null\">\n                    @switch (section.kind) {\n                        @case (EntryKind.Panel) {\n                            <button\n                                rtElem=\"link\"\n                                type=\"button\"\n                                qa-dataid=\"header-nav-trigger\"\n                                #groupPopover=\"rtPopover\"\n                                rtPopoverTrigger=\"hover\"\n                                rtPopoverFitViewport\n                                rtPopoverOffsetY=\"14\"\n                                [rtMod]=\"{\n                                    isActive: activeSectionIds().has(section.id),\n                                    isOpen: groupPopover.isOpen(),\n                                }\"\n                                [attr.aria-haspopup]=\"true\"\n                                [attr.aria-expanded]=\"groupPopover.isOpen()\"\n                                [rtPopover]=\"submenuTpl\"\n                                (click)=\"groupPopover.open()\">\n                                @if (section.icon) {\n                                    <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                }\n                                <span rtElem=\"label\">{{ section.label }}</span>\n                                @if (section.unread) {\n                                    <span\n                                        rtElem=\"marker\"\n                                        role=\"img\"\n                                        qa-dataid=\"header-nav-marker\"\n                                        [attr.data-id]=\"section.id\"\n                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                }\n                                <span rtElem=\"caret\" aria-hidden=\"true\">\n                                    <rt-icon name=\"chevron-up-down\" size=\"xs\" />\n                                </span>\n                            </button>\n                            <ng-template #submenuTpl>\n                                <div rtBlock=\"rt-page-header-submenu\" role=\"menu\" [style.--rt-nav-panel-columns]=\"section.columnCount\">\n                                    @for (column of section.columns; track column.id) {\n                                        <div rtElem=\"column\" qa-dataid=\"header-nav-column\" [attr.data-id]=\"column.id\">\n                                            @for (group of column.groups; track group.id) {\n                                                <div rtElem=\"group\" role=\"group\" [attr.aria-label]=\"group.label || null\">\n                                                    @if (group.label) {\n                                                        <div rtElem=\"group-title\" qa-dataid=\"header-nav-group\" [attr.data-id]=\"group.id\">\n                                                            @if (group.icon) {\n                                                                <rt-icon rtElem=\"group-icon\" size=\"xs\" [name]=\"group.icon\" />\n                                                            }\n                                                            <span rtElem=\"group-label\">{{ group.label }}</span>\n                                                        </div>\n                                                    }\n                                                    @for (entry of group.items; track entry.id) {\n                                                        @if (entry.kind === EntryKind.Link) {\n                                                            <a\n                                                                rtElem=\"link\"\n                                                                role=\"menuitem\"\n                                                                qa-dataid=\"header-nav-subitem\"\n                                                                routerLinkActive=\"rt-page-header-submenu__link--is-active\"\n                                                                [attr.data-id]=\"entry.id\"\n                                                                [routerLink]=\"entry.route\"\n                                                                [routerLinkActiveOptions]=\"{ exact: entry.routerLinkActiveExact }\"\n                                                                (click)=\"groupPopover.close()\">\n                                                                <span rtElem=\"label\">{{ entry.label }}</span>\n                                                                @if (entry.unread) {\n                                                                    <span\n                                                                        rtElem=\"marker\"\n                                                                        role=\"img\"\n                                                                        qa-dataid=\"header-nav-marker\"\n                                                                        [attr.data-id]=\"entry.id\"\n                                                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                                                }\n                                                            </a>\n                                                        } @else if (entry.disabled) {\n                                                            <span\n                                                                rtElem=\"disabled-slot\"\n                                                                role=\"none\"\n                                                                [rtTooltip]=\"\n                                                                    'uiSectionInProgress' | rtKitLabel: translate() : { label: entry.label }\n                                                                \">\n                                                                <button\n                                                                    rtElem=\"link\"\n                                                                    role=\"menuitem\"\n                                                                    type=\"button\"\n                                                                    qa-dataid=\"header-nav-subitem\"\n                                                                    [rtMod]=\"{ disabled: true }\"\n                                                                    [attr.data-id]=\"entry.id\"\n                                                                    [attr.aria-disabled]=\"true\">\n                                                                    <span rtElem=\"label\">{{ entry.label }}</span>\n                                                                </button>\n                                                            </span>\n                                                        } @else {\n                                                            <button\n                                                                rtElem=\"link\"\n                                                                role=\"menuitem\"\n                                                                type=\"button\"\n                                                                qa-dataid=\"header-nav-subitem\"\n                                                                [attr.data-id]=\"entry.id\"\n                                                                (click)=\"onItemClick(entry.id)\">\n                                                                <span rtElem=\"label\">{{ entry.label }}</span>\n                                                                @if (entry.unread) {\n                                                                    <span\n                                                                        rtElem=\"marker\"\n                                                                        role=\"img\"\n                                                                        qa-dataid=\"header-nav-marker\"\n                                                                        [attr.data-id]=\"entry.id\"\n                                                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                                                }\n                                                            </button>\n                                                        }\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n                            </ng-template>\n                        }\n                        @case (EntryKind.Link) {\n                            <a\n                                rtElem=\"link\"\n                                routerLinkActive=\"rt-page-header__link--is-active\"\n                                [routerLink]=\"section.route\"\n                                [routerLinkActiveOptions]=\"{ exact: section.routerLinkActiveExact }\">\n                                @if (section.icon) {\n                                    <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                }\n                                <span rtElem=\"label\">{{ section.label }}</span>\n                                @if (section.unread) {\n                                    <span\n                                        rtElem=\"marker\"\n                                        role=\"img\"\n                                        qa-dataid=\"header-nav-marker\"\n                                        [attr.data-id]=\"section.id\"\n                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                }\n                            </a>\n                        }\n                        @default {\n                            @if (section.disabled) {\n                                <span\n                                    rtElem=\"disabled-slot\"\n                                    role=\"none\"\n                                    [rtTooltip]=\"'uiSectionInProgress' | rtKitLabel: translate() : { label: section.label }\">\n                                    <button rtElem=\"link\" type=\"button\" [rtMod]=\"{ disabled: true }\" [attr.aria-disabled]=\"true\">\n                                        @if (section.icon) {\n                                            <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                        }\n                                        <span rtElem=\"label\">{{ section.label }}</span>\n                                    </button>\n                                </span>\n                            } @else {\n                                <button rtElem=\"link\" type=\"button\" (click)=\"onItemClick(section.id)\">\n                                    @if (section.icon) {\n                                        <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                    }\n                                    <span rtElem=\"label\">{{ section.label }}</span>\n                                    @if (section.unread) {\n                                        <span\n                                            rtElem=\"marker\"\n                                            role=\"img\"\n                                            qa-dataid=\"header-nav-marker\"\n                                            [attr.data-id]=\"section.id\"\n                                            [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                    }\n                                </button>\n                            }\n                        }\n                    }\n                </li>\n            }\n            <li\n                rtElem=\"item\"\n                #moreItem\n                [rtMod]=\"{ isOverflow: !moreShown() }\"\n                [attr.aria-hidden]=\"!moreShown() || null\"\n                [attr.inert]=\"!moreShown() || null\">\n                <rt-page-header-more [sections]=\"moreSections()\" [active]=\"moreActive()\" (itemClick)=\"onItemClick($event)\" />\n            </li>\n        </ul>\n    </nav>\n\n    <button\n        rtElem=\"burger\"\n        type=\"button\"\n        qa-dataid=\"header-nav-burger\"\n        #mobileNavPopover=\"rtPopover\"\n        rtPopoverFitViewport\n        rtPopoverOffsetY=\"14\"\n        [attr.aria-label]=\"t().uiNavMenu\"\n        [rtMod]=\"{ isOpen: mobileNavPopover.isOpen() }\"\n        [attr.aria-haspopup]=\"true\"\n        [attr.aria-expanded]=\"mobileNavPopover.isOpen()\"\n        [rtPopover]=\"mobileNavTpl\">\n        <rt-icon rtElem=\"burger-icon\" name=\"bars\" size=\"md\" />\n    </button>\n\n    <!--\n        Сжатая полоса стоит в разметке всегда, как и узкая: показывает её модификатор хоста.\n        Слева стопка кругов — «ещё» поверх остальных, — дальше три слота потребителя.\n    -->\n    <div rtElem=\"compact\" qa-dataid=\"header-compact\">\n        <div rtElem=\"compact-stack\">\n            <button\n                rtElem=\"compact-circle\"\n                type=\"button\"\n                qa-dataid=\"header-compact-more\"\n                #compactNavPopover=\"rtPopover\"\n                rtPopoverFitViewport\n                rtPopoverOffsetY=\"10\"\n                [rtMod]=\"{ more: true, isOpen: compactNavPopover.isOpen() }\"\n                [attr.aria-label]=\"t().uiNavMenu\"\n                [attr.aria-haspopup]=\"true\"\n                [attr.aria-expanded]=\"compactNavPopover.isOpen()\"\n                [rtPopover]=\"mobileNavTpl\">\n                <rt-icon name=\"ellipsis-h\" size=\"sm\" />\n            </button>\n            @for (section of compactSections(); track section.id; let index = $index) {\n                @if (section.kind === EntryKind.Link) {\n                    <a\n                        rtElem=\"compact-circle\"\n                        qa-dataid=\"header-compact-section\"\n                        routerLinkActive=\"rt-page-header__compact-circle--is-active\"\n                        [style.--rt-nav-compact-index]=\"index + 1\"\n                        [attr.data-id]=\"section.id\"\n                        [attr.aria-label]=\"section.label\"\n                        [routerLink]=\"section.route\"\n                        [routerLinkActiveOptions]=\"{ exact: section.routerLinkActiveExact }\"\n                        [rtTooltip]=\"section.label\">\n                        @if (section.icon; as icon) {\n                            <rt-icon size=\"sm\" [name]=\"icon\" />\n                        }\n                        @if (section.unread) {\n                            <span rtElem=\"compact-marker\" role=\"img\" [attr.aria-label]=\"t().uiNavUnread\"></span>\n                        }\n                    </a>\n                } @else {\n                    <button\n                        rtElem=\"compact-circle\"\n                        type=\"button\"\n                        qa-dataid=\"header-compact-section\"\n                        [rtMod]=\"{ isActive: activeSectionIds().has(section.id), disabled: section.disabled }\"\n                        [style.--rt-nav-compact-index]=\"index + 1\"\n                        [disabled]=\"section.disabled\"\n                        [attr.data-id]=\"section.id\"\n                        [attr.aria-label]=\"section.label\"\n                        [rtTooltip]=\"section.label\"\n                        (click)=\"onCompactSectionClick(section)\">\n                        @if (section.icon; as icon) {\n                            <rt-icon size=\"sm\" [name]=\"icon\" />\n                        }\n                        @if (section.unread) {\n                            <span rtElem=\"compact-marker\" role=\"img\" [attr.aria-label]=\"t().uiNavUnread\"></span>\n                        }\n                    </button>\n                }\n            }\n        </div>\n        <div rtElem=\"compact-slot\" [rtMod]=\"{ left: true }\"><ng-content select=\"[rtCompactLeft]\" /></div>\n        <div rtElem=\"compact-slot\" [rtMod]=\"{ center: true }\"><ng-content select=\"[rtCompactCenter]\" /></div>\n        <div rtElem=\"compact-slot\" [rtMod]=\"{ right: true }\"><ng-content select=\"[rtCompactRight]\" /></div>\n    </div>\n\n    <ng-template #mobileNavTpl>\n        <div rtBlock=\"rt-page-header-mobile\" role=\"menu\">\n            @for (section of sections(); track section.id) {\n                @switch (section.kind) {\n                    @case (EntryKind.Panel) {\n                        <button\n                            rtElem=\"section\"\n                            type=\"button\"\n                            qa-dataid=\"header-nav-mobile-trigger\"\n                            [rtMod]=\"{\n                                isExpanded: expandedSectionIds().has(section.id),\n                                isActive: activeSectionIds().has(section.id),\n                            }\"\n                            [attr.data-id]=\"section.id\"\n                            [attr.aria-expanded]=\"expandedSectionIds().has(section.id)\"\n                            (click)=\"toggleSection(section.id)\">\n                            @if (section.icon) {\n                                <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                            }\n                            <span rtElem=\"label\">{{ section.label }}</span>\n                            @if (section.unread) {\n                                <span\n                                    rtElem=\"marker\"\n                                    role=\"img\"\n                                    qa-dataid=\"header-nav-marker\"\n                                    [attr.data-id]=\"section.id\"\n                                    [attr.aria-label]=\"t().uiNavUnread\"></span>\n                            }\n                            <span rtElem=\"caret\" aria-hidden=\"true\">\n                                <rt-icon name=\"chevron-up-down\" size=\"xs\" />\n                            </span>\n                        </button>\n                        @if (expandedSectionIds().has(section.id)) {\n                            <div rtElem=\"children\">\n                                @for (group of section.panelGroups; track group.id) {\n                                    <div rtElem=\"group\" role=\"group\" [attr.aria-label]=\"group.label || null\">\n                                        @if (group.label) {\n                                            <div rtElem=\"group-title\" qa-dataid=\"header-nav-mobile-group\" [attr.data-id]=\"group.id\">\n                                                @if (group.icon) {\n                                                    <rt-icon rtElem=\"group-icon\" size=\"xs\" [name]=\"group.icon\" />\n                                                }\n                                                <span rtElem=\"group-label\">{{ group.label }}</span>\n                                            </div>\n                                        }\n                                        @for (entry of group.items; track entry.id) {\n                                            @if (entry.kind === EntryKind.Link) {\n                                                <a\n                                                    rtElem=\"link\"\n                                                    role=\"menuitem\"\n                                                    qa-dataid=\"header-nav-mobile-item\"\n                                                    routerLinkActive=\"rt-page-header-mobile__link--is-active\"\n                                                    [rtMod]=\"{ child: true }\"\n                                                    [attr.data-id]=\"entry.id\"\n                                                    [routerLink]=\"entry.route\"\n                                                    [routerLinkActiveOptions]=\"{ exact: entry.routerLinkActiveExact }\"\n                                                    (click)=\"closeNavPanels()\">\n                                                    <span rtElem=\"label\">{{ entry.label }}</span>\n                                                    @if (entry.unread) {\n                                                        <span\n                                                            rtElem=\"marker\"\n                                                            role=\"img\"\n                                                            qa-dataid=\"header-nav-marker\"\n                                                            [attr.data-id]=\"entry.id\"\n                                                            [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                                    }\n                                                </a>\n                                            } @else if (entry.disabled) {\n                                                <span\n                                                    rtElem=\"disabled-slot\"\n                                                    role=\"none\"\n                                                    [rtTooltip]=\"'uiSectionInProgress' | rtKitLabel: translate() : { label: entry.label }\">\n                                                    <button\n                                                        rtElem=\"link\"\n                                                        type=\"button\"\n                                                        role=\"menuitem\"\n                                                        qa-dataid=\"header-nav-mobile-item\"\n                                                        [rtMod]=\"{ child: true, disabled: true }\"\n                                                        [attr.data-id]=\"entry.id\"\n                                                        [attr.aria-disabled]=\"true\">\n                                                        <span rtElem=\"label\">{{ entry.label }}</span>\n                                                    </button>\n                                                </span>\n                                            } @else {\n                                                <button\n                                                    rtElem=\"link\"\n                                                    type=\"button\"\n                                                    role=\"menuitem\"\n                                                    qa-dataid=\"header-nav-mobile-item\"\n                                                    [rtMod]=\"{ child: true }\"\n                                                    [attr.data-id]=\"entry.id\"\n                                                    (click)=\"onMobileItemClick(entry.id)\">\n                                                    <span rtElem=\"label\">{{ entry.label }}</span>\n                                                    @if (entry.unread) {\n                                                        <span\n                                                            rtElem=\"marker\"\n                                                            role=\"img\"\n                                                            qa-dataid=\"header-nav-marker\"\n                                                            [attr.data-id]=\"entry.id\"\n                                                            [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                                    }\n                                                </button>\n                                            }\n                                        }\n                                    </div>\n                                }\n                            </div>\n                        }\n                    }\n                    @case (EntryKind.Link) {\n                        <a\n                            rtElem=\"link\"\n                            role=\"menuitem\"\n                            qa-dataid=\"header-nav-mobile-item\"\n                            routerLinkActive=\"rt-page-header-mobile__link--is-active\"\n                            [attr.data-id]=\"section.id\"\n                            [routerLink]=\"section.route\"\n                            [routerLinkActiveOptions]=\"{ exact: section.routerLinkActiveExact }\"\n                            (click)=\"closeNavPanels()\">\n                            @if (section.icon) {\n                                <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                            }\n                            <span rtElem=\"label\">{{ section.label }}</span>\n                            @if (section.unread) {\n                                <span\n                                    rtElem=\"marker\"\n                                    role=\"img\"\n                                    qa-dataid=\"header-nav-marker\"\n                                    [attr.data-id]=\"section.id\"\n                                    [attr.aria-label]=\"t().uiNavUnread\"></span>\n                            }\n                        </a>\n                    }\n                    @default {\n                        @if (section.disabled) {\n                            <span\n                                rtElem=\"disabled-slot\"\n                                role=\"none\"\n                                [rtTooltip]=\"'uiSectionInProgress' | rtKitLabel: translate() : { label: section.label }\">\n                                <button\n                                    rtElem=\"link\"\n                                    type=\"button\"\n                                    role=\"menuitem\"\n                                    qa-dataid=\"header-nav-mobile-item\"\n                                    [rtMod]=\"{ disabled: true }\"\n                                    [attr.data-id]=\"section.id\"\n                                    [attr.aria-disabled]=\"true\">\n                                    @if (section.icon) {\n                                        <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                    }\n                                    <span rtElem=\"label\">{{ section.label }}</span>\n                                </button>\n                            </span>\n                        } @else {\n                            <button\n                                rtElem=\"link\"\n                                type=\"button\"\n                                role=\"menuitem\"\n                                qa-dataid=\"header-nav-mobile-item\"\n                                [attr.data-id]=\"section.id\"\n                                (click)=\"onMobileItemClick(section.id)\">\n                                @if (section.icon) {\n                                    <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                }\n                                <span rtElem=\"label\">{{ section.label }}</span>\n                                @if (section.unread) {\n                                    <span\n                                        rtElem=\"marker\"\n                                        role=\"img\"\n                                        qa-dataid=\"header-nav-marker\"\n                                        [attr.data-id]=\"section.id\"\n                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                }\n                            </button>\n                        }\n                    }\n                }\n            }\n        </div>\n    </ng-template>\n\n    <ng-content select=\"[rtHeaderBell]\" />\n\n    @if (user(); as u) {\n        @if (userMenu(); as menuTpl) {\n            <!--\n                Меню профиля открывается наведением, как и разделы: весь верхний\n                ряд ведёт себя одинаково. Нажатие остаётся запасным путём для\n                касания, а переход курсора на список языков панель переживает —\n                вложенный оверлей за уход наружу не считается.\n            -->\n            <button\n                rtElem=\"user\"\n                type=\"button\"\n                qa-dataid=\"header-user-menu\"\n                #userPopover=\"rtPopover\"\n                rtPopoverTrigger=\"hover\"\n                rtPopoverAlign=\"end\"\n                rtPopoverOffsetY=\"14\"\n                [rtMod]=\"{ isOpen: userPopover.isOpen() }\"\n                [attr.aria-haspopup]=\"true\"\n                [attr.aria-expanded]=\"userPopover.isOpen()\"\n                [rtPopover]=\"menuTpl\"\n                (click)=\"userPopover.open()\">\n                <span rtElem=\"user-avatar\" aria-hidden=\"true\">{{ userAvatar() }}</span>\n                <span rtElem=\"user-name\" qa-dataid=\"header-user-name\">{{ u.name }}</span>\n                <span rtElem=\"user-caret\" aria-hidden=\"true\">\n                    <rt-icon name=\"chevron-up-down\" size=\"xs\" />\n                </span>\n            </button>\n        } @else {\n            <button rtElem=\"user\" type=\"button\" (click)=\"onUserClick()\">\n                <span rtElem=\"user-avatar\" aria-hidden=\"true\">{{ userAvatar() }}</span>\n                <span rtElem=\"user-name\" qa-dataid=\"header-user-name\">{{ u.name }}</span>\n                <span rtElem=\"user-caret\" aria-hidden=\"true\">\n                    <rt-icon name=\"chevron-up-down\" size=\"xs\" />\n                </span>\n            </button>\n        }\n    }\n</ng-container>\n",
 			styles: [
-				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header{--rt-nav-header-radius: var(--rt-radius-md);--rt-nav-header-transition-duration: var(--rt-duration-fast);--rt-nav-item-radius: var(--rt-radius-md);--rt-nav-item-border-width: var(--rt-border-width-thin);--rt-nav-burger-radius: var(--rt-radius-ms);--rt-nav-marker-radius: var(--rt-radius-full);--rt-nav-user-avatar-radius: var(--rt-radius-full);--rt-nav-user-avatar-border-width: var(--rt-border-width-thin);display:flex;width:auto;min-height:48px;box-sizing:border-box;align-items:center;justify-content:space-between;padding:var(--rt-nav-header-padding);border-radius:var(--rt-nav-header-radius);background-color:var(--rt-page-header-bg, var(--rt-nav-header-color-bg));color:var(--rt-nav-item-color);gap:var(--rt-space-2)}.rt-page-header__nav{min-width:0;flex:1 1 0}.rt-page-header__list{position:relative;display:flex;flex-flow:row wrap;align-items:center;padding:0;margin:0;gap:var(--rt-nav-item-gap);list-style:none}.rt-page-header__item{display:inline-flex;flex-shrink:0;align-items:center;border:var(--rt-nav-item-border-width) solid var(--rt-nav-item-color-border);border-radius:var(--rt-nav-item-radius);background-color:var(--rt-nav-item-color-bg)}.rt-page-header__item--is-overflow{position:absolute;top:0;left:0;pointer-events:none;visibility:hidden}.rt-page-header__disabled-slot{display:inline-flex;flex-direction:column;align-items:stretch}.rt-page-header__link{position:relative;display:inline-flex;min-height:var(--rt-nav-item-height);align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-nav-item-line-height);text-decoration:none;transition:color var(--rt-nav-header-transition-duration) linear;white-space:nowrap}.rt-page-header__link:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__link:focus{outline:none}.rt-page-header__link:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__link--is-active{background-color:var(--rt-nav-item-color-bg-active);color:var(--rt-nav-item-color)}.rt-page-header__link--is-open{color:var(--rt-nav-item-color-hover)}.rt-page-header__link--disabled,.rt-page-header__link:disabled,.rt-page-header__link[aria-disabled=true]{background-color:transparent;color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header__link--disabled:hover,.rt-page-header__link:disabled:hover,.rt-page-header__link[aria-disabled=true]:hover{background-color:transparent}.rt-page-header__icon{flex-shrink:0}.rt-page-header__marker{width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);flex-shrink:0;border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header__caret{display:inline-flex;flex-shrink:0;color:var(--rt-nav-item-color-caret)}.rt-page-header__burger{display:none;flex-shrink:0;align-items:center;justify-content:center;padding:var(--rt-space-2);border:0;border-radius:var(--rt-nav-burger-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;transition:color var(--rt-nav-header-transition-duration) linear}.rt-page-header__burger:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__burger:active{color:var(--rt-nav-item-color-pressed)}.rt-page-header__burger:focus{outline:none}.rt-page-header__burger:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__burger--is-open{background-color:var(--rt-nav-item-color-bg-active)}.rt-page-header__burger-icon{flex-shrink:0}@container rt-place (width <= 1380px){.rt-page-header__link .rt-page-header__icon{display:none}}@container rt-place (width <= 1080px){.rt-page-header__nav{display:none}.rt-page-header__burger{display:inline-flex}}.rt-page-header__user{display:inline-flex;min-height:var(--rt-nav-item-height);align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-leading-tight);transition:background-color var(--rt-nav-header-transition-duration) linear}.rt-page-header__user:hover,.rt-page-header__user:active{background-color:var(--rt-nav-item-color-bg-active)}.rt-page-header__user:focus{outline:none}.rt-page-header__user:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__user-avatar{display:inline-flex;width:16px;height:16px;align-items:center;justify-content:center;border:var(--rt-nav-user-avatar-border-width) solid var(--rt-nav-item-color-caret);border-radius:var(--rt-nav-user-avatar-radius);color:var(--rt-color-text-muted);font-size:var(--rt-text-2xs);font-weight:var(--rt-font-weight-semibold);line-height:var(--rt-leading-none)}.rt-page-header__user-name{white-space:nowrap}.rt-page-header__user-caret{display:inline-flex;flex-shrink:0;color:var(--rt-nav-item-color-caret)}.rt-page-header__user--is-open{background-color:var(--rt-nav-item-color-bg-active)}}\n",
+				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header{--rt-nav-header-radius: var(--rt-radius-md);--rt-nav-header-transition-duration: var(--rt-duration-fast);--rt-nav-item-radius: var(--rt-radius-md);--rt-nav-item-border-width: var(--rt-border-width-thin);--rt-nav-burger-radius: var(--rt-radius-ms);--rt-nav-marker-radius: var(--rt-radius-full);--rt-nav-user-avatar-radius: var(--rt-radius-full);--rt-nav-user-avatar-border-width: var(--rt-border-width-thin);display:flex;width:auto;min-height:48px;box-sizing:border-box;align-items:center;justify-content:space-between;padding:var(--rt-nav-header-padding);border-radius:var(--rt-nav-header-radius);background-color:var(--rt-page-header-bg, var(--rt-nav-header-color-bg));color:var(--rt-nav-item-color);gap:var(--rt-space-2)}.rt-page-header__nav{min-width:0;flex:1 1 0}.rt-page-header__list{position:relative;display:flex;flex-flow:row wrap;align-items:center;padding:0;margin:0;gap:var(--rt-nav-item-gap);list-style:none}.rt-page-header__item{display:inline-flex;flex-shrink:0;align-items:center;border:var(--rt-nav-item-border-width) solid var(--rt-nav-item-color-border);border-radius:var(--rt-nav-item-radius);background-color:var(--rt-nav-item-color-bg)}.rt-page-header__item--is-overflow{position:absolute;top:0;left:0;pointer-events:none;visibility:hidden}.rt-page-header__disabled-slot{display:inline-flex;flex-direction:column;align-items:stretch}.rt-page-header__link{position:relative;display:inline-flex;min-height:var(--rt-nav-item-height);align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-nav-item-line-height);text-decoration:none;transition:color var(--rt-nav-header-transition-duration) linear;white-space:nowrap}.rt-page-header__link:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__link:focus{outline:none}.rt-page-header__link:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__link--is-active{background-color:var(--rt-nav-item-color-bg-active);color:var(--rt-nav-item-color)}.rt-page-header__link--is-open{color:var(--rt-nav-item-color-hover)}.rt-page-header__link--disabled,.rt-page-header__link:disabled,.rt-page-header__link[aria-disabled=true]{background-color:transparent;color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header__link--disabled:hover,.rt-page-header__link:disabled:hover,.rt-page-header__link[aria-disabled=true]:hover{background-color:transparent}.rt-page-header__icon{flex-shrink:0}.rt-page-header__marker{width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);flex-shrink:0;border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header__caret{display:inline-flex;flex-shrink:0;color:var(--rt-nav-item-color-caret)}.rt-page-header__burger{display:none;flex-shrink:0;align-items:center;justify-content:center;padding:var(--rt-space-2);border:0;border-radius:var(--rt-nav-burger-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;transition:color var(--rt-nav-header-transition-duration) linear}.rt-page-header__burger:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__burger:active{color:var(--rt-nav-item-color-pressed)}.rt-page-header__burger:focus{outline:none}.rt-page-header__burger:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__burger--is-open{background-color:var(--rt-nav-item-color-bg-active)}.rt-page-header__burger-icon{flex-shrink:0}@container rt-place (width <= 1380px){.rt-page-header__link .rt-page-header__icon{display:none}}@media(width<=1380px){:where(html:not(:has(.rt-container))) .rt-page-header__link .rt-page-header__icon{display:none}}@container rt-place (width <= 1080px){.rt-page-header__nav{display:none}.rt-page-header__burger{display:inline-flex}}@media(width<=1080px){:where(html:not(:has(.rt-container))) .rt-page-header__nav{display:none}:where(html:not(:has(.rt-container))) .rt-page-header__burger{display:inline-flex}}.rt-page-header__user{display:inline-flex;min-height:var(--rt-nav-item-height);align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-leading-tight);transition:background-color var(--rt-nav-header-transition-duration) linear}.rt-page-header__user:hover,.rt-page-header__user:active{background-color:var(--rt-nav-item-color-bg-active)}.rt-page-header__user:focus{outline:none}.rt-page-header__user:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__user-avatar{display:inline-flex;width:16px;height:16px;align-items:center;justify-content:center;border:var(--rt-nav-user-avatar-border-width) solid var(--rt-nav-item-color-caret);border-radius:var(--rt-nav-user-avatar-radius);color:var(--rt-color-text-muted);font-size:var(--rt-text-2xs);font-weight:var(--rt-font-weight-semibold);line-height:var(--rt-leading-none)}.rt-page-header__user-name{white-space:nowrap}.rt-page-header__user-caret{display:inline-flex;flex-shrink:0;color:var(--rt-nav-item-color-caret)}.rt-page-header__user--is-open{background-color:var(--rt-nav-item-color-bg-active)}}\n",
 				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header-submenu{--rt-nav-panel-columns-width: calc(var(--rt-nav-panel-columns) * var(--rt-nav-panel-column-width));--rt-nav-panel-gaps-width: calc((var(--rt-nav-panel-columns) - 1) * var(--rt-nav-panel-column-gap));--rt-nav-panel-padding-width: calc(var(--rt-nav-panel-padding) + var(--rt-nav-panel-padding));--rt-nav-panel-radius: var(--rt-radius-md);--rt-nav-panel-border-width: var(--rt-border-width-thin);--rt-nav-panel-item-radius: var(--rt-radius-md);--rt-nav-panel-item-transition-duration: var(--rt-duration-fast);--rt-nav-marker-radius: var(--rt-radius-full);display:flex;width:calc(var(--rt-nav-panel-columns-width) + var(--rt-nav-panel-gaps-width) + var(--rt-nav-panel-padding-width));box-sizing:border-box;align-items:flex-start;padding:var(--rt-nav-panel-padding-y) var(--rt-nav-panel-padding);border:var(--rt-nav-panel-border-width) solid var(--rt-nav-panel-color-border);border-radius:var(--rt-nav-panel-radius);background-color:var(--rt-nav-panel-color-bg);box-shadow:var(--rt-nav-panel-shadow);color:var(--rt-nav-panel-item-color);font-size:var(--rt-nav-panel-item-font-size);font-weight:var(--rt-nav-panel-item-font-weight);gap:var(--rt-nav-panel-column-gap)}.rt-page-header-submenu__column{display:flex;min-width:0;flex:0 0 var(--rt-nav-panel-column-width);flex-direction:column;gap:var(--rt-nav-panel-group-gap)}.rt-page-header-submenu__group{display:flex;flex-direction:column;align-items:flex-start;gap:var(--rt-nav-panel-item-gap)}.rt-page-header-submenu__group-title{display:inline-flex;max-width:100%;min-height:var(--rt-nav-panel-item-height);align-items:center;padding:var(--rt-nav-panel-item-padding);color:var(--rt-nav-panel-group-color);cursor:default;font-size:var(--rt-nav-panel-group-font-size);font-weight:var(--rt-nav-panel-group-font-weight);gap:var(--rt-nav-panel-group-content-gap);line-height:var(--rt-leading-none)}.rt-page-header-submenu__group-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rt-page-header-submenu__group-icon{flex-shrink:0}.rt-page-header-submenu__disabled-slot{display:inline-flex;max-width:100%;flex-direction:column;align-items:flex-start}.rt-page-header-submenu__link{display:inline-flex;max-width:100%;min-height:var(--rt-nav-panel-item-height);align-items:center;padding:var(--rt-nav-panel-item-padding);border:0;border-radius:var(--rt-nav-panel-item-radius);background-color:transparent;color:var(--rt-nav-panel-item-color);cursor:pointer;font-size:var(--rt-nav-panel-item-font-size);font-weight:var(--rt-nav-panel-item-font-weight);gap:var(--rt-nav-panel-item-content-gap);line-height:var(--rt-leading-none);text-align:left;text-decoration:none;transition:background-color var(--rt-nav-panel-item-transition-duration) linear,color var(--rt-nav-panel-item-transition-duration) linear;white-space:nowrap}.rt-page-header-submenu__link--is-active{background-color:var(--rt-nav-panel-item-color-bg-active);color:var(--rt-nav-panel-item-color-active)}.rt-page-header-submenu__link:not(.rt-page-header-submenu__link--is-active):hover,.rt-page-header-submenu__link:not(.rt-page-header-submenu__link--is-active):active{background-color:var(--rt-nav-panel-item-color-bg-hover)}.rt-page-header-submenu__link:focus{outline:none}.rt-page-header-submenu__link:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header-submenu__link--disabled,.rt-page-header-submenu__link:disabled,.rt-page-header-submenu__link[aria-disabled=true]{background-color:transparent;color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header-submenu__link--disabled:hover,.rt-page-header-submenu__link:disabled:hover,.rt-page-header-submenu__link[aria-disabled=true]:hover{background-color:transparent}.rt-page-header-submenu__label{overflow:hidden;text-overflow:ellipsis}.rt-page-header-submenu__marker{width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);flex-shrink:0;border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header-submenu__icon{flex-shrink:0}}\n",
 				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header-mobile{--rt-nav-panel-radius: var(--rt-radius-md);--rt-nav-panel-border-width: var(--rt-border-width-thin);--rt-nav-panel-item-radius: var(--rt-radius-md);--rt-nav-panel-item-transition-duration: var(--rt-duration-fast);--rt-nav-marker-radius: var(--rt-radius-full);display:flex;min-width:240px;max-width:320px;min-height:0;max-height:100%;box-sizing:border-box;flex-direction:column;padding:var(--rt-space-2);border:var(--rt-nav-panel-border-width) solid var(--rt-nav-panel-color-border);border-radius:var(--rt-nav-panel-radius);background-color:var(--rt-nav-panel-color-bg);box-shadow:var(--rt-nav-panel-shadow);gap:var(--rt-space-2xs);overflow-y:auto}.rt-page-header-mobile__link,.rt-page-header-mobile__section{position:relative;display:flex;width:100%;align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-panel-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-leading-tight);text-align:left;text-decoration:none;transition:background-color var(--rt-nav-panel-item-transition-duration) linear,color var(--rt-nav-panel-item-transition-duration) linear;white-space:nowrap}.rt-page-header-mobile__link:hover,.rt-page-header-mobile__section:hover{background-color:var(--rt-nav-panel-item-color-bg-hover)}.rt-page-header-mobile__link:focus,.rt-page-header-mobile__section:focus{outline:none}.rt-page-header-mobile__link:focus-visible,.rt-page-header-mobile__section:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header-mobile__link--child{color:var(--rt-nav-panel-item-color);font-weight:var(--rt-nav-panel-item-font-weight)}.rt-page-header-mobile__link--is-active{background-color:var(--rt-nav-panel-item-color-bg-active);color:var(--rt-nav-panel-item-color-active)}.rt-page-header-mobile__link--disabled,.rt-page-header-mobile__link:disabled,.rt-page-header-mobile__link[aria-disabled=true]{background-color:transparent;color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header-mobile__link--disabled:hover,.rt-page-header-mobile__link:disabled:hover,.rt-page-header-mobile__link[aria-disabled=true]:hover{background-color:transparent}.rt-page-header-mobile__disabled-slot{display:flex;flex-direction:column;align-items:stretch}.rt-page-header-mobile__section--is-active{background-color:var(--rt-color-bg-surface-subtle)}.rt-page-header-mobile__caret{display:inline-flex;flex-shrink:0;margin-left:auto;color:var(--rt-nav-item-color-caret);transition:transform var(--rt-nav-panel-item-transition-duration) linear}.rt-page-header-mobile__section--is-expanded .rt-page-header-mobile__caret{transform:rotate(180deg)}.rt-page-header-mobile__marker{width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);flex-shrink:0;border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header-mobile__children{display:flex;flex-direction:column;padding-left:var(--rt-space-4);gap:var(--rt-nav-panel-group-gap)}.rt-page-header-mobile__group{display:flex;flex-direction:column;gap:var(--rt-space-2xs)}.rt-page-header-mobile__group-title{display:flex;min-height:var(--rt-nav-panel-item-height);align-items:center;padding:var(--rt-nav-panel-item-padding);color:var(--rt-nav-panel-group-color);cursor:default;font-size:var(--rt-nav-panel-group-font-size);font-weight:var(--rt-nav-panel-group-font-weight);gap:var(--rt-nav-panel-group-content-gap);line-height:var(--rt-leading-none)}.rt-page-header-mobile__group-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rt-page-header-mobile__group-icon,.rt-page-header-mobile__icon{flex-shrink:0}.rt-page-header-mobile__heading{display:flex;min-height:var(--rt-nav-panel-item-height);align-items:center;padding:var(--rt-nav-panel-item-padding);color:var(--rt-nav-item-color);cursor:default;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);line-height:var(--rt-leading-tight);white-space:nowrap}.rt-page-header-mobile--more .rt-page-header-mobile__children{padding-left:0}.rt-page-header-mobile--more .rt-page-header-mobile__group-title{letter-spacing:var(--rt-letter-spacing-wide);text-transform:uppercase}}\n",
 				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header{--rt-nav-compact-height: 46px;--rt-nav-compact-circle-size: var(--rt-size-6);--rt-nav-compact-circle-overlap: calc(var(--rt-nav-compact-circle-size) / 2);--rt-nav-compact-circle-ring-width: var(--rt-border-width-thick);--rt-nav-compact-circle-radius: var(--rt-radius-full);--rt-nav-compact-circle-color-bg: var(--rt-neutral-100);--rt-nav-compact-circle-color-bg-active: var(--rt-nav-item-color-bg-active);--rt-nav-compact-color-bg: var(--rt-color-bg-surface);--rt-nav-compact-stack-depth: 16}.rt-page-header--sticky{position:sticky;z-index:var(--rt-z-sticky);top:-1px}.rt-page-header__compact{display:none;min-width:0;min-height:var(--rt-nav-compact-height);flex:1 1 auto;align-items:center;gap:var(--rt-space-4)}.rt-page-header--is-compact{min-height:var(--rt-nav-compact-height);padding:0 var(--rt-space-5);border-radius:0;background-color:var(--rt-nav-compact-color-bg)}.rt-page-header--is-compact>:not(.rt-page-header__compact){display:none}.rt-page-header--is-compact .rt-page-header__compact{display:flex}.rt-page-header__compact-stack{display:flex;flex-shrink:0;align-items:center;isolation:isolate}.rt-page-header__compact-circle{--rt-nav-compact-index: 0;position:relative;z-index:calc(var(--rt-nav-compact-stack-depth) - var(--rt-nav-compact-index));display:inline-flex;width:var(--rt-nav-compact-circle-size);height:var(--rt-nav-compact-circle-size);box-sizing:border-box;flex-shrink:0;align-items:center;justify-content:center;padding:0;border:0;border-radius:var(--rt-nav-compact-circle-radius);background-color:var(--rt-nav-compact-circle-color-bg);box-shadow:0 0 0 var(--rt-nav-compact-circle-ring-width) var(--rt-nav-compact-color-bg);color:var(--rt-nav-item-color);cursor:pointer;text-decoration:none;transition:color var(--rt-nav-header-transition-duration) linear}.rt-page-header__compact-circle+.rt-page-header__compact-circle{margin-left:calc(-1 * var(--rt-nav-compact-circle-overlap))}.rt-page-header__compact-circle:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__compact-circle:active{color:var(--rt-nav-item-color-pressed)}.rt-page-header__compact-circle:focus{outline:none}.rt-page-header__compact-circle:focus-visible{z-index:calc(var(--rt-nav-compact-stack-depth) + 1);outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__compact-circle--is-active,.rt-page-header__compact-circle--is-open{background-color:var(--rt-nav-compact-circle-color-bg-active);color:var(--rt-nav-item-color-hover)}.rt-page-header__compact-circle--disabled,.rt-page-header__compact-circle:disabled{color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header__compact-marker{position:absolute;top:0;right:0;width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header__compact-slot{display:flex;min-width:0;align-items:center}.rt-page-header__compact-slot--left{flex:0 1 auto}.rt-page-header__compact-slot--center{flex:1 1 auto;justify-content:center}.rt-page-header__compact-slot--right{flex:0 0 auto;margin-left:auto}}\n"
@@ -758,7 +758,7 @@ i0.ɵɵngDeclareClassMetadata({
 			},
 			template: "<ng-container rtBlock=\"rt-page-header\">\n    <nav rtElem=\"nav\" #nav [attr.aria-label]=\"navAriaLabel()\">\n        <ul rtElem=\"list\" role=\"list\" #list>\n            @for (section of sections(); track section.id) {\n                <li\n                    rtElem=\"item\"\n                    qa-dataid=\"header-nav-item\"\n                    [rtMod]=\"{ isOverflow: overflowIds().has(section.id) }\"\n                    [attr.data-id]=\"section.id\"\n                    [attr.aria-hidden]=\"overflowIds().has(section.id) || null\"\n                    [attr.inert]=\"overflowIds().has(section.id) || null\">\n                    @switch (section.kind) {\n                        @case (EntryKind.Panel) {\n                            <button\n                                rtElem=\"link\"\n                                type=\"button\"\n                                qa-dataid=\"header-nav-trigger\"\n                                #groupPopover=\"rtPopover\"\n                                rtPopoverTrigger=\"hover\"\n                                rtPopoverFitViewport\n                                rtPopoverOffsetY=\"14\"\n                                [rtMod]=\"{\n                                    isActive: activeSectionIds().has(section.id),\n                                    isOpen: groupPopover.isOpen(),\n                                }\"\n                                [attr.aria-haspopup]=\"true\"\n                                [attr.aria-expanded]=\"groupPopover.isOpen()\"\n                                [rtPopover]=\"submenuTpl\"\n                                (click)=\"groupPopover.open()\">\n                                @if (section.icon) {\n                                    <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                }\n                                <span rtElem=\"label\">{{ section.label }}</span>\n                                @if (section.unread) {\n                                    <span\n                                        rtElem=\"marker\"\n                                        role=\"img\"\n                                        qa-dataid=\"header-nav-marker\"\n                                        [attr.data-id]=\"section.id\"\n                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                }\n                                <span rtElem=\"caret\" aria-hidden=\"true\">\n                                    <rt-icon name=\"chevron-up-down\" size=\"xs\" />\n                                </span>\n                            </button>\n                            <ng-template #submenuTpl>\n                                <div rtBlock=\"rt-page-header-submenu\" role=\"menu\" [style.--rt-nav-panel-columns]=\"section.columnCount\">\n                                    @for (column of section.columns; track column.id) {\n                                        <div rtElem=\"column\" qa-dataid=\"header-nav-column\" [attr.data-id]=\"column.id\">\n                                            @for (group of column.groups; track group.id) {\n                                                <div rtElem=\"group\" role=\"group\" [attr.aria-label]=\"group.label || null\">\n                                                    @if (group.label) {\n                                                        <div rtElem=\"group-title\" qa-dataid=\"header-nav-group\" [attr.data-id]=\"group.id\">\n                                                            @if (group.icon) {\n                                                                <rt-icon rtElem=\"group-icon\" size=\"xs\" [name]=\"group.icon\" />\n                                                            }\n                                                            <span rtElem=\"group-label\">{{ group.label }}</span>\n                                                        </div>\n                                                    }\n                                                    @for (entry of group.items; track entry.id) {\n                                                        @if (entry.kind === EntryKind.Link) {\n                                                            <a\n                                                                rtElem=\"link\"\n                                                                role=\"menuitem\"\n                                                                qa-dataid=\"header-nav-subitem\"\n                                                                routerLinkActive=\"rt-page-header-submenu__link--is-active\"\n                                                                [attr.data-id]=\"entry.id\"\n                                                                [routerLink]=\"entry.route\"\n                                                                [routerLinkActiveOptions]=\"{ exact: entry.routerLinkActiveExact }\"\n                                                                (click)=\"groupPopover.close()\">\n                                                                <span rtElem=\"label\">{{ entry.label }}</span>\n                                                                @if (entry.unread) {\n                                                                    <span\n                                                                        rtElem=\"marker\"\n                                                                        role=\"img\"\n                                                                        qa-dataid=\"header-nav-marker\"\n                                                                        [attr.data-id]=\"entry.id\"\n                                                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                                                }\n                                                            </a>\n                                                        } @else if (entry.disabled) {\n                                                            <span\n                                                                rtElem=\"disabled-slot\"\n                                                                role=\"none\"\n                                                                [rtTooltip]=\"\n                                                                    'uiSectionInProgress' | rtKitLabel: translate() : { label: entry.label }\n                                                                \">\n                                                                <button\n                                                                    rtElem=\"link\"\n                                                                    role=\"menuitem\"\n                                                                    type=\"button\"\n                                                                    qa-dataid=\"header-nav-subitem\"\n                                                                    [rtMod]=\"{ disabled: true }\"\n                                                                    [attr.data-id]=\"entry.id\"\n                                                                    [attr.aria-disabled]=\"true\">\n                                                                    <span rtElem=\"label\">{{ entry.label }}</span>\n                                                                </button>\n                                                            </span>\n                                                        } @else {\n                                                            <button\n                                                                rtElem=\"link\"\n                                                                role=\"menuitem\"\n                                                                type=\"button\"\n                                                                qa-dataid=\"header-nav-subitem\"\n                                                                [attr.data-id]=\"entry.id\"\n                                                                (click)=\"onItemClick(entry.id)\">\n                                                                <span rtElem=\"label\">{{ entry.label }}</span>\n                                                                @if (entry.unread) {\n                                                                    <span\n                                                                        rtElem=\"marker\"\n                                                                        role=\"img\"\n                                                                        qa-dataid=\"header-nav-marker\"\n                                                                        [attr.data-id]=\"entry.id\"\n                                                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                                                }\n                                                            </button>\n                                                        }\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n                            </ng-template>\n                        }\n                        @case (EntryKind.Link) {\n                            <a\n                                rtElem=\"link\"\n                                routerLinkActive=\"rt-page-header__link--is-active\"\n                                [routerLink]=\"section.route\"\n                                [routerLinkActiveOptions]=\"{ exact: section.routerLinkActiveExact }\">\n                                @if (section.icon) {\n                                    <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                }\n                                <span rtElem=\"label\">{{ section.label }}</span>\n                                @if (section.unread) {\n                                    <span\n                                        rtElem=\"marker\"\n                                        role=\"img\"\n                                        qa-dataid=\"header-nav-marker\"\n                                        [attr.data-id]=\"section.id\"\n                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                }\n                            </a>\n                        }\n                        @default {\n                            @if (section.disabled) {\n                                <span\n                                    rtElem=\"disabled-slot\"\n                                    role=\"none\"\n                                    [rtTooltip]=\"'uiSectionInProgress' | rtKitLabel: translate() : { label: section.label }\">\n                                    <button rtElem=\"link\" type=\"button\" [rtMod]=\"{ disabled: true }\" [attr.aria-disabled]=\"true\">\n                                        @if (section.icon) {\n                                            <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                        }\n                                        <span rtElem=\"label\">{{ section.label }}</span>\n                                    </button>\n                                </span>\n                            } @else {\n                                <button rtElem=\"link\" type=\"button\" (click)=\"onItemClick(section.id)\">\n                                    @if (section.icon) {\n                                        <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                    }\n                                    <span rtElem=\"label\">{{ section.label }}</span>\n                                    @if (section.unread) {\n                                        <span\n                                            rtElem=\"marker\"\n                                            role=\"img\"\n                                            qa-dataid=\"header-nav-marker\"\n                                            [attr.data-id]=\"section.id\"\n                                            [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                    }\n                                </button>\n                            }\n                        }\n                    }\n                </li>\n            }\n            <li\n                rtElem=\"item\"\n                #moreItem\n                [rtMod]=\"{ isOverflow: !moreShown() }\"\n                [attr.aria-hidden]=\"!moreShown() || null\"\n                [attr.inert]=\"!moreShown() || null\">\n                <rt-page-header-more [sections]=\"moreSections()\" [active]=\"moreActive()\" (itemClick)=\"onItemClick($event)\" />\n            </li>\n        </ul>\n    </nav>\n\n    <button\n        rtElem=\"burger\"\n        type=\"button\"\n        qa-dataid=\"header-nav-burger\"\n        #mobileNavPopover=\"rtPopover\"\n        rtPopoverFitViewport\n        rtPopoverOffsetY=\"14\"\n        [attr.aria-label]=\"t().uiNavMenu\"\n        [rtMod]=\"{ isOpen: mobileNavPopover.isOpen() }\"\n        [attr.aria-haspopup]=\"true\"\n        [attr.aria-expanded]=\"mobileNavPopover.isOpen()\"\n        [rtPopover]=\"mobileNavTpl\">\n        <rt-icon rtElem=\"burger-icon\" name=\"bars\" size=\"md\" />\n    </button>\n\n    <!--\n        Сжатая полоса стоит в разметке всегда, как и узкая: показывает её модификатор хоста.\n        Слева стопка кругов — «ещё» поверх остальных, — дальше три слота потребителя.\n    -->\n    <div rtElem=\"compact\" qa-dataid=\"header-compact\">\n        <div rtElem=\"compact-stack\">\n            <button\n                rtElem=\"compact-circle\"\n                type=\"button\"\n                qa-dataid=\"header-compact-more\"\n                #compactNavPopover=\"rtPopover\"\n                rtPopoverFitViewport\n                rtPopoverOffsetY=\"10\"\n                [rtMod]=\"{ more: true, isOpen: compactNavPopover.isOpen() }\"\n                [attr.aria-label]=\"t().uiNavMenu\"\n                [attr.aria-haspopup]=\"true\"\n                [attr.aria-expanded]=\"compactNavPopover.isOpen()\"\n                [rtPopover]=\"mobileNavTpl\">\n                <rt-icon name=\"ellipsis-h\" size=\"sm\" />\n            </button>\n            @for (section of compactSections(); track section.id; let index = $index) {\n                @if (section.kind === EntryKind.Link) {\n                    <a\n                        rtElem=\"compact-circle\"\n                        qa-dataid=\"header-compact-section\"\n                        routerLinkActive=\"rt-page-header__compact-circle--is-active\"\n                        [style.--rt-nav-compact-index]=\"index + 1\"\n                        [attr.data-id]=\"section.id\"\n                        [attr.aria-label]=\"section.label\"\n                        [routerLink]=\"section.route\"\n                        [routerLinkActiveOptions]=\"{ exact: section.routerLinkActiveExact }\"\n                        [rtTooltip]=\"section.label\">\n                        @if (section.icon; as icon) {\n                            <rt-icon size=\"sm\" [name]=\"icon\" />\n                        }\n                        @if (section.unread) {\n                            <span rtElem=\"compact-marker\" role=\"img\" [attr.aria-label]=\"t().uiNavUnread\"></span>\n                        }\n                    </a>\n                } @else {\n                    <button\n                        rtElem=\"compact-circle\"\n                        type=\"button\"\n                        qa-dataid=\"header-compact-section\"\n                        [rtMod]=\"{ isActive: activeSectionIds().has(section.id), disabled: section.disabled }\"\n                        [style.--rt-nav-compact-index]=\"index + 1\"\n                        [disabled]=\"section.disabled\"\n                        [attr.data-id]=\"section.id\"\n                        [attr.aria-label]=\"section.label\"\n                        [rtTooltip]=\"section.label\"\n                        (click)=\"onCompactSectionClick(section)\">\n                        @if (section.icon; as icon) {\n                            <rt-icon size=\"sm\" [name]=\"icon\" />\n                        }\n                        @if (section.unread) {\n                            <span rtElem=\"compact-marker\" role=\"img\" [attr.aria-label]=\"t().uiNavUnread\"></span>\n                        }\n                    </button>\n                }\n            }\n        </div>\n        <div rtElem=\"compact-slot\" [rtMod]=\"{ left: true }\"><ng-content select=\"[rtCompactLeft]\" /></div>\n        <div rtElem=\"compact-slot\" [rtMod]=\"{ center: true }\"><ng-content select=\"[rtCompactCenter]\" /></div>\n        <div rtElem=\"compact-slot\" [rtMod]=\"{ right: true }\"><ng-content select=\"[rtCompactRight]\" /></div>\n    </div>\n\n    <ng-template #mobileNavTpl>\n        <div rtBlock=\"rt-page-header-mobile\" role=\"menu\">\n            @for (section of sections(); track section.id) {\n                @switch (section.kind) {\n                    @case (EntryKind.Panel) {\n                        <button\n                            rtElem=\"section\"\n                            type=\"button\"\n                            qa-dataid=\"header-nav-mobile-trigger\"\n                            [rtMod]=\"{\n                                isExpanded: expandedSectionIds().has(section.id),\n                                isActive: activeSectionIds().has(section.id),\n                            }\"\n                            [attr.data-id]=\"section.id\"\n                            [attr.aria-expanded]=\"expandedSectionIds().has(section.id)\"\n                            (click)=\"toggleSection(section.id)\">\n                            @if (section.icon) {\n                                <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                            }\n                            <span rtElem=\"label\">{{ section.label }}</span>\n                            @if (section.unread) {\n                                <span\n                                    rtElem=\"marker\"\n                                    role=\"img\"\n                                    qa-dataid=\"header-nav-marker\"\n                                    [attr.data-id]=\"section.id\"\n                                    [attr.aria-label]=\"t().uiNavUnread\"></span>\n                            }\n                            <span rtElem=\"caret\" aria-hidden=\"true\">\n                                <rt-icon name=\"chevron-up-down\" size=\"xs\" />\n                            </span>\n                        </button>\n                        @if (expandedSectionIds().has(section.id)) {\n                            <div rtElem=\"children\">\n                                @for (group of section.panelGroups; track group.id) {\n                                    <div rtElem=\"group\" role=\"group\" [attr.aria-label]=\"group.label || null\">\n                                        @if (group.label) {\n                                            <div rtElem=\"group-title\" qa-dataid=\"header-nav-mobile-group\" [attr.data-id]=\"group.id\">\n                                                @if (group.icon) {\n                                                    <rt-icon rtElem=\"group-icon\" size=\"xs\" [name]=\"group.icon\" />\n                                                }\n                                                <span rtElem=\"group-label\">{{ group.label }}</span>\n                                            </div>\n                                        }\n                                        @for (entry of group.items; track entry.id) {\n                                            @if (entry.kind === EntryKind.Link) {\n                                                <a\n                                                    rtElem=\"link\"\n                                                    role=\"menuitem\"\n                                                    qa-dataid=\"header-nav-mobile-item\"\n                                                    routerLinkActive=\"rt-page-header-mobile__link--is-active\"\n                                                    [rtMod]=\"{ child: true }\"\n                                                    [attr.data-id]=\"entry.id\"\n                                                    [routerLink]=\"entry.route\"\n                                                    [routerLinkActiveOptions]=\"{ exact: entry.routerLinkActiveExact }\"\n                                                    (click)=\"closeNavPanels()\">\n                                                    <span rtElem=\"label\">{{ entry.label }}</span>\n                                                    @if (entry.unread) {\n                                                        <span\n                                                            rtElem=\"marker\"\n                                                            role=\"img\"\n                                                            qa-dataid=\"header-nav-marker\"\n                                                            [attr.data-id]=\"entry.id\"\n                                                            [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                                    }\n                                                </a>\n                                            } @else if (entry.disabled) {\n                                                <span\n                                                    rtElem=\"disabled-slot\"\n                                                    role=\"none\"\n                                                    [rtTooltip]=\"'uiSectionInProgress' | rtKitLabel: translate() : { label: entry.label }\">\n                                                    <button\n                                                        rtElem=\"link\"\n                                                        type=\"button\"\n                                                        role=\"menuitem\"\n                                                        qa-dataid=\"header-nav-mobile-item\"\n                                                        [rtMod]=\"{ child: true, disabled: true }\"\n                                                        [attr.data-id]=\"entry.id\"\n                                                        [attr.aria-disabled]=\"true\">\n                                                        <span rtElem=\"label\">{{ entry.label }}</span>\n                                                    </button>\n                                                </span>\n                                            } @else {\n                                                <button\n                                                    rtElem=\"link\"\n                                                    type=\"button\"\n                                                    role=\"menuitem\"\n                                                    qa-dataid=\"header-nav-mobile-item\"\n                                                    [rtMod]=\"{ child: true }\"\n                                                    [attr.data-id]=\"entry.id\"\n                                                    (click)=\"onMobileItemClick(entry.id)\">\n                                                    <span rtElem=\"label\">{{ entry.label }}</span>\n                                                    @if (entry.unread) {\n                                                        <span\n                                                            rtElem=\"marker\"\n                                                            role=\"img\"\n                                                            qa-dataid=\"header-nav-marker\"\n                                                            [attr.data-id]=\"entry.id\"\n                                                            [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                                    }\n                                                </button>\n                                            }\n                                        }\n                                    </div>\n                                }\n                            </div>\n                        }\n                    }\n                    @case (EntryKind.Link) {\n                        <a\n                            rtElem=\"link\"\n                            role=\"menuitem\"\n                            qa-dataid=\"header-nav-mobile-item\"\n                            routerLinkActive=\"rt-page-header-mobile__link--is-active\"\n                            [attr.data-id]=\"section.id\"\n                            [routerLink]=\"section.route\"\n                            [routerLinkActiveOptions]=\"{ exact: section.routerLinkActiveExact }\"\n                            (click)=\"closeNavPanels()\">\n                            @if (section.icon) {\n                                <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                            }\n                            <span rtElem=\"label\">{{ section.label }}</span>\n                            @if (section.unread) {\n                                <span\n                                    rtElem=\"marker\"\n                                    role=\"img\"\n                                    qa-dataid=\"header-nav-marker\"\n                                    [attr.data-id]=\"section.id\"\n                                    [attr.aria-label]=\"t().uiNavUnread\"></span>\n                            }\n                        </a>\n                    }\n                    @default {\n                        @if (section.disabled) {\n                            <span\n                                rtElem=\"disabled-slot\"\n                                role=\"none\"\n                                [rtTooltip]=\"'uiSectionInProgress' | rtKitLabel: translate() : { label: section.label }\">\n                                <button\n                                    rtElem=\"link\"\n                                    type=\"button\"\n                                    role=\"menuitem\"\n                                    qa-dataid=\"header-nav-mobile-item\"\n                                    [rtMod]=\"{ disabled: true }\"\n                                    [attr.data-id]=\"section.id\"\n                                    [attr.aria-disabled]=\"true\">\n                                    @if (section.icon) {\n                                        <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                    }\n                                    <span rtElem=\"label\">{{ section.label }}</span>\n                                </button>\n                            </span>\n                        } @else {\n                            <button\n                                rtElem=\"link\"\n                                type=\"button\"\n                                role=\"menuitem\"\n                                qa-dataid=\"header-nav-mobile-item\"\n                                [attr.data-id]=\"section.id\"\n                                (click)=\"onMobileItemClick(section.id)\">\n                                @if (section.icon) {\n                                    <rt-icon rtElem=\"icon\" size=\"sm\" [name]=\"section.icon\" />\n                                }\n                                <span rtElem=\"label\">{{ section.label }}</span>\n                                @if (section.unread) {\n                                    <span\n                                        rtElem=\"marker\"\n                                        role=\"img\"\n                                        qa-dataid=\"header-nav-marker\"\n                                        [attr.data-id]=\"section.id\"\n                                        [attr.aria-label]=\"t().uiNavUnread\"></span>\n                                }\n                            </button>\n                        }\n                    }\n                }\n            }\n        </div>\n    </ng-template>\n\n    <ng-content select=\"[rtHeaderBell]\" />\n\n    @if (user(); as u) {\n        @if (userMenu(); as menuTpl) {\n            <!--\n                Меню профиля открывается наведением, как и разделы: весь верхний\n                ряд ведёт себя одинаково. Нажатие остаётся запасным путём для\n                касания, а переход курсора на список языков панель переживает —\n                вложенный оверлей за уход наружу не считается.\n            -->\n            <button\n                rtElem=\"user\"\n                type=\"button\"\n                qa-dataid=\"header-user-menu\"\n                #userPopover=\"rtPopover\"\n                rtPopoverTrigger=\"hover\"\n                rtPopoverAlign=\"end\"\n                rtPopoverOffsetY=\"14\"\n                [rtMod]=\"{ isOpen: userPopover.isOpen() }\"\n                [attr.aria-haspopup]=\"true\"\n                [attr.aria-expanded]=\"userPopover.isOpen()\"\n                [rtPopover]=\"menuTpl\"\n                (click)=\"userPopover.open()\">\n                <span rtElem=\"user-avatar\" aria-hidden=\"true\">{{ userAvatar() }}</span>\n                <span rtElem=\"user-name\" qa-dataid=\"header-user-name\">{{ u.name }}</span>\n                <span rtElem=\"user-caret\" aria-hidden=\"true\">\n                    <rt-icon name=\"chevron-up-down\" size=\"xs\" />\n                </span>\n            </button>\n        } @else {\n            <button rtElem=\"user\" type=\"button\" (click)=\"onUserClick()\">\n                <span rtElem=\"user-avatar\" aria-hidden=\"true\">{{ userAvatar() }}</span>\n                <span rtElem=\"user-name\" qa-dataid=\"header-user-name\">{{ u.name }}</span>\n                <span rtElem=\"user-caret\" aria-hidden=\"true\">\n                    <rt-icon name=\"chevron-up-down\" size=\"xs\" />\n                </span>\n            </button>\n        }\n    }\n</ng-container>\n",
 			styles: [
-				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header{--rt-nav-header-radius: var(--rt-radius-md);--rt-nav-header-transition-duration: var(--rt-duration-fast);--rt-nav-item-radius: var(--rt-radius-md);--rt-nav-item-border-width: var(--rt-border-width-thin);--rt-nav-burger-radius: var(--rt-radius-ms);--rt-nav-marker-radius: var(--rt-radius-full);--rt-nav-user-avatar-radius: var(--rt-radius-full);--rt-nav-user-avatar-border-width: var(--rt-border-width-thin);display:flex;width:auto;min-height:48px;box-sizing:border-box;align-items:center;justify-content:space-between;padding:var(--rt-nav-header-padding);border-radius:var(--rt-nav-header-radius);background-color:var(--rt-page-header-bg, var(--rt-nav-header-color-bg));color:var(--rt-nav-item-color);gap:var(--rt-space-2)}.rt-page-header__nav{min-width:0;flex:1 1 0}.rt-page-header__list{position:relative;display:flex;flex-flow:row wrap;align-items:center;padding:0;margin:0;gap:var(--rt-nav-item-gap);list-style:none}.rt-page-header__item{display:inline-flex;flex-shrink:0;align-items:center;border:var(--rt-nav-item-border-width) solid var(--rt-nav-item-color-border);border-radius:var(--rt-nav-item-radius);background-color:var(--rt-nav-item-color-bg)}.rt-page-header__item--is-overflow{position:absolute;top:0;left:0;pointer-events:none;visibility:hidden}.rt-page-header__disabled-slot{display:inline-flex;flex-direction:column;align-items:stretch}.rt-page-header__link{position:relative;display:inline-flex;min-height:var(--rt-nav-item-height);align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-nav-item-line-height);text-decoration:none;transition:color var(--rt-nav-header-transition-duration) linear;white-space:nowrap}.rt-page-header__link:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__link:focus{outline:none}.rt-page-header__link:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__link--is-active{background-color:var(--rt-nav-item-color-bg-active);color:var(--rt-nav-item-color)}.rt-page-header__link--is-open{color:var(--rt-nav-item-color-hover)}.rt-page-header__link--disabled,.rt-page-header__link:disabled,.rt-page-header__link[aria-disabled=true]{background-color:transparent;color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header__link--disabled:hover,.rt-page-header__link:disabled:hover,.rt-page-header__link[aria-disabled=true]:hover{background-color:transparent}.rt-page-header__icon{flex-shrink:0}.rt-page-header__marker{width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);flex-shrink:0;border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header__caret{display:inline-flex;flex-shrink:0;color:var(--rt-nav-item-color-caret)}.rt-page-header__burger{display:none;flex-shrink:0;align-items:center;justify-content:center;padding:var(--rt-space-2);border:0;border-radius:var(--rt-nav-burger-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;transition:color var(--rt-nav-header-transition-duration) linear}.rt-page-header__burger:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__burger:active{color:var(--rt-nav-item-color-pressed)}.rt-page-header__burger:focus{outline:none}.rt-page-header__burger:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__burger--is-open{background-color:var(--rt-nav-item-color-bg-active)}.rt-page-header__burger-icon{flex-shrink:0}@container rt-place (width <= 1380px){.rt-page-header__link .rt-page-header__icon{display:none}}@container rt-place (width <= 1080px){.rt-page-header__nav{display:none}.rt-page-header__burger{display:inline-flex}}.rt-page-header__user{display:inline-flex;min-height:var(--rt-nav-item-height);align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-leading-tight);transition:background-color var(--rt-nav-header-transition-duration) linear}.rt-page-header__user:hover,.rt-page-header__user:active{background-color:var(--rt-nav-item-color-bg-active)}.rt-page-header__user:focus{outline:none}.rt-page-header__user:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__user-avatar{display:inline-flex;width:16px;height:16px;align-items:center;justify-content:center;border:var(--rt-nav-user-avatar-border-width) solid var(--rt-nav-item-color-caret);border-radius:var(--rt-nav-user-avatar-radius);color:var(--rt-color-text-muted);font-size:var(--rt-text-2xs);font-weight:var(--rt-font-weight-semibold);line-height:var(--rt-leading-none)}.rt-page-header__user-name{white-space:nowrap}.rt-page-header__user-caret{display:inline-flex;flex-shrink:0;color:var(--rt-nav-item-color-caret)}.rt-page-header__user--is-open{background-color:var(--rt-nav-item-color-bg-active)}}\n",
+				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header{--rt-nav-header-radius: var(--rt-radius-md);--rt-nav-header-transition-duration: var(--rt-duration-fast);--rt-nav-item-radius: var(--rt-radius-md);--rt-nav-item-border-width: var(--rt-border-width-thin);--rt-nav-burger-radius: var(--rt-radius-ms);--rt-nav-marker-radius: var(--rt-radius-full);--rt-nav-user-avatar-radius: var(--rt-radius-full);--rt-nav-user-avatar-border-width: var(--rt-border-width-thin);display:flex;width:auto;min-height:48px;box-sizing:border-box;align-items:center;justify-content:space-between;padding:var(--rt-nav-header-padding);border-radius:var(--rt-nav-header-radius);background-color:var(--rt-page-header-bg, var(--rt-nav-header-color-bg));color:var(--rt-nav-item-color);gap:var(--rt-space-2)}.rt-page-header__nav{min-width:0;flex:1 1 0}.rt-page-header__list{position:relative;display:flex;flex-flow:row wrap;align-items:center;padding:0;margin:0;gap:var(--rt-nav-item-gap);list-style:none}.rt-page-header__item{display:inline-flex;flex-shrink:0;align-items:center;border:var(--rt-nav-item-border-width) solid var(--rt-nav-item-color-border);border-radius:var(--rt-nav-item-radius);background-color:var(--rt-nav-item-color-bg)}.rt-page-header__item--is-overflow{position:absolute;top:0;left:0;pointer-events:none;visibility:hidden}.rt-page-header__disabled-slot{display:inline-flex;flex-direction:column;align-items:stretch}.rt-page-header__link{position:relative;display:inline-flex;min-height:var(--rt-nav-item-height);align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-nav-item-line-height);text-decoration:none;transition:color var(--rt-nav-header-transition-duration) linear;white-space:nowrap}.rt-page-header__link:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__link:focus{outline:none}.rt-page-header__link:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__link--is-active{background-color:var(--rt-nav-item-color-bg-active);color:var(--rt-nav-item-color)}.rt-page-header__link--is-open{color:var(--rt-nav-item-color-hover)}.rt-page-header__link--disabled,.rt-page-header__link:disabled,.rt-page-header__link[aria-disabled=true]{background-color:transparent;color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header__link--disabled:hover,.rt-page-header__link:disabled:hover,.rt-page-header__link[aria-disabled=true]:hover{background-color:transparent}.rt-page-header__icon{flex-shrink:0}.rt-page-header__marker{width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);flex-shrink:0;border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header__caret{display:inline-flex;flex-shrink:0;color:var(--rt-nav-item-color-caret)}.rt-page-header__burger{display:none;flex-shrink:0;align-items:center;justify-content:center;padding:var(--rt-space-2);border:0;border-radius:var(--rt-nav-burger-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;transition:color var(--rt-nav-header-transition-duration) linear}.rt-page-header__burger:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__burger:active{color:var(--rt-nav-item-color-pressed)}.rt-page-header__burger:focus{outline:none}.rt-page-header__burger:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__burger--is-open{background-color:var(--rt-nav-item-color-bg-active)}.rt-page-header__burger-icon{flex-shrink:0}@container rt-place (width <= 1380px){.rt-page-header__link .rt-page-header__icon{display:none}}@media(width<=1380px){:where(html:not(:has(.rt-container))) .rt-page-header__link .rt-page-header__icon{display:none}}@container rt-place (width <= 1080px){.rt-page-header__nav{display:none}.rt-page-header__burger{display:inline-flex}}@media(width<=1080px){:where(html:not(:has(.rt-container))) .rt-page-header__nav{display:none}:where(html:not(:has(.rt-container))) .rt-page-header__burger{display:inline-flex}}.rt-page-header__user{display:inline-flex;min-height:var(--rt-nav-item-height);align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-leading-tight);transition:background-color var(--rt-nav-header-transition-duration) linear}.rt-page-header__user:hover,.rt-page-header__user:active{background-color:var(--rt-nav-item-color-bg-active)}.rt-page-header__user:focus{outline:none}.rt-page-header__user:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__user-avatar{display:inline-flex;width:16px;height:16px;align-items:center;justify-content:center;border:var(--rt-nav-user-avatar-border-width) solid var(--rt-nav-item-color-caret);border-radius:var(--rt-nav-user-avatar-radius);color:var(--rt-color-text-muted);font-size:var(--rt-text-2xs);font-weight:var(--rt-font-weight-semibold);line-height:var(--rt-leading-none)}.rt-page-header__user-name{white-space:nowrap}.rt-page-header__user-caret{display:inline-flex;flex-shrink:0;color:var(--rt-nav-item-color-caret)}.rt-page-header__user--is-open{background-color:var(--rt-nav-item-color-bg-active)}}\n",
 				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header-submenu{--rt-nav-panel-columns-width: calc(var(--rt-nav-panel-columns) * var(--rt-nav-panel-column-width));--rt-nav-panel-gaps-width: calc((var(--rt-nav-panel-columns) - 1) * var(--rt-nav-panel-column-gap));--rt-nav-panel-padding-width: calc(var(--rt-nav-panel-padding) + var(--rt-nav-panel-padding));--rt-nav-panel-radius: var(--rt-radius-md);--rt-nav-panel-border-width: var(--rt-border-width-thin);--rt-nav-panel-item-radius: var(--rt-radius-md);--rt-nav-panel-item-transition-duration: var(--rt-duration-fast);--rt-nav-marker-radius: var(--rt-radius-full);display:flex;width:calc(var(--rt-nav-panel-columns-width) + var(--rt-nav-panel-gaps-width) + var(--rt-nav-panel-padding-width));box-sizing:border-box;align-items:flex-start;padding:var(--rt-nav-panel-padding-y) var(--rt-nav-panel-padding);border:var(--rt-nav-panel-border-width) solid var(--rt-nav-panel-color-border);border-radius:var(--rt-nav-panel-radius);background-color:var(--rt-nav-panel-color-bg);box-shadow:var(--rt-nav-panel-shadow);color:var(--rt-nav-panel-item-color);font-size:var(--rt-nav-panel-item-font-size);font-weight:var(--rt-nav-panel-item-font-weight);gap:var(--rt-nav-panel-column-gap)}.rt-page-header-submenu__column{display:flex;min-width:0;flex:0 0 var(--rt-nav-panel-column-width);flex-direction:column;gap:var(--rt-nav-panel-group-gap)}.rt-page-header-submenu__group{display:flex;flex-direction:column;align-items:flex-start;gap:var(--rt-nav-panel-item-gap)}.rt-page-header-submenu__group-title{display:inline-flex;max-width:100%;min-height:var(--rt-nav-panel-item-height);align-items:center;padding:var(--rt-nav-panel-item-padding);color:var(--rt-nav-panel-group-color);cursor:default;font-size:var(--rt-nav-panel-group-font-size);font-weight:var(--rt-nav-panel-group-font-weight);gap:var(--rt-nav-panel-group-content-gap);line-height:var(--rt-leading-none)}.rt-page-header-submenu__group-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rt-page-header-submenu__group-icon{flex-shrink:0}.rt-page-header-submenu__disabled-slot{display:inline-flex;max-width:100%;flex-direction:column;align-items:flex-start}.rt-page-header-submenu__link{display:inline-flex;max-width:100%;min-height:var(--rt-nav-panel-item-height);align-items:center;padding:var(--rt-nav-panel-item-padding);border:0;border-radius:var(--rt-nav-panel-item-radius);background-color:transparent;color:var(--rt-nav-panel-item-color);cursor:pointer;font-size:var(--rt-nav-panel-item-font-size);font-weight:var(--rt-nav-panel-item-font-weight);gap:var(--rt-nav-panel-item-content-gap);line-height:var(--rt-leading-none);text-align:left;text-decoration:none;transition:background-color var(--rt-nav-panel-item-transition-duration) linear,color var(--rt-nav-panel-item-transition-duration) linear;white-space:nowrap}.rt-page-header-submenu__link--is-active{background-color:var(--rt-nav-panel-item-color-bg-active);color:var(--rt-nav-panel-item-color-active)}.rt-page-header-submenu__link:not(.rt-page-header-submenu__link--is-active):hover,.rt-page-header-submenu__link:not(.rt-page-header-submenu__link--is-active):active{background-color:var(--rt-nav-panel-item-color-bg-hover)}.rt-page-header-submenu__link:focus{outline:none}.rt-page-header-submenu__link:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header-submenu__link--disabled,.rt-page-header-submenu__link:disabled,.rt-page-header-submenu__link[aria-disabled=true]{background-color:transparent;color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header-submenu__link--disabled:hover,.rt-page-header-submenu__link:disabled:hover,.rt-page-header-submenu__link[aria-disabled=true]:hover{background-color:transparent}.rt-page-header-submenu__label{overflow:hidden;text-overflow:ellipsis}.rt-page-header-submenu__marker{width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);flex-shrink:0;border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header-submenu__icon{flex-shrink:0}}\n",
 				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header-mobile{--rt-nav-panel-radius: var(--rt-radius-md);--rt-nav-panel-border-width: var(--rt-border-width-thin);--rt-nav-panel-item-radius: var(--rt-radius-md);--rt-nav-panel-item-transition-duration: var(--rt-duration-fast);--rt-nav-marker-radius: var(--rt-radius-full);display:flex;min-width:240px;max-width:320px;min-height:0;max-height:100%;box-sizing:border-box;flex-direction:column;padding:var(--rt-space-2);border:var(--rt-nav-panel-border-width) solid var(--rt-nav-panel-color-border);border-radius:var(--rt-nav-panel-radius);background-color:var(--rt-nav-panel-color-bg);box-shadow:var(--rt-nav-panel-shadow);gap:var(--rt-space-2xs);overflow-y:auto}.rt-page-header-mobile__link,.rt-page-header-mobile__section{position:relative;display:flex;width:100%;align-items:center;padding:var(--rt-nav-item-padding);border:0;border-radius:var(--rt-nav-panel-item-radius);background-color:transparent;color:var(--rt-nav-item-color);cursor:pointer;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);gap:var(--rt-nav-item-content-gap);line-height:var(--rt-leading-tight);text-align:left;text-decoration:none;transition:background-color var(--rt-nav-panel-item-transition-duration) linear,color var(--rt-nav-panel-item-transition-duration) linear;white-space:nowrap}.rt-page-header-mobile__link:hover,.rt-page-header-mobile__section:hover{background-color:var(--rt-nav-panel-item-color-bg-hover)}.rt-page-header-mobile__link:focus,.rt-page-header-mobile__section:focus{outline:none}.rt-page-header-mobile__link:focus-visible,.rt-page-header-mobile__section:focus-visible{outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header-mobile__link--child{color:var(--rt-nav-panel-item-color);font-weight:var(--rt-nav-panel-item-font-weight)}.rt-page-header-mobile__link--is-active{background-color:var(--rt-nav-panel-item-color-bg-active);color:var(--rt-nav-panel-item-color-active)}.rt-page-header-mobile__link--disabled,.rt-page-header-mobile__link:disabled,.rt-page-header-mobile__link[aria-disabled=true]{background-color:transparent;color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header-mobile__link--disabled:hover,.rt-page-header-mobile__link:disabled:hover,.rt-page-header-mobile__link[aria-disabled=true]:hover{background-color:transparent}.rt-page-header-mobile__disabled-slot{display:flex;flex-direction:column;align-items:stretch}.rt-page-header-mobile__section--is-active{background-color:var(--rt-color-bg-surface-subtle)}.rt-page-header-mobile__caret{display:inline-flex;flex-shrink:0;margin-left:auto;color:var(--rt-nav-item-color-caret);transition:transform var(--rt-nav-panel-item-transition-duration) linear}.rt-page-header-mobile__section--is-expanded .rt-page-header-mobile__caret{transform:rotate(180deg)}.rt-page-header-mobile__marker{width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);flex-shrink:0;border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header-mobile__children{display:flex;flex-direction:column;padding-left:var(--rt-space-4);gap:var(--rt-nav-panel-group-gap)}.rt-page-header-mobile__group{display:flex;flex-direction:column;gap:var(--rt-space-2xs)}.rt-page-header-mobile__group-title{display:flex;min-height:var(--rt-nav-panel-item-height);align-items:center;padding:var(--rt-nav-panel-item-padding);color:var(--rt-nav-panel-group-color);cursor:default;font-size:var(--rt-nav-panel-group-font-size);font-weight:var(--rt-nav-panel-group-font-weight);gap:var(--rt-nav-panel-group-content-gap);line-height:var(--rt-leading-none)}.rt-page-header-mobile__group-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rt-page-header-mobile__group-icon,.rt-page-header-mobile__icon{flex-shrink:0}.rt-page-header-mobile__heading{display:flex;min-height:var(--rt-nav-panel-item-height);align-items:center;padding:var(--rt-nav-panel-item-padding);color:var(--rt-nav-item-color);cursor:default;font-size:var(--rt-nav-item-font-size);font-weight:var(--rt-nav-item-font-weight);line-height:var(--rt-leading-tight);white-space:nowrap}.rt-page-header-mobile--more .rt-page-header-mobile__children{padding-left:0}.rt-page-header-mobile--more .rt-page-header-mobile__group-title{letter-spacing:var(--rt-letter-spacing-wide);text-transform:uppercase}}\n",
 				"@charset \"UTF-8\";@layer rt-kit.components{.rt-page-header{--rt-nav-compact-height: 46px;--rt-nav-compact-circle-size: var(--rt-size-6);--rt-nav-compact-circle-overlap: calc(var(--rt-nav-compact-circle-size) / 2);--rt-nav-compact-circle-ring-width: var(--rt-border-width-thick);--rt-nav-compact-circle-radius: var(--rt-radius-full);--rt-nav-compact-circle-color-bg: var(--rt-neutral-100);--rt-nav-compact-circle-color-bg-active: var(--rt-nav-item-color-bg-active);--rt-nav-compact-color-bg: var(--rt-color-bg-surface);--rt-nav-compact-stack-depth: 16}.rt-page-header--sticky{position:sticky;z-index:var(--rt-z-sticky);top:-1px}.rt-page-header__compact{display:none;min-width:0;min-height:var(--rt-nav-compact-height);flex:1 1 auto;align-items:center;gap:var(--rt-space-4)}.rt-page-header--is-compact{min-height:var(--rt-nav-compact-height);padding:0 var(--rt-space-5);border-radius:0;background-color:var(--rt-nav-compact-color-bg)}.rt-page-header--is-compact>:not(.rt-page-header__compact){display:none}.rt-page-header--is-compact .rt-page-header__compact{display:flex}.rt-page-header__compact-stack{display:flex;flex-shrink:0;align-items:center;isolation:isolate}.rt-page-header__compact-circle{--rt-nav-compact-index: 0;position:relative;z-index:calc(var(--rt-nav-compact-stack-depth) - var(--rt-nav-compact-index));display:inline-flex;width:var(--rt-nav-compact-circle-size);height:var(--rt-nav-compact-circle-size);box-sizing:border-box;flex-shrink:0;align-items:center;justify-content:center;padding:0;border:0;border-radius:var(--rt-nav-compact-circle-radius);background-color:var(--rt-nav-compact-circle-color-bg);box-shadow:0 0 0 var(--rt-nav-compact-circle-ring-width) var(--rt-nav-compact-color-bg);color:var(--rt-nav-item-color);cursor:pointer;text-decoration:none;transition:color var(--rt-nav-header-transition-duration) linear}.rt-page-header__compact-circle+.rt-page-header__compact-circle{margin-left:calc(-1 * var(--rt-nav-compact-circle-overlap))}.rt-page-header__compact-circle:hover{color:var(--rt-nav-item-color-hover)}.rt-page-header__compact-circle:active{color:var(--rt-nav-item-color-pressed)}.rt-page-header__compact-circle:focus{outline:none}.rt-page-header__compact-circle:focus-visible{z-index:calc(var(--rt-nav-compact-stack-depth) + 1);outline:2px dashed var(--rt-nav-color-focus);outline-offset:2px}.rt-page-header__compact-circle--is-active,.rt-page-header__compact-circle--is-open{background-color:var(--rt-nav-compact-circle-color-bg-active);color:var(--rt-nav-item-color-hover)}.rt-page-header__compact-circle--disabled,.rt-page-header__compact-circle:disabled{color:var(--rt-nav-color-disabled);cursor:not-allowed}.rt-page-header__compact-marker{position:absolute;top:0;right:0;width:var(--rt-nav-marker-size);height:var(--rt-nav-marker-size);border-radius:var(--rt-nav-marker-radius);background-color:var(--rt-nav-marker-color)}.rt-page-header__compact-slot{display:flex;min-width:0;align-items:center}.rt-page-header__compact-slot--left{flex:0 1 auto}.rt-page-header__compact-slot--center{flex:1 1 auto;justify-content:center}.rt-page-header__compact-slot--right{flex:0 0 auto;margin-left:auto}}\n"

package/fesm2022/rt-tools-ui-kit-v2-pdf-viewer.mjs

@@ -509,7 +509,7 @@ var RtPdfViewerComponent = class RtPdfViewerComponent {
 			],
 			ngImport: i0,
 			template: "<ng-container rtBlock=\"rt-pdf-viewer\">\n    <!-- Ловушка держит Tab внутри; фокус ставит сам компонент, поэтому авто-захвата здесь нет -->\n    <div rtElem=\"surface\" cdkTrapFocus>\n        <!-- Полоса видна сразу, ещё до загрузки документа: человек видит, что открыл, и может закрыть -->\n        <header rtElem=\"bar\">\n            <div rtElem=\"title\">\n                <rt-icon rtElem=\"file-icon\" name=\"attach-pdf\" size=\"md\" />\n                <span rtElem=\"file-name\" qa-dataid=\"pdf-viewer-file-name\" [attr.title]=\"fileName\">{{ fileName }}</span>\n            </div>\n\n            <div rtElem=\"actions\">\n                <rt-icon-button\n                    qa-dataid=\"pdf-viewer-print\"\n                    icon=\"print\"\n                    variant=\"ghost\"\n                    [ariaLabel]=\"t().pdfViewerPrint\"\n                    [tooltip]=\"t().pdfViewerPrint\"\n                    [disabled]=\"status() !== 'ready'\"\n                    [loading]=\"printing()\"\n                    (clicked)=\"print()\" />\n                <rt-icon-button\n                    qa-dataid=\"pdf-viewer-download\"\n                    icon=\"ico-download\"\n                    variant=\"ghost\"\n                    [ariaLabel]=\"t().pdfViewerDownload\"\n                    [tooltip]=\"t().pdfViewerDownload\"\n                    (clicked)=\"download()\" />\n                <rt-icon-button\n                    qa-dataid=\"pdf-viewer-close\"\n                    icon=\"close\"\n                    variant=\"ghost\"\n                    [ariaLabel]=\"t().pdfViewerClose\"\n                    [tooltip]=\"t().pdfViewerClose\"\n                    (clicked)=\"close()\" />\n            </div>\n        </header>\n\n        <div rtElem=\"scroller\" qa-dataid=\"pdf-viewer-pages\" #scroller (scroll)=\"onScroll()\">\n            <!-- Столбец стоит и до загрузки: по его ширине выбирается начальный масштаб -->\n            <div rtElem=\"column\" #column>\n                @if (status() === 'ready') {\n                    @for (box of boxes(); track box.index) {\n                        <div\n                            rtElem=\"page\"\n                            qa-dataid=\"pdf-viewer-page\"\n                            #page\n                            [attr.data-page-index]=\"box.index\"\n                            [style.width.px]=\"box.width\"\n                            [style.height.px]=\"box.height\">\n                            <canvas rtElem=\"canvas\" #canvas></canvas>\n                        </div>\n                    }\n                }\n            </div>\n        </div>\n\n        @switch (status()) {\n            @case ('loading') {\n                <div rtElem=\"center\">\n                    <rt-spinner qa-dataid=\"pdf-viewer-spinner\" color=\"on-primary\" [diameter]=\"40\" />\n                </div>\n            }\n\n            @case ('error') {\n                <div rtElem=\"center\">\n                    <rt-empty-state\n                        rtElem=\"error\"\n                        qa-dataid=\"pdf-viewer-error\"\n                        [title]=\"t().pdfViewerErrorTitle\"\n                        [description]=\"t().pdfViewerErrorText\">\n                        <button\n                            rtButton\n                            rtElem=\"error-download\"\n                            qa-dataid=\"pdf-viewer-error-download\"\n                            type=\"button\"\n                            icon=\"ico-download\"\n                            [label]=\"t().pdfViewerDownload\"\n                            [attr.aria-label]=\"t().pdfViewerDownload\"\n                            (click)=\"download()\"></button>\n                    </rt-empty-state>\n                </div>\n            }\n\n            @case ('ready') {\n                <div rtElem=\"toolbar\" qa-dataid=\"pdf-viewer-toolbar\">\n                    <span rtElem=\"counter\" qa-dataid=\"pdf-viewer-counter\" role=\"status\" aria-live=\"off\" [attr.aria-label]=\"pageOfLabel()\">\n                        {{ counter() }}\n                    </span>\n                    <span rtElem=\"divider\" aria-hidden=\"true\"></span>\n                    <rt-icon-button\n                        qa-dataid=\"pdf-viewer-zoom-out\"\n                        icon=\"minus\"\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        [ariaLabel]=\"t().pdfViewerZoomOut\"\n                        [disabled]=\"!canZoomOut()\"\n                        (clicked)=\"zoomOut()\" />\n                    <span rtElem=\"zoom\" qa-dataid=\"pdf-viewer-zoom\">{{ zoomLabel() }}</span>\n                    <rt-icon-button\n                        qa-dataid=\"pdf-viewer-zoom-in\"\n                        icon=\"ico-plus\"\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        [ariaLabel]=\"t().pdfViewerZoomIn\"\n                        [disabled]=\"!canZoomIn()\"\n                        (clicked)=\"zoomIn()\" />\n                    <span rtElem=\"fit-divider\" aria-hidden=\"true\"></span>\n                    <button\n                        rtButton\n                        rtElem=\"fit\"\n                        qa-dataid=\"pdf-viewer-fit\"\n                        type=\"button\"\n                        appearance=\"text\"\n                        size=\"sm\"\n                        [label]=\"t().pdfViewerFitWidth\"\n                        [attr.aria-label]=\"t().pdfViewerFitWidth\"\n                        [pressed]=\"isFit()\"\n                        (click)=\"fitWidth()\"></button>\n                </div>\n            }\n        }\n    </div>\n</ng-container>\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-pdf-viewer{--rt-pdf-viewer-bg: var(--rt-neutral-900);--rt-pdf-viewer-bar-bg: color-mix(in srgb, var(--rt-neutral-900) 35%, var(--rt-neutral-950));--rt-pdf-viewer-bar-height: var(--rt-control-height-2xl);--rt-pdf-viewer-text-color: var(--rt-neutral-0);--rt-pdf-viewer-muted-color: var(--rt-neutral-200);--rt-pdf-viewer-page-bg: var(--rt-neutral-0);--rt-pdf-viewer-page-shadow: var(--rt-shadow-md);--rt-pdf-viewer-page-gap: var(--rt-space-4);--rt-pdf-viewer-toolbar-bg: var(--rt-neutral-800);--rt-pdf-viewer-toolbar-radius: var(--rt-radius-full);--rt-pdf-viewer-divider-width: var(--rt-border-width-thin);--rt-pdf-viewer-divider-color: color-mix(in srgb, var(--rt-neutral-0) 20%, transparent);--rt-pdf-viewer-control-radius: var(--rt-radius-md);--rt-pdf-viewer-control-bg: color-mix(in srgb, var(--rt-neutral-0) 10%, transparent);--rt-pdf-viewer-control-bg-hover: color-mix(in srgb, var(--rt-neutral-0) 24%, transparent);display:block;width:100vw;height:100vh;height:100dvh;background:var(--rt-pdf-viewer-bg);color:var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer__surface{position:absolute;display:flex;flex-direction:column;inset:0}.rt-pdf-viewer__bar{display:flex;height:var(--rt-pdf-viewer-bar-height);flex:none;align-items:center;justify-content:space-between;padding:0 var(--rt-space-4);background:var(--rt-pdf-viewer-bar-bg);gap:var(--rt-space-4)}.rt-pdf-viewer__title{display:flex;min-width:0;align-items:center;gap:var(--rt-space-2)}.rt-pdf-viewer__file-icon{flex:none;color:var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer__file-name{overflow:hidden;min-width:0;font-size:var(--rt-text-sm);text-overflow:ellipsis;white-space:nowrap}.rt-pdf-viewer__actions{display:flex;flex:none;align-items:center;gap:var(--rt-space-2)}.rt-pdf-viewer__actions rt-icon-button{--rt-icon-button-color: var(--rt-pdf-viewer-text-color);--rt-icon-button-color-bg-hover: var(--rt-pdf-viewer-control-bg-hover);border-radius:var(--rt-pdf-viewer-control-radius);background:var(--rt-pdf-viewer-control-bg)}.rt-pdf-viewer__scroller{position:relative;overflow:auto;flex:1 1 auto;overscroll-behavior:contain;scrollbar-gutter:stable}.rt-pdf-viewer__column{display:flex;width:max-content;min-width:100%;box-sizing:border-box;flex-direction:column;align-items:center;padding:var(--rt-space-4) var(--rt-space-4) var(--rt-space-24);gap:var(--rt-pdf-viewer-page-gap)}.rt-pdf-viewer__page{flex:none;background:var(--rt-pdf-viewer-page-bg);box-shadow:var(--rt-pdf-viewer-page-shadow)}.rt-pdf-viewer__canvas{display:block;width:100%;height:100%}.rt-pdf-viewer__center{position:absolute;display:flex;align-items:center;justify-content:center;padding:var(--rt-space-4);inset:var(--rt-pdf-viewer-bar-height) 0 0}.rt-pdf-viewer .rt-pdf-viewer__error{--rt-empty-state-title-color: var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer .rt-pdf-viewer__error .rt-empty-state__description{color:var(--rt-pdf-viewer-muted-color)}.rt-pdf-viewer .rt-pdf-viewer__error-download{--rt-btn-bg: var(--rt-pdf-viewer-page-bg);--rt-btn-bg-hover: var(--rt-neutral-100);--rt-btn-bg-active: var(--rt-neutral-200);--rt-btn-color: var(--rt-neutral-900)}.rt-pdf-viewer__toolbar{position:absolute;bottom:var(--rt-space-6);left:50%;display:flex;align-items:center;padding:var(--rt-space-1) var(--rt-space-2);border-radius:var(--rt-pdf-viewer-toolbar-radius);background:var(--rt-pdf-viewer-toolbar-bg);gap:var(--rt-space-1);transform:translate(-50%);white-space:nowrap}.rt-pdf-viewer__toolbar rt-icon-button{--rt-icon-button-color: var(--rt-pdf-viewer-text-color);--rt-icon-button-color-bg-hover: var(--rt-pdf-viewer-control-bg-hover)}.rt-pdf-viewer__counter,.rt-pdf-viewer__zoom{padding:0 var(--rt-space-2);font-size:var(--rt-text-sm);font-variant-numeric:tabular-nums}.rt-pdf-viewer__zoom{min-width:var(--rt-size-12);text-align:center}.rt-pdf-viewer__divider,.rt-pdf-viewer__fit-divider{width:var(--rt-pdf-viewer-divider-width);height:var(--rt-size-5);margin:0 var(--rt-space-1);background:var(--rt-pdf-viewer-divider-color)}.rt-pdf-viewer .rt-pdf-viewer__fit{--rt-btn-color: var(--rt-pdf-viewer-text-color);--rt-btn-bg-hover: var(--rt-pdf-viewer-control-bg-hover)}@container rt-place (width <= 480px){.rt-pdf-viewer{--rt-pdf-viewer-bar-height: var(--rt-control-height-xl)}.rt-pdf-viewer__fit,.rt-pdf-viewer__fit-divider{display:none}}.rt-pdf-viewer-print{display:none}.rt-pdf-viewer-print__page{display:block;width:100%;break-after:page;break-inside:avoid}@media print{.rt-pdf-viewer-printing body>:not(.rt-pdf-viewer-print){display:none}.rt-pdf-viewer-printing .rt-pdf-viewer-print{display:block}}}\n"],
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-pdf-viewer{--rt-pdf-viewer-bg: var(--rt-neutral-900);--rt-pdf-viewer-bar-bg: color-mix(in srgb, var(--rt-neutral-900) 35%, var(--rt-neutral-950));--rt-pdf-viewer-bar-height: var(--rt-control-height-2xl);--rt-pdf-viewer-text-color: var(--rt-neutral-0);--rt-pdf-viewer-muted-color: var(--rt-neutral-200);--rt-pdf-viewer-page-bg: var(--rt-neutral-0);--rt-pdf-viewer-page-shadow: var(--rt-shadow-md);--rt-pdf-viewer-page-gap: var(--rt-space-4);--rt-pdf-viewer-toolbar-bg: var(--rt-neutral-800);--rt-pdf-viewer-toolbar-radius: var(--rt-radius-full);--rt-pdf-viewer-divider-width: var(--rt-border-width-thin);--rt-pdf-viewer-divider-color: color-mix(in srgb, var(--rt-neutral-0) 20%, transparent);--rt-pdf-viewer-control-radius: var(--rt-radius-md);--rt-pdf-viewer-control-bg: color-mix(in srgb, var(--rt-neutral-0) 10%, transparent);--rt-pdf-viewer-control-bg-hover: color-mix(in srgb, var(--rt-neutral-0) 24%, transparent);display:block;width:100vw;height:100vh;height:100dvh;background:var(--rt-pdf-viewer-bg);color:var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer__surface{position:absolute;display:flex;flex-direction:column;inset:0}.rt-pdf-viewer__bar{display:flex;height:var(--rt-pdf-viewer-bar-height);flex:none;align-items:center;justify-content:space-between;padding:0 var(--rt-space-4);background:var(--rt-pdf-viewer-bar-bg);gap:var(--rt-space-4)}.rt-pdf-viewer__title{display:flex;min-width:0;align-items:center;gap:var(--rt-space-2)}.rt-pdf-viewer__file-icon{flex:none;color:var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer__file-name{overflow:hidden;min-width:0;font-size:var(--rt-text-sm);text-overflow:ellipsis;white-space:nowrap}.rt-pdf-viewer__actions{display:flex;flex:none;align-items:center;gap:var(--rt-space-2)}.rt-pdf-viewer__actions rt-icon-button{--rt-icon-button-color: var(--rt-pdf-viewer-text-color);--rt-icon-button-color-bg-hover: var(--rt-pdf-viewer-control-bg-hover);border-radius:var(--rt-pdf-viewer-control-radius);background:var(--rt-pdf-viewer-control-bg)}.rt-pdf-viewer__scroller{position:relative;overflow:auto;flex:1 1 auto;overscroll-behavior:contain;scrollbar-gutter:stable}.rt-pdf-viewer__column{display:flex;width:max-content;min-width:100%;box-sizing:border-box;flex-direction:column;align-items:center;padding:var(--rt-space-4) var(--rt-space-4) var(--rt-space-24);gap:var(--rt-pdf-viewer-page-gap)}.rt-pdf-viewer__page{flex:none;background:var(--rt-pdf-viewer-page-bg);box-shadow:var(--rt-pdf-viewer-page-shadow)}.rt-pdf-viewer__canvas{display:block;width:100%;height:100%}.rt-pdf-viewer__center{position:absolute;display:flex;align-items:center;justify-content:center;padding:var(--rt-space-4);inset:var(--rt-pdf-viewer-bar-height) 0 0}.rt-pdf-viewer .rt-pdf-viewer__error{--rt-empty-state-title-color: var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer .rt-pdf-viewer__error .rt-empty-state__description{color:var(--rt-pdf-viewer-muted-color)}.rt-pdf-viewer .rt-pdf-viewer__error-download{--rt-btn-bg: var(--rt-pdf-viewer-page-bg);--rt-btn-bg-hover: var(--rt-neutral-100);--rt-btn-bg-active: var(--rt-neutral-200);--rt-btn-color: var(--rt-neutral-900)}.rt-pdf-viewer__toolbar{position:absolute;bottom:var(--rt-space-6);left:50%;display:flex;align-items:center;padding:var(--rt-space-1) var(--rt-space-2);border-radius:var(--rt-pdf-viewer-toolbar-radius);background:var(--rt-pdf-viewer-toolbar-bg);gap:var(--rt-space-1);transform:translate(-50%);white-space:nowrap}.rt-pdf-viewer__toolbar rt-icon-button{--rt-icon-button-color: var(--rt-pdf-viewer-text-color);--rt-icon-button-color-bg-hover: var(--rt-pdf-viewer-control-bg-hover)}.rt-pdf-viewer__counter,.rt-pdf-viewer__zoom{padding:0 var(--rt-space-2);font-size:var(--rt-text-sm);font-variant-numeric:tabular-nums}.rt-pdf-viewer__zoom{min-width:var(--rt-size-12);text-align:center}.rt-pdf-viewer__divider,.rt-pdf-viewer__fit-divider{width:var(--rt-pdf-viewer-divider-width);height:var(--rt-size-5);margin:0 var(--rt-space-1);background:var(--rt-pdf-viewer-divider-color)}.rt-pdf-viewer .rt-pdf-viewer__fit{--rt-btn-color: var(--rt-pdf-viewer-text-color);--rt-btn-bg-hover: var(--rt-pdf-viewer-control-bg-hover)}@container rt-place (width <= 480px){.rt-pdf-viewer{--rt-pdf-viewer-bar-height: var(--rt-control-height-xl)}.rt-pdf-viewer__fit,.rt-pdf-viewer__fit-divider{display:none}}@media(width<=480px){:where(html:not(:has(.rt-container))) .rt-pdf-viewer{--rt-pdf-viewer-bar-height: var(--rt-control-height-xl)}:where(html:not(:has(.rt-container))) .rt-pdf-viewer__fit,:where(html:not(:has(.rt-container))) .rt-pdf-viewer__fit-divider{display:none}}.rt-pdf-viewer-print{display:none}.rt-pdf-viewer-print__page{display:block;width:100%;break-after:page;break-inside:avoid}@media print{.rt-pdf-viewer-printing body>:not(.rt-pdf-viewer-print){display:none}.rt-pdf-viewer-printing .rt-pdf-viewer-print{display:block}}}\n"],
 			dependencies: [
 				{
 					kind: "directive",
@@ -649,7 +649,7 @@ i0.ɵɵngDeclareClassMetadata({
 				"(window:resize)": "onResize()"
 			},
 			template: "<ng-container rtBlock=\"rt-pdf-viewer\">\n    <!-- Ловушка держит Tab внутри; фокус ставит сам компонент, поэтому авто-захвата здесь нет -->\n    <div rtElem=\"surface\" cdkTrapFocus>\n        <!-- Полоса видна сразу, ещё до загрузки документа: человек видит, что открыл, и может закрыть -->\n        <header rtElem=\"bar\">\n            <div rtElem=\"title\">\n                <rt-icon rtElem=\"file-icon\" name=\"attach-pdf\" size=\"md\" />\n                <span rtElem=\"file-name\" qa-dataid=\"pdf-viewer-file-name\" [attr.title]=\"fileName\">{{ fileName }}</span>\n            </div>\n\n            <div rtElem=\"actions\">\n                <rt-icon-button\n                    qa-dataid=\"pdf-viewer-print\"\n                    icon=\"print\"\n                    variant=\"ghost\"\n                    [ariaLabel]=\"t().pdfViewerPrint\"\n                    [tooltip]=\"t().pdfViewerPrint\"\n                    [disabled]=\"status() !== 'ready'\"\n                    [loading]=\"printing()\"\n                    (clicked)=\"print()\" />\n                <rt-icon-button\n                    qa-dataid=\"pdf-viewer-download\"\n                    icon=\"ico-download\"\n                    variant=\"ghost\"\n                    [ariaLabel]=\"t().pdfViewerDownload\"\n                    [tooltip]=\"t().pdfViewerDownload\"\n                    (clicked)=\"download()\" />\n                <rt-icon-button\n                    qa-dataid=\"pdf-viewer-close\"\n                    icon=\"close\"\n                    variant=\"ghost\"\n                    [ariaLabel]=\"t().pdfViewerClose\"\n                    [tooltip]=\"t().pdfViewerClose\"\n                    (clicked)=\"close()\" />\n            </div>\n        </header>\n\n        <div rtElem=\"scroller\" qa-dataid=\"pdf-viewer-pages\" #scroller (scroll)=\"onScroll()\">\n            <!-- Столбец стоит и до загрузки: по его ширине выбирается начальный масштаб -->\n            <div rtElem=\"column\" #column>\n                @if (status() === 'ready') {\n                    @for (box of boxes(); track box.index) {\n                        <div\n                            rtElem=\"page\"\n                            qa-dataid=\"pdf-viewer-page\"\n                            #page\n                            [attr.data-page-index]=\"box.index\"\n                            [style.width.px]=\"box.width\"\n                            [style.height.px]=\"box.height\">\n                            <canvas rtElem=\"canvas\" #canvas></canvas>\n                        </div>\n                    }\n                }\n            </div>\n        </div>\n\n        @switch (status()) {\n            @case ('loading') {\n                <div rtElem=\"center\">\n                    <rt-spinner qa-dataid=\"pdf-viewer-spinner\" color=\"on-primary\" [diameter]=\"40\" />\n                </div>\n            }\n\n            @case ('error') {\n                <div rtElem=\"center\">\n                    <rt-empty-state\n                        rtElem=\"error\"\n                        qa-dataid=\"pdf-viewer-error\"\n                        [title]=\"t().pdfViewerErrorTitle\"\n                        [description]=\"t().pdfViewerErrorText\">\n                        <button\n                            rtButton\n                            rtElem=\"error-download\"\n                            qa-dataid=\"pdf-viewer-error-download\"\n                            type=\"button\"\n                            icon=\"ico-download\"\n                            [label]=\"t().pdfViewerDownload\"\n                            [attr.aria-label]=\"t().pdfViewerDownload\"\n                            (click)=\"download()\"></button>\n                    </rt-empty-state>\n                </div>\n            }\n\n            @case ('ready') {\n                <div rtElem=\"toolbar\" qa-dataid=\"pdf-viewer-toolbar\">\n                    <span rtElem=\"counter\" qa-dataid=\"pdf-viewer-counter\" role=\"status\" aria-live=\"off\" [attr.aria-label]=\"pageOfLabel()\">\n                        {{ counter() }}\n                    </span>\n                    <span rtElem=\"divider\" aria-hidden=\"true\"></span>\n                    <rt-icon-button\n                        qa-dataid=\"pdf-viewer-zoom-out\"\n                        icon=\"minus\"\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        [ariaLabel]=\"t().pdfViewerZoomOut\"\n                        [disabled]=\"!canZoomOut()\"\n                        (clicked)=\"zoomOut()\" />\n                    <span rtElem=\"zoom\" qa-dataid=\"pdf-viewer-zoom\">{{ zoomLabel() }}</span>\n                    <rt-icon-button\n                        qa-dataid=\"pdf-viewer-zoom-in\"\n                        icon=\"ico-plus\"\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        [ariaLabel]=\"t().pdfViewerZoomIn\"\n                        [disabled]=\"!canZoomIn()\"\n                        (clicked)=\"zoomIn()\" />\n                    <span rtElem=\"fit-divider\" aria-hidden=\"true\"></span>\n                    <button\n                        rtButton\n                        rtElem=\"fit\"\n                        qa-dataid=\"pdf-viewer-fit\"\n                        type=\"button\"\n                        appearance=\"text\"\n                        size=\"sm\"\n                        [label]=\"t().pdfViewerFitWidth\"\n                        [attr.aria-label]=\"t().pdfViewerFitWidth\"\n                        [pressed]=\"isFit()\"\n                        (click)=\"fitWidth()\"></button>\n                </div>\n            }\n        }\n    </div>\n</ng-container>\n",
-			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-pdf-viewer{--rt-pdf-viewer-bg: var(--rt-neutral-900);--rt-pdf-viewer-bar-bg: color-mix(in srgb, var(--rt-neutral-900) 35%, var(--rt-neutral-950));--rt-pdf-viewer-bar-height: var(--rt-control-height-2xl);--rt-pdf-viewer-text-color: var(--rt-neutral-0);--rt-pdf-viewer-muted-color: var(--rt-neutral-200);--rt-pdf-viewer-page-bg: var(--rt-neutral-0);--rt-pdf-viewer-page-shadow: var(--rt-shadow-md);--rt-pdf-viewer-page-gap: var(--rt-space-4);--rt-pdf-viewer-toolbar-bg: var(--rt-neutral-800);--rt-pdf-viewer-toolbar-radius: var(--rt-radius-full);--rt-pdf-viewer-divider-width: var(--rt-border-width-thin);--rt-pdf-viewer-divider-color: color-mix(in srgb, var(--rt-neutral-0) 20%, transparent);--rt-pdf-viewer-control-radius: var(--rt-radius-md);--rt-pdf-viewer-control-bg: color-mix(in srgb, var(--rt-neutral-0) 10%, transparent);--rt-pdf-viewer-control-bg-hover: color-mix(in srgb, var(--rt-neutral-0) 24%, transparent);display:block;width:100vw;height:100vh;height:100dvh;background:var(--rt-pdf-viewer-bg);color:var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer__surface{position:absolute;display:flex;flex-direction:column;inset:0}.rt-pdf-viewer__bar{display:flex;height:var(--rt-pdf-viewer-bar-height);flex:none;align-items:center;justify-content:space-between;padding:0 var(--rt-space-4);background:var(--rt-pdf-viewer-bar-bg);gap:var(--rt-space-4)}.rt-pdf-viewer__title{display:flex;min-width:0;align-items:center;gap:var(--rt-space-2)}.rt-pdf-viewer__file-icon{flex:none;color:var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer__file-name{overflow:hidden;min-width:0;font-size:var(--rt-text-sm);text-overflow:ellipsis;white-space:nowrap}.rt-pdf-viewer__actions{display:flex;flex:none;align-items:center;gap:var(--rt-space-2)}.rt-pdf-viewer__actions rt-icon-button{--rt-icon-button-color: var(--rt-pdf-viewer-text-color);--rt-icon-button-color-bg-hover: var(--rt-pdf-viewer-control-bg-hover);border-radius:var(--rt-pdf-viewer-control-radius);background:var(--rt-pdf-viewer-control-bg)}.rt-pdf-viewer__scroller{position:relative;overflow:auto;flex:1 1 auto;overscroll-behavior:contain;scrollbar-gutter:stable}.rt-pdf-viewer__column{display:flex;width:max-content;min-width:100%;box-sizing:border-box;flex-direction:column;align-items:center;padding:var(--rt-space-4) var(--rt-space-4) var(--rt-space-24);gap:var(--rt-pdf-viewer-page-gap)}.rt-pdf-viewer__page{flex:none;background:var(--rt-pdf-viewer-page-bg);box-shadow:var(--rt-pdf-viewer-page-shadow)}.rt-pdf-viewer__canvas{display:block;width:100%;height:100%}.rt-pdf-viewer__center{position:absolute;display:flex;align-items:center;justify-content:center;padding:var(--rt-space-4);inset:var(--rt-pdf-viewer-bar-height) 0 0}.rt-pdf-viewer .rt-pdf-viewer__error{--rt-empty-state-title-color: var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer .rt-pdf-viewer__error .rt-empty-state__description{color:var(--rt-pdf-viewer-muted-color)}.rt-pdf-viewer .rt-pdf-viewer__error-download{--rt-btn-bg: var(--rt-pdf-viewer-page-bg);--rt-btn-bg-hover: var(--rt-neutral-100);--rt-btn-bg-active: var(--rt-neutral-200);--rt-btn-color: var(--rt-neutral-900)}.rt-pdf-viewer__toolbar{position:absolute;bottom:var(--rt-space-6);left:50%;display:flex;align-items:center;padding:var(--rt-space-1) var(--rt-space-2);border-radius:var(--rt-pdf-viewer-toolbar-radius);background:var(--rt-pdf-viewer-toolbar-bg);gap:var(--rt-space-1);transform:translate(-50%);white-space:nowrap}.rt-pdf-viewer__toolbar rt-icon-button{--rt-icon-button-color: var(--rt-pdf-viewer-text-color);--rt-icon-button-color-bg-hover: var(--rt-pdf-viewer-control-bg-hover)}.rt-pdf-viewer__counter,.rt-pdf-viewer__zoom{padding:0 var(--rt-space-2);font-size:var(--rt-text-sm);font-variant-numeric:tabular-nums}.rt-pdf-viewer__zoom{min-width:var(--rt-size-12);text-align:center}.rt-pdf-viewer__divider,.rt-pdf-viewer__fit-divider{width:var(--rt-pdf-viewer-divider-width);height:var(--rt-size-5);margin:0 var(--rt-space-1);background:var(--rt-pdf-viewer-divider-color)}.rt-pdf-viewer .rt-pdf-viewer__fit{--rt-btn-color: var(--rt-pdf-viewer-text-color);--rt-btn-bg-hover: var(--rt-pdf-viewer-control-bg-hover)}@container rt-place (width <= 480px){.rt-pdf-viewer{--rt-pdf-viewer-bar-height: var(--rt-control-height-xl)}.rt-pdf-viewer__fit,.rt-pdf-viewer__fit-divider{display:none}}.rt-pdf-viewer-print{display:none}.rt-pdf-viewer-print__page{display:block;width:100%;break-after:page;break-inside:avoid}@media print{.rt-pdf-viewer-printing body>:not(.rt-pdf-viewer-print){display:none}.rt-pdf-viewer-printing .rt-pdf-viewer-print{display:block}}}\n"]
+			styles: ["@charset \"UTF-8\";@layer rt-kit.components{.rt-pdf-viewer{--rt-pdf-viewer-bg: var(--rt-neutral-900);--rt-pdf-viewer-bar-bg: color-mix(in srgb, var(--rt-neutral-900) 35%, var(--rt-neutral-950));--rt-pdf-viewer-bar-height: var(--rt-control-height-2xl);--rt-pdf-viewer-text-color: var(--rt-neutral-0);--rt-pdf-viewer-muted-color: var(--rt-neutral-200);--rt-pdf-viewer-page-bg: var(--rt-neutral-0);--rt-pdf-viewer-page-shadow: var(--rt-shadow-md);--rt-pdf-viewer-page-gap: var(--rt-space-4);--rt-pdf-viewer-toolbar-bg: var(--rt-neutral-800);--rt-pdf-viewer-toolbar-radius: var(--rt-radius-full);--rt-pdf-viewer-divider-width: var(--rt-border-width-thin);--rt-pdf-viewer-divider-color: color-mix(in srgb, var(--rt-neutral-0) 20%, transparent);--rt-pdf-viewer-control-radius: var(--rt-radius-md);--rt-pdf-viewer-control-bg: color-mix(in srgb, var(--rt-neutral-0) 10%, transparent);--rt-pdf-viewer-control-bg-hover: color-mix(in srgb, var(--rt-neutral-0) 24%, transparent);display:block;width:100vw;height:100vh;height:100dvh;background:var(--rt-pdf-viewer-bg);color:var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer__surface{position:absolute;display:flex;flex-direction:column;inset:0}.rt-pdf-viewer__bar{display:flex;height:var(--rt-pdf-viewer-bar-height);flex:none;align-items:center;justify-content:space-between;padding:0 var(--rt-space-4);background:var(--rt-pdf-viewer-bar-bg);gap:var(--rt-space-4)}.rt-pdf-viewer__title{display:flex;min-width:0;align-items:center;gap:var(--rt-space-2)}.rt-pdf-viewer__file-icon{flex:none;color:var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer__file-name{overflow:hidden;min-width:0;font-size:var(--rt-text-sm);text-overflow:ellipsis;white-space:nowrap}.rt-pdf-viewer__actions{display:flex;flex:none;align-items:center;gap:var(--rt-space-2)}.rt-pdf-viewer__actions rt-icon-button{--rt-icon-button-color: var(--rt-pdf-viewer-text-color);--rt-icon-button-color-bg-hover: var(--rt-pdf-viewer-control-bg-hover);border-radius:var(--rt-pdf-viewer-control-radius);background:var(--rt-pdf-viewer-control-bg)}.rt-pdf-viewer__scroller{position:relative;overflow:auto;flex:1 1 auto;overscroll-behavior:contain;scrollbar-gutter:stable}.rt-pdf-viewer__column{display:flex;width:max-content;min-width:100%;box-sizing:border-box;flex-direction:column;align-items:center;padding:var(--rt-space-4) var(--rt-space-4) var(--rt-space-24);gap:var(--rt-pdf-viewer-page-gap)}.rt-pdf-viewer__page{flex:none;background:var(--rt-pdf-viewer-page-bg);box-shadow:var(--rt-pdf-viewer-page-shadow)}.rt-pdf-viewer__canvas{display:block;width:100%;height:100%}.rt-pdf-viewer__center{position:absolute;display:flex;align-items:center;justify-content:center;padding:var(--rt-space-4);inset:var(--rt-pdf-viewer-bar-height) 0 0}.rt-pdf-viewer .rt-pdf-viewer__error{--rt-empty-state-title-color: var(--rt-pdf-viewer-text-color)}.rt-pdf-viewer .rt-pdf-viewer__error .rt-empty-state__description{color:var(--rt-pdf-viewer-muted-color)}.rt-pdf-viewer .rt-pdf-viewer__error-download{--rt-btn-bg: var(--rt-pdf-viewer-page-bg);--rt-btn-bg-hover: var(--rt-neutral-100);--rt-btn-bg-active: var(--rt-neutral-200);--rt-btn-color: var(--rt-neutral-900)}.rt-pdf-viewer__toolbar{position:absolute;bottom:var(--rt-space-6);left:50%;display:flex;align-items:center;padding:var(--rt-space-1) var(--rt-space-2);border-radius:var(--rt-pdf-viewer-toolbar-radius);background:var(--rt-pdf-viewer-toolbar-bg);gap:var(--rt-space-1);transform:translate(-50%);white-space:nowrap}.rt-pdf-viewer__toolbar rt-icon-button{--rt-icon-button-color: var(--rt-pdf-viewer-text-color);--rt-icon-button-color-bg-hover: var(--rt-pdf-viewer-control-bg-hover)}.rt-pdf-viewer__counter,.rt-pdf-viewer__zoom{padding:0 var(--rt-space-2);font-size:var(--rt-text-sm);font-variant-numeric:tabular-nums}.rt-pdf-viewer__zoom{min-width:var(--rt-size-12);text-align:center}.rt-pdf-viewer__divider,.rt-pdf-viewer__fit-divider{width:var(--rt-pdf-viewer-divider-width);height:var(--rt-size-5);margin:0 var(--rt-space-1);background:var(--rt-pdf-viewer-divider-color)}.rt-pdf-viewer .rt-pdf-viewer__fit{--rt-btn-color: var(--rt-pdf-viewer-text-color);--rt-btn-bg-hover: var(--rt-pdf-viewer-control-bg-hover)}@container rt-place (width <= 480px){.rt-pdf-viewer{--rt-pdf-viewer-bar-height: var(--rt-control-height-xl)}.rt-pdf-viewer__fit,.rt-pdf-viewer__fit-divider{display:none}}@media(width<=480px){:where(html:not(:has(.rt-container))) .rt-pdf-viewer{--rt-pdf-viewer-bar-height: var(--rt-control-height-xl)}:where(html:not(:has(.rt-container))) .rt-pdf-viewer__fit,:where(html:not(:has(.rt-container))) .rt-pdf-viewer__fit-divider{display:none}}.rt-pdf-viewer-print{display:none}.rt-pdf-viewer-print__page{display:block;width:100%;break-after:page;break-inside:avoid}@media print{.rt-pdf-viewer-printing body>:not(.rt-pdf-viewer-print){display:none}.rt-pdf-viewer-printing .rt-pdf-viewer-print{display:block}}}\n"]
 		}]
 	}],
 	ctorParameters: () => [],