.btn-fill{--fill-bg: var(--button-bg-primary-idle);--fill-label: var(--button-label-secondary-idle);--fill-label-hover: var(--button-label-primary-idle);--fill-border: var(--button-bg-primary-idle);--fill-translate-x: 0%;--fill-translate-y: 100%;position:relative;border:.0625rem solid var(--fill-border);background-color:rgba(0,0,0,0) !important;color:var(--fill-label);transition:color .3s ease-in-out,border-color .3s ease-in-out;overflow:hidden}.btn-fill .text{position:relative;z-index:1}.btn-fill::before{content:"";position:absolute;z-index:-1;background-color:var(--fill-bg);transform:translate(var(--fill-translate-x), var(--fill-translate-y));transition:transform .35s ease-in-out;inset:0}.btn-fill:hover,.btn-fill:focus-visible{color:var(--fill-label-hover)}.btn-fill:hover::before,.btn-fill:focus-visible::before{transform:translate(0%, 0%)}.btn-fill.is-fill-top{--fill-translate-x: 0%;--fill-translate-y: -100%}.btn-fill.is-fill-left{--fill-translate-x: -100%;--fill-translate-y: 0%}.btn-fill.is-fill-right{--fill-translate-x: 100%;--fill-translate-y: 0%}.btn--secondary{--fill-bg: var(--button-bg-secondary-hover);--fill-label: var(--button-label-secondary-idle);--fill-label-hover: var(--button-label-primary-idle);--fill-border: var(--button-border-secondary-idle)}