/* Rendered rich text
   ------------------------------------------------------------------------ */

/* Inherit the surrounding colour rather than Lexxy's ink, so Tailwind colour
   utilities on the wrapper keep working. */
.lexxy-content {
  color: inherit;
}

/* Blank lines are content here, written by Trix and kept by TrixMarkup, so
   margins on top of them would respace a re-saved body. */
.lexxy-content :is(p, ul, ol, dl, blockquote) {
  margin-block: 0;
}

/* Trix wrote blocks as divs, which Lexxy's `text-wrap: pretty` never matched.
   Keep it off so a re-saved body wraps the way it did before. Scoped tightly
   to outweigh the gem's nested :is(). */
.text-justify .lexxy-content :is(p, ul, ol, dl, blockquote) {
  text-wrap: wrap;
}

/* A list item is narrower than the column, and these documents carry long
   unbreakable tokens like WWW.P65WARNINGS.CA.GOV, so justifying one stretches
   a line's spaces to 26px where a paragraph stays at 6px. */
.text-justify .lexxy-content li {
  text-align: left;
}

/* One bordered chip for a file download, rather than nesting attachment and
   link chrome. */
.lexxy-content .attachment--file {
  margin: 12px 0;
  padding: 0;
  border: 0;
  border-radius: 0;
}

.lexxy-content .attachment--file .attachment__link {
  display: inline-block;
  padding: 0.5em 0.875em;
  border: 1px solid rgb(229 231 235);
  border-radius: 0.375rem;
  background-color: rgb(249 250 251);
  color: rgb(55 65 81);
  text-decoration: none;
  transition: border-color 0.15s, background-color 0.15s, color 0.15s;
}

.lexxy-content .attachment--file .attachment__link:hover {
  border-color: rgb(37 99 235);
  background-color: rgb(239 246 255);
  color: rgb(37 99 235);
}

.lexxy-content .attachment--file .attachment__name {
  font-weight: 500;
}

.lexxy-content .attachment--file .attachment__size {
  font-size: 0.85em;
  color: rgb(107 114 128);
}

/* Avo only: the editor and its show view
   ------------------------------------------------------------------------ */

/* Lexxy hides whatever does not fit behind a "..." menu, deciding by
   scrollWidth against clientWidth. Wrapping leaves nothing to hide. */
lexxy-toolbar {
  flex-wrap: wrap;
}

/* This app does not publish tables, and Lexxy has no config for dropping a
   single button. */
lexxy-toolbar button[name="table"] {
  display: none;
}

/* Avo collapses long content with `hidden`, which Tailwind turns into
   display:none. Clip to a faded preview, as Avo's own trix rule does. */
.lexxy-content.hidden {
  display: block !important;
  overflow: hidden;
  clip-path: inset(0 0 calc(100% - 50px) 0);
  mask-image: linear-gradient(to bottom, black 30px, transparent 50px);
  max-height: 50px;
  min-height: 0;
}
