/* JoyJoy V516 — Shieldy logs scope, emoji preview and reset visual recovery. */

/* Old native log scope selects remain the data source but are not rendered twice. */
#shieldy-channels-form .jj-log-scope-native-v516{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
}
#shieldy-channels-form .jj-log-scope-mode-v516{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:4px;
  width:100%;
  padding:4px;
  border:1px solid var(--account-border,#d0d7de);
  border-radius:12px;
  background:var(--account-surface-soft,#f6f8fa);
}
#shieldy-channels-form .jj-log-scope-mode-v516 button{
  min-width:0;
  min-height:36px;
  padding:6px 8px!important;
  border:0!important;
  border-radius:9px!important;
  background:transparent!important;
  color:var(--account-muted,#667085)!important;
  font:900 11px/1.2 Nunito,sans-serif!important;
  box-shadow:none!important;
  cursor:pointer!important;
  white-space:normal;
}
#shieldy-channels-form .jj-log-scope-mode-v516 button:hover{
  background:color-mix(in srgb,var(--account-accent,#2da44e) 7%,var(--account-surface,#fff))!important;
  color:var(--account-text,#172033)!important;
}
#shieldy-channels-form .jj-log-scope-mode-v516 button.is-active{
  background:var(--account-surface,#fff)!important;
  color:var(--account-accent,#2da44e)!important;
  box-shadow:0 2px 8px rgba(16,24,40,.08)!important;
}
#shieldy-channels-form .jj-log-scope-helper-v516{
  display:block;
  min-height:17px;
  margin:1px 2px 0;
  color:var(--account-muted,#667085);
  font-size:11px;
  font-weight:700;
  line-height:1.35;
}
#shieldy-channels-form .jj-log-scope-all-v516 :is(.jj-channel-picker-v512,.jj-entity-picker-v513){display:none!important}
#shieldy-channels-form .jj-log-scope-filtered-v516 :is(.jj-channel-picker-v512,.jj-entity-picker-v513){display:grid!important}
html[data-theme="dark"] #shieldy-channels-form .jj-log-scope-mode-v516 button.is-active{box-shadow:0 2px 9px rgba(0,0,0,.26)!important}

/* The legacy reaction emoji popover must never coexist with the unified picker. */
#sh-interaction-view-reactions .rr-emoji-picker-card,
#sh-interaction-view-reactions .rr-emoji-picker-trigger{display:none!important}
#sh-interaction-view-reactions .rr-emoji-control{
  min-width:0!important;
  overflow:visible!important;
}
#sh-interaction-view-reactions .rr-emoji-control>.jj-emoji-picker-v514{
  position:relative!important;
  inset:auto!important;
  height:auto!important;
  min-height:52px!important;
}

/* Mini preview: only the banner spans the card. Author icon and thumbnail keep their own sizes. */
#sh-interaction-view-reactions .rr-mini-embed-preview img[hidden],
#sh-interaction-view-reactions #rr-mini-preview-banner[hidden],
#sh-interaction-view-reactions #rr-mini-preview-thumbnail[hidden],
#sh-interaction-view-reactions #rr-mini-preview-author-icon[hidden],
#sh-interaction-view-reactions #rr-preview-banner[hidden],
#sh-interaction-view-reactions #rr-preview-thumbnail[hidden],
#sh-interaction-view-reactions #rr-preview-author-icon[hidden]{display:none!important}

#sh-interaction-view-reactions .rr-mini-embed-preview #rr-mini-preview-banner{
  display:block!important;
  width:calc(100% + 32px)!important;
  max-width:calc(100% + 32px)!important;
  aspect-ratio:2/1!important;
  height:auto!important;
  margin:-15px -16px 12px!important;
  border:0!important;
  border-bottom:1px solid var(--account-border,#d0d7de)!important;
  border-radius:0!important;
  object-fit:cover!important;
  float:none!important;
}
#sh-interaction-view-reactions .rr-mini-embed-preview #rr-mini-preview-thumbnail{
  display:block!important;
  float:right!important;
  width:54px!important;
  height:54px!important;
  max-width:54px!important;
  margin:0 0 8px 10px!important;
  border:0!important;
  border-radius:10px!important;
  object-fit:cover!important;
  aspect-ratio:1!important;
}
#sh-interaction-view-reactions .rr-mini-embed-preview #rr-mini-preview-author-icon{
  display:block!important;
  width:22px!important;
  height:22px!important;
  max-width:22px!important;
  margin:0!important;
  border:0!important;
  border-radius:50%!important;
  object-fit:cover!important;
  aspect-ratio:1!important;
}
#sh-interaction-view-reactions .rr-mini-embed-preview:not(:has(#rr-mini-preview-banner:not([hidden]))){overflow:hidden}

/* Server emojis in both full and mini previews. */
.jj-emoji-preview-image-v516{
  width:22px!important;
  height:22px!important;
  max-width:22px!important;
  min-width:22px!important;
  display:inline-block!important;
  object-fit:contain!important;
  vertical-align:-5px!important;
  margin:0!important;
  border:0!important;
  border-radius:4px!important;
  float:none!important;
  aspect-ratio:1!important;
}
.jj-emoji-preview-text-v516{display:inline-flex;align-items:center;line-height:1}
#sh-interaction-view-reactions :is(.rr-reactions-preview,.rr-mini-reactions-preview) span{
  gap:5px!important;
}
#sh-interaction-view-reactions .rr-preview-button,
.cm510-preview-button{display:inline-flex!important;align-items:center!important;gap:6px!important}

@media(max-width:760px){
  #shieldy-channels-form .jj-log-scope-mode-v516{grid-template-columns:1fr}
  #shieldy-channels-form .jj-log-scope-mode-v516 button{min-height:34px}
}

/* Keep hidden preview media hidden after all legacy image rules. */
#sh-interaction-view-reactions .rr-mini-embed-preview #rr-mini-preview-banner[hidden],
#sh-interaction-view-reactions .rr-mini-embed-preview #rr-mini-preview-thumbnail[hidden],
#sh-interaction-view-reactions .rr-mini-embed-preview #rr-mini-preview-author-icon[hidden],
#sh-interaction-view-reactions #rr-preview-banner[hidden],
#sh-interaction-view-reactions #rr-preview-thumbnail[hidden],
#sh-interaction-view-reactions #rr-preview-author-icon[hidden]{display:none!important}