/**
 * EditorBadge — Unified badge overlay styles (editor only)
 *
 * ::before (left) = animation + responsive labels
 * ::after (right) = trigger label (orange)
 * Outline on all badged blocks for visual boundary.
 */

/* ── Outline on blocks with any badge ──────────────────────────── */

.block-editor-block-list__block.has-brandy-editor-badge[data-brandy-trigger] {
  outline: 1px dashed #ff8c0065;
}

.block-editor-block-list__block.has-brandy-editor-badge[data-brandy-badge] {
  outline: 1px dashed rgba(0, 0, 0, 0.2);
}

/* ── Left badge: animation + responsive (::before) ─────────────── */

*[data-brandy-badge]::before {
  content: attr(data-brandy-badge);
  display: block;
  position: absolute;
  top: -10px;
  left: 4px;
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
  font-size: 11px;
  line-height: normal;
  padding: 0 4px;
  border-radius: 3px;
  pointer-events: none;
  z-index: 10;
  white-space: nowrap;
}

.has-hover-image-zoom[data-brandy-badge]::before {
  top: 0;
}

/* ── Right badge: trigger (::after) ────────────────────────────── */

*[data-brandy-trigger]:not(.is-highlighted, .is-selected, .is-hovered)::after {
  content: attr(data-brandy-trigger);
  display: block;
  position: absolute;
  top: -10px;
  right: 4px;
  background: #d67b09;
  color: #fff;
  font-size: 11px;
  line-height: normal;
  padding: 0 4px;
  border-radius: 3px;
  pointer-events: none;
  z-index: 10;
  white-space: nowrap;
}