@import "https://fonts.googleapis.com/css2?family=Roboto&display=swap";:root{--bg-color:#222429;--primary-bg-color:#333740;--primary-color:#2c62f6;--text-color:#b1b8ca;--text-active:#fff;--button-hover-bg-color:#2b2e34;--border-color:#494d59;--list-opacity:0;--translate-value:0;--rotate-arrow:0;--dropdown-height:0;--border-radius:1.4rem;--list-button-height:4.6rem;--floating-icon-size:26;--floating-icon-top:0;--floating-icon-left:0;--transition-time:.4s;--transition-timing:cubic-bezier(.25,.46,.45,.94)}html{font-size:62.5%}html,body{height:100%}body{background-color:var(--bg-color);flex-direction:column;align-items:center;padding:1.5rem;line-height:1.4;display:flex}button{cursor:pointer;background-color:rgba(0,0,0,0);border:none;outline:none}svg{width:1.6rem;height:1.6rem}.text-truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dropdown-container{width:100%;max-width:34rem;flex-direction:column;margin-top:30vh;display:flex}.dropdown-title-icon,.dropdown-arrow{display:inline-flex}.dropdown-title{text-transform:capitalize;margin:0 auto 0 1.8rem}.dropdown-button{align-items:center;padding:0 1.8rem;font-family:Roboto,sans-serif;font-size:1.7rem;font-weight:400;display:flex}.dropdown-button svg{fill:var(--text-color);transition:all var(--transition-time)var(--transition-timing)}.dropdown-button svg,.dropdown-button span{pointer-events:none}.dropdown-button:hover,.dropdown-button:focus{color:var(--text-active)}.dropdown-button:hover svg,.dropdown-button:focus svg{fill:var(--text-active)}.main-button{min-width:180px;height:5.2rem;border:.1rem solid var(--border-color);border-radius:var(--border-radius);color:var(--text-color);background-color:var(--primary-bg-color);transition:all var(--transition-time)var(--transition-timing)}.main-button:focus{border:.1rem solid var(--primary-color);box-shadow:0 0 0 .2rem rgba(44,98,246,.4)}.main-button .dropdown-arrow{transform:rotate(var(--rotate-arrow));transition:transform var(--transition-time)var(--transition-timing);margin-left:1.8rem}.list-button{height:var(--list-button-height);cursor:none;color:var(--text-color);transition:color var(--transition-time)var(--transition-timing);overflow:hidden}.dropdown-list-container{max-height:var(--dropdown-height);transition:max-height var(--transition-time)var(--transition-timing);overflow:hidden}.dropdown-list-wrapper{border:.1rem solid var(--border-color);border-radius:var(--border-radius);background-color:var(--primary-bg-color);margin-top:1rem;padding:1rem;position:relative}ul.dropdown-list{list-style-type:none;position:relative}ul.dropdown-list:before{content:"";transform:translateY(var(--translate-value));z-index:0;height:var(--list-button-height);border-radius:var(--border-radius);background-color:var(--button-hover-bg-color);opacity:0;pointer-events:none;transition:all var(--transition-time)linear;position:absolute;top:0;left:0;right:0}ul.dropdown-list:hover:before,ul.dropdown-list:hover~.floating-icon{opacity:1}li.dropdown-list-item{z-index:1;opacity:var(--list-opacity);transition:opacity .8s var(--transition-timing);flex-direction:column;display:flex;position:relative}.floating-icon{top:var(--floating-icon-top);left:var(--floating-icon-left);z-index:2;width:calc(var(--floating-icon-size)*1px);height:calc(var(--floating-icon-size)*1px);pointer-events:none;background-color:var(--border-color);opacity:0;transition:opacity var(--transition-time)var(--transition-timing);border-radius:1rem;justify-content:center;align-items:center;display:inline-flex;position:absolute}.floating-icon svg{fill:var(--text-active)}
/*# sourceMappingURL=dropdown-menu-page.4306c54c.css.map */