:where(.fs-block-button){--gap:0.6em;--multiplier:1;--icon-width:1.2em;--border-width:1.5px;--transition-duration:0.3s;--foreground-color:currentcolor;--background-color:transparent;--background-color-darker:lch(from var(--background-color) calc(l - 10) c h);&.is-style-fill{--foreground-color:var(--fs-blocks-color-white);--background-color:var(--fs-blocks-color-primary)}&.is-style-underline{--foreground-color:currentcolor;--background-color:var(--fs-blocks-color-primary)}&.is-style-outline{--foreground-color:currentcolor;--background-color:var(--foreground-color)}&.is-style-blank,&.is-style-muted{--foreground-color:currentcolor}}.wp-element-button{align-items:center;border-radius:var(--fs-blocks-radius);display:inline-flex;gap:var(--gap);justify-content:center;position:relative;text-align:center;transition-duration:var(--transition-duration);transition-property:transform,border-color,background-color,box-shadow,opacity,color;vertical-align:baseline;&:has(.fs-block-icon+.fs-block-button__text){--multiplier:-1}&.is-icon{flex-shrink:0;height:var(--fs-blocks-input-height);padding-inline:0;width:var(--fs-blocks-input-height);>.fs-icon{stroke-width:1.5px;--fs-nav-dropdown-toggle-icon-size:1.5em;--fs-size:1.5em}}&.is-style-blank,&.is-style-underline{&.is-icon{height:2em;width:2em}}&.is-style-fill{background:var(--background-color);color:var(--foreground-color)}&.is-style-blank{background:transparent;border-color:transparent;box-shadow:none;color:var(--foreground-color,currentcolor);&:not([disabled]):hover{opacity:.7}}&.is-style-outline{background:transparent;border-color:var(--background-color,var(--foreground-color,currentcolor));border-width:1px;box-shadow:none;color:var(--foreground-color,currentcolor);&.is-white{border-color:rgba(0,0,0,.05);color:currentcolor;&:not([disabled]):hover{border-color:var(--background-color-darker)}}&:not([disabled]):hover{opacity:.7}}&.is-style-underline{background:transparent;border-color:transparent;color:var(--foreground-color,currentcolor);&:before{background:var(--background-color,var(--foreground-color,currentcolor));bottom:0;content:"";height:var(--border-width);left:20%;opacity:.3;position:absolute;transition-duration:var(--transition-duration);transition-property:left,width,opacity;width:60%}&:not([disabled]):hover{opacity:.7;&:before{left:0;opacity:1;width:100%}}}&.is-style-muted{background:transparent;border-color:transparent;color:var(--foreground-color,currentcolor);position:relative;&:after{background-color:var(--foreground-color,currentcolor);border-radius:inherit;content:"";inset:0;opacity:.05;pointer-events:none;position:absolute}&:not([disabled]):hover:after{opacity:.1}}&:not([disabled]):not(.is-style-blank,.is-style-outline,.is-style-underline,.is-style-muted):hover{background-color:var(--background-color-darker);border-color:var(--background-color-darker);color:var(--foreground-color)}&.hover-reveal-icon{.fs-block-button__text{transform:translateX(calc(var(--multiplier) * calc(calc(var(--icon-width) / 2) + calc(var(--gap) / 2))));transition:transform var(--transition-duration)}.fs-block-icon{opacity:0;scale:.9;transition:opacity var(--transition-duration),scale var(--transition-duration)}&:not([disabled]):hover{.fs-block-button__text{transform:none}.fs-block-icon{opacity:1;scale:1}}}}.fs-block-button.is-expanded{display:flex;width:100%}:where(.fs-block-button).is-expanded{margin-inline:0}:where(.fs-flex)>.fs-block-button.is-expanded{align-self:stretch;width:auto}.wp-element-button.fs-block-button:not(.is-style-blank,.is-style-outline,.is-style-underline,.is-style-muted){color:var(--foreground-color)}.fs-block-button:where(:not(.is-expanded,.fs-block-popover,:last-child,:only-child)){margin-inline-end:var(--fs-blocks-spacing-sm)}.fs-block-button__text{flex:1;position:relative}
