/*hashtag style by slashine 071320*/
.mention.hashtag{
background-color: #93AEFD36;
padding: 0px 4px;
text-align: center;
text-decoration: none;
display: inline-block;
border-style: dashed;
border-color: #93AEFD;
border-width: 0.5px;
border-radius: 2px;
margin-top: 2px;
margin-bottom: 2px;
}

/* emoji enlarge */
.reply-indicator__content .emojione,
.status__content .emojione,
.announcements__item__content .emojione {
  width: 50px !important;
  height: 50px !important;
  margin: 2px !important;
}

.emoji-mart-category .emoji-mart-emoji:hover span,
.emoji-mart-category .emoji-mart-emoji-custom:hover img {
  width: 40px !important;
  height: 40px !important;
}

.emoji-mart-category .emoji-mart-emoji:hover {
  margin: 0 -12px;
}

/*variable width*/
div.column {
    -webkit-box-flex:1;
    -ms-flex-positive:1;
    flex-grow:1
}

/*
 * Avatar Cat for Mastodon 4.7.x
 */

:root {
  --cat-ear-color: var(--color-text-secondary);
  --cat-ear-fill: var(--color-bg-primary);
}


/* ---------- targets ---------- */

:is(
  .status__avatar,
  .detailed-status__display-avatar,
  .navigation-bar .account__avatar,
  ._comp_account_header__avatar.account__avatar
) {
  --cat-top: -6px;
  --cat-size: 50%;
  --cat-stroke: 4px;
  --cat-right: 0;

  position: relative;
  overflow: visible !important;
  isolation: isolate;
}

/* boost / reblog */
.status__avatar:has(> .account__avatar-overlay) {
  --cat-top: -4px;
  --cat-size: 18px;
  --cat-stroke: 3px;
  --cat-right: 12px;
}

/* quote */
.status--is-quote .status__avatar {
  --cat-top: -4px;
  --cat-stroke: 3px;
}

/* profile header */
._comp_account_header__avatar.account__avatar {
  --cat-top: -10px;
  --cat-stroke: 6px;
}


/* ---------- unclipping ---------- */

.navigation-bar .account__display-name,
.navigation-bar .account__avatar-wrapper,
._comp_account_header__avatarWrapper,
.status__info .status__display-name,
.detailed-status__display-name {
  overflow: visible !important;
}


/* ---------- ears ---------- */

:is(
  .status__avatar,
  .detailed-status__display-avatar,
  .navigation-bar .account__avatar,
  ._comp_account_header__avatar.account__avatar
)::before,
:is(
  .status__avatar,
  .detailed-status__display-avatar,
  .navigation-bar .account__avatar,
  ._comp_account_header__avatar.account__avatar
)::after {
  content: "";
  position: absolute;
  top: var(--cat-top);
  width: var(--cat-size);
  height: var(--cat-size);
  box-sizing: border-box;
  border: var(--cat-stroke) solid var(--cat-ear-color);
  background: var(--cat-ear-fill);
  z-index: 0;
  pointer-events: none;
  transform-origin: center;
}

:is(
  .status__avatar,
  .detailed-status__display-avatar,
  .navigation-bar .account__avatar,
  ._comp_account_header__avatar.account__avatar
)::before {
  right: var(--cat-right);
  border-radius: 75% 0 75% 75%;
  transform: rotate(-37.6deg) skew(-30deg);
}

:is(
  .status__avatar,
  .detailed-status__display-avatar,
  .navigation-bar .account__avatar,
  ._comp_account_header__avatar.account__avatar
)::after {
  left: 0;
  border-radius: 0 75% 75%;
  transform: rotate(37.6deg) skew(30deg);
}


/* ---------- avatar above ears ---------- */

.status__avatar .account__avatar,
.detailed-status__display-avatar .account__avatar,
.navigation-bar .account__avatar > img,
._comp_account_header__avatar.account__avatar > img {
  position: relative;
  z-index: 1;
}


/* keep long names clipped */
.status__info .status__display-name > .display-name,
.detailed-status__display-name > .display-name {
  min-width: 0;
  overflow: hidden;
}


/* no ears in notifications */
:is(
  .notification,
  .notification-group,
  .notification-ungrouped
) .status__avatar::before,
:is(
  .notification,
  .notification-group,
  .notification-ungrouped
) .status__avatar::after {
  content: none !important;
}


/* ---------- wiggle ---------- */

:is(
  .status__avatar,
  .detailed-status__display-avatar,
  .navigation-bar .account__avatar,
  ._comp_account_header__avatar.account__avatar
):hover::before {
  animation: earwiggleright 1s infinite;
}

:is(
  .status__avatar,
  .detailed-status__display-avatar,
  .navigation-bar .account__avatar,
  ._comp_account_header__avatar.account__avatar
):hover::after {
  animation: earwiggleleft 1s infinite;
}

@keyframes earwiggleleft {
  from, to { transform: rotate(37.6deg) skew(30deg); }
  25%      { transform: rotate(10deg) skew(30deg); }
  50%      { transform: rotate(20deg) skew(30deg); }
  75%      { transform: rotate(0deg) skew(30deg); }
}

@keyframes earwiggleright {
  from, to { transform: rotate(-37.6deg) skew(-30deg); }
  30%      { transform: rotate(-10deg) skew(-30deg); }
  55%      { transform: rotate(-20deg) skew(-30deg); }
  75%      { transform: rotate(0deg) skew(-30deg); }
}

@media (prefers-reduced-motion: reduce) {
  :is(
    .status__avatar,
    .detailed-status__display-avatar,
    .navigation-bar .account__avatar,
    ._comp_account_header__avatar.account__avatar
  ):hover::before,
  :is(
    .status__avatar,
    .detailed-status__display-avatar,
    .navigation-bar .account__avatar,
    ._comp_account_header__avatar.account__avatar
  ):hover::after {
    animation: none;
  }
}