.btn{position:relative;display:inline-grid;grid-template-columns:3rem minmax(0,1fr);align-items:center;width:12rem;max-width:100%;min-height:3.3rem;padding:.15rem;border:none;font:inherit;font-size:.9rem;background:rgba(242,237,230,.85);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;margin:1rem 0;direction:rtl;transform-origin:center}.btn,.btn .circle{border-radius:4rem}.btn .circle{position:absolute;inset-block:.15rem;inset-inline-start:.15rem;width:3rem;background:var(--base-450);transition:width .5s cubic-bezier(.65,0,.076,1)}.btn .icon{position:relative;display:flex;justify-content:center;color:var(--base-100);font-size:1.5rem;transform:scaleX(-1);transition:transform .5s cubic-bezier(.65,0,.076,1)}.btn .button-text{position:relative;display:block;padding:.65rem .5rem;text-align:center;color:var(--base-500);font-weight:600;line-height:1.3;overflow-wrap:anywhere;transition:color .5s}.btn .br-button-line{position:relative;will-change:transform}.btn:focus-visible .circle,.btn:hover .circle{width:calc(100% - .3rem)}.btn:hover .icon{transform:translateX(-.35rem) scaleX(-1)}.btn:focus-visible .button-text,.btn:hover .button-text{color:var(--base-100)}