/* --- MyReactions: rechts ausrichten --- */
.myreactions-container{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
  width:100%;
  margin-right:20px;
}

/* vom Plugin eingefügte clear:both-DIVs verstecken */
.myreactions-container > [style*="clear:both"]{
  display:none !important;
}

/* Chips (Reaktionen + Add-Button) */
.myreactions-container .myreactions-reaction,
.myreactions-container .reaction-add,
.myreactions-container .reaction-add.reaction-add-force{
    float: none !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    font-size: inherit;
    line-height: 1;
    /* border-radius: 9999px; */
    margin-bottom: 12px;
    margin-top: -9px;
}

/* Emoji-Größe */
.myreactions-container .myreactions-reaction img{
  width:22px;
  height:22px;
  display:block;
}

/* Infozeile unter den Reaktionen rechtsbündig */
.myreactions-container .myreactions-reacted{
  flex:1 0 100%;
  text-align:right;
  margin-top:6px;
  font-size:inherit;
}

/* Add-Button (auch wenn noch keine Reaktion da ist) */
.myreactions-container .reaction-add,
.myreactions-container .reaction-add.reaction-add-force{
  order:99;                           /* steht immer am Ende rechts */
  background:var(--main) !important;
  color:var(--light) !important;
  border:none !important;
  box-shadow:none !important;
  transform:none !important;
  transition:none !important;
  font-weight:400 !important;         /* nicht fett */
  cursor:pointer;
  user-select:none;
}

/* Hover/Active/Focus gleich lassen */
.myreactions-container .reaction-add:hover,
.myreactions-container .reaction-add:active,
.myreactions-container .reaction-add:focus{
  background:var(--main) !important;
  color:var(--light) !important;
  border:none !important;
  box-shadow:none !important;
  transform:none !important;
  outline:none !important;
}

/* Plus-Icon im Button ausblenden */
.myreactions-container .reaction-add img{
  display:none !important;
}



/* Reactions mittiger zwischen Post und den Buttons platzieren */
.myreactions-container{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
  width:100%;
  margin:14px 20px 14px 0 !important; /* top right bottom left */
}

/* optional: etwas Extra-Abstand vor den Post-Buttons darunter */
.myreactions-container + .post_controls{
  margin-top:6px !important;
}

/* Infozeile leicht näher an die Chips (feintuning) */
.myreactions-container .myreactions-reacted{
  margin-top:8px !important;
}