/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Mentions render inline like text (pattern from basecamp/fizzy).
   The action-text-attachment element itself is the pill; its content is bare
   inline markup from users/_user and admins/_admin (Tailwind).
   Editor-specific overrides live in lexxy_overrides.css. */
action-text-attachment[content-type^="application/vnd.actiontext"] {
  --mention-bg-color: transparent;

  align-items: center;
  background: var(--mention-bg-color);
  border-radius: 99rem;
  box-shadow:
    -0.25ch 0 0 var(--mention-bg-color),
    0.5ch 0 0 var(--mention-bg-color);
  color: var(--color-primary-700);
  display: inline-flex;
  gap: 0.25rem;
  margin: 0;
  padding: 0;
  position: relative;
  vertical-align: baseline;
  white-space: normal;
}

action-text-attachment[content-type="application/vnd.actiontext.mention"].node--selected {
  --mention-bg-color: rgb(219 234 254);
}