@getflip/swirl-components 0.484.0 → 0.485.1

package/dist/swirl-components/p-691e6554.entry.js

@@ -1 +0,0 @@
-import{r as a,c as t,h as o,a as i,d as p}from"./p-N0O_JBVJ.js";import{c as e}from"./p-orsBiyT_.js";import{D as n}from"./p-Bfn7CHM9.js";import{d as l,i as s,p as r}from"./p-CCck-DTo.js";const d=class{constructor(o){a(this,o),this.ctaClick=t(this,"ctaClick",7),this.mobileViewChange=t(this,"mobileViewChange",7),this.navigationBackButtonClick=t(this,"navigationBackButtonClick",7),this.navigationExpansionStateChange=t(this,"navigationExpansionStateChange",7),this.sidebarToggle=t(this,"sidebarToggle",7),this.backToNavigationViewButtonLabel="Back to navigation",this.navigationBackButtonLabel="Go back",this.navigationExpansionStateStorageKey="SWIRL_APP_LAYOUT_NAV_EXPANSION_STATE",this.navigationToggleLabel="Toggle navigation",this.navigationOverlayLabel="Show navigation",this.sidebarPositioning="auto",this.sidebarCloseButtonLabel="Close sidebar",this.transitionStyle="slides",this.contentScrollState={scrollable:!1,scrolledToTop:!1,scrolledToBottom:!1},this.mobileView="navigation",this.navScrollState={scrollable:!1,scrolledToTop:!1},this.navExpansionState="expanded",this.sidebarScrollState={scrollable:!1,scrolledToTop:!1},this.mediaQueryUnsubscribe=()=>{},this.onBackToNavigationViewButtonClick=()=>{this.changeMobileView("navigation")},this.onCtaClick=a=>{this.ctaClick.emit(a)},this.onNavigationBackButtonClick=a=>{this.navigationBackButtonClick.emit(a)},this.onSidebarCloseButtonClick=()=>{this.hideSidebar()},this.onContentScroll=l((()=>{this.updateContentScrollState()}),16),this.onNavScroll=l((()=>{this.updateNavScrollState()}),16),this.onSidebarScroll=l((()=>{this.updateSidebarScrollState()}),16),this.toggleNavigation=()=>{this.collapsibleNavigation&&this.setCollapsibleNavigationState("expanded"===this.navExpansionState?"collapsed":"expanded")},this.overlayNavigation=a=>{a.stopPropagation(),this.setCollapsibleNavigationState("overlayed")}}componentWillLoad(){this.initialMobileView&&(this.mobileView=this.initialMobileView),this.mutationObserver=new MutationObserver((()=>{this.updateBottomBarStatus(),this.updateBottomBannerStatus(),this.updateCustomAppBarBackButtonStatus(),this.updateNavigationStatus(),this.updateSidebarStatus()})),this.mutationObserver.observe(this.el,{childList:!0}),queueMicrotask((()=>{this.updateBottomBarStatus(),this.updateBottomBannerStatus(),this.updateCustomAppBarBackButtonStatus(),this.updateSidebarStatus(),this.updateNavigationStatus(),this.checkMobileView()}))}componentDidLoad(){this.mediaQueryUnsubscribe=n.subscribe((a=>{this.isDesktop=a})),queueMicrotask((()=>{this.restoreNavExpansionState(),this.updateContentScrollState(),this.updateSidebarScrollState(),this.updateNavScrollState()}))}disconnectedCallback(){this.mediaQueryUnsubscribe(),this.mutationObserver?.disconnect()}onDocumentClick(a){this.collapsibleNavigation&&"overlayed"===this.navExpansionState&&(a.composedPath().includes(this.navEl)||a.composedPath().includes(this.headerEl)||this.setCollapsibleNavigationState("collapsed"))}onKeyDown(a){"Escape"===a.key&&"overlayed"===this.navExpansionState&&this.setCollapsibleNavigationState("collapsed")}watchMobileView(){this.checkMobileView()}async showSidebar(){if(this.sidebarActive||!this.hasSidebar)return;Boolean(this.sidebarOpeningTimeout)&&clearTimeout(this.sidebarOpeningTimeout),this.sidebarOpening=!0;const a=s()||r()?0:300;this.sidebarOpeningTimeout=setTimeout((()=>{this.sidebarActive=!0,this.sidebarOpening=!1,this.changeMobileView("sidebar"),this.sidebarToggle.emit(!0)}),a)}async hideSidebar(){if(!this.sidebarActive||!this.hasSidebar)return;Boolean(this.sidebarClosingTimeout)&&clearTimeout(this.sidebarClosingTimeout),this.sidebarClosing=!0;const a=s()||r()?0:290;this.sidebarClosingTimeout=setTimeout((()=>{this.sidebarActive=!1,this.sidebarClosing=!1,this.changeMobileView("body"),this.sidebarToggle.emit(!1)}),a)}async toggleSidebar(){this.hasSidebar&&(this.sidebarActive?this.hideSidebar():this.showSidebar())}async getCollapsibleNavigationState(){return this.navExpansionState}async setCollapsibleNavigationState(a){this.collapsibleNavigation&&(this.navExpansionState=a,this.navigationExpansionStateChange.emit(this.navExpansionState),localStorage.setItem(this.navigationExpansionStateStorageKey,this.navExpansionState))}async getScrollContainer(){return this.contentEl}async changeMobileView(a,t=!0){if(this.mobileView===a||"navigation"===a&&!this.hasNavigation||"sidebar"===a&&!this.hasSidebar)return;if(!s()||!t)return this.mobileView=a,void this.mobileViewChange.emit(this.mobileView);Boolean(this.transitionTimeout)&&clearTimeout(this.transitionTimeout),this.transitioningFrom=this.mobileView,this.transitioningTo=a;const o=r();this.transitionTimeout=setTimeout((()=>{this.mobileView=a,this.transitioningFrom=void 0,this.transitioningTo=void 0,this.mobileViewChange.emit(this.mobileView)}),o?0:"slides"===this.transitionStyle?400:"dialog"===this.transitionStyle?300:0)}checkMobileView(){if("navigation"===this.mobileView&&!this.hasNavigation||"sidebar"===this.mobileView&&!this.hasSidebar)return void(this.mobileView="body");const a="sidebar"===this.mobileView||this.sidebarActive;a!==this.sidebarActive&&(a?this.showSidebar():this.hideSidebar())}updateBottomBannerStatus(){this.hasBottomBanner=Boolean(this.el.querySelector('[slot="bottom-banner"]'))}updateBottomBarStatus(){this.hasBottomBar=Boolean(this.el.querySelector('[slot="bottom-bar"]'))}updateNavigationStatus(){this.hasNavigation=Boolean(this.el.querySelector('[slot="navigation"]'))}updateCustomAppBarBackButtonStatus(){this.hasCustomAppBarBackButton=Boolean(this.el.querySelector('[slot="custom-app-bar-back-button"]'))}updateSidebarStatus(){this.hasSidebar=Boolean(this.el.querySelector('[slot="sidebar"]'))}updateContentScrollState(){const a={scrollable:this.contentEl.scrollHeight>this.contentEl.clientHeight,scrolledToTop:0===this.contentEl.scrollTop,scrolledToBottom:Math.round(this.contentEl.scrollTop+this.contentEl.clientHeight)>=this.contentEl.scrollHeight};Object.keys(a).some((t=>a[t]!==this.contentScrollState[t]))&&(this.contentScrollState=a)}updateNavScrollState(){const a={scrollable:this.navEl.scrollHeight>this.navEl.clientHeight,scrolledToTop:0===this.navEl.scrollTop};Object.keys(a).some((t=>a[t]!==this.navScrollState[t]))&&(this.navScrollState=a)}updateSidebarScrollState(){const a={scrollable:this.sidebarEl.scrollHeight>this.sidebarEl.clientHeight,scrolledToTop:0===this.sidebarEl.scrollTop};Object.keys(a).some((t=>a[t]!==this.sidebarScrollState[t]))&&(this.sidebarScrollState=a)}restoreNavExpansionState(){if(!this.collapsibleNavigation)return;const a=localStorage.getItem(this.navigationExpansionStateStorageKey);Boolean(a)&&this.setCollapsibleNavigationState(a)}render(){const a=("body"===this.mobileView||this.transitioningTo)&&this.hasNavigation&&!this.hasCustomAppBarBackButton,t=Boolean(this.el.querySelector('[slot="app-bar-controls"]')),p=Boolean(this.el.querySelector('[slot="app-bar-mobile-menu-button"]')),n=Boolean(this.el.querySelector('[slot="custom-sidebar-header"]')),l=Boolean(this.el.querySelector('[slot="floating-action-button"]'))||Boolean(this.ctaLabel),s=this.hasNavigation&&(!this.collapsibleNavigation||"collapsed"!==this.navExpansionState||!this.isDesktop),r=e("app-layout",`app-layout--mobile-view-${this.mobileView}`,`app-layout--nav-${this.isDesktop?this.navExpansionState:"expanded"}`,`app-layout--transitioning-from-${this.transitioningFrom}`,`app-layout--transitioning-to-${this.transitioningTo}`,`app-layout--transition-style-${this.transitionStyle}`,`app-layout--sidebar-positioning-${this.sidebarPositioning}`,{"app-layout--content-scrollable":this.contentScrollState.scrollable,"app-layout--content-scrolled-to-top":this.contentScrollState.scrolledToTop,"app-layout--content-scrolled-to-bottom":this.contentScrollState.scrolledToBottom,"app-layout--has-app-bar-mobile-menu-button":p,"app-layout--has-app-bar-controls":t,"app-layout--has-bottom-banner":this.hasBottomBanner,"app-layout--has-bottom-bar":this.hasBottomBar,"app-layout--has-custom-app-bar-back-button":this.hasCustomAppBarBackButton,"app-layout--has-custom-sidebar-header":n,"app-layout--has-floating-action-button":l,"app-layout--has-navigation":this.hasNavigation,"app-layout--has-sidebar":this.hasSidebar,"app-layout--hide-app-bar":this.hideAppBar,"app-layout--nav-collapsible":this.collapsibleNavigation&&this.isDesktop,"app-layout--nav-scrollable":this.navScrollState.scrollable,"app-layout--nav-scrolled-to-top":this.navScrollState.scrolledToTop,"app-layout--prevent-content-overflow":this.preventContentOverflow,"app-layout--rounded-corners":this.roundedCorners,"app-layout--sidebar-active":"sidebar"===this.mobileView||this.sidebarActive,"app-layout--sidebar-closing":this.sidebarClosing,"app-layout--sidebar-opening":this.sidebarOpening,"app-layout--sidebar-scrollable":this.sidebarScrollState.scrollable,"app-layout--sidebar-scrolled-to-top":this.sidebarScrollState.scrolledToTop});return o(i,{key:"e8fa3517c20be50f23651a6618d0a654360dd8bb"},o("section",{key:"29bae81c9047360e9a41d1e1b5b4478f18e65900","aria-labelledby":"app-name",class:r},o("div",{key:"8399a6c2d5885a8abaa3da3183282d6838026bc9",class:"app-layout__grid"},o("header",{key:"7139743470378cd46bc6b01b3d3628d9e4e2fd4d",class:"app-layout__header",ref:a=>this.headerEl=a},o("span",{key:"79057b7fc1b7f969a72e3a5bf2f6f19abd5c1d58",class:"app-layout__navigation-mobile-menu-button"},o("slot",{key:"48113ac7f2a57bee6cf7ea639d8f62a9192582cd",name:"navigation-mobile-menu-button"})),this.collapsibleNavigation&&o("span",{key:"7414f2ec88b8369728d76d419b169cb3d936b6f5",class:"app-layout__nav-overlay-toggle"},o("swirl-button",{key:"cce77f4a0de5288ab8496e2d27aa40952e9997ed",hideLabel:!0,icon:"expanded"!==this.navExpansionState?"<swirl-icon-dock-left-expand></swirl-icon-dock-left-expand>":"<swirl-icon-dock-left-collapse></swirl-icon-dock-left-collapse>",label:this.navigationToggleLabel,onClick:this.toggleNavigation})),this.showNavigationBackButton&&o("span",{key:"e1a586370b0b04dc4d100fcb895e2ba371dae64e",class:"app-layout__navigation-back-button"},o("swirl-button",{key:"0b77ac2c49a9db06cc3f7792d06dd269945c58da",hideLabel:!0,icon:"<swirl-icon-arrow-back></swirl-icon-arrow-back>",label:this.navigationBackButtonLabel,onClick:this.onNavigationBackButtonClick})),o("swirl-heading",{key:"d2e7989615352c42dce6005da07dbaed0c6d99ee",as:"h1",class:"app-layout__app-name",headingId:"app-name",level:3,text:this.appName}),s&&o("span",{key:"d6655e944086aa11f95c4cab4da3ea9ef827cc76",class:"app-layout__navigation-controls"},o("slot",{key:"6c7d9dbf8b2707cdcb01bffaff8ce9f6059389b4",name:"navigation-controls"}))),o("nav",{key:"111e910171f0d799ac8e3eb5fd6fd5e7c7f832a6","aria-label":this.navigationLabel,class:"app-layout__navigation",onScroll:this.onNavScroll,ref:a=>this.navEl=a,inert:this.isDesktop&&this.collapsibleNavigation&&"collapsed"===this.navExpansionState},o("slot",{key:"580dd1a0a999a77195279c7cc887585857080276",name:"navigation"})),o("section",{key:"f77cb25f6be2b64d7213ff7f917b5f6869880b9f","aria-labelledby":"app-name",class:"app-layout__body"},!this.hideAppBar&&o("header",{key:"06467a7005a8bccfa66bd662a28e9aea4771d27a",class:"app-layout__app-bar"},o("span",{key:"a2f2d531d1b7f304d9f3fa5159dbea8f78b45553",class:"app-layout__app-bar-mobile-menu-button"},o("slot",{key:"4e83761fc85b17c739abc1d8c7158d5cd362706f",name:"app-bar-mobile-menu-button"})),a&&o("span",{key:"1c257404a9cfd84debbd0486f8f17b2d7916839c",class:"app-layout__back-to-navigation-button"},o("swirl-button",{key:"f67661832bb9ed96006e13f4cf998cb395adcce5",hideLabel:!0,icon:"dialog"===this.transitionStyle?"<swirl-icon-close></swirl-icon-close>":"<swirl-icon-arrow-back></swirl-icon-arrow-back>",label:this.backToNavigationViewButtonLabel,onClick:this.onBackToNavigationViewButtonClick})),this.collapsibleNavigation&&"expanded"!==this.navExpansionState&&o("span",{key:"39d626d775997e9bab9e9ae3946084d73d715583",class:"app-layout__nav-expansion-toggle"},o("swirl-button",{key:"7e967c7d6314707a913b461271e4908ca80d70a7",hideLabel:!0,icon:"<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>",label:this.navigationOverlayLabel,onClick:this.overlayNavigation})),o("span",{key:"76e4be74a94b18c027c33140736c36c98e7024e3",class:"app-layout__custom-app-bar-back-button"},o("slot",{key:"81df9b04bc26d1fb85f8160c55cc2df72aafedfa",name:"custom-app-bar-back-button"})),o("div",{key:"955ccd31ee748b0f9bf03e573f920884a402b7f4",class:"app-layout__app-bar-content"},o("slot",{key:"16deec03db91173bf75664f2fbc1ceac7a30004f",name:"app-bar"})),o("div",{key:"bce238fc1df86c571e663419d8f3faeeffa36982",class:"app-layout__app-bar-controls"},o("slot",{key:"540b1410a2cf45d6b04b1ae7ebd8c1f92b9edeaa",name:"app-bar-controls"}))),o("div",{key:"110496d5b1001a4cfd1510c5b01e6ba108d5de17",class:"app-layout__banner"},o("slot",{key:"d899e047a077a3ea4638311913623cc6ef8d3112",name:"banner"})),o("div",{key:"137484f06a5e4fea74ab0f5febc30b327c500710",class:"app-layout__content",onScroll:this.onContentScroll,ref:a=>this.contentEl=a},o("div",{key:"3854ac4b1108ec4083c05b6d989b899e5b4bd999",class:"app-layout__content-inner"},o("slot",{key:"68d9a207834dcf01164545df8d813d817b1fcad0",name:"content"})),o("div",{key:"e7c2fd5cc7802e3d4cfa83fc54e1b58587fc05b7",class:"app-layout__bottom-banner"},o("slot",{key:"655ad74d80da4bde2d8e1c5f76e5276f8debbf67",name:"bottom-banner"}))),o("div",{key:"6fa13e005398621057950af22593851bc5bb40bb",class:"app-layout__bottom-bar"},o("slot",{key:"7f3c36cb64f027d9db9ed6f6343242fdccffc313",name:"bottom-bar"}))),o("aside",{key:"7269ec313d3bcc3cd1dec5abe8cf81b440987e8f",class:"app-layout__sidebar"},o("header",{key:"63ba307a1ee8755ed86cfdf73eda6cfe38b4b8ac",class:"app-layout__custom-sidebar-header"},o("slot",{key:"4027a4f20d4b2703422547bbbdd81221b8816c85",name:"custom-sidebar-header"})),o("header",{key:"f853e2f2fc57e27a9d14265bb4abb948c198e8ea",class:"app-layout__sidebar-header"},o("swirl-button",{key:"a5afb72e7cf946c9078732708d02ab26eae5c955",class:"app-layout__sidebar-close-button",hideLabel:!0,icon:"<swirl-icon-close></swirl-icon-close>",label:this.sidebarCloseButtonLabel,onClick:this.onSidebarCloseButtonClick}),o("swirl-heading",{key:"797791edbae180dd39835a407479f56b824f2733",as:"h3",class:"app-layout__sidebar-heading",headingId:"sidebar-heading",level:3,text:this.sidebarHeading})),o("div",{key:"1d1a0a76937293430f572b6c5930e010d70102fd",class:"app-layout__sidebar-content",onScroll:this.onSidebarScroll,ref:a=>this.sidebarEl=a},o("slot",{key:"dc8ff45e81cbd1be539e851d2da00042b6d3ce26",name:"sidebar"}))),o("span",{key:"e11c29160fcf21b6212d28e55a8092cc8bb36931",class:"app-layout__floating-action-button"},this.ctaLabel&&o("swirl-button",{key:"15eb5b55036b38780182689b7d11f084c9425038",hideLabel:Boolean(this.ctaIcon),icon:this.ctaIcon,intent:"primary",label:this.ctaLabel,onClick:this.onCtaClick,variant:"floating"}),o("slot",{key:"50383a0c6b5cb438fd606f2bba6ad0184eb2a953",name:"floating-action-button"})))))}get el(){return p(this)}static get watchers(){return{mobileView:[{watchMobileView:0}]}}};d.style=':host{--header-height:3.5625rem;position:relative;z-index:1;display:flex;width:100%;height:100%}:host *{box-sizing:border-box}.app-layout{display:flex;overflow:hidden;width:100%;height:100%;margin-right:auto;margin-left:auto}.app-layout__grid{position:relative;display:grid;width:100%;height:100%;grid-template-columns:100%;grid-template-rows:var(--header-height) 1fr;grid-template-areas:"body"     "body"}.app-layout:not(.app-layout--has-navigation) .app-layout__header,.app-layout:not(.app-layout--has-navigation) .app-layout__navigation{display:none}.app-layout:not(.app-layout--has-sidebar) .app-layout__sidebar{display:none}@media (max-width: 767px){.app-layout:not(.app-layout--mobile-view-body) .app-layout__body{display:none}}@media (max-width: 767px){.app-layout:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar{display:none}}.app-layout:not(.app-layout--has-app-bar-mobile-menu-button) .app-layout__app-bar-mobile-menu-button{display:none}.app-layout--has-navigation .app-layout__grid{grid-template-columns:100%;grid-template-areas:"header"       "navigation"}@media (min-width: 768px){.app-layout--has-navigation .app-layout__grid{grid-template-columns:min(50%, 22.5rem) 1fr;grid-template-areas:"header body"         "navigation body"}}@media (min-width: 1440px){.app-layout--has-navigation .app-layout__grid{grid-template-columns:min(50%, 25rem) 1fr}}@media (min-width: 768px){.app-layout--has-navigation .app-layout__app-bar-mobile-menu-button{display:none}}@media (min-width: 992px){.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-collapsed .app-layout__grid{grid-template-columns:0 1fr}.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__grid{grid-template-columns:0 1fr}.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__header,.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__navigation{position:absolute;z-index:4;top:0;left:0;width:22.5rem;animation:app-layout-nav-overlay-slide-in-desktop 0.1s;animation-fill-mode:forwards}.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__header:after{position:absolute;z-index:1;top:0;left:calc(100% + var(--s-border-width-default));display:block;width:2rem;height:100vh;background-image:linear-gradient(               to right,               rgba(0, 0, 0, 0.05) 0,               rgba(0, 0, 0, 0) 80%,               rgba(0, 0, 0, 0) 100%             );content:""}.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__navigation{z-index:3;bottom:0}}@media (min-width: 1440px){.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__header,.app-layout--has-navigation.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__navigation{width:25rem;animation:app-layout-nav-overlay-slide-in-large-desktop 0.1s}}@media (min-width: 768px){.app-layout--has-sidebar:not(.app-layout--has-navigation):not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid{animation:app-layout-no-nav-sidebar-slide-in 0.3s}@media (prefers-reduced-motion){.app-layout--has-sidebar:not(.app-layout--has-navigation):not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid{animation:none}}}@media (min-width: 768px){.app-layout--has-sidebar:not(.app-layout--has-navigation):not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing .app-layout__grid{animation:app-layout-no-nav-sidebar-slide-out 0.3s}@media (prefers-reduced-motion){.app-layout--has-sidebar:not(.app-layout--has-navigation):not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing .app-layout__grid{animation:none}}}@media (min-width: 768px){.app-layout--has-sidebar.app-layout--sidebar-active .app-layout__grid,.app-layout--has-sidebar.app-layout--sidebar-opening .app-layout__grid{grid-template-columns:1fr min(50%, 25rem);grid-template-areas:"body sidebar"           "body sidebar"}}.app-layout--has-sidebar .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"       "body"}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay) .app-layout__sidebar{position:static;z-index:auto;width:25rem;animation:none;box-shadow:none;background-color:var(--s-background-default)}}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid,.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-active .app-layout__grid{grid-template-columns:25rem 1fr 25rem;grid-template-areas:"header body sidebar"           "navigation body sidebar"}}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid{animation:app-layout-sidebar-slide-in 0.3s;animation-fill-mode:forwards}@media (prefers-reduced-motion){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening .app-layout__grid{animation:none}}.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening.app-layout--nav-collapsed .app-layout__grid,.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-opening.app-layout--nav-overlayed .app-layout__grid{animation:app-layout-sidebar-slide-in-with-collapsed-nav 0.3s}}@media (min-width: 1800px){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing .app-layout__grid{animation:app-layout-sidebar-slide-out 0.3s}@media (prefers-reduced-motion){.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing .app-layout__grid{animation:none}}.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing.app-layout--nav-collapsed .app-layout__grid,.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--sidebar-positioning-overlay).app-layout--sidebar-closing.app-layout--nav-overlayed .app-layout__grid{animation:app-layout-sidebar-slide-out-with-collapsed-nav 0.3s}}@media (min-width: 768px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:min(50%, 22.5rem) 1fr;grid-template-areas:"header body"         "navigation body"}}@media (min-width: 992px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:22.5rem 1fr}}@media (min-width: 1440px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__grid{grid-template-columns:25rem 1fr}}@media (min-width: 992px){.app-layout--has-navigation.app-layout--has-sidebar.app-layout--nav-collapsible.app-layout--nav-collapsed .app-layout__grid{grid-template-columns:0 1fr}.app-layout--has-navigation.app-layout--has-sidebar.app-layout--nav-collapsible.app-layout--nav-overlayed .app-layout__grid{grid-template-columns:0 1fr}}@media (min-width: 768px){.app-layout--has-navigation.app-layout--has-sidebar .app-layout__sidebar{position:absolute;z-index:3;top:0;right:0;bottom:0;width:min(40%, 25rem)}.app-layout--has-navigation.app-layout--has-sidebar:not(.app-layout--rounded-corners){border-left:var(--s-border-width-default) solid var(--s-border-default);box-shadow:var(--s-shadow-level-3)}}@media (max-width: 767px){.app-layout--mobile-view-navigation .app-layout__grid{grid-template-areas:"header"         "navigation"}.app-layout--mobile-view-navigation .app-layout__body,.app-layout--mobile-view-navigation .app-layout__sidebar{display:none}}@media (max-width: 767px){.app-layout--mobile-view-body .app-layout__grid{grid-template-areas:"body"         "body"}.app-layout--mobile-view-body .app-layout__header,.app-layout--mobile-view-body .app-layout__navigation,.app-layout--mobile-view-body .app-layout__sidebar{display:none}}@media (max-width: 767px){.app-layout--mobile-view-sidebar .app-layout__grid{grid-template-areas:"sidebar"         "sidebar"}.app-layout--mobile-view-sidebar .app-layout__header,.app-layout--mobile-view-sidebar .app-layout__navigation,.app-layout--mobile-view-sidebar .app-layout__body{display:none}}.app-layout--has-sidebar:not(.app-layout--sidebar-active):not(.app-layout--sidebar-opening) .app-layout__sidebar{display:none}@media (min-width: 768px){.app-layout--sidebar-closing .app-layout__sidebar{animation:app-layout-sidebar-overlay-slide-out 0.3s}@media (prefers-reduced-motion){.app-layout--sidebar-closing .app-layout__sidebar{animation:none}}}@media (min-width: 1800px){.app-layout--sidebar-closing:not(.app-layout--sidebar-positioning-overlay) .app-layout__sidebar{animation:none}}.app-layout--has-app-bar-controls .app-layout__app-bar-controls{display:block}.app-layout--has-bottom-bar .app-layout__body{grid-template-rows:minmax(var(--header-height), auto) auto 1fr auto;grid-template-areas:"app-bar"       "banner"       "content"       "bottom-bar"}.app-layout--has-bottom-bar .app-layout__content{border-bottom:var(--s-border-width-default) solid transparent}.app-layout--has-bottom-bar .app-layout__bottom-bar{display:block;padding-bottom:env(safe-area-inset-bottom, 0)}.app-layout--has-bottom-banner .app-layout__bottom-banner{display:block}.app-layout--has-custom-app-bar-back-button .app-layout__custom-app-bar-back-button{display:block}.app-layout--has-custom-sidebar-header .app-layout__sidebar-header{display:none}.app-layout--has-custom-sidebar-header .app-layout__custom-sidebar-header{display:block}.app-layout--has-floating-action-button .app-layout__floating-action-button{display:block}.app-layout--hide-app-bar .app-layout__body{grid-template-rows:auto 1fr;grid-template-areas:"banner"       "content"       "bottom-bar"}.app-layout--content-scrollable:not(.app-layout--content-scrolled-to-top) .app-layout__app-bar{border-bottom-color:var(--s-border-default)}.app-layout--content-scrollable.app-layout--has-bottom-bar:not(.app-layout--content-scrolled-to-bottom):not(.app-layout--has-bottom-banner) .app-layout__content{border-bottom-color:var(--s-border-default)}.app-layout--nav-scrollable:not(.app-layout--nav-scrolled-to-top) .app-layout__header{border-bottom-color:var(--s-border-default)}.app-layout--sidebar-scrollable:not(.app-layout--sidebar-scrolled-to-top) .app-layout__sidebar-header,.app-layout--sidebar-scrollable:not(.app-layout--sidebar-scrolled-to-top) .app-layout__custom-sidebar-header{border-bottom-color:var(--s-border-default)}.app-layout--prevent-content-overflow .app-layout__content{overflow:hidden}.app-layout--prevent-content-overflow .app-layout__content-inner{max-height:100%}.app-layout__header{z-index:1;display:flex;min-width:0;height:var(--header-height);padding-top:var(--s-space-12);padding-right:var(--s-space-8);padding-bottom:var(--s-space-12);padding-left:var(--s-space-8);align-items:center;border-bottom:var(--s-border-width-default) solid transparent;background-color:var(--s-background-default);grid-area:header;gap:var(--s-space-8)}@media (min-width: 768px){.app-layout__header{border-right:var(--s-border-width-default) solid var(--s-border-default)}}@media (min-width: 992px){.app-layout__header{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}}.app-layout__app-name{min-width:0}.app-layout__app-name .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-layout__app-bar-mobile-menu-button,.app-layout__navigation-mobile-menu-button{flex-shrink:0}@media (min-width: 992px){.app-layout__app-bar-mobile-menu-button,.app-layout__navigation-mobile-menu-button{display:none}}.app-layout__app-bar-mobile-menu-button{padding-left:var(--s-space-8)}.app-layout__navigation-back-button{margin-left:calc(-1 * var(--s-space-4))}.app-layout__floating-action-button{position:absolute;z-index:4;right:var(--s-space-16);bottom:var(--s-space-16);display:none}.app-layout__navigation-controls{flex-shrink:0}.app-layout__navigation{overflow-y:auto;border-right:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);grid-area:navigation}.app-layout__nav-overlay-toggle,.app-layout__nav-expansion-toggle{display:none}@media (min-width: 992px){.app-layout__nav-overlay-toggle,.app-layout__nav-expansion-toggle{display:block}}.app-layout__nav-expansion-toggle{padding-left:var(--s-space-16)}.app-layout__body{z-index:2;display:grid;width:100%;height:100%;background-color:var(--s-background-default);grid-area:body;grid-template-rows:minmax(var(--header-height), auto) auto 1fr;grid-template-areas:"app-bar"     "banner"     "content"}.app-layout__app-bar{--swirl-tab-bar-border-width:0;--swirl-tab-bar-height:3.5rem;display:flex;min-width:0;align-items:center;border-bottom:var(--s-border-width-default) solid transparent;grid-area:app-bar;gap:var(--s-space-8)}.app-layout__bottom-bar{display:none;min-width:0;align-items:center;grid-area:bottom-bar}.app-layout__back-to-navigation-button{padding-left:var(--s-space-8)}@media (min-width: 768px){.app-layout__back-to-navigation-button{display:none}}.app-layout__banner{grid-area:banner}.app-layout__app-bar-content{min-width:0;flex-grow:1}.app-layout__custom-app-bar-back-button{display:none;padding-left:var(--s-space-8)}.app-layout__app-bar-controls{display:none;padding-right:var(--s-space-8)}@media (min-width: 768px){.app-layout__app-bar-controls{padding-right:var(--s-space-16)}}.app-layout__content{overflow:auto;grid-area:content;display:flex;flex-direction:column}.app-layout__content-inner{flex-grow:1}.app-layout__sidebar{display:grid;width:100%;height:100%;border-left:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);grid-area:sidebar;grid-template-rows:var(--header-height) 1fr;grid-template-areas:"sidebar-header"     "sidebar-content"}@media (min-width: 768px){.app-layout__sidebar{animation:app-layout-slide-in 0.3s}@media (prefers-reduced-motion){.app-layout__sidebar{animation:none}}}.app-layout__custom-sidebar-header{display:none;min-width:0;border-bottom:var(--s-border-width-default) solid transparent;grid-area:sidebar-header}.app-layout__sidebar-header{display:flex;min-width:0;padding-top:var(--s-space-12);padding-right:var(--s-space-8);padding-bottom:var(--s-space-12);padding-left:var(--s-space-8);align-items:center;border-bottom:var(--s-border-width-default) solid transparent;grid-area:sidebar-header;gap:var(--s-space-8)}@media (min-width: 768px){.app-layout__sidebar-header{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}}.app-layout__sidebar-heading{min-width:0;flex-grow:1}.app-layout__sidebar-heading .heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.app-layout__sidebar-close-button{margin-left:calc(-1 * var(--s-space-4))}.app-layout__sidebar-content{overflow-y:auto;grid-area:sidebar-content}.app-layout__bottom-banner{display:none;position:sticky;right:0;bottom:0;left:0;z-index:5}@media (min-width: 768px){.app-layout--rounded-corners .app-layout__grid{-moz-column-gap:var(--s-space-8);column-gap:var(--s-space-8)}.app-layout--rounded-corners .app-layout__header{border-right:none;border-radius:var(--s-border-radius-l) var(--s-border-radius-l) 0 0}.app-layout--rounded-corners .app-layout__navigation{border-right:none;border-radius:0 0 var(--s-border-radius-l) var(--s-border-radius-l)}.app-layout--rounded-corners .app-layout__body,.app-layout--rounded-corners .app-layout__sidebar{overflow:hidden;border-radius:var(--s-border-radius-l)}.app-layout--rounded-corners .app-layout__sidebar{border-left:none;box-shadow:-12px 0 32px -10px rgba(23, 23, 23, 0.12),         -8px 4px 12px -8px rgba(23, 23, 23, 0.08);background-color:var(--s-surface-overlay-default)}}@media (min-width: 768px){.app-layout--sidebar-positioning-overlay:not(.app-layout--has-navigation).app-layout--has-sidebar.app-layout--sidebar-active .app-layout__grid,.app-layout--sidebar-positioning-overlay:not(.app-layout--has-navigation).app-layout--has-sidebar.app-layout--sidebar-opening .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"           "body"}}@media (min-width: 768px){.app-layout--sidebar-positioning-overlay:not(.app-layout--has-navigation).app-layout--has-sidebar .app-layout__sidebar{position:absolute;z-index:3;top:0;right:0;bottom:0;width:min(50%, 25rem);border-left:var(--s-border-width-default) solid var(--s-border-default);box-shadow:var(--s-shadow-level-3)}}@keyframes app-layout-nav-overlay-slide-in-desktop{from{width:0}to{width:22.5rem}}@keyframes app-layout-nav-overlay-slide-in-large-desktop{from{width:0}to{width:25rem}}@media print{.app-layout__content{overflow:visible}:host,.app-layout,.app-layout__grid,.app-layout__body{height:auto;overflow:visible}}@media (max-width: 767px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__grid,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__grid{grid-template-columns:100%;grid-template-areas:"header"           "navigation"}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{position:absolute;top:0;left:0;display:grid;width:100%;transform:translate3d(100%, 0, 0)}}@media (max-width: 767px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{display:flex}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{display:block}}@media (max-width: 991px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__grid,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__grid{grid-template-columns:100%;grid-template-areas:"body"           "body"}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{position:absolute;top:0;left:0;display:grid;border-left:var(--s-border-width-default) solid var(--s-border-default)}}@media (max-width: 991px){.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{display:grid}.app-layout:not(.app-layout--transition-none).app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{display:grid}}@media (max-width: 767px){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__navigation,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation:app-layout-slide-out 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__navigation,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation:none}}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation:app-layout-slide-in 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation:none}}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body:after,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body:after{position:absolute;top:0;right:100%;bottom:0;display:block;width:100%;background-color:rgba(0, 0, 0, 0.3);content:"";animation:app-layout-fade-in 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body:after,.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body:after{animation:none}}}@media (max-width: 767px){.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body:after{animation-direction:reverse}}@media (max-width: 991px){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation:app-layout-slide-out 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__body,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation:none}}.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation:app-layout-slide-in 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation:none}}.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar:after,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar:after{position:absolute;top:0;right:100%;bottom:0;display:block;width:100%;background-color:rgba(0, 0, 0, 0.3);content:"";animation:app-layout-fade-in 0.4s}@media (prefers-reduced-motion){.app-layout--transition-style-slides.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar:after,.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar:after{animation:none}}}@media (max-width: 991px){.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation-direction:reverse}.app-layout--transition-style-slides.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar:after{animation-direction:reverse}}@media (max-width: 767px){.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation:app-layout-scale-in 0.3s}@media (prefers-reduced-motion){.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-navigation:not(.app-layout--mobile-view-body) .app-layout__body,.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation:none}}}@media (max-width: 767px){.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__header{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__navigation{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-navigation.app-layout--transitioning-from-body:not(.app-layout--mobile-view-navigation) .app-layout__body{animation-direction:reverse}}@media (max-width: 991px){.app-layout--transition-style-dialog.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation:app-layout-scale-in 0.3s}@media (prefers-reduced-motion){.app-layout--transition-style-dialog.app-layout--transitioning-to-sidebar.app-layout--transitioning-from-body:not(.app-layout--mobile-view-sidebar) .app-layout__sidebar,.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation:none}}}@media (max-width: 991px){.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__body{animation-direction:reverse}.app-layout--transition-style-dialog.app-layout--transitioning-to-body.app-layout--transitioning-from-sidebar:not(.app-layout--mobile-view-body) .app-layout__sidebar{animation-direction:reverse}}@keyframes app-layout-sidebar-overlay-slide-out{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(100%, 0, 0)}}@keyframes app-layout-slide-in{0%{transform:translate3d(100%, 0, 0)}100%{transform:translate3d(0, 0, 0)}}@keyframes app-layout-slide-out{0%{transform:translate3d(0, 0, 0)}100%{transform:translate3d(-20%, 0, 0)}}@keyframes app-layout-fade-in{0%{opacity:0}100%{opacity:1}}@keyframes app-layout-scale-in{from{transform:scale(0);box-shadow:0 0 0 100rem rgba(0, 0, 0, 0)}to{transform:scale(1);box-shadow:0 0 0 100rem rgba(0, 0, 0, 0.25)}}@keyframes app-layout-sidebar-slide-in{from{overflow:hidden;grid-template-columns:25rem 1fr 0}to{overflow:hidden;grid-template-columns:25rem 1fr 25rem}}@keyframes app-layout-sidebar-slide-in-with-collapsed-nav{from{overflow:hidden;grid-template-columns:0 1fr 0}to{overflow:hidden;grid-template-columns:0 1fr 25rem}}@keyframes app-layout-sidebar-slide-out{from{overflow:hidden;grid-template-columns:25rem 1fr 25rem}to{overflow:hidden;grid-template-columns:25rem 1fr 0}}@keyframes app-layout-sidebar-slide-out-with-collapsed-nav{from{overflow:hidden;grid-template-columns:0 1fr 25rem}to{overflow:hidden;grid-template-columns:0 1fr 0}}@keyframes app-layout-no-nav-sidebar-slide-in{from{overflow:hidden;grid-template-columns:1fr 0}to{overflow:hidden;grid-template-columns:1fr 25rem}}@keyframes app-layout-no-nav-sidebar-slide-out{from{overflow:hidden;grid-template-columns:1fr 25rem}to{overflow:hidden;grid-template-columns:1fr 0}}';export{d as swirl_app_layout}