carbon-custom-elements/es/components/ui-shell/side-nav.rtl.css.js

A Carbon Design System variant that's as easy to use as native HTML elements, with no framework tax, no framework silo.

/**
 * @license
 *
 * Copyright IBM Corp. 2019, 2020
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */
import { css } from 'lit-element';
export default css([
  "a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline}button,input,select,textarea{border-radius:0;font-family:inherit}input[type=text]::-ms-clear{display:none}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}body{line-height:1}sup{vertical-align:super}sub{vertical-align:sub}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote::after,blockquote::before,q::after,q::before{content:''}table{border-collapse:collapse;border-spacing:0}*{box-sizing:border-box}button{margin:0}html{font-size:100%}body{font-weight:400;font-family:'IBM Plex Sans','Helvetica Neue',Arial,sans-serif;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:'IBM Plex Mono',Menlo,'DejaVu Sans Mono','Bitstream Vera Sans Mono',Courier,monospace}strong{font-weight:600}@media screen and (-ms-high-contrast:active){svg{fill:ButtonText}}h1{font-size:var(--cds-productive-heading-06-font-size,2.625rem);font-weight:var(--cds-productive-heading-06-font-weight,300);line-height:var(--cds-productive-heading-06-line-height,3.125rem);letter-spacing:var(--cds-productive-heading-06-letter-spacing,0)}h2{font-size:var(--cds-productive-heading-05-font-size,2rem);font-weight:var(--cds-productive-heading-05-font-weight,400);line-height:var(--cds-productive-heading-05-line-height,2.5rem);letter-spacing:var(--cds-productive-heading-05-letter-spacing,0)}h3{font-size:var(--cds-productive-heading-04-font-size,1.75rem);font-weight:var(--cds-productive-heading-04-font-weight,400);line-height:var(--cds-productive-heading-04-line-height,2.25rem);letter-spacing:var(--cds-productive-heading-04-letter-spacing,0)}h4{font-size:var(--cds-productive-heading-03-font-size,1.25rem);font-weight:var(--cds-productive-heading-03-font-weight,400);line-height:var(--cds-productive-heading-03-line-height,1.75rem);letter-spacing:var(--cds-productive-heading-03-letter-spacing,0)}h5{font-size:var(--cds-productive-heading-02-font-size,1rem);font-weight:var(--cds-productive-heading-02-font-weight,600);line-height:var(--cds-productive-heading-02-line-height,1.375rem);letter-spacing:var(--cds-productive-heading-02-letter-spacing,0)}h6{font-size:var(--cds-productive-heading-01-font-size,.875rem);font-weight:var(--cds-productive-heading-01-font-weight,600);line-height:var(--cds-productive-heading-01-line-height,1.125rem);letter-spacing:var(--cds-productive-heading-01-letter-spacing,.16px)}p{font-size:var(--cds-body-long-02-font-size,1rem);font-weight:var(--cds-body-long-02-font-weight,400);line-height:var(--cds-body-long-02-line-height,1.5rem);letter-spacing:var(--cds-body-long-02-letter-spacing,0)}a{color:#0062ff}em{font-style:italic}.bx--assistive-text,.bx--visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;visibility:inherit;white-space:nowrap}.bx--body{box-sizing:border-box;margin:0;padding:0;border:0;font-size:100%;font-family:inherit;vertical-align:baseline;font-size:var(--cds-body-short-01-font-size,.875rem);font-weight:var(--cds-body-short-01-font-weight,400);line-height:var(--cds-body-short-01-line-height,1.125rem);letter-spacing:var(--cds-body-short-01-letter-spacing,.16px);color:var(--cds-text-01,#161616);background-color:var(--cds-ui-background,#fff);line-height:1}.bx--body *,.bx--body ::after,.bx--body ::before{box-sizing:inherit}@-webkit-keyframes skeleton{0%{width:0%;right:0;left:auto;opacity:.3}20%{width:100%;right:0;left:auto;opacity:1}28%{width:100%;right:auto;left:0}51%{width:0%;right:auto;left:0}58%{width:0%;right:auto;left:0}82%{width:100%;right:auto;left:0}83%{width:100%;right:0;left:auto}96%{width:0%;right:0;left:auto}100%{width:0%;right:0;left:auto;opacity:.3}}@keyframes skeleton{0%{width:0%;right:0;left:auto;opacity:.3}20%{width:100%;right:0;left:auto;opacity:1}28%{width:100%;right:auto;left:0}51%{width:0%;right:auto;left:0}58%{width:0%;right:auto;left:0}82%{width:100%;right:auto;left:0}83%{width:100%;right:0;left:auto}96%{width:0%;right:0;left:auto}100%{width:0%;right:0;left:auto;opacity:.3}}.bx--text-truncate--end{width:100%;display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.bx--text-truncate--front{width:100%;display:inline-block;direction:ltr;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.bx--side-nav,:host(bx-side-nav){position:fixed;top:0;bottom:0;right:0;width:3rem;max-width:16rem;color:#525252;background-color:#fff;will-change:width;transition:width .11s cubic-bezier(.2,0,1,.9);overflow:hidden;z-index:8000}.bx--side-nav--ux,:host(bx-side-nav){top:var(--cds-spacing-09,3rem);width:16rem}@media (max-width:65.98rem){.bx--side-nav--ux,:host(bx-side-nav){width:0}}.bx--side-nav--rail{width:3rem}.bx--side-nav--hidden{width:0}.bx--side-nav--expanded,.bx--side-nav.bx--side-nav--rail:not(.bx--side-nav--fixed):hover,:host(bx-side-nav.bx--side-nav--rail:not(.bx--side-nav--fixed):hover),:host(bx-side-nav[collapse-mode][expanded]),:host(bx-side-nav[expanded]){width:16rem}.bx--side-nav__overlay{position:absolute;top:3rem;height:0;width:0;background-color:transparent;opacity:0;transition:opacity 240ms cubic-bezier(.2,0,.38,.9),background-color 240ms cubic-bezier(.2,0,.38,.9)}@media (max-width:65.98rem){.bx--side-nav__overlay-active{height:100vh;width:100%;background-color:var(--cds-overlay-01,rgba(22,22,22,.5));opacity:1;transition:opacity 240ms cubic-bezier(.2,0,.38,.9),background-color 240ms cubic-bezier(.2,0,.38,.9)}}.bx--header~.bx--side-nav,.bx--header~:host(bx-side-nav){top:3rem;height:calc(100% - 48px)}.bx--side-nav--fixed{width:16rem}.bx--side-nav--collapsed{width:16rem;-webkit-transform:translateX(16rem);transform:translateX(16rem)}.bx--side-nav__navigation,:host(bx-side-nav){display:flex;flex-direction:column;height:100%}.bx--side-nav__header{display:flex;border-bottom:1px solid #393939;width:100%;height:3rem;max-width:100%}.bx--side-nav--expanded .bx--side-nav__header,.bx--side-nav--fixed .bx--side-nav__header,.bx--side-nav:hover .bx--side-nav__header,:host(bx-side-nav:hover) .bx--side-nav__header,:host(bx-side-nav[expanded]) .bx--side-nav__header{height:auto}.bx--side-nav--ux .bx--side-nav__header,:host(bx-side-nav) .bx--side-nav__header{height:auto}.bx--side-nav__details{display:flex;flex-direction:column;padding-left:1rem;flex:1;min-width:0;opacity:0;visibility:hidden}.bx--side-nav--expanded .bx--side-nav__details,.bx--side-nav--fixed .bx--side-nav__details,.bx--side-nav:hover .bx--side-nav__details,:host(bx-side-nav:hover) .bx--side-nav__details,:host(bx-side-nav[expanded]) .bx--side-nav__details{visibility:inherit;opacity:1}.bx--side-nav--ux .bx--side-nav__details,:host(bx-side-nav) .bx--side-nav__details{opacity:1;visibility:inherit}.bx--side-nav__title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.875rem;font-weight:600;letter-spacing:.1px;margin-top:1rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.bx--side-nav__select,.bx--side-nav__title{padding-right:.5rem}.bx--side-nav__switcher{position:relative;display:flex;align-items:center;justify-content:space-between}.bx--side-nav__switcher-chevron{display:flex;align-items:center;position:absolute;top:0;left:.5rem;bottom:0;fill:#525252}.bx--side-nav__select{outline:2px solid transparent;outline-offset:-2px;-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:1 1 0%;background-color:#161616;color:#f4f4f4;border:none;border-radius:0;cursor:pointer;font-size:.75rem;height:2rem;min-width:0;padding-left:2rem;transition:outline 110ms}.bx--side-nav__select:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}.bx--side-nav__footer{flex:0 0 3rem;width:100%;background-color:#fff}.bx--side-nav__toggle{outline:2px solid transparent;outline-offset:-2px;box-sizing:border-box;margin:0;padding:0;border:0;font-size:100%;font-family:inherit;vertical-align:baseline;display:inline-block;background:0 0;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;cursor:pointer;width:100%;height:100%;text-align:right;transition:outline 110ms;padding-right:1rem}.bx--side-nav__toggle *,.bx--side-nav__toggle ::after,.bx--side-nav__toggle ::before{box-sizing:inherit}.bx--side-nav__toggle::-moz-focus-inner{border:0}.bx--side-nav__toggle:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}.bx--side-nav__items,:host(bx-side-nav-items){flex:1 1 0%;overflow:hidden;padding:1rem 0 0}.bx--side-nav--expanded .bx--side-nav__items,.bx--side-nav--expanded :host(bx-side-nav-items),.bx--side-nav--fixed .bx--side-nav__items,.bx--side-nav--fixed :host(bx-side-nav-items),.bx--side-nav:hover .bx--side-nav__items,.bx--side-nav:hover :host(bx-side-nav-items),:host(bx-side-nav:hover) .bx--side-nav__items,:host(bx-side-nav:hover) :host(bx-side-nav-items),:host(bx-side-nav[collapse-mode][expanded]) :host(bx-side-nav-items),:host(bx-side-nav[expanded]) .bx--side-nav__items,:host(bx-side-nav[expanded]) :host(bx-side-nav-items){overflow-y:auto}.bx--side-nav--ux .bx--side-nav__items,.bx--side-nav--ux :host(bx-side-nav-items),:host(bx-side-nav) .bx--side-nav__items,:host(bx-side-nav) :host(bx-side-nav-items){overflow-y:auto}.bx--side-nav__item,:host(bx-side-nav-link),:host(bx-side-nav-menu){width:3rem;height:3rem;overflow:hidden}.bx--side-nav--expanded .bx--side-nav__item,.bx--side-nav--expanded :host(bx-side-nav-link),.bx--side-nav--expanded :host(bx-side-nav-menu),.bx--side-nav--fixed .bx--side-nav__item,.bx--side-nav--fixed :host(bx-side-nav-link),.bx--side-nav--fixed :host(bx-side-nav-menu),.bx--side-nav:hover .bx--side-nav__item,.bx--side-nav:hover :host(bx-side-nav-link),.bx--side-nav:hover :host(bx-side-nav-menu),:host(bx-side-nav:hover) .bx--side-nav__item,:host(bx-side-nav:hover) :host(bx-side-nav-link),:host(bx-side-nav:hover) :host(bx-side-nav-menu),:host(bx-side-nav[collapse-mode][expanded]) :host(bx-side-nav-link),:host(bx-side-nav[collapse-mode][expanded]) :host(bx-side-nav-menu),:host(bx-side-nav[expanded]) .bx--side-nav__item,:host(bx-side-nav[expanded]) :host(bx-side-nav-link),:host(bx-side-nav[expanded]) :host(bx-side-nav-menu){width:auto;height:auto}.bx--side-nav--ux .bx--side-nav__item,.bx--side-nav--ux :host(bx-side-nav-link),.bx--side-nav--ux :host(bx-side-nav-menu),:host(bx-side-nav) .bx--side-nav__item,:host(bx-side-nav) :host(bx-side-nav-link),:host(bx-side-nav) :host(bx-side-nav-menu){width:auto;height:auto}.bx--side-nav .bx--header__menu-title[aria-expanded=true]:hover,.bx--side-nav a.bx--header__menu-item:hover,.bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover .bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))>.bx--side-nav__submenu:hover,.bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover :host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__submenu:hover,.bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover :host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__submenu:hover,.bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))>.bx--side-nav__link:hover,.bx--side-nav__menu a.bx--side-nav__link:not(.bx--side-nav__link--current):not([aria-current=page]):hover,:host(bx-side-nav) .bx--header__menu-title[aria-expanded=true]:hover,:host(bx-side-nav) a.bx--header__menu-item:hover,:host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__link:hover,:host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover) .bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))>.bx--side-nav__submenu:hover,:host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover) :host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__submenu:hover,:host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover) :host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__submenu:hover,:host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__link:hover,:host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover) .bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))>.bx--side-nav__submenu:hover,:host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover) :host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__submenu:hover,:host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])):hover) :host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__submenu:hover{background-color:#e5e5e5;color:#161616}.bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])) .bx--side-nav__menu-item>.bx--side-nav__link:hover>span,.bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])) :host(bx-side-nav-menu-item)>.bx--side-nav__link:hover>span,.bx--side-nav__item:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))>.bx--side-nav__link:hover>span,:host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))) .bx--side-nav__menu-item>.bx--side-nav__link:hover>span,:host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))) :host(bx-side-nav-menu-item)>.bx--side-nav__link:hover>span,:host(bx-side-nav-link:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__link:hover>span,:host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))) .bx--side-nav__menu-item>.bx--side-nav__link:hover>span,:host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active]))) :host(bx-side-nav-menu-item)>.bx--side-nav__link:hover>span,:host(bx-side-nav-menu:not(.bx--side-nav__item--active):not(:host(bx-side-nav-menu[active])))>.bx--side-nav__link:hover>span{color:#161616}.bx--side-nav__item--large{height:3rem}.bx--side-nav__submenu{box-sizing:border-box;margin:0;padding:0;border:0;font-size:100%;font-family:inherit;vertical-align:baseline;display:inline-block;background:0 0;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;cursor:pointer;width:100%;font-size:var(--cds-productive-heading-01-font-size,.875rem);font-weight:var(--cds-productive-heading-01-font-weight,600);line-height:var(--cds-productive-heading-01-line-height,1.125rem);letter-spacing:var(--cds-productive-heading-01-letter-spacing,.16px);outline:2px solid transparent;outline-offset:-2px;padding:0 1rem;display:flex;align-items:center;color:#525252;height:2rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:color 110ms,background-color 110ms,outline 110ms}.bx--side-nav__submenu *,.bx--side-nav__submenu ::after,.bx--side-nav__submenu ::before{box-sizing:inherit}.bx--side-nav__submenu::-moz-focus-inner{border:0}.bx--side-nav__submenu:hover{background-color:#e5e5e5;color:#161616}.bx--side-nav__submenu:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}.bx--side-nav__submenu-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}.bx--side-nav__icon.bx--side-nav__submenu-chevron{flex:1;display:flex;justify-content:flex-end}.bx--side-nav__submenu-chevron>svg{transition:-webkit-transform 110ms;transition:transform 110ms;transition:transform 110ms,-webkit-transform 110ms;height:1rem;width:1rem}.bx--side-nav__submenu[aria-expanded=true] .bx--side-nav__submenu-chevron>svg{-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.bx--side-nav__item--large .bx--side-nav__submenu{height:3rem}.bx--side-nav__item--active .bx--side-nav__submenu:hover,:host(bx-side-nav-menu[active]) .bx--side-nav__submenu:hover{background-color:#e5e5e5;color:#161616}.bx--side-nav__item--active .bx--side-nav__submenu[aria-expanded=false],:host(bx-side-nav-menu[active]) .bx--side-nav__submenu[aria-expanded=false]{background-color:#e5e5e5;color:#161616;position:relative}.bx--side-nav__item--active .bx--side-nav__submenu[aria-expanded=false]::before,:host(bx-side-nav-menu[active]) .bx--side-nav__submenu[aria-expanded=false]::before{content:'';position:absolute;top:0;bottom:0;right:0;width:4px;background-color:#0f62fe}.bx--side-nav__item--active .bx--side-nav__submenu-title,:host(bx-side-nav-menu[active]) .bx--side-nav__submenu-title{font-weight:600;color:#161616}.bx--side-nav__menu{display:block;visibility:hidden;max-height:0}.bx--side-nav__submenu[aria-expanded=true]+.bx--side-nav__menu{max-height:93.75rem;visibility:inherit}.bx--side-nav__menu a.bx--side-nav__link{height:2rem;min-height:2rem;padding-right:2rem;font-weight:400}.bx--side-nav__item.bx--side-nav__item--icon a.bx--side-nav__link,:host(:host(bx-side-nav-menu[has-icon]bx-side-nav-link)) a.bx--side-nav__link,:host(:host(bx-side-nav-menu[has-icon]bx-side-nav-menu)) a.bx--side-nav__link,:host(bx-side-nav-link.bx--side-nav__item--icon) a.bx--side-nav__link,:host(bx-side-nav-menu.bx--side-nav__item--icon) a.bx--side-nav__link{padding-right:4.5rem}.bx--side-nav__menu a.bx--side-nav__link--current,.bx--side-nav__menu a.bx--side-nav__link[aria-current=page],a.bx--side-nav__link--current{background-color:#e0e0e0}.bx--side-nav__menu a.bx--side-nav__link--current>span,.bx--side-nav__menu a.bx--side-nav__link[aria-current=page]>span,a.bx--side-nav__link--current>span{color:#161616;font-weight:600}.bx--side-nav .bx--header__menu-title[aria-expanded=true]+.bx--header__menu,.bx--side-nav a.bx--header__menu-item,:host(bx-side-nav) .bx--header__menu-title[aria-expanded=true]+.bx--header__menu,:host(bx-side-nav) a.bx--header__menu-item,a.bx--side-nav__link{outline:2px solid transparent;outline-offset:-2px;font-size:var(--cds-productive-heading-01-font-size,.875rem);font-weight:var(--cds-productive-heading-01-font-weight,600);line-height:var(--cds-productive-heading-01-line-height,1.125rem);letter-spacing:var(--cds-productive-heading-01-letter-spacing,.16px);position:relative;display:flex;align-items:center;text-decoration:none;min-height:2rem;padding:0 1rem;transition:color 110ms,background-color 110ms,outline 110ms}.bx--side-nav__item--large a.bx--side-nav__link{height:3rem}.bx--side-nav a.bx--header__menu-item .bx--text-truncate-end,:host(bx-side-nav) a.bx--header__menu-item .bx--text-truncate-end,a.bx--side-nav__link>.bx--side-nav__link-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#525252;font-size:.875rem;letter-spacing:.1px;line-height:1.25rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.bx--side-nav a.bx--header__menu-item:focus,:host(bx-side-nav) a.bx--header__menu-item:focus,a.bx--side-nav__link:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}a.bx--side-nav__link--current,a.bx--side-nav__link[aria-current=page]{background-color:#e5e5e5;font-weight:600}a.bx--side-nav__link--current .bx--side-nav__link-text,a.bx--side-nav__link[aria-current=page] .bx--side-nav__link-text{color:#161616}a.bx--side-nav__link--current::before,a.bx--side-nav__link[aria-current=page]::before{content:'';position:absolute;top:0;bottom:0;right:0;width:4px;background-color:#0f62fe}.bx--side-nav__icon{display:flex;justify-content:center;align-items:center;flex:0 0 1rem}.bx--side-nav__icon:not(.bx--side-nav__submenu-chevron){margin-left:1.5rem}.bx--side-nav__icon>svg{fill:#525252;width:1rem;height:1rem}.bx--side-nav__icon>svg.bx--side-nav-collapse-icon{display:none}.bx--side-nav--expanded .bx--side-nav__icon>svg.bx--side-nav-expand-icon,:host(bx-side-nav[expanded]) .bx--side-nav__icon>svg.bx--side-nav-expand-icon{display:none}.bx--side-nav--expanded .bx--side-nav__icon>svg.bx--side-nav-collapse-icon,:host(bx-side-nav[expanded]) .bx--side-nav__icon>svg.bx--side-nav-collapse-icon{display:block}.bx--side-nav--fixed .bx--side-nav__submenu,.bx--side-nav--fixed a.bx--side-nav__link{padding-right:1rem}.bx--side-nav--fixed .bx--side-nav__item:not(.bx--side-nav__item--icon):not(:host(bx-side-nav-menu[has-icon])) .bx--side-nav__menu a.bx--side-nav__link,.bx--side-nav--fixed :host(bx-side-nav-link:not(.bx--side-nav__item--icon):not(:host(bx-side-nav-menu[has-icon]))) .bx--side-nav__menu a.bx--side-nav__link,.bx--side-nav--fixed :host(bx-side-nav-menu:not(.bx--side-nav__item--icon):not(:host(bx-side-nav-menu[has-icon]))) .bx--side-nav__menu a.bx--side-nav__link{padding-right:2rem}@media (max-width:65.98rem){.bx--side-nav .bx--header__nav,:host(bx-side-nav) .bx--header__nav{display:block}}.bx--side-nav__header-navigation{display:none}@media (max-width:65.98rem){.bx--side-nav__header-navigation{display:block;position:relative;margin-bottom:2rem}}.bx--side-nav__header-divider::after{content:'';position:absolute;height:.0625rem;bottom:-1rem;right:1rem;width:calc(100% - 32px);background:#e0e0e0}.bx--side-nav a.bx--header__menu-item,:host(bx-side-nav) a.bx--header__menu-item{color:#525252;white-space:nowrap;justify-content:space-between}.bx--side-nav a.bx--header__menu-item[aria-expanded=true],:host(bx-side-nav) a.bx--header__menu-item[aria-expanded=true]{background-color:transparent}.bx--side-nav .bx--header__menu-title[aria-expanded=true]+.bx--header__menu,:host(bx-side-nav) .bx--header__menu-title[aria-expanded=true]+.bx--header__menu{bottom:inherit;width:100%;box-shadow:none;-webkit-transform:none;transform:none;background-color:transparent;padding:0}.bx--side-nav .bx--header__menu-title[aria-expanded=true]+.bx--header__menu li,:host(bx-side-nav) .bx--header__menu-title[aria-expanded=true]+.bx--header__menu li{width:100%}.bx--side-nav .bx--header__menu-title[aria-expanded=true]+.bx--header__menu a.bx--header__menu-item,:host(bx-side-nav) .bx--header__menu-title[aria-expanded=true]+.bx--header__menu a.bx--header__menu-item{padding-right:4.25rem;font-weight:400}.bx--side-nav .bx--header__menu-title[aria-expanded=true]+.bx--header__menu a.bx--header__menu-item:hover,:host(bx-side-nav) .bx--header__menu-title[aria-expanded=true]+.bx--header__menu a.bx--header__menu-item:hover{background-color:#e5e5e5;color:#161616}.bx--side-nav .bx--header__menu a.bx--header__menu-item,:host(bx-side-nav) .bx--header__menu a.bx--header__menu-item{height:inherit}.bx--side-nav .bx--header__menu-arrow,.bx--side-nav a.bx--header__menu-item:focus .bx--header__menu-arrow,.bx--side-nav a.bx--header__menu-item:hover .bx--header__menu-arrow,:host(bx-side-nav) .bx--header__menu-arrow,:host(bx-side-nav) a.bx--header__menu-item:focus .bx--header__menu-arrow,:host(bx-side-nav) a.bx--header__menu-item:hover .bx--header__menu-arrow{fill:#525252}:host(bx-side-nav){top:0}:host(bx-side-nav[collapse-mode=fixed]){width:16rem}:host(bx-side-nav[collapse-mode=rail]){width:3rem}:host(bx-side-nav[collapse-mode=rail]:hover){width:16rem}:host(bx-side-nav[collapse-mode][usage-mode=header-nav]),:host(bx-side-nav[usage-mode=header-nav]){width:0}@media (max-width:65.98rem){:host(bx-side-nav[collapse-mode][expanded][usage-mode=header-nav]),:host(bx-side-nav[expanded][usage-mode=header-nav]){width:16rem}}:host(bx-side-nav-link){display:block;outline:0;width:auto;height:auto}:host(bx-side-nav-link) .bx--side-nav__icon[hidden]{display:none}:host(bx-side-nav-menu){display:block;outline:0;width:auto;height:auto}:host(bx-side-nav-menu) .bx--side-nav__icon[hidden]{display:none}:host(bx-side-nav-menu[active]){background-color:#e5e5e5;color:#161616;position:relative}:host(bx-side-nav-menu[active])::before{content:'';position:absolute;top:0;bottom:0;right:0;width:4px;background-color:#0f62fe}:host(bx-side-nav-menu[active][expanded]){background-color:inherit;color:inherit;position:inherit}:host(bx-side-nav-menu[active][expanded])::before{content:none}:host(bx-side-nav-menu-item){display:block;outline:0;width:auto;height:auto}:host(bx-side-nav-menu-item) a.bx--side-nav__link[role=menuitem]{height:2rem;min-height:2rem;padding-right:2rem;font-weight:400}:host(bx-side-nav-menu-item[parent-has-icon]) a.bx--side-nav__link[role=menuitem]{padding-right:4.5rem}:host(bx-side-nav-item) .bx--side-nav__link:hover,:host(bx-side-nav-menu) .bx--side-nav__submenu:hover,:host(bx-side-nav-menu-item) .bx--side-nav__link:hover{background-color:#e5e5e5;color:#161616}",
]);