
._block_ee0xb_2,
._inline_ee0xb_3 {
&:not([href]) {
      opacity: .5;
}
}

/* Block (Edit in conjunction with `Button.vue`) */
._block_ee0xb_2 {
    /**
    * ====================================================
    * Color transitions
    * ====================================================
    */

    transition: background-color .3s;
&:hover, &:focus-visible {
        transition: none;
}
&:is([aria-pressed=true], [aria-expanded=true], [aria-selected=true], [aria-checked=true]):hover:not(:active){
            transition: background-color .3s;
}
&:not(:hover):not([ui-no-underline]) {
      text-decoration-color: color-mix(in oklab, transparent 50%, currentcolor)
}

  /**
  * ====================================================
  * Layout
  * ====================================================
  */

  position: relative;
  font-size: 14px;
  gap: 8px;

  /* Badge placement */
  --badge-inset: -3px -3px auto auto;
&[ui-block-size='40'] {
  padding: 0 12px;
  --badge-inset: -4px -4px auto auto;
}
&[ui-block-size='24'] {
  padding: 0 4px;
  --badge-inset: -10px -10px auto auto;
}
&.shape-circle {
    --badge-inset: -4px -4px auto auto;
&[ui-block-size='40'] {
    padding: 0 4px;
    --badge-inset: -5px -5px auto auto;
}
&[ui-block-size='24'] {
    padding: 0 4px;
    --badge-inset: -9px -9px auto auto;
}
}
  /**

  * ====================================================
  * Interactivity
  * ====================================================
  */

  /* Add transparent hit area at least 44px squared to satisfy WCAG2 target size requirement AAA: */
&::after {
    content: '';
    position: absolute;

    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    width: max(48px, 100%);
    height: max(48px, 100%);
}
}
._block_ee0xb_2[ui-no-underline] {
  text-decoration: none;
}

/* Inline */
._inline_ee0xb_3 {
  display: inline;
  border-radius: 2px;
  transition: color 0.1s, background-color 0.1s;
&:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}
}
