:root{--motion-btn-hover-bg:var(--orange);--motion-btn-transition-duration:.1s}.motion-button{cursor:pointer;background-color:#0000;border:none;padding:10px 20px;position:relative;overflow:hidden}.motion-button:before{content:"";background-color:var(--motion-btn-hover-bg);z-index:0;width:0;position:absolute;inset:0}.motion-button__content{z-index:1;transition:all .5s ease-in-out;position:absolute;inset:0}.motion-button--active:before{animation:.35s ease-in-out forwards bg-motion-slide-in}.motion-button--leaving:before{animation:.35s ease-out forwards bg-motion-slide-out}@keyframes bg-motion-slide-in{0%{width:0%;transform:translate(0)}to{width:100%;transform:translate(0)}}@keyframes bg-motion-slide-out{0%{width:100%;transform:translate(0%)}to{width:100%;transform:translate(101%)}}