/* The Welcome page's Recent Updates list and its one-line license note.
   The list comes from _recent-updates.qmd, which the changelog renderer writes:
   up to three highlights from the last 30 days, each a category mark, a title
   linked to its chapter, the category, and a short date. Inks and marks match
   the Changelog page (styles/changelog-v3.css): a filled or hollow mark tells
   apart two categories that share an ink. Identical in all four handbooks.
   Stylesheets are cached as immutable on three of the sites, so change this
   by adding a -v3 file, not by editing it. */

.recent-updates {
  --ru-ink: #1a1a1a;
  --ru-muted: #5b5b59;
  --ru-green: #28523c;
  --ru-prussian: #233662;
  --ru-mulberry: #99415e;
  --ru-ochre: #916a18;
  --ru-graphite: #787571;
  margin: 0.25rem 0 2rem;
}

.quarto-dark .recent-updates,
[data-bs-theme="dark"] .recent-updates {
  --ru-ink: #f1f0ec;
  --ru-muted: #a9a8a2;
  --ru-green: #86c29e;
  --ru-prussian: #a3b5e3;
  --ru-mulberry: #dd97b0;
  --ru-ochre: #d6a84f;
  --ru-graphite: #aeaaa4;
}

.recent-updates ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.recent-updates li {
  display: grid;
  grid-template-columns: 0.7rem minmax(0, 1fr) auto auto;
  column-gap: 0.9rem;
  align-items: baseline;
  margin: 0;
  padding: 0.42rem 0;
}

/* A long title wraps under itself rather than being cut short; the mark,
   category, and date keep to its first line. */
.recent-updates .ru-mark {
  display: inline-block;
  box-sizing: border-box;
  align-self: start;
  margin-top: 0.42rem;
  width: 0.7rem;
  height: 0.7rem;
  border: 2px solid var(--ru-c, var(--ru-muted));
  border-radius: 50%;
  background: var(--ru-c, var(--ru-muted));
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

.recent-updates .ru-mark-milestone { --ru-c: var(--ru-ochre); }
.recent-updates .ru-mark-evidence,
.recent-updates .ru-mark-content { --ru-c: var(--ru-green); }
.recent-updates .ru-mark-policy,
.recent-updates .ru-mark-developments { --ru-c: var(--ru-prussian); }
.recent-updates .ru-mark-accuracy,
.recent-updates .ru-mark-revision { --ru-c: var(--ru-mulberry); }
.recent-updates .ru-mark-design,
.recent-updates .ru-mark-maintenance { --ru-c: var(--ru-graphite); }

.recent-updates .ru-mark-content,
.recent-updates .ru-mark-developments,
.recent-updates .ru-mark-revision,
.recent-updates .ru-mark-maintenance { background: transparent; }

.recent-updates .ru-mark-milestone {
  justify-self: center;
  width: 0.56rem;
  height: 0.56rem;
  margin-top: 0.5rem;
  border-radius: 1px;
  transform: rotate(45deg);
}

.recent-updates li > a {
  color: var(--ru-ink);
  line-height: 1.5;
  text-decoration: none;
  text-wrap: pretty;
}

.recent-updates li > a:hover,
.recent-updates li > a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 1px;
}

.recent-updates .ru-cat,
.recent-updates .ru-date {
  color: var(--ru-muted);
  font-size: 0.88rem;
  white-space: nowrap;
}

.recent-updates .ru-date {
  min-width: 3.1rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* With no highlight in the last 30 days the renderer writes one sentence. */
.recent-updates > p:not(:last-child) {
  color: var(--ru-muted);
  margin: 0;
  padding: 0.42rem 0;
}

.recent-updates .ru-all {
  display: inline-block;
  margin: 0.55rem 0 0 1.6rem;
  color: var(--ru-muted);
  font-size: 0.95rem;
  text-decoration: none;
}

.recent-updates .ru-all:hover,
.recent-updates .ru-all:focus-visible {
  color: var(--ru-ink);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 1px;
}

/* One line of license and citation at the foot of the Welcome page. */
.home-license {
  margin: 2.5rem 0 0.5rem;
  color: #5b6b7f;
  font-size: 0.9rem;
}

.quarto-dark .home-license,
[data-bs-theme="dark"] .home-license {
  color: #9aa7b6;
}

@media (max-width: 575.98px) {
  .recent-updates li {
    grid-template-columns: 0.7rem minmax(0, 1fr) auto;
    row-gap: 0.1rem;
    padding: 0.5rem 0;
  }

  .recent-updates .ru-mark {
    grid-row: 1;
  }

  .recent-updates li > a {
    grid-column: 2 / -1;
  }

  .recent-updates .ru-cat {
    grid-column: 2;
  }

  .recent-updates .ru-all {
    margin-left: 1.6rem;
  }
}

@media (forced-colors: active) {
  .recent-updates .ru-mark {
    forced-color-adjust: none;
    border-color: CanvasText;
    background: CanvasText;
  }

  .recent-updates .ru-mark-content,
  .recent-updates .ru-mark-developments,
  .recent-updates .ru-mark-revision,
  .recent-updates .ru-mark-maintenance { background: Canvas; }
}