@use "../../settings";

/*
Inline

The inline module.

Weight: -98

Style guide: #{settings.$prefix}-button.inline
*/

/*
Modifiers

The inline modifiers.

Weight: -100

Markup: <!-- with anchor element -->
<a class="#{settings.$prefix}-button  #{settings.$prefix}-button--theme-normal  {{modifier_class}}" href="#">
  <span class="#{settings.$prefix}-button__label  #{settings.$prefix}-text">Lorem ipsum dolor sit amet.</span>
</a>
<!-- with button element -->
<button class="#{settings.$prefix}-button  #{settings.$prefix}-button--theme-normal  {{modifier_class}}">
  <span class="#{settings.$prefix}-button__label  #{settings.$prefix}-text">あのイーハトーヴォのすきとおった風。</span>
</button>

#{settings.$prefix}-button--inline-true - Enable inline

Style guide: #{settings.$prefix}-button.inline.builtin
*/
.#{settings.$prefix}-button--inline {
  &-true {
    --display: inline-block;
    --width: auto;
    --vertical-align: middle;
  }
}