
._token_anofi_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;
}

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

  position: relative;

  gap: 8px;
  padding: 0px 10px 0 10px;

  /* Badge placement */

  --badge-inset: -10px -10px auto auto;

  /**
  * ====================================================
  * Interactivity
  * ====================================================
  */
&:not(:is([href], [onClick])) {
      /* Remove hit-area from non-interactive token but re-enable any interactive element inside slot */
      pointer-events: none;
> * {
          pointer-events: auto;
}
}
&[href]:not(:is(:hover, :focus)){
      text-decoration-color: transparent;
}

  /* 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%);
}

/**
* ====================================================
* Slots
* ====================================================
*/
> ._image_anofi_71 {
  position: relative;
  margin: 0px -4px 0px -10px;
  border-radius: inherit;
  overflow: hidden;
  height: 100%;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
> img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}
}
> ._action_anofi_88 {
  position: relative;
  margin: 0px -10px 0px -4px;
  border-radius: inherit;
  flex-shrink: 0;
}
}
/* Lists of Tokens in a row overlap each other */
span:has(._token_anofi_2+._token_anofi_2) {
  display: flex;
>._token_anofi_2+._token_anofi_2:not(:focus-visible):not(:focus-within) {
      -webkit-mask: radial-gradient(15px circle at -8px center, #0000 99.5%, #000 100%);
              mask: radial-gradient(15px circle at -8px center, #0000 99.5%, #000 100%);
}
>._token_anofi_2+._token_anofi_2:not(:focus-visible):not(:focus-within):dir(rtl) {
      -webkit-mask: radial-gradient(15px circle at calc(100% + 8px) center, #0000 99.5%, #000 100%);
              mask: radial-gradient(15px circle at calc(100% + 8px) center, #0000 99.5%, #000 100%);
}
}
[ui-raised][ui-sunken] {
    background-color: var(--color-background-500);
    color: var(--color-foreground-50);
}
