@layer components{.c-toggle-button{margin:0;--icon-size:1.1em;--toggle-size:50px;--toggle-bg:var(--brand-charcoal);--toggle-bg-active:#fff;--icon-color:#fff;--icon-color-active:var(--brand-charcoal);align-items:center;background:var(--toggle-bg,var(--brand-charcoal));border-radius:50%;display:flex;height:var(--toggle-size,54px);inset:var(--toggle-inset);justify-content:center;position:relative;transition:all .25s ease;width:var(--toggle-size,54px);z-index:200}.c-toggle-button__content{transition:all .25s ease-in-out}.c-toggle-button:focus,.c-toggle-button:hover{background:var(--toggle-bg-active,#fff)}.c-toggle-button__icon{color:var(--icon-color)}.c-toggle-button:focus .c-toggle-button__icon,.c-toggle-button:hover .c-toggle-button__icon{color:var(--icon-color-active)}.c-toggle-button__tray{opacity:0;pointer-events:none;position:absolute;transform-origin:bottom right;transition:all .25s ease;visibility:hidden;z-index:100}.c-toggle-button__icon{height:var(--icon-size)}.c-toggle-button__line{transform-origin:center;transition:all .25s ease}.is-active-tooltip .c-toggle-button__line--y{transform:rotate(90deg)}@media only screen and (max-width:800px){.c-toggle-button{--icon-size:0.75em;--toggle-size:40px}}}